/* Barra flotante sólida: legible sobre cualquier fondo sin depender del scroll. */
.site-header {
	position: fixed;
	inset: 14px 0 auto;
	z-index: 1000;
	pointer-events: none;
}
.admin-bar .site-header { top: 46px; }

.cabecera-web {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	width: min(var(--ancho), 100% - 2 * var(--margen));
	min-height: 66px;
	margin-inline: auto;
	padding: 8px 12px 8px 28px;
	border-radius: 999px;
	background: rgb(4 5 74 / 94%);
	color: var(--color-blanco);
	pointer-events: auto;
}
.cabecera-web__logo { display: block; flex: none; width: 112px; color: var(--color-neon); }
.cabecera-web__logo svg { width: 100%; height: auto; }

.cabecera-web__nav ul { display: flex; align-items: center; }
.cabecera-web__nav a {
	display: block;
	padding: 12px 16px;
	border-radius: 999px;
	font-family: var(--fuente-titulo);
	font-size: 15px;
	font-weight: 500;
	line-height: 1.2;
	text-decoration: none;
}
.cabecera-web__nav .menu > .menu-item > a:hover,
.cabecera-web__nav .menu > .menu-item:focus-within > a { color: var(--color-neon); }
.cabecera-web__nav .menu-item-has-children { position: relative; }
.cabecera-web__nav .menu-item-has-children > a::after {
	content: '';
	display: inline-block;
	width: 7px;
	height: 7px;
	margin-left: 8px;
	border-right: 1.5px solid currentColor;
	border-bottom: 1.5px solid currentColor;
	transform: translateY(-3px) rotate(45deg);
}

.cabecera-web__nav .sub-menu {
	position: absolute;
	top: 100%;
	left: 0;
	display: block;
	min-width: 270px;
	padding: 8px;
	border-radius: 20px;
	background: var(--color-blanco);
	color: var(--color-navy);
	box-shadow: 0 16px 40px rgb(4 5 74 / 22%);
	opacity: 0;
	visibility: hidden;
	transform: translateY(4px);
	transition: opacity 0.15s ease, transform 0.15s ease, visibility 0.15s;
}
.cabecera-web__nav .menu-item-has-children:hover > .sub-menu,
.cabecera-web__nav .menu-item-has-children:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: none; }
.cabecera-web__nav .sub-menu a:hover { background: var(--color-hielo); }

.cabecera-web__boton { display: none; }

@media (max-width: 960px) {
	.cabecera-web { min-height: 58px; padding: 6px 8px 6px 20px; }
	.cabecera-web__logo { width: 96px; }
	.cabecera-web__boton {
		display: grid;
		place-items: center;
		width: 44px;
		height: 44px;
		padding: 0;
		border: 0;
		border-radius: 50%;
		background: var(--color-neon);
		color: var(--color-navy);
		cursor: pointer;
	}
	.cabecera-web__hamburguesa,
	.cabecera-web__hamburguesa::before,
	.cabecera-web__hamburguesa::after {
		display: block;
		width: 18px;
		height: 2px;
		background: currentColor;
		transition: transform 0.2s ease;
	}
	.cabecera-web__hamburguesa { position: relative; }
	.cabecera-web__hamburguesa::before,
	.cabecera-web__hamburguesa::after { content: ''; position: absolute; left: 0; }
	.cabecera-web__hamburguesa::before { top: -6px; }
	.cabecera-web__hamburguesa::after { top: 6px; }
	[aria-expanded='true'] .cabecera-web__hamburguesa { background: transparent; }
	[aria-expanded='true'] .cabecera-web__hamburguesa::before { top: 0; transform: rotate(45deg); }
	[aria-expanded='true'] .cabecera-web__hamburguesa::after { top: 0; transform: rotate(-45deg); }

	.cabecera-web__nav {
		position: absolute;
		top: calc(100% + 8px);
		left: 0;
		right: 0;
		display: none;
		max-height: calc(100svh - 110px);
		padding: 12px;
		overflow-y: auto;
		border-radius: 24px;
		background: var(--color-navy);
	}
	.cabecera-web__nav.is-open { display: block; }
	.cabecera-web__nav ul { display: block; }
	.cabecera-web__nav a { padding: 12px; font-size: 17px; }
	.cabecera-web__nav .menu-item-has-children > a::after { display: none; }
	.cabecera-web__nav .sub-menu {
		position: static;
		min-width: 0;
		padding: 0 0 8px 12px;
		background: none;
		color: #e6e9ff;
		box-shadow: none;
		opacity: 1;
		visibility: visible;
		transform: none;
	}
	.cabecera-web__nav .sub-menu a { font-size: 15px; }
	.cabecera-web__nav .sub-menu a:hover { background: rgb(255 255 255 / 10%); }
}