.spr-text-one-column {
  --text-one-column-background: var(--color-white);
  --text-one-column-color: var(--color-black);

  position: relative;
  background-color: var(--color-gray-20);
  font-size: var(--text-one-column-text-font-size);
  padding-block: var(--padding-component);
}

.spr-text-one-column:has(+ section[class*="--is-merged"]:not(.has-color-right, .has-color-left)) {
  padding-block-end: 0;
}

.spr-text-one-column.spr-text-one-column--is-merged {
  padding-block-start: 0;
}

.spr-text-one-column--dark {
  --text-one-column-background: var(--color-gray-20);
  --text-one-column-color: var(--color-black);

  background-color: var(--color-white);
}

.spr-text-one-column__container {
  display: grid;
  grid-template-columns: repeat(var(--text-one-column-text-grid-columns), 1fr);
}

.spr-text-one-column__content {
  grid-column: 1 / span 4;
  padding: var(--padding-component-inline);
  color: var(--text-one-column-color);
  background-color: var(--text-one-column-background);

  @media (min-width: 48rem) {
    grid-column: 1 / span 12;
  }
}

.spr-text-one-column--small {
  .spr-text-one-column__content {
    @media (min-width: 62rem) {
      grid-column: 1 / span 8;
    }
  }
}

.spr-text-one-column--medium {
  .spr-text-one-column__content {
    @media (min-width: 62rem) {
      grid-column: 2 / span 10;
    }
  }
}

.spr-text-one-column--large {
  .spr-text-one-column__content {
    padding-inline-end: clamp(1.5rem, 24.834vw + -4.32rem, 22.5rem);
    @media (min-width: 62rem) {
      grid-column: 1 / span 12;
    }
  }
}

.spr-text-one-column__buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin-block: 1rem 0;
}