/* Shared inner-page banner style using the new ink-wash assets. */
.page-banner.page-banner--about,
.page-banner.page-banner--team,
.page-banner.page-banner--service,
.page-banner.page-banner--news,
.page-banner.page-banner--party,
.page-banner.page-banner--charity,
.page-banner.page-banner--join,
.page-banner.page-banner--contact {
  height: clamp(220px, 15.72vw, 320px);
  min-height: 0;
  align-items: center;
  justify-content: center;
  background-color: #fbfaf7;
  background-position: center bottom;
  background-size: auto 100%;
  background-repeat: no-repeat;
}

.page-banner.page-banner--about {
  --banner-copy-color: #5f7371;
  --banner-subcopy-color: #7f918f;
  background-image: url('../images/banners/about-banner.webp');
}

.page-banner.page-banner--team {
  --banner-copy-color: #53696b;
  --banner-subcopy-color: #718183;
  background-image: url('../images/banners/team-banner.webp');
}

.page-banner.page-banner--service {
  --banner-copy-color: #5b7472;
  --banner-subcopy-color: #7d8f8c;
  background-image: url('../images/banners/service-banner.webp');
}

.page-banner.page-banner--news {
  --banner-copy-color: #66848b;
  --banner-subcopy-color: #7f969b;
  background-image: url('../images/banners/news-banner.webp');
}

.page-banner.page-banner--party {
  --banner-copy-color: #b56a60;
  --banner-subcopy-color: #c3857d;
  background-image: url('../images/banners/party-banner.webp');
}

.page-banner.page-banner--charity {
  --banner-copy-color: #968a7d;
  --banner-subcopy-color: #aa9c8d;
  background-image: url('../images/banners/charity-banner.webp');
}

.page-banner.page-banner--join {
  --banner-copy-color: #627b79;
  --banner-subcopy-color: #7d908e;
  background-image: url('../images/banners/join-banner.webp');
}

.page-banner.page-banner--contact {
  --banner-copy-color: #97866f;
  --banner-subcopy-color: #b09c7f;
  background-image: url('../images/banners/contact-banner.webp');
}

.page-banner.page-banner--about::before,
.page-banner.page-banner--about::after,
.page-banner.page-banner--team::before,
.page-banner.page-banner--team::after,
.page-banner.page-banner--service::before,
.page-banner.page-banner--service::after,
.page-banner.page-banner--news::before,
.page-banner.page-banner--news::after,
.page-banner.page-banner--party::before,
.page-banner.page-banner--party::after,
.page-banner.page-banner--charity::before,
.page-banner.page-banner--charity::after,
.page-banner.page-banner--join::before,
.page-banner.page-banner--join::after,
.page-banner.page-banner--contact::before,
.page-banner.page-banner--contact::after {
  display: none;
}

.page-banner.page-banner--about .page-banner__overlay,
.page-banner.page-banner--team .page-banner__overlay,
.page-banner.page-banner--service .page-banner__overlay,
.page-banner.page-banner--news .page-banner__overlay,
.page-banner.page-banner--party .page-banner__overlay,
.page-banner.page-banner--charity .page-banner__overlay,
.page-banner.page-banner--join .page-banner__overlay,
.page-banner.page-banner--contact .page-banner__overlay {
  display: block;
  background: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0.58) 0%,
    rgba(255, 255, 255, 0.34) 30%,
    rgba(255, 255, 255, 0.06) 64%,
    rgba(255, 255, 255, 0) 100%
  );
}

.page-banner.page-banner--about .page-banner__svg-elements,
.page-banner.page-banner--team .page-banner__svg-elements,
.page-banner.page-banner--service .page-banner__svg-elements,
.page-banner.page-banner--news .page-banner__graphics,
.page-banner.page-banner--party .page-banner__graphics,
.page-banner.page-banner--charity .page-banner__graphics,
.page-banner.page-banner--join .page-banner__graphics,
.page-banner.page-banner--contact .page-banner__graphics,
.page-banner.page-banner--about .banner-svg,
.page-banner.page-banner--team .banner-svg,
.page-banner.page-banner--service .banner-svg,
.page-banner.page-banner--news .banner-graphic,
.page-banner.page-banner--party .banner-graphic,
.page-banner.page-banner--charity .banner-graphic,
.page-banner.page-banner--join .banner-svg,
.page-banner.page-banner--contact .banner-svg {
  display: none;
}

.page-banner.page-banner--about .page-banner__content,
.page-banner.page-banner--team .page-banner__content,
.page-banner.page-banner--service .page-banner__content,
.page-banner.page-banner--news .page-banner__content,
.page-banner.page-banner--party .page-banner__content,
.page-banner.page-banner--charity .page-banner__content,
.page-banner.page-banner--join .page-banner__content,
.page-banner.page-banner--contact .page-banner__content {
  position: relative;
  z-index: 2;
  width: min(1120px, 90vw);
  height: auto;
  margin: 0 auto;
  padding: 0 clamp(24px, 4vw, 56px);
  overflow: visible;
  clip-path: none;
  white-space: normal;
  text-align: center;
  color: var(--banner-copy-color);
}

.page-banner.page-banner--about .page-banner__title,
.page-banner.page-banner--team .page-banner__title,
.page-banner.page-banner--service .page-banner__title,
.page-banner.page-banner--news .page-banner__title,
.page-banner.page-banner--party .page-banner__title,
.page-banner.page-banner--charity .page-banner__title,
.page-banner.page-banner--join .page-banner__title,
.page-banner.page-banner--contact .page-banner__title {
  font-family: var(--font-serif);
  font-size: clamp(2rem, 3.2vw, 2.8rem);
  font-weight: 700;
  color: var(--banner-copy-color);
  margin-bottom: 10px;
  letter-spacing: 0.08em;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.95);
}

.page-banner.page-banner--about .page-banner__subtitle,
.page-banner.page-banner--team .page-banner__subtitle,
.page-banner.page-banner--service .page-banner__subtitle,
.page-banner.page-banner--news .page-banner__subtitle,
.page-banner.page-banner--party .page-banner__subtitle,
.page-banner.page-banner--charity .page-banner__subtitle,
.page-banner.page-banner--join .page-banner__subtitle,
.page-banner.page-banner--contact .page-banner__subtitle {
  font-family: var(--font-en);
  font-size: 0.9rem;
  font-weight: 500;
  color: var(--banner-subcopy-color);
  letter-spacing: 0.2em;
  text-transform: uppercase;
  opacity: 1;
  text-shadow: none;
}

@media (max-width: 768px) {
  .page-banner.page-banner--about,
  .page-banner.page-banner--team,
  .page-banner.page-banner--service,
  .page-banner.page-banner--news,
  .page-banner.page-banner--party,
  .page-banner.page-banner--charity,
  .page-banner.page-banner--join,
  .page-banner.page-banner--contact {
    height: 190px;
    background-size: auto 100%;
  }

  .page-banner.page-banner--about .page-banner__content,
  .page-banner.page-banner--team .page-banner__content,
  .page-banner.page-banner--service .page-banner__content,
  .page-banner.page-banner--news .page-banner__content,
  .page-banner.page-banner--party .page-banner__content,
  .page-banner.page-banner--charity .page-banner__content,
  .page-banner.page-banner--join .page-banner__content,
  .page-banner.page-banner--contact .page-banner__content {
    width: 100%;
    padding: 0 28px;
  }
}