/* ============================================================
   7 Tones · Typography
   One family does everything: Fraunces, a variable serif, kept
   at light weights (300/400) with negative tracking on display
   sizes and the SOFT axis engaged on the largest headings so
   they feel hand-set rather than mechanical. Labels & eyebrows
   are the one exception: lowercase, small, widely letter-spaced.
   ============================================================ */

:root {
  /* ---- Families ---- */
  --font-serif: 'Fraunces', Georgia, 'Times New Roman', serif;
  --font-sc:    'Noto Serif SC', 'Fraunces', Georgia, serif; /* Chinese */
  --font-display: var(--font-serif);
  --font-body:    var(--font-serif);

  /* ---- Variable-font axis presets ---- */
  --fvs-display: 'opsz' 144, 'SOFT' 50; /* @kind other */
  --fvs-heading: 'opsz' 144; /* @kind other */

  /* ---- Weights (the brand lives at light) ---- */
  --weight-light:   300;   /* display & lede */
  --weight-regular: 400;   /* headings, body emphasis, buttons */
  --weight-medium:  500;   /* rare, for tiny emphasis */

  /* ---- Type scale (px) ---- */
  --text-hero:    72px;   /* homepage h1 */
  --text-display: 64px;   /* page heroes, big CTAs */
  --text-h1:      56px;
  --text-h2:      48px;
  --text-h3:      38px;
  --text-h4:      28px;
  --text-title:   22px;   /* card / program titles, brand */
  --text-lede:    20px;   /* intros (often italic) */
  --text-body-lg: 17px;
  --text-base:    16px;
  --text-sm:      15px;
  --text-xs:      14px;
  --text-label:   13px;   /* eyebrows / section labels */
  --text-micro:   11px;   /* tiny program labels */

  /* ---- Line heights ---- */
  --leading-tight:   1.05;  /* display */
  --leading-snug:    1.2;
  --leading-normal:  1.5;
  --leading-relaxed: 1.7;   /* body copy */
  --leading-loose:   1.75;

  /* ---- Tracking ---- */
  --tracking-display: -0.025em;  /* big headings pull in */
  --tracking-tight:   -0.015em;
  --tracking-normal:  0;
  --tracking-wide:    0.04em;    /* buttons / links */
  --tracking-label:   0.25em;    /* eyebrows / labels */
  --tracking-label-lg:0.3em;     /* section labels */
}