.hero-art {
  background: #597467;
}
.hero-art::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(16, 49, 44, .13), transparent 44%), linear-gradient(0deg, rgba(16, 49, 44, .25), transparent 40%);
  pointer-events: none;
}
.hero-art img,
.listing-panel img,
.about-visual img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.hero-art img { object-position: center 54%; }
.art-label { z-index: 1; text-shadow: 0 1px 6px #123a30; }
.listing-panel { background: #526756; }
.listing-panel img { object-position: center; }
.listing-panel::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(12, 41, 34, .68), transparent 35%), linear-gradient(180deg, rgba(12, 41, 34, .45), transparent 30%);
  pointer-events: none;
}
.listing-panel .panel-kicker,
.listing-panel > p {
  position: relative;
  z-index: 1;
  color: white;
  text-shadow: 0 1px 5px #173c35;
}
.about-visual { background: #6c8275; }
.about-visual img { object-position: 63% center; }
.about-visual::before {
  content: "";
  position: absolute;
  inset: 0;
  width: auto;
  height: auto;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  background: linear-gradient(0deg, rgba(9, 38, 33, .68), transparent 70%);
  z-index: 1;
}
.about-number,
.about-visual span { z-index: 2; }
.about-visual span { color: #f0f2e7; }
@media (max-width: 760px) {
  .hero-art img { object-position: center 62%; }
  .listing-panel img { object-position: 50% center; }
}