/* ============================================================
   WCGB · Spacing, Radius, Border & Layout Tokens
   The brand is architectural: corners are square (radius 0),
   borders are hairline, rhythm is generous.
   ============================================================ */

:root {
  /* ---- Spacing scale (4px base) ---- */
  --space-0:   0;
  --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-18:  72px;
  --space-20:  80px;

  /* Semantic spacing */
  --pad-card:       32px;   /* rule cards, content cards */
  --pad-card-tight: 24px;   /* product card body */
  --pad-block:      64px 80px;  /* content block (y x) */
  --pad-section:    72px 80px 48px;
  --gap-grid:       24px;
  --gap-inline:     12px;

  /* ---- Radius — square by mandate ---- */
  --radius-0:   0;      /* default everywhere */
  --radius-sm:  2px;    /* rare: only soft chips if explicitly approved */
  --radius-pill: 999px; /* heritage/occasion pill exceptions only */

  /* ---- Border widths ---- */
  --border-hair:    1px;    /* card & divider hairlines */
  --border-accent:  3px;    /* rule-card top borders, differentiator left borders */
  --border-cta:     1.5px;  /* secondary button outline */

  /* ---- Layout ---- */
  --container-max:  1200px;
  --email-max:      600px;
  --measure:        65ch;   /* readable prose width */
  --nav-height:     48px;

  /* ---- Motion ---- */
  --ease-standard: cubic-bezier(0.4, 0.0, 0.2, 1); /* @kind other */
  --dur-fast:   0.15s; /* @kind other */
  --dur-base:   0.20s; /* @kind other */
  --dur-slow:   0.30s; /* @kind other */
}