/* Intro Screen Styles */
#intro-screen {
    background-color: #000;
    justify-content: center;
    align-items: center;
}

.intro-container {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
}

#intro-logo,
.intro-logo {
    max-width: 80%;
    max-height: 80%;
    object-fit: contain;
    opacity: 0;
    animation: introFade 7s ease-in-out forwards;
}

/* Intro Animation */
@keyframes introFade {
    0% {
        opacity: 0;
        transform: scale(0.95);
    }
    28.57% {  /* 2s / 7s = 28.57% */
        opacity: 1;
        transform: scale(1);
    }
    71.43% {  /* 5s / 7s = 71.43% */
        opacity: 1;
        transform: scale(1);
    }
    100% {
        opacity: 0;
        transform: scale(0.95);
    }
}