/* ─────────────────────────────
   LUDIX — design tokens
   Light-forward palette (2026-07-16 redesign — see docs/plans/ui-ux-redesign-report.md):
   warm cream surfaces + dark ink + gold accent. Hero/CTA/feature sections opt into a
   dramatic dark band via .band-dark (see site.css), where the black+gold business-card
   identity lives. Typography: Space Grotesk (headings) + Inter (body), JetBrains Mono
   for data/labels, Syncopate wordmark-only. Motion tokens power balanced, premium
   animation; every motion must have a prefers-reduced-motion fallback.
   ───────────────────────────── */
:root {
  /* ── Light surfaces (default) — warm parchment, deliberately NOT near-white ── */
  --bg:        #E8DCBE;   /* warm parchment page (calm, clearly not white) */
  --bg-2:      #F3EBD6;   /* raised warm-cream card (not pure white) */
  --bg-3:      #DFD1AF;   /* secondary panel / alt surface */
  --ink:       #191510;   /* headings / primary text */
  --ink-body:  #433D2C;   /* body text */
  --ink-mute:  #675E4B;   /* secondary */
  --ink-dim:   #998E71;   /* faint / placeholder */
  --line:      #D2C29A;   /* border on light */
  --line-soft: #DFD2B2;

  /* ── Brand gold — three roles, don't mix:
     --gold     : BRIGHT — fills (button bg), decoration, text on DARK bands
     --gold-ink : DEEP   — gold-colored decoration/rules/icons on LIGHT surfaces
     --gold-text: DEEPER — gold-colored small TEXT (eyebrows, taglines) on LIGHT surfaces;
                  darker than --gold-ink so 11px labels clear WCAG AA (≥4.5:1 on --bg/--bg-2,
                  where --gold-ink's 3.7–4.2:1 fell short) ── */
  --gold:      #C8A96E;
  --gold-soft: #D8BD87;
  --gold-ink:  #8A6A38;
  --gold-text: #6F5226;

  /* ── Dark-band tokens (hero, CTA, feature bands via .band-dark) ── */
  --band-bg:       #100E0A;
  --band-bg-2:     #1B1610;
  --band-ink:      #F2ECE0;
  --band-ink-body: #C4BCAA;
  --band-ink-mute: #B4AB99;  /* ~8.5:1 on --band-bg — muted labels/eyebrows on dark bands */
  --band-ink-dim:  #8F8873;  /* ~4.6:1 on --band-bg — faint/placeholder on dark bands */
  --band-line:     #2A2518;

  /* ── Semantic (contrast-safe on light) ── */
  --ok:   #3F7D57;
  --err:  #B4502F;
  --warn: #A9742A;

  /* ── Elevation (light bg needs shadow; the old dark base didn't). Strengthened 2026-07-21:
     on the warm cream palette the previous values were too faint to lift a card off the page,
     so feature/product cards read as flat "stains" rather than raised surfaces. ── */
  --shadow-sm:   0 1px 2px rgba(26,23,18,0.10), 0 4px 14px rgba(26,23,18,0.07);
  --shadow-md:   0 4px 16px rgba(26,23,18,0.10), 0 14px 34px rgba(26,23,18,0.08);
  --shadow-gold: 0 8px 30px rgba(200,169,110,0.22);

  /* ── Typography (same fonts) ── */
  --display: 'Space Grotesk', ui-sans-serif, system-ui, sans-serif;
  --body:    'Newsreader', 'Inter', Georgia, ui-serif, serif;
  --mono:    'JetBrains Mono', ui-monospace, monospace;
  --brand:   'Space Grotesk', ui-sans-serif, system-ui, sans-serif;

  --pad-x: clamp(20px, 5vw, 64px);
  --pad-y-sec: clamp(72px, 10vw, 128px);
  --max-w: 1280px;
  --gap: clamp(32px, 5vw, 64px);

  --radius-card: 20px;
  --radius-sm: 12px;

  /* ── Motion ── */
  --dur-fast: 120ms;   /* hover/color feedback */
  --dur-base: 280ms;   /* most transitions */
  --dur-slow: 600ms;   /* reveals, logo draw */
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);   /* expo-out: premium entrance */
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-spring: cubic-bezier(0.34, 1.4, 0.5, 1); /* slight overshoot: "pop" */
  --reveal-rise: 32px;
}