/* ============================================================
   SPACING & LAYOUT  —  Transducer Media
   "Wide margins — let the page breathe."
   A calm 4px base step; layouts lean on the larger end of the scale.
   ============================================================ */
:root {
  --space-0:  0;
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  24px;
  --space-6:  32px;
  --space-7:  48px;
  --space-8:  64px;
  --space-9:  96px;
  --space-10: 128px;
  --space-11: 160px;

  /* Semantic rhythm */
  --gap-tight:    var(--space-2);
  --gap:          var(--space-4);
  --gap-loose:    var(--space-6);
  --section-gap:  var(--space-9);   /* vertical air between page sections */
  --kicker-gap:   var(--space-4);   /* kicker → hairline → headline       */

  /* Page frame — the wide, breathing margins of the brand book */
  --page-margin:   clamp(24px, 6vw, 120px);
  --measure:       66ch;            /* comfortable reading column          */
  --measure-tight: 46ch;            /* lead / intro paragraphs             */
  --content-max:   1240px;

  /* The hairline that follows every kicker */
  --hairline-w: 48px;
}