/* ============================================================ BASE ------------------------------------------------------------ Reset minimalista, tipografía, comportamiento por defecto de elementos estructurales. Los selectores específicos de cada sección viven en sections.css, bio.css y modal.css. ============================================================ */ /* ---------- Reset ---------- */ *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; } /* ---------- html / scroll suave + fondo del tema activo ---------- El fondo va en (no en ) para que las marcas globales fijas al viewport (z-index: 0 en el .bg-decor) se vean ENCIMA del fondo pero DETRÁS del contenido textual de cada sección. Si el fondo estuviera en , ningún hijo con z-index positivo podría verse por debajo del body, y las marcas quedarían tapadas. */ html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; background: var(--color-bg); transition: background-color 0.2s linear; } /* ---------- Body · tipografía y color del tema activo ---------- */ body { font-family: var(--font-sans); color: var(--color-text); line-height: 1.6; font-size: 16px; min-height: 100vh; -webkit-font-smoothing: antialiased; /* Sin background: hereda el de y deja pasar las marcas globales a través de las secciones. */ transition: color 0.2s linear; } /* ---------- Defaults de elementos ---------- */ img { max-width: 100%; display: block; } a { color: inherit; text-decoration: none; } /* ---------- Checkboxes visually hidden ---------- Los se usan como toggles puros CSS (modal de diagnóstico). Existen en el DOM y siguen siendo accesibles (lectores de pantalla los anuncian), pero no se renderizan visualmente ni ocupan espacio en el layout. */ input[type="checkbox"] { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; } /* Accesibilidad · respeta la preferencia del sistema operativo para reducir movimiento. Neutraliza los 3 keyframes 'pulse' del sitio (hero-eyebrow, hero-availability, modal-overlay-logo) y todas las transiciones para usuarios con sensibilidad vestibular o que desactivaron animaciones a nivel SO. */ @media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; } }