/* ─────────────────────────────────────────────────────────────────────────
 * TYPOGRAPHY TOKENS — mirrored from bolt-ds semantic/typography.ts.
 *
 * Five roles encode VOICE, not just size:
 *   display   → Tiempos Headline (serif)   — hero / brand / personal-name highlight
 *   heading   → Founders Grotesk Medium    — section / card / row titles
 *   paragraph → Founders Grotesk Regular   — body / subtitle / description
 *   label     → Founders Grotesk Medium    — chips, tabs, badges, UI chrome
 *   textLink  → Founders Grotesk Medium    — inline links (underlined)
 *
 * WEIGHT RULE: Founders Grotesk is used in TWO weights only — Regular (400)
 * and Medium (500). NEVER Bold or Semibold. The brand has no bold sans;
 * emphasis comes from Medium, poppy colour, or the italic Tiempos highlight
 * — never a heavier sans weight (no `<b>`/`<strong>`, no font-weight ≥ 600).
 *
 * Italic Tiempos is the brand's first-name highlight pattern ("Shani").
 * ───────────────────────────────────────────────────────────────────────── */

:root {
  --font-display: 'Tiempos Headline', ui-serif, Georgia, 'Times New Roman', serif;
  --font-sans: 'Founders Grotesk', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  --font-mono: 'Courier New', ui-monospace, monospace;

  --weight-regular: 400;
  --weight-medium: 500;
  /* No semibold / bold: Founders Grotesk is Regular + Medium ONLY (see WEIGHT
   * RULE above). Medium is the heaviest sans weight the brand uses. */

  --tracking-tighter: -0.6px;
  --tracking-tight: -0.3px;
  --tracking-normal: 0;
  --tracking-wide: 0.3px;
  --tracking-wider: 0.6px;
}

/* ── Display — Tiempos Headline Medium (serif) ───────────────────────── */
.t-display-xxl, .t-display-xl, .t-display-l, .t-display-m,
.t-display-s, .t-display-xs, .t-display-xxs {
  font-family: var(--font-display);
  font-weight: var(--weight-medium);
  letter-spacing: 0;
  color: var(--color-neutral-text);
  margin: 0;
}
.t-display-xxl { font-size: 48px; line-height: 54px; }
.t-display-xl  { font-size: 44px; line-height: 46px; }
.t-display-l   { font-size: 36px; line-height: 44px; }
.t-display-m   { font-size: 32px; line-height: 39px; }
.t-display-s   { font-size: 24px; line-height: 29px; }
.t-display-xs  { font-size: 20px; line-height: 24px; }
.t-display-xxs { font-size: 18px; line-height: 20px; }
.t-italic { font-style: italic; }

/* ── Heading — Founders Grotesk Medium ───────────────────────────────── */
.t-heading-xl, .t-heading-l, .t-heading-m, .t-heading-s {
  font-family: var(--font-sans);
  font-weight: var(--weight-medium);
  letter-spacing: 0;
  color: var(--color-neutral-text);
  margin: 0;
}
.t-heading-xl { font-size: 28px; line-height: 33px; }
.t-heading-l  { font-size: 26px; line-height: 28px; }
.t-heading-m  { font-size: 20px; line-height: 22px; }
.t-heading-s  { font-size: 18px; line-height: 21px; }

/* ── Paragraph — Founders Grotesk Regular ────────────────────────────── */
.t-paragraph-l, .t-paragraph-m, .t-paragraph-s, .t-paragraph-xs {
  font-family: var(--font-sans);
  font-weight: var(--weight-regular);
  letter-spacing: 0;
  color: var(--color-neutral-text);
  margin: 0;
}
.t-paragraph-l  { font-size: 18px; line-height: 20px; }
.t-paragraph-m  { font-size: 16px; line-height: 18px; }
.t-paragraph-s  { font-size: 14px; line-height: 16px; }
.t-paragraph-xs { font-size: 12px; line-height: 18px; }

/* ── Label — Founders Grotesk Medium ─────────────────────────────────── */
.t-label-l, .t-label-m, .t-label-s, .t-label-xs {
  font-family: var(--font-sans);
  font-weight: var(--weight-medium);
  letter-spacing: 0;
  color: var(--color-neutral-text);
  margin: 0;
}
.t-label-l  { font-size: 18px; line-height: 22px; }
.t-label-m  { font-size: 16px; line-height: 19px; }
.t-label-s  { font-size: 14px; line-height: 18px; }
.t-label-xs { font-size: 12px; line-height: 15px; }

/* ── Text link — underlined ──────────────────────────────────────────── */
.t-link-m, .t-link-s {
  font-family: var(--font-sans);
  font-weight: var(--weight-medium);
  text-decoration: underline;
  color: var(--color-neutral-text);
  margin: 0;
}
.t-link-m { font-size: 16px; line-height: 19px; }
.t-link-s { font-size: 14px; line-height: 18px; }