/* =====================================================================
   THE TEAM — standalone page, styled after the "Keynote Speakers /
   Session Leaders" layout, recolored onto the GOAT Agency palette.
   Fonts: Kola (display, via Fontshare) + Geist / Geist Mono (via Google Fonts)
   — the same fonts the reference template uses.
   ===================================================================== */

body.team-page{
  background:var(--paper);
}

.site-header .desktop-nav a.is-current{ color:var(--pink); }

/* ---- Hero ---- */
.team-hero{
  padding:calc(7rem + 2vh) 6vw 3rem;
  max-width:1180px;
  margin:0 auto;
  text-align:center;
}

.team-eyebrow{
  font-family:"Geist Mono", monospace;
  font-size:.8rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--pink);
  margin:0 0 1.2rem;
}

.team-hero-heading{
  font-family:"Kola", sans-serif;
  font-weight:400;
  text-transform:uppercase;
  letter-spacing:-.02em;
  font-size:clamp(2.1rem, 7.6vw, 5.6rem);
  line-height:.98;
  text-wrap:balance;
  color:var(--ink);
  margin:0 0 1.4rem;
}

.team-hero-copy{
  font-family:"Geist", "Geist Placeholder", sans-serif;
  font-size:1.05rem;
  line-height:1.6;
  color:#455366;
  max-width:640px;
  margin:0 auto;
}

/* ---- Section shell (white panel on paper background, like the reference) ---- */
.team-section{
  padding:1rem 6vw 5rem;
}

.team-panel{
  max-width:1200px;
  margin:0 auto;
  background:#ffffff;
  border-radius:32px;
  padding:clamp(2rem, 5vw, 4rem);
  box-shadow:0 30px 70px rgba(5,5,5,.06);
}

.team-group-photo{
  position:relative;
  overflow:hidden;
  aspect-ratio:16/7;
  margin:0 0 clamp(3.5rem, 7vw, 6rem);
  border-radius:24px;
  background:#e9e9e6;
}
.team-group-photo img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 47%;
}
.team-group-photo::after{
  content:"";
  position:absolute;
  inset:auto 0 0;
  height:42%;
  background:linear-gradient(transparent, rgba(5,5,5,.72));
  pointer-events:none;
}
.team-group-photo figcaption{
  position:absolute;
  z-index:1;
  left:clamp(1.2rem, 3vw, 2.3rem);
  bottom:clamp(1rem, 2.5vw, 2rem);
  color:#fff;
  font-family:"Geist", sans-serif;
  font-size:clamp(1rem, 2vw, 1.45rem);
  font-weight:600;
  letter-spacing:-.02em;
}
.team-group-photo--crew{ margin-bottom:0; }

.team-section-title{
  font-family:"Kola", sans-serif;
  font-weight:400;
  text-transform:uppercase;
  letter-spacing:-.01em;
  font-size:clamp(2rem, 4.5vw, 3rem);
  color:var(--ink);
  text-align:center;
  margin:0 0 3rem;
}
.team-section-title--crew{
  margin-top:5rem;
}

/* ---- Grids ---- */
.team-grid{
  display:grid;
  gap:2.5rem 2rem;
}
.team-grid--featured{
  grid-template-columns:repeat(3, 1fr);
  max-width:1260px;
  margin:0 auto;
}
@media (max-width:900px){
  .team-grid--featured{ grid-template-columns:repeat(2, 1fr); max-width:900px; }
}
@media (max-width:640px){
  .team-grid--featured{ grid-template-columns:1fr; max-width:420px; }
}
.team-panel--leadership{
  max-width:1320px;
}
.team-grid--crew{
  grid-template-columns:repeat(6, 1fr);
}

.team-card{ text-align:center; }

/* ---- Octagon-clipped photo (matches the reference card shape) ---- */
.team-photo{
  aspect-ratio:1/1;
  border-radius:20px;
  clip-path:polygon(18% 0%, 82% 0%, 100% 18%, 100% 82%, 82% 100%, 18% 100%, 0% 82%, 0% 18%);
  display:flex;
  align-items:center;
  justify-content:center;
  margin:0 0 1.4rem;
  overflow:hidden;
  background:#e8e8e5;
}
.team-photo svg{ width:34%; height:34%; opacity:.9; }
.team-photo img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .5s cubic-bezier(.2,.75,.25,1);
}
.team-card:hover .team-portrait{ transform:scale(1.035); }
.team-portrait--one{ object-position:center 22%; }
.team-portrait--two{ object-position:center 20%; }
.team-portrait--three{ object-position:center 18%; }

