/* * LO NUESTRO ENCIMA DEL PAQUETE (22/09/2026). Las tres hojas del paquete de Codex (styles.css, * theme.css, pages.css) se quedan tal cual, para poder compararlas con el paquete; lo que Pol pidió * cambiar el 22/09 va aquí, y solo esto: * * - La cabecera se queda fija arriba al hacer scroll («que se quede fijo arriba también»). El paquete * la tenía en el flujo (position: relative); `sticky` la deja en su sitio y la pega a 16 px del borde * cuando la página baja. Para que `sticky` funcione, la caja que envuelve la cabecera en el * servidor (`.landing-cabecera`) no puede ser una caja: `display: contents` la hace transparente. * - La landing va siempre en oscuro: el `` lleva `data-theme="dark"` desde el servidor y aquí * `color-scheme: dark`, que es lo que hace oscuros los controles nativos y el panel de cookies de * la aplicación (`light-dark()` en globals.css). */ html[data-landing] { color-scheme: dark; } .landing-cabecera { display: contents; } .landing .nav { position: sticky; top: 16px; } /* * Sin desplazamiento horizontal en los móviles estrechos (22/09/2026). A 360 px el fondo difuminado * de la portada (`.ambient`, 118 % de ancho) y las líneas de ruta del escenario (`.route`, 110 %) * asoman 14 px por la derecha y el paquete original también hace scroll lateral ahí. `clip` en el * `
` recorta lo que asoma (un borde ya transparente del degradado) sin convertirlo en una caja * con scroll propio, así que lo pegajoso de dentro (el índice legal en pantalla ancha) sigue * funcionando; y la cabecera pegajosa está fuera del `
`, así que ni la toca. En el cuerpo no * vale: su `overflow` se lo queda la ventana y el móvil sigue midiendo el ancho de más. */ html[data-landing] main { overflow-x: clip; } /* * «ACCEDER» EN LA CABECERA, EN TODOS LOS TAMAÑOS (Pol, 22/09/2026: «¿cómo hago el login ahora? en el * móvil no hay botón de iniciar sesión»). El paquete lo escondía por debajo de 1100 px (theme.css) y * de 480 px (styles.css) porque en ese hueco ponía el selector de apariencia, que ya no existe. Con * tres clases se gana a las dos reglas del paquete sin `!important`. En el móvil ocupa el sitio del * selector: arriba a la derecha, al lado de la marca; debajo siguen el idioma y «Ver planes». */ .landing .nav .nav-access { display: inline-flex; align-items: center; white-space: nowrap; } @media (max-width: 480px) { .landing .nav .nav-access { grid-column: 2; grid-row: 1; justify-self: end; margin-left: 0; } }