/* Photo heroes retain more breathing room than the 360px image-free banners. */
main > .hero.photo-hero { min-height: 550px; padding: 0; position:relative; isolation:isolate; background-color:#112340; background-size:100% 100%,contain; background-position:center,right center; background-repeat:no-repeat; }
/* Blend the contained photo into navy so its left edge disappears on wide screens. */
main > .hero.photo-hero::before { content:""; position:absolute; inset:0; z-index:0; pointer-events:none; background:linear-gradient(90deg,#112340 0%,#112340 max(0px,calc(100% - 60rem)),rgba(17,35,64,.85) max(0px,calc(100% - 48rem)),rgba(17,35,64,.25) max(0px,calc(100% - 25rem)),transparent 100%); }
main > .hero.photo-hero > .wrap { position:relative; z-index:1; }
main > .hero.photo-hero > .hero-note { z-index:1; }
main > .hero.photo-hero > .wrap { padding-top: 48px; padding-bottom: 54px; }
main > .hero.photo-hero .crumbs { margin-bottom: 25px; }
main > .hero.photo-hero h1 { font-size: clamp(3.2rem, 6vw, 5.8rem); margin-top: 18px; margin-bottom: 22px; }
main.support-main > .hero.photo-hero { min-height: 480px; }
main > .hero.map-photo-hero { height: 510px; }
@media (max-width: 900px) {
  main > .hero.photo-hero::before { background:linear-gradient(90deg,rgba(17,35,64,.83),rgba(17,35,64,.48) 60%,rgba(17,35,64,.12)); }
  main > .hero.map-photo-hero { height: 570px; }
}
@media (max-width: 600px) {
  main > .hero.photo-hero { min-height: 490px; }
  main.support-main > .hero.photo-hero { min-height: 440px; }
  main > .hero.photo-hero > .wrap { padding-top: 36px; padding-bottom: 42px; }
  main > .hero.photo-hero h1 { font-size: clamp(2.6rem, 10vw, 3.55rem); }
  main > .hero.photo-hero .crumbs { margin-bottom: 22px; }
  main > .hero.map-photo-hero { height: 600px; }
}