/* Module LOVALANCHE : effets d'apparition au scroll (voir inc/lovalanche-effets.php). */

.lv-effets-actifs .lv-glisse-droite,
.lv-effets-actifs .lv-glisse-gauche,
.lv-effets-actifs .lv-monte,
.lv-effets-actifs .lv-fondu,
.lv-effets-actifs .lv-groupe > * {
	transition-property: opacity, transform;
	transition-timing-function: cubic-bezier(0.22, 0.61, 0.36, 1);
	transition-duration: var(--lv-duree, 1.2s);
	transition-delay: var(--lv-delai, 0s);
	will-change: opacity, transform;
}

/* Zoom arrière : le cadre .lv-zoom reste fixe (overflow caché), sa cible se dézoome.
   Cible : une image, un élément .lv-zoom-cible, sinon le conteneur enfant direct
   (celui qui porte l'image de fond Elementor). */
.lv-effets-actifs .lv-zoom {
	overflow: hidden;
}
.lv-effets-actifs .lv-zoom img,
.lv-effets-actifs .lv-zoom .lv-zoom-cible,
.lv-effets-actifs .lv-zoom > .e-con {
	transform: scale(1.35);
	transform-origin: center center;
	transition: transform var(--lv-duree, 2.5s) cubic-bezier(0.22, 0.61, 0.36, 1) var(--lv-delai, 0s);
}
.lv-effets-actifs .lv-zoom.lv-visible img,
.lv-effets-actifs .lv-zoom.lv-visible .lv-zoom-cible,
.lv-effets-actifs .lv-zoom.lv-visible > .e-con {
	transform: scale(1);
}

.lv-effets-actifs .lv-glisse-droite { opacity: 0; transform: translate3d(var(--lv-distance, 120px), 0, 0); }
.lv-effets-actifs .lv-glisse-gauche { opacity: 0; transform: translate3d(calc(-1 * var(--lv-distance, 120px)), 0, 0); }
.lv-effets-actifs .lv-monte { opacity: 0; transform: translate3d(0, 40px, 0); }
.lv-effets-actifs .lv-fondu,
.lv-effets-actifs .lv-groupe > * { opacity: 0; }
.lv-effets-actifs .lv-groupe > * { transform: translate3d(0, 24px, 0); }

.lv-effets-actifs .lv-visible.lv-glisse-droite,
.lv-effets-actifs .lv-visible.lv-glisse-gauche,
.lv-effets-actifs .lv-visible.lv-monte,
.lv-effets-actifs .lv-visible.lv-fondu,
.lv-effets-actifs .lv-groupe.lv-visible > * {
	opacity: 1;
	transform: none;
}

/* Mobile : distances réduites pour ne pas créer de défilement horizontal. */
@media (max-width: 767px) {
	.lv-effets-actifs .lv-glisse-droite,
	.lv-effets-actifs .lv-glisse-gauche { --lv-distance: 40px; }
}

@media (prefers-reduced-motion: reduce) {
	.lv-effets-actifs .lv-zoom img,
	.lv-effets-actifs .lv-zoom .lv-zoom-cible,
	.lv-effets-actifs .lv-zoom > .e-con,
	.lv-effets-actifs .lv-glisse-droite,
	.lv-effets-actifs .lv-glisse-gauche,
	.lv-effets-actifs .lv-monte,
	.lv-effets-actifs .lv-fondu,
	.lv-effets-actifs .lv-groupe > * {
		opacity: 1 !important;
		transform: none !important;
		transition: none !important;
	}
}

/* Photos des cartes robe [lv_photos_robe] : seconde photo au survol (ordinateur). */
.lv-photos-robe {
	position: relative;
	display: block;
	aspect-ratio: 2 / 3;
	overflow: hidden;
	background: #222222;
}
.elementor .lv-photos-robe img,
.lv-photos-robe img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	transition: opacity 0.6s ease, transform 1.2s ease;
}
.lv-photos-robe__seconde {
	opacity: 0;
}
@media (hover: hover) {
	a:hover .lv-photos-robe.a-une-seconde .lv-photos-robe__seconde,
	.lv-photos-robe.a-une-seconde:hover .lv-photos-robe__seconde {
		opacity: 1;
	}
	a:hover .lv-photos-robe img,
	.lv-photos-robe:hover img {
		transform: scale(1.03);
	}
}

/* Dans un carrousel (Loop Carousel), la carte est un conteneur flex contraint : la photo ne doit pas rétrécir. */
.elementor-widget-lv-photos-robe {
	flex-shrink: 0;
	width: 100%;
}

/* Vidéo de fond différée sur mobile (module performance) : Elementor ne la dimensionne pas
   quand « Lire sur mobile » est désactivé, elle (et son image poster) couvre donc le conteneur ici. */
@media (max-width: 767px) {
	.lv-video-differee > .elementor-background-video-container > video {
		width: 100%;
		height: 100%;
	}
}
