/* ============================================================
   animations.css — CSS Keyframe animations (no GSAP)
   pulse, float, shimmer, flicker, rotate-slow
   Ilios Vounó SPA
   ============================================================ */

/* ── Float — levitación suave (iconos, botella) ── */
@keyframes float {
  0%, 100% { transform: translateY(0px); }
  50%       { transform: translateY(-12px); }
}

.animate-float {
  animation: float 6s ease-in-out infinite;
}

/* ── Pulse glow — aura de alebrijes ── */
@keyframes pulse-glow {
  0%, 100% { opacity: 0.4; transform: scale(1); }
  50%       { opacity: 0.8; transform: scale(1.08); }
}

.animate-pulse-glow {
  animation: pulse-glow 3s ease-in-out infinite;
}

/* ── Shimmer — efecto metálico en textos gold ── */
@keyframes shimmer {
  0% {
    background-position: -200% center;
  }
  100% {
    background-position: 200% center;
  }
}

.animate-shimmer {
  background: linear-gradient(
    90deg,
    var(--color-gold-500) 0%,
    var(--color-gold-200) 40%,
    var(--color-gold-500) 60%,
    var(--color-gold-300) 100%
  );
  background-size: 200% auto;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  animation: shimmer 4s linear infinite;
}

/* ── Flicker — efecto vela/brasas ── */
@keyframes flicker {
  0%, 100% { opacity: 1; }
  15%       { opacity: 0.7; }
  30%       { opacity: 0.95; }
  45%       { opacity: 0.65; }
  60%       { opacity: 1; }
  75%       { opacity: 0.8; }
  90%       { opacity: 0.95; }
}

.animate-flicker {
  animation: flicker 3s ease-in-out infinite;
}

/* ── Rotate slow — ícono SVG central ── */
@keyframes rotate-slow {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}

.animate-rotate-slow {
  animation: rotate-slow 30s linear infinite;
}

/* ── Fade in ── */
@keyframes fade-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* ── Slide up ── */
@keyframes slide-up {
  from {
    opacity: 0;
    transform: translateY(40px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ── Scale in ── */
@keyframes scale-in {
  from {
    opacity: 0;
    transform: scale(0.85);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

/* ── Орнамент draw — traceo SVG ── */
@keyframes draw-line {
  from { stroke-dashoffset: 1000; }
  to   { stroke-dashoffset: 0; }
}

/* ── Aura orbit ── */
@keyframes aura-orbit {
  0%   { transform: rotate(0deg) translateX(4px) rotate(0deg); opacity: 0.3; }
  50%  { opacity: 0.7; }
  100% { transform: rotate(360deg) translateX(4px) rotate(-360deg); opacity: 0.3; }
}

/* ── Bounce subtle ── */
@keyframes bounce-subtle {
  0%, 100% { transform: translateY(0); }
  50%       { transform: translateY(-6px); }
}

.animate-bounce {
  animation: bounce-subtle 2s ease-in-out infinite;
}

/* Utility: animation-delay helpers */
.delay-100 { animation-delay: 100ms; }
.delay-200 { animation-delay: 200ms; }
.delay-300 { animation-delay: 300ms; }
.delay-500 { animation-delay: 500ms; }
.delay-700 { animation-delay: 700ms; }
.delay-1000 { animation-delay: 1000ms; }

/* Pause all animations when reduced motion is preferred */
@media (prefers-reduced-motion: reduce) {
  .animate-float,
  .animate-pulse-glow,
  .animate-shimmer,
  .animate-flicker,
  .animate-rotate-slow,
  .animate-bounce {
    animation: none;
  }
}