/* ============================================================
   OpsPal — Spacing, radii, layout tokens
   ============================================================ */

:root {
  /* ---- Spacing scale ---- */
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 32px;
  --space-xl: 64px;

  /* ---- Rhythm (used across sections) ---- */
  --space-section: 4rem;     /* vertical section padding */
  --space-heading: 0.75rem;  /* below h3 */
  --space-stack: 1.25rem;    /* default paragraph / grid gap */

  /* ---- Radii ---- */
  --radius-xs: 6px;    /* stack chips, small inputs */
  --radius-sm: 8px;    /* flow nodes, help cards */
  --radius-md: 12px;   /* cards, tiles, inputs */
  --radius-lg: 18px;   /* metric tiles, method cards */
  --radius-xl: 22px;   /* CTA bands */
  --radius-pill: 999px;

  /* ---- Layout ---- */
  --container: 1120px;
  --container-narrow: 760px;
  --sticky-header-offset: 112px;

  /* ---- Motion ---- */
  --ease: cubic-bezier(0.4, 0, 0.2, 1); /* @kind other */
  --dur-fast: 0.2s; /* @kind other */
}

@media (max-width: 768px) {
  :root {
    --space-section: 2.5rem;
    --space-stack: 1rem;
  }
}