/* ==========================================================================
   Section reveals.

   Replaces Elementor's container entrance animations, which set the
   `elementor-invisible` class (opacity: 0) without ever emitting the matching
   value into data-settings — so the frontend script had nothing to run and
   never took the class off again.

   Nothing here hides content unless a script has confirmed it can show it
   again. That is the rule the Elementor version broke.
   ========================================================================== */

/* Safety net: whatever else happens, an element must never be left invisible.
   Scoped to !important because Elementor's own rule is specific. */
.elementor-invisible { opacity: 1 !important; }

/* Only once JS is present do we hide anything. */
.js .e-con.e-parent > .elementor-element {
	opacity: 0;
	transform: translateY(18px);
}

.js .e-con.e-parent.is-revealed > .elementor-element {
	opacity: 1;
	transform: none;
	transition:
		opacity 700ms var(--ease-out-back),
		transform 700ms var(--ease-out-back);
	/* Children stagger by their position, so a panel assembles rather than
	   appearing as one slab. */
	transition-delay: calc(var(--r, 0) * 70ms);
}

/* Scroll-driven where supported: the panel reveals as it enters rather than
   on a timer, and reverses if the reader scrolls back. */
@supports (animation-timeline: view()) {
	@media (prefers-reduced-motion: no-preference) {
		.js .e-con.e-parent > .elementor-element {
			animation: reveal-in 1s linear both;
			animation-timeline: view();
			animation-range: entry 10% entry 55%;
			transition: none;
		}
	}
}

@keyframes reveal-in {
	from { opacity: 0; transform: translateY(18px); }
	to   { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
	.js .e-con.e-parent > .elementor-element,
	.js .e-con.e-parent.is-revealed > .elementor-element {
		opacity: 1 !important;
		transform: none !important;
		transition: none !important;
		animation: none !important;
	}
}

/* #work is excluded, and the reason is not cosmetic.
 *
 * A transform on an ancestor re-parents position:sticky onto that ancestor, so
 * the Werdegang pin would hold still relative to a box that is itself moving —
 * it stops pinning to the viewport and the whole effect collapses. The same
 * applies to the animation-timeline variant above.
 *
 * Nothing is lost: the section brings its own entrance. The tiles fly in from
 * the right as the rail reaches them. See cv.css and cv.js.
 */
.js #work.e-con.e-parent > .elementor-element {
	opacity: 1;
	transform: none;
	animation: none;
	transition: none;
}
