/* Phyts Animations — légères, uniquement transform / opacity (pas de recalcul de mise en page). */

/* ---------- Apparition au défilement ---------- */
.ph-anim .ph-reveal {
	opacity: 0;
	transform: translate3d(0, 24px, 0);
	transition: opacity .7s cubic-bezier(.22, .61, .36, 1), transform .7s cubic-bezier(.22, .61, .36, 1);
	transition-delay: var(--ph-delay, 0ms);
}
.ph-anim .ph-reveal.ph-in {
	opacity: 1;
	transform: none;
}
.ph-anim .ph-reveal.ph-instant {
	transition: none;
}

/* ---------- Cartes produits ---------- */
.product-grid-item .product-wrapper {
	transition: transform .35s ease, box-shadow .35s ease;
}
.product-grid-item .product-element-top {
	overflow: hidden;
}
.product-grid-item .product-image-link img {
	transition: transform .6s cubic-bezier(.22, .61, .36, 1);
}
@media (hover: hover) {
	.product-grid-item:hover .product-wrapper {
		transform: translateY(-4px);
		box-shadow: 0 12px 28px -14px rgba(0, 0, 0, .18);
	}
	.product-grid-item:hover .product-image-link img {
		transform: scale(1.04);
	}
}

/* ---------- Catégories ---------- */
.wd-cat .wd-cat-image {
	overflow: hidden;
}
.wd-cat .wd-cat-image img {
	transition: transform .6s cubic-bezier(.22, .61, .36, 1);
}
@media (hover: hover) {
	.wd-cat:hover .wd-cat-image img {
		transform: scale(1.05);
	}
}

/* ---------- Bannières / info-box ---------- */
.promo-banner .banner-image img,
.promo-banner img {
	transition: transform .8s cubic-bezier(.22, .61, .36, 1);
}
@media (hover: hover) {
	.promo-banner:hover .banner-image img,
	.promo-banner:hover img {
		transform: scale(1.03);
	}
	.wd-info-box .info-box-icon {
		transition: transform .35s ease;
	}
	.wd-info-box:hover .info-box-icon {
		transform: translateY(-3px);
	}
}

/* ---------- Boutons ---------- */
.btn,
.button,
button.button,
.wd-add-btn > a {
	transition: background-color .25s ease, color .25s ease, border-color .25s ease, box-shadow .25s ease, transform .2s ease;
}
@media (hover: hover) {
	.btn:hover,
	.button:hover {
		transform: translateY(-1px);
	}
}
.btn:active,
.button:active {
	transform: translateY(0) scale(.98);
}

/* ---------- Moins d'animations demandées par l'appareil ---------- */
@media (prefers-reduced-motion: reduce) {
	.ph-anim .ph-reveal { opacity: 1; transform: none; transition: none; }
	.product-grid-item .product-wrapper,
	.product-grid-item .product-image-link img,
	.wd-cat .wd-cat-image img,
	.promo-banner img,
	.btn,
	.button { transition: none !important; transform: none !important; }
}
