/* ---------------------------------------------------------------
   Portada
   --------------------------------------------------------------- */

.lm-hero{
	height:500px;
	overflow:hidden;
	background:#1a1a1a;
}
.lm-hero__video{width:100%;height:100%;object-fit:cover;display:block}

/* título de sección con los guiones dorados */
.lm-titulo{
	font-family:var(--lm-display);
	font-size:36px;
	font-weight:500;
	text-align:center;
	color:var(--lm-titulo);
	margin:0 0 36px;
	line-height:1.2;
}
.lm-titulo--claro{color:#fff}
.lm-titulo::before,
.lm-titulo::after{
	content:"—";
	color:var(--lm-dorado);
	margin:0 14px;
	font-weight:400;
}

/* --------------------------------- carrusel de noticias */

.lm-carrusel{position:relative;padding:0 44px}
.lm-carrusel__pista{
	display:flex;gap:var(--lm-gutter);
	overflow-x:auto;scroll-behavior:smooth;scroll-snap-type:x mandatory;
	scrollbar-width:none;
	padding-bottom:4px;
}
.lm-carrusel__pista::-webkit-scrollbar{display:none}
.lm-carrusel__flecha{
	position:absolute;top:50%;transform:translateY(-50%);
	width:34px;height:34px;border:0;border-radius:50%;
	background:rgba(255,255,255,.9);cursor:pointer;
	display:flex;align-items:center;justify-content:center;
}
.lm-carrusel__flecha::before{
	content:"";width:9px;height:9px;
	border-right:2px solid var(--lm-azul);
	border-bottom:2px solid var(--lm-azul);
}
.lm-carrusel__flecha--prev{left:0}
.lm-carrusel__flecha--prev::before{transform:rotate(135deg);margin-left:3px}
.lm-carrusel__flecha--next{right:0}
.lm-carrusel__flecha--next::before{transform:rotate(-45deg);margin-right:3px}
.lm-carrusel__flecha:hover{background:#fff}

/* La tarjeta vive en theme.css (la usan también Noticias y los listados). En el carrusel mide un tercio. */
.lm-carrusel .lm-tarjeta{flex:0 0 calc((100% - var(--lm-gutter) * 2) / 3);scroll-snap-align:start}

/* --------------------------------- accesos rápidos */

.lm-accesos{
	list-style:none;margin:0;padding:0;
	display:grid;grid-template-columns:repeat(5,1fr);gap:var(--lm-gutter);
}
.lm-accesos__item a{display:block;color:#fff;text-align:center}
.lm-accesos__item a:hover{text-decoration:none}
.lm-accesos__img{width:100%;height:auto;display:block}
.lm-accesos__titulo{
	display:block;margin-top:12px;
	font-family:var(--lm-display);font-size:16px;font-weight:700;color:#fff;line-height:1.2;
}
.lm-accesos__item a:hover .lm-accesos__titulo{color:var(--lm-dorado)}

/* --------------------------------- sitios relacionados */

.lm-sitios{
	list-style:none;margin:0;padding:0;
	display:grid;grid-template-columns:repeat(5,1fr);align-items:center;gap:24px;
}
.lm-sitios li{display:flex;justify-content:center}
.lm-sitios__logo{max-height:46px;width:auto;filter:grayscale(1);opacity:.8;transition:all .25s ease}
.lm-sitios a:hover .lm-sitios__logo{filter:none;opacity:1}

/* --------------------------------- eventos e instagram */

.lm-eventos,
.lm-instagram{color:#fff}
.lm-eventos a{color:#fff}

@media (max-width:980px){
	.lm-hero{height:320px}
	.lm-titulo{font-size:28px}
	.lm-carrusel .lm-tarjeta{flex-basis:calc((100% - var(--lm-gutter)) / 2)}
	/* Accesos: 3 por fila en tablet (5 = 3 + 2, la segunda fila centrada). */
	.lm-accesos{grid-template-columns:repeat(6,minmax(0,1fr))}
	.lm-accesos__item{grid-column:span 2}
	.lm-accesos__item:nth-child(3n+1):nth-last-child(2){grid-column:2 / span 2}
	.lm-accesos__item:nth-child(3n+1):last-child{grid-column:3 / span 2}
	.lm-sitios{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:600px){
	.lm-carrusel{padding:0}
	.lm-carrusel__flecha{display:none}
	.lm-carrusel .lm-tarjeta{flex-basis:86%}
	/* En celular, de a dos (antes iban de a uno y la sección medía casi 1.400 px). */
	.lm-accesos{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 14px}
	.lm-accesos__item,
	.lm-accesos__item:nth-child(3n+1):nth-last-child(2),
	.lm-accesos__item:nth-child(3n+1):last-child{grid-column:auto}
	.lm-accesos__item:nth-child(odd):last-child{grid-column:1 / -1;justify-self:center;width:calc(50% - 7px)}
	.lm-accesos__titulo{font-size:14px;margin-top:8px}
}

/* --------------------------------- «Ver más» bajo una sección (portada) */

.lm-seccion__pie{margin:40px 0 0;text-align:center}
/* .lm-boton--grande vive en theme.css. */
