/*
  People (/team/; Figma 83:2). Cards are rendered by PersonCard() in people.js. On black, like every page (dark since
  2026-10-13): the shared page intro ("Meet our people"), then the partners on a 272px checkerboard under the shared
  red .brand-tile, a chevron band, and the team alphabetical in a 4-col grid of 332px, split by a light client quote.
*/
.tpartners{position:relative;padding:0 0 6.23rem 4.04rem}
.tpartners__head{position:relative;height:27.2rem}
.tpartners__head h2{position:absolute;left:.5rem;top:8.8rem}
.tpartners__mark{position:absolute;left:81.6rem;top:0;width:27.2rem;height:27.2rem}   /* a .brand-tile */
/* Checkerboard cells come from each partner's { row, col } in PEOPLE (people.js sets --row/--col). */
.pgrid{display:grid;grid-template-columns:repeat(5,27.2rem);grid-auto-rows:27.2rem}
.pgrid .person{grid-area:var(--row)/var(--col)}
/* Person card: photo (img.cover), name, title */
.person__photo{overflow:hidden;aspect-ratio:1;background:var(--well)}
.person__photo img{display:block}
/* Partner cards are sized to their content; the text hangs into the empty checkerboard cell below, as in Figma. */
.person--partner{align-self:start}
/* Name and role are trimmed to cap height and baseline, as in Figma: a card is 332 + 12 + 11 + 8 + 11 = 374px tall */
.person__name{margin:1.2rem 0 0;font-family:"Cal Sans",Inter,sans-serif;font-size:1.6rem;line-height:1.9rem;text-box:trim-both cap alphabetic}
.person__title{margin:.8rem 0 0;font-size:1.5rem;line-height:1.9rem;letter-spacing:.03rem;color:var(--grey);text-box:trim-both cap alphabetic}
.person--partner :is(.person__name,.person__title){margin-left:1.96rem}
.person--partner .person__name{margin-top:1.5rem}
/* One hairline between the partners and the band (Figma draws two, 14px apart; Joe asked for one) */
.team .band{--band-h:28.87rem;--band-x:4.53rem;--band-y:12.46rem}
.tgrid{display:grid;grid-template-columns:repeat(4,33.2rem);gap:5.33rem 1.1rem;padding-left:3.9rem}
.team .client-quote{margin:5.33rem 0}
.team{padding-bottom:5.4rem}                                        /* the footer follows the last grid */

@media (max-width:767px){
  .tpartners{padding:0 2rem 3rem}
  .tpartners__head{height:auto;padding:4.4rem 0 3rem}
  .tpartners__head h2{position:static}
  .tpartners__mark{display:none}
  .pgrid{grid-template-columns:1fr 1fr;grid-auto-rows:auto;gap:3rem 1.1rem}
  .pgrid .person{grid-area:auto}
  .person--partner :is(.person__name,.person__title){margin-left:0}
  .person--partner .person__name{margin-top:1.2rem}
  .tgrid{grid-template-columns:1fr 1fr;gap:3rem 1.1rem;padding:3rem 2rem 0}
  .team .client-quote{margin:4rem 0}
  .team{padding-bottom:4rem}
}