.ac-collections {
	width: 100%;
	/* Efecto parallax suave */
	transform: translateY(0);
	transition: transform 0.1s ease-out;
}

/* Efecto parallax al hacer scroll */
.ac-collections[data-scroll] {
	transform: translateY(var(--scroll-offset, 0px));
}

/* Desktop grid */
@media (min-width: 768px) {
	.ac-collections .ac-collections-grid {
		display: grid;
		grid-template-columns: 1fr 1fr;
		grid-template-rows: 1fr 1fr;
		gap: 16px;
		height: 480px;
	}

	/* Layout original con contenedores rectangulares moderados */
	.ac-collections .ac-collection-item.item-1 {
		aspect-ratio: 1 / 1.8; /* Rectangular vertical moderado */
	}

	.ac-collections .ac-collection-item.item-2,
	.ac-collections .ac-collection-item.item-3 {
		aspect-ratio: 1 / 0.9; /* Rectangular horizontal moderado */
	}

	.ac-collections .ac-collections-slider {
		display: none;
	}

	.ac-collections .ac-collection-item.item-1 {
		grid-column: 1 / 2;
		grid-row: 1 / span 2;
	}

	.ac-collections .ac-collection-item.item-2 {
		grid-column: 2 / 3;
		grid-row: 1 / 2;
	}

	.ac-collections .ac-collection-item.item-3 {
		grid-column: 2 / 3;
		grid-row: 2 / 3;
	}
}

/* Mobile slider */
@media (max-width: 767px) {
	.ac-collections .ac-collections-grid {
		display: none;
	}

	.ac-collections .ac-collections-slider {
		display: block;
	}
}

.ac-collection-item {
	position: relative;
	display: block;
	width: 100%;
	height: 100%;
	border-radius: 8px;
	overflow: hidden;
	background: #f4f4f4;
	transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
	cursor: pointer;
}

/* Las imágenes ahora son background de .ac-collection-item */
.ac-collection-item {
	background-position: center center !important;
	background-size: cover !important;
	background-repeat: no-repeat !important;
	/* Zoom sutil para mostrar mejor el centro de la imagen */
	background-attachment: scroll;
}

/* Todas las imágenes siempre centradas */

.ac-collection-title {
	position: absolute;
	left: 12px;
	bottom: 12px;
	color: #000;
	background: rgba(255, 255, 255, 0.85);
	padding: 6px 10px;
	border-radius: 4px;
	font-weight: 600;
	font-size: 14px;
	line-height: 1;
}

/* Optional: fixed slide height on mobile for consistent look */
@media (max-width: 767px) {
	.ac-collections .ac-collection-item {
		height: 340px;
	}
}

/* ===== EFECTOS HOVER ELEGANTES ===== */

/* Overlay base */
.ac-collection-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	transition: opacity 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
	z-index: 1;
}

/* Efecto Zoom */
.hover-zoom {
	position: relative;
	overflow: hidden;
}

.hover-zoom::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image: inherit;
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
	transition: transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
	transform-origin: center center;
	z-index: 0;
}

.hover-zoom:hover::before {
	transform: scale(1.15);
}

.hover-zoom:hover .ac-collection-overlay {
	opacity: 1;
}

/* Efecto Zoom Out */
.hover-zoom-out {
	position: relative;
	overflow: hidden;
}

.hover-zoom-out::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image: inherit;
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
	transition: transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
	transform-origin: center center;
	transform: scale(1.1);
	z-index: 0;
}

.hover-zoom-out:hover::before {
	transform: scale(1.0);
}

.hover-zoom-out:hover .ac-collection-overlay {
	opacity: 1;
}

/* Efecto Escala */
.hover-scale {
	position: relative;
	overflow: hidden;
}

.hover-scale::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image: inherit;
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
	transition: transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
	transform-origin: center center;
	z-index: 0;
}

.hover-scale:hover::before {
	transform: scale(1.12);
}

.hover-scale:hover .ac-collection-overlay {
	opacity: 1;
}

/* Efecto Desvanecer */
.hover-fade {
	transition: opacity 0.3s ease;
}

.hover-fade:hover {
	opacity: 0.7;
}

.hover-fade:hover .ac-collection-overlay {
	opacity: 1;
}

/* Efecto Deslizar Arriba */
.hover-slide-up {
	transition: background-position 0.3s ease;
}

.hover-slide-up:hover {
	background-position: center calc(50% - 10px) !important;
}

.hover-slide-up:hover .ac-collection-overlay {
	opacity: 1;
}

/* Efecto Deslizar Abajo */
.hover-slide-down {
	transition: background-position 0.3s ease;
}

.hover-slide-down:hover {
	background-position: center calc(50% + 10px) !important;
}

.hover-slide-down:hover .ac-collection-overlay {
	opacity: 1;
}

/* Efecto Rotar */
.hover-rotate {
	transition: transform 0.3s ease;
}

