/**
 * Motion Pack - motion.css (loaded once, in the footer)
 *
 * NOTE: the rules that HIDE elements before JavaScript runs (anti-flicker) are
 * printed inline in <head> by PHP, because footer CSS would arrive too late.
 * This file holds everything else.
 */

/* --- Performance hints ---------------------------------------------------- */
.anim-hover-lift,
.anim-parallax {
	will-change: transform;
}

/* --- Hover lift: soft shadow (GSAP handles the upward movement) ------------ */
.anim-hover-lift {
	transition: box-shadow 0.3s ease;
}
.anim-hover-lift:hover,
.anim-hover-lift:focus-within {
	box-shadow: 0 14px 28px rgba(0, 0, 0, 0.18);
}

/* --- Slide animations start off-screen sideways; stop a horizontal scrollbar.
       Only applied once motion.js is running. `clip` does not break sticky headers. */
html.mp-active body {
	overflow-x: clip;
}

/* --- Safety: never leave things hidden/moved in these situations ----------- */

/* Visitor prefers reduced motion. */
@media (prefers-reduced-motion: reduce) {
	.anim-fade-up,
	.anim-fade-in,
	.anim-slide-left,
	.anim-slide-right,
	.anim-scale-in,
	.anim-stagger > *,
	.anim-hover-lift,
	.anim-parallax {
		opacity: 1 !important;
		transform: none !important;
		transition: none !important;
	}
}

/* Elementor editor (extra protection; the plugin also does not load there). */
.elementor-editor-active .anim-fade-up,
.elementor-editor-active .anim-fade-in,
.elementor-editor-active .anim-slide-left,
.elementor-editor-active .anim-slide-right,
.elementor-editor-active .anim-scale-in,
.elementor-editor-active .anim-stagger > * {
	opacity: 1 !important;
	transform: none !important;
}