/* Hallmark · genre: atmospheric · macrostructure: Marquee Hero · theme: Aurora (constructed)
 * H1 hero knobs: size=xl, alignment=centred (atmospheric-loosened), underlay=none
 * nav: N9 edge-aligned · footer: Ft5 statement · sections: S2 hanging · features: F4 steps
 * enrichment: Tier-A/B procedural canvas (product demo IS the artifact)
 * axes: paper=dark(15%) · display=grotesk-sans(Geist) · accent=warm(15°)
 * pre-emit critique: P4 H4 E4 S5 R4 V4
 */
:root{
  /* color — OKLCH, dark paper tinted toward the warm accent hue */
  --color-paper:oklch(15% 0.012 20);
  --color-paper-2:oklch(19% 0.014 20);
  --color-paper-3:oklch(23% 0.016 20);
  --color-ink:oklch(93% 0.008 40);
  --color-ink-soft:oklch(76% 0.012 40);
  --color-ink-faint:oklch(58% 0.012 40);
  --color-accent:oklch(68% 0.21 15);
  --color-accent-deep:oklch(52% 0.19 15);
  --color-accent-ink:oklch(20% 0.03 15);
  --color-rule:oklch(30% 0.015 20);
  --color-focus:oklch(78% 0.15 15);
  --color-ok:oklch(75% 0.14 150);
  --color-accent-glow:oklch(68% 0.21 15 / .35);
  --color-accent-shadow:oklch(52% 0.19 15 / .16);
  --color-scrim:oklch(15% 0.012 20 / .55);
  --color-veil-top:oklch(15% 0.012 20 / .82);
  --color-veil-bot:oklch(15% 0.012 20 / .92);

  /* type — Geist family (display + body) + Geist Mono technical */
  --font-display:'Geist',ui-sans-serif,system-ui,sans-serif;
  --font-body:'Geist',ui-sans-serif,system-ui,sans-serif;
  --font-mono:'Geist Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  --text-display:clamp(2.6rem,6vw + 1rem,5.4rem);
  --text-xl:clamp(1.6rem,2.6vw + .6rem,2.4rem);
  --text-lg:1.25rem;
  --text-md:1.05rem;
  --text-sm:.9rem;
  --text-xs:.78rem;

  /* space — 4pt scale */
  --space-2xs:4px; --space-xs:8px; --space-sm:12px; --space-md:20px;
  --space-lg:32px; --space-xl:52px; --space-2xl:84px; --space-3xl:136px;
  --page-gutter:clamp(20px,5vw,64px);

  /* motion */
  --ease-out:cubic-bezier(.16,1,.3,1);
  --ease-in:cubic-bezier(.7,0,.84,0);
  --ease-in-out:cubic-bezier(.65,0,.35,1);
  --dur-fast:140ms; --dur-med:320ms;

  /* rules & radius */
  --rule-hair:1px; --rule-thick:3px;
  --radius-pill:999px; --radius-card:10px;
}