.hero-proof::before {
  content: "";
  display: block;
  width: 100%;
  aspect-ratio: 4 / 5;
  margin: -54px 0 28px;
  background-image:
    linear-gradient(to bottom, rgba(9, 36, 43, 0) 72%, rgba(9, 36, 43, .16)),
    url('/anas-shammaa.jpg?v=5');
  background-size: cover;
  background-position: 50% 29%;
  border: 1px solid rgba(214, 174, 119, .34);
  box-shadow: 0 32px 70px rgba(0, 0, 0, .24);
}

.hero-proof {
  position: relative;
}

.hero-proof::after {
  content: "";
  position: absolute;
  width: 42px;
  height: 42px;
  top: -68px;
  right: -14px;
  border-top: 1px solid rgba(214, 174, 119, .68);
  border-right: 1px solid rgba(214, 174, 119, .68);
  pointer-events: none;
}

@media (max-width: 1050px) {
  .hero-proof {
    max-width: 760px;
    display: grid;
    grid-template-columns: 250px minmax(0, 1fr);
    column-gap: 34px;
    align-items: start;
    padding-top: 26px;
  }

  .hero-proof::before {
    grid-column: 1;
    grid-row: 1 / span 8;
    width: 250px;
    margin: 0;
  }

  .hero-proof::after {
    top: 12px;
    left: 236px;
    right: auto;
  }

  .proof-label,
  .proof-row,
  .proof-foot {
    grid-column: 2;
  }
}

@media (max-width: 680px) {
  .hero-proof {
    display: block;
    max-width: 420px;
    padding-top: 22px;
  }

  .hero-proof::before {
    width: min(78vw, 320px);
    margin: 0 0 28px;
  }

  .hero-proof::after {
    top: 8px;
    left: min(74vw, 306px);
  }
}