/*
 * Scroll-in animations for [data-aos] elements (replaces aos.css). Same effects, timing and
 * selector weights as AOS. Only active while <html> has .hidp-animations (screens 1024px and
 * wider, set before first paint), so content is never hidden on phones or without JavaScript.
 */
body[data-aos-easing="ease"] [data-aos] {
	transition-timing-function: ease;
}
body[data-aos-duration="400"] [data-aos] {
	transition-duration: 0.4s;
}
:where(.hidp-animations) [data-aos][data-aos][data-aos-duration="1000"] {
	transition-duration: 1s;
}
:where(.hidp-animations) [data-aos][data-aos][data-aos-duration="2000"] {
	transition-duration: 2s;
}
:where(.hidp-animations) [data-aos][data-aos][data-aos-duration="3000"] {
	transition-duration: 3s;
}

:where(.hidp-animations) [data-aos^="fade"][data-aos^="fade"],
:where(.hidp-animations) [data-aos^="zoom"][data-aos^="zoom"] {
	opacity: 0;
	transition-property: opacity, transform;
}
:where(.hidp-animations) [data-aos^="fade"][data-aos^="fade"].aos-animate {
	opacity: 1;
	transform: translateZ(0);
}
:where(.hidp-animations) [data-aos^="zoom"][data-aos^="zoom"].aos-animate {
	opacity: 1;
	transform: translateZ(0) scale(1);
}

:where(.hidp-animations) [data-aos="fade-up"] {
	transform: translate3d(0, 100px, 0);
}
:where(.hidp-animations) [data-aos="fade-left"] {
	transform: translate3d(100px, 0, 0);
}
:where(.hidp-animations) [data-aos="fade-right"] {
	transform: translate3d(-100px, 0, 0);
}
:where(.hidp-animations) [data-aos="zoom-in"] {
	transform: scale(0.6);
}
:where(.hidp-animations) [data-aos="zoom-in-up"] {
	transform: translate3d(0, 100px, 0) scale(0.6);
}
:where(.hidp-animations) [data-aos="zoom-in-down"] {
	transform: translate3d(0, -100px, 0) scale(0.6);
}

/* Visitors who asked their system for less motion get the content without the animation. */
@media (prefers-reduced-motion: reduce) {
	:where(.hidp-animations) [data-aos][data-aos] {
		opacity: 1;
		transform: none;
		transition: none;
	}
}