/* ============================================================
   VINTAGE WINE CO. - VIEWPORT ANIMATION SYSTEM
   Global, reusable entrance animations triggered by IntersectionObserver.
============================================================ */

[data-vw-animate] {
	--vw-animation-duration: 1s;
	--vw-animation-delay: 0ms;
	--vw-animation-distance: 20px;
	--vw-animation-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

/*
 * Elements remain untouched until JavaScript confirms the animation system
 * is available. This avoids permanently hiding content if JS is disabled.
 */
.vw-animations-ready [data-vw-animate] {
	will-change: opacity, transform;
	transition:
		opacity var(--vw-animation-duration) var(--vw-animation-ease) var(--vw-animation-delay),
		transform var(--vw-animation-duration) var(--vw-animation-ease) var(--vw-animation-delay);
}

.vw-animations-ready [data-vw-animate="fade-up"]:not(.is-in-view) {
	opacity: 0;
	transform: translate3d(0, var(--vw-animation-distance), 0);
}

.vw-animations-ready [data-vw-animate="fade-in"]:not(.is-in-view) {
	opacity: 0;
}

.vw-animations-ready [data-vw-animate].is-in-view {
	opacity: 1;
	transform: translate3d(0, 0, 0);
}

.vw-animations-ready [data-vw-animate].is-animation-complete {
	will-change: auto;
}

@media (prefers-reduced-motion: reduce) {
	.vw-animations-ready [data-vw-animate],
	.vw-animations-ready [data-vw-animate]:not(.is-in-view),
	.vw-animations-ready [data-vw-animate].is-in-view {
		opacity: 1;
		transform: none;
		transition: none;
		will-change: auto;
	}
}
