/* ─── Staffbuilder.fi · Design Tokens ───────────────────────────
   Source of truth: pages/site-shared.jsx — SB object
   Direction 03 · Cartograph palette + Aalto-bone paper
   ─────────────────────────────────────────────────────────────── */

:root {

  /* ── Colour palette ─────────────────────────────────────────── */
  --ink:    #0F2342;  /* primary navy — text, dark surfaces        */
  --navy:   #1B3358;  /* softer navy — body alt                    */
  --paper:  #FAF6EC;  /* primary surface — Aalto bone warm white   */
  --cream:  #F2EDE2;  /* mid-tone surface — cards, alt sections    */
  --chalk:  #E5DECD;  /* darker bone — dividers, gradient endpoint */
  --signal: #D63B2B;  /* accent red — CTAs, accent words, map pin  */
  --cobalt: #2D5BD1;  /* route blue — timeline, data labels        */
  --sun:    #E8A93A;  /* tertiary gold — stat labels on dark bg    */

  /* ── Typography ─────────────────────────────────────────────── */
  --font-display: 'Bricolage Grotesque', sans-serif;  /* headlines, stats     */
  --font-serif:   'Instrument Serif', serif;          /* editorial italics    */
  --font-mono:    'JetBrains Mono', monospace;        /* coordinates, codes   */
  --font-body:    'Geist', 'DM Sans', system-ui, sans-serif; /* UI, body text */

  /* ── Spacing scale ──────────────────────────────────────────── */
  --sp-1:  8px;
  --sp-2:  16px;
  --sp-3:  24px;
  --sp-4:  32px;
  --sp-5:  48px;
  --sp-6:  64px;
  --sp-7:  96px;
  --sp-8:  120px;

  /* ── Radii ──────────────────────────────────────────────────── */
  --radius-pill: 999px;

  /* ── Motion ─────────────────────────────────────────────────── */
  --transition: 0.22s ease;

  /* ── Shadows ─────────────────────────────────────────────────── */
  --shadow-card: 0 2px 12px rgba(15, 35, 66, 0.08);

}