/* Legba website — design tokens (Legba blend skin).
   The reference pages use these values inline as hex; the production build
   must use these variables instead. */
:root {
  /* surfaces */
  --bg: #101214;          /* page */
  --bg-alt: #15181a;      /* alternating section band */
  --surface: #1b1e21;     /* cards */
  --surface-2: #22262a;   /* hover, active nav, table group header, dot-grid dots */
  --border: #30353a;      /* card + control borders */
  --border-soft: #25292d; /* section dividers, row lines */

  /* text */
  --text: #e5e8e6;
  --text-body: #b9bfbb;   /* long-form paragraphs */
  --text-2: #9aa19d;      /* secondary, nav inactive */
  --text-muted: #7d8480;  /* eyebrows, numbers, captions (4.9:1 on --bg) */
  --text-faint: #4a5055;  /* decorative only: arrows, separators — never body text */

  /* brand — lime is ONLY for primary CTAs and a few brand marks */
  --accent: #b8f34b;
  --on-accent: #101214;

  /* semantic */
  --ok: #6fb37f;          /* done, PASS, Judge */
  --info: #7fa6d9;        /* in_progress, neural/probabilistic */
  --warn: #d59a43;        /* blocked_review, FAIL/retry */
  --danger: #d46a5e;      /* escalate */

  /* type */
  --font-sans: 'Geist', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono: 'Geist Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

  /* type scale (desktop → ≤900px) */
  --fs-h1-home: 76px;     /* → 44px */
  --fs-h1-philosophy: 84px; /* → 44px */
  --fs-h1-how: 64px;      /* → 44px */
  --fs-h2: 44px;          /* → 32px (Philosophy theses 40px → 30px) */
  --fs-cta: 56px;         /* → 32px */
  --fs-lead: 19px;
  --fs-body: 17px;
  --fs-eyebrow: 13px;     /* mono, uppercase or "NN / Title" */

  /* radii — no other values */
  --r-card: 6px;
  --r-frame: 8px;         /* product screenshot frames */
  --r-phone-outer: 28px;
  --r-phone-inner: 18px;
  --r-tag: 4px;

  /* layout */
  --container: 1200px;
  --gutter: 40px;         /* → 20px at ≤900px */
  --section-y: 120px;     /* 112px on How It Works / Philosophy */
  --nav-h: 68px;

  /* texture */
  --dot-grid: radial-gradient(var(--surface-2) 1px, transparent 1px) 0 0 / 22px 22px;
}