/* AWML Global | Group photo banner for interior pages only.
   The homepage slideshow and its text remain completely unchanged. */
.page-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 400px;
  display: flex;
  align-items: center;
  padding: clamp(64px, 7vw, 100px) 0 !important;
  background-color: #2e1045 !important;
  background-image:
    linear-gradient(94deg,
      rgba(37, 9, 55, .97) 0%,
      rgba(44, 11, 63, .92) 36%,
      rgba(45, 13, 64, .76) 62%,
      rgba(41, 14, 58, .42) 100%),
    url("/assets/awml-page-header-group.webp") !important;
  background-repeat: no-repeat !important;
  background-position: center, center 26% !important;
  background-size: cover !important;
  border-bottom: 5px solid #d1a14e !important;
}
.page-hero::after {
  /* Remove old superimposed emblem so the photograph remains the hero artwork. */
  content: none !important;
}
.page-hero > .container {
  width: min(calc(100% - 48px), 1160px);
  position: relative;
  z-index: 2;
}
.page-hero h1,
.page-hero h1 .accent,
.page-hero .eyebrow,
.page-hero .breadcrumb,
.page-hero .breadcrumb a,
.page-hero .breadcrumb span,
.page-hero p {
  text-shadow: 0 2px 14px rgba(18, 4, 25, .36);
}
.page-hero h1 {
  max-width: 850px;
  color: #fff !important;
}
.page-hero h1 .accent {
  color: #f1d18d !important;
}
.page-hero p {
  color: #fff7fb !important;
}
@media (max-width: 900px) {
  .page-hero {
    min-height: 360px;
    background-image:
      linear-gradient(93deg,
        rgba(36, 8, 51, .96) 0%,
        rgba(41, 11, 59, .88) 46%,
        rgba(44, 14, 61, .66) 100%),
      url("/assets/awml-page-header-group.webp") !important;
    background-position: center, 55% 24% !important;
  }
}
@media (max-width: 660px) {
  .page-hero {
    min-height: 380px;
    padding: 65px 0 72px !important;
    background-image:
      linear-gradient(180deg,
        rgba(37, 8, 52, .84) 0%,
        rgba(43, 11, 61, .88) 46%,
        rgba(42, 12, 58, .94) 100%),
      url("/assets/awml-page-header-group.webp") !important;
    background-position: center, center 17% !important;
  }
  .page-hero h1 { font-size: clamp(3.05rem, 10.2vw, 4.5rem) !important; }
  .page-hero > .container { width: min(calc(100% - 38px), 1160px); }
}
@media (prefers-reduced-motion: reduce) {
  .page-hero { scroll-behavior: auto; }
}
