/* Full-screen loading background */
#loading-screen {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: white; /* or a gradient matching your color scheme */
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
}

    /* Logo animation: subtle fade and zoom */
    #loading-screen img {
        width: 960px; /* Adjust based on your preference */
        opacity: 0;
        animation: fadeInZoom 2s ease-in-out forwards;
    }





/* Keyframes for subtle fade-in and zoom effect */
@keyframes fadeInZoom {
    0% {
        opacity: 0;
        transform: scale(.8);
    }

    100% {
        opacity: 1;
        transform: scale(1);
    }
}

/* Once the loading completes, fade out */
.hidden {
    opacity: 0;
    transition: opacity 0.5s ease;
}