/*
 * Sage Labs — design tokens.
 *
 * This file is the SINGLE source of design values. Nothing below (or in the
 * sheets that follow) should invent a colour, a size, a radius, or a duration.
 * A token layer is a system; the point is that a change is made once, here.
 *
 * Two rules carry the identity:
 *   squared, not rounded   — radius tops out at 2px
 *   hairlines, not shadows  — separation is a 1px line, never elevation
 *
 * Colour is dark-first. Two accents (Signal, Iris) do all the work; they are
 * accents, never floods. The Aurora gradient — memory blooming into action —
 * is the one place they meet.
 */

:root {
  /* ── colour ──────────────────────────────────────────────────────────────
   * Role names, not pigment names: `--signal`, not `--green`. The palette can
   * be re-tuned without touching a single call site. */
  --ink:    #0A0F14;  /* base — the void */
  --slate:  #141B23;  /* surfaces / panels */
  --line:   #24303B;  /* hairlines, borders */
  --signal: #35E0A1;  /* primary — living green */
  --iris:   #7C6BF5;  /* secondary — intellect / future */
  --paper:  #E8EEF0;  /* primary text */
  --mist:   #7C8A97;  /* secondary text */

  /* Derived surfaces — never declared elsewhere. */
  --surface-0: var(--ink);
  --surface-1: var(--slate);
  --surface-2: color-mix(in oklab, var(--slate) 82%, var(--paper) 18%);
  --text-1: var(--paper);
  --text-2: var(--mist);

  /* The signature. Memory blooming into action. */
  --aurora: linear-gradient(90deg, var(--signal), var(--iris));
  --bloom: #80EFC6;  /* the wordmark's breath peak — a lighter Signal, same hue (158deg) */

  /* ── type ────────────────────────────────────────────────────────────────
   * A DERIVED fluid scale. Each step interpolates between a 360px and a
   * 1440px endpoint, computed from a single pair of ratios (1.20 low,
   * 1.25 high) — so every size is a consequence of the system, not a
   * hand-picked number. Proportions hold across the whole viewport range.
   * Faces are vendored (OFL) and declared in fonts.css; see BRAND.md. */
  --font-display: "Sora", system-ui, sans-serif;
  --font-body:    "Geist", system-ui, -apple-system, sans-serif;
  --font-mono:    "Geist Mono", ui-monospace, "SF Mono", Menlo, monospace;

  --fs--1: clamp(0.831rem, 0.808rem + 0.102vw, 0.900rem);
  --fs-0:  clamp(1.000rem, 0.958rem + 0.185vw, 1.125rem);
  --fs-1:  clamp(1.200rem, 1.131rem + 0.306vw, 1.406rem);
  --fs-2:  clamp(1.438rem, 1.331rem + 0.472vw, 1.756rem);
  --fs-3:  clamp(1.725rem, 1.567rem + 0.704vw, 2.200rem);
  --fs-4:  clamp(2.075rem, 1.852rem + 0.991vw, 2.744rem);
  --fs-5:  clamp(2.488rem, 2.173rem + 1.398vw, 3.431rem);
  --fs-6:  clamp(2.988rem, 2.552rem + 1.935vw, 4.294rem);
  --fs-7:  clamp(3.581rem, 2.988rem + 2.639vw, 5.363rem);

  --lh-tight: 1.05;   /* display */
  --lh-snug:  1.25;   /* headings */
  --lh-body:  1.6;    /* prose */
  --tracking-tight: -0.02em;
  --tracking-wide:   0.14em;  /* eyebrows / labels */

  /* ── space ───────────────────────────────────────────────────────────────
   * A 4px-rooted scale. Steps are fixed; the two section steps are fluid, so
   * vertical rhythm scales gently with the viewport instead of doubling. */
  --space-2xs: 0.5rem;
  --space-xs:  0.75rem;
  --space-s:   1rem;
  --space-m:   1.5rem;
  --space-l:   2rem;
  --space-xl:  3rem;
  --space-section: clamp(3.5rem, 2.5rem + 4vw, 6rem);
  --space-hero:    clamp(4.5rem, 3rem + 7vw, 9rem);

  /* ── geometry ────────────────────────────────────────────────────────────
   * Squared. Two radii, no more. */
  --radius: 2px;
  --radius-0: 0;

  --hairline: 1px;
  --border: var(--hairline) solid var(--line);
  --border-strong: var(--hairline) solid var(--mist);
  --border-accent: var(--hairline) solid var(--signal);

  --wrap: 68rem;        /* content measure */
  --wrap-narrow: 44rem; /* prose measure */

  /* ── motion ──────────────────────────────────────────────────────────────
   * Restrained. One ease family; three durations. Everything below honours
   * prefers-reduced-motion (see base.css), because motion is a courtesy, not
   * a requirement. */
  --dur-fast: 140ms;
  --dur:      240ms;
  --dur-slow: 420ms;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);

  /* The named motion scale. Only these four gestures exist; anything animated
   * picks one. A scale, not a per-component decision. */
  --dur-draw:    420ms;   /* a hairline drawing itself in */
  --dur-lattice: 620ms;   /* a node igniting and a thread reaching it */
  --dur-sheen:   620ms;   /* light running an edge */
  --dur-breathe: 9s;      /* the slow ambient drift behind the hero */
  --dur-drift:   16s;     /* the thesis gradient drifting across a word */
  --stagger:     60ms;    /* the beat between two paired marks */

  /* ── the lattice field ─────────────────────────────────────────────────
   * The site-wide ambient background (see base.css / main.js). Values are the
   * settled contract; the field is a TEXTURE, not a hero layer. Node/line inks
   * stay inside the two-accent palette; the signals are the only place a third
   * hue appears, and only as a rare fire. */
  --lattice-density:  0.0000756;  /* nodes per px² — dial 108 */
  --lattice-line:     0.59;            /* hairline alpha */
  --lattice-node:     0.69;            /* node alpha */
  --lattice-glow:     0.14;            /* hub halo alpha (hubs only) */
  --lattice-size-max: 4.0px;           /* largest node radius */
  --lattice-hub-deg:  5;               /* degree at which a node counts as a hub */

  /* signals — the nervous system. Travel existing edges only. */
  --signal-rate:   1.1;    /* mean departures/sec (Poisson, not a metronome) */
  --signal-speed:  0.55;   /* edge-fractions per second (~1.8s per hop) */
  --signal-len:    0.30;   /* comet tail, as a fraction of the edge */
  --signal-alpha:  0.85;
  --signal-width:  1.6px;
  --signal-max:    9;      /* concurrent cap — a handful, never a flood */
  --signal-hub-bias: 0.75; /* share of signals that touch a hub */

  /* signal ink — three picks, weighted so pale Iris is home and the other two
   * are RARE. Rarity is what keeps an accent an accent (accents never flood). */
  --signal-ink-a: 150 225 210;  /* mint-cyan  — 18% */
  --signal-ink-b: 185 178 255;  /* pale iris  — 64% (dominant) */
  --signal-ink-c: 170 205 246;  /* light blue — 18% */
  --signal-ink-a-w: 0.18;
  --signal-ink-b-w: 0.64;
  --signal-ink-c-w: 0.18;
}