/* ==========================================================================
   Arvo — Spacing, radii, borders, shadows, motion
   Section rhythm derives from the landing page: pages breathe with large
   vertical padding; cards & pills use generous full/large radii.
   ========================================================================== */

:root {
  /* ---- Spacing scale (4px base) ------------------------------------------ */
  --space-1: 0.25rem;   /* 4px  */
  --space-2: 0.5rem;    /* 8px  */
  --space-3: 0.75rem;   /* 12px */
  --space-4: 1rem;      /* 16px */
  --space-5: 1.25rem;   /* 20px */
  --space-6: 1.5rem;    /* 24px */
  --space-8: 2rem;      /* 32px */
  --space-10: 2.5rem;   /* 40px */
  --space-12: 3rem;     /* 48px */
  --space-16: 4rem;     /* 64px */
  --space-24: 6rem;     /* 96px  — section top pad     */
  --space-32: 8rem;     /* 128px — large section pad   */

  /* ---- Layout ------------------------------------------------------------ */
  --content-max: 1360px;      /* Wrapper max-width           */
  --content-pad: 2rem;        /* Wrapper horizontal padding  */
  --section-pad-y: clamp(4rem, 8vw, 8rem);
  --frame-gap: 1.5rem;        /* outer gap around hero/footer rounded frames */

  /* ---- Radii ------------------------------------------------------------- */
  --radius-sm: 0.5rem;    /* 8px   small chips, icon tiles  */
  --radius-md: 0.75rem;   /* 12px  stat pills               */
  --radius-lg: 1rem;      /* 16px  inputs                   */
  --radius-xl: 1.5rem;    /* 24px  metric grid              */
  --radius-2xl: 2rem;     /* 32px  cards / hero frame       */
  --radius-3xl: 2.5rem;   /* 40px  large cards / footer     */
  --radius-pill: 9999px;  /* buttons, pills, header         */
  --radius-card: 2rem;    /* 32px  canonical card radius (alias of 2xl) */

  /* ---- Border widths ----------------------------------------------------- */
  --border-thin: 1px;
  --border-thick: 2px;    /* dashed accent borders on buttons */
}

/* Shadows, blur, and motion tokens live in effects.css. */