/**
 * Animations & Transitions
 * Matt Van Buren — Luxury Watch Dealership
 *
 * Slow, smooth, cinematic transitions.
 */

/* === Fade In Up (default reveal animation) === */
.mvb-animate {
	opacity: 0;
	transform: translateY(30px);
	transition:
		opacity 0.8s cubic-bezier(0.4, 0, 0.2, 1),
		transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.mvb-animate.is-visible {
	opacity: 1;
	transform: translateY(0);
}

/* === Stagger children === */
.mvb-stagger > .mvb-animate:nth-child(1) { transition-delay: 0s; }
.mvb-stagger > .mvb-animate:nth-child(2) { transition-delay: 0.1s; }
.mvb-stagger > .mvb-animate:nth-child(3) { transition-delay: 0.2s; }
.mvb-stagger > .mvb-animate:nth-child(4) { transition-delay: 0.3s; }
.mvb-stagger > .mvb-animate:nth-child(5) { transition-delay: 0.4s; }
.mvb-stagger > .mvb-animate:nth-child(6) { transition-delay: 0.5s; }
.mvb-stagger > .mvb-animate:nth-child(7) { transition-delay: 0.6s; }
.mvb-stagger > .mvb-animate:nth-child(8) { transition-delay: 0.7s; }

/* === Fade In (no movement) === */
.mvb-fade {
	opacity: 0;
	transition: opacity 1s cubic-bezier(0.4, 0, 0.2, 1);
}

.mvb-fade.is-visible {
	opacity: 1;
}

/* === Scale In === */
.mvb-scale {
	opacity: 0;
	transform: scale(0.95);
	transition:
		opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1),
		transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.mvb-scale.is-visible {
	opacity: 1;
	transform: scale(1);
}

/* === Slide In Left === */
.mvb-slide-left {
	opacity: 0;
	transform: translateX(-40px);
	transition:
		opacity 0.8s cubic-bezier(0.4, 0, 0.2, 1),
		transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.mvb-slide-left.is-visible {
	opacity: 1;
	transform: translateX(0);
}

/* === Slide In Right === */
.mvb-slide-right {
	opacity: 0;
	transform: translateX(40px);
	transition:
		opacity 0.8s cubic-bezier(0.4, 0, 0.2, 1),
		transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.mvb-slide-right.is-visible {
	opacity: 1;
	transform: translateX(0);
}

/* === Hero Text Reveal === */
.mvb-hero-text {
	opacity: 0;
	transform: translateY(40px);
	transition:
		opacity 1.2s cubic-bezier(0.4, 0, 0.2, 1),
		transform 1.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.mvb-hero-text.is-visible {
	opacity: 1;
	transform: translateY(0);
}

/* === Gold Line Expand === */
.mvb-line-expand {
	width: 0;
	transition: width 1s cubic-bezier(0.4, 0, 0.2, 1);
}

.mvb-line-expand.is-visible {
	width: 60px;
}

/* === Counter Animation === */
.mvb-counter {
	opacity: 0;
	transform: translateY(20px);
	transition:
		opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1),
		transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.mvb-counter.is-visible {
	opacity: 1;
	transform: translateY(0);
}

/* === Image reveal with clip === */
.mvb-reveal-image {
	clip-path: inset(0 100% 0 0);
	transition: clip-path 1.2s cubic-bezier(0.77, 0, 0.175, 1);
}

.mvb-reveal-image.is-visible {
	clip-path: inset(0 0 0 0);
}

/* === Parallax helper (applied via JS) === */
.mvb-parallax {
	will-change: transform;
}

/* === Prefers reduced motion === */
@media (prefers-reduced-motion: reduce) {
	.mvb-animate,
	.mvb-fade,
	.mvb-scale,
	.mvb-slide-left,
	.mvb-slide-right,
	.mvb-hero-text,
	.mvb-line-expand,
	.mvb-counter,
	.mvb-reveal-image {
		opacity: 1;
		transform: none;
		clip-path: none;
		transition: none;
	}
}