.team-photo--group-crop img{
  object-position:center 25%;
}

.team-card--sm .team-photo{ margin-bottom:1.1rem; }

.team-photo--web{ background:linear-gradient(160deg,#202020,#000000); }
.team-photo--seo{ background:linear-gradient(160deg,#fb0155,#c30244); }
.team-photo--design{ background:linear-gradient(160deg,#6b43ff,#4429cc); }
.team-photo--ai{ background:linear-gradient(160deg,#3a3a3a,#000000); }
.team-photo--gray{ background:linear-gradient(160deg,#d8d8d5,#c7c7c5); }
.team-photo--pink-soft{ background:linear-gradient(160deg,#fb4b82,#fb0155); }

.team-name{
  font-family:"Kola", sans-serif;
  font-weight:400;
  text-transform:uppercase;
  letter-spacing:-.01em;
  font-size:1.7rem;
  color:var(--ink);
  margin:0 0 .5rem;
}
.team-name--sm{ font-size:1.25rem; }

.team-role{
  font-family:"Geist Mono", monospace;
  font-size:.82rem;
  font-weight:500;
  letter-spacing:.02em;
  color:var(--pink);
  margin:0 0 .9rem;
}

.team-bio{
  font-family:"Geist", "Geist Placeholder", sans-serif;
  font-size:.95rem;
  line-height:1.55;
  color:#455366;
  max-width:34ch;
  margin:0 auto;
}

/* ---- Closing CTA ---- */
.team-cta{
  text-align:center;
  padding:2rem 6vw 6rem;
}
.team-cta h2{
  font-family:"Kola", sans-serif;
  font-weight:400;
  text-transform:uppercase;
  font-size:clamp(1.8rem, 4vw, 2.6rem);
  color:var(--ink);
  margin:0 0 1.6rem;
}
.team-cta-button{
  display:inline-flex;
  align-items:center;
  gap:.6rem;
  background:var(--ink);
  color:#fff;
  font-family:"Geist", sans-serif;
  font-weight:600;
  font-size:.95rem;
  padding:.9rem 1.6rem;
  border-radius:999px;
  text-decoration:none;
  transition:background .2s ease;
}
.team-cta-button:hover{ background:var(--pink); }

.team-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:2rem 6vw 3rem;
  max-width:1200px;
  margin:0 auto;
  font-family:"Geist Mono", monospace;
  font-size:.8rem;
  color:#8a8a88;
}
.team-footer a{ color:#8a8a88; text-decoration:none; }
.team-footer a:hover{ color:var(--pink); }

/* ---- Responsive ---- */
@media (max-width:900px){
  .team-grid--featured{ grid-template-columns:1fr; max-width:420px; margin-left:auto; margin-right:auto; }
  .team-grid--crew{ grid-template-columns:repeat(2, 1fr); }
  .team-panel{ border-radius:24px; }
}

@media (max-width:520px){
  .team-group-photo{ aspect-ratio:4/3; border-radius:18px; }
  .team-footer{ flex-direction:column; gap:.6rem; text-align:center; }
}

/* =====================================================================
   TEAM PEOPLE + VALUES — dark panel inserted between Leadership and
   The Crew. Reuses the site's Kola display font, Geist body/mono
   fonts, --pink accent and the --paper/--ink tokens are intentionally
   NOT used here: this block is a deliberate dark inversion, styled
   after the reference screenshot, matching the rounded-panel language
   of .team-panel above it.
   ===================================================================== */

.team-people-section{
  max-width:1500px;
  margin:0 auto clamp(3rem, 6vw, 5rem);
  padding:0 4vw;
}

.team-people-inner{
  background:#000000;
  border:1px solid rgba(255,255,255,.06);
  border-radius:32px;
  padding:clamp(3.2rem, 7vw, 5.5rem) clamp(1.6rem, 5vw, 4rem) clamp(3.8rem, 7vw, 6rem);
  text-align:center;
}

.team-people-pill{
  display:inline-block;
  margin:0 0 1.6rem;
  padding:.45rem 1.1rem;
  border:1px solid rgba(255,255,255,.16);
  border-radius:999px;
  font-family:"Geist Mono", monospace;
  font-size:.75rem;
  letter-spacing:.08em;
  color:#f5f5f5;
}

.team-people-heading{
  font-family:"Kola", sans-serif;
  font-weight:400;
  text-transform:uppercase;
  letter-spacing:-.02em;
  font-size:clamp(2.3rem, 6vw, 4.1rem);
  line-height:1.02;
  color:#f5f5f5;
  margin:0 0 1rem;
}

.team-people-subtitle{
  font-family:"Geist", "Geist Placeholder", sans-serif;
  font-size:clamp(1rem, 1.6vw, 1.25rem);
  color:#9a9a97;
  margin:0 0 clamp(3.2rem, 6.5vw, 4.6rem);
}

/* ---- 10 team portraits: interlocking circles, 5x2 desktop / 3x3 mobile ---- */
.team-people-grid{
  display:grid;
  grid-template-columns:repeat(5, 1fr);
  row-gap:clamp(2.6rem, 4.5vw, 3.8rem);
  column-gap:0;
  max-width:1380px;
  margin:0 auto;
}

.team-person{
  position:relative;
  text-align:center;
}

.team-person-photo{
  width:100%;
  aspect-ratio:1/1;
  border-radius:50%;
  overflow:hidden;
  border:3px solid #000000;
  background:#151515;
  margin:0 0 1.1rem;
  position:relative;
  box-sizing:border-box;
}
.team-person-photo img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}

/* pull every item left into its row-neighbor, except row starters */
.team-person:not(:nth-child(5n+1)) .team-person-photo{
  margin-left:clamp(-2.4rem, -3.2vw, -1.4rem);
}

/* left-to-right stacking within each row of 5 */
.team-person:nth-child(1){ z-index:5; }
.team-person:nth-child(2){ z-index:4; }
.team-person:nth-child(3){ z-index:3; }
.team-person:nth-child(4){ z-index:2; }
.team-person:nth-child(5){ z-index:1; }
.team-person:nth-child(6){ z-index:5; }
.team-person:nth-child(7){ z-index:4; }
.team-person:nth-child(8){ z-index:3; }
.team-person:nth-child(9){ z-index:2; }
.team-person:nth-child(10){ z-index:1; }

.team-person-name{
  font-family:"Geist", sans-serif;
  font-weight:700;
  font-size:clamp(.95rem, 1.3vw, 1.15rem);
  color:#f5f5f5;
  margin:0 0 .3rem;
  white-space:nowrap;
}

.team-person-role{
  font-family:"Geist", sans-serif;
  font-size:clamp(.74rem, .95vw, .88rem);
  color:#8f8f8c;
  margin:0;
}

/* ---- Mobile: 1-column people, strict 3x3 values grid ---- */
@media (max-width:767px){
  .team-people-inner{
    padding:2.4rem 1.2rem 3rem;
    border-radius:24px;
  }

  .team-people-grid{
    grid-template-columns:repeat(3, 1fr);
    row-gap:1.6rem;
    max-width:420px;
    margin-bottom:2.8rem;
  }

  .team-person-photo{
    border-width:2px;
    margin:0 0 .7rem;
  }

  /* cancel desktop overlap, apply mobile overlap within rows of 3 */
  .team-person:not(:nth-child(5n+1)) .team-person-photo{
    margin-left:0;
  }
  .team-person:not(:nth-child(3n+1)) .team-person-photo{
    margin-left:clamp(-1.1rem, -4vw, -.6rem);
  }

  .team-person:nth-child(1){ z-index:3; }
  .team-person:nth-child(2){ z-index:2; }
  .team-person:nth-child(3){ z-index:1; }
  .team-person:nth-child(4){ z-index:3; }
  .team-person:nth-child(5){ z-index:2; }
  .team-person:nth-child(6){ z-index:1; }
  .team-person:nth-child(7){ z-index:3; }
  .team-person:nth-child(8){ z-index:2; }
  .team-person:nth-child(9){ z-index:1; }

  .team-person-name{
    font-size:.72rem;
  }
  .team-person-role{
    font-size:.6rem;
  }

  .team-person--extra{
    display:none;
  }

}

/* =====================================================================
   CREDENTIALS — dark panel, above The Crew. Reuses the site's Kola
   display font, Geist body/mono fonts, --pink accent, matching the
   dark inversion language of .team-people-inner above it.
   Placeholder content — swap in real certifications/images.
   ===================================================================== */

.team-credentials-section{
  max-width:1500px;
  margin:0 auto clamp(3rem, 6vw, 5rem);
  padding:0 4vw;
}

.team-credentials-inner{
  background:#000000;
  border:1px solid rgba(255,255,255,.06);
  border-radius:32px;
  padding:clamp(2.6rem, 6vw, 4.5rem) clamp(1.6rem, 5vw, 3.5rem) clamp(3rem, 6vw, 5rem);
  text-align:center;
}

.team-credentials-pill{
  display:inline-block;
  margin:0 0 1.6rem;
  padding:.45rem 1.1rem;
  border:1px solid rgba(255,255,255,.16);
  border-radius:999px;
  font-family:"Geist Mono", monospace;
  font-size:.75rem;
  letter-spacing:.08em;
  color:#f5f5f5;
}

.team-credentials-heading{
  font-family:"Kola", sans-serif;
  font-weight:400;
  text-transform:uppercase;
  letter-spacing:-.02em;
  font-size:clamp(2.1rem, 5vw, 3.4rem);
  line-height:1.02;
  color:#f5f5f5;
  margin:0 0 1.4rem;
}
.team-credentials-heading-accent{
  color:var(--pink);
}

.team-credentials-badge{
  display:inline-flex;
  align-items:center;
  gap:.55rem;
  margin:0 0 clamp(2.8rem, 6vw, 4rem);
  padding:.6rem 1.2rem;
  border:1px solid rgba(251,2,86,.35);
  background:rgba(251,2,86,.08);
  border-radius:999px;
  font-family:"Geist", sans-serif;
  font-size:.85rem;
  color:#f5f5f5;
}
.team-credentials-badge svg{
  width:16px;
  height:16px;
  color:var(--pink);
  flex-shrink:0;
}

.team-credentials-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:clamp(1.2rem, 2.4vw, 1.8rem);
  max-width:1200px;
  margin:0 auto;
}

.team-credential-card{
  background:#000000;
  border:1px solid rgba(255,255,255,.08);
  border-radius:20px;
  padding:1.4rem 1.4rem 1.6rem;
  text-align:left;
}

.team-credential-thumb{
  aspect-ratio:16/10;
  border-radius:14px;
  margin:0 0 1.2rem;
  background:linear-gradient(160deg,#151515,#000000);
  border:1px solid rgba(255,255,255,.08);
  display:flex;
  align-items:center;
  justify-content:center;
}
.team-credential-thumb svg{
  width:26%;
  height:26%;
  color:rgba(251,2,86,.55);
}

.team-credential-source{
  font-family:"Geist Mono", monospace;
  font-size:.68rem;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--pink);
  margin:0 0 .5rem;
}

.team-credential-title{
  font-family:"Geist", sans-serif;
  font-weight:700;
  font-size:1rem;
  line-height:1.3;
  color:#f5f5f5;
  margin:0 0 .4rem;
}

.team-credential-date{
  font-family:"Geist", sans-serif;
  font-size:.82rem;
  color:#8f8f8c;
  margin:0 0 1rem;
}

.team-credential-link{
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  font-family:"Geist", sans-serif;
  font-weight:600;
  font-size:.85rem;
  color:#f5f5f5;
  text-decoration:none;
  border-bottom:1px solid rgba(255,255,255,.25);
  padding-bottom:.15rem;
  transition:color .2s ease, border-color .2s ease;
}
.team-credential-link svg{
  width:14px;
  height:14px;
  flex-shrink:0;
}
.team-credential-link:hover{
  color:var(--pink);
  border-color:var(--pink);
}

@media (max-width:767px){
  .team-credentials-inner{
    padding:2.4rem 1.2rem 3rem;
    border-radius:24px;
  }

  .team-credentials-grid{
    grid-template-columns:1fr;
    max-width:420px;
  }
}

/* =====================================================================
   TEAM + CREDENTIALS — responsive layout only.
   Below 1024px .team-duo is an ordinary block, so both sections keep
   exactly the styling and stacking they already had (team first,
   credentials underneath). From 1024px up they sit side by side,
   70 / 30, top-aligned. No colours, fonts or content are touched here.
   ===================================================================== */
@media (min-width:1024px){
  .team-duo{
    display:grid;
    grid-template-columns:64fr 36fr;
    align-items:stretch;
    gap:clamp(1rem, 1.6vw, 1.5rem);
    max-width:1500px;
    margin:0 auto clamp(3rem, 6vw, 5rem);
    padding:0 4vw;
  }

  /* the wrapper now provides the page framing the two sections used to
     provide for themselves */
  .team-duo > .team-people-section,
  .team-duo > .team-credentials-section{
    max-width:none;
    margin:0;
    padding:0;
    min-width:0;
  }

  /* both panels run to the same height */
  .team-duo > .team-people-section,
  .team-duo > .team-credentials-section{ display:flex }
  .team-duo .team-people-inner,
  .team-duo .team-credentials-inner{ flex:1 }

  /* the narrower column needs slightly smaller labels so the names,
     which never wrap, stop touching each other */
  .team-duo .team-person-name{ font-size:clamp(.74rem, .92vw, .95rem) }
  .team-duo .team-person-role{ font-size:clamp(.64rem, .78vw, .8rem) }

  /* the team panel sits tighter top and bottom */
  .team-duo .team-people-inner{
    padding-top:clamp(2.4rem, 4vw, 3.4rem);
    padding-bottom:clamp(2.6rem, 4.4vw, 3.8rem);
  }

  /* credentials: header, then three cards spread over the remaining height */
  .team-duo .team-credentials-inner{
    display:flex;
    flex-direction:column;
    padding-top:clamp(2.4rem, 4vw, 3.4rem);
    padding-bottom:clamp(2.6rem, 4.4vw, 3.8rem);
  }
  .team-duo .team-credentials-pill{ margin-bottom:1rem }
  .team-duo .team-credentials-heading{ margin-bottom:.9rem }
  .team-duo .team-credentials-badge{ margin-bottom:clamp(1.4rem, 2.2vw, 2rem) }

  .team-duo .team-credentials-grid{
    grid-template-columns:1fr;
    max-width:none;
    flex:1;
    align-content:space-between;
    gap:clamp(.9rem, 1.4vw, 1.4rem);
  }

  /* each card goes horizontal so all three fit without shrinking the panel */
  .team-duo .team-credential-card{
    display:flex;
    align-items:center;
    gap:clamp(.9rem, 1.2vw, 1.3rem);
    padding:1.1rem 1.2rem;
  }
  .team-duo .team-credential-thumb{
    flex:0 0 clamp(96px, 9vw, 132px);
    margin:0;
    aspect-ratio:4 / 3;
  }
  .team-duo .team-credential-body{ min-width:0 }
  .team-duo .team-credential-title{ font-size:.95rem; margin-bottom:.3rem }
  .team-duo .team-credential-date{ margin-bottom:.6rem }
}

/* ---- real certificate thumbnails ---- */
.team-credential-thumb--img{
  display:block;
  padding:0;
  overflow:hidden;
  background:#ffffff;
  border-color:rgba(255,255,255,.14);
}
.team-credential-thumb--img img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  background:#ffffff;
}

/* ---- wider, airier duo on desktop ---- */
@media (min-width:1024px){
  .team-duo{
    max-width:1720px;
    padding:0 3vw;
    gap:clamp(1.2rem, 1.8vw, 2.2rem);
  }
  .team-duo .team-people-inner{
    padding-left:clamp(2rem, 4vw, 4.5rem);
    padding-right:clamp(2rem, 4vw, 4.5rem);
  }
  .team-duo .team-people-grid{
    row-gap:clamp(3rem, 5vw, 4.6rem);
  }
  .team-duo .team-credentials-inner{
    padding-left:clamp(1.6rem, 2.4vw, 2.6rem);
    padding-right:clamp(1.6rem, 2.4vw, 2.6rem);
  }
}

/* =====================================================================
   DESKTOP DUO — interlocking portraits.
   The old rule gave every photo the same negative margin, so only the
   first pair in a row actually overlapped: each following circle just
   touched its neighbour. The shift has to accumulate along the row, and
   it belongs on the grid item so the name travels with its portrait.
   ===================================================================== */
@media (min-width:1024px){
  .team-duo .team-people-grid{
    --ov:clamp(1.2rem, 2.6vw, 2.2rem);
    transform:translateX(calc(2 * var(--ov)));   /* re-centre the shortened row */
    row-gap:clamp(2.4rem, 4vw, 3.4rem);
  }
  /* a negative margin on a grid item otherwise widens it — pin the width so
     the shift only moves the item, it doesn't stretch the circle */
  .team-duo .team-person{ width:100% }
  .team-duo .team-person:not(:nth-child(5n+1)) .team-person-photo{ margin-left:0 }
  .team-duo .team-person:nth-child(5n+2){ margin-left:calc(-1 * var(--ov)) }
  .team-duo .team-person:nth-child(5n+3){ margin-left:calc(-2 * var(--ov)) }
  .team-duo .team-person:nth-child(5n+4){ margin-left:calc(-3 * var(--ov)) }
  .team-duo .team-person:nth-child(5n+5){ margin-left:calc(-4 * var(--ov)) }

  /* bigger portraits: give the grid back the room the panel padding took */
  .team-duo .team-people-inner{
    padding-left:clamp(1.1rem, 2vw, 2.2rem);
    padding-right:clamp(1.1rem, 2vw, 2.2rem);
  }

  /* ~5% tighter overall, with smaller labels under the larger portraits */
  .team-duo .team-people-heading{ font-size:clamp(1.9rem, 3.5vw, 3.2rem) }
  .team-duo .team-people-subtitle{ font-size:.92rem }
  .team-duo .team-person-name{ font-size:clamp(.68rem, .82vw, .86rem); margin-bottom:.22rem }
  .team-duo .team-person-role{ font-size:clamp(.6rem, .7vw, .73rem) }
  .team-duo .team-person-photo{ margin-bottom:.8rem }
}

/* ---- leadership: the person's name under the role ---- */
.team-lead-name{
  font-family:"Geist", "Geist Placeholder", sans-serif;
  font-weight:600;
  font-size:1.02rem;
  line-height:1.3;
  color:var(--ink);
  margin:0 0 .45rem;
}

/* ---- certificate thumbnails: twice the size so the diploma is readable ---- */
@media (min-width:1024px){
  .team-duo .team-credential-thumb{
    flex:0 0 clamp(192px, 18vw, 264px);
  }
  .team-duo .team-credential-card{
    gap:clamp(1.1rem, 1.6vw, 1.6rem);
    padding:1.3rem 1.4rem;
  }
}

/* =====================================================================
   LEADERSHIP ON PHONES
   Founder & CEO keeps the first row on its own, at ~1.5x smaller than the
   full-width card; Creative Director and Head of Growth share the second
   row, so each lands at ~2x smaller. Photos and type scale with them.
   ===================================================================== */
@media (max-width:640px){
  .team-grid--featured{
    grid-template-columns:1fr 1fr;
    max-width:none;
    gap:1.6rem 1rem;
  }
  .team-grid--featured .team-card:first-child{
    grid-column:1 / -1;
  }

  /* row 1 — 1.5x smaller */
  .team-grid--featured .team-card:first-child .team-photo{
    width:64%;
    margin-left:auto;
    margin-right:auto;
  }
  .team-grid--featured .team-card:first-child .team-name{ font-size:1.15rem }
  .team-grid--featured .team-card:first-child .team-lead-name{ font-size:.78rem }
  .team-grid--featured .team-card:first-child .team-role{ font-size:.62rem; margin-bottom:.6rem }
  .team-grid--featured .team-card:first-child .team-bio{ font-size:.72rem; max-width:40ch }

  /* row 2 — 2x smaller */
  .team-grid--featured .team-card:nth-child(n+2) .team-name{ font-size:.78rem; margin-bottom:.3rem }
  .team-grid--featured .team-card:nth-child(n+2) .team-lead-name{ font-size:.62rem; margin-bottom:.25rem }
  .team-grid--featured .team-card:nth-child(n+2) .team-role{ font-size:.5rem; margin-bottom:.45rem }
  .team-grid--featured .team-card:nth-child(n+2) .team-bio{ font-size:.58rem; line-height:1.45 }
  .team-grid--featured .team-card:nth-child(n+2) .team-photo{ margin-bottom:.7rem }
}