/* ===== Barra superior de familia de marcas ===== */
.alen-topbar{
	--tb-ancho:1245px;
	--tb-lados:0px;
	background:#fff;
	border-bottom:1px solid rgba(11,46,111,.10);
	font-size:13px;
	position:relative;
	z-index:9999;
}
.alen-topbar-inner{
	max-width:var(--tb-ancho, 1425px);
	margin:0 auto;
	padding:0 var(--tb-lados, 28px);
	min-height:43px;
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:24px;
}

/* --- Izquierda --- */
.alen-topbar-familia{
	display:flex;
	align-items:center;
	gap:22px;
	min-width:0;
}
.alen-topbar-txt{
	color:#0b2e6f;
	font-weight:500;
	white-space:nowrap;
}
.alen-topbar-marcas{
	display:flex;
	align-items:center;
	gap:22px;
	margin:0;
	padding:0;
	list-style:none;
}
.alen-topbar-marcas li{ margin:0; padding:0; }
.alen-topbar-marcas a{
	display:block;
	line-height:0;
	opacity:.72;
	transition:opacity .2s ease;
}
.alen-topbar-marcas a:hover,
.alen-topbar-marcas a:focus-visible{ opacity:1; }
.alen-topbar-marcas img{
	height:24px;
	width:auto;
	display:block;
}

/* --- Derecha --- */
.alen-topbar-sub{
	display:inline-flex;
	align-items:center;
	gap:7px;
	color:#0b2e6f;
	text-decoration:none;
	font-weight:500;
	padding:6px 2px;
	border-bottom:1px solid transparent;
	transition:border-color .2s ease, color .2s ease;
	white-space:nowrap;
}
.alen-topbar-sub:hover,
.alen-topbar-sub:focus-visible{
	color:#80144c;
	border-bottom-color:#80144c;
}
.alen-topbar-sub-ico{ font-size:15px; line-height:1; }

body .alen-topbar{ position:relative; z-index:9999; }
/* Visitante normal: el header baja solo lo que mide la barra. */
body #header-outer{ top:44px !important; }
body #header-outer.detached,
body #header-outer.scrolled-down,
body #header-outer.small-nav{ top:0 !important; }

/* Con sesión iniciada se suman los 32px de la barra de admin. */
body.admin-bar #header-outer{ top:76px !important; }
body.admin-bar #header-outer.detached,
body.admin-bar #header-outer.scrolled-down,
body.admin-bar #header-outer.small-nav{ top:32px !important; }
body #header-space{ margin-top:0 !important; }

/* --- Resalte al llegar a la newsletter --- */
#alen-newsletter{ scroll-margin-top:120px; }
.alen-newsletter-foco{
	animation:alen-foco 1.8s ease-out 1;
	border-radius:10px;
}
.alen-topbar-marcas,
.alen-topbar-marcas li{
	list-style:none !important;
	list-style-type:none !important;
}
.alen-topbar-marcas li::marker{ content:"" !important; font-size:0 !important; }
.alen-topbar-marcas li::before{ display:none !important; }

