/* ============================================================
   ORGSCOUT. DESIGN TOKENS
   Single source of truth: color, type, spacing, motion.
   home.html links this file and keeps only component CSS inline.
   Never mirror these into a second :root.

   Brand architecture: orgscout is a Roshco endorsed sub-brand.
   KINSHIP (shared with roshco): warm forest-black ground, Archivo type,
   survey/contour motif. DISTINCT (orgscout only): copper + sodium as the
   live-data signal, the compass mark, the lowercase mono wordmark.
   Hard rule: green owns ground + structure; copper/sodium own live data.
   Never green on live data.
   ============================================================ */

:root {
  /* ---- Color. forest-black ground (kinship), copper/sodium signal (distinct) ---- */
  --graphite:    #0f1410;  /* page ground (roshco Ink) */
  --graphite-2:  #15211c;  /* card / panel ground (forest-tinted dark) */
  --surface:     #1c3b34;  /* component bg (roshco Forest) */
  --surface-2:   #244a40;  /* component hover */
  --line:        #2a3a32;  /* subtle border / gridline */
  --line-2:      rgba(202, 166, 78, 0.22);  /* interactive border (gold-faint) */

  --copper:      #b8642e;  /* primary / brand. live-data signal */
  --copper-bright:#d1763a; /* hover / active */
  --copper-deep: #8f4d22;  /* pressed */

  --sodium:      #e8c547;  /* live-data accent ONLY */
  --sodium-soft: rgba(232, 197, 71, 0.16); /* glow fills */

  /* Structure / contour accents (roshco survey palette). NEVER on live data. */
  --forest:      #1c3b34;
  --sage:        #3f6f5c;
  --mint:        #8aa888;
  --gold:        #caa64e;

  --bone:        #f6f1e7;  /* primary text (roshco Paper) */
  --mute:        #cdc6b6;  /* secondary text (bone-dim) */
  --faint:       #8a7d68;  /* tertiary text / labels (meta) */

  /* ---- Type. Archivo (kinship) + mono wordmark/data (distinct) ---- */
  --mono:    'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace; /* wordmark, data */
  --ui:      'Archivo', system-ui, -apple-system, sans-serif;             /* UI, body */
  --display: 'Archivo Expanded', 'Archivo', system-ui, sans-serif;        /* headings */

  /* ---- Type scale. marketing 1.333 (perfect fourth), fluid ---- */
  --fs-display: clamp(44px, 7vw, 88px);
  --fs-h2:      clamp(30px, 4vw, 46px);
  --fs-h3:      clamp(20px, 2.2vw, 26px);
  --fs-lede:    clamp(19px, 2.1vw, 24px);
  --fs-body:    18px;
  --fs-small:   14px;
  --fs-data:    13px;   /* mono labels, axis ticks */
  --fs-micro:   12px;

  /* ---- Letterspacing ---- */
  --ls-display: -0.03em;
  --ls-tight:   -0.02em;
  --ls-kicker:  0.18em;   /* uppercase mono kickers */

  /* ---- Spacing scale (no two adjacent closer than 25%) ---- */
  --s-1: 4px;  --s-2: 8px;   --s-3: 12px; --s-4: 16px;
  --s-6: 24px; --s-8: 32px;  --s-12: 48px; --s-16: 64px;
  --s-24: 96px; --s-32: 128px;
  --section-pad: clamp(80px, 12vh, 160px);

  /* ---- Layout ---- */
  --maxw: 1200px;
  --measure: 64ch;
  --radius: 10px;
  --radius-sm: 6px;
  --gutter: clamp(20px, 5vw, 48px);

  /* ---- Motion ---- */
  --ease: cubic-bezier(.2, .8, .2, 1);
  --ease-out: cubic-bezier(0, 0, .2, 1);
}