/* ===========================================================================
   Get Responsive — Spacing, radii & sizing tokens
   Generous white space ("witruimte" / breathing room). Sections breathe at
   ~96px; cards sit on an 8px rhythm.
   =========================================================================== */
:root {
  /* ---- Spacing scale (8px rhythm) ---- */
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  20px;
  --space-6:  24px;
  --space-8:  32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;   /* default vertical section padding */

  /* ---- Radii ---- */
  --radius-sm:   6px;    /* eyebrow number chip, small tags */
  --radius-md:   10px;   /* buttons */
  --radius-lg:   14px;   /* cards */
  --radius-xl:   18px;   /* large panels / hero blocks (the brand default --r) */
  --radius-2xl:  20px;   /* feature bands */
  --radius-pill: 30px;   /* pills, toasts */

  /* ---- Borders ---- */
  --border-width: 1.5px; /* the brand's signature hairline */

  /* ---- Layout ---- */
  --content-max: 1180px; /* max content width */
  --content-pad: 28px;   /* horizontal gutter */
}