/* team.html page styles. Owned by wave B (interiors-plan.md); loaded after
   tokens.css, site.css and interior.css on team.html only. Shared selectors
   (chrome, .sheet, .canvas-wrap, .int-*, .contact) are wave A's: never restyle
   them here; file a request to the main session instead.
   Spec: v2-specs/interiors-spec-team.md */

/* ---- sheet 1: hanoverendo-int/04 CV card (the sheet is the paper) ---- */
.tm-split {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 523px));   /* 523 / 523, centre-packed */
  justify-content: center;
}
.tm-portrait {
  margin: 0; min-width: 0;
  display: flex; align-items: center; justify-content: center;
}
.tm-portrait img {
  display: block; width: 380px; max-width: 100%; height: auto;   /* honest cap, delta T2 */
}
.tm-bio { min-width: 0; align-self: center; }   /* centred against the portrait: no slab under a short bio */
.tm-nowrap { white-space: nowrap; }
.tm-name {
  font-family: var(--font-display); font-weight: 500;
  font-size: 39.06px; line-height: 46px; color: var(--teal-deep);
  text-align: center; margin: 0 0 16px;
}
.tm-bio p, .tm-cont {
  font-size: 20px; line-height: 28px; color: var(--body-ink); text-align: left;
}
.tm-bio p + p { margin-top: 14px; }
.tm-cont { max-width: 1046px; margin-left: auto; margin-right: auto; }
.tm-assoc-h {
  font-family: var(--font-display); font-weight: 500;
  font-size: 28px; line-height: 1.2; color: var(--teal-deep);
  text-align: center; margin: 48px 0 0;
}
.tm-creds {
  list-style: none; margin: 20px 0 0; padding: 0;
  display: flex; flex-flow: row wrap; justify-content: center;
}
.tm-creds li {
  width: 254px; min-width: 0;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center; padding: 18px 12px;
  border-top: 1px solid var(--hairline); border-bottom: 1px solid var(--hairline);
}
.tm-cred-k { font-size: 15px; line-height: 20px; color: var(--grey-structural); }
.tm-cred-v {
  font-family: var(--font-display); font-weight: 400;
  font-size: 22px; line-height: 28px; color: var(--teal-deep); margin-top: 4px;
}

/* ---- sheet 2: real-team photo band ---- */
.tm-team .int-h2, .tm-team-lede { text-align: center; }
.tm-team-lede { font-size: 16px; line-height: 27.2px; margin-top: 14px; }
.tm-photos { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.tm-photos img {
  display: block; width: 100%; height: auto; min-width: 0;
  aspect-ratio: 3 / 2; object-fit: cover;
  border-radius: var(--radius-sheet); box-shadow: var(--shadow-card);
}

/* ---- tablet ---- */
@media (max-width: 900px) {
  .tm-split { grid-template-columns: minmax(0, 1fr); row-gap: 28px; }
  .tm-name { font-size: 34px; line-height: 1.2; }
  .tm-photos { grid-template-columns: minmax(0, 1fr); }
}

/* ---- phone ---- */
@media (max-width: 600px) {
  .tm-portrait img { width: 310px; }
  .tm-name { font-size: 30px; }
  .tm-bio p, .tm-cont { font-size: 18px; line-height: 25.2px; }
  .tm-assoc-h { font-size: 24px; margin-top: 32px; }
  .tm-creds { flex-direction: column; align-items: center; }
  .tm-creds li { width: 100%; max-width: 254px; }
  .tm-creds li + li { border-top: 0; }
  .tm-photos { gap: 16px; margin: 0 -12px; }     /* bleeds to the sheet edges */
  .tm-photos img { border-radius: 0; }
}
