/**
 * Site-wide scroll-reveal and hero load animations.
 */

:root {
	--sp-reveal-duration: 0.75s;
	--sp-reveal-ease: cubic-bezier(0.22, 1, 0.36, 1);
	--sp-reveal-distance: 28px;
	--sp-reveal-stagger: 0.1s;
}

[data-home-reveal],
[data-home-hero-reveal] {
	transition:
		opacity var(--sp-reveal-duration) var(--sp-reveal-ease),
		transform var(--sp-reveal-duration) var(--sp-reveal-ease),
		clip-path var(--sp-reveal-duration) var(--sp-reveal-ease);
}

[data-home-reveal="fade-up"].is-animating,
[data-home-hero-reveal="fade-up"].is-animating {
	opacity: 0;
	transform: translateY(var(--sp-reveal-distance));
}

[data-home-reveal="fade-in"].is-animating,
[data-home-hero-reveal="fade-in"].is-animating {
	opacity: 0;
}

[data-home-reveal="slide-left"].is-animating,
[data-home-hero-reveal="slide-left"].is-animating {
	opacity: 0;
	transform: translateX(-32px);
}

[data-home-reveal="scale-up"].is-animating,
[data-home-hero-reveal="scale-up"].is-animating {
	opacity: 0;
	transform: scale(0.96);
}

[data-home-reveal="clip-up"].is-animating,
[data-home-hero-reveal="clip-up"].is-animating {
	opacity: 0;
	clip-path: inset(100% 0 0 0);
}

[data-home-reveal="line-grow"].is-animating {
	transform: scaleX(0);
	transform-origin: left center;
}

.sp-selected-work__divider[data-home-reveal="line-grow"],
.sp-svc-tech__divider[data-home-reveal="line-grow"] {
	overflow: hidden;
}

html.no-js [data-home-reveal],
html.no-js [data-home-hero-reveal] {
	opacity: 1 !important;
	transform: none !important;
	clip-path: none !important;
}

@media (prefers-reduced-motion: reduce) {
	[data-home-reveal],
	[data-home-hero-reveal] {
		transition: none;
	}

	[data-home-reveal].is-animating,
	[data-home-hero-reveal].is-animating {
		opacity: 1;
		transform: none;
		clip-path: none;
	}
}

@media (max-width: 768px) {
	[data-home-reveal],
	[data-home-hero-reveal] {
		transition: none;
	}

	[data-home-reveal].is-animating,
	[data-home-hero-reveal].is-animating {
		opacity: 1;
		transform: none;
		clip-path: none;
	}
}