/* ─────────────────────────────────────────
   TEIDE 3718 — Home Slider Persiana
   ───────────────────────────────────────── */

.teide-slider {
	position: relative;
	width: 100%;
	max-width: 1200px;
	height: 450px;
	margin: 0 auto;
	overflow: hidden;
	display: flex;
	background: #111;
}

/* Cada tanda ocupa todo el slider */
.teide-slider__tanda {
	position: absolute;
	inset: 0;
	display: flex;
	opacity: 0;
	pointer-events: none;
}

.teide-slider__tanda.activa {
	opacity: 1;
	pointer-events: auto;
}

/* Columnas — 6 en desktop */
.teide-slider__col {
	flex: 1;
	overflow: hidden;
	position: relative;
	transform-origin: top center;
	transition: none;
}

.teide-slider__col img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center top;
	display: block;
	user-select: none;
}

/* Animación persiana: gira sobre eje Y columna a columna */
.teide-slider__col.girando {
	animation: persiana var(--dur, 700ms) ease-in-out forwards;
}

@keyframes persiana {
	0%   { transform: rotateY(0deg);    opacity: 1; }
	50%  { transform: rotateY(90deg);   opacity: 0; }
	51%  { transform: rotateY(-90deg);  opacity: 0; }
	100% { transform: rotateY(0deg);    opacity: 1; }
}

/* ─────────────────────────────────────────
   MOBILE — Ocultar Slider por completo
   ───────────────────────────────────────── */
@media (max-width: 768px) {
	.teide-slider {
		display: none !important;
	}
}