/* Na Vlnách — Spacing, radius, shadow, motion tokens */
:root{
  /* Spacing scale */
  --sp-1:4px;
  --sp-2:8px;
  --sp-3:12px;
  --sp-4:16px;
  --sp-5:22px;   /* section gutter — note the brand's 22px, not 24 */
  --sp-6:28px;
  --sp-7:40px;
  --sp-8:50px;

  /* Radius */
  --radius:20px;      /* large cards, sections, hero panels */
  --radius-sm:14px;   /* inner cards, notices, inputs */
  --radius-btn:12px;  /* buttons */
  --radius-chip:10px; /* icon chips */
  --radius-pill:999px;/* pills, chips, dots */

  /* Shadows — always tinted with navy, never neutral grey */
  --shadow:0 12px 34px rgba(5,61,114,.12);
  --shadow-sm:0 4px 14px rgba(5,61,114,.08);
  --shadow-success:0 6px 18px rgba(28,122,67,.14);

  /* Layout */
  --wrap:1080px;      /* max content width */
  --nav-h:86px;       /* sticky top bar offset */

  /* Motion */
  --ease:cubic-bezier(.4,0,.2,1); /* @kind other */
  --dur-fast:.18s; /* @kind other */
  --dur:.25s; /* @kind other */
  --lift:-3px;        /* @kind spacing */
}