/* ============================================================
   SPACING — Skiforeningen
   8px base with 4px half-step. Generous, DNT-style air.
   Raw scale → semantic component & layout tokens.
   ============================================================ */

:root {
  /* ---- RAW scale ---- */
  --space-0:   0;
  --space-1:   0.25rem;  /* 4  — half-step */
  --space-2:   0.5rem;   /* 8  — base */
  --space-3:   0.75rem;  /* 12 */
  --space-4:   1rem;     /* 16 */
  --space-6:   1.5rem;   /* 24 */
  --space-8:   2rem;     /* 32 */
  --space-12:  3rem;     /* 48 */
  --space-16:  4rem;     /* 64 */
  --space-24:  6rem;     /* 96 */

  /* ---- SEMANTIC — component padding (inner) ---- */
  --pad-chip:        var(--space-2) var(--space-3);
  --pad-button:      var(--space-3) var(--space-6);
  --pad-button-sm:   var(--space-2) var(--space-4);
  --pad-input:       var(--space-3) var(--space-4);
  --pad-card:        var(--space-6);
  --pad-card-cozy:   var(--space-4);
  --gap-card-grid:   var(--space-6);
  --gap-inline:      var(--space-2);
  --gap-stack:       var(--space-4);

  /* ---- SEMANTIC — layout (outer) ---- */
  --section-gap:        var(--space-24);   /* between major page sections */
  --section-gap-tight:  var(--space-16);
  --block-gap:          var(--space-12);   /* between blocks within a section */
  --container-pad-x:    var(--space-6);     /* page gutter on mobile */
}

@media (min-width: 768px) {
  :root { --container-pad-x: var(--space-8); }
}
@media (min-width: 1280px) {
  :root { --container-pad-x: var(--space-12); }
}