#banner .container-content h1,
#banner .container-content h2,
#banner .container-content p {
    color: white;
}

#banner {
    display: flex;
    background: black;
    flex-direction: column;
    align-items: center;
}

#banner .main-banner {
    display: none;
}

#banner .main-banner img {
    width: 100%;
}

#banner .container-content {
    padding-top: 30px;
    padding-bottom: 30px;
    text-align: center;
}

#banner .container-content p.top-title {
    color: #C2A020;
    text-transform: uppercase;
    font-size: clamp(1.25rem, calc(20px + (25 - 20) * ((100vw - 320px) / (1920 - 320))), 1.5625rem);
    line-height: clamp(1.75rem, calc(28px + (36 - 28) * ((100vw - 320px) / (1920 - 320))), 2.25rem);
}

#banner h2.main-title {
    font-size: clamp(2.1875rem, calc(35px + (47 - 35) * ((100vw - 320px) / (1920 - 320))), 2.9375rem);
    line-height: clamp(2.8125rem, calc(45px + (61 - 45) * ((100vw - 320px) / (1920 - 320))), 3.8125rem);
    font-weight: normal;
}

#banner h2 {
    font-size: clamp(2.1875rem, calc(35px + (47 - 35) * ((100vw - 320px) / (1920 - 320))), 2.9375rem);
    line-height: clamp(2.8125rem, calc(45px + (61 - 45) * ((100vw - 320px) / (1920 - 320))), 3.8125rem);
    font-weight: bold;
}

#banner .container-content p.regular-paragraph {
    font-size: clamp(1.25rem, calc(20px + (25 - 20) * ((100vw - 320px) / (1920 - 320))), 1.5625rem);
    line-height: clamp(1.75rem, calc(28px + (36 - 28) * ((100vw - 320px) / (1920 - 320))), 2.25rem);
}

@media screen and (min-width: 1025px) {
    #banner .container-content .regular-paragraph {
        max-width: 450px;
    }

    #banner .main-banner-mobile {
        display: none;
    }

    #banner .main-banner {
        display: block;
    }

    #banner .container-content {
        padding-top: 0;
        padding-bottom: 0;
        text-align: left;
    }


    #banner {
        padding-top: 145px;
        align-items: start;
    }

    #banner .container-content {
        padding-left: 3vw;
        padding-top: 25px;
    }

    #banner .container-content {
        position: absolute;
    }
}

@media screen and (min-width: 1200px) {
    #banner {
        flex-direction: row;
        align-items: center;
    }

    #banner .container-content .regular-paragraph {
        max-width: 100%;
    }

    #banner .main-banner {
        padding-top: 0;
    }

    #banner .container-content {
        padding-left: 5vw;
        padding-top: 0;
    }
}