/* ============================================================================
   Utilidades
   La CSP del sitio declara style-src 'self' sin 'unsafe-inline': un
   style="" en el HTML se bloquea en silencio. Cualquier ajuste puntual de
   espaciado o alineación tiene que salir de aquí.
   ========================================================================= */

/* Márgenes superiores */
.mt-0 { margin-top: 0; }
.mt-xs { margin-top: var(--space-xs); }
.mt-sm { margin-top: var(--space-sm); }
.mt-md { margin-top: var(--space-md); }
.mt-lg { margin-top: var(--space-lg); }
.mt-xl { margin-top: var(--space-xl); }
.mt-2xl { margin-top: var(--space-2xl); }
.mt-gap { margin-top: var(--section-gap); }

/* Márgenes inferiores */
.mb-0 { margin-bottom: 0; }
.mb-xs { margin-bottom: var(--space-xs); }
.mb-sm { margin-bottom: var(--space-sm); }
.mb-md { margin-bottom: var(--space-md); }
.mb-lg { margin-bottom: var(--space-lg); }
.mb-xl { margin-bottom: var(--space-xl); }
.mb-gap { margin-bottom: var(--section-gap); }

/* Texto */
.text-center { text-align: center; }
.text-accent { color: var(--itx-blue); }
.text-accent-light { color: var(--itx-blue-light); }
.text-muted { color: var(--itx-text-on-dark-muted); }
.section--light .text-muted { color: var(--itx-text-muted); }
.text-lede { font-size: var(--fs-lede); }
.text-small { font-size: var(--fs-small); }
.text-nowrap { white-space: nowrap; }

/* Anchos */
.w-prose { max-width: 62ch; }
.w-narrow { max-width: 46ch; }
.w-full { max-width: none; }

/* Flujo */
.stack-sm > * + * { margin-top: var(--space-sm); }
.stack-md > * + * { margin-top: var(--space-md); }
.stack-lg > * + * { margin-top: var(--space-lg); }

/* Anclas: compensa el header pegajoso al saltar a #gestion, #nube, etc. */
[id] { scroll-margin-top: calc(var(--header-height) + var(--space-md)); }