/* ==========================================================================
   Página ligera: mismo aspecto, sin trabajo en cada cuadro cuando nada lo necesita.
   Medido: con la página quieta, el hilo principal recalculaba estilos y maqueta en TODOS los cuadros
   (≈80 por segundo) por animaciones de `left`/`top` y bucles que corren fuera de pantalla; al hacer scroll
   ese trabajo no deja pintar lo nuevo (la página se ve negra hasta que se detiene).
   ========================================================================== */

/* 1 · Secciones fuera de pantalla (clase de assets/js/escalautos-ligero.js): animaciones CSS en pausa. */
.ea-quieto,
.ea-quieto *,
.ea-quieto *::before,
.ea-quieto *::after {
	animation-play-state: paused !important;
}

/* 2 · Letras de los títulos animados (SplitText): el tema deja `will-change` y `preserve-3d` en cada letra
   para siempre (≈300 capas en la portada). La animación corta se ve igual sin ellas. */
.wa_title_spilt_1,
.wa_title_spilt_1 .word,
.wa_title_spilt_1 .char,
.wa_title_spilt_2 .word,
.wa_title_spilt_2 .char,
.wa_title_spilt_3 .word,
.wa_title_spilt_3 .char,
.wa_split_2 .word,
.wa_split_2 .char {
	will-change: auto !important;
	transform-style: flat !important;
}

/* 3 · Líneas de luz del menú, subtítulos y botones: el tema las mueve con `left` (maqueta en cada cuadro,
   en todas las páginas). Aquí con `transform` (sin tocar la maqueta). El % de translateX es del ancho de la
   luz: left de A % a B % con una luz de W % → translateX de A/W·100 % a B/W·100 %. */
.sk-header-1-menu::after,
.sk-header-1-menu::before {
	left: 0 !important;
	width: 22% !important; /* ≈ los 150 px del tema en el menú de escritorio */
	animation-name: ea-luz-menu !important;
}
.sk-subtitle-5::after,
.sk-subtitle-5::before,
.sk-subtitle-7::after,
.sk-subtitle-7::before {
	left: 0 !important;
	animation-name: ea-luz-subtitulo !important; /* ancho 20 %, de 10 % a 70 % */
}
.sk-pr-btn-10 .line-1,
.sk-pr-btn-10 .line-2 {
	left: 0 !important;
	animation-name: ea-luz-boton !important; /* ancho 30 % */
}
.sk-subtitle-1::before {
	left: 0 !important;
	animation-name: ea-luz-subtitulo-1 !important; /* ancho 30 % */
}
@keyframes ea-luz-menu { 0%, 100% { transform: translateX(13.6%); } 50% { transform: translateX(331.8%); } }
@keyframes ea-luz-subtitulo { 0%, 100% { transform: translateX(50%); } 50% { transform: translateX(350%); } }
@keyframes ea-luz-boton { 0%, 100% { transform: translateX(26.7%); } 50% { transform: translateX(223.3%); } }
@keyframes ea-luz-subtitulo-1 { 0%, 100% { transform: translateX(-66.7%); } 50% { transform: translateX(333.3%); } }