.profile-with-photo {
  background: #050607;
}

.profile-with-photo::after {
  z-index: 1;
  background: linear-gradient(90deg, rgba(0, 0, 0, .92) 0, rgba(0, 0, 0, .64) 38%, rgba(0, 0, 0, .08) 74%);
}

.profile-photo {
  position: absolute;
  z-index: 0;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 66% 28%;
  transition: transform .8s cubic-bezier(.2, .8, .2, 1), filter .5s;
}

.profile-with-photo:hover .profile-photo {
  transform: scale(1.025);
  filter: saturate(1.06);
}

.profile-photo-shade {
  position: absolute;
  z-index: 1;
  inset: 0;
  background: linear-gradient(180deg, transparent 50%, rgba(0, 0, 0, .38));
}

.profile-with-photo .profile-index,
.profile-with-photo .profile-copy {
  z-index: 3;
}

.profile-with-photo .profile-index,
.profile-with-photo .profile-copy small,
.profile-with-photo .profile-copy strong,
.profile-with-photo .profile-copy em {
  color: #fff;
}

.profile-with-photo .profile-copy small,
.profile-with-photo .profile-copy em {
  color: rgba(255, 255, 255, .72);
}

.profile-with-photo .profile-copy em b {
  background: rgba(255, 255, 255, .16);
}

.erica-photo {
  object-position: 60% 24%;
}

.nazir-photo { object-position: 61% 22%; }
.john-photo { object-position: 57% 24%; }
.jeremy-photo { object-position: 58% 20%; }

.window-photo {
  justify-content: flex-end;
}

.window-photo::after {
  display: none;
}

.window-photo > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 28%;
}

.window-photo > small {
  margin: 0 0 34px;
  padding: 9px 13px;
  border: 1px solid rgba(255, 255, 255, .22);
  border-radius: 999px;
  background: rgba(0, 0, 0, .35);
  color: #fff;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

@media (max-width: 800px) {
  .profile-photo { object-position: 62% 24%; }
  .erica-photo { object-position: 58% 20%; }
  .nazir-photo { object-position: 59% 18%; }
  .john-photo { object-position: 56% 20%; }
  .jeremy-photo { object-position: 57% 17%; }
  .profile-with-photo::after {
    background: linear-gradient(90deg, rgba(0, 0, 0, .83), rgba(0, 0, 0, .22) 70%), linear-gradient(180deg, transparent 55%, rgba(0, 0, 0, .65));
  }
  .window-photo > img { object-position: 50% 25%; }
  .window-photo > small { margin-bottom: 18px; }
}
