.frame {
  position: relative;
  overflow: hidden;
  background: #171013;
  border: 1px solid #30262a;
}
.frame::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 55%, rgba(0,0,0,.8));
}
.frame img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .7s ease, filter .7s ease;
}
.frame:hover img { transform: scale(1.025); filter: saturate(1.08); }
.frame-a img { object-position: 50% 30%; }
.frame-b { margin-top: 5rem; }
.frame-b img { object-position: 48% center; }
.frame-c { margin-bottom: 5rem; }
.frame-c img { object-position: 70% 35%; filter: saturate(.55) contrast(1.08); }
.frame span {
  position: absolute;
  z-index: 2;
  left: 1.5rem;
  bottom: 1.3rem;
  text-transform: uppercase;
  letter-spacing: .16em;
  font-size: .75rem;
  color: var(--gold);
}
@media (max-width: 760px) {
  .frame-b, .frame-c { margin: 0; }
}