/* Implicit OS — scroll-in animation presets.
   Elements get data-cdsb-animate="<type>" + inline custom properties for
   duration/delay/easing (set server-side, see Cdsb_Animation::render_attrs).
   The .is-visible class is added by animations.js once the element enters
   the viewport; until then the element sits in its pre-visible state. */

[data-cdsb-animate]:not([data-cdsb-animate="none"]) {
	opacity: 0;
	transition-property: opacity, transform;
	transition-duration: var(--cdsb-anim-duration, 600ms);
	transition-delay: var(--cdsb-anim-delay, 0ms);
	transition-timing-function: var(--cdsb-anim-easing, ease);
	will-change: opacity, transform;
}

[data-cdsb-animate="fade"] { transform: none; }
[data-cdsb-animate="slide-up"] { transform: translateY(28px); }
[data-cdsb-animate="slide-down"] { transform: translateY(-28px); }
[data-cdsb-animate="slide-left"] { transform: translateX(28px); }
[data-cdsb-animate="slide-right"] { transform: translateX(-28px); }
[data-cdsb-animate="scale"] { transform: scale(0.92); }

[data-cdsb-animate].is-visible {
	opacity: 1;
	transform: none;
}

/* Respect the OS-level "reduce motion" accessibility setting — animation
   becomes a hard cut to the final state instead of a forced transition. */
@media (prefers-reduced-motion: reduce) {
	[data-cdsb-animate] {
		transition: none !important;
		opacity: 1 !important;
		transform: none !important;
	}
}
