/* ==========================================================================
   Blend — Typography scale
   --------------------------------------------------------------------------
   One family (District Sans → Hanken Grotesk). Headlines run heavy (800/900)
   and tight; body runs 400/500 at comfortable line-height. Display sizes use a
   ~1.25 modular scale. Tracking tightens as size grows.
   ========================================================================== */

:root {
  /* Font-size scale */
  --text-2xs:  0.6875rem;  /* 11px — legal, micro labels   */
  --text-xs:   0.75rem;    /* 12px — captions, eyebrows    */
  --text-sm:   0.875rem;   /* 14px — secondary / UI meta   */
  --text-base: 1rem;       /* 16px — body                  */
  --text-md:   1.125rem;   /* 18px — lead body             */
  --text-lg:   1.375rem;   /* 22px — subheads              */
  --text-xl:   1.75rem;    /* 28px — H3                    */
  --text-2xl:  2.25rem;    /* 36px — H2                    */
  --text-3xl:  3rem;       /* 48px — H1                    */
  --text-4xl:  4rem;       /* 64px — display               */
  --text-5xl:  5.5rem;     /* 88px — hero / slide titles   */
  --text-6xl:  7.5rem;     /* 120px — poster               */

  /* Line-height */
  --leading-none:    1;
  --leading-tight:   1.08;
  --leading-snug:    1.2;
  --leading-normal:  1.5;
  --leading-relaxed: 1.65;

  /* Letter-spacing */
  --tracking-tight:  -0.03em;   /* big display              */
  --tracking-snug:   -0.015em;  /* headings                 */
  --tracking-normal: 0;
  --tracking-wide:   0.04em;
  --tracking-eyebrow: 0.14em;   /* uppercase eyebrows       */

  /* Semantic roles (shorthand: weight size/line family) */
  --type-hero:    var(--weight-ultra) var(--text-5xl)/var(--leading-none) var(--font-display);
  --type-display: var(--weight-black) var(--text-4xl)/var(--leading-tight) var(--font-display);
  --type-h1:      var(--weight-black) var(--text-3xl)/var(--leading-tight) var(--font-display);
  --type-h2:      var(--weight-bold)  var(--text-2xl)/var(--leading-snug) var(--font-display);
  --type-h3:      var(--weight-bold)  var(--text-xl)/var(--leading-snug) var(--font-display);
  --type-lead:    var(--weight-regular) var(--text-md)/var(--leading-relaxed) var(--font-body);
  --type-body:    var(--weight-regular) var(--text-base)/var(--leading-normal) var(--font-body);
  --type-meta:    var(--weight-semibold) var(--text-sm)/var(--leading-normal) var(--font-body);
}