/* ============================================================
   Club del Sole — Spacing, radius, shadow, layout, motion
   ============================================================ */
:root {
  /* ---- SPACING ---- */
  --space-3xs: 2px;
  --space-2xs: 4px;
  --space-xs:  8px;
  --space-sm:  10px;  /* most-used gap in the codebase */
  --space-md:  15px;
  --space-lg:  20px;
  --space-xl:  30px;
  --space-2xl: 40px;
  --space-3xl: 60px;

  /* ---- RADIUS ---- */
  --radius-xs:   3px;
  --radius-sm:   5px;
  --radius-md:   10px;
  --radius-base: 15px;
  --radius-lg:   20px;
  --radius-xl:   25px;   /* buttons & inputs */
  --radius-pill: 50px;   /* chips / booking bar */

  /* semantic radius roles */
  --radius-control: var(--radius-xl);   /* buttons, inputs */
  --radius-card:    var(--radius-base); /* cards */
  --radius-chip:    var(--radius-pill); /* badges, tabs */

  /* ---- SHADOW ---- */
  /* Soft, warm, blue-tinted depth — never harsh black */
  --shadow-sm:    0 0 10px rgba(0,0,0,0.1);
  --shadow-md:    0 0 20px rgba(0,0,0,0.1);
  --shadow-card:  0 4px 16px rgba(0,33,69,0.08);  /* resting cards */
  --shadow-float: 0 8px 28px rgba(0,33,69,0.14);  /* floating bars / popovers */
  --shadow-lift:  0 12px 36px rgba(0,33,69,0.18); /* hover lift */

  /* ---- LAYOUT ---- */
  --wrap-max: 1200px; /* @kind other */
  --main-max: 920px; /* @kind other */

  /* ---- MOTION ---- */
  --ease-soft: cubic-bezier(0.22, 0.61, 0.36, 1); /* @kind other */
  --dur-fast:  0.14s; /* @kind other */
  --dur-base:  0.22s; /* @kind other */
  --dur-slow:  0.4s; /* @kind other */
}