/* ==========================================================================
   page-header.css — Page header & breadcrumb
   Purple title banner on inner pages.
   Self-contained: every value is written out (no CSS variables) and every
   selector has its own rule, so changing one block never touches another.
   ========================================================================== */

/* ── .page-header ── */
.page-header {
  background: linear-gradient(135deg, #f0e0f2 0%, #f9f0fa 100%);
  padding: 80px 0 60px;
  text-align: center;
}

.page-header h1 {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: clamp(2.4rem, 5vw, 3.6rem);
  font-weight: 300;
  color: #4a154b;
}

.page-header p {
  color: #4a154bd6;
  margin-top: 12px;
}

/* ── .breadcrumb ── */
.breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  justify-content: center;
  margin-top: 16px;
  font-size: 0.8rem;
  color: #4a154bb2;
}

.breadcrumb a {
  color: #4a154b;
}

.breadcrumb span {
  opacity: 0.4;
}

.breadcrumb a {
  font-weight: 600;
}

.breadcrumb span:last-child {
  opacity: .85;
  font-weight: 600;
}