/* Homepage principals: keep the responsive picture as one grid item. */
.record .principals {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-areas: "portrait copy";
  align-items: stretch;
}
.record .principals > .principals-photo {
  display: block;
  grid-area: portrait;
  min-width: 0;
  min-height: 0;
}
.record .principals > .principals-photo > img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 440px;
  object-fit: cover;
}
.record .principals > .principals-body {
  grid-area: copy;
  min-width: 0;
}
@media (max-width: 720px) {
  .record .principals {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "portrait" "copy";
  }
  .record .principals > .principals-photo > img {
    height: auto;
    min-height: 0;
    aspect-ratio: 1.5;
  }
}