/* Souq Aarsal v4 — Motion system */

@keyframes sa-gradient-shift {
	0%, 100% { background-position: 0% 50%; }
	50% { background-position: 100% 50%; }
}

@keyframes sa-aurora {
	0%, 100% { transform: translate(0, 0) rotate(0deg) scale(1); opacity: 0.45; }
	33% { transform: translate(4%, -3%) rotate(8deg) scale(1.08); opacity: 0.55; }
	66% { transform: translate(-3%, 2%) rotate(-6deg) scale(0.95); opacity: 0.4; }
}

@keyframes sa-blob-float {
	0%, 100% { transform: translate(0, 0) scale(1); }
	33% { transform: translate(30px, -20px) scale(1.05); }
	66% { transform: translate(-20px, 15px) scale(0.95); }
}

@keyframes sa-float-item {
	0%, 100% { transform: translateY(0) rotate(0deg); }
	50% { transform: translateY(-14px) rotate(6deg); }
}

@keyframes sa-shimmer {
	0% { transform: translateX(-120%); }
	100% { transform: translateX(120%); }
}

@keyframes sa-pulse-glow {
	0%, 100% { box-shadow: 0 0 20px rgba(16, 185, 129, 0.35); }
	50% { box-shadow: 0 0 44px rgba(16, 185, 129, 0.65); }
}

@keyframes sa-marquee-ltr {
	0% { transform: translateX(0); }
	100% { transform: translateX(-50%); }
}

@keyframes sa-marquee-rtl {
	0% { transform: translateX(0); }
	100% { transform: translateX(50%); }
}

@keyframes sa-slide-in-rtl {
	from { opacity: 0; transform: translateX(-48px); }
	to { opacity: 1; transform: translateX(0); }
}

@keyframes sa-slide-in-ltr {
	from { opacity: 0; transform: translateX(48px); }
	to { opacity: 1; transform: translateX(0); }
}

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

@keyframes sa-ring-pulse {
	0%, 100% { transform: scale(1); opacity: 0.6; }
	50% { transform: scale(1.04); opacity: 1; }
}

@keyframes sa-countdown-tick {
	0%, 100% { transform: scale(1); }
	50% { transform: scale(1.06); }
}

/* Page entrance */
body.sa-loaded .sa-header,
body.sa-loaded .site-main > * {
	animation: sa-scale-in 0.7s cubic-bezier(0.22, 1, 0.36, 1) both;
}
body.sa-loaded .site-main > *:nth-child(2) { animation-delay: 0.05s; }
body.sa-loaded .site-main > *:nth-child(3) { animation-delay: 0.1s; }

/* Scroll reveal */
.sa-reveal {
	opacity: 0;
	transform: translateY(36px);
	transition: opacity 0.8s cubic-bezier(0.22, 1, 0.36, 1),
	            transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}
.sa-reveal.is-visible {
	opacity: 1;
	transform: translateY(0);
}
.sa-reveal--delay-1 { transition-delay: 0.12s; }
.sa-reveal--delay-2 { transition-delay: 0.24s; }
.sa-reveal--delay-3 { transition-delay: 0.36s; }

.sa-stagger {
	opacity: 0;
	transform: translateY(20px);
	transition: opacity 0.55s ease, transform 0.55s ease;
	transition-delay: calc(var(--i, 0) * 0.08s);
}
.sa-reveal.is-visible .sa-stagger,
.is-visible > .sa-stagger {
	opacity: 1;
	transform: translateY(0);
}

/* Hero */
.sa-hero__blob { animation: sa-blob-float 8s ease-in-out infinite; }
.sa-hero__blob--2 { animation-delay: -3s; animation-duration: 10s; }
.sa-hero__blob--3 { animation-delay: -5s; animation-duration: 12s; }

.sa-float { animation: sa-float-item 4s ease-in-out infinite; }
.sa-float--2 { animation-delay: -1.3s; }
.sa-float--3 { animation-delay: -2.6s; }

.sa-btn--glow { animation: sa-pulse-glow 2.5s ease-in-out infinite; }

/* Hero slide transitions */
.sa-hero-slide {
	transition: opacity 0.55s ease, transform 0.65s cubic-bezier(0.22, 1, 0.36, 1), visibility 0.55s;
}
html[dir="rtl"] .sa-hero-slide {
	transform: translateX(40px);
}
html[dir="ltr"] .sa-hero-slide {
	transform: translateX(-40px);
}
.sa-hero-slide.is-active {
	transform: translateX(0) !important;
}
.sa-hero-slide.is-exit {
	opacity: 0 !important;
}

html[dir="rtl"] .sa-hero-slide.is-active .sa-hero__title {
	animation: sa-slide-in-rtl 0.7s cubic-bezier(0.22, 1, 0.36, 1) 0.1s both;
}
html[dir="ltr"] .sa-hero-slide.is-active .sa-hero__title {
	animation: sa-slide-in-ltr 0.7s cubic-bezier(0.22, 1, 0.36, 1) 0.1s both;
}

