/*====== Falling Hearts Animation CSS =====*/
.falling-heart {
    position: fixed !important;
    top: -5vh !important;
    z-index: 9999 !important;
    pointer-events: none !important;
    font-size: 28px !important;
    opacity: 0 !important;
    animation: heartfall 10s linear infinite !important;
}

.falling-heart::before {
    content: "❤️" !important;
}

@keyframes heartfall {
    0% {
        opacity: 0;
        transform: translateY(0) rotate(0deg) scale(0.5);
    }
    10% {
        opacity: 0.7;
    }
    90% {
        opacity: 0.7;
    }
    100% {
        opacity: 0;
        transform: translateY(110vh) rotate(360deg) scale(1.2);
    }
}

/* Individual heart positioning with staggered delays and sizes */
.falling-heart:nth-child(1) { left: 5% !important; animation-delay: 0s !important; font-size: 24px !important; animation-duration: 10s !important; }
.falling-heart:nth-child(2) { left: 10% !important; animation-delay: 0.5s !important; font-size: 18px !important; animation-duration: 12s !important; }
.falling-heart:nth-child(3) { left: 15% !important; animation-delay: 1s !important; font-size: 28px !important; animation-duration: 9s !important; }
.falling-heart:nth-child(4) { left: 20% !important; animation-delay: 1.5s !important; font-size: 22px !important; animation-duration: 11s !important; }
.falling-heart:nth-child(5) { left: 25% !important; animation-delay: 2s !important; font-size: 26px !important; animation-duration: 10s !important; }
.falling-heart:nth-child(6) { left: 30% !important; animation-delay: 2.5s !important; font-size: 20px !important; animation-duration: 13s !important; }
.falling-heart:nth-child(7) { left: 35% !important; animation-delay: 3s !important; font-size: 32px !important; animation-duration: 8s !important; }
.falling-heart:nth-child(8) { left: 40% !important; animation-delay: 3.5s !important; font-size: 24px !important; animation-duration: 11s !important; }
.falling-heart:nth-child(9) { left: 45% !important; animation-delay: 4s !important; font-size: 18px !important; animation-duration: 12s !important; }
.falling-heart:nth-child(10) { left: 50% !important; animation-delay: 4.5s !important; font-size: 28px !important; animation-duration: 9s !important; }
.falling-heart:nth-child(11) { left: 8% !important; animation-delay: 0.2s !important; font-size: 22px !important; animation-duration: 10s !important; }
.falling-heart:nth-child(12) { left: 12% !important; animation-delay: 0.7s !important; font-size: 26px !important; animation-duration: 11s !important; }
.falling-heart:nth-child(13) { left: 18% !important; animation-delay: 1.2s !important; font-size: 20px !important; animation-duration: 13s !important; }
.falling-heart:nth-child(14) { left: 23% !important; animation-delay: 1.7s !important; font-size: 32px !important; animation-duration: 8s !important; }
.falling-heart:nth-child(15) { left: 28% !important; animation-delay: 2.2s !important; font-size: 24px !important; animation-duration: 12s !important; }
.falling-heart:nth-child(16) { left: 33% !important; animation-delay: 2.7s !important; font-size: 18px !important; animation-duration: 10s !important; }
.falling-heart:nth-child(17) { left: 38% !important; animation-delay: 3.2s !important; font-size: 28px !important; animation-duration: 9s !important; }
.falling-heart:nth-child(18) { left: 43% !important; animation-delay: 3.7s !important; font-size: 22px !important; animation-duration: 11s !important; }
.falling-heart:nth-child(19) { left: 48% !important; animation-delay: 4.2s !important; font-size: 26px !important; animation-duration: 13s !important; }
.falling-heart:nth-child(20) { left: 53% !important; animation-delay: 0.3s !important; font-size: 20px !important; animation-duration: 8s !important; }
.falling-heart:nth-child(21) { left: 58% !important; animation-delay: 0.8s !important; font-size: 32px !important; animation-duration: 10s !important; }
.falling-heart:nth-child(22) { left: 63% !important; animation-delay: 1.3s !important; font-size: 24px !important; animation-duration: 12s !important; }
.falling-heart:nth-child(23) { left: 68% !important; animation-delay: 1.8s !important; font-size: 18px !important; animation-duration: 9s !important; }
.falling-heart:nth-child(24) { left: 73% !important; animation-delay: 2.3s !important; font-size: 28px !important; animation-duration: 11s !important; }
.falling-heart:nth-child(25) { left: 78% !important; animation-delay: 2.8s !important; font-size: 22px !important; animation-duration: 13s !important; }
.falling-heart:nth-child(26) { left: 83% !important; animation-delay: 3.3s !important; font-size: 26px !important; animation-duration: 8s !important; }
.falling-heart:nth-child(27) { left: 88% !important; animation-delay: 3.8s !important; font-size: 20px !important; animation-duration: 10s !important; }
.falling-heart:nth-child(28) { left: 93% !important; animation-delay: 4.3s !important; font-size: 32px !important; animation-duration: 12s !important; }
.falling-heart:nth-child(29) { left: 55% !important; animation-delay: 0.4s !important; font-size: 24px !important; animation-duration: 9s !important; }
.falling-heart:nth-child(30) { left: 60% !important; animation-delay: 0.9s !important; font-size: 18px !important; animation-duration: 11s !important; }
.falling-heart:nth-child(31) { left: 65% !important; animation-delay: 1.4s !important; font-size: 28px !important; animation-duration: 13s !important; }
.falling-heart:nth-child(32) { left: 70% !important; animation-delay: 1.9s !important; font-size: 22px !important; animation-duration: 8s !important; }
.falling-heart:nth-child(33) { left: 75% !important; animation-delay: 2.4s !important; font-size: 26px !important; animation-duration: 10s !important; }
.falling-heart:nth-child(34) { left: 80% !important; animation-delay: 2.9s !important; font-size: 20px !important; animation-duration: 12s !important; }
.falling-heart:nth-child(35) { left: 85% !important; animation-delay: 3.4s !important; font-size: 32px !important; animation-duration: 9s !important; }
.falling-heart:nth-child(36) { left: 90% !important; animation-delay: 3.9s !important; font-size: 24px !important; animation-duration: 11s !important; }
.falling-heart:nth-child(37) { left: 95% !important; animation-delay: 4.4s !important; font-size: 18px !important; animation-duration: 13s !important; }
.falling-heart:nth-child(38) { left: 7% !important; animation-delay: 0.6s !important; font-size: 28px !important; animation-duration: 8s !important; }
.falling-heart:nth-child(39) { left: 17% !important; animation-delay: 1.1s !important; font-size: 22px !important; animation-duration: 10s !important; }
.falling-heart:nth-child(40) { left: 27% !important; animation-delay: 1.6s !important; font-size: 26px !important; animation-duration: 12s !important; }
.falling-heart:nth-child(41) { left: 37% !important; animation-delay: 2.1s !important; font-size: 20px !important; animation-duration: 9s !important; }
.falling-heart:nth-child(42) { left: 47% !important; animation-delay: 2.6s !important; font-size: 32px !important; animation-duration: 11s !important; }
.falling-heart:nth-child(43) { left: 57% !important; animation-delay: 3.1s !important; font-size: 24px !important; animation-duration: 13s !important; }
.falling-heart:nth-child(44) { left: 67% !important; animation-delay: 3.6s !important; font-size: 18px !important; animation-duration: 8s !important; }
.falling-heart:nth-child(45) { left: 77% !important; animation-delay: 4.1s !important; font-size: 28px !important; animation-duration: 10s !important; }
.falling-heart:nth-child(46) { left: 87% !important; animation-delay: 0.1s !important; font-size: 22px !important; animation-duration: 12s !important; }
.falling-heart:nth-child(47) { left: 97% !important; animation-delay: 0.6s !important; font-size: 26px !important; animation-duration: 9s !important; }
.falling-heart:nth-child(48) { left: 3% !important; animation-delay: 1.1s !important; font-size: 20px !important; animation-duration: 11s !important; }
.falling-heart:nth-child(49) { left: 13% !important; animation-delay: 1.6s !important; font-size: 32px !important; animation-duration: 13s !important; }
.falling-heart:nth-child(50) { left: 92% !important; animation-delay: 2.1s !important; font-size: 24px !important; animation-duration: 8s !important; }