/* Kotimber — spacing, radii, elevation, motion. 4px base grid. */
:root{
  --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;

  --gutter:var(--space-6);
  --section-y:var(--space-24);
  --section-y-tight:var(--space-16);
  --container-max:1200px;
  --container-narrow:720px;
  --measure:62ch; /* @kind other */

  /* Radii — collateral uses generous soft corners; icon badges are full circles */
  --radius-xs:4px;
  --radius-sm:8px;
  --radius-md:12px;
  --radius-lg:18px;
  --radius-xl:26px;
  --radius-2xl:36px;
  --radius-pill:999px;
  --radius-circle:50%;

  --border-hairline:1px;
  --border-thick:2px;
  --rule-accent:4px; /* the short orange rule above headings */

  /* Elevation — soft, low-contrast, never coloured */
  --shadow-xs:0 1px 2px rgb(13 30 58 / .06);
  --shadow-sm:0 2px 6px rgb(13 30 58 / .07);
  --shadow-md:0 6px 18px rgb(13 30 58 / .09);
  --shadow-lg:0 14px 36px rgb(13 30 58 / .12);
  --shadow-photo:0 18px 44px rgb(13 30 58 / .18);
  --shadow-inset-top:inset 0 1px 0 rgb(255 255 255 / .08);

  /* Motion — short, calm, no bounce */
  --dur-fast:120ms; /* @kind other */
  --dur-base:180ms; /* @kind other */
  --dur-slow:320ms; /* @kind other */
  --ease-standard:cubic-bezier(.4,0,.2,1); /* @kind other */
  --ease-out:cubic-bezier(0,0,.2,1); /* @kind other */
  --transition-interactive:background-color var(--dur-base) var(--ease-standard),color var(--dur-base) var(--ease-standard),border-color var(--dur-base) var(--ease-standard),box-shadow var(--dur-base) var(--ease-standard),transform var(--dur-fast) var(--ease-standard);

  --z-base:0; /* @kind other */
  --z-sticky:100; /* @kind other */
  --z-overlay:400; /* @kind other */
  --z-modal:500; /* @kind other */
}