/* Plantilla genérica de página (Contacto, Da de alta tu concierto, 404,
   búsqueda...): cabecera editorial oscura + columna de contenido legible. */

.pagina__cabecera {
	background: var(--indf-negro);
	color: var(--indf-crema);
	padding: 56px 0 44px;
}

.pagina__eyebrow {
	font-family: var(--fuente-display);
	text-transform: uppercase;
	font-size: 13px;
	letter-spacing: 0.03em;
	color: var(--indf-turquesa);
	margin: 0 0 8px;
}

.pagina__titulo {
	font-family: var(--fuente-display);
	text-transform: uppercase;
	font-size: clamp(36px, 6vw, 60px);
	line-height: 0.95;
	margin: 0;
	transform: rotate(-1deg);
}

.pagina__imagen-destacada {
	aspect-ratio: 16 / 9;
	overflow: hidden;
	border: 2px solid var(--indf-negro);
	margin-bottom: 24px;
}

.pagina__imagen-destacada img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.pagina-sala__datos {
	list-style: none;
	margin: 0 0 24px;
	padding: 0;
	font-size: 15px;
}

.pagina-sala__datos li {
	padding: 6px 0;
	border-bottom: 1px solid rgba(28, 27, 25, 0.15);
}

.pagina__contenido {
	max-width: 700px;
	padding: 48px 20px 64px;
	font-size: 16px;
	line-height: 1.7;
}

.pagina__contenido p {
	margin: 0 0 1.2em;
}

.pagina__contenido h2 {
	/* Menú flotante / hotfix tipografía (tarea 5): --fuente-titular
	   (Archivo Black), no --fuente-display (Anton condensada) -mismo
	   criterio ya aplicado en .profesionales-bloque__titulo. Este h2 lo
	   escribe Nía como texto libre dentro del contenido de una página
	   cualquiera, de longitud impredecible: con la condensada, un título
	   algo largo se leía apretado. Archivo Black da la misma presencia
	   editorial en negrita sin ese problema (base.css ya documenta esta
	   regla: la condensada es solo para rótulos cortos y conocidos de
	   antemano, nunca para texto que pueda ser largo). */
	font-family: var(--fuente-titular);
	text-transform: uppercase;
	font-size: 26px;
	margin: 1.4em 0 0.6em;
}

.pagina__contenido a {
	text-decoration: underline;
}

@media (max-width: 640px) {
	.pagina__cabecera {
		padding: 40px 0 32px;
	}

	.pagina__titulo {
		transform: none;
	}
}

/* ------------------------------------------------------------------
 * Contacto.
 * ------------------------------------------------------------------ */

.pagina-contacto__intro {
	font-size: 18px;
	max-width: 46ch;
	margin: 0 0 8px;
}

.pagina-contacto__email {
	margin: 0 0 32px;
}

.pagina-contacto__email a {
	font-family: var(--fuente-ui);
	font-weight: 700;
	text-transform: uppercase;
	font-size: 19px;
	letter-spacing: 0.02em;
	color: var(--indf-turquesa-oscuro);
	text-decoration: none;
	border-bottom: 2px solid currentColor;
}

/* ------------------------------------------------------------------
 * 404.
 * ------------------------------------------------------------------ */

.pagina-404__enlaces {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 10px 20px;
	padding: 0;
	margin: 0 0 32px;
}

.pagina-404__enlaces a {
	font-family: var(--fuente-ui);
	font-weight: 700;
	text-transform: uppercase;
	font-size: 14px;
	letter-spacing: 0.02em;
	text-decoration: none;
	border-bottom: 2px solid var(--indf-turquesa);
}

.pagina-404__buscador {
	display: flex;
	gap: 8px;
	max-width: 380px;
}

.pagina-404__buscador input[type="search"] {
	flex: 1;
	padding: 10px 14px;
	border: 2px solid var(--indf-negro);
	border-radius: var(--radio);
	font-size: 15px;
}

.pagina-404__buscador button {
	font-family: var(--fuente-ui);
	font-weight: 700;
	text-transform: uppercase;
	font-size: 13px;
	padding: 0 20px;
	border: 2px solid var(--indf-negro);
	background: var(--indf-turquesa);
	border-radius: var(--radio);
	cursor: pointer;
}

/* ------------------------------------------------------------------
 * Búsqueda.
 * ------------------------------------------------------------------ */

.pagina-busqueda__query {
	color: var(--indf-crema-apagada);
	font-size: 15px;
	margin: 8px 0 0;
}

.pagina-busqueda__lista {
	list-style: none;
	margin: 0;
	padding: 0;
}

.pagina-busqueda__item {
	padding: 20px 0;
	border-bottom: 1px solid rgba(28, 27, 25, 0.15);
}

.pagina-busqueda__tipo {
	font-family: var(--fuente-ui);
	font-weight: 700;
	text-transform: uppercase;
	font-size: 11px;
	letter-spacing: 0.03em;
	color: var(--indf-turquesa-oscuro);
	margin: 0 0 4px;
}

.pagina-busqueda__titulo {
	font-family: var(--fuente-titular);
	text-transform: uppercase;
	font-size: 19px;
	line-height: 1.25;
	margin: 0 0 6px;
}

.pagina-busqueda__titulo a {
	text-decoration: none;
}

.pagina-busqueda__extracto {
	font-size: 15px;
	margin: 0;
}

.pagina-busqueda__vacio {
	font-size: 16px;
}