/* Marquee */
.sa-marquee-wrap {
	flex: 1;
	overflow: hidden;
	mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.sa-marquee {
	display: flex;
	gap: 3rem;
	width: max-content;
	white-space: nowrap;
}
html[dir="rtl"] .sa-marquee { animation: sa-marquee-rtl 28s linear infinite; }
html[dir="ltr"] .sa-marquee { animation: sa-marquee-ltr 28s linear infinite; }

/* Aurora site background */
.sa-aurora {
	position: fixed;
	inset: 0;
	pointer-events: none;
	z-index: -1;
	overflow: hidden;
}
.sa-aurora__orb {
	position: absolute;
	border-radius: 50%;
	filter: blur(80px);
	animation: sa-aurora 18s ease-in-out infinite;
}
.sa-aurora__orb--1 {
	width: 55vw; height: 55vw;
	background: rgba(16, 185, 129, 0.14);
	top: -15%; inset-inline-end: -10%;
}
.sa-aurora__orb--2 {
	width: 45vw; height: 45vw;
	background: rgba(99, 102, 241, 0.1);
	bottom: -10%; inset-inline-start: -8%;
	animation-delay: -6s;
}
.sa-aurora__orb--3 {
	width: 35vw; height: 35vw;
	background: rgba(251, 191, 36, 0.08);
	top: 40%; inset-inline-start: 35%;
	animation-delay: -12s;
}

/* Product card */
.souq-product-card__inner {
	transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1),
	            box-shadow 0.4s ease;
	transform-style: preserve-3d;
}
.souq-product-card:hover .souq-product-card__inner {
	transform: translateY(-10px);
	box-shadow: 0 28px 56px -16px rgba(15, 23, 42, 0.2);
}
.souq-product-card__media::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(105deg, transparent 40%, rgba(255,255,255,0.5) 50%, transparent 60%);
	transform: translateX(-120%);
	transition: none;
}
.souq-product-card:hover .souq-product-card__media::after {
	animation: sa-shimmer 0.75s ease;
}

.souq-badge--pct {
	background: linear-gradient(90deg, #3b82f6, #6366f1, #3b82f6);
	background-size: 200% auto;
	animation: sa-gradient-shift 3s linear infinite;
}

/* Category card tilt glow */
.souq-category-card {
	transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.35s;
}
.souq-category-card.is-tilt-active {
	transition: transform 0.1s ease;
}

/* Flash countdown */
.sa-flash__digit {
	animation: sa-countdown-tick 1s ease infinite;
}
.sa-flash__digit.is-ticking {
	animation: sa-countdown-tick 0.35s ease;
}

/* Header — visual only on scroll; layout stays fixed */
.sa-header.is-scrolled {
	background: rgba(255, 255, 255, 0.82);
	backdrop-filter: blur(20px) saturate(1.4);
	-webkit-backdrop-filter: blur(20px) saturate(1.4);
}

/* Stats counter */
.sa-stats__num.is-counting {
	display: inline-block;
}

/* ── 2026: refined reveal system ── */
.sa-reveal {
	transform: translateY(40px) scale(0.985);
	filter: blur(6px);
	transition:
		opacity 0.9s var(--sa-ease-out, cubic-bezier(0.16, 1, 0.3, 1)),
		transform 0.9s var(--sa-ease-out, cubic-bezier(0.16, 1, 0.3, 1)),
		filter 0.9s ease;
}
.sa-reveal.is-visible {
	transform: translateY(0) scale(1);
	filter: blur(0);
}

/* Choreographed stagger for grid children */
.is-visible > .sa-stagger {
	animation: sa-rise-in 0.7s var(--sa-ease-out, cubic-bezier(0.16, 1, 0.3, 1)) both;
	animation-delay: calc(var(--i, 0) * 0.08s + 0.05s);
	opacity: 1;
	transform: none;
}
@keyframes sa-rise-in {
	from { opacity: 0; transform: translateY(26px) scale(0.96); }
	to { opacity: 1; transform: translateY(0) scale(1); }
}

/* Section title underline grows on reveal */
.sa-reveal .souq-section__title::after {
	transform: scaleX(0);
	transform-origin: inset-inline-start center;
	transition: transform 0.7s var(--sa-ease-out, cubic-bezier(0.16, 1, 0.3, 1)) 0.2s;
}
html[dir="rtl"] .sa-reveal .souq-section__title::after { transform-origin: right center; }
html[dir="ltr"] .sa-reveal .souq-section__title::after { transform-origin: left center; }
.sa-reveal.is-visible .souq-section__title::after { transform: scaleX(1); }

/* Gentle float for badge/feature icons */
@keyframes sa-soft-float {
	0%, 100% { transform: translateY(0); }
	50% { transform: translateY(-5px); }
}
.souq-trust__icon,
.souq-delivery-cta__icon,
.souq-why__card span {
	animation: sa-soft-float 5s ease-in-out infinite;
}
.souq-delivery-cta__item:nth-child(2) .souq-delivery-cta__icon { animation-delay: -1.6s; }
.souq-delivery-cta__item:nth-child(3) .souq-delivery-cta__icon { animation-delay: -3.2s; }

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}
	.sa-reveal, .sa-stagger { opacity: 1; transform: none; filter: none; }
	.sa-aurora__orb, .sa-marquee { animation: none; }
	.souq-trust__icon, .souq-delivery-cta__icon, .souq-why__card span { animation: none; }
}