/* ============================================================
   GrantAffinity — Design Tokens
   Source of truth: branding/tokens.css (brand guide, high fidelity).
   Font families list the fontsource *Variable* family names first, since
   that's what we load from cdn.jsdelivr.net (see base.html).
   ============================================================ */

:root {
  /* --- Brand colors --- */
  --ga-navy:        #17285f; /* primary — logo, headers, primary buttons */
  --ga-navy-deep:   #0f1c46; /* darker navy — icon tiles, pressed states */
  --ga-blue:        #2f5fd0; /* interactive — links, focus rings */
  --ga-blue-light:  #5b9df5; /* accent — the "match" node, highlights */
  --ga-green:       #2f8f57; /* success / high-confidence match */

  /* --- Neutrals --- */
  --ga-ink:         #0e1630;
  --ga-text:        #59647b;
  --ga-text-muted:  #8b96ab;
  --ga-paper:       #f5f7fb;
  --ga-surface:     #ffffff;
  --ga-border:      #dde3ee;
  --ga-tint:        #eaf0fc;

  /* --- On-navy neutrals (reversed) --- */
  --ga-on-navy:        #ffffff;
  --ga-on-navy-muted:  #c9d4ee;
  --ga-on-navy-subtle: #aebada;

  /* --- Typography --- */
  --ga-font-brand: 'Space Grotesk Variable', 'Space Grotesk', 'Segoe UI', system-ui, sans-serif;
  --ga-font-ui:    'Inter Variable', 'Inter', system-ui, -apple-system, sans-serif;

  --ga-text-xs:   12px;
  --ga-text-sm:   14px;
  --ga-text-base: 16px;
  --ga-text-lg:   19px;
  --ga-text-xl:   25px;
  --ga-text-2xl:  32px;
  --ga-text-3xl:  46px;

  --ga-weight-regular: 400;
  --ga-weight-medium:  500;
  --ga-weight-semibold: 600;
  --ga-weight-bold:    700;

  /* --- Radii --- */
  --ga-radius-sm:  8px;
  --ga-radius-md:  12px;
  --ga-radius-lg:  15px;
  --ga-radius-xl:  20px;
  --ga-radius-pill: 999px;

  /* --- Shadows --- */
  --ga-shadow-card: 0 1px 3px rgba(23, 40, 95, 0.05);
  --ga-shadow-pop:  0 8px 28px rgba(15, 28, 70, 0.18);

  /* --- Spacing scale --- */
  --ga-space-1: 4px;
  --ga-space-2: 8px;
  --ga-space-3: 12px;
  --ga-space-4: 16px;
  --ga-space-5: 24px;
  --ga-space-6: 32px;
  --ga-space-7: 48px;
  --ga-space-8: 64px;
}