/* ============================================================
   YATPAK — Animasyonlar
   Hover efektleri, keyframe'ler ve mikro etkileşimler.
   Scroll animasyonları AOS kütüphanesiyle sağlanır.
   ============================================================ */

/* Kullanıcı animasyon istemiyorsa hepsini kapat */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* ---------- Buton Ripple ---------- */
.btn-ripple { position: relative; overflow: hidden; }
.btn-ripple .ripple {
  position: absolute;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.45);
  transform: scale(0);
  animation: ripple .6s ease-out forwards;
  pointer-events: none;
}
@keyframes ripple {
  to { transform: scale(3.2); opacity: 0; }
}

/* ---------- Hover Glow ---------- */
.hover-glow { transition: box-shadow .3s ease; }
.hover-glow:hover { box-shadow: 0 0 24px rgba(22, 59, 114, 0.35); }

/* ---------- Sepet rozeti zıplama ---------- */
@keyframes badge-pop {
  0% { transform: scale(1); }
  40% { transform: scale(1.5); }
  100% { transform: scale(1); }
}
.cart-badge.pop { animation: badge-pop .45s ease; }

/* ---------- Wishlist kalp ---------- */
@keyframes heart-beat {
  0% { transform: scale(1); }
  30% { transform: scale(1.35); }
  60% { transform: scale(0.9); }
  100% { transform: scale(1); }
}
.icon-btn .bi-heart-fill { color: #e0245e; }
.icon-btn.hearted i { animation: heart-beat .5s ease; }

/* ---------- WhatsApp yüzen buton nabız ---------- */
@keyframes wa-pulse {
  0% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.5); }
  70% { box-shadow: 0 0 0 16px rgba(37, 211, 102, 0); }
  100% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0); }
}
.whatsapp-float { animation: wa-pulse 2.4s infinite; }

/* ---------- Hero içerik yumuşak giriş (AOS destekli, fallback) ---------- */
@keyframes fade-up {
  from { opacity: 0; transform: translateY(24px); }
  to { opacity: 1; transform: translateY(0); }
}
.anim-fade-up { animation: fade-up .8s ease both; }
.anim-delay-1 { animation-delay: .15s; }
.anim-delay-2 { animation-delay: .3s; }
.anim-delay-3 { animation-delay: .45s; }

/* ---------- Katman görseli hover ---------- */
.layers-figure img { transition: transform .45s ease; }
.layers-figure:hover img { transform: translateY(-6px) scale(1.02); }

/* ---------- Genel hover lift yardımcıları ---------- */
.hover-lift { transition: transform .3s ease, box-shadow .3s ease; }
.hover-lift:hover { transform: translateY(-6px); box-shadow: var(--yp-shadow-md); }