/* =========================================================
   Spacing & layout
   ========================================================= */
:root {
  --space-1: 4px;
  --space-2: 6px;
  --space-3: 8px;
  --space-4: 12px;
  --space-5: 16px;
  --space-6: 18px;
  --space-7: 20px;
  --space-8: 24px;
  --space-9: 28px;
  --space-10: 32px;
  --space-12: 40px;
  --space-14: 48px;
  --space-16: 56px;
  --space-18: 64px;
  --space-20: 80px;

  /* containers */
  --container: 1320px;
  --container-wide: 1500px;
  --gutter: 32px;
  --gutter-wide: 40px;
  --gutter-mobile: 16px;

  /* section rhythm */
  --section-pad: 96px;
  --section-pad-feature: 110px;
  --section-pad-block: 72px;
  --section-pad-tight: 60px;
  --section-pad-mobile: 64px;

  /* grid gaps */
  --gap-mosaic: 6px;
  --gap-card: 24px;
  --gap-card-tight: 20px;
  --gap-feature: 28px;
  --gap-split: 80px;
  --gap-cta: 12px;

  /* the three-part section stack */
  --stack-eyebrow-title: 16px;
  --stack-title-sub: 18px;
  --stack-sub-cta: 26px;

  /* breakpoints (reference values) */
  --bp-xl: 1180px;
  --bp-lg: 1100px;
  --bp-md: 900px;
  --bp-sm: 720px;
  --bp-xs: 640px;
}