.home-banner {
    padding: 200px 0 65px;
    position: relative;
    z-index: 1
}

.home-banner .sec-video {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: -1;
    object-fit: cover
}

.home-banner:before {
    top: 0
}

.home-banner:after, .home-banner:before {
    content: "";
    position: absolute;
    z-index: -1;
    left: 0;
    width: 100%;
    height: 510px;
    background: linear-gradient(180deg, #00031c, rgba(0, 3, 28, 0))
}

.home-banner:after {
    bottom: 0;
    transform: rotate(180deg)
}

.home-banner-content h1 {
    font-size: 73px;
    font-weight: 400;
    line-height: 80px;
    color: var(--white-color);
    margin-bottom: 16px
}

.home-banner-video {
    height: 62%;
    width: 100%;
}

.home-banner-video video {
    object-fit: contain;
    border: 2px solid var(--white-color);
}

.home-banner-content p {
    width: 580px
}

@media (max-width: 1366px) {
    .home-banner-content h1 {
        font-size: 60px;
        line-height: 75px
    }

    .home-banner-content p {
        width: 100%
    }
}

@media (max-width: 428px) {
    .home-banner {
        padding: 150px 0 65px
    }

    .home-banner-content h1 {
        font-size: 46px;
        line-height: 60px
    }
}

@media (max-width: 390px) {
    .home-banner-content h1 {
        font-size: 40px;
        line-height: 50px
    }
}

@media (max-width: 1400px) {
    .home-banner-video {
        height: 62%;
    }
}

@media (max-width: 1200px) {
    .home-banner-video {
        height: 39%;
    }
}

@media (max-width: 992px) {
    .home-banner-video {
        height: 100%;
    }
}