.campaign-banner {
  display: flex;
  flex-direction: column;
  padding: var(--page-margin);

  &:is(.section):not(.header-section) {
    background-color: var(--color-background);
  }

  @media screen and (max-width: 1099px) {
    grid-column: 1 / -1;
  }
}

.campaign-banner__container {
  order: 1;
  padding-block: var(--padding-4xl) var(--padding-lg);

  @media screen and (max-width: 1099px) {
    display: flex;
    flex-direction: column;
    gap: 0;
    padding-block-start: var(--padding-xl);
  }
}

.campaign-banner__title {
  grid-column: 1 / span 6;
  margin-block-end: var(--margin-2xl);
}

.campaign-banner__content {
  grid-column: 9 / -1;
}

.campaign-banner__text {
  margin-block-end: var(--margin-4xl);
}