/* ========================================  
   ANIMATIONS  
   ======================================== */  
  
/* Float Animation */  
@keyframes float {  
    0%, 100% {  
        transform: translateY(0px);  
    }  
    50% {  
        transform: translateY(-15px);  
    }  
}  
  
/* Pulse Animation */  
@keyframes pulse {  
    0%, 100% {  
        box-shadow: 0 0 0 0 rgba(245, 158, 11, 0.3);  
    }  
    50% {  
        box-shadow: 0 0 0 20px rgba(245, 158, 11, 0);  
    }  
}  
  
.pulse {  
    animation: pulse 3s ease-in-out infinite;  
}  
  
/* Fade In Up */  
@keyframes fadeInUp {  
    from {  
        opacity: 0;  
        transform: translateY(40px);  
    }  
    to {  
        opacity: 1;  
        transform: translateY(0);  
    }  
}  
  
/* Fade In Left */  
@keyframes fadeInLeft {  
    from {  
        opacity: 0;  
        transform: translateX(40px);  
    }  
    to {  
        opacity: 1;  
        transform: translateX(0);  
    }  
}  
  
/* Fade In Right */  
@keyframes fadeInRight {  
    from {  
        opacity: 0;  
        transform: translateX(-40px);  
    }  
    to {  
        opacity: 1;  
        transform: translateX(0);  
    }  
}  
  
/* Scale In */  
@keyframes scaleIn {  
    from {  
        opacity: 0;  
        transform: scale(0.9);  
    }  
    to {  
        opacity: 1;  
        transform: scale(1);  
    }  
}  
  
/* Slide In From Bottom */  
@keyframes slideInBottom {  
    from {  
        opacity: 0;  
        transform: translateY(60px);  
    }  
    to {  
        opacity: 1;  
        transform: translateY(0);  
    }  
}  
  
/* Rotate In */  
@keyframes rotateIn {  
    from {  
        opacity: 0;  
        transform: rotate(-10deg) scale(0.9);  
    }  
    to {  
        opacity: 1;  
        transform: rotate(0) scale(1);  
    }  
}  
  
/* Particle Animation */  
@keyframes particleFloat {  
    0% {  
        transform: translateY(100vh) rotate(0deg);  
        opacity: 0;  
    }  
    10% {  
        opacity: 0.6;  
    }  
    90% {  
        opacity: 0.6;  
    }  
    100% {  
        transform: translateY(-100px) rotate(720deg);  
        opacity: 0;  
    }  
}  
  
.particle {  
    position: absolute;  
    width: 4px;  
    height: 4px;  
    background: rgba(245, 158, 11, 0.3);  
    border-radius: 50%;  
    animation: particleFloat linear infinite;  
    pointer-events: none;  
}  
  
/* Animation States */  
[data-animate] {  
    opacity: 0;  
    transform: translateY(40px);  
    transition: opacity 0.7s cubic-bezier(0.4, 0, 0.2, 1),  
                transform 0.7s cubic-bezier(0.4, 0, 0.2, 1);  
}  
  
[data-animate="fade-up"].animated {  
    opacity: 1;  
    transform: translateY(0);  
}  
  
[data-animate="fade-left"] {  
    transform: translateX(40px);  
}  
  
[data-animate="fade-left"].animated {  
    opacity: 1;  
    transform: translateX(0);  
}  
  
[data-animate="fade-right"] {  
    transform: translateX(-40px);  
}  
  
[data-animate="fade-right"].animated {  
    opacity: 1;  
    transform: translateX(0);  
}  
  
[data-animate="scale"].animated {  
    opacity: 1;  
    transform: scale(1);  
}  
  
[data-animate="stagger"] {  
    opacity: 1;  
    transform: none;  
}  
  
[data-animate="stagger"] > * {  
    opacity: 0;  
    transform: translateY(30px);  
    transition: opacity 0.5s cubic-bezier(0.4, 0, 0.2, 1),  
                transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);  
}  
  
[data-animate="stagger"].animated > * {  
    opacity: 1;  
    transform: translateY(0);  
}  
  
/* Shimmer effect for loading */  
@keyframes shimmer {  
    0% {  
        background-position: -200% 0;  
    }  
    100% {  
        background-position: 200% 0;  
    }  
}  
  
.shimmer {  
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);  
    background-size: 200% 100%;  
    animation: shimmer 1.5s infinite;  
}  
  
/* Hover glow effect */  
@keyframes slideTestimonials {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(calc(-25% - 22px));
    }
}