.two-column-text {
  display: flex;
  justify-content: center;
  align-items: center;
}

.two-column-text__text {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  margin: 4rem 1rem;
  max-width: var(--max-width);

@media screen and (min-width: 768px) {
    margin: 4rem 4rem;
    flex-direction: column;
}
}

.two-column-text__text__content {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  width: 100%;

  @media screen and (min-width: 768px) {
    flex-direction: row;
  }
}

.two-column-text__text__content__column {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    @media screen and (min-width: 768px) {
      width: 50%;
    }
    

}