:root {
  /* ---------- Font families ---------- */
  --font-display: 'Anton', 'Impact', sans-serif; /* bold, heavy — titles, hero lines, numerals */
  --font-serif: 'Epilogue', sans-serif;                        /* editorial voice — pull quotes, longform, taglines */
  --font-ui: 'Epilogue', sans-serif;            /* nav, labels, buttons, metadata */

  /* ---------- Display scale (condensed, tight leading, wide tracking on caps) ---------- */
  --text-display-xl: 400 clamp(72px, 10vw, 185px)/0.92 var(--font-display);
  --text-display-lg: 400 clamp(54px, 7vw, 120px)/0.94 var(--font-display);
  --text-display-md: 400 clamp(40px, 5vw, 72px)/0.98 var(--font-display);
  --text-display-sm: 400 clamp(32px, 3vw, 46px)/1.02 var(--font-display);

  /* ---------- Editorial / serif scale ---------- */
  --text-quote-lg: 500 clamp(28px, 3vw, 44px)/1.28 var(--font-serif);
  --text-body-lg: 300 19px/1.6 var(--font-serif);
  --text-body-md: 300 17px/1.6 var(--font-serif);

  /* ---------- UI scale ---------- */
  --text-ui-label: 600 13px/1.2 var(--font-ui);
  --text-ui-nav: 500 15px/1.2 var(--font-ui);
  --text-ui-button: 600 14px/1 var(--font-ui);
  --text-ui-caption: 500 12px/1.4 var(--font-ui);
  --text-ui-eyebrow: 600 12px/1 var(--font-ui);

  /* ---------- Tracking ---------- */
  --tracking-tight: -0.01em;
  --tracking-normal: 0;
  --tracking-wide: 0.06em;
  --tracking-wider: 0.14em;
  --tracking-widest: 0.24em;
}
