/* Full-height video hero, loaded only by the homepage template. */
.template-home #header.home-video-hero {
    isolation: isolate;
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    min-height: 100svh;
    margin-bottom: 0;
    padding: 36px 0 40px;
    overflow: hidden;
    background: #0a2444;
}

.home-video-hero__video,
.home-video-hero__overlay {
    position: absolute;
    inset: 0;
}

.home-video-hero__video {
    z-index: -2;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.home-video-hero__overlay {
    z-index: -1;
    background: linear-gradient(90deg, rgba(3, 18, 37, .78) 0%, rgba(10, 36, 68, .58) 30%, rgba(10, 36, 68, .38) 60%);
}

.home-video-hero__navigation,
.home-video-hero__content {
    position: relative;
    z-index: 1;
    width: 100%;
}

.home-video-hero__navigation {
    flex: 0 0 auto;
}

.home-video-hero__navigation .header {
    margin-bottom: 0;
}

.template-home #header.home-video-hero .header__nav ul li a {
    color: #fff;
}

.template-home #header.home-video-hero .header__nav ul li a:hover {
    border-color: #fff;
}

.home-video-hero__content {
    display: flex;
    flex: 1 1 auto;
}

.home-video-hero__content .homeBanner {
    display: flex;
    width: 100%;
}

.home-video-hero__content .homeBanner__columns {
    flex: 1 1 auto;
    align-items: center;
    padding: 56px 0 80px;
}

.home-video-hero__content .homeBanner__columns > div:first-of-type {
    width: min(620px, 56%);
    margin-top: 0;
    padding-right: 0;
}

.home-video-hero__content .homeBanner__columns > div:first-of-type h1 {
    max-width: 12ch;
    margin-bottom: 28px;
    color: #fff;
    font-size: clamp(3rem, 6vw, 5.5rem);
    line-height: 1;
    letter-spacing: -.025em;
    text-wrap: balance;
}

.home-video-hero__content .homeBanner__columns > div:first-of-type p {
    max-width: 42ch;
    color: rgba(255, 255, 255, .9);
    font-size: 1.125rem;
    line-height: 1.75;
    text-wrap: pretty;
}

.home-video-hero__content .homeBanner__columns > div:first-of-type .buttons a {
    border-color: #fff;
    color: #fff;
}

.home-video-hero__content .homeBanner__columns > div:first-of-type .buttons a:first-of-type,
.home-video-hero__content .homeBanner__columns > div:first-of-type .buttons a:hover {
    background-color: #fff;
    color: #0a2444;
}

.home-video-hero__content .homeBanner__scrollDown {
    left: auto;
    right: 0;
    bottom: 0;
}

.home-video-hero__content .homeBanner__scrollDown img {
    filter: brightness(0) invert(1);
    opacity: .85;
}

@media (max-width: 1024px) {
    .template-home #header.home-video-hero {
        padding-top: 28px;
    }

    .home-video-hero__content .homeBanner__columns > div:first-of-type {
        width: min(620px, 72%);
    }
}

@media (max-width: 767px) {
    .template-home #header.home-video-hero {
        min-height: 100vh;
        min-height: 100svh;
        padding: 20px 0 28px;
    }

    .home-video-hero__content .homeBanner__columns {
        justify-content: center;
        padding: 48px 0 28px;
    }

    .home-video-hero__content .homeBanner__columns > div:first-of-type {
        width: 100%;
        margin-bottom: 0;
    }

    .home-video-hero__content .homeBanner__columns > div:first-of-type h1 {
        max-width: 11ch;
        margin-bottom: 20px;
        font-size: clamp(2.5rem, 13vw, 4rem);
        line-height: 1.05;
    }

    .home-video-hero__content .homeBanner__columns > div:first-of-type p {
        max-width: 34ch;
        margin-bottom: 24px;
        font-size: 1rem;
        line-height: 1.65;
    }

    .home-video-hero__content .homeBanner__columns > div:first-of-type .buttons a {
        padding: 12px 18px;
        border-radius: 24px;
        font-size: .8125rem;
    }
}
