.banner {
  margin-left: var(--layout-gutter);
  margin-right: var(--layout-gutter);
  align-items: center;
  border-radius: 1rem;
  display: flex;
  justify-content: center;
  position: relative;
  text-align: center;
}
.banner.banner--padding-large {
  padding: 7.5rem var(--layout-gutter);
}
@media (min-width: 580px) {
  .banner.banner--padding-large {
    padding-bottom: 5rem;
    padding-top: 5rem;
  }
}
@media (min-width: 1024px) {
  .banner.banner--padding-large {
    padding-bottom: 7.5rem;
    padding-top: 7.5rem;
  }
}
.banner.banner--padding-large .banner__content {
  max-width: var(--content-max-width);
}
.banner.banner--padding-small {
  margin-bottom: var(--design-margin);
  margin-top: var(--design-margin);
  padding: 1rem;
}
@media (min-width: 1024px) {
  .banner.banner--padding-small {
    padding: 2.5rem 3rem 4rem;
  }
}
.banner.banner--has-background-image {
  box-shadow: 0 4px 36px 0 var(--color-black-12);
  margin-bottom: var(--design-margin);
  margin-top: var(--design-margin);
  overflow: hidden;
}

.banner__image {
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}
.banner__image img {
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  width: 100%;
}

.banner__content {
  position: relative;
}

.banner__lead_image {
  display: inline-flex;
  margin-bottom: 1.25rem;
}

.banner__title {
  color: var(--text-color);
  font-family: var(--font-sans);
  font-size: 2.5rem;
  font-weight: 500;
  line-height: 1.15;
}
.banner__title:not(:last-child) {
  margin-bottom: 1.25rem;
}

.banner__details {
  color: var(--text-color);
  font-family: var(--font-sans);
}
.banner__details:not(:last-child) {
  margin-bottom: 2rem;
}
.banner__details,
.banner__details p {
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.4;
}

.banner__ctas {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  flex-direction: column;
}
@media (min-width: 1024px) {
  .banner__ctas {
    flex-direction: row;
    flex-wrap: wrap;
  }
}
@media (max-width: 1023px) {
  .banner__ctas > * {
    width: 100%;
  }
}
.banner__ctas .button {
  min-width: 164px;
}