/* ============================================================
   typography.css — PBB type system
   Newsreader (editorial serif) for headlines · Hanken Grotesk
   (body) · JetBrains Mono (eyebrows / labels / stats) ·
   Instrument Serif / Anton / Bricolage for the cinematic deck.
   ============================================================ */
:root{
  /* ---- Families ---- */
  --pbb-font-serif:   "Newsreader", Georgia, serif;          /* landing headlines */
  --pbb-font-display: "Instrument Serif", Georgia, serif;    /* cinematic deck display */
  --pbb-font-display-alt: "Anton", "Hanken Grotesk", sans-serif;   /* poster-weight deck */
  --pbb-font-grotesque: "Bricolage Grotesque", "Hanken Grotesk", sans-serif;
  --pbb-font-body:    "Hanken Grotesk", system-ui, sans-serif;
  --pbb-font-mono:    "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;
  --pbb-font-ui:      "Roboto", system-ui, sans-serif;       /* YouTube replica */
  --pbb-font-hand:    "Caveat", ui-rounded, cursive;         /* hand-jotted notes */

  /* ---- Display / heading scale (clamp = fluid) ---- */
  --pbb-text-display: clamp(40px, 8vw, 128px);  /* hero story lede */
  --pbb-text-h1:      clamp(34px, 5.2vw, 56px); /* landing h1 */
  --pbb-text-h2:      clamp(27px, 3.6vw, 40px); /* landing h2 */
  --pbb-text-h3:      24px;                      /* card / founder headings */
  --pbb-text-lead:    18px;                      /* lead paragraph */
  --pbb-text-body:    16px;                      /* default body */
  --pbb-text-sm:      14px;
  --pbb-text-eyebrow: 12px;                      /* mono eyebrow */
  --pbb-text-micro:   11px;                      /* mono micro-label */

  /* ---- Weights ---- */
  --pbb-weight-serif:   400;   /* Newsreader headlines run light */
  --pbb-weight-body:    400;
  --pbb-weight-medium:  500;
  --pbb-weight-bold:    700;
  --pbb-weight-black:   800;   /* Hanken CTA / arrow headings */

  /* ---- Tracking ---- */
  --pbb-track-serif:   -.015em;   /* tighten the serif headlines */
  --pbb-track-display: -.01em;
  --pbb-track-eyebrow: .2em;      /* wide mono eyebrows */
  --pbb-track-mono:    .1em;

  /* ---- Line heights ---- */
  --pbb-leading-display: 1.0;
  --pbb-leading-head:    1.1;
  --pbb-leading-body:    1.6;
}