/* ===== Modal del newsletter ===== */
.alen-modal[hidden]{ display:none; }
.alen-modal{
	position:fixed; inset:0; z-index:100000;
	display:flex; align-items:center; justify-content:center;
	padding:20px;
}
.alen-modal-fondo{
	position:absolute; inset:0;
	background:rgba(0,0,0,.5);
	backdrop-filter:blur(3px);
}
.alen-modal-caja{
	position:relative;
	background:#0a1690;
	border-radius:18px;
	box-shadow:0 24px 60px rgba(11,46,111,.45);
	width:100%; max-width:480px;
	max-height:90vh; overflow-y:auto;
	padding:38px 34px 30px;
	text-align:center;
	animation:alen-modal-entra .28s ease-out;
}
.alen-modal-x{
	position:absolute; top:12px; right:14px;
	background:none; border:0; cursor:pointer;
	font-size:28px; line-height:1; color:#fff;
	opacity:.7; transition:opacity .2s ease;
	padding:4px 8px;
}
.alen-modal-x:hover, .alen-modal-x:focus-visible{ opacity:1; }
/*.alen-modal-titulo{
	color:#fff; font-size:1.55rem; line-height:1.25;
	margin:0 0 .5rem;
}*/
.alen-modal-sub{
	color:rgba(255,255,255,.82); font-size:.95rem; line-height:1.5;
	margin:0 0 1.4rem;
}
.alen-modal-form{ text-align:left; }
body.alen-modal-abierto{ overflow:hidden; }
@keyframes alen-modal-entra{
	from{ opacity:0; transform:translateY(14px) scale(.98); }
	to  { opacity:1; transform:none; }
}
.alen-modal-cabecera{
	display:flex;
	align-items:center;
	justify-content:flex-start;
	gap:14px;
	margin-bottom:.9rem;
	flex-wrap:nowrap;
}
.alen-modal-logo{
	height:34px !important;
	width:auto !important;
	max-width:110px !important;
	flex:0 0 auto;
	object-fit:contain;
}
.alen-modal-titulo{
	color:#fff; font-size:1.55rem; line-height:1.25;
	margin:0;
	text-align:left;
	font-size:1.35rem;
	min-width:0;
}

@media (max-width:600px){
	.alen-modal-logo{ height:30px !important; max-width:100px !important; }
	.alen-modal-cabecera{ gap:10px; }
	.alen-modal-caja{ padding:32px 22px 26px; border-radius:14px; }
	.alen-modal-titulo{ font-size:1.15rem; }
}
/* --- Familia AlEn dentro del menú móvil --- */
.alen-familia-movil{
	padding-top:22px;
	margin-top:18px;
	border-top:1px solid rgba(255,255,255,.25);
}
.alen-familia-movil-txt{
	display:block;
	color:#fff;
	font-size:12px;
	opacity:.85;
	margin-bottom:12px;
}
.alen-familia-movil-marcas{
	list-style:none;
	margin:0;
	padding:0;
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	gap:14px;
}
.alen-familia-movil-marcas li::before{ display:none !important; }
.alen-familia-movil-marcas img{ height:22px; width:auto; display:block; }

/* En escritorio no va: ahí ya está la barra superior. */
@media (min-width:1025px){
	.alen-familia-movil{ display:none !important; }
}
@media (prefers-reduced-motion: reduce){
	.alen-modal-caja{ animation:none; }
}

@keyframes alen-foco{
	0%   { box-shadow:0 0 0 0 rgba(128,20,76,.55); }
	100% { box-shadow:0 0 0 14px rgba(128,20,76,0); }
}
@media (prefers-reduced-motion: reduce){
	.alen-newsletter-foco{ animation:none; }
}

/* --- Tablet --- */
@media (max-width:1000px){
	.alen-topbar-inner{ padding:0 18px; gap:14px; }
	.alen-topbar-familia{ gap:14px; }
	.alen-topbar-marcas{ gap:14px; }
	.alen-topbar-marcas img{ height:20px; }
}

/* --- Móvil: se va el texto, quedan logos y Subscribe --- */
@media (max-width:690px){
	.alen-topbar{ font-size:12px; }
	.alen-topbar-inner{ min-height:37px; padding:0 14px; gap:10px; }
	.alen-topbar-txt{ display:none; }
	.alen-topbar-marcas{ gap:12px; }
	.alen-topbar-marcas img{ height:17px; }
}
/* --- La barra es solo de escritorio. En tablet y móvil se va,
       y el header vuelve a su posición original. --- */
@media (max-width:1024px){
	.alen-topbar{ display:none !important; }

	body #header-outer,
	body #header-outer.detached,
	body #header-outer.scrolled-down,
	body #header-outer.small-nav{ top:0 !important; }
}