/* ============================================================
   UR-system — Typography tokens
   Display serif (Source Serif 4) + UI sans (Hanken Grotesk)
   + mono (JetBrains Mono) for codes & numbers.
   ============================================================ */

:root {
  /* ---- Families ------------------------------------------- */
  --font-serif: "Source Serif 4", Georgia, "Times New Roman", serif;
  --font-sans: "Hanken Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;

  /* ---- Weights -------------------------------------------- */
  --fw-regular: 400;   /* @kind font */
  --fw-medium: 500;    /* @kind font */
  --fw-semibold: 600;  /* @kind font */
  --fw-bold: 700;      /* @kind font */
  --fw-extrabold: 800; /* @kind font */

  /* ---- Type scale (rem on a 16px base) -------------------- */
  --text-xs: 0.75rem;     /* 12 — meta, captions */
  --text-sm: 0.8125rem;   /* 13 — secondary UI text */
  --text-base: 0.875rem;  /* 14 — body / form text (UI default) */
  --text-md: 1rem;        /* 16 — emphasised body */
  --text-lg: 1.125rem;    /* 18 — card titles */
  --text-xl: 1.375rem;    /* 22 — section headings */
  --text-2xl: 1.75rem;    /* 28 — page titles */
  --text-3xl: 2.25rem;    /* 36 — display */
  --text-4xl: 3rem;       /* 48 — hero display */

  /* ---- Line heights --------------------------------------- */
  --leading-tight: 1.15;
  --leading-snug: 1.3;
  --leading-normal: 1.5;
  --leading-relaxed: 1.65;

  /* ---- Letter spacing ------------------------------------- */
  --tracking-tight: -0.02em;   /* large serif display */
  --tracking-normal: 0;
  --tracking-wide: 0.04em;     /* small-caps labels */
  --tracking-wider: 0.08em;    /* eyebrow / uppercase tags */

  /* ---- Semantic roles ------------------------------------- */
  --display-font: var(--font-serif);
  --display-weight: var(--fw-semibold);
  --display-tracking: var(--tracking-tight);

  --heading-font: var(--font-sans);
  --heading-weight: var(--fw-bold);

  --body-font: var(--font-sans);
  --body-weight: var(--fw-regular);

  --label-font: var(--font-sans);
  --label-weight: var(--fw-semibold);

  --code-font: var(--font-mono);
}