/* Real studio portraits: the original vertical frame meets the site's ink background. */
.msa-approved--home .ap-hero--portrait .ap-hero-media {
  inset: 3.75rem 0 0 auto;
  inline-size: min(44vw, 650px);
}

.msa-approved--home .ap-hero--portrait .ap-hero-media img {
  object-position: center 19%;
  filter: brightness(.88) saturate(.88);
}

.msa-approved--home .ap-hero--portrait .ap-hero-media::after {
  background:
    linear-gradient(180deg, var(--wp--preset--color--ink) 0%, color-mix(in srgb, var(--wp--preset--color--ink) 30%, transparent) 2.5rem, transparent 5rem),
    linear-gradient(90deg, var(--wp--preset--color--ink), transparent 38%),
    linear-gradient(0deg, color-mix(in srgb, var(--wp--preset--color--ink) 72%, transparent), transparent 29%);
}

.msa-approved--home .ap-hero--portrait h1 :is(.ap-hero-name, .ap-hero-promise, .ap-hero-tail) {
  display: block;
}

.msa-approved--home .ap-hero--portrait h1 .ap-hero-tail {
  margin-block-start: -.12em;
}

.msa-approved--home .ap-profile-portrait,
body.msa-studio-page .msa-studio-page__profile-photo {
  position: relative;
  display: block;
  inline-size: 100%;
  max-block-size: 420px;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: var(--wp--preset--color--velvet);
}

.msa-approved--home .ap-profile-portrait { margin-block-end: 2rem; }
body.msa-studio-page .msa-studio-page__profile-photo { margin: 1.25rem 0 0; }

.msa-approved--home .ap-profile-portrait img,
body.msa-studio-page .msa-studio-page__profile-photo img {
  display: block;
  inline-size: 100%;
  block-size: 100%;
  object-fit: cover;
  object-position: center 7%;
  filter: saturate(.91);
}

@media (max-width: 900px) {
  .msa-approved--home .ap-hero--portrait .ap-hero-media { inset: 0 0 0 auto; inline-size: min(64vw, 600px); }
  .msa-approved--home .ap-hero--portrait .ap-hero-media::after {
    background: linear-gradient(90deg, var(--wp--preset--color--ink), transparent 72%);
  }
}

@media (max-width: 640px) {
  .msa-approved--home .ap-hero--portrait h1 {
    max-width: 100%;
    font-size: clamp(2.75rem, 12vw, 3.4rem);
  }
  .msa-approved--home .ap-hero--portrait h1 :is(.ap-hero-name, .ap-hero-promise, .ap-hero-tail) {
    white-space: nowrap;
  }
  .msa-approved--home .ap-hero--portrait .ap-hero-media {
    inset: 0 0 auto;
    inline-size: 100%;
    block-size: 54%;
  }
  .msa-approved--home .ap-hero--portrait .ap-hero-media img { object-position: center 16%; }
  .msa-approved--home .ap-hero--portrait .ap-hero-media::after {
    background: linear-gradient(0deg, var(--wp--preset--color--ink) 0%, transparent 75%);
  }
  .msa-approved--home .ap-profile-portrait { margin-block-end: 1.5rem; }
}
