/* Progressive-enhancement safety net for AOS (assets/vendor/aos/aos.css):
   AOS's own CSS holds [data-aos] elements at opacity:0 until its JS adds
   .aos-animate. If the JS never runs (blocked, slow, disabled), that
   content would stay invisible forever — unacceptable for a page whose
   content must never depend on JavaScript. Until effects.js confirms AOS
   initialized (by adding .sss-aos-ready to <html>), every [data-aos]
   element is forced fully visible, no exceptions. */
html:not(.sss-aos-ready) [data-aos] {
	opacity: 1 !important;
	transform: none !important;
}

@media (prefers-reduced-motion: reduce) {
	[data-aos] {
		opacity: 1 !important;
		transform: none !important;
		transition: none !important;
	}
}

/* Parallax elements (assets/js/effects.js) — the JS sets a small
   translateY via inline style; this just hints the browser and provides
   a safe no-JS default (no transform at all). */
[data-parallax] {
	will-change: transform;
}

/* Restrained 3D tilt on hover (assets/js/effects.js). Inert without JS —
   the element just sits flat, which is the correct no-JS state, not a
   degraded one. */
[data-tilt] {
	transition: transform 0.2s ease-out;
	transform-style: preserve-3d;
}

@media (prefers-reduced-motion: reduce) {
	[data-tilt] {
		transition: none !important;
	}
}

/* Same progressive-enhancement contract as [data-aos] above, for the
   Animate.css-driven reveals in assets/js/motion.js (initScrollAnimateCss).
   Only hidden once .sss-motion-ready confirms the observer is running. */
.sss-motion-ready [data-animate] {
	opacity: 0;
}

@media (prefers-reduced-motion: reduce) {
	[data-animate] {
		opacity: 1 !important;
		animation: none !important;
	}
}