/* ===================================================================
   DOFNY — Spacing, radius, shadow tokens
   The Figma file exposes only two Variables (Space/800 = 32,
   Corner/Full = 9999); the rest of the scale is transcribed from the
   layouts. Page gutter is 96px; section rhythm is 24px.
=================================================================== */

:root {
  /* ---- Spacing scale ------------------------------------------- */
  --space-2: 2px;
  --space-4: 4px;
  --space-8: 8px;      /* base gap between stacked text */
  --space-10: 10px;
  --space-12: 12px;
  --space-16: 16px;    /* card inner gap / grid gap */
  --space-18: 18px;    /* category grid column gap */
  --space-20: 20px;    /* nav item gap */
  --space-23: 23px;
  --space-24: 24px;    /* section rhythm */
  --space-32: 32px;    /* Variable: Space/800 */
  --space-56: 56px;
  --space-64: 64px;    /* footer top padding */
  --space-80: 80px;
  --space-96: 96px;    /* page horizontal gutter */

  --page-gutter: 96px;
  --page-max: 1440px;
  --content-max: 1248px;

  /* ---- Radii --------------------------------------------------- */
  --radius-4: 4px;
  --radius-8: 8px;      /* logo pill, small chips */
  --radius-11: 11px;    /* trust badge pill */
  --radius-30: 30px;    /* search field, quantity + CTA pills */
  --radius-full: 9999px;/* Variable: Corner/Full — dots, avatars */

  /* ---- Shadows ------------------------------------------------- */
  --shadow-card: 0 1px 2px rgba(16, 24, 40, 0.06), 0 1px 3px rgba(16, 24, 40, 0.10);
  --shadow-raised: 0 4px 16px rgba(16, 24, 40, 0.08);
  --shadow-inset-hairline: inset 0 0 0 1px rgba(255, 255, 255, 0.2);

  /* ================= SEMANTIC ALIASES ========================== */
  --gap-text: var(--space-8);
  --gap-section: var(--space-24);
  --radius-pill: var(--radius-30);
  --radius-field: var(--radius-30);
}