/* ============================================================
   Vates Design System — tokens + identity font
   Single source of truth, linked by index.html and every aux page.
   Adapted from the Claude Design handoff (2026-06-11). The one change
   from the handoff: Saira is SELF-HOSTED (woff2 below), NOT loaded from
   the Google Fonts CDN. This preserves our privacy posture — the site
   makes zero third-party requests, so the cookie/privacy texts can keep
   saying "no third-party scripts are loaded" and no visitor IP is sent
   to Google (GDPR-relevant for a France-established operator).
   ============================================================ */

/* ---- Identity font: Saira, self-hosted variable woff2 (weights 400–800) ---- */
@font-face {
  font-family: "Saira";
  font-style: normal;
  font-weight: 400 800;          /* variable axis range */
  font-display: swap;
  src: url("fonts/saira-latin.woff2") format("woff2");
}

:root {
  /* ============ Colours ============ */
  --vt-bg:        #0b0d12;
  --vt-panel:     #14171f;
  --vt-panel-2:   #1b1f2a;
  --vt-line:      #272c39;
  --vt-track:     #252b39;
  --vt-field:     #0f131b;

  --vt-text:      #eef1f6;
  --vt-text-2:    #dfe4ec;
  --vt-muted:     #98a0af;
  --vt-faint:     #6b7384;

  --vt-accent:        #f0883e;
  --vt-accent-ink:    #1a1208;
  --vt-accent-soft:   rgba(240,136,62,.14);
  --vt-accent-line:   rgba(240,136,62,.16);

  --vt-blue:        #4c8bf5;
  --vt-blue-soft:   rgba(76,139,245,.10);
  --vt-blue-line:   #2a3a5c;

  --vt-ok:        #3fb950;
  --vt-bad:       #f85149;
  --vt-warn:      #f0c08a;
  --vt-bad-line:  #5b2a2a;

  --vt-shadow:        0 6px 24px rgba(0,0,0,.35);
  --vt-shadow-pop:    0 24px 60px rgba(0,0,0,.5);
  --vt-shadow-menu:   0 18px 50px rgba(0,0,0,.5);
  --vt-glow-accent:   0 0 14px var(--vt-accent);

  --vt-backdrop:   radial-gradient(1200px 600px at 80% -200px, #1a2030 0, var(--vt-bg) 60%);
  --vt-panel-grad: linear-gradient(180deg, var(--vt-panel-2), var(--vt-panel));

  --focus-ring:    0 0 0 3px rgba(76,139,245,.14);

  /* ============ Typography ============ */
  --vt-font-ui: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --vt-font-display: "Saira", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --vt-font-num: var(--vt-font-display);
  --vt-tracking-wordmark: 0.06em;

  --vt-fs-display: 35px;
  --vt-fs-h1:      26px;
  --vt-fs-h2:      23px;
  --vt-fs-h3:      19px;
  --vt-fs-stat:    21px;
  --vt-fs-lead:    16px;
  --vt-fs-body:    15px;
  --vt-fs-sm:      14px;
  --vt-fs-13:      13px;
  --vt-fs-12:      12px;
  --vt-fs-label:   11px;
  --vt-fs-micro:   10px;

  --vt-fw-regular: 400;
  --vt-fw-medium:  500;
  --vt-fw-semi:    600;
  --vt-fw-bold:    700;
  --vt-fw-heavy:   800;

  --vt-lh-tight:  1.05;
  --vt-lh-snug:   1.25;
  --vt-lh-body:   1.5;
  --vt-lh-prose:  1.6;

  --vt-tracking-display: -0.02em;
  --vt-tracking-tight:   -0.01em;
  --vt-tracking-label:    0.06em;
  --vt-tracking-chip:     0.03em;

  /* ============ Spacing / radii / borders / motion ============ */
  --vt-space-1: 4px;  --vt-space-2: 6px;  --vt-space-3: 8px;  --vt-space-4: 11px;
  --vt-space-5: 14px; --vt-space-6: 16px; --vt-space-7: 20px; --vt-space-8: 24px;
  --vt-space-9: 28px; --vt-space-10: 40px;

  --vt-radius-xs:   6px;
  --vt-radius-sm:   9px;
  --vt-radius-md:   10px;
  --vt-radius-lg:   12px;
  --vt-radius-xl:   14px;
  --vt-radius-2xl:  16px;
  --vt-radius-3xl:  20px;
  --vt-radius-pill: 20px;
  --vt-radius-full: 999px;

  --vt-border:        1px solid var(--vt-line);
  --vt-border-accent: 1px solid var(--vt-accent);

  --vt-ease-pop:    cubic-bezier(.2,.9,.3,1.2);
  --vt-ease-slide:  cubic-bezier(.22,.75,.25,1);
  --vt-dur-fast:    .12s;
  --vt-dur:         .15s;
  --vt-dur-slow:    .3s;
  --vt-dur-boot:    .5s;

  --vt-hover-rule:  inset 2px 0 0 var(--vt-accent);
  --vt-hover-ring:  inset 0 0 0 1px var(--vt-accent);
  --vt-press:       translateY(1px) scale(.985);

  --vt-header-h:    64px;
  --vt-maxw-app:    1140px;
  --vt-maxw-doc:    860px;
  --vt-maxw-form:   460px;

  /* ============ Team colours (BR 3-letter codes) ============ */
  --team-atl: #E03A3E;  --team-bos: #10823F;  --team-brk: #0A0A0A;  --team-cho: #00868D;
  --team-chi: #CE1141;  --team-cle: #860038;  --team-dal: #0053BC;  --team-den: #0E2240;
  --team-det: #C8102E;  --team-gsw: #1D428A;  --team-hou: #CE1141;  --team-ind: #FDBB30;
  --team-lac: #C8102E;  --team-lal: #552583;  --team-mem: #5D76A9;  --team-mia: #98002E;
  --team-mil: #00471B;  --team-min: #236192;  --team-nop: #0C2340;  --team-nyk: #F58426;
  --team-okc: #007AC1;  --team-orl: #0077C0;  --team-phi: #1D428A;  --team-pho: #E56020;
  --team-por: #E03A3E;  --team-sac: #5A2D81;  --team-sas: #8A8D8F;  --team-tor: #CE1141;
  --team-uta: #3E2680;  --team-was: #002B5C;  --team-none: #5b6472;
}
