/* ============================================================================
   T3Bootstrap · Typography tokens
   Hanken Grotesk (body), Archivo (headings/display), JetBrains Mono (code).
   Mirrors the Bootstrap $headings / $font-size variables from the SCSS source.
   ============================================================================ */

@import url("https://fonts.googleapis.com/css2?family=Archivo:wght@400;500;600;700;800&family=Hanken+Grotesk:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;700&display=swap");

:root {
  /* — Families — */
  --ds-font-sans:    "Hanken Grotesk", system-ui, -apple-system, "Segoe UI", sans-serif;
  --ds-font-display: "Archivo", system-ui, sans-serif;
  --ds-font-mono:    "JetBrains Mono", ui-monospace, SFMono-Regular, monospace;

  /* — Base — */
  --ds-text-base:    1rem;      /* 16px */
  --ds-leading-base: 1.6;
  --ds-leading-tight:1.15;      /* headings */

  /* — Type scale (Bootstrap heading sizes from source) — */
  --ds-h1: 2.5rem;     /* 40px */
  --ds-h2: 2rem;       /* 32px */
  --ds-h3: 1.5rem;     /* 24px */
  --ds-h4: 1.25rem;    /* 20px */
  --ds-h5: 1.125rem;   /* 18px */
  --ds-h6: 1rem;       /* 16px */

  /* Display sizes (marketing) — Archivo, extra weight */
  --ds-display-1: 4.5rem;   /* 72px */
  --ds-display-2: 3.5rem;   /* 56px */
  --ds-display-3: 2.75rem;  /* 44px */

  /* Small / meta */
  --ds-text-sm: .875rem;   /* 14px */
  --ds-text-xs: .75rem;    /* 12px */
  --ds-lead:    1.25rem;   /* 20px lead paragraph */

  /* — Weights — */
  --ds-weight-normal:   400;
  --ds-weight-medium:   500;
  --ds-weight-semibold: 600;
  --ds-weight-bold:     700;
  --ds-weight-display:  800;
  --ds-heading-weight:  600;

  /* — Letter-spacing — */
  --ds-tracking-tight:  -0.02em;   /* display headlines */
  --ds-tracking-snug:   -0.01em;   /* headings */
  --ds-tracking-wide:    0.04em;   /* eyebrows / overline */
  --ds-tracking-caps:    0.08em;   /* all-caps labels */
}