/* Site motion — smooth CSS reveals (no GSAP opacity flash) */

html.js-motion .motion-reveal {
	opacity: 0;
	transform: translate3d(0, 40px, 0);
	transition:
		opacity 1.35s cubic-bezier(0.16, 1, 0.3, 1),
		transform 1.45s cubic-bezier(0.16, 1, 0.3, 1);
	transition-delay: var(--motion-delay, 0s);
	will-change: opacity, transform;
}

html.js-motion .motion-reveal.is-inview {
	opacity: 1;
	transform: translate3d(0, 0, 0);
	will-change: auto;
}

/* Heroes: rise only — never drop opacity to 0 after paint (avoids blink). */
html.js-motion .hero-section .motion-hero-item,
html.js-motion .about-hero .motion-hero-item,
html.js-motion .internal-hero .motion-hero-item {
	opacity: 1;
	transform: translate3d(0, 26px, 0);
	transition: transform 1.5s cubic-bezier(0.16, 1, 0.3, 1);
	transition-delay: var(--motion-delay, 0s);
}

html.js-motion .hero-section .motion-hero-item--soft {
	transform: scale(1.035);
	transition: transform 1.8s cubic-bezier(0.16, 1, 0.3, 1);
}

html.js-motion .hero-section.is-hero-ready .motion-hero-item,
html.js-motion .about-hero.is-hero-ready .motion-hero-item,
html.js-motion .internal-hero.is-hero-ready .motion-hero-item {
	transform: translate3d(0, 0, 0);
}

html.js-motion .hero-section.is-hero-ready .motion-hero-item--soft {
	transform: scale(1);
}

html.js-motion .hero-section__snippet {
	animation: webob-float-a 6s ease-in-out infinite alternate;
}

html.js-motion .hero-section__snippet--right {
	animation-name: webob-float-b;
	animation-duration: 6.8s;
	animation-delay: 0.45s;
}

html.js-motion .cta-banner__decor {
	animation: webob-float-a 7.5s ease-in-out infinite alternate;
}

html.js-motion .cta-banner__decor:nth-child(2) {
	animation-name: webob-float-b;
	animation-duration: 8.2s;
	animation-delay: 0.55s;
}

html.js-motion .motion-lift {
	transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

html.js-motion .motion-lift:hover {
	transform: translate3d(0, var(--motion-lift, -6px), 0);
}

html.js-motion .motion-lift img {
	transition: transform 0.75s cubic-bezier(0.16, 1, 0.3, 1);
}

html.js-motion .motion-lift:hover img {
	transform: scale(1.03);
}

html.js-motion .hero-section__actions .webob-btn,
html.js-motion .cta-banner__action .webob-btn {
	transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

@keyframes webob-float-a {
	from {
		transform: translate3d(0, 0, 0) rotate(0deg);
	}
	to {
		transform: translate3d(0, -10px, 0) rotate(-1deg);
	}
}

@keyframes webob-float-b {
	from {
		transform: translate3d(0, 0, 0) rotate(0deg);
	}
	to {
		transform: translate3d(0, 10px, 0) rotate(1.1deg);
	}
}

@media (prefers-reduced-motion: reduce) {
	html.js-motion .motion-reveal,
	html.js-motion .hero-section .motion-hero-item,
	html.js-motion .about-hero .motion-hero-item,
	html.js-motion .internal-hero .motion-hero-item,
	html.js-motion .hero-section__snippet,
	html.js-motion .cta-banner__decor,
	html.js-motion .motion-lift,
	html.js-motion .motion-lift img {
		opacity: 1 !important;
		transform: none !important;
		animation: none !important;
		transition: none !important;
	}
}

@media (max-width: 768px) {
	html.js-motion .motion-reveal {
		transform: translate3d(0, 28px, 0);
		transition-duration: 1.15s, 1.25s;
	}

	html.js-motion .hero-section .motion-hero-item,
	html.js-motion .about-hero .motion-hero-item,
	html.js-motion .internal-hero .motion-hero-item {
		transform: translate3d(0, 16px, 0);
		transition-duration: 1.2s;
	}

	html.js-motion .hero-section__snippet,
	html.js-motion .cta-banner__decor {
		animation: none;
	}
}