/* Team feed from Figma 3:1399: 371x550 portraits on 1710, gap 12, 4.37 cards visible. */
.team { margin:0 var(--page-gutter) var(--section-gap); scroll-margin-top:calc(var(--topbar-h) + var(--space-24)); }
.team-heading { display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:var(--space-24); margin-bottom:var(--space-32); }
.team-heading h2 { margin:0; font-weight:400; }
.team-aside { display:flex; flex-wrap:wrap; align-items:center; gap:var(--space-24) var(--space-48); }
.team-link { display:inline-flex; align-items:center; gap:var(--space-12); color:inherit; text-decoration:none; }
.team-link i { font-size:18px; }
.team-track { gap:12px; }
.team-card { flex:0 0 76%; }
.team-visual { position:relative; aspect-ratio:371/550; perspective:2200px; }
/* 3D faces are composited layers; they exist only while a card turns, so idle cards cost nothing on weak GPUs. */
.team-flip { position:absolute; inset:0; transition:transform 460ms cubic-bezier(.3,.1,.15,1); }
.team-card.is-3d .team-flip { transform-style:preserve-3d; will-change:transform; }
.team-photo,.team-back { position:absolute; inset:0; overflow:hidden; border-radius:4px; }
.team-card.is-3d :is(.team-photo,.team-back) { backface-visibility:hidden; -webkit-backface-visibility:hidden; }
.team-card:not(.is-3d) .team-back { visibility:hidden; }
.team-photo { background:var(--color-surface); }
.team-photo img { display:block; width:100%; height:100%; object-fit:cover; }
/* No portrait yet: initials on the card surface, same frame and flip as the others. */
.team-photo--placeholder { display:flex; align-items:flex-end; padding:var(--space-24); }
.team-initials { font-size:var(--text-112); line-height:.85; letter-spacing:var(--tracking); color:var(--color-border); }
.team-back { display:flex; flex-direction:column; justify-content:flex-end; gap:var(--space-12); padding:var(--space-24) var(--space-24) 68px; transform:rotateY(180deg); background:var(--color-ink); color:var(--color-paper); }
.team-card .team-back p { margin:0; text-wrap:pretty; }
/* Back copy is one step smaller on the narrow cards (everything below 1600); full body size from 1600. */
.team-card .team-back { padding:var(--space-20) var(--space-20) 64px; }
.team-card .team-back p { font-size:var(--text-16); line-height:1.4; }
@media (min-width:1600px) { .team-card .team-back { padding:var(--space-24) var(--space-24) 68px; } .team-card .team-back p { font-size:var(--type-body); } }
.team-back small { color:var(--color-dark-muted); }
.team-card.is-flipped .team-flip { transform:rotateY(180deg); }
.team-badge { position:absolute; right:14px; bottom:20px; z-index:2; width:32px; height:32px; padding:0; border:0; border-radius:2px; background:var(--color-ink); color:var(--color-paper); cursor:pointer; transition:background 200ms ease 120ms; }
.team-badge::before { content:""; position:absolute; inset:6px; background:currentColor; mask:url('/assets/figma-mm2/team-card-icon.svg') center/contain no-repeat; }
.team-card.is-flipped .team-badge { background:var(--color-accent); }
@media (hover:hover) {
  .team-visual:hover .team-flip { transform:rotateY(180deg); }
  .team-visual:hover .team-badge { background:var(--color-accent); }
}
@media (prefers-reduced-motion:reduce) { .team-flip,.team-badge { transition:none; } }
.team-card h3 { margin:var(--space-20) 0 0; font-weight:400; }
.team-card p { margin:10px 0 0; }
.landing-page .team-card { display:flex; flex-direction:column; min-width:0; }
.landing-page .team-visual { flex:none; }
.landing-page .team-card > h3 { margin-top:var(--space-24); }
.landing-page .team-card > p { margin-top:var(--space-12); color:var(--color-muted); }
@media (max-width:599px) { .team-aside { width:100%; flex-wrap:nowrap; justify-content:space-between; gap:var(--space-16); } }
@media (min-width:600px) { .team-card { flex-basis:calc((100% - 24px) / 2.4); } }
@media (min-width:1100px) {
  .team-heading { margin-bottom:70px; }
  .team-aside { padding-bottom:11px; }
  .team-card { flex-basis:calc((100% - 48px) / 4.37); }
}