/* ════════════════════════════════════════════════════════════════
   SuperCat Design System — Spacing tokens
   ────────────────────────────────────────────────────────────────
   4-px base scale. Use --space-N where N is the multiplier.
   Layout containers (gutter, max-width) live here too.
   ════════════════════════════════════════════════════════════════ */

:root {
  /* ── 4-px base scale ── */
  --space-0:   0;
  --space-1:   4px;
  --space-2:   8px;
  --space-3:   12px;
  --space-4:   16px;
  --space-5:   20px;
  --space-6:   24px;
  --space-7:   28px;
  --space-8:   32px;
  --space-9:   36px;
  --space-10:  40px;
  --space-12:  48px;
  --space-14:  56px;
  --space-16:  64px;
  --space-20:  80px;
  --space-24:  96px;
  --space-28:  112px;
  --space-32:  128px;
  --space-40:  160px;
  --space-48:  192px;

  /* ── Containers ── */
  --container-max:    1240px;
  --container-narrow: 880px;
  --container-wide:   1480px;

  /* ── Page gutter (responsive) ── */
  --gutter: clamp(20px, 4vw, 56px);

  /* ── Section rhythm ── */
  --section-y:  clamp(48px, 6vw, 80px);
  --chapter-y:  clamp(72px, 9vw, 128px);
}