/**
 * Shop v2 — motion keyframes & reveal utilities
 * Scoped under .shop-v2
 */

@keyframes ms-fab-ring {
	0% {
		box-shadow: 0 0 0 0 var(--ms-brand-glow);
	}
	70% {
		box-shadow: 0 0 0 calc(12px * var(--ms-motion-scale, 1)) transparent;
	}
	100% {
		box-shadow: 0 0 0 0 transparent;
	}
}

@keyframes ms-glow-breathe {
	0%,
	100% {
		opacity: calc(0.35 + 0.15 * var(--ms-motion-scale, 1));
		transform: scale(1);
	}
	50% {
		opacity: calc(0.55 + 0.2 * var(--ms-motion-scale, 1));
		transform: scale(calc(1 + 0.04 * var(--ms-motion-scale, 1)));
	}
}

@keyframes ms-fade-up {
	from {
		opacity: 1;
		transform: translateY(calc(16px * var(--ms-motion-scale, 1)));
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* Content visible by default; motion is enhancement only */
.shop-v2 .ms-reveal {
	opacity: 1;
	transform: none;
}

.shop-v2 .ms-reveal.is-inview {
	animation: ms-fade-up var(--ms-duration-reveal) var(--ms-ease-out) both;
}

.shop-v2 .ms-reveal-stagger > * {
	opacity: 1;
	transform: none;
}

.shop-v2 .ms-reveal-stagger.is-inview > * {
	animation: ms-fade-up var(--ms-duration-reveal) var(--ms-ease-out) both;
}

.shop-v2 .ms-reveal-stagger.is-inview > *:nth-child(1) { animation-delay: calc(var(--ms-stagger-step) * 0); }
.shop-v2 .ms-reveal-stagger.is-inview > *:nth-child(2) { animation-delay: calc(var(--ms-stagger-step) * 1); }
.shop-v2 .ms-reveal-stagger.is-inview > *:nth-child(3) { animation-delay: calc(var(--ms-stagger-step) * 2); }
.shop-v2 .ms-reveal-stagger.is-inview > *:nth-child(4) { animation-delay: calc(var(--ms-stagger-step) * 3); }
.shop-v2 .ms-reveal-stagger.is-inview > *:nth-child(5) { animation-delay: calc(var(--ms-stagger-step) * 4); }
.shop-v2 .ms-reveal-stagger.is-inview > *:nth-child(6) { animation-delay: calc(var(--ms-stagger-step) * 5); }

@media (prefers-reduced-motion: reduce) {
	.shop-v2 .ms-reveal.is-inview,
	.shop-v2 .ms-reveal-stagger.is-inview > * {
		animation: none;
	}
}