@layer styles {
  /* flow-root stops section margins collapsing out through the row. */
  .row {
    display: flow-root;
  }

  .header__content,
  .section,
  .section--aligned-with-grid {
    padding-left: var(--page__margin);
    padding-right: var(--page__margin);
  }

  .section {
    margin-bottom: var(--space--large);
    margin-top: var(--space--large);
  }

  .section--aligned-with-grid {
    margin-left: auto;
    margin-right: auto;
    max-width: var(--content-width);
  }

  .section--with-theme-color {
    background-color: var(--color__theme--ecovs);
    margin-bottom: 0;
  }

  .row--with-theme-color {
    background: var(--color__theme--ecovs);
  }

  .row--with-top-margin {
    margin-top: var(--space--large);
  }

  /* Rows that aren't full-bleed sit in the centred content band. */
  @media (min-width: 1200px) {
    .row--constrained {
      max-width: var(--content-width);
      margin-inline: auto;
    }
  }
}