:root {
  --texttext-max-height: min(36rem, 70vw);
  --texttext-padding: max(1.5rem, 5vw);
  --texttext-gap: 2rem;
}

  @media (min-width: 768px) {:root {
    --texttext-gap: 4rem
}
  }

.texttext {
}

.texttext-wrapper {
  background: var(--section-color-background);
  color: var(--section-color-text);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  grid-gap: 2rem;
  gap: 2rem;
  grid-gap: var(--texttext-gap);
  gap: var(--texttext-gap);
}

@media (min-width: 768px) {

.texttext-wrapper {
    flex-direction: row
}
  }

@media (min-width: 768px) {

.texttext-wrapper > div {
      flex: 1 1 0
  }
    }

.texttext-content {
  display: flex;
  flex-direction: column;
  justify-content: center;
}