/*
 * Estilos del header, el panel de menú a pantalla completa y el acordeón
 * de submenús. Valores exactos (radios, blur, breakpoints) pendientes de
 * ajuste cuando lleguen las capturas/código de Figma.
 */
.noodos-sin-scroll {
	overflow: hidden;
}
.noodos-cabecera {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: var(--z-header);
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: var(--espaciado-header-vertical) var(--espaciado-header-lateral);
}
.custom-logo-link {
	display: flex;
}
.custom-logo-link img {
	display: block;
}
/* Reserva el espacio del header fijo (medido por cabecera.js) para que el
 * contenido de la página empiece justo debajo y no quede tapado. */
#content {
	padding-top: var(--altura-header);
}
button.noodos-boton-hamburguesa,
button.noodos-boton-cerrar {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.5em;
	height: 2.5em;
	background: none;
	border: 0;
	border-radius: 0;
	color: var(--color-texto);
	cursor: pointer;
	padding: 0;
}
button.noodos-boton-hamburguesa:hover,
button.noodos-boton-hamburguesa:focus,
button.noodos-boton-cerrar:hover,
button.noodos-boton-cerrar:focus {
	background-color: transparent;
	color: var(--color-texto);
}
.noodos-boton-hamburguesa {
	flex-direction: column;
	gap: 10px;
}
.noodos-boton-hamburguesa span {
	display: block;
	width: 48px;
	height: 3px;
	background: #000;
}
.noodos-panel-menu {
	position: fixed;
	inset: 0;
	z-index: var(--z-overlay);
	background: var(--color-fondo-overlay);
	backdrop-filter: blur(var(--difuminado-overlay));
	-webkit-backdrop-filter: blur(var(--difuminado-overlay));
	padding: var(--espaciado-header-vertical) var(--espaciado-header-lateral);
	overflow-y: auto;
	scrollbar-width: none;
	-ms-overflow-style: none;
	opacity: 0;
	visibility: hidden;
	transform: translateY(-8px);
	transition: opacity var(--transicion-rapida), transform var(--transicion-rapida), visibility var(--transicion-rapida);
}
.noodos-panel-menu::-webkit-scrollbar {
	display: none;
}
.noodos-panel-menu--abierto {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}
.noodos-boton-cerrar {
	position: absolute;
	top: 0;
	right: 0;
	margin: var(--espaciado-header-vertical) var(--espaciado-header-lateral);
}
.noodos-boton-cerrar::before,
.noodos-boton-cerrar::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 141%;
	height: 3px;
	background: #000;
}
.noodos-boton-cerrar::before {
	transform: translate(-50%, -50%) rotate(45deg);
}
.noodos-boton-cerrar::after {
	transform: translate(-50%, -50%) rotate(-45deg);
}
.noodos-menu__lista {
	list-style: none;
	margin-top: 4em;
	font-family: 'Open Sauce Sans', var(--fuente-sans);
}
.noodos-menu__lista > li {
	font-size: clamp(28px, 4.69vw, 90px);
	text-transform: uppercase;
	line-height: 1.5;
}
.noodos-menu__lista a {
	color: var(--color-texto);
	font-size: inherit;
	text-decoration: none;
}

.noodos-item-momentos {
	font-size: clamp(33px, 5.52vw, 106px);
}
.noodos-item-momentos > a {
	font-family: 'Cormorant', var(--fuente-serif);
	font-style: italic;
	font-weight: 400;
}

.noodos-item-con-hijos {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
}

button.noodos-boton-acordeon {
	display: inline-flex;
	align-items: center;
	background: none;
	border: 0;
	border-radius: 0;
	color: var(--color-texto);
	font-size: 0.6em;
	cursor: pointer;
	padding: 0;
	margin-left: 0.5em;
}
button.noodos-boton-acordeon:hover,
button.noodos-boton-acordeon:focus {
	background-color: transparent;
	color: var(--color-texto);
}

.noodos-submenu {
	flex-basis: 100%;
	list-style: none;
	font-size: clamp(20px, 0.4em, 36px);
	text-transform: uppercase;
	margin: 0 0 0 1em;
	max-height: 0;
	overflow: hidden;
	opacity: 0;
	transform: translateY(-6px);
	transition: max-height var(--transicion-rapida), opacity var(--transicion-rapida), transform var(--transicion-rapida);
}

.noodos-submenu--abierto {
	max-height: 30em;
	opacity: 1;
	transform: translateY(0);
}
