/* ============================================================
   MINALE BARLOW — Typography
   Three voices:
   1. Graphik Compact — everything structural (display → body).
      Condensed grotesque, set tight and big for headlines.
   2. Instrument Serif — the "BARLOW" half of the wordmark and
      editorial italic emphasis. Used as a counterpoint, never body.
   3. Space Mono — broadcast furniture: eyebrows, timecodes,
      channel labels, nav. ALWAYS uppercase + wide tracking.
   ============================================================ */
:root{
  /* ---- Families ---- */
  --font-sans:    'Graphik Compact', system-ui, -apple-system, sans-serif;
  --font-display: 'Graphik Compact', system-ui, sans-serif;   /* same face, set huge */
  --font-serif:   'Instrument Serif', Georgia, 'Times New Roman', serif;
  --font-mono:    'Space Mono', ui-monospace, 'SFMono-Regular', monospace;

  /* ---- Weights ---- */
  --fw-light:    300; /* @kind font */
  --fw-regular:  400; /* @kind font */
  --fw-medium:   500; /* @kind font */
  --fw-semibold: 600; /* @kind font */
  --fw-bold:     700; /* @kind font */
  --fw-black:    800; /* @kind font */
  --fw-super:    900; /* @kind font */

  /* ---- Display / heading scale (fluid, set TIGHT) ---- */
  --text-hero:   clamp(70px, 11vw, 168px);  /* page hero — Super, line .86 */
  --text-d1:     clamp(54px, 8vw, 110px);   /* big titles */
  --text-d2:     clamp(40px, 6.5vw, 90px);  /* section / episode titles */
  --text-d3:     clamp(30px, 4vw, 56px);    /* sub-headings */
  --text-quote:  clamp(26px, 3.6vw, 46px);  /* pull quotes / synopsis */

  /* ---- Body scale ---- */
  --text-xl:   22px;
  --text-lg:   19px;
  --text-md:   17px;   /* base body */
  --text-sm:   15px;
  --text-xs:   13px;

  /* ---- Mono / label scale (broadcast furniture) ---- */
  --text-eyebrow: 12px;
  --text-label:   11.5px;
  --text-tc:      12px;   /* timecodes */

  /* ---- Line heights ---- */
  --lh-tight:   0.9;    /* @kind other */
  --lh-snug:    1.12;   /* @kind other */
  --lh-normal:  1.5;    /* @kind other */

  /* ---- Tracking ---- */
  --track-display: -0.01em;  /* @kind other */
  --track-body:     0;       /* @kind other */
  --track-eyebrow:  0.28em;   /* @kind other */
  --track-label:    0.16em;   /* @kind other */
}

/* ---- Reusable type roles ---- */
.mb-hero{
  font-family:var(--font-display); font-weight:var(--fw-super);
  font-size:var(--text-hero); line-height:var(--lh-tight);
  letter-spacing:var(--track-display); text-transform:uppercase;
}
.mb-display{
  font-family:var(--font-display); font-weight:var(--fw-black);
  font-size:var(--text-d2); line-height:var(--lh-tight);
  letter-spacing:var(--track-display); text-transform:uppercase;
}
.mb-quote{
  font-family:var(--font-serif); font-weight:var(--fw-regular);
  font-size:var(--text-quote); line-height:var(--lh-snug); font-style:italic;
}
.mb-body{
  font-family:var(--font-sans); font-weight:var(--fw-regular);
  font-size:var(--text-md); line-height:var(--lh-normal);
}
.mb-eyebrow{
  font-family:var(--font-mono); font-weight:var(--fw-bold);
  font-size:var(--text-eyebrow); letter-spacing:var(--track-eyebrow);
  text-transform:uppercase; color:var(--neon);
}
.mb-label{
  font-family:var(--font-mono); font-weight:var(--fw-regular);
  font-size:var(--text-label); letter-spacing:var(--track-label);
  text-transform:uppercase; color:var(--chalk-dim);
}
.mb-tc{
  font-family:var(--font-mono); font-size:var(--text-tc);
  font-variant-numeric:tabular-nums; font-feature-settings:"tnum" 1;
  letter-spacing:0;
}
