/* ---------------------------------------------------------------
   Spacing, radii, shadows, motion — generous, calm, accessible
   (older-adult audience → generous spacing & large hit targets)
   --------------------------------------------------------------- */

:root {
  --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;

  /* Section rhythm on the marketing site */
  --section-padding-y: var(--space-9);
  --section-padding-y-mobile: var(--space-7);
  --container-width: 1160px;
  --container-padding-x: var(--space-5);

  /* Radii — soft, rounded, friendly (not sharp, not pill-everything) */
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --radius-pill: 999px;

  /* Shadows — soft, low-contrast, warm-tinted (never harsh black) */
  --shadow-sm: 0 1px 3px rgba(26, 41, 36, 0.08);
  --shadow-md: 0 8px 24px rgba(26, 41, 36, 0.10);
  --shadow-lg: 0 20px 48px rgba(26, 41, 36, 0.14);
  --shadow-hover: 0 16px 32px rgba(61, 107, 93, 0.18);

  /* Hit targets — 44px minimum per brief (elderly-friendly accessibility) */
  --hit-target-min: 44px;

  /* Motion — short, calm, ease-out entrances per brief (<300ms) */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1); /* @kind other */
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1); /* @kind other */
  --duration-fast: 100ms; /* @kind other */
  --duration-base: 150ms; /* @kind other */
  --duration-entrance: 200ms; /* @kind other */
  --duration-slow: 300ms; /* @kind other */
}