/* HERO WITH BAND */
/* The strip carries the picture, so the hero text no longer competes with a
   photo beside it: one column, centred, under a full-width band. */
.hero--band{display:block;height:auto;border-bottom:1px solid var(--rule)}
.hero--band .hero__text{align-items:center;text-align:center;max-width:56rem;
  margin:0 auto;padding:clamp(2.2rem,5vw,3.6rem) clamp(1.5rem,5vw,3rem)}
.hero--band .hero__h{max-width:26ch}
.hero--band .hero__sub{margin-left:auto;margin-right:auto}
.hero--band .hero__acts{justify-content:center}
/* Shorter here than mid-page: the headline and the two buttons still have to
   land in the first screen. */
.pband.pband--hero{height:clamp(11rem,19vw,17rem)}
@media(max-width:760px){.pband.pband--hero{height:10.5rem}}