/*
 * motion.css — the scroll-reveal states plus the few rules Lenis needs.
 *
 * The pre-reveal state is scoped to .js-motion, which motion.js removes when
 * a library fails to load or the visitor prefers reduced motion. Without JS
 * the class is never added at all, so content is always visible.
 */

/* ---- Lenis (only active once the library has initialised) ---- */
html.lenis,
html.lenis body {
	height: auto;
}

/* Lenis owns the scrolling, so the CSS smooth-scroll in base.css must stand
   down. Scoped to .lenis (always present once initialised) rather than
   .lenis-smooth, which Lenis only adds in some configurations. */
html.lenis {
	scroll-behavior: auto;
}

.lenis.lenis-smooth [data-lenis-prevent] {
	overscroll-behavior: contain;
}

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

/* ---- Reveal ---- */
@media (prefers-reduced-motion: no-preference) {
	.js-motion [data-reveal] {
		opacity: 0;
		transform: translateY(16px);
		will-change: transform, opacity;
	}

	/* Opt-in entrances. The batch tween in motion.js animates x/y/scale back to
	   zero, so a section only has to declare where it comes from. */
	.js-motion [data-reveal][data-reveal-from="left"] {
		transform: translate(-28px, 8px);
	}

	.js-motion [data-reveal][data-reveal-from="right"] {
		transform: translate(28px, 8px);
	}

	.js-motion [data-reveal][data-reveal-from="settle"] {
		transform: translateY(20px) scale(0.985);
	}
}