/* =========================================================
   Vita-Leben GmbH — Animationen
   Hartes Prinzip: Reveal NUR ueber transform, nie opacity:0 im
   Startzustand — jeder Endzustand ist auch ohne JS sichtbar.
   ========================================================= */

.reveal {
	transform: translateY(26px);
	transition: transform 640ms var(--ease-out);
	transition-delay: var(--reveal-delay, 0ms);
	will-change: transform;
}

.reveal-left {
	transform: translateX(-32px);
}

.reveal-right {
	transform: translateX(32px);
}

.reveal.is-visible {
	transform: translateY(0) translateX(0);
}

@media (prefers-reduced-motion: reduce) {
	.reveal,
	.reveal-left,
	.reveal-right {
		transform: none;
		transition: none;
	}
}

/* ---- Hero entrance ---- */
.hero-copy,
.hero-media {
	animation: vl-hero-in 760ms var(--ease-out) both;
}

.hero-media {
	animation-delay: 120ms;
}

@keyframes vl-hero-in {
	from {
		transform: translateY(18px);
	}
	to {
		transform: translateY(0);
	}
}

@media (prefers-reduced-motion: reduce) {
	.hero-copy,
	.hero-media {
		animation: none;
	}
}

/* ---- Press feedback (global) ---- */
a.service-card:active,
.slider-prev:active,
.slider-next:active,
.burger:active .burger-box {
	transform: scale(0.98);
}

/* ---- Loaded-state guard: everything already visible without JS ---- */
.no-js .reveal {
	transform: none;
}