.hover-rotate:hover {
	transform: rotate(5deg) scale(1.1);
}

.hover-rotate:hover .ac-collection-overlay {
	opacity: 1;
}

/* Efecto Desenfoque */
.hover-blur {
	transition: filter 0.3s ease;
}

.hover-blur:hover {
	filter: blur(2px);
}

.hover-blur:hover .ac-collection-overlay {
	opacity: 1;
}

/* Efecto Escala de Grises */
.hover-grayscale {
	transition: filter 0.3s ease;
}

.hover-grayscale:hover {
	filter: grayscale(100%);
}

.hover-grayscale:hover .ac-collection-overlay {
	opacity: 1;
}

/* Título con efecto en hover */
.ac-collection-title {
	position: absolute;
	left: 12px;
	bottom: 12px;
	color: #000;
	background: rgba(255, 255, 255, 0.85);
	padding: 6px 10px;
	border-radius: 4px;
	font-weight: 600;
	font-size: 14px;
	line-height: 1;
	z-index: 3;
	transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* Efecto en el título durante hover */
.ac-collection-item:hover .ac-collection-title {
	background: rgba(255, 255, 255, 0.95);
	transform: translateY(-2px);
}

/* Duración personalizada */
.ac-collection-item[data-hover-duration] .ac-collection-image,
.ac-collection-item[data-hover-duration] .ac-collection-overlay,
.ac-collection-item[data-hover-duration] .ac-collection-title {
	transition-duration: calc(var(--hover-duration, 300) * 1ms);
}

/* Mejoras de rendimiento */
.ac-collection-item {
	will-change: transform;
	backface-visibility: hidden;
}

/* Efectos suaves en móvil */
@media (max-width: 768px) {
	.ac-collection-item:hover .ac-collection-image {
		transform: none;
	}
	
	.hover-zoom:hover .ac-collection-image,
	.hover-zoom-out:hover .ac-collection-image,
	.hover-scale:hover,
	.hover-rotate:hover .ac-collection-image {
		transform: scale(1.02);
	}
}

/* ===== EFECTOS DE REVELADO PROGRESIVO CON SCROLL ===== */

/* Estado inicial - todos los elementos ocultos */
.scroll-reveal {
	opacity: var(--scroll-progress, 0);
	transition: none; /* Sin transición para que siga el scroll en tiempo real */
}

/* Revelado desde la derecha */
.scroll-reveal-right {
	opacity: var(--scroll-progress, 0);
	transform: translateX(calc(100px * (1 - var(--scroll-progress, 0))));
	transition: none;
}

/* Revelado desde la izquierda */
.scroll-reveal-left {
	opacity: var(--scroll-progress, 0);
	transform: translateX(calc(-100px * (1 - var(--scroll-progress, 0))));
	transition: none;
}

/* Revelado desde arriba */
.scroll-reveal-up {
	opacity: var(--scroll-progress, 0);
	transform: translateY(calc(-100px * (1 - var(--scroll-progress, 0))));
	transition: none;
}

/* Revelado desde abajo */
.scroll-reveal-down {
	opacity: var(--scroll-progress, 0);
	transform: translateY(calc(100px * (1 - var(--scroll-progress, 0))));
	transition: none;
}

/* Revelado con zoom desde el centro */
.scroll-reveal-zoom {
	opacity: var(--scroll-progress, 0);
	transform: scale(calc(0.8 + (0.2 * var(--scroll-progress, 0))));
	transition: none;
}

/* Revelado con rotación */
.scroll-reveal-rotate {
	opacity: var(--scroll-progress, 0);
	transform: rotate(calc(-10deg * (1 - var(--scroll-progress, 0)))) scale(calc(0.9 + (0.1 * var(--scroll-progress, 0))));
	transition: none;
}

/* Revelado con deslizamiento diagonal */
.scroll-reveal-diagonal-up {
	opacity: var(--scroll-progress, 0);
	transform: translate(
		calc(-50px * (1 - var(--scroll-progress, 0))), 
		calc(50px * (1 - var(--scroll-progress, 0)))
	);
	transition: none;
}

.scroll-reveal-diagonal-down {
	opacity: var(--scroll-progress, 0);
	transform: translate(
		calc(50px * (1 - var(--scroll-progress, 0))), 
		calc(-50px * (1 - var(--scroll-progress, 0)))
	);
	transition: none;
}

/* Delays para efectos escalonados */
.scroll-reveal-delay-100 { transition-delay: 0.1s; }
.scroll-reveal-delay-200 { transition-delay: 0.2s; }
.scroll-reveal-delay-300 { transition-delay: 0.3s; }
.scroll-reveal-delay-400 { transition-delay: 0.4s; }
.scroll-reveal-delay-500 { transition-delay: 0.5s; }
.scroll-reveal-delay-600 { transition-delay: 0.6s; }
.scroll-reveal-delay-700 { transition-delay: 0.7s; }
.scroll-reveal-delay-800 { transition-delay: 0.8s; }