@charset "UTF-8"; /** * base.css — Bajo Nalón Tema WP * * Reset universal y defaults del . Rescatado del antiguo * styles.css al cerrar el sprint de design tokens. Se carga justo * después de tokens.css y antes de cualquier CSS de componente. */ /* ─── Reset universal ───────────────────────────────────────── */ *, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; } /* ─── Base del ───────────────────────────────────────── */ body { font-family: var(--e-global-typography-text-font-family); color: var(--e-global-color-text); background: var(--bn-color-bg-soft); overflow-x: hidden; overflow-y: auto; } /* Lock del scroll cuando hay overlays (mobile menu, modal, etc.) */ body.nav-open, body.menu-open { overflow: hidden !important; } /* ─── Contenedor global ────────────────────────────────────── Utility .bn-container: centra + limita al max + garantiza aire lateral mínimo cuando el viewport es estrecho. La fórmula min(100% - 2*pad, max) hace en una línea lo que antes requerían tres (max-width + margin 0 auto + padding). Coincide exactamente con la rejilla de Elementor (--container-max-width: 1450px del Kit) — un componente del tema y un container de Elementor apilados uno debajo de otro alinean sus bordes al pixel. Uso: clase directa en HTML, o compose-pattern en CSS reutilizando la misma fórmula en selectores específicos. */ .bn-container { width: min(100% - 2 * var(--bn-container-pad), var(--bn-container-max)); margin-inline: auto; } /* Full-bleed: secciones que ignoran el container y ocupan el ancho completo del viewport (heroes con imagen, bandas de color que van de borde a borde). Funciona dentro de cualquier padre con width definida. */ .bn-full-bleed { width: 100vw; margin-inline: calc(50% - 50vw); } /* ─── Iconos FontAwesome ───────────────────────────────────── Blindaje defensivo: si alguna regla con misma specificity (ej. .main-footer { font-family: ... }) compite por cascada con .fa-brands/.fa-solid, este selector más específico garantiza que gane siempre la fuente de iconos. */ i.fa, i.fas, i.far, i.fab, i.fal, i.fat, i.fa-solid, i.fa-regular, i.fa-brands, i.fa-light, i.fa-thin, i.fa-duotone, .fa, .fas, .far, .fab, .fa-solid, .fa-regular, .fa-brands, .fa-light, .fa-thin, .fa-duotone { font-family: var(--fa-style-family, "Font Awesome 6 Free"); } i.fa-brands, i.fab, .fa-brands, .fab { font-family: "Font Awesome 6 Brands"; }