/* ============================================================
   VINDICOR — Typography tokens
   Display: Saira (technical squared sans, echoes the wordmark)
   Body:    Barlow (humanist industrial sans)
   Mono:    JetBrains Mono (specs, telemetry, code)
   ============================================================ */
:root {
  /* Families */
  --font-display: 'Saira', 'Barlow', system-ui, sans-serif;
  --font-body: 'Barlow', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, 'SFMono-Regular', monospace;

  /* Weights */
  --fw-regular: 400;   /* @kind other */
  --fw-medium: 500;    /* @kind other */
  --fw-semibold: 600;  /* @kind other */
  --fw-bold: 700;      /* @kind other */
  --fw-extrabold: 800; /* @kind other */

  /* ---- Display scale (Saira) ---- */
  /* Display headings are uppercase-friendly with positive tracking,
     evoking the wordmark. Use sentence case for long-form headers. */
  --type-display-xl: var(--fw-bold) 64px/1.02 var(--font-display);
  --type-display-lg: var(--fw-bold) 48px/1.06 var(--font-display);
  --type-display-md: var(--fw-semibold) 36px/1.1 var(--font-display);
  --type-display-sm: var(--fw-semibold) 28px/1.15 var(--font-display);

  /* ---- Headline scale (Saira) ---- */
  --type-title-lg: var(--fw-semibold) 22px/1.25 var(--font-display);
  --type-title-md: var(--fw-semibold) 18px/1.3 var(--font-display);
  --type-title-sm: var(--fw-semibold) 16px/1.35 var(--font-display);

  /* ---- Body scale (Barlow) ---- */
  --type-body-lg: var(--fw-regular) 18px/1.6 var(--font-body);
  --type-body-md: var(--fw-regular) 16px/1.6 var(--font-body);
  --type-body-sm: var(--fw-regular) 14px/1.55 var(--font-body);
  --type-label: var(--fw-medium) 14px/1.4 var(--font-body);
  --type-label-sm: var(--fw-medium) 13px/1.4 var(--font-body);

  /* ---- Utility / mono ---- */
  --type-overline: var(--fw-semibold) 12px/1.4 var(--font-display);
  --type-caption: var(--fw-regular) 13px/1.45 var(--font-body);
  --type-mono: var(--fw-regular) 14px/1.6 var(--font-mono);
  --type-mono-sm: var(--fw-regular) 12px/1.5 var(--font-mono);
  --type-button: var(--fw-semibold) 14px/1 var(--font-display);

  /* ---- Letter-spacing ---- */
  --tracking-display: -0.01em;  /* tighten large Saira */
  --tracking-tight: -0.005em;
  --tracking-normal: 0;
  --tracking-wide: 0.04em;
  --tracking-overline: 0.16em;  /* uppercase overlines / wordmark feel */
  --tracking-button: 0.04em;
}