.hero-photo {
  margin: 0;
  min-height: 438px;
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(213, 173, 77, 0.72);
  background: #121517;
}

.hero-photo::before {
  content: "";
  position: absolute;
  z-index: 1;
  inset: 17px;
  border: 1px solid rgba(213, 173, 77, 0.48);
  border-right: 0;
  border-bottom: 0;
  pointer-events: none;
}

.hero-photo::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, rgba(8, 10, 11, 0.32), transparent 52%, rgba(8, 10, 11, 0.18));
  pointer-events: none;
}

.hero-photo img {
  display: block;
  width: 100%;
  height: 438px;
  object-fit: cover;
  object-position: center;
}

.hero-photo figcaption {
  position: absolute;
  z-index: 2;
  left: 38px;
  right: 30px;
  bottom: 30px;
  color: #fff;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.65);
}

.hero-photo figcaption span {
  color: var(--gold-light);
  margin-right: 13px;
}

@media (max-width: 680px) {
  .hero-photo,
  .hero-photo img {
    min-height: 320px;
    height: 320px;
  }
}