/* Atlas — Typography tokens
 * Display: Newsreader (serif) · UI: Hanken Grotesk · Mono: IBM Plex Mono */
:root {
  --font-display: "Newsreader", "Spectral", Georgia, serif;
  --font-sans: "Hanken Grotesk", "Helvetica Neue", Arial, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;

  /* Type scale — dense internal-tool sizing */
  --fs-display-lg: 48px; --lh-display-lg: 52px;  /* hero numerals / page heroes */
  --fs-h1: 32px; --lh-h1: 38px;   /* page titles (display serif) */
  --fs-h2: 24px; --lh-h2: 30px;
  --fs-h3: 20px; --lh-h3: 26px;
  --fs-h4: 16px; --lh-h4: 22px;
  --fs-h5: 14px; --lh-h5: 20px;   /* sans, semibold */
  --fs-h6: 13px; --lh-h6: 18px;
  --fs-body-1: 13px; --lh-body-1: 18px;  /* default UI text */
  --fs-body-2: 12px; --lh-body-2: 16px;
  --fs-body-3: 11px; --lh-body-3: 15px;  /* meta / captions */

  /* Eyebrow / label tracking */
  --tracking-eyebrow: 0.16em;
  --tracking-caps: 0.06em;
}

/* Opt-in helpers (wrap content in .at-type) */
.at-type { font-family: var(--font-sans); color: var(--fg-2); font-size: var(--fs-body-1); line-height: var(--lh-body-1); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
.at-display { font-family: var(--font-display); font-weight: 500; color: var(--fg-1); line-height: 1.04; letter-spacing: -0.01em; }
.at-h1 { font-family: var(--font-display); font-weight: 600; font-size: var(--fs-h1); line-height: var(--lh-h1); letter-spacing: -0.01em; color: var(--fg-1); margin: 0; }
.at-h2 { font-family: var(--font-display); font-weight: 600; font-size: var(--fs-h2); line-height: var(--lh-h2); color: var(--fg-1); margin: 0; }
.at-h3 { font-family: var(--font-display); font-weight: 600; font-size: var(--fs-h3); line-height: var(--lh-h3); color: var(--fg-1); margin: 0; }
.at-h5 { font-family: var(--font-sans); font-weight: 600; font-size: var(--fs-h5); line-height: var(--lh-h5); color: var(--fg-1); margin: 0; }
.at-body { font-family: var(--font-sans); font-size: var(--fs-body-1); line-height: var(--lh-body-1); color: var(--fg-2); }
.at-meta { font-family: var(--font-sans); font-size: var(--fs-body-3); line-height: var(--lh-body-3); color: var(--fg-3); }
.at-mono { font-family: var(--font-mono); font-variant-numeric: tabular-nums; }
.at-num { font-family: var(--font-display); font-weight: 600; font-variant-numeric: tabular-nums; letter-spacing: -0.01em; }
.at-eyebrow { font-family: var(--font-sans); font-weight: 600; font-size: 10px; line-height: 1; letter-spacing: var(--tracking-eyebrow); text-transform: uppercase; color: var(--fg-accent); }