.start-background {
    background-image: url('../assets/images/backgrounds/start-bg.webp');
}

#start-screen .screen-content {
    gap: 4cqh;
}

.title-logo {
    width: 70cqw;
    max-width: 800px;
    height: auto;
    object-fit: contain;
    filter: drop-shadow(0 4px 15px rgba(0, 0, 0, 0.6));
    animation: floatTitle 4s ease-in-out infinite;
    position: absolute;
    top: -12cqh;
}

.start-button-image img {
    width: 14cqw;
    max-width: 300px;
    height: auto;
    object-fit: contain;
    animation: pulseStartButton 2s ease-in-out infinite;
}

#start-button {
    position: absolute;
    bottom: 15cqh;
}

@keyframes floatTitle {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-10px);
    }
}

@keyframes pulseStartButton {

    0%,
    100% {
        transform: scale(1);
        filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.4));
    }

    50% {
        transform: scale(1.06);
        filter: drop-shadow(0 8px 16px rgba(207, 168, 110, 0.6));
    }
}