/* CongoSky design tokens — the brand kit as CSS custom properties.
   Proudly African: earth + gold, never corporate blue. Import this; don't re-declare
   colours. See brand/BRAND.md. Accessibility is foundational — every pair here is AA. */

:root {
  /* ── Core earth ── */
  --olive-deep: #2F3525;   /* near-black ink + dark surfaces */
  --olive:      #4A5234;   /* primary deep green */
  --grass:      #6B7355;   /* muted mid-green */

  /* ── Warm neutrals ── */
  --sand:  #E8DFCC;        /* the page (light surface) */
  --khaki: #D4C4A8;        /* panels / cards */
  --dust:  #B8A88A;        /* borders, muted accents */
  --bone:  #2F3525;        /* body text on light (= olive-deep) */
  --bonedim: #5C6348;      /* secondary text on light */

  /* ── Accents — the "gold thread", used sparingly ── */
  --camel:      #E8B820;   /* THE accent. gold. borders, focus, CTA edge, text-on-dark */
  --emu:        #C4B832;   /* secondary gold-green, eyebrows on dark */
  --terracotta: #8B3A2B;   /* a single warm punctuation / alerts */

  /* ── Functional ── */
  --link-light: #5E4F2B;   /* links on light surfaces (AA on sand) */
  --line:       #C4B59A;   /* hairline borders on light */

  /* ── Type ── */
  --font-body: "Atkinson Hyperlegible", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-head: "Space Grotesk", "Atkinson Hyperlegible", system-ui, sans-serif;

  /* ── Shape ── */
  --radius: 14px;
  --gold-edge: 3px;        /* the camel top/left border width */
}

/* a11y foundation — applies wherever tokens.css is imported. */
*:focus-visible {
  outline: 3px solid var(--camel);
  outline-offset: 2px;
}
@media (prefers-reduced-motion: reduce) {
  * { animation-duration: .001ms !important; transition-duration: .001ms !important; }
}