/* Garland Sway Animation */
@keyframes sway {
    0%, 100% { transform: rotate(-4deg) translateX(0px); }
    50% { transform: rotate(4deg) translateX(4px); }
}
.garland-left {
    transform-origin: top center;
    animation: sway 3s ease-in-out infinite;
}
.garland-right {
    transform-origin: top center;
    animation: sway 3s ease-in-out infinite;
    animation-delay: -1.5s;
}

/* 5. HYPER-ANIMATED TRIGGER BUTTON - Custom Tailwind Keyframe */
@keyframes pulseGlow {
    0%, 100% {
        box-shadow: 0 0 20px rgba(255, 179, 0, 0.4);
        transform: scale(1);
    }
    50% {
        box-shadow: 0 0 40px rgba(255, 179, 0, 0.9), 0 0 15px rgba(255,255,255,0.6);
        transform: scale(1.03);
    }
}
.animate-pulse-glow {
    animation: pulseGlow 2s infinite ease-in-out;
}

/* 6. FLORAL BACKDROP GENERATOR - TRIGGERED */
@keyframes fallDown {
    0% {
        transform: translateY(-20vh) rotate(0deg);
        opacity: 0;
    }
    10% {
        opacity: 1;
    }
    90% {
        opacity: 1;
    }
    100% {
        transform: translateY(120vh) rotate(720deg);
        opacity: 0;
    }
}
.floral-petal {
    position: absolute;
    width: 25px;
    height: 25px;
    border-radius: 50% 0 50% 50%;
    opacity: 0; /* Hidden initially */
}
.falling .floral-petal {
    animation: fallDown linear forwards;
}

/* Ribbon Cut Animation Bindings */
.cut-left {
    transform: translateX(-105%) rotate(-5deg) !important;
}
.cut-right {
    transform: translateX(105%) rotate(5deg) !important;
}

/* CRAZY DRONE TAKEOFF ANIMATION */
@keyframes takeOff {
    0% {
        transform: scale(1) translateY(0) rotate(0deg);
        opacity: 1;
    }
    15% {
        transform: scale(0.95) translateY(20px) rotate(-1deg); /* Rev engine / crouch */
        opacity: 1;
    }
    100% {
        transform: scale(4) translateY(-200vh) rotate(10deg); /* Rocket into the sky */
        opacity: 0;
        filter: blur(20px);
    }
}
.animate-takeoff {
    animation: takeOff 2s cubic-bezier(0.5, 0, 0.2, 1) forwards !important;
}