:root {
  --font-display: "Bagel Fat One", "Chicle", "Baloo 2", system-ui, sans-serif;
  --font-sans: "Figtree", ui-sans-serif, system-ui, sans-serif;
  --font-mono: "DM Mono", ui-monospace, SFMono-Regular, monospace;

  /* Display — the groovy wordmark voice. Uppercase, tight, never long-form. */
  --text-display-1: 76px;
  --text-display-2: 56px;
  --text-display-3: 40px;
  --text-display-4: 28px;
  --leading-display: 0.92;
  --tracking-display: 0.01em;

  /* Headings & body — Figtree */
  --text-h1: 40px;
  --text-h2: 30px;
  --text-h3: 22px;
  --text-h4: 18px;
  --text-lg: 19px;
  --text-md: 16px;
  --text-sm: 14px;
  --text-xs: 12.5px;
  --leading-tight: 1.15;
  --leading-snug: 1.3;
  --leading-body: 1.55;
  --leading-loose: 1.7;

  /* Mono label / eyebrow */
  --text-label: 12px;
  --tracking-label: 0.14em;

  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;
  --weight-black: 800;

  /* Semantic aliases */
  --type-hero: var(--weight-regular) var(--text-display-1) / var(--leading-display) var(--font-display);
  --type-section-title: var(--weight-bold) var(--text-h2) / var(--leading-tight) var(--font-sans);
  --type-body: var(--weight-regular) var(--text-md) / var(--leading-body) var(--font-sans);
  --type-body-lg: var(--weight-regular) var(--text-lg) / var(--leading-body) var(--font-sans);
  --type-ui: var(--weight-semibold) var(--text-sm) / 1.2 var(--font-sans);
  --type-eyebrow: var(--weight-medium) var(--text-label) / 1.2 var(--font-mono);
}
