/*
 * Homepage hero corrections.
 * Loaded after home.css.
 */

.main-navigation {
    position: relative !important;
    overflow: visible !important;
}



.main-navigation::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -22px;
    width: 100%;
    height: 30px;
    z-index: 50;
    pointer-events: none;

    background-image: url('../images/hero/nav-wave.svg');
    background-position: center top;
    background-size: 100% 100%;
    background-repeat: no-repeat;
}



.home-hero {
    height: 485px !important;
    min-height: 485px !important;
    max-height: 485px !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden !important;

    background-image:
        linear-gradient(
            90deg,
            rgba(4, 37, 47, 0.94) 0%,
            rgba(4, 37, 47, 0.82) 25%,
            rgba(4, 37, 47, 0.40) 42%,
            rgba(4, 37, 47, 0.08) 62%,
            rgba(4, 37, 47, 0) 100%
        ),
        url('../images/hero/md_home_hero.png') !important;

    background-position: center center !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
}

.home-hero .hero-content {
    width: min(1450px, calc(100% - 80px)) !important;
    height: auto !important;
    margin: 0 auto !important;
    padding: 38px 0 34px !important;
    display: block !important;
}

.home-hero .hero-eyebrow {
    display: none !important;
}

.home-hero .hero-content h1 {
    width: 430px !important;
    max-width: 430px !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 60px !important;
    line-height: 0.98 !important;
    letter-spacing: 0 !important;
}

.home-hero .hero-content p:not(.hero-eyebrow) {
    width: 410px !important;
    max-width: 410px !important;
    margin: 22px 0 20px !important;
    font-size: 16px !important;
    line-height: 1.45 !important;
}

.home-hero .hero-content .button {
    min-height: 43px !important;
    margin: 0 !important;
    padding: 0 22px !important;
    font-size: 12px !important;
}

.benefit-strip {
    min-height: 108px !important;
    padding-top: 28px !important;
    padding-bottom: 26px !important;
    margin: 0 !important;
}

@media (max-width: 1050px) {
    .home-hero {
        height: 450px !important;
        min-height: 450px !important;
        max-height: 450px !important;
    }

    .home-hero .hero-content h1 {
        font-size: 50px !important;
    }
}

@media (max-width: 760px) {
    .home-hero {
        height: auto !important;
        min-height: 470px !important;
        max-height: none !important;
    }

    .home-hero .hero-content {
        width: calc(100% - 40px) !important;
        padding: 48px 0 40px !important;
    }

    .home-hero .hero-content h1 {
        width: 100% !important;
        max-width: 350px !important;
        font-size: 44px !important;
    }

    .home-hero .hero-content p:not(.hero-eyebrow) {
        width: 100% !important;
        max-width: 350px !important;
    }
}