/* Heuristic — cabecera fija que se comprime al hacer scroll. */

.elementor-location-header {
	position: sticky;
	top: 0;
	/* Por debajo del panel del menú móvil (9998). */
	z-index: 9990;
	background: #ffffff;
}

/* La transición vive en el contenedor y en el logo, no en el header entero,
   para no animar el filete inferior ni provocar reflows del menú. */
.elementor-location-header > .e-con {
	max-width: 100%;
	margin-inline: auto;
	transition: padding-block 0.22s ease, padding-inline 0.22s ease, max-width 0.28s ease;
}

.elementor-location-header .elementor-nav-menu--main .elementor-nav-menu > li > a {
	transition: padding 0.22s ease;
}

.elementor-location-header .elementor-widget-image img {
	transition: width 0.22s ease;
}

/* --- Estado comprimido --------------------------------------------------- */

body.hx-scrolled .elementor-location-header > .e-con {
	padding-block: 10px;
	padding-inline: 40px;
	/* Solo se estrecha el carril. `justify-content` no es interpolable: cambiarlo
	   provocaba un salto seco, así que se mantiene `space-between` y lo que se
	   anima es `max-width`, que sí transiciona.
	   1120 deja los bloques a media distancia: ni pegados ni en los extremos.
	   Sube el valor para separarlos más, bájalo para juntarlos. */
	max-width: 1120px;
}

body.hx-scrolled .elementor-location-header .elementor-widget-image img {
	width: 118px;
}

/* El CTA y el menú se acercan al centro vertical con menos aire propio. */
body.hx-scrolled .elementor-location-header .elementor-widget-button .elementor-button {
	padding-block: 10px;
}

@media (max-width: 1024px) {
	body.hx-scrolled .elementor-location-header > .e-con {
		padding-block: 8px;
		padding-inline: 24px;
		/* En tablet y móvil solo hay marca y hamburguesa: agruparlas al centro
		   dejaría huecos a los lados, así que siguen en los extremos. */
		justify-content: space-between;
		gap: 16px;
	}
}

@media (max-width: 767px) {
	body.hx-scrolled .elementor-location-header .elementor-widget-image img {
		width: 104px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.elementor-location-header > .e-con,
	.elementor-location-header .elementor-widget-image img {
		transition: none;
	}
}

/* Con el editor de Elementor abierto, sticky estorba al colocar elementos. */
body.elementor-editor-active .elementor-location-header {
	position: relative;
}
