{% import './../_variables.css' %}

.header-text {
    position: relative;
    padding: 0 15px;
    margin: 0 -15px;
}

.header-text__container {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
    max-width: var(--container-width);
    margin: 0 auto;
    padding: 160px 0 18%;
}

.header-text__col {
    width: calc(50% - 12px);
    flex: 0 0 calc(50% - 12px);
}

.header-text__headline-text {
    margin-bottom: 0;
}

.header-text__text {
    margin-bottom: 50px;
}

.header-text__text p:last-child {
    margin-bottom: 0;
}

.header-text__buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 27px;
}

.header-text__shape {
    position: absolute;
    bottom: -1px;
    left: 0;
    right: 0;
    width: 100%;
    height: auto;
    line-height: 0;
    transform: rotate(180deg);
}

.header-text__shape svg {
    width: 101%;
    height: auto;
}
  
.header-text__shape svg path {
    stroke: #fff;
    fill: #fff;
}
  
@media screen and (max-width: 1322px) {
    .header-text {
        margin: 0;
    }
}

@media screen and (max-width: 767px) {
    .header-text__container {
        flex-direction: column;
        padding: 50px 0 25%;
    }

    .header-text__col {
        flex: 0 0 100%;
        width: 100%;
    }
}