body {
  margin: 0;
}
.page-wrapper {
  margin: var(--spc);
}

.flex-container {
  display: flex;
  margin-top: var(--spc);
  column-gap: var(--spc);
  flex-flow: row wrap;
}
.flex-container > * {
  flex: 1 100%;
  container-type: inline-size;
}

@media all and (min-width: 768px) {
  .region-featured-bottom-first,
.region-featured-bottom-second,
.region-featured-bottom-third,
.region-footer-first,
.region-footer-second,
.region-footer-third,
.region-footer-fourth,
.region-sidebar-first,
.region-sidebar-second {
    flex: 1 10vw;
    max-width: 25vw;
  }

  .region-main-content {
    flex: 3 0px;
  }
}