:root {
  --font-display: "Zilla Slab", "Bitter", Georgia, serif;
  --font-sans: "Source Sans 3", "Segoe UI", system-ui, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, monospace;

  /* Type scale — 1.25 major third, 16px base */
  --text-2xs: 0.6875rem; /* 11 — legal, ticket fine print */
  --text-xs: 0.75rem;    /* 12 — labels, meta */
  --text-sm: 0.875rem;   /* 14 — dense UI, table */
  --text-base: 1rem;     /* 16 — body */
  --text-md: 1.125rem;   /* 18 — lead body */
  --text-lg: 1.375rem;   /* 22 — card title */
  --text-xl: 1.75rem;    /* 28 — section head */
  --text-2xl: 2.25rem;   /* 36 — page head */
  --text-3xl: 3rem;      /* 48 — hero */
  --text-4xl: 4rem;      /* 64 — marketing hero */

  --leading-tight: 1.06;
  --leading-snug: 1.22;
  --leading-normal: 1.5;
  --leading-relaxed: 1.65;

  --tracking-tight: -0.015em;
  --tracking-normal: 0;
  --tracking-wide: 0.04em;
  --tracking-caps: 0.10em;

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

  /* Semantic roles */
  --type-hero-family: var(--font-display);
  --type-hero-size: var(--text-4xl);
  --type-hero-weight: var(--weight-bold);
  --type-hero-leading: var(--leading-tight);
  --type-hero-tracking: var(--tracking-tight);

  --type-heading-family: var(--font-display);
  --type-heading-weight: var(--weight-semibold);
  --type-heading-leading: var(--leading-snug);

  --type-body-family: var(--font-sans);
  --type-body-size: var(--text-base);
  --type-body-leading: var(--leading-relaxed);

  --type-label-family: var(--font-sans);
  --type-label-size: var(--text-xs);
  --type-label-weight: var(--weight-semibold);
  --type-label-tracking: var(--tracking-caps);

  --type-price-family: var(--font-display);
  --type-price-weight: var(--weight-bold);
  --type-code-family: var(--font-mono);
  --type-code-tracking: var(--tracking-wide);
}