/* ==========================================================================
   SWAAD MAHAL - SCROLL "SWIM" & FLOATING ANIMATIONS
   ========================================================================== */

/* 1. Gentle Swimming / Floating Keyframes (Natural Wave Movement) */
@keyframes swimFloat {
    0%, 100% {
        transform: translateY(0px) rotate(0deg);
    }
    33% {
        transform: translateY(-8px) rotate(1deg);
    }
    66% {
        transform: translateY(6px) rotate(-0.8deg);
    }
}

@keyframes swimFloatReverse {
    0%, 100% {
        transform: translateY(0px) rotate(0deg);
    }
    33% {
        transform: translateY(8px) rotate(-1deg);
    }
    66% {
        transform: translateY(-6px) rotate(0.8deg);
    }
}

@keyframes swimFloatSlow {
    0%, 100% {
        transform: translateY(0px) translateX(0px);
    }
    50% {
        transform: translateY(-12px) translateX(4px);
    }
}

/* 2. Scroll Swim In Entrances */
@keyframes swimInUp {
    0% {
        opacity: 0;
        transform: translateY(45px) rotate(1.5deg) scale(0.96);
    }
    70% {
        transform: translateY(-6px) rotate(-0.5deg) scale(1.01);
    }
    100% {
        opacity: 1;
        transform: translateY(0) rotate(0deg) scale(1);
    }
}

@keyframes swimInLeft {
    0% {
        opacity: 0;
        transform: translateX(-50px) rotate(-2deg);
    }
    70% {
        transform: translateX(6px) rotate(0.5deg);
    }
    100% {
        opacity: 1;
        transform: translateX(0) rotate(0deg);
    }
}

@keyframes swimInRight {
    0% {
        opacity: 0;
        transform: translateX(50px) rotate(2deg);
    }
    70% {
        transform: translateX(-6px) rotate(-0.5deg);
    }
    100% {
        opacity: 1;
        transform: translateX(0) rotate(0deg);
    }
}

/* 3. Glowing Pulses */
@keyframes pulseRed {
    0% {
        box-shadow: 0 0 0 0 rgba(194, 24, 7, 0.45);
    }
    70% {
        box-shadow: 0 0 0 14px rgba(194, 24, 7, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(194, 24, 7, 0);
    }
}

/* 4. Applied Animation Classes */
.animate-swim {
    animation: swimFloat 6s ease-in-out infinite;
}

.animate-swim-reverse {
    animation: swimFloatReverse 7s ease-in-out infinite;
}

.animate-swim-slow {
    animation: swimFloatSlow 8s ease-in-out infinite;
}

.animate-pulse-red {
    animation: pulseRed 2.5s infinite;
}

/* 5. Scroll Swim Reveal Utilities */
.swim-reveal {
    opacity: 0;
    transform: translateY(40px) scale(0.97);
    transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
    will-change: opacity, transform;
}

.swim-reveal.swum {
    opacity: 1;
    transform: translateY(0) scale(1);
}

.swim-reveal-left {
    opacity: 0;
    transform: translateX(-40px) rotate(-1deg);
    transition: opacity 0.85s cubic-bezier(0.16, 1, 0.3, 1), transform 0.85s cubic-bezier(0.16, 1, 0.3, 1);
}

.swim-reveal-left.swum {
    opacity: 1;
    transform: translateX(0) rotate(0deg);
}

.swim-reveal-right {
    opacity: 0;
    transform: translateX(40px) rotate(1deg);
    transition: opacity 0.85s cubic-bezier(0.16, 1, 0.3, 1), transform 0.85s cubic-bezier(0.16, 1, 0.3, 1);
}

.swim-reveal-right.swum {
    opacity: 1;
    transform: translateX(0) rotate(0deg);
}

/* Stagger Delays for Swimming Wave Effect */
.delay-1 { transition-delay: 0.1s; }
.delay-2 { transition-delay: 0.2s; }
.delay-3 { transition-delay: 0.3s; }
.delay-4 { transition-delay: 0.4s; }

/* 6. Card Hover Swimming Effect */
.hover-swim {
    transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

.hover-swim:hover {
    transform: translateY(-8px) rotate(0.4deg);
    box-shadow: 0 16px 32px rgba(41, 37, 36, 0.12);
}