/* Shared marketing layout — page-specific rules in css/pages/*.css */

.wrapper {
  padding-left: var(--section-pad-x, clamp(24px, 4vw, 48px));
  padding-right: var(--section-pad-x, clamp(24px, 4vw, 48px));
}

.wrapper:not(.footer):not(.hero-section-wrapper) {
  padding-top: var(--section-pad);
  padding-bottom: var(--section-pad);
}

.wrapper .container {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: var(--container-width);
}

.wrapper.dark-grey-bg {
  background-color: var(--dark-grey);
}

.wrapper.ash-bg {
  background-color: var(--ash-bg);
}

.wrapper.pale-yellow-bg {
  background: linear-gradient(180deg, var(--pale-yellow) 0%, #fff9d6 100%);
}

.container.center {
  align-items: center;
  text-align: center;
}

.container.center .h2,
.container.center > .paragraph {
  text-align: center;
}

.center-div {
  display: flex;
  flex-flow: column;
  align-items: center;
  width: 100%;
}