.yes-page,
.yes-page-main,
body.yes-internal-page #primary {
  width: 100%;
  overflow-x: clip;
}

.yes-page {
  background: var(--yes-color-bg-light);
  color: var(--yes-color-text-primary);
}

html.dark .yes-page {
  background: var(--yes-color-bg-dark);
  color: var(--yes-color-text-primary);
}

.yes-page-hero,
.yes-hero {
  padding-top: var(--yes-hero-padding-top);
}

.yes-section {
  padding-block: var(--yes-section-padding-y);
}

.yes-section--compact {
  padding-block: var(--yes-space-2xl);
}

.yes-section--large {
  padding-block: var(--yes-space-4xl);
}

.yes-container {
  width: min(100% - calc(var(--yes-page-padding-x) * 2), var(--yes-container-max));
  margin-inline: auto;
}

.yes-container--narrow {
  width: min(100% - calc(var(--yes-page-padding-x) * 2), var(--yes-container-narrow-max));
  margin-inline: auto;
}

.yes-container--wide {
  width: min(100% - calc(var(--yes-page-padding-x) * 2), var(--yes-container-wide-max));
  margin-inline: auto;
}

.yes-grid {
  display: grid;
  gap: var(--yes-space-lg);
}

.yes-grid--2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.yes-grid--3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.yes-grid--4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.yes-stack {
  display: grid;
  gap: var(--yes-space-lg);
}

.yes-stack > .wp-block-group__inner-container {
  display: grid;
  gap: inherit;
}

.yes-cluster {
  display: flex;
  flex-wrap: wrap;
  gap: var(--yes-space-md);
  align-items: center;
}

.yes-reading-width,
.yes-lede,
.yes-page-system p.yes-lede {
  max-width: var(--yes-reading-max);
}

.yes-stack > .yes-grid,
.yes-stack > .wp-block-columns.yes-grid {
  margin-top: var(--yes-space-2xl);
}

.yes-stack > .wp-block-group__inner-container > .yes-grid,
.yes-stack > .wp-block-group__inner-container > .wp-block-columns.yes-grid,
.yes-lede + .yes-grid,
.yes-lede + .wp-block-columns.yes-grid {
  margin-top: var(--yes-space-2xl);
}

.yes-page-system .wp-block-columns.yes-grid,
.yes-page .wp-block-columns.yes-grid {
  display: grid !important;
  gap: var(--yes-space-lg) !important;
  margin-bottom: 0;
}

.yes-page-system .wp-block-columns.yes-grid > .wp-block-column,
.yes-page .wp-block-columns.yes-grid > .wp-block-column {
  margin: 0;
  min-width: 0;
  display: flex;
  flex-basis: auto !important;
  flex-grow: 0 !important;
}

.yes-page-system .wp-block-columns.yes-grid > .wp-block-column > *,
.yes-page .wp-block-columns.yes-grid > .wp-block-column > * {
  width: 100%;
}

body.yes-internal-page #primary > .yes-section:first-child,
body.yes-internal-page #primary > .yes-hero:first-child,
body.yes-internal-page #primary > .wp-block-group.yes-section:first-child,
body.yes-internal-page #primary > .wp-block-group.yes-hero:first-child {
  padding-top: var(--yes-hero-padding-top);
}

@media (max-width: 1180px) {
  .yes-grid,
  .yes-page-system .wp-block-columns.yes-grid,
  .yes-page .wp-block-columns.yes-grid {
    gap: var(--yes-space-md);
  }

  .yes-grid--4 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .yes-grid--3 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 782px) {
  .yes-section--compact {
    padding-block: var(--yes-space-xl);
  }

  .yes-section--large {
    padding-block: var(--yes-space-3xl);
  }

  .yes-stack {
    gap: var(--yes-space-md);
  }

  .yes-stack > .yes-grid,
  .yes-stack > .wp-block-columns.yes-grid,
  .yes-stack > .wp-block-group__inner-container > .yes-grid,
  .yes-stack > .wp-block-group__inner-container > .wp-block-columns.yes-grid,
  .yes-lede + .yes-grid,
  .yes-lede + .wp-block-columns.yes-grid {
    margin-top: var(--yes-space-xl);
  }

  .yes-grid--2,
  .yes-grid--3,
  .yes-grid--4 {
    grid-template-columns: 1fr;
  }

  .yes-page-system .wp-block-columns.yes-grid,
  .yes-page .wp-block-columns.yes-grid {
    display: grid !important;
  }
}
