/* ============================================================
   animations.css — Keyframes and named animation classes
   ============================================================ */

/* --- Keyframes --------------------------------------------- */
@keyframes spin {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}

@keyframes wave-motion {
    0%   { transform: translateY(0)     scaleY(1);    }
    50%  { transform: translateY(-18px) scaleY(1.08); }
    100% { transform: translateY(0)     scaleY(1);    }
}

@keyframes wave-drift {
    from { transform: translateX(0);     }
    to   { transform: translateX(-50%);  }
}

@keyframes anim-pulse {
    0%, 100% { opacity: 1;   }
    50%       { opacity: 0.4; }
}

@keyframes anim-bounce {
    0%, 100% {
        transform: translateY(-20%);
        animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
    }
    50% {
        transform: translateY(0);
        animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
    }
}

@keyframes anim-ping {
    75%, 100% { transform: scale(2); opacity: 0; }
}

/* --- Animation classes ------------------------------------- */
.animate-wave      { animation: wave-motion  8s ease-in-out infinite; }
.animate-wave-slow { animation: wave-motion 12s ease-in-out infinite; }
.animate-pulse     { animation: anim-pulse   2s cubic-bezier(0.4, 0, 0.6, 1) infinite; }
.animate-bounce    { animation: anim-bounce  1s infinite; }
.animate-ping      { animation: anim-ping    1s cubic-bezier(0, 0, 0.2, 1)   infinite; }

/* Respect users who ask for reduced motion */
@media (prefers-reduced-motion: reduce) {
    .hero__wave, .hero__particle {
        animation: none;
    }
}