.hero-banner {
    background: url(../../img/hero-4.jpg) no-repeat center / cover;
    padding: 120px 0;

    h1 {
        color: #C10017;
        text-align: center;
        font-family: Inter;
        font-size: 36px;
        font-style: normal;
        font-weight: 600;
        line-height: normal;
        text-transform: uppercase;
    }
}

.tabs {
    background: url(../../img/tab-bg.jpg) no-repeat center / cover;
    padding: 72px 0;

    .container {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }
}

.tabs-content {
    width: 65%;
}

.tabs-content__item {
    position: relative;
    display: none;

    ul {
        list-style: none;
    }
    li {
        line-height: 1.5;
        font-weight: 500;
        padding-bottom: 20px;
    }

    li:before {
        content: "\25AA";
        color: #ed0000;
        position: absolute;
        left: -22px;
    }
}
.tabs-content__item.active {
    display: block;
}

.tabs-menu {
    width: 30%;

    li {
        position: relative;
        display: block;
        margin-bottom: 20px;
        font-family: Inter;
        font-size: 16px;
        font-style: normal;
        line-height: normal;
        text-transform: uppercase;
        cursor: pointer;
    }

    li.active {
        position: relative;
        color: #C10000;
        font-weight: 600;

    }

    li.active::before {
        content: '';
        position: absolute;
        top: 0;
        left: -15px;
        bottom: 0;
        width: 5px;
        height: 20px;
        background: #C10017;
        margin: auto;
    }
}

@media screen and (max-width: 568px) {
    .tabs-menu,
    .tabs-content {
        width: 100%;
        text-align: center;
    }

    .tabs-menu {
        border-bottom: 2px solid #C10017;
        margin-bottom: 40px;
    }
    
    .tabs-menu li.active {
        position: relative;
    }

    .tabs-menu li.active:after {
        content: "";
        position: absolute;
        top: 0;
        right: -15px;
        bottom: 0;
        width: 5px;
        height: 20px;
        background: #C10017;
        margin: auto;
    }

    .tabs-content__item li:before {
        display: none;
    }
}