/* Elements remain visible until JavaScript confirms that animations can run. */
.isi-animations-ready [data-isi-animation] {
	opacity: 0;
	transition-property: opacity, transform;
	transition-duration: var(--isi-animation-duration, 700ms);
	transition-delay: var(--isi-animation-delay, 0ms);
	transition-timing-function: var(--isi-animation-easing, ease-out);
	will-change: opacity, transform;
}

.isi-animations-ready [data-isi-animation="fade-up"] {
	transform: translate3d(0, 32px, 0);
}

.isi-animations-ready [data-isi-animation="fade-down"] {
	transform: translate3d(0, -32px, 0);
}

.isi-animations-ready [data-isi-animation="slide-up"] {
	transform: translate3d(0, 72px, 0);
}

.isi-animations-ready [data-isi-animation="slide-left"] {
	transform: translate3d(-72px, 0, 0);
}

.isi-animations-ready [data-isi-animation="slide-right"] {
	transform: translate3d(72px, 0, 0);
}

.isi-animations-ready [data-isi-animation="zoom-in"] {
	transform: scale(0.88);
}

.isi-animations-ready [data-isi-animation="zoom-out"] {
	transform: scale(1.12);
}

.isi-animations-ready [data-isi-animation].isi-is-visible {
	opacity: 1;
	transform: none;
	will-change: auto;
}

@media (prefers-reduced-motion: reduce) {
	.isi-animations-ready [data-isi-animation] {
		opacity: 1;
		transform: none;
		transition: none;
	}
}
