/* Portada: la melé a toda pantalla, las tres puertas al club (escuela, senior y femenino) con su horario, el
   senior, los valores, noticias, abonados, álbumes, patrocinadores, preguntas y contacto. */

.buc-portada {
	position: relative;
	display: grid;
	align-items: end;
	min-height: min(88svh, 860px);
	padding-block: clamp(7rem, 5rem + 8vw, 10rem) clamp(3rem, 2rem + 4vw, 5.5rem);
	background: var(--buc-noche);
	color: var(--buc-blanco);
	overflow: hidden;
	isolation: isolate;
}

.buc-portada__foto {
	position: absolute;
	inset: 0;
	z-index: -2;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 60% 40%;
}

.buc-portada::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background:
		linear-gradient(90deg, rgb(16 17 20 / 0.92) 0%, rgb(16 17 20 / 0.72) 42%, rgb(16 17 20 / 0.12) 78%),
		linear-gradient(0deg, rgb(16 17 20 / 0.85) 0%, rgb(16 17 20 / 0) 45%);
}

.buc-portada__texto {
	max-width: calc(var(--buc-ancho) + 2 * var(--buc-hueco));
}

.buc-portada__texto > * {
	max-width: 40rem;
}

.buc-portada h1 {
	max-width: 12ch;
}

.buc-portada h1 span {
	color: var(--buc-oro);
}

.buc-portada__lema {
	margin-top: 1.25rem;
	font-size: clamp(1.1rem, 1rem + 0.5vw, 1.35rem);
	font-weight: 600;
}

.buc-portada__entradilla {
	margin-top: 0.75rem;
	color: #d6d9e0;
}

@media (prefers-reduced-motion: no-preference) {
	.buc-portada__texto > * {
		animation: buc-llega 0.9s var(--buc-salida) both;
	}

	.buc-portada__texto > :nth-child(2) {
		animation-delay: 80ms;
	}

	.buc-portada__texto > :nth-child(3) {
		animation-delay: 140ms;
	}

	.buc-portada__texto > :nth-child(4) {
		animation-delay: 200ms;
	}

	.buc-portada__foto {
		animation: buc-foto 1.6s var(--buc-salida) both;
	}
}

@keyframes buc-llega {
	from {
		opacity: 0;
		transform: translateY(14px);
	}
}

@keyframes buc-foto {
	from {
		transform: scale(1.06);
		filter: saturate(0.6);
	}
}

@media (max-width: 700px) {
	.buc-portada {
		min-height: auto;
		padding-top: 16rem;
	}

	.buc-portada::before {
		background: linear-gradient(0deg, rgb(16 17 20 / 0.96) 0%, rgb(16 17 20 / 0.85) 50%, rgb(16 17 20 / 0.2) 85%);
	}

	.buc-portada .buc-acciones .buc-boton {
		width: 100%;
	}
}

/* Las tres puertas. */
.buc-equipos {
	padding-block: var(--buc-seccion);
}

.buc-puertas {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: clamp(1.25rem, 0.8rem + 1.5vw, 2rem);
	padding: 0;
	margin: 0;
	list-style: none;
}

.buc-puerta {
	position: relative;
	display: flex;
	flex-direction: column;
	border-radius: var(--buc-radio);
	background: var(--buc-blanco);
	box-shadow: var(--buc-sombra);
	overflow: hidden;
}

.buc-puerta__foto {
	position: relative;
	aspect-ratio: 4 / 3;
	overflow: hidden;
}

.buc-puerta__foto::after {
	content: "";
	position: absolute;
	inset: auto 0 0;
	height: 6px;
	background: var(--buc-rojo);
}

.buc-puerta--senior .buc-puerta__foto::after {
	background: var(--buc-azul);
}

.buc-puerta--femenino .buc-puerta__foto::after {
	background: var(--buc-oro);
}

.buc-puerta__foto img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.6s var(--buc-salida);
}

.buc-puerta:hover .buc-puerta__foto img {
	transform: scale(1.04);
}

.buc-puerta__texto {
	display: flex;
	flex: 1;
	flex-direction: column;
	padding: 1.35rem 1.4rem 1.5rem;
}

.buc-puerta h3 a {
	color: var(--buc-tinta);
	text-decoration: none;
}

.buc-puerta h3 a:hover {
	color: var(--buc-rojo-hondo);
}

.buc-puerta__para {
	margin-top: 0.2rem;
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--buc-rojo-hondo);
}

.buc-puerta__para + p {
	margin-top: 0.75rem;
	color: var(--buc-gris);
}

