/**
 * Scroll-Reveal & Motion — verstärkte Variante
 */

:root {
	--wc-ease-smooth: cubic-bezier(0.22, 1, 0.36, 1);
	--wc-ease-spring: cubic-bezier(0.34, 1.45, 0.64, 1);
	--wc-ease-out-soft: cubic-bezier(0.33, 1, 0.68, 1);
	--wc-duration-reveal: 0.95s;
	--wc-duration-reveal-fast: 0.7s;
	--wc-duration-hero: 1.15s;
	--wc-stagger-step: 0.14s;
	--wc-reveal-distance: 3rem;
	--wc-reveal-distance-sm: 2rem;
}

/* —— Scroll reveal —— */
.wc-reveal {
	opacity: 0;
	filter: blur(6px);
	transform: translate3d(0, var(--wc-reveal-distance), 0);
	transition:
		opacity var(--wc-duration-reveal) var(--wc-ease-smooth),
		transform var(--wc-duration-reveal) var(--wc-ease-smooth),
		filter var(--wc-duration-reveal) var(--wc-ease-smooth);
	will-change: opacity, transform, filter;
}

.wc-reveal.is-visible {
	opacity: 1;
	filter: blur(0);
	transform: none;
}

.wc-reveal--fade {
	filter: none;
	transform: none;
}

.wc-reveal--left {
	transform: translate3d(calc(var(--wc-reveal-distance) * -1), 0, 0);
}

.wc-reveal--right {
	transform: translate3d(var(--wc-reveal-distance), 0, 0);
}

@media (max-width: 767px) {
	.wc-reveal--no-mobile,
	.wc-reveal--no-mobile.is-visible {
		opacity: 1;
		filter: none;
		transform: none;
		transition: none;
		will-change: auto;
	}
}

/* Kein horizontaler Scroll durch Off-Screen-Transforms (core-purpose: CTA-Hover nicht abschneiden) */
.site-main--front > section:not(.steps):not(.core-purpose),
.hero__content {
	overflow-x: clip;
}

.wc-reveal--scale {
	filter: blur(4px);
	transform: scale(0.88) translate3d(0, 1.5rem, 0);
}

.wc-reveal--scale.is-visible {
	transform: none;
}

/* —— Hero: gestaffelter Einstieg —— */
.hero.wc-reveal {
	opacity: 1;
	filter: none;
	transform: none;
}

.hero.wc-reveal .hero__bg {
	transform: scale(1.12);
	transition: transform var(--wc-duration-hero) var(--wc-ease-smooth);
}

.hero.wc-reveal.is-visible .hero__bg {
	transform: scale(1);
}

.hero.wc-reveal .hero__overlay {
	opacity: 0;
	transition: opacity calc(var(--wc-duration-hero) * 0.85) var(--wc-ease-smooth) 0.1s;
}

.hero.wc-reveal.is-visible .hero__overlay {
	opacity: 1;
}

.hero.wc-reveal .hero__tagline,
.hero.wc-reveal .hero__title {
	opacity: 0;
	filter: blur(8px);
	transform: translate3d(0, var(--wc-reveal-distance-sm), 0);
	transition:
		opacity var(--wc-duration-reveal) var(--wc-ease-smooth),
		transform var(--wc-duration-reveal) var(--wc-ease-spring),
		filter var(--wc-duration-reveal) var(--wc-ease-smooth);
}

.hero.wc-reveal.is-visible .hero__tagline {
	opacity: 1;
	filter: blur(0);
	transform: none;
	transition-delay: 0.25s;
}

.hero.wc-reveal.is-visible .hero__title {
	opacity: 1;
	filter: blur(0);
	transform: none;
	transition-delay: 0.5s;
}

.hero.wc-reveal .hero__cta {
	transform: translateY(0.5rem);
	opacity: 0;
	transition:
		opacity 0.5s var(--wc-ease-smooth) 0.55s,
		transform 0.55s var(--wc-ease-spring) 0.55s,
		background-color var(--wc-transition),
		color var(--wc-transition);
}

.hero.wc-reveal.is-visible .hero__cta {
	opacity: 1;
	transform: none;
	transition:
		opacity 0.5s var(--wc-ease-smooth) 0.55s,
		transform 0.35s var(--wc-ease-spring),
		background-color var(--wc-transition),
		color var(--wc-transition);
}

