/* Normo — Spacing + layout tokens.
   Retícula de 8px. Márgenes, paddings y separaciones son múltiplos de 8. */
:root {
  --normo-space-half: 4px; /* sub-unidad: solo ajuste óptico, no para layout */
  --normo-space-1: 8px;
  --normo-space-2: 16px;
  --normo-space-3: 24px;
  --normo-space-4: 32px;
  --normo-space-5: 40px;
  --normo-space-6: 48px;
  --normo-space-8: 64px;
  --normo-space-10: 80px;
  --normo-space-12: 96px;
  --normo-space-16: 128px;

  /* Grid 12 col */
  --normo-grid-columns: 12; /* @kind other */
  --normo-grid-gutter: 24px;
  --normo-grid-margin: 24px;
  --normo-grid-max-width: 1200px;
  --normo-grid-unit: 8px;

  /* Objetivo táctil mínimo (kiosco y móvil) */
  --normo-touch-min: 48px;

  /* Breakpoints (mobile-first, min-width) */
  --normo-bp-sm: 480px; /* @kind other */
  --normo-bp-md: 768px; /* @kind other */
  --normo-bp-lg: 1024px; /* @kind other */
  --normo-bp-xl: 1280px; /* @kind other */
  --normo-bp-2xl: 1536px; /* @kind other */
}