@layer sections {
#team { padding: var(--space-1) 0; }
#team .tm-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(18px, 2.4vw, 32px); margin-top: clamp(48px, 6vw, 88px); }
#team .tm-person { display: grid; align-content: start; gap: 14px; }
#team .tm-person:nth-child(2n) { margin-top: clamp(40px, 6vw, 88px); }
#team .tm-frame { aspect-ratio: 4 / 5; overflow: hidden; background: var(--color-3); }
#team .tm-frame img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 22%; }
#team .tm-person:nth-child(4n + 1) .tm-frame { border-radius: 999px 999px var(--radius-3) var(--radius-3); }
#team .tm-person:nth-child(4n + 2) .tm-frame { border-radius: var(--radius-1) var(--radius-4) var(--radius-1) var(--radius-1); }
#team .tm-person:nth-child(4n + 3) .tm-frame { border-radius: 50% 50% 50% 50% / 40% 40% 40% 40%; }
#team .tm-person:nth-child(4n + 4) .tm-frame { border-radius: var(--radius-4) var(--radius-1) var(--radius-1) var(--radius-1); }
#team .tm-name { display: flex; align-items: center; gap: 10px; }
#team .tm-name span { --m-shape-size: 16px; }
#team .tm-person:nth-child(4n + 1) .tm-name span { background: var(--color-5); }
#team .tm-person:nth-child(4n + 2) .tm-name span { background: var(--color-6); }
#team .tm-person:nth-child(4n + 3) .tm-name span { background: var(--color-9); }
#team .tm-person:nth-child(4n + 4) .tm-name span { background: var(--color-7); }
#team .tm-person .m-text { font-size: 16px; }
@media (max-width: 900px) {
  #team .tm-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 14px; }
  #team .tm-person:nth-child(2n) { margin-top: 48px; }
  #team .tm-person .m-text { font-size: 15px; }
}
}
