:root {
    /* Color */
    --c-bg: #0b0a0a;
    --c-bg-2: #121112;
    --c-surface: #171617;
    --c-surface-2: #1e1d1e;
    --c-line: rgba(255, 255, 255, 0.08);
    --c-line-strong: rgba(255, 255, 255, 0.16);
    --c-text: #f2efea;
    --c-text-muted: #a8a29b;
    --c-text-faint: #77716b;
    --c-accent: #ff7f00;
    --c-accent-hi: #ffa24a;
    --c-accent-soft: rgba(255, 127, 0, 0.12);
    --c-accent-glow: rgba(255, 127, 0, 0.35);
    --c-on-accent: #120a02;
    --c-success: #3ddc97;
    --c-danger: #ff5d5d;

    /* Type */
    --f-display: "Bricolage Grotesque", "Inter", system-ui, sans-serif;
    --f-body: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --f-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;

    --fs-xs: 0.8125rem;
    --fs-sm: 0.9375rem;
    --fs-base: 1.0625rem;
    --fs-lg: clamp(1.125rem, 1.05rem + 0.35vw, 1.3125rem);
    --fs-xl: clamp(1.375rem, 1.2rem + 0.8vw, 1.875rem);
    --fs-2xl: clamp(1.875rem, 1.5rem + 1.8vw, 3rem);
    --fs-3xl: clamp(2.5rem, 1.8rem + 3.4vw, 4.75rem);
    --fs-hero: clamp(2.75rem, 1.6rem + 5.6vw, 7rem);

    /* Space (4/8 rhythm) */
    --s-1: 0.25rem;
    --s-2: 0.5rem;
    --s-3: 0.75rem;
    --s-4: 1rem;
    --s-5: 1.5rem;
    --s-6: 2rem;
    --s-7: 3rem;
    --s-8: 4rem;
    --s-9: 6rem;
    --s-section: clamp(4rem, 3rem + 5vw, 8rem);

    /* Shape */
    --r-sm: 8px;
    --r-md: 14px;
    --r-lg: 22px;
    --r-xl: 32px;
    --r-pill: 999px;

    --shadow-1: 0 1px 0 rgba(255, 255, 255, 0.04) inset, 0 10px 30px -12px rgba(0, 0, 0, 0.6);
    --shadow-2: 0 1px 0 rgba(255, 255, 255, 0.06) inset, 0 30px 60px -20px rgba(0, 0, 0, 0.75);

    /* Motion */
    --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
    --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
    --t-fast: 180ms;
    --t-med: 380ms;
    --t-slow: 900ms;

    /* Layout */
    --container: 1240px;
    --gutter: clamp(1.25rem, 0.8rem + 2vw, 2.5rem);
    --header-h: 76px;
}