/* ============================================================
   zum eibach — Spacing, radii, shadows, motion
   Spacing scale taken from the Figma Foundations "Sizes" frame.
   Desktop values are canonical; mobile equivalents noted inline.
   ============================================================ */

:root {
  /* ---- Spacing (desktop / mobile) ---- */
  --space-s:   8px;   /* mobile 8  */
  --space-m:   16px;  /* mobile 12 */
  --space-l:   24px;  /* mobile 16 */
  --space-xl:  32px;  /* mobile 24 */
  --space-2xl: 48px;  /* mobile 32 */
  --space-3xl: 96px;  /* mobile 64 */

  /* ---- Layout ---- */
  --container-max: 1280px; /* @kind spacing */
  --gutter:        160px;   /* desktop page margin used in the campaign page @kind spacing */

  /* ---- Radii ---- */
  --radius-sm:   8px;
  --radius-card: 16px;  /* offer & content cards */
  --radius-lg:   20px;  /* large feature blocks */
  --radius-pill: 999px; /* buttons, chips, badges */
  --radius-full: 50%;   /* circular media + icon wells */

  /* ---- Shadows (used sparingly; the brand is mostly flat) ---- */
  --shadow-sm:  0 1px 2px rgba(29,29,27,.06);
  --shadow-card: 0 8px 24px rgba(29,29,27,.08);
  --shadow-lg:  0 18px 48px rgba(29,29,27,.12);

  /* ---- Motion ---- */
  --ease-out:   cubic-bezier(.2, .7, .3, 1); /* @kind other */
  --ease-soft:  cubic-bezier(.4, 0, .2, 1);  /* @kind other */
  --dur-fast:   140ms; /* @kind other */
  --dur-base:   220ms; /* @kind other */
  --dur-slow:   400ms; /* @kind other */
}