.hero {
    position: relative;
    max-height: 690px;
}

.hero .grid-box {
    padding-top: 137px;
    padding-bottom: 89px;
}

.hero .image {
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
    height: 100%;
}

.hero .container div {
    grid-column: span 5;
}

.hero h1 {
    text-wrap: nowrap;
    color: var(--blue-100);
}

.hero h3 {
    color: #fff;
}

.hero a {
    margin-top: 20px;
}

@media (max-width: 1024px) {
    .hero .container div {
        grid-column: 1 / -1;
    }
}