.home-hero {
    display:flex;
    background:#9a0d16;
    flex-direction:row;
    justify-content:center;
}
.home-hero .col {
    flex:1 0 50%;
    position:relative;
    align-content:center;
}
.home-hero .col:first-of-type:before {
    width:14px;
    height:100%;
    content:"";
    right:0;
    top:0;
    z-index:1;
    position:absolute;
    background: url(dist/images/punch-brand-col-2-side.svg) repeat-y 0 50%;
    background-size: 14px 53px;
}
.home-hero .col:last-of-type {
    padding:4rem;
}
.home-hero__overlay-img {
    width:200px;
    height:174px;
    object-fit:cover;
    position:absolute;
    z-index: 10;
    left: 10%;
    bottom: -80px;
    width: 200px;
}
.home-hero__img {
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center;
}
.home-hero__content {
    max-width:568px;
    width:100%;
}
.home-hero__content :is(h1, h2, h3, h4, h5, h5, h6, p) {
    color:white;
}

.home-hero__content h1 {
    font-family: "afterglow", "just_lovely", serif;
    font-size: 2.75rem;
    font-weight: 400;
}
@media (max-width:992px) {
   .home-hero {
        flex-direction:column;
        align-content:center;
    } 
    .home-hero .col:last-of-type {
        padding:4rem 2rem;
    }
    .home-hero__content {
        justify-self:center;
    }
    .home-hero__content :is(h1, h2, h3, h4, h5, h5, h6, p) {
        text-align:center;
    }
    .home-hero__img {
        height:368px;
    }
    .home-hero .col:first-of-type:before {
        width: 100%;
        height: 10px;
        background: url(dist/images/punch-brand-col-2.svg) repeat-x 50% 0;
        background-size: 38px 10px;
        bottom:0;
        top:auto;
    }
    .home-hero__overlay-img {
        display:none;
    }
}