/* ==========================================================================
   MOTION SYSTEM — Lenis smooth scroll + fade-up reveal + subtle parallax.
   Generic add-on layer, prefixed ab- (kept separate from hw- on purpose —
   same reusable system used on Knusrus, ported here rather than
   reimplemented). See hawehuis-motion.js for the JS half.
   ========================================================================== */

html.lenis,
html.lenis body {
	height: auto;
}

.lenis.lenis-smooth {
	scroll-behavior: auto !important;
}

.lenis.lenis-smooth [data-lenis-prevent] {
	overscroll-behavior: contain;
}

.lenis.lenis-stopped {
	overflow: hidden;
}

.lenis.lenis-scrolling iframe {
	pointer-events: none;
}

/* Fade-up reveal base */

.ab-reveal {
	--ab-reveal-y: 28px;
	--ab-parallax-y: 0px;
	--ab-hover-y: 0px;

	opacity: 0 !important;
	transform: translate3d(0, calc(var(--ab-reveal-y) + var(--ab-parallax-y) + var(--ab-hover-y)), 0) !important;

	transition:
		opacity 0.8s cubic-bezier(0.25, 1, 0.5, 1),
		transform 0.8s cubic-bezier(0.25, 1, 0.5, 1),
		filter 0.55s ease,
		box-shadow 0.55s ease,
		border-color 0.55s ease,
		background 0.55s ease !important;

	will-change: opacity, transform;
}

.ab-reveal.active {
	--ab-reveal-y: 0px;
	opacity: 1 !important;
}

/* Stagger delays */

.ab-reveal-delay-1 {
	transition-delay: 0.08s !important;
}

.ab-reveal-delay-2 {
	transition-delay: 0.16s !important;
}

.ab-reveal-delay-3 {
	transition-delay: 0.24s !important;
}

.ab-reveal-delay-4 {
	transition-delay: 0.32s !important;
}

/* Hover lift that doesn't break reveal/parallax */

.ab-hover-lift:hover {
	--ab-hover-y: -5px;
}

/* Once the entrance reveal has finished, hover should feel instant, not
   carry the slow one-time entrance easing. */
.ab-hover-lift.active {
	transition:
		opacity 0.95s cubic-bezier(0.25, 1, 0.5, 1),
		transform 0.18s ease,
		filter 0.2s ease,
		box-shadow 0.25s ease,
		border-color 0.25s ease,
		background 0.25s ease !important;
}

/* Hero background parallax. Covers both a real wp:cover image (once real
   photos land) and the current .hw-photo-placeholder stand-in, so this
   doesn't need editing again when the hero photo is swapped in. */

.hw-hero {
	overflow: hidden !important;
}

.hw-hero .wp-block-cover__image-background,
.hw-hero .hw-photo-placeholder,
.hw-hero .hw-photo-fill {
	transform: translate3d(0, var(--hw-hero-parallax-y, 0px), 0) scale(1.06) !important;
	transform-origin: center top;
	will-change: transform;
}

/* Accessibility */

@media (prefers-reduced-motion: reduce) {
	html.lenis,
	html.lenis body {
		scroll-behavior: auto !important;
	}

	.ab-reveal,
	.ab-reveal.active {
		opacity: 1 !important;
		transform: none !important;
		transition: none !important;
	}

	.hw-hero .wp-block-cover__image-background,
	.hw-hero .hw-photo-placeholder,
	.hw-hero .hw-photo-fill {
		transform: none !important;
	}

	* {
		animation-duration: 0.001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.001ms !important;
	}
}
