/* ============================================================
   SCN2A Australia — Neural Ink Token System
   Source: SCN2A Australia Brand Guidelines v2.1 (June 2026, as-built)
   See: docs/brand-guidelines.md (authoritative)

   Balanced build:
   - Navy Blue #1E3A6E is the ANCHOR SURFACE (heroes, footer, evidence
     band, CTA blocks, primary buttons). Warm White is the dominant
     reading canvas, so the site reads warm and led-by-light.
   - Ink #0D1B2A is the TEXT colour on light surfaces. Do NOT use Ink
     as a large background (it reads black).
   - Type scale web-tuned for on-screen readability.
   - --colour-muted gives accessible caption text (Stone fails as text;
     reserve Stone for fills/borders only).
   ============================================================ */

/* Load Plus Jakarta Sans BEFORE this file, e.g.
   <link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap" rel="stylesheet"> */

:root {
  /* ---------- Primary palette (proportional budgets) ---------- */
  --colour-navy:     #1E3A6E;  /* Navy Blue — ANCHOR SURFACE: hero, footer, bands, primary buttons */
  --colour-navy-hover:#16305C; /* darker navy for button hover */
  --colour-ink:      #0D1B2A;  /* Ink — primary TEXT on light (not a background) */
  --colour-canvas:   #F7F4F0;  /* Warm White — dominant page surface (~55-60%) */
  --colour-mid:      #E8E3DA;  /* Sandstone — stat bands, key-point boxes */
  --colour-stone:    #B8B2A8;  /* Stone — FILLS & BORDERS ONLY (not text) */
  --colour-muted:    #6B6659;  /* Muted text — captions/metadata (~4.9:1 on canvas) */
  --colour-divider:  #D5CFBF;  /* Mid Cream — dividers, hairline borders */
  /* alias: legacy name kept = navy surface */
  --colour-primary:  var(--colour-navy);

  /* ---------- Accents (rare by design) ---------- */
  --colour-accent:   #8E3B5E;  /* Mulberry — ONE per viewport. CTA / pull-quote / key link */
  --colour-accent-hover: #76304D; /* darker mulberry for hover */
  --colour-hint:     #4A7EC7;  /* Soft Cobalt — micro-details only, NEVER text/bg */
  --colour-eyebrow-on-navy: #D8C2CD; /* mulberry tint — eyebrow text on navy */

  /* ---------- Semantic surfaces ---------- */
  --bg-page:        var(--colour-canvas);
  --bg-band:        var(--colour-mid);     /* sandstone section band */
  --bg-card-dark:   var(--colour-navy);    /* dark feature card */
  --bg-full-dark:   var(--colour-navy);    /* hero / footer / dark band */

  /* ---------- Semantic text ---------- */
  --fg-1:        var(--colour-ink);      /* primary text on light */
  --fg-2:        var(--colour-muted);    /* captions/metadata on light */
  --fg-on-dark:  var(--colour-canvas);   /* warm-white text on navy */
  --fg-on-dark-2:rgba(255,255,255,0.82); /* secondary text on navy */
  --fg-link:     var(--colour-accent);   /* key links */

  /* ---------- Radius (v2.x: soft, not sharp) ---------- */
  --radius-btn:  5px;
  --radius-tag:  3px;
  --radius-card: 5px;

  /* ---------- Borders & rules ---------- */
  --border-hairline: 1px solid var(--colour-divider);
  --rule-accent:     3px solid var(--colour-accent);  /* pull-quote */
  --rule-hint:       2px solid var(--colour-hint);    /* nav underline / card top */

  /* ---------- Spacing (8pt) ---------- */
  --space-1: 4px;  --space-2: 8px;  --space-3: 12px; --space-4: 16px;
  --space-5: 24px; --space-6: 32px; --space-7: 48px; --space-8: 64px; --space-9: 96px;

  /* ---------- Typography ---------- */
  --font-sans: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif;

  /* Web-scaled ramp (guide print px in comments) */
  --fs-hero:  56px;  /* guide 36 */
  --fs-h1:    36px;  /* guide 28 */
  --fs-h2:    26px;  /* guide 20 */
  --fs-h3:    19px;  /* guide 16 */
  --fs-h4:    16px;  /* guide 14 */
  --fs-body:  16px;  /* guide 13 — bumped for accessibility */
  --fs-small: 13px;  /* guide 11 */
  --fs-label: 11px;  /* guide 10 — uppercase 0.12em */

  --lh-tight: 1.1;  --lh-snug: 1.2;  --lh-body: 1.7;

  /* ---------- Content widths ---------- */
  --measure: 66ch;
  --container-max: 1200px;
}

/* v2.0: Plus Jakarta Sans is the sole typeface, site-wide */
body { font-family: var(--font-sans); }

/* Skip-to-content link — visible only on keyboard focus */
.skip-link {
  position: absolute; left: 8px; top: -48px; z-index: 200;
  background: var(--colour-primary); color: #fff;
  padding: 10px 16px; font-weight: 700; text-decoration: none;
  border-radius: 0 0 5px 5px; transition: top 120ms ease;
}
.skip-link:focus { top: 0; }
main:focus { outline: none; }

/* Accessible focus ring — mulberry */
*:focus-visible { outline: 2px solid var(--colour-accent); outline-offset: 2px; }

@media (prefers-reduced-motion: reduce) {
  * { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important;
      transition-duration: 0.001ms !important; scroll-behavior: auto !important; }
}
