/* tandemcompute — spacing, radius, borders, shadow, motion. */
:root {
  /* 8px base unit */
  --space-1: 8px;
  --space-2: 16px;
  --space-3: 24px;
  --space-4: 32px;
  --space-5: 40px;
  --space-6: 48px;
  --space-8: 64px;
  --space-9: 72px;
  --space-12: 96px;
  --space-14: 112px;
  --space-18: 144px;

  /* Layout */
  --container-max: 1280px;
  --gutter-desktop: 64px;
  --section-desktop: 112px;
  --section-mobile: 72px;

  /* Radius */
  --radius-small: 8px;   /* small UI controls */
  --radius-card: 16px;   /* standard cards */
  --radius-product: 24px;/* product panels */

  /* Borders — 1px technical rules */
  --border-thin: 1px solid var(--line-neutral);
  --border-thin-dark: 1px solid var(--line-neutral-dark);

  /* Shadows — near-none; the brand relies on lines and flat surfaces */
  --shadow-card: 0 1px 2px rgba(17, 22, 27, 0.05);
  --shadow-raised: 0 4px 16px rgba(17, 22, 27, 0.08);

  /* Motion — calm, minimal */
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1); /* @kind other */
  --duration-fast: 120ms; /* @kind other */
  --duration-base: 200ms; /* @kind other */
}