/**
 * BASE / UTILITIES
 * -----------------------------------------------------------------------------
 * Clases de un solo propósito. Se cargan al final para poder ganar la cascada.
 * Regla: si una utilidad se repite en 3+ sitios formando un patrón, conviértela
 * en componente, no la sigas apilando en el HTML.
 */

/* --- Texto ------------------------------------------------------------- */

.text-center { text-align: center; }
.text-left   { text-align: left; }
.text-right  { text-align: right; }

.text-blue    { color: var(--blue); }
.text-orange  { color: var(--orange); }
.text-heading { color: var(--heading); }
.text-muted   { color: var(--text-muted); }
.text-white   { color: var(--white); }

.text-uppercase { text-transform: uppercase; }
.fw-semibold    { font-weight: var(--fw-semibold); }
.fw-bold        { font-weight: var(--fw-bold); }

.text-balance { text-wrap: balance; }

/* --- Espaciado --------------------------------------------------------- */

.mt-0  { margin-top: 0; }
.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); }

.mb-0  { margin-bottom: 0; }
.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); }

/* --- Visibilidad ------------------------------------------------------- */

.is-hidden { display: none !important; }

.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

@media (max-width: 1000px) {
    .hide-desktop-down { display: none !important; }
}

@media (max-width: 700px) {
    .hide-mobile { display: none !important; }
}

@media (min-width: 1001px) {
    .show-mobile-only { display: none !important; }
}