/* v22 — zoomed-out hero images without distortion */
.hero::before{
  content:"";
  position:absolute;
  inset:0 0 112px;
  z-index:0;
  background-image:var(--hero-bg);
  background-position:center;
  background-size:cover;
  filter:blur(18px);
  transform:scale(1.035);
  opacity:.42;
}
.hero-image{
  z-index:1;
  object-fit:contain;
  object-position:right center;
  background:rgba(17,39,45,.2);
}
.hero-shade{z-index:2}
.hero-content{z-index:3}
.hero-proof{z-index:4}
html[dir="rtl"] .hero-image{object-position:left center}
@media(max-width:900px){
  .hero::before{inset:0 0 105px}
  .hero-image,html[dir="rtl"] .hero-image{object-position:center}
}
@media(max-width:600px){
  .hero::before{inset:0 auto auto 0;width:100%;height:310px}
  .hero-image{object-fit:contain;background:#183139}
}