/* ==========================================================================
   Motion — transform/opacity only. Classes are added by interactions.js,
   so visitors without JavaScript always see the full content.
   ========================================================================== */

:root {
	--sf-ease-out: cubic-bezier(.22, 1, .36, 1);
	--sf-ease-inout: cubic-bezier(.77, 0, .175, 1);
	--sf-dur-reveal: .8s;
}

.sf-js .sf-reveal {
	opacity: 0;
	transform: translate3d(0, 26px, 0);
	transition: opacity var(--sf-dur-reveal) var(--sf-ease-out), transform var(--sf-dur-reveal) var(--sf-ease-out);
	transition-delay: calc(var(--sf-d, 0) * 1ms);
}
.sf-js .sf-reveal.is-in { opacity: 1; transform: none; }
/* Cards keep their own hover transform once revealed. */
.sf-js .e-con.sf-card.sf-reveal.is-in { transition: opacity var(--sf-dur-reveal) var(--sf-ease-out), transform .45s var(--sf-ease-out), border-color .35s ease, box-shadow .45s ease; transition-delay: 0s; }

/* Timeline line draws in when the section enters. */
.sf-js .e-con.sf-timeline:not(.is-in) { --sf-line-progress: 0; }

/* Hero items wait for the intro sequence. */
.sf-intro-run .sf-hero .elementor-widget,
.sf-intro-run .sf-header__nav,
.sf-intro-run .sf-header__cta,
.sf-intro-run .sf-logo { opacity: 0; }

/* While editing in Elementor everything is visible and static. */
.sf-editing .sf-reveal,
.elementor-editor-active .sf-reveal { opacity: 1 !important; transform: none !important; }
.sf-editing .sf-intro { display: none !important; }

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto !important; }
	*, *::before, *::after {
		animation-duration: .001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .001ms !important;
		transition-delay: 0s !important;
	}
	.sf-js .sf-reveal { opacity: 1; transform: none; }
	.sf-intro { display: none !important; }
	.sf-intro-run .sf-hero .elementor-widget,
	.sf-intro-run .sf-header__nav,
	.sf-intro-run .sf-header__cta,
	.sf-intro-run .sf-logo { opacity: 1; }
}
