/**
 * Scroll-reveal transitions.
 *
 * CSS only. The IntersectionObserver in assets/js/scroll-reveal.js adds
 * .is-revealed; every rule below is a plain CSS transition. No animation
 * library, per CLAUDE.md "Elementor strategy".
 *
 * Elements opt in with data-bc-reveal="fade|up|down|left|right|zoom" and may
 * carry data-bc-reveal-delay (ms), data-bc-reveal-distance (px) and
 * data-bc-reveal-stagger (ms) on a parent.
 *
 * @package BajoCielo
 */

[data-bc-reveal] {
	--bc-reveal-distance: 24px;
	--bc-reveal-delay: 0ms;
	opacity: 0;
	transition:
		opacity var( --bc-duration-slow ) var( --bc-ease ) var( --bc-reveal-delay ),
		transform var( --bc-duration-slow ) var( --bc-ease ) var( --bc-reveal-delay );
	will-change: opacity, transform;
}

[data-bc-reveal="up"] {
	transform: translate3d( 0, var( --bc-reveal-distance ), 0 );
}

[data-bc-reveal="down"] {
	transform: translate3d( 0, calc( -1 * var( --bc-reveal-distance ) ), 0 );
}

[data-bc-reveal="left"] {
	transform: translate3d( var( --bc-reveal-distance ), 0, 0 );
}

[data-bc-reveal="right"] {
	transform: translate3d( calc( -1 * var( --bc-reveal-distance ) ), 0, 0 );
}

[data-bc-reveal="zoom"] {
	transform: scale( 0.94 );
}

[data-bc-reveal].is-revealed {
	opacity: 1;
	transform: none;
}

/*
 * No JavaScript, or the observer never ran: content must still be visible.
 * scroll-reveal.js sets .bc-reveal-ready on <html> the moment it takes over.
 */
html:not( .bc-reveal-ready ) [data-bc-reveal] {
	opacity: 1;
	transform: none;
	transition: none;
}

/*
 * The Elementor editor re-renders widgets in its preview after the observer
 * has run, so nothing would ever reveal them there. Whoever edits a page sees
 * its content at rest.
 */
.elementor-editor-active [data-bc-reveal] {
	opacity: 1;
	transform: none;
	transition: none;
}

@media ( prefers-reduced-motion: reduce ) {

	[data-bc-reveal],
	[data-bc-reveal].is-revealed {
		opacity: 1;
		transform: none;
		transition: none;
	}

	/* The headers' slow zoom (Elementor's Ken Burns) holds still. */
	.elementor-background-slideshow .elementor-ken-burns.elementor-ken-burns {
		transform: none;
	}

	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		scroll-behavior: auto !important;
		transition-duration: 0.01ms !important;
	}
}
