/* ==========================================================================
   EPQ 54 — Design Tokens
   Source of truth: extracted from the live EPQ 54 storefront
   (epq54cigar-9g2cfdzq.manus.space). Do not repurpose token roles.
   ========================================================================== */

:root {
  /* ------------------------------------------------------------------
     COLOR — Dark canvas is the primary brand register (cigar lounge).
     Gold is CTA / accent / eyebrow ONLY. Never a background, never body text.
     ------------------------------------------------------------------ */
  --color-background: #190f09;        /* oklch(18% .02 55)  — deep tobacco */
  --color-surface: #221812;           /* oklch(22% .02 55)  — card / panel */
  --color-surface-raised: #2a221d;    /* oklch(26% .016 56) — secondary surface */
  --color-surface-accent: #2e241e;    /* oklch(27% .018 56) — hover / accent surface */
  --color-muted: #27201b;             /* oklch(25% .014 55) */

  --color-foreground: #e8e4dc;        /* oklch(92% .012 85) — warm cream text */
  --color-foreground-secondary: #d1cdc7;
  --color-foreground-muted: #aeaaa4;  /* oklch(74% .01 85)  — captions, meta */

  --color-gold: #dbb155;              /* oklch(78% .12 85)  — PRIMARY. CTA/accent only */
  --color-gold-ink: #1d140d;          /* text on gold */
  --color-border: #413c38;            /* oklch(36% .01 60) */
  --color-ring: #dbb155;

  /* Supporting earth palette (charts, tags, illustration accents only) */
  --color-ember: #ac8b6b;
  --color-leather: #8d6c5a;
  --color-champagne: #d9cda9;
  --color-copper: #be9766;

  --color-destructive: #ff645f;

  /* Light register (print, invitations, alt pages) */
  --light-background: #fdfaf4;        /* oklch(98.5% .008 85) — warm ivory */
  --light-foreground: #261d16;
  --light-surface: #fffefb;
  --light-gold: #d4ab4f;              /* oklch(76% .12 85) */
  --light-border: #e2ddd7;
  --light-muted-fg: #736a62;

  /* ------------------------------------------------------------------
     TYPOGRAPHY — Playfair Display: display/headlines ONLY.
     Inter: body, UI, labels. Never swap roles.
     ------------------------------------------------------------------ */
  --font-display: "Playfair Display", Georgia, serif;
  --font-sans: "Inter", system-ui, -apple-system, sans-serif;

  /* Fluid type scale (mobile -> desktop) */
  --text-hero: clamp(2.75rem, 1.5rem + 6.25vw, 6.5rem);      /* 44 -> 104 */
  --text-display: clamp(2.25rem, 1.35rem + 4.5vw, 4.75rem);  /* 36 -> 76  */
  --text-title: clamp(1.75rem, 1.3rem + 2.25vw, 3rem);       /* 28 -> 48  */
  --text-heading: clamp(1.375rem, 1.15rem + 1.1vw, 2rem);    /* 22 -> 32  */
  --text-lead: clamp(1.0625rem, 1rem + 0.35vw, 1.25rem);     /* 17 -> 20  */
  --text-body: 1rem;
  --text-small: 0.875rem;
  --text-caption: 0.75rem;

  /* EPQ signature: wide-tracked uppercase eyebrows */
  --tracking-eyebrow: 0.42em;
  --tracking-eyebrow-tight: 0.3em;
  --tracking-display: -0.015em;

  --leading-display: 1.05;
  --leading-body: 1.65;

  /* ------------------------------------------------------------------
     SHAPE & SPACE
     ------------------------------------------------------------------ */
  --radius: 1.25rem;                  /* EPQ generous rounding (20px) */
  --radius-sm: 0.625rem;
  --radius-xs: 0.125rem;
  --radius-pill: 999px;

  --space-section: clamp(5rem, 3rem + 10vw, 11rem);
  --space-gutter: clamp(1.25rem, 0.75rem + 3vw, 4rem);
  --container-max: 84rem;             /* 1344px */
  --container-copy: 42rem;

  /* ------------------------------------------------------------------
     ELEVATION — warm-tinted, never pure black
     ------------------------------------------------------------------ */
  --shadow-card: 0 1px 2px rgba(10, 6, 3, 0.4), 0 12px 32px -12px rgba(10, 6, 3, 0.55);
  --shadow-float: 0 2px 6px rgba(10, 6, 3, 0.45), 0 24px 64px -16px rgba(10, 6, 3, 0.65);
  --scrim-hero: linear-gradient(180deg, rgba(25, 15, 9, 0.25) 0%, rgba(25, 15, 9, 0.05) 40%, rgba(25, 15, 9, 0.82) 100%);

  /* ------------------------------------------------------------------
     MOTION — Rivian-derived system, adapted to EPQ pacing.
     "Draw" = expressive entrance. "Shift" = media/transform moves
     (Rivian's exact curve). "Standard" = UI micro-transitions.
     ------------------------------------------------------------------ */
  --ease-draw: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-shift: cubic-bezier(0.55, 0, 0.9, 1);
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);

  --duration-micro: 150ms;            /* icon nudges, toggles            */
  --duration-ui: 300ms;               /* color/hover transitions (Rivian) */
  --duration-reveal: 850ms;           /* scroll-triggered entrances      */
  --duration-hero: 1400ms;            /* hero media settle               */
  --stagger-step: 90ms;               /* delay between sibling reveals   */

  --reveal-distance: 32px;            /* fade+rise travel                */
  --parallax-bg: 0.12;                /* scroll-speed factors            */
  --parallax-mid: 0.22;
  --parallax-fg: 0.38;
}
