/* Top section styles */

#top {
    width: 100%;
    height: calc(100vh - 60px);
    background: 
        linear-gradient(to top, #000 0%, #0008 30%, #0000 100%),
        url(/images/XLV2-top-bg.webp) no-repeat;
}

#top-title {
    user-select: none;
}

#top-title p {
    line-height: 1.5;
}

@media (max-width: 650px) {
    #top {
        background-size: auto, 1900px;
        background-position: 0 0, calc(100% + 830px) -1500px;
    }
    #top-title h1 {
        font-size: 10em;
        padding-top: 0.5em;
    }
}

@media (min-width: 1001px) {
    #top {
        background-position: 0 0, calc(40% - 30px) calc(30% - 1150px);
        background-size: 4000px;
    }
    #top-title h1 {
        margin-top: 60px;
        font-size: 15em;
    }
    #top-title p {
        font-size: 1.5em;
    }
}

@media (min-width: 651px) and (max-width: 1000px) {
    #top {
        background-position: 0 0, calc(100% + 1400px) -2450px;
        background-size: auto, 3200px;
    }
    #top-title h1 {
        margin-top: 60px;
        font-size: 15em;
    }
    #top-title p {
        font-size: 1.5em;
    }
}