:root {
  --color-bg: #3d0b18;
  --color-bg-alt: #5a1424;
  --color-bg-lift: #4a1020;
  --color-accent: #ff6b6b;
  --color-accent-hover: #ff8585;
  --color-on-accent: #3d0b18;
  --color-muted: #c4909a;
  --color-muted-soft: rgba(196, 144, 154, 0.84);
  --color-muted-faint: rgba(196, 144, 154, 0.82);
  --color-text: #ffffff;
  --color-text-soft: rgba(255, 255, 255, 0.85);
  --color-text-dim: rgba(255, 255, 255, 0.65);
  --color-text-faint: rgba(255, 255, 255, 0.6);
  --color-border: #5a1424;
  --color-line: rgba(255, 255, 255, 0.12);
  --color-line-strong: rgba(255, 255, 255, 0.15);
  --color-rule: rgba(255, 107, 107, 0.38);
  --color-overlay: rgba(61, 11, 24, 0.6);
  --color-overlay-strong: rgba(61, 11, 24, 0.72);
  --color-preview: rgba(0, 0, 0, 0.88);
  --font-display: "Big Shoulders Display", sans-serif;
  --font-body: "Instrument Sans", system-ui, sans-serif;
  --text-body: 1rem;
  --text-small: 0.875rem;
  --text-meta: 0.75rem;
  --leading-tight: 1;
  --leading-display: 0.98;
  --leading-body: 1.65;
  --tracking-display: 0.04em;
  --tracking-nav: 0.12em;
  --tracking-label: 0.1em;
  --tracking-cta: 0.04em;
  --weight-display: 700;
  --weight-medium: 500;
  --weight-semibold: 600;
  --radius: 0;
  --header-height: 4.75rem;
  --touch-min: 44px;
  --container: 85rem;
  --section-padding-x: clamp(1.25rem, 5vw, 4rem);
  --section-padding-y: clamp(2.25rem, 4.2vw, 4rem);
  --rhythm: clamp(1.5rem, 3vw, 2.5rem);
  --gap-block: clamp(1.15rem, 2.2vw, 1.75rem);
  --motion-fast: 180ms;
  --motion-base: 280ms;
  --motion-slow: 420ms;
  --motion-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --motion-ease-cinematic: cubic-bezier(0.22, 1, 0.36, 1);
  --ease: var(--motion-ease-out);
  --fs-hero-1: clamp(2.75rem, 5.4vw + 1.1rem, 5.75rem);
  --fs-hero-2: clamp(4.5rem, 11vw + 1.4rem, 10.5rem);
  --fs-hero-3: clamp(3.5rem, 8.6vw + 1.2rem, 8.25rem);
  --fs-hero-4: clamp(2.6rem, 5vw + 1rem, 5.25rem);
  --fs-h2: clamp(2.25rem, 4.6vw, 3.75rem);
  --fs-stat: clamp(3.25rem, 7vw, 6.25rem);
  --fs-sub: clamp(1.125rem, 1.8vw, 1.5rem);
  --fs-logo: clamp(1.375rem, 2.2vw, 1.875rem);
  --focus-ring: 2px solid var(--color-accent);

  --ui-space-1: 4px;
  --ui-space-2: 8px;
  --ui-space-3: 12px;
  --ui-space-4: 16px;
  --ui-space-5: 20px;
  --ui-space-6: 24px;
  --ui-space-8: 32px;
  --ui-space-10: 40px;
  --ui-space-12: 48px;
  --ui-space-16: 64px;
  --ui-space-20: 80px;
  --ui-space-24: 96px;
  --ui-radius-sm: 8px;
  --ui-radius-md: 12px;
  --ui-radius-lg: 16px;
  --ui-type-h1: clamp(2.25rem, 1.5rem + 3.8vw, 5rem);
  --ui-type-h2: clamp(1.75rem, 1.35rem + 2.3vw, 3.25rem);
  --ui-type-h3: clamp(1.25rem, 1.1rem + 0.9vw, 1.75rem);
  --ui-leading-heading: 1.08;
  --ui-leading-body: 1.55;
  --ui-tracking-heading: -0.02em;
  --ui-touch-target: 44px;
  --ui-duration: var(--motion-fast);
  --ui-ease: var(--motion-ease-out);
  --ui-focus-color: var(--color-accent);
}

@media (max-width: 767px) {
  :root {
    --header-height: 5.5rem;
    --text-body: 1.0625rem;
    --text-small: 1rem;
    --text-meta: 0.875rem;
    --fs-h2: clamp(2.75rem, 12vw, 3.75rem);
    --fs-sub: clamp(1.375rem, 6vw, 1.625rem);
    --fs-logo: 1.75rem;
    --section-padding-x: clamp(1.25rem, 6vw, 1.5rem);
    --section-padding-y: clamp(3rem, 12vw, 4rem);
  }
}

@media (min-width: 768px) {
  :root {
    --header-height: 5.25rem;
  }
}