/* Traversica design tokens — THE SINGLE SOURCE OF TRUTH.
 *
 * WHY THIS FILE EXISTS
 * Before 2026-08-10 every one of 93 HTML files carried its own inline :root{} block, which had
 * already produced 27 distinct variants of what was meant to be one palette: --bg existed as both
 * #0a0a0f and #0a0a14, --surface as #12121a and #12121e, --text as #e8e8f0 and #fff. Nobody chose
 * any of that; 93 independent copies guarantee drift given enough edits. Change a neutral here and
 * every page follows. There is nowhere else for them to disagree.
 *
 * WHAT BELONGS HERE
 *   the NEUTRAL scaffolding (background, surface, card, border, text, dim)
 *   the TYPE stack and scale
 * WHAT DOES NOT BELONG HERE
 *   --accent / --accent2 / --gradient. Those are DELIBERATELY different per destination: Japan is
 *   #e74c6f, Belfast green, Busan blue, Bangkok amber, marketing pink. That variation is the point,
 *   it is what makes each guide feel like its own place. Those three stay in each page's own block.
 *
 * TYPOGRAPHY: ONE FAMILY, INTER. Diego's call, 2026-08-10, for a system that never needs revisiting.
 * Hierarchy comes from weight and size, never from a second typeface. Outfit was previously used for
 * headings on 22 of 97 pages and on 0 of the 72 city guides, so the guides — the pages people
 * actually land on — read as a different brand from the marketing pages. One family removes the
 * inconsistency, removes a font download, and leaves nothing that can drift.
 * Inter is a humanist sans, the category Monotype's cross-country neuroscience work found scored
 * highest for trust, so this is not a compromise on the research either.
 * Noto Sans JP stays as the CJK fallback on guides that need Japanese glyphs.
 *
 * CACHE RULE: js/css are `immutable, max-age=1yr` in _headers, so the ?v= query string is the ONLY
 * cache-bust this site has. BUMP ?v= ON tokens.css IN THE SAME EDIT THAT CHANGES IT, or returning
 * visitors keep the old file for up to a year.
 */

:root {
  /* ── neutral scaffolding: identical on every page ── */
  --bg:      #0a0a0f;
  --surface: #12121a;
  --card:    #1a1a28;
  --border:  #2a2a3d;

  /* ── text ──
     --text is #e8e8f0, NOT #fff. Pure white on a near-black background causes halation
     (the text appears to vibrate), which is worst for astigmatic readers. #e8e8f0 was already
     the majority value across the site; #fff was the minority outlier. */
  --text:  #e8e8f0;
  --text2: #cfd0e0;
  --text3: #8a8aa0;
  --dim:   #8888a0;   /* the most-used colour on the site; 5.71:1 on --bg, passes AA */

  /* ── type ──
     One family. 300-900 is already loaded, which is more range than most sites use. */
  --font:    Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-jp: Inter, "Noto Sans JP", system-ui, sans-serif;

  /* scale — the sizes actually in use, named so they stop being re-invented per page */
  --fs-hero: clamp(2.4rem, 6vw, 4rem);
  --fs-h1:   clamp(1.9rem, 5.6vw, 2.9rem);
  --fs-h2:   1.5rem;
  --fs-h3:   1.25rem;
  --fs-body: 1rem;
  --fs-meta: 0.82rem;

  --fw-hero: 800;
  --fw-h1:   800;
  --fw-h2:   700;
  --fw-h3:   600;
  --fw-body: 400;

  /* headings tighten as they grow; body never does */
  --ls-hero: -0.035em;
  --ls-h2:   -0.02em;
}