/* SAHP hero background photos (crossfading gallery images behind the banner). */
.hero-photos{position:absolute;inset:0;overflow:hidden;z-index:0}
.hero-photo{position:absolute;inset:-2%;background-position:center;background-size:cover;background-repeat:no-repeat;opacity:0;transform:scale(1.08);transition:opacity 1.6s var(--ease),transform 0s linear 1.6s;filter:saturate(1.05)}
.hero-photo.on{opacity:1;transform:scale(1);transition:opacity 1.6s var(--ease),transform 9s cubic-bezier(.25,.6,.3,1)}
/* Navy wash: heavier on the left where the headline sits, and toward the bottom marquee. */
.hero-photo-shade{position:absolute;inset:0;background:
  linear-gradient(90deg,rgba(4,11,29,.94) 0%,rgba(4,11,29,.82) 38%,rgba(7,20,48,.55) 68%,rgba(7,20,48,.62) 100%),
  linear-gradient(180deg,rgba(4,11,29,.55) 0%,transparent 30%,transparent 62%,rgba(4,11,29,.92) 100%)}
/* Keep the existing grid, glow and road on top of the photos, slightly softer. */
.hero.has-photos .hero-grid,.hero.has-photos .hero-glow,.hero.has-photos .hero-road{z-index:1}
.hero.has-photos .hero-grid{opacity:.6}
.hero.has-photos .hero-road{opacity:.7}
@media (max-width:900px){
  .hero-photo-shade{background:linear-gradient(180deg,rgba(4,11,29,.62) 0%,rgba(4,11,29,.6) 45%,rgba(4,11,29,.86) 80%,rgba(4,11,29,.96) 100%)}
}
@media (prefers-reduced-motion:reduce){
  .hero-photo,.hero-photo.on{transition:opacity .01s;transform:none}
}