/* Spacing, radii, borders, shadows, layout — from ai.madbotter.com production CSS. */

:root {
  /* Spacing scale (px values observed in production) */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 72px;
  --space-section: 72px 0;     /* major band padding */
  --space-band: 42px 0;        /* minor band padding */

  /* Radii — squarish. 6px controls, 8px cards/panels, pill only for bars/dots. */
  --radius-control: 6px;
  --radius-card: 8px;
  --radius-pill: 999px;

  /* Borders */
  --border-width: 1px;
  --border-accent-width: 5px;  /* left accent stripe on callouts */

  /* Shadows — soft, purple-tinted, never harsh */
  --shadow: 0 12px 32px rgba(45, 32, 55, 0.08);
  --shadow-soft: 0 6px 18px rgba(45, 32, 55, 0.06);

  /* Layout */
  --container: 1140px;
  --container-pad: 20px;
  --wizard-max: 900px;

  /* Grid-paper background (hero sections) */
  --grid-paper: linear-gradient(90deg, rgba(123, 74, 160, 0.06) 1px, transparent 1px),
    linear-gradient(0deg, rgba(123, 74, 160, 0.05) 1px, transparent 1px); /* @kind other */
  --grid-paper-size: 34px 34px;

  /* Motion */
  --ease-ui: ease; /* @kind other */
  --duration-ui: 160ms; /* @kind other */
  --duration-progress: 180ms; /* @kind other */
}