:root {
  /* ── Colour ── */
  --c-bg:           #080808;
  --c-surface:      #0f0f0f;
  --c-text:         #f0ede8;
  --c-text-dim:     rgba(240, 237, 232, 0.38);
  --c-text-mid:     rgba(240, 237, 232, 0.65);
  --c-border:       rgba(240, 237, 232, 0.08);
  --c-border-hover: rgba(240, 237, 232, 0.18);

  /* ── Accent ── */
  --c-accent:          #FF1F6E;
  --c-accent-2:        #FF2209;
  --c-accent-gradient: linear-gradient(135deg, #FF1F6E 0%, #FF2209 100%);

  /* ── Typography ── */
  --font-display:      'Cherry Bomb One', cursive;
  --font-display-sans: 'Barlow Condensed', 'Arial Narrow', Arial, sans-serif;
  --font-body:         'DM Sans', system-ui, -apple-system, sans-serif;
  --font-mono:         'Space Mono', 'Courier New', monospace;

  /* ── Type scale ── */
  --size-hero:    clamp(2.8rem, 5.5vw, 6.5rem);
  --size-h1:      clamp(2rem, 4vw, 4.5rem);
  --size-h2:      clamp(1.4rem, 2.5vw, 2.5rem);
  --size-label:   0.6875rem;
  --size-body:    clamp(0.9rem, 1.1vw, 1.05rem);
  --lh-body:      1.7;

  /* ── Spacing ── */
  --space-xs:  0.5rem;
  --space-sm:  1rem;
  --space-md:  2rem;
  --space-lg:  4rem;
  --space-xl:  7rem;
  --space-2xl: 14rem;
  --gutter:    clamp(1.5rem, 5vw, 5rem);

  /* ── Easing ── */
  --ease-expo:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out:  cubic-bezier(0.65, 0, 0.35, 1);
  --ease-snap:    cubic-bezier(0.34, 1.56, 0.64, 1);

  /* ── Duration ── */
  --dur-fast:   0.25s;
  --dur-base:   0.55s;
  --dur-slow:   1.1s;
  --dur-scenic: 1.8s;

  /* ── Layout ── */
  --nav-h:      5rem;
  --max-w:      1440px;
}

@media (max-width: 768px) {
  :root {
    --space-xl:  3.5rem;
    --space-2xl: 6rem;
    --space-lg:  2rem;
    --gutter:    1.25rem;
  }
}