/* ============================================
   INNER PAGE HEADER BANNER (About/Initiatives/Impact/Contact)
   ============================================ */

.page-banner {
  position: relative;
  padding: 9.5rem 0 4rem;
  background: linear-gradient(180deg, var(--cream-light), var(--cream-dark));
  text-align: center;
  overflow: hidden;
}

.page-banner::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: var(--banner-image, none);
  background-size: cover;
  background-position: center;
  opacity: 0.14;
  filter: sepia(0.35) saturate(0.7);
}

.page-banner-inner {
  position: relative;
  z-index: 1;
}

.page-banner .section-tag {
  justify-content: center;
}

.page-banner h1 {
  font-size: clamp(2.1rem, 4.5vw, 3rem);
  color: var(--navy-deep);
  margin-bottom: 0.7rem;
}

.page-banner p {
  color: var(--ink-soft);
  max-width: 620px;
  margin: 0 auto;
  font-size: 1.05rem;
}

.breadcrumb {
  display: flex;
  justify-content: center;
  gap: 0.5rem;
  font-size: 0.85rem;
  color: var(--ink-soft);
  margin-top: 1rem;
}

.breadcrumb a {
  color: var(--gold);
  font-weight: 600;
}