/* Original portraits with only edge-connected neutral backdrop pixels set to white. */
:is(.home-page .join,.team-page-roster),.people-grid,.people-grid .person,.people-grid .person-photo{background-color:#fff}
.people-grid .person-photo.p1{background-image:url("team-member-01-white-pixels-20261024.png")}
.people-grid .person-photo.p2{background-image:url("team-member-02-white-pixels-20261024.png")}
.people-grid .person-photo.p3{background-image:url("team-member-03-white-pixels-20261024.png")}
.people-grid .person-photo.p4{background-image:url("team-member-04-white-pixels-20261024.png")}
.people-grid .person-photo.p8{background-image:url("team-member-08-white-pixels-20261024.png")}

/* Clear original portraits with a gentle hover zoom and no card borders. */
:is(.home-page,.team-page) .people-grid .person,:is(.home-page,.team-page) .people-grid .person:hover{transform:none;box-shadow:none}
.people-grid .person .person-photo{transform:none;filter:none;opacity:1;transition:transform .45s cubic-bezier(.2,.7,.2,1)}
.people-grid .person:hover .person-photo{transform:scale(1.06)}
:is(.home-page,.team-page) .people-grid,:is(.home-page,.team-page) .people-grid>.person{border:0}
@media(prefers-reduced-motion:reduce){.people-grid .person .person-photo{transition:none}}
.people-grid .person::after{inset:70% 0 0;background:linear-gradient(to bottom,rgba(255,255,255,0),rgba(255,255,255,.96) 72%,#fff)}

/* Expand the portrait row toward both page edges. */
.home-page.home-cards-refresh .join>.people-grid{margin-inline:max(2px,calc(var(--home-gutter) - 30px))}
.team-page .team-page-roster>.people-grid{margin-inline:0}

/* Fade the animated composited edge into the white page, including subpixels. */
:is(.home-page,.team-page) .people-grid>.person{
  -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 calc(100% - 8px),transparent 100%);
  mask-image:linear-gradient(to bottom,#000 0%,#000 calc(100% - 8px),transparent 100%);
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
}
:is(.home-page,.team-page) .people-grid>.person::after{
  inset:70% -2px -2px;
  z-index:1;
  background:linear-gradient(to bottom,rgba(255,255,255,0) 0%,rgba(255,255,255,.96) 65%,#fff 82%,#fff 100%);
}
:is(.home-page,.team-page) .people-grid>.person .person-info{z-index:2}