/* ═══════════════════════════════════════════════
   A1 Prime — Animations
   ═══════════════════════════════════════════════ */

/* ── Scroll reveal ── */
.reveal {
  opacity: 0; transform: translateY(24px);
  transition: opacity .55s var(--ease), transform .55s var(--ease);
}
.reveal.visible { opacity: 1; transform: translateY(0); }
.reveal.from-left  { transform: translateX(-24px); }
.reveal.from-left.visible { transform: translateX(0); }
.reveal.from-right { transform: translateX(24px); }
.reveal.from-right.visible { transform: translateX(0); }
.delay-1 { transition-delay: .08s; }
.delay-2 { transition-delay: .16s; }
.delay-3 { transition-delay: .24s; }
.delay-4 { transition-delay: .32s; }
.delay-5 { transition-delay: .40s; }
.delay-6 { transition-delay: .48s; }

/* ── Add to cart ── */
@keyframes atcPop {
  0%   { transform: scale(1); }
  35%  { transform: scale(1.4) rotate(-10deg); }
  65%  { transform: scale(.88) rotate(5deg); }
  100% { transform: scale(1); }
}
.atc-pop { animation: atcPop .4s var(--ease-snap); }

/* ── Cart badge bounce ── */
@keyframes badgePop {
  0%,100% { transform: scale(1); }
  50%      { transform: scale(1.5); }
}
.badge-pop { animation: badgePop .35s var(--ease-snap); }

/* ── Page enter ── */
@keyframes pageEnter {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: translateY(0); }
}
.page-wrapper { animation: pageEnter .4s var(--ease) both; }

/* ── Hero text ── */
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(20px); }
  to   { opacity: 1; transform: translateY(0); }
}
.hero-tag     { animation: fadeUp .6s var(--ease) .1s both; }
.hero-content h1 { animation: fadeUp .7s var(--ease) .2s both; }
.hero-content p  { animation: fadeUp .7s var(--ease) .35s both; }
.hero-actions    { animation: fadeUp .7s var(--ease) .5s both; }

/* ── Shimmer on card hover ── */
.product-card::before {
  content: ''; position: absolute; inset: 0; z-index: 2;
  background: linear-gradient(120deg, transparent 30%, rgba(255,255,255,.3) 50%, transparent 70%);
  background-size: 200%; opacity: 0; pointer-events: none;
  border-radius: var(--r-md);
  transition: opacity .3s;
}
.product-card:hover::before { opacity: 1; }

/* ── Spin ── */
@keyframes spin { to { transform: rotate(360deg); } }
.spin { animation: spin .8s linear infinite; }

/* ── Pulse ── */
@keyframes pulseScale { 0%,100% { transform: scale(1); opacity:1; } 50% { transform: scale(1.15); opacity:.7; } }
.pulse { animation: pulseScale 2s ease-in-out infinite; }

/* ── Ripple effect ── */
@keyframes rippleOut { to { transform: scale(4); opacity: 0; } }

/* ── Header shrink ── */
#site-header { will-change: height, background; }

/* ── Skeleton pulse ── */
@keyframes skelPulse { 0%,100% { opacity:1; } 50% { opacity:.5; } }
.skeleton { animation: skelPulse 1.8s ease-in-out infinite; }

/* ── Filter transition ── */
.product-grid {
  transition: opacity .25s;
}
.product-grid.loading { opacity: .45; pointer-events: none; }

/* ── Variant btn select ── */
.variant-btn { transition: background .15s, color .15s, border-color .15s, transform .15s; }
.variant-btn:active { transform: scale(.94); }

/* ── Low stock blink ── */
@keyframes lowStockBlink { 0%,100% { opacity:1; } 50% { opacity:.5; } }
.stock-low { animation: lowStockBlink 2s ease-in-out infinite; }

/* ── Smooth image swap in gallery ── */
.product-main-img img { transition: opacity .25s; }
.product-main-img img.swapping { opacity: 0; }

/* ── Ticker hover pause visual ── */
.ticker-wrap:hover .ticker-inner::after {
  content: 'PAUSED';
}
