/* ──────────────────────────────────────────────────────────────
   Orla — Spacing & layout tokens
   8px base grid. Orla layouts are spacious and editorial — favour
   generous whitespace, wide gutters and large section rhythm.
   ────────────────────────────────────────────────────────────── */

:root {
  /* ── Spacing scale (8px 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-20: 80px;
  --space-24: 96px;
  --space-32: 128px;

  /* Figma padding variables (component internal padding) */
  --padding-inline: 24px;  /* PADDING_LEFT_RIGHT */
  --padding-block:  16px;  /* PADDING_TOP_BOTTOM */

  /* ── Radii — soft, friendly rounding on cards & controls ── */
  --radius-xs:   4px;
  --radius-sm:   8px;
  --radius-md:   12px;
  --radius-lg:   16px;
  --radius-xl:   24px;
  --radius-2xl:  32px;
  --radius-pill: 999px;
  --radius-full: 50%;

  /* ── Container widths ── */
  --container-sm: 640px;
  --container-md: 880px;
  --container-lg: 1120px;
  --container-xl: 1320px;

  /* ── Z-index ── */
  --z-base:    0;    /* @kind other */
  --z-raised:  10;   /* @kind other */
  --z-sticky:  100;  /* @kind other */
  --z-overlay: 1000; /* @kind other */
  --z-modal:   1100; /* @kind other */
  --z-toast:   1200; /* @kind other */
}