/* ============================================================
   NA — Acabado de la cabecera fija (escritorio)
   CMP · Septiembre 2026
   ============================================================

   QUE PIDIO EL USUARIO
   «el menu de la web debe ser sticky (sin contar la barra superior del menu)».

   QUE HABIA
   La plantilla de cabecera es de Elementor Pro (post 53686) y tiene TRES barras
   de primer nivel:
     `4f84b8e7`  barra superior (envio gratis + menu de utilidades), 40px, oculta
                 en movil — es «la barra superior del menu» que el usuario NO
                 quiere fija.
     `15da490a`  barra principal de escritorio (logo, buscador, cuenta, carrito),
                 80px, oculta en tablet y movil — ESTA es la que se fija.
     `74d751f7`  barra de movil/tablet, que YA era sticky de antes
                 (`"sticky":"top","sticky_on":["tablet","mobile"]`).
   Es decir: el sticky ya existia en movil y solo faltaba en escritorio.

   DONDE VIVE EL COMPORTAMIENTO — NO AQUI
   El sticky en si NO se implementa en esta hoja: se activo en los ajustes de la
   seccion `15da490a` («Avanzado -> Efectos de movimiento -> Fijo: Arriba», con
   «Fijo en» = solo Escritorio). Se hizo con el motor de Elementor Pro, y no con
   un `position:sticky` propio, por una razon concreta: Elementor compensa el
   hueco que deja el elemento al salir del flujo. Con `position:fixed` a mano
   habria que replicar esa compensacion a mano y el contenido daria un salto de
   80px en el momento de fijarse.

   POR QUE LA BARRA LLEVA AHORA FONDO BLANCO
   Porque no tenia ninguno. Medido en `uploads/elementor/css/post-53686.css`:
   `15da490a` solo declaraba `padding` y `min-height`, sin `background-color`. En
   el flujo normal eso no se nota —se ve el blanco del `body` por detras— pero al
   fijarse, la barra deja de tener nada detras y el contenido de la pagina se
   veria PASAR POR DENTRO de la cabecera. El blanco se puso en los ajustes de la
   seccion, no aqui, para que sea visible a quien edite la cabecera desde
   Elementor y no lo herede de un CSS que no encuentre.
   Visualmente no cambia nada mientras la barra no esta fija: el blanco es el
   mismo que ya se veia por detras.

   QUE HACE ENTONCES ESTA HOJA
   Solo el acabado que Elementor no puede expresar: la sombra que debe aparecer
   UNICAMENTE cuando la barra esta fija. En los ajustes de la seccion una sombra
   se veria siempre, tambien con la pagina arriba, y ahi sobra: no hay nada
   debajo de lo que separarse.

   EL GANCHO
   `.elementor-sticky--active` es la clase que el motor de Elementor Pro anade al
   elemento mientras esta fijado, y la retira al volver a su sitio. Es API
   publica y estable de Elementor Pro (la documentan y la usan sus propios
   widgets), no una clase interna.
   ============================================================ */

/* Se encadena `.elementor-location-header` para que la regla no pueda alcanzar
   ningun otro elemento fijado de la pagina, y el `data-id` de la seccion para no
   afectar a la barra de movil, que tiene su propio tratamiento. */
.elementor-location-header .elementor-element-15da490a.elementor-sticky--active {
	/* Sombra baja y muy difusa: su unico trabajo es despegar la barra del
	   contenido que pasa por debajo. Con el marino de la marca (#002842) en vez
	   de negro puro, que sobre fondo blanco se ve gris sucio. */
	box-shadow: 0 2px 16px -6px rgba( 0, 40, 66, 0.18 );

	/* La sombra entra progresivamente. Sin esto aparece de golpe en el pixel
	   exacto en que la barra se fija, y ese parpadeo es justo lo que delata que
	   hay un truco detras. */
	transition: box-shadow 0.2s ease;
}

/* Nadie que haya pedido menos movimiento ve la transicion. La sombra si: no es
   movimiento, es un cambio de estado, y quitarsela seria quitarle informacion. */
@media ( prefers-reduced-motion: reduce ) {
	.elementor-location-header .elementor-element-15da490a.elementor-sticky--active {
		transition: none;
	}
}