.image-with-heading-container {
  background-color: rgb(var(--color-base-accent-1), 0.05);
  font-family: var(--font-heading-family);
}
.image-with-heading-content {
  --gap: 1.5rem;
}
@media screen and (min-width: 750px) {
  .image-with-heading-content {
    width: calc(50% - var(--gap) / 2);
  }
}

@media screen and (min-width: 990px) {
  .image-with-heading-content {
    width: calc(25% - var(--gap) * 3 / 4);
  }
}