/* =========================================================
   Indus Climate Fund — Team (page-specific)
   Relies on styles.css for tokens, header, footer, buttons,
   eyebrow/section-title, reveal, currents, river-thread,
   page-hero, cta-band.
   ========================================================= */

.team { background: var(--paper); }

/* ---------- monogram avatars (used until real headshots exist) ---------- */
.monogram {
  display: grid; place-items: center;
  width: clamp(58px, 8vw, 76px); height: clamp(58px, 8vw, 76px);
  border-radius: 50%;
  font-family: var(--font-display); font-weight: 500;
  font-size: clamp(1.4rem, 3vw, 1.9rem); letter-spacing: 0.01em;
  color: var(--paper); background: var(--river);
  flex-shrink: 0;
}
.monogram--river { background: var(--river); }
.monogram--silt { background: var(--silt); }
.monogram--leaf { background: var(--leaf); }

/* ---------- shared name / role ---------- */
.member__name {
  font-family: var(--font-display); font-weight: 500;
  font-size: clamp(1.3rem, 2.4vw, 1.7rem); line-height: 1.1;
  letter-spacing: -0.01em; color: var(--ink); margin: 0 0 0.35rem;
}
.member__role {
  font-family: var(--font-mono); font-size: 0.74rem; letter-spacing: 0.12em;
  text-transform: uppercase; color: var(--river); margin: 0;
}

/* ---------- featured (founder) ---------- */
.team-featured {
  display: grid; grid-template-columns: 240px 1fr; gap: clamp(1.6rem, 4vw, 3.2rem);
  background: var(--paper); border: 1px solid var(--stone); border-radius: var(--radius);
  padding: clamp(1.8rem, 4vw, 3rem);
  margin-top: clamp(2rem, 4vw, 3rem);
  align-items: start;
  transition: box-shadow 0.5s var(--ease);
}
.team-featured:hover { box-shadow: 0 24px 48px -30px rgba(7,50,44,0.4); }
.team-featured__id { display: flex; flex-direction: column; gap: 1.1rem; }
.team-featured__id .member__role { color: var(--silt); }
.team-featured__bio p { color: var(--ink-soft); margin: 0 0 1.1rem; max-width: 62ch; }
.team-featured__bio p:last-child { margin-bottom: 0; }

/* ---------- grid members ---------- */
.team-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; margin-top: 1.25rem; }
.member {
  background: var(--paper); border: 1px solid var(--stone); border-radius: var(--radius);
  padding: clamp(1.7rem, 3vw, 2.1rem); position: relative;
  transition: transform 0.5s var(--ease), box-shadow 0.5s var(--ease), border-color 0.5s var(--ease);
}
.member:hover { transform: translateY(-6px); box-shadow: 0 24px 44px -28px rgba(7,50,44,0.45); border-color: var(--river); }
.member .monogram { margin-bottom: 1.2rem; }
.member .member__name { margin-bottom: 0.35rem; }
.member .member__role { margin-bottom: 1.1rem; }
.member__bio { color: var(--ink-soft); font-size: 0.95rem; margin: 0 0 0.9rem; }
.member__bio:last-child { margin-bottom: 0; }

/* note under the closing CTA band */
.cta-band__note {
  font-family: var(--font-mono); font-size: 0.74rem; letter-spacing: 0.08em;
  color: var(--paper-soft); margin: 0.5rem 0 0;
}

/* ---------- responsive ---------- */
@media (max-width: 920px) {
  .team-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 760px) {
  .team-featured { grid-template-columns: 1fr; gap: 1.4rem; }
  .team-featured__id { flex-direction: row; align-items: center; gap: 1.1rem; }
}
@media (max-width: 560px) {
  .team-grid { grid-template-columns: 1fr; }
}
