.preloader {
    position: fixed;
    inset: 0;
    background: #ffffff;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
    transition: opacity 0.8s ease; /* smooth fade */
}

    .preloader.fade-out {
        opacity: 0;
        pointer-events: none; /* prevent blocking clicks during fade */
    }

/* Wave bars container */
.wave {
    display: flex;
    gap: 6px;
}

    /* Individual bar */
    .wave span {
        display: block;
        width: 6px;
        height: 40px;
        background: linear-gradient(180deg, #3498db, #85c1e9);
        border-radius: 4px;
        animation: wave 1s ease-in-out infinite;
    }

        /* Staggered animation delays */
        .wave span:nth-child(2) {
            animation-delay: 0.1s;
        }

        .wave span:nth-child(3) {
            animation-delay: 0.2s;
        }

        .wave span:nth-child(4) {
            animation-delay: 0.3s;
        }

        .wave span:nth-child(5) {
            animation-delay: 0.4s;
        }

@keyframes wave {
    0%, 100% {
        transform: scaleY(0.4);
    }

    50% {
        transform: scaleY(1);
    }
}