/* Original portraits, framed for each page without altering the photographs. */
.has-portrait .portrait-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr);
  gap: clamp(36px, 5vw, 76px);
  align-items: center;
}
.hero.has-portrait { min-height: 0; }
.hero.has-portrait .portrait-layout { padding: 72px 0 76px; }
.hero.has-portrait h1 {
  font-size: clamp(3.3rem, 6.7vw, 6.9rem);
  line-height: .96;
  letter-spacing: -.055em;
}
.has-portrait .portrait-copy { min-width: 0; }
.hero.has-portrait .hero-copy { max-width: 620px; }
.portrait { margin: 0; width: 100%; min-width: 0; }
.portrait-frame {
  width: 100%;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  background: #c8c8d2;
}
.portrait-frame img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 80%;
}
.portrait--experience img { object-position: 50% 50%; }
.portrait figcaption {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
  font-size: .875rem;
  color: var(--soft);
}
.page-hero.has-portrait { padding: 72px 0; }
.page-hero.has-portrait .portrait-layout {
  grid-template-columns: minmax(0, 1.35fr) minmax(0, .65fr);
}
.page-hero.has-portrait h1 {
  font-size: clamp(3rem, 4.65vw, 5rem);
  line-height: 1.04;
  margin-top: 18px;
  letter-spacing: -.045em;
}
.page-hero.has-portrait .lead { font-size: 1.1rem; }
@media (max-width: 950px) {
  .has-portrait .portrait-layout,
  .page-hero.has-portrait .portrait-layout {
    grid-template-columns: minmax(0, 1fr);
    gap: 36px;
  }
  .hero.has-portrait .portrait-layout { padding: 52px 0 56px; }
  .page-hero.has-portrait { padding: 52px 0 56px; }
  .hero.has-portrait h1 {
    font-size: clamp(2.8rem, 12.8vw, 5.6rem);
    line-height: .98;
  }
  .page-hero.has-portrait h1 { font-size: clamp(2.5rem, 8.2vw, 4.7rem); }
  .has-portrait .portrait { max-width: 420px; }
  .hero.has-portrait .hero-copy { max-width: 680px; }
}
@media (max-width: 480px) {
  .has-portrait .portrait { max-width: 360px; }
  .hero.has-portrait .label { margin-bottom: 24px; }
  .portrait figcaption { margin-top: 12px; }
}