/*
 * IS Motion. Start states only apply when .is-motion-on is set on <html>.
 * The head script sets it when JS runs and either the visitor has not asked
 * for reduced motion or Settings > IS Motion forces animations on.
 *
 * Classes (add in Elementor > Advanced > CSS Classes):
 *   is-anim-fade-up    element fades in and rises
 *   is-anim-fade       element fades in
 *   is-anim-stagger    direct children fade up one after another
 *   is-anim-mask       element reveals with a clip-path wipe (from the left)
 *   is-anim-mask-right add with is-anim-mask: wipe in from the right
 *   is-anim-mask-up    add with is-anim-mask: wipe in from the bottom
 *   is-bg-fixed        background stays fixed while the section scrolls over it (desktop)
 *   is-bg-mask         section background is revealed through a growing clip-path frame
 */

.is-motion-on .is-anim-fade-up,
.is-motion-on .is-anim-fade {
	opacity: 0;
}

.is-motion-on .is-anim-fade-up {
	transform: translate3d(0, 32px, 0);
}

.is-motion-on .is-anim-stagger > * {
	opacity: 0;
	transform: translate3d(0, 32px, 0);
}

.is-motion-on .is-anim-mask {
	clip-path: inset(0 100% 0 0);
}

/* Direction variants: pair with is-anim-mask. Default wipes in from the left. */
.is-motion-on .is-anim-mask.is-anim-mask-right {
	clip-path: inset(0 0 0 100%);
}

.is-motion-on .is-anim-mask.is-anim-mask-up {
	clip-path: inset(100% 0 0 0);
}

/* Lenis */
html.lenis,
html.lenis body {
	height: auto;
}

.lenis.lenis-smooth {
	scroll-behavior: auto !important;
}

.lenis.lenis-stopped {
	overflow: hidden;
}

/* Fixed background: desktop only, iOS and touch ignore background-attachment: fixed. */
@media (min-width: 1025px) and (hover: hover) {
	.is-bg-fixed {
		background-attachment: fixed !important;
		background-size: cover !important;
		background-position: center !important;
	}
}

.is-bg-mask {
	will-change: clip-path;
}

/* ---------------------------------------------------------------
 * Page transition: native cross-document View Transitions.
 * Chrome/Edge 126+ and Safari 18.2+ animate; other browsers navigate
 * normally. No JS involved.
 * ------------------------------------------------------------- */
@media (prefers-reduced-motion: no-preference) {
	@view-transition {
		navigation: auto;
	}
}

/* Forced mode adds the @view-transition opt-in inline (see is-motion.php).
 * Simple cross-fade between pages. */
::view-transition-old(root) {
	animation: is-vt-out 0.25s ease both;
}

::view-transition-new(root) {
	animation: is-vt-in 0.35s ease both;
}

@keyframes is-vt-out {
	to {
		opacity: 0;
	}
}

@keyframes is-vt-in {
	from {
		opacity: 0;
	}
}