/* BMW M — Spacing, radius, layout tokens. Base unit 4px. */

:root {
  /* ---- Spacing scale ---- */
  --space-xxs: 4px;
  --space-xs: 8px;
  --space-sm: 12px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 40px;
  --space-xxl: 64px;
  --space-section: 96px; /* between major editorial bands */

  /* ---- Border radius ---- "almost always 0, sometimes circular" */
  --radius-none: 0px;
  --radius-xs: 2px;   /* legal CTAs only */
  --radius-sm: 4px;   /* small toggle pills */
  --radius-md: 6px;   /* rare dropdown items */
  --radius-full: 9999px; /* circular icon buttons */

  /* ---- Layout ---- */
  --container-max: 1440px; /* marketing max width */
  --gutter: 24px;          /* card grid gutter */

  /* ---- The M tricolor stripe height ---- */
  --m-stripe-height: 4px;

  /* ---- Control sizing ---- */
  --control-height: 48px;  /* buttons, inputs, icon buttons */
  --hairline-width: 1px;

  /* ---- Elevation: system uses NO drop shadows.
     Depth comes from photography + surface contrast.
     The only "shadow" is a hairline border. ---- */
  --shadow-none: none;
}