/* .animate — CSS-driven fade used by js/animations.js.
   Elements are only hidden once the script has added .js-animate to <html>,
   so nothing stays invisible if the script doesn't run (editor, crawlers,
   reduced motion, GSAP failing to load). */

/* Hidden instantly (no transition), so nothing visibly fades out first */
.js-animate .animate {
	opacity: 0;
	transform: translateY(30px);
}

/* The fade-in only */
.js-animate .animate.is-visible {
	opacity: 1;
	transform: none;
	transition: opacity .8s ease, transform .8s cubic-bezier(.22, .61, .36, 1);
}

/* Safety nets */
.elementor-editor-active .animate {opacity: 1 !important; transform: none !important;}

@media (prefers-reduced-motion: reduce) {
	.js-animate .animate {opacity: 1; transform: none; transition: none;}
}