/* ==========================================================================
   Animation — Scroll-Reveal (transform-only), Micro-Interactions, Hero Load
   ========================================================================== */

/* Reveal: NEVER opacity:0 at rest — content must be visible in plain HTML
   (headless renders / crawlers / no-JS). Only transform moves. */
[data-reveal] {
	transform: translateY(36px);
	transition: transform 700ms var(--ease-out);
	will-change: transform;
}

[data-reveal].is-visible {
	transform: translateY(0);
}

.service-row[data-reveal] {
	transform: translateY(24px);
}

.hero__text[data-reveal],
.hero__media[data-reveal] {
	transform: translateY(20px);
	transition: transform 800ms var(--ease-out);
}

.hero__media[data-reveal] {
	transition-delay: 90ms;
}

@media (prefers-reduced-motion: reduce) {
	[data-reveal],
	.hero__text[data-reveal],
	.hero__media[data-reveal] {
		transform: none;
		transition: none;
	}
}

/* Micro-interactions */
.service-row__media { overflow: hidden; }

.service-row__img {
	transition: transform 500ms var(--ease-out);
}

.service-row:hover .service-row__img {
	transform: scale(1.04);
}

.slide {
	transition: transform var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out);
}

.slide:hover {
	transform: translateY(-4px);
	box-shadow: 0 16px 32px -20px oklch(22% 0.01 192 / 0.35);
}

a:active,
button:active {
	transition: transform 120ms var(--ease-out);
}

@media (prefers-reduced-motion: reduce) {
	* {
		animation-duration: 0.001ms !important;
		transition-duration: 0.001ms !important;
	}
	.service-row:hover .service-row__img,
	.slide:hover {
		transform: none;
	}
}