/* /team/ only. Hero photo wall (.tmh) and the team card grid (.tmg, .tmc). */

.tmh { position: relative; z-index: 2; margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 16px; width: 100%; max-width: 560px; }
.tmh li { animation: hl-rise .55s cubic-bezier(.22, 1, .36, 1) backwards; animation-delay: calc(260ms + var(--i) * 60ms); }
.tmh a { display: block; border-radius: 999px; }
.tmh img { display: block; width: 100%; height: auto; aspect-ratio: 1; border-radius: 999px; object-fit: cover; background: #1a1a1a; }

.tmg { grid-template-columns: repeat(6, minmax(0, 1fr)); grid-auto-rows: 1fr; align-items: stretch; }
.tmc { display: flex; flex-direction: column; align-items: flex-start; padding: 24px; scroll-margin-top: calc(var(--navh) + 16px); }
.tmc img { display: block; width: 100%; height: auto; aspect-ratio: 1; margin: 0 0 24px; border-radius: 4px; object-fit: cover; background: #1a1a1a; }
.tmc h3 { margin: 0; font-family: var(--display); font-weight: 500; font-size: 24px; line-height: 32px; letter-spacing: -0.02em; color: var(--text); }
.tmc-r { margin: 8px 0 0; font-size: 16px; line-height: 24px; color: var(--muted); }

@media (prefers-reduced-motion: reduce) { .tmh li { animation: none; } }
@media (min-width: 901px) and (max-width: 1199.98px) { .tmg { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1200px) { .tmc { padding: 16px; } .tmc img { margin-bottom: 16px; } .tmc h3 { font-size: 20px; line-height: 28px; } }
@media (min-width: 901px) and (max-width: 1199.98px) { .tmc { padding: 16px; } .tmc img { margin-bottom: 16px; } .tmc h3 { font-size: 20px; line-height: 28px; } }
@media (max-width: 900px) { .hero .hx-tm { min-height: 0; } .tmg { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 639.98px) {
  .tmh { gap: 8px; }
  .tmc { padding: 16px; }
  .tmc img { margin-bottom: 16px; }
  .tmc h3 { font-size: 20px; line-height: 28px; }
  .tmc-r { font-size: 14px; line-height: 20px; }
}