/* tokens.css — design tokens. Color, type scale, spacing, motion. */

:root {
  /* ── Canvas & ink ─────────────────────────────────────────── */
  --bg: #06070a;
  --bg-raise: #0b0d12;
  --bg-raise-2: #11141b;
  --line: rgba(255, 255, 255, 0.08);
  --line-strong: rgba(255, 255, 255, 0.14);

  --ink: #eceef2;
  --ink-dim: #aab0bd;
  --ink-mute: #6b7280;

  /* ── Accent plasma: indigo → violet → cyan ────────────────── */
  --indigo: #6366f1;
  --violet: #8b5cf6;
  --cyan: #22d3ee;
  --accent: var(--violet);
  --plasma: linear-gradient(110deg, var(--indigo), var(--violet) 45%, var(--cyan));
  --glow: 0 0 40px rgba(124, 92, 246, 0.35);

  /* Warm ember — reserved for the easter egg only. */
  --ember: #ff5c39;

  /* ── Type ─────────────────────────────────────────────────── */
  --font-sans: "Geist", ui-sans-serif, system-ui, -apple-system,
    "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-mono: "Geist Mono", ui-monospace, "SF Mono", "JetBrains Mono",
    "Fira Code", Menlo, Consolas, monospace;

  /* Fluid scale (clamp: min, vw, max) */
  --fs-display: clamp(2.3rem, 6vw, 5.25rem);
  --fs-h1: clamp(2rem, 5.5vw, 4.25rem);
  --fs-h2: clamp(1.6rem, 3.6vw, 2.8rem);
  --fs-h3: clamp(1.15rem, 1.8vw, 1.5rem);
  --fs-lead: clamp(1.1rem, 1.8vw, 1.5rem);
  --fs-body: clamp(1rem, 1.1vw, 1.125rem);
  --fs-sm: 0.92rem;
  --fs-xs: 0.78rem;

  --lh-tight: 1.04;
  --lh-snug: 1.18;
  --lh-body: 1.6;

  --tracking-eyebrow: 0.22em;

  /* ── Space & layout ───────────────────────────────────────── */
  --maxw: 1180px;
  --maxw-narrow: 760px;
  --gutter: clamp(1.25rem, 5vw, 4rem);
  --section-pad: clamp(5rem, 12vh, 10rem);

  --radius: 14px;
  --radius-lg: 22px;

  /* ── Motion ───────────────────────────────────────────────── */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 0.25s;
  --dur: 0.6s;
  --dur-slow: 1.1s;

  --z-canvas: 0;
  --z-content: 1;
  --z-nav: 50;
  --z-palette: 100;
  --z-egg: 120;
}
