#team {
  --team-width: 960px;
  --team-gap: clamp(20px, 3vw, 36px);
  padding-block: clamp(56px, 7vw, 104px);
}

#team :is(.team-head, .people, .collab) {
  max-width: var(--team-width);
  margin-inline: auto;
}

#team :is(.team-head, .people) {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--team-gap);
}

#team .team-head { margin-bottom: clamp(28px, 3.8vw, 48px); }
#team .team-head h2 { font-size: clamp(40px, 4.65vw, 72px); }
#team .team-head .copy p { font-size: 17px; margin-bottom: 10px; }
#team .team-head .copy p.lead { font-size: 21px; }
#team .team-head .copy p:last-child { margin-bottom: 0; }

#team .person:nth-child(2) { margin-top: clamp(24px, 3.4vw, 48px); }
#team .person .cap { gap: 10px; margin-top: 10px; padding-top: 9px; }
#team .person h3 { font-size: clamp(22px, 2.25vw, 32px); }
#team .person .role { margin-top: 5px; }
#team .person .idx { font-size: 11px; letter-spacing: .08em; white-space: nowrap; }

#team .collab {
  margin-top: clamp(30px, 4vw, 48px);
  gap: 16px;
  padding-block: 14px;
}

#team .collab h4 { font-size: clamp(22px, 2.1vw, 30px); }
#team .collab p { font-size: 16px; }

@media (max-width: 820px) {
  #team { --team-width: clamp(310px, 80vw, 430px); }
  #team :is(.team-head, .people) { grid-template-columns: minmax(0, 1fr); }
  #team .team-head h2 { font-size: clamp(36px, 10vw, 46px); }
  #team .person:nth-child(2) { margin-top: 0; }
  #team .collab { gap: 6px; }
}