/* =============== TOKENS (shared across non-home pages) =============== */
:root{
  /* Brand colors */
  --bg-1: #0c1320;           /* deep navy */
  --bg-2: #1b2238;           /* charcoal-navy */
  --white: #ffffff;
  --ink: #eef2f7;            /* near-white text */
  --ink-dim: rgba(238,242,247,.88);
  --gold: goldenrod;
  

  /* Typography (families only; load webfonts in HTML if you want them) */
  --font-ui: "Josefin Sans", ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial;
  --font-head: "Manrope", system-ui;
  --dc-value-size: clamp(1.6rem, 1.8vw, 1.9rem);

  /* Layout tokens */
  --r: 16px;                 /* radius */
  --nav-h: 7.2rem;           /* fixed nav height (≈72px, stable) */
  --bp-md: 900px;            /* desktop breakpoint */
}

/* Back-compat aliases (let old names keep working) */
:root{
  --accent: var(--gold);
  --text: var(--ink);
  --text-dim: var(--ink-dim);
  --radius: var(--r);
  --bg: linear-gradient(180deg, var(--bg-1), var(--bg-2));
}

/* =============== LIGHT RESET (safe, minimal) =============== */
html { font-size: 62.5%; }             /* 1rem = 10px */
*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; color: var(--ink); font-family: var(--font-ui); line-height: 1.55; }
img, picture, svg, video { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce){
  * { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}
