/* ── Extendable: Muro de Testimonios ────────────────────────── */

/* Contenedor principal */
.rcw-wrapper {
	display: flex;
	flex-direction: column;
	gap: 16px;
	overflow: hidden;
	width: 100%;
}

/* Cada fila */
.rcw-row {
	overflow: hidden;
	width: 100%;
}

/* Track animado – duplicar imágenes en PHP permite usar -50% sin JS */
.rcw-track {
	display: flex;
	align-items: center;
	gap: 16px;
	width: max-content;
	will-change: transform;

	/* Fila 1: derecha → izquierda (normal) */
	animation: rcw-scroll var(--rcw-vel1, 30s) linear infinite normal;
}

.rcw-track--fila2 {
	/* Fila 2: izquierda → derecha (reverse) */
	animation-duration: var(--rcw-vel2, 40s);
	animation-direction: reverse;
}

/* Pausa al hover: controlada por CSS variable inyectada desde PHP */
.rcw-wrapper:hover .rcw-track {
	animation-play-state: var(--rcw-hover, running);
}

@keyframes rcw-scroll {
	from { transform: translateX(0); }
	to   { transform: translateX(-50%); }
}

/* Imágenes */
.rcw-img {
	display: block;
	height: 220px;
	max-height: 400px;
	width: auto;
	object-fit: cover;
	border-radius: 12px;
	flex-shrink: 0;
}

/* ── Responsive: gap reducido en móvil ───────────────────────── */
@media (max-width: 767px) {
	.rcw-wrapper { gap: 10px; }
	.rcw-track   { gap: 10px; }
}

/* Accesibilidad: respetar prefers-reduced-motion */
@media (prefers-reduced-motion: reduce) {
	.rcw-track {
		animation: none;
		flex-wrap: wrap;
		width: 100%;
		justify-content: center;
	}

	.rcw-wrapper {
		-webkit-mask-image: none !important;
		mask-image: none !important;
	}

	/* Ocultar clones en modo sin animación */
	.rcw-img[aria-hidden="true"] {
		display: none;
	}
}