/* —— Stagger-Kinder —— */
.wc-reveal-stagger > .wc-reveal-child {
	opacity: 0;
	filter: blur(5px);
	transform: translate3d(0, var(--wc-reveal-distance-sm), 0) scale(0.94);
	transition:
		opacity var(--wc-duration-reveal-fast) var(--wc-ease-smooth),
		transform var(--wc-duration-reveal-fast) var(--wc-ease-spring),
		filter var(--wc-duration-reveal-fast) var(--wc-ease-smooth);
	will-change: opacity, transform, filter;
}

.wc-reveal-stagger.is-visible > .wc-reveal-child {
	opacity: 1;
	filter: blur(0);
	transform: none;
	transition-delay: var(--wc-reveal-delay, 0s);
}

.wc-reveal-stagger.is-visible > .wc-reveal-child:nth-child(1) {
	transition-delay: calc(var(--wc-stagger-step) * 1);
}

.wc-reveal-stagger.is-visible > .wc-reveal-child:nth-child(2) {
	transition-delay: calc(var(--wc-stagger-step) * 2);
}

.wc-reveal-stagger.is-visible > .wc-reveal-child:nth-child(3) {
	transition-delay: calc(var(--wc-stagger-step) * 3);
}

.wc-reveal-stagger.is-visible > .wc-reveal-child:nth-child(4) {
	transition-delay: calc(var(--wc-stagger-step) * 4);
}

.wc-reveal-stagger.is-visible > .wc-reveal-child:nth-child(5) {
	transition-delay: calc(var(--wc-stagger-step) * 5);
}

.wc-reveal-stagger.is-visible > .wc-reveal-child:nth-child(6) {
	transition-delay: calc(var(--wc-stagger-step) * 6);
}

/* Stats */
.stats__inner.wc-reveal-stagger.is-visible > .stats__item.wc-reveal-child {
	transition-delay: var(--wc-reveal-delay, 0s);
}

.stats__item.wc-reveal-child .stats__value {
	display: inline-block;
	transform: translateY(0.75rem);
	opacity: 0;
	transition:
		transform 0.65s var(--wc-ease-spring),
		opacity 0.55s var(--wc-ease-smooth);
	transition-delay: var(--wc-reveal-delay, 0s);
}

.stats__item.wc-reveal-child .stats__label {
	opacity: 0;
	transform: translateY(0.5rem);
	transition:
		opacity 0.5s var(--wc-ease-smooth),
		transform 0.55s var(--wc-ease-smooth);
	transition-delay: calc(var(--wc-reveal-delay, 0s) + 0.12s);
}

.stats__inner.wc-reveal-stagger.is-visible > .stats__item.wc-reveal-child .stats__value,
.stats__inner.wc-reveal-stagger.is-visible > .stats__item.wc-reveal-child .stats__label {
	opacity: 1;
	transform: none;
}

.stats__divider {
	transform: scaleY(0);
	transform-origin: center;
	opacity: 0;
	transition:
		transform 0.55s var(--wc-ease-spring),
		opacity 0.4s var(--wc-ease-smooth);
}

.stats__inner.wc-reveal-stagger.is-visible .stats__divider {
	transform: scaleY(1);
	opacity: 1;
}

/* Galerie: leichter Zoom */
.gallery-section__card.wc-reveal-child {
	transform: translate3d(0, var(--wc-reveal-distance-sm), 0) scale(0.9);
}

/* Marquee: nur Fade, kein Blur */
.marquee.wc-reveal--fade {
	filter: none;
}

/* Hover */
@media (hover: hover) {
	.steps__card {
		transition: box-shadow 0.35s var(--wc-ease-smooth);
	}

	.steps__card:hover {
		box-shadow: var(--wc-shadow-reveal);
	}
}

@media (prefers-reduced-motion: reduce) {
	.wc-reveal,
	.wc-reveal-stagger > .wc-reveal-child,
	.hero.wc-reveal .hero__tagline,
	.hero.wc-reveal .hero__title,
	.hero.wc-reveal .hero__cta,
	.hero.wc-reveal .hero__bg,
	.hero.wc-reveal .hero__overlay,
	.stats__inner.wc-reveal-stagger.is-visible > .stats__item .stats__value,
	.stats__inner.wc-reveal-stagger.is-visible > .stats__item .stats__label,
	.stats__divider {
		opacity: 1;
		filter: none;
		transform: none;
		transition: none;
		will-change: auto;
	}

	.steps__card {
		transition: none;
	}

	.steps__card:hover {
		box-shadow: none;
	}
}
