/**
 * Mishtam — lightweight animations (transform + opacity only)
 * Respects prefers-reduced-motion. No JS libraries required.
 */

@keyframes ms-float {
	0%, 100% { transform: translate3d(0, 0, 0); }
	50% { transform: translate3d(0, -12px, 0); }
}

@keyframes ms-fade-up {
	from {
		opacity: 0;
		transform: translate3d(0, 24px, 0);
	}
	to {
		opacity: 1;
		transform: translate3d(0, 0, 0);
	}
}

@keyframes ms-fade-in {
	from { opacity: 0; }
	to { opacity: 1; }
}

@keyframes ms-scale-in {
	from {
		opacity: 0;
		transform: scale(0.96);
	}
	to {
		opacity: 1;
		transform: scale(1);
	}
}

@keyframes ms-hero-zoom {
	from { transform: scale(1); }
	to { transform: scale(1.06); }
}

@keyframes ms-shimmer {
	0% { background-position: -200% 0; }
	100% { background-position: 200% 0; }
}

@keyframes ms-pulse-soft {
	0%, 100% { opacity: 1; }
	50% { opacity: 0.85; }
}

/* Scroll reveal — JS adds .is-visible */
.ms-reveal {
	opacity: 0;
	transform: translate3d(0, 28px, 0);
	transition:
		opacity var(--ms-duration-slow) var(--ms-ease),
		transform var(--ms-duration-slow) var(--ms-ease);
}

.ms-reveal.is-visible {
	opacity: 1;
	transform: translate3d(0, 0, 0);
}

.ms-reveal--delay-1 { transition-delay: 0.08s; }
.ms-reveal--delay-2 { transition-delay: 0.16s; }
.ms-reveal--delay-3 { transition-delay: 0.24s; }
.ms-reveal--delay-4 { transition-delay: 0.32s; }

/* Hero entrance — CSS only, runs once on load */
.ms-hero--banner .ms-hero__glass {
	animation: ms-scale-in 0.7s var(--ms-ease) both;
}

.ms-hero--banner .ms-hero__eyebrow {
	animation: ms-fade-up 0.6s var(--ms-ease) 0.15s both;
}

.ms-hero--banner .ms-hero__title {
	animation: ms-fade-up 0.6s var(--ms-ease) 0.25s both;
}

.ms-hero--banner .ms-hero__subtitle {
	animation: ms-fade-up 0.6s var(--ms-ease) 0.35s both;
}

.ms-hero--banner .ms-hero__actions {
	animation: ms-fade-up 0.6s var(--ms-ease) 0.45s both;
}

.ms-hero--banner .ms-hero__img {
	animation: ms-hero-zoom 18s var(--ms-ease-out) forwards;
}

/* Hover micro-interactions */
.ms-category-card__image img,
.ms-product-card__image img {
	transition: transform 0.4s var(--ms-ease);
}

.ms-category-card:hover .ms-category-card__image img,
.ms-product-card:hover .ms-product-card__image img,
.ms-showcase__card:hover .ms-showcase__card-img img {
	transform: scale(1.03);
}

.ms-showcase__card,
.ms-occasions__card,
.ms-cat-nav__item {
	transition:
		transform var(--ms-duration) var(--ms-ease),
		box-shadow var(--ms-duration) var(--ms-ease),
		border-color var(--ms-duration) var(--ms-ease);
}

.ms-cat-nav__thumb {
	transition:
		transform var(--ms-duration) var(--ms-ease),
		box-shadow var(--ms-duration) var(--ms-ease),
		border-color var(--ms-duration) var(--ms-ease);
}

.ms-showcase__card {
	animation: ms-fade-up 0.6s var(--ms-ease) both;
}

.ms-showcase__scroll .ms-showcase__card:nth-child(1) { animation-delay: 0.05s; }
.ms-showcase__scroll .ms-showcase__card:nth-child(2) { animation-delay: 0.12s; }
.ms-showcase__scroll .ms-showcase__card:nth-child(3) { animation-delay: 0.19s; }
.ms-showcase__scroll .ms-showcase__card:nth-child(4) { animation-delay: 0.26s; }

.ms-promo-card:hover .ms-promo-card__img {
	transform: scale(1.04);
}

.ms-occasions__card:hover {
	transform: translateY(-6px) scale(1.02);
}

.ms-btn--primary {
	transition:
		transform var(--ms-duration) var(--ms-ease),
		box-shadow var(--ms-duration) var(--ms-ease),
		background var(--ms-duration) var(--ms-ease);
}

.ms-btn--primary:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 24px var(--ms-primary-glow);
}

.ms-btn--primary:active {
	transform: translateY(0);
}

@keyframes ms-countdown-in {
	from {
		opacity: 0;
		transform: translateX(12px);
	}
	to {
		opacity: 1;
		transform: translateX(0);
	}
}

@keyframes ms-digit-tick {
	0% {
		transform: scale(1);
	}
	40% {
		transform: scale(1.12);
		color: var(--ms-primary-hover);
	}
	100% {
		transform: scale(1);
	}
}

/* Nav link underline slide */
.ms-header__cat-menu a {
	position: relative;
}

.ms-header__cat-menu a::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: -4px;
	width: 100%;
	height: 2px;
	background: var(--ms-gradient-primary);
	border-radius: var(--ms-radius-pill);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform var(--ms-duration) var(--ms-ease);
}

.ms-header__cat-menu a:hover::after,
.ms-header__cat-menu .current-menu-item a::after {
	transform: scaleX(1);
}

@media (prefers-reduced-motion: reduce) {
	.ms-header__countdown--animate,
	.ms-header__countdown-digit.is-tick,
	.ms-hero__dot.is-active,
	.ms-hero__slide {
		animation: none !important;
	}

	.ms-hero__slide {
		transition: none !important;
	}

	.ms-reveal,
	.ms-hero--banner .ms-hero__glass,
	.ms-hero--banner .ms-hero__eyebrow,
	.ms-hero--banner .ms-hero__title,
	.ms-hero--banner .ms-hero__subtitle,
	.ms-hero--banner .ms-hero__actions,
	.ms-hero--banner .ms-hero__img {
		animation: none !important;
		transition: none !important;
	}

	.ms-reveal {
		opacity: 1;
		transform: none;
	}

	.ms-category-card:hover .ms-category-card__image img,
	.ms-product-card:hover .ms-product-card__image img,
	.ms-cat-nav__item:hover .ms-cat-nav__thumb,
	.ms-btn--primary:hover {
		transform: none;
	}
}