/* ================= Team ================= */

  .members { list-style: none; display: grid; grid-template-columns: minmax(0, 1fr); gap: 3rem 2.5rem; }
  @media (min-width: 760px) { .members { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
  .member { display: flex; flex-direction: column; gap: 0.75rem; }
  /* the photo, round and toned (site.css .duo), beside the name on a phone */
  .member .duo { width: 9.5rem; box-shadow: 0 0 0 4px var(--paper), 0 0 0 5px var(--rule); margin: 0 0 0.6rem 5px; }
  @media (max-width: 759px) {
    .member { display: grid; grid-template-columns: 6rem minmax(0, 1fr); column-gap: 1.25rem; row-gap: 0.5rem; align-items: center; }
    .member .duo { width: 6rem; grid-row: span 2; margin: 5px; }
    .member > p:last-child { grid-column: 1 / -1; }
  }
  .member h2 { font-weight: 800; font-size: 1.6rem; letter-spacing: -0.025em; line-height: 1.1; }
  .member-role { display: flex; flex-wrap: wrap; align-items: center; gap: 0.35rem 0.6rem; font-size: 0.9rem; font-weight: 600; color: var(--muted); }
  .member > p:last-child { color: var(--ink-soft); }

  .proof { list-style: none; display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; border-top: 1px solid var(--ink); }
  @media (min-width: 900px) { .proof { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2.5rem; border-top: 0; } }
  .proof li { padding: 1.5rem 0; border-bottom: 1px solid var(--rule); display: flex; flex-direction: column; gap: 0.75rem; }
  @media (min-width: 900px) { .proof li { border-top: 1px solid var(--ink); border-bottom: 0; } }
  .proof h3 { font-weight: 700; font-size: 1.25rem; letter-spacing: -0.015em; }
  .proof p { color: var(--ink-soft); }