/* ============================================================
   ANIMATIONS — Scroll animations, hover effects, transitions
   ============================================================ */

/* ===== Scroll Animations ===== */
.animate-on-scroll {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.animate-on-scroll--visible,
.animate-on-scroll.animated {
  opacity: 1;
  transform: translateY(0);
}

.animate-left { transform: translateX(-30px); }
.animate-left.animated { transform: translateX(0); }
.animate-right { transform: translateX(30px); }
.animate-right.animated { transform: translateX(0); }
.animate-scale { transform: scale(0.92); }
.animate-scale.animated { transform: scale(1); }

/* Stagger delays */
.delay-1 { transition-delay: 0.1s; }
.delay-2 { transition-delay: 0.15s; }
.delay-3 { transition-delay: 0.2s; }
.delay-4 { transition-delay: 0.25s; }
.delay-5 { transition-delay: 0.3s; }
.delay-6 { transition-delay: 0.35s; }

/* ===== Hover Effects ===== */
.hover-lift { transition: transform var(--duration), box-shadow var(--duration); }
.hover-lift:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); }

.hover-glow { transition: box-shadow var(--duration); }
.hover-glow:hover { box-shadow: 0 0 20px rgba(182, 109, 122, 0.18); }

.hover-scale { transition: transform var(--duration); }
.hover-scale:hover { transform: scale(1.03); }

/* ===== Pulse / Glow ===== */
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: .6; } }
.pulse { animation: pulse 2s infinite; }

@keyframes float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
.float { animation: float 3s ease-in-out infinite; }

/* ===== Counter animation helper ===== */
@keyframes countUp { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
.count-up { animation: countUp 0.5s ease forwards; }

/* ===== Heart & Feminine Animations ===== */
@keyframes heart-float {
  0%, 100% { transform: translateY(0) rotate(0deg); opacity: 0.06; }
  50% { transform: translateY(-8px) rotate(5deg); opacity: 0.1; }
}

@keyframes petal-drift {
  0% { transform: translateX(0) translateY(0) rotate(0deg); opacity: 0; }
  10% { opacity: 0.06; }
  90% { opacity: 0.06; }
  100% { transform: translateX(30px) translateY(-20px) rotate(45deg); opacity: 0; }
}

.heart-float { animation: heart-float 4s ease-in-out infinite; }
.petal-drift { animation: petal-drift 6s ease-in-out infinite; }

/* ===== Smooth scrollbar (webkit) ===== */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: var(--color-bg-alt); }
::-webkit-scrollbar-thumb { background: var(--color-border); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--color-primary-muted); }