.buc-puerta .buc-horario + .buc-horario {
	margin-top: 0.35rem;
}

.buc-puerta .buc-boton {
	align-self: flex-start;
	margin-top: auto;
	transform-origin: left center;
}

.buc-puerta .buc-horario:last-of-type {
	margin-bottom: 1.4rem;
}

@media (max-width: 980px) {
	.buc-puertas {
		grid-template-columns: minmax(0, 1fr);
		max-width: 38rem;
	}
}

/* Senior. */
.buc-senior {
	padding-block: 0 var(--buc-seccion);
}

/* Valores: cuatro palabras en la noche del club. */
.buc-valores {
	padding-block: var(--buc-seccion);
	background: var(--buc-noche);
	color: var(--buc-blanco);
}

.buc-valores h2 {
	max-width: 20ch;
}

.buc-valores__lista {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 2rem;
	margin: clamp(2rem, 1.4rem + 2vw, 3.25rem) 0 0;
}

.buc-valores__lista div {
	padding-top: 1.1rem;
	border-top: 1px solid rgb(255 255 255 / 0.18);
}

.buc-valores__lista dt {
	font-size: clamp(1.5rem, 1.2rem + 1vw, 2.1rem);
	font-weight: 700;
	letter-spacing: -0.02em;
	color: var(--buc-oro);
}

.buc-valores__lista dd {
	margin: 0.6rem 0 0;
	color: var(--buc-gris-noche);
}

@media (max-width: 900px) {
	.buc-valores__lista {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 520px) {
	.buc-valores__lista {
		grid-template-columns: minmax(0, 1fr);
		gap: 1.5rem;
	}
}

/* Noticias. */
.buc-noticias {
	padding-block: var(--buc-seccion);
}

/* Abonados sobre la foto de familia del club. */
.buc-club {
	position: relative;
	display: grid;
	align-items: end;
	min-height: min(80svh, 720px);
	padding-block: var(--buc-seccion);
	color: var(--buc-blanco);
	isolation: isolate;
	overflow: hidden;
}

.buc-club__foto {
	position: absolute;
	inset: 0;
	z-index: -2;
}

.buc-club__foto img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.buc-club::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(0deg, rgb(16 17 20 / 0.94) 0%, rgb(16 17 20 / 0.7) 45%, rgb(16 17 20 / 0.1) 80%);
}

.buc-club__texto > * {
	max-width: 38rem;
}

.buc-club__texto p {
	margin-top: 1rem;
	color: #dfe2e8;
}

/* Álbumes: fila que se desplaza en horizontal. */
.buc-galeria {
	padding-block: var(--buc-seccion);
	background: var(--buc-cal);
}

.buc-albumes {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: minmax(260px, 22rem);
	gap: 1.25rem;
	padding: 0.5rem max(var(--buc-hueco), calc((100vw - var(--buc-ancho)) / 2)) 1.25rem;
	margin: 0;
	list-style: none;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-padding-inline: max(var(--buc-hueco), calc((100vw - var(--buc-ancho)) / 2));
	scrollbar-width: thin;
}

.buc-album {
	scroll-snap-align: start;
}

.buc-album a {
	display: grid;
	gap: 0.3rem;
	color: var(--buc-tinta);
	text-decoration: none;
}

.buc-album img {
	width: 100%;
	aspect-ratio: 16 / 10;
	object-fit: cover;
	border-radius: var(--buc-radio);
	margin-bottom: 0.5rem;
	transition: transform 0.4s var(--buc-salida);
}

.buc-album a:hover img {
	transform: translateY(-3px);
}

.buc-album__titulo {
	font-weight: 600;
	line-height: 1.3;
}

.buc-album a:hover .buc-album__titulo {
	color: var(--buc-rojo-hondo);
}

.buc-album__meta {
	font-size: 0.85rem;
	color: var(--buc-gris);
}

/* Patrocinadores y colaboradores. */
.buc-apoyos {
	padding-block: var(--buc-seccion);
}

.buc-apoyos__grupo {
	margin-top: 2.25rem;
}

.buc-apoyos__grupo h3 {
	margin-bottom: 1rem;
	font-size: 1.1rem;
}

.buc-apoyos__invitacion {
	margin-top: 2.25rem;
	color: var(--buc-gris);
}

/* Contacto. */
.buc-contacto__mapa {
	padding-block: 0 var(--buc-seccion);
	background: var(--buc-noche);
	max-width: none;
}

#contacto {
	background: var(--buc-noche);
}

.buc-contacto__mapa .buc-mapa {
	max-width: var(--buc-ancho);
	margin-inline: auto;
}