/* vntr.vc team — VERSION 2 only (team-v2.html). Loaded after style.css, hero.css, home.css, home-v2.css and
   pages-community.css; body carries .pc .tv. Reuses the homepage / membership-v2 components (h-row, rm-grid, pc-card pc-wide,
   pc-faces-grid, pc-anchors, pc-close, the chapter modal from chapters.js) and adds only what this page needs.
   Rules: palette tokens only; no eyebrows; sentence case; Taviraj for headings and names, Poppins for the rest. */

/* ——— rhythm: the homepage's one section padding (half the gap on each side) ——— */
.tv section[class*="tone-"]:not(.hl) { padding: calc(var(--section-y) / 2) 0; }
.tv section[id] { scroll-margin-top: 96px; }

/* ——— 1 · hero: one beige block — statement, in-page anchors, the faces ——— */
.tv .tv-hero { padding: clamp(48px, 5.5vw, 88px) 0 calc(var(--section-y) / 2); }
.tv .tv-hero h1 { font: 300 clamp(40px, 4.6vw, 68px)/.98 var(--serif); letter-spacing: -.04em; margin: 0 0 20px; max-width: 11em; text-wrap: balance; }
.tv .tv-hero .sub { margin: 0 0 28px; max-width: 34em; }
.tv .tv-hero .pc-anchors a { border-color: rgba(29, 29, 27, .18); color: var(--ink); background: #fff; }
.tv .tv-hero .pc-anchors a:hover { background: var(--royal); border-color: var(--royal); color: #fff; }
.tv .tv-hero .pc-faces { margin-top: 32px; }
.tv .tv-hero .pc-faces .hl-stack img { border-color: var(--beige); }

/* ——— 2 · the team: six portrait cards (rm-grid from the v2 homepage) + a LinkedIn icon under the role ——— */
.tv .rm-grid { gap: 28px 16px; }
.tv .rm-card > span { text-wrap: pretty; }
.tm-in { display: inline-grid; place-items: center; width: 36px; height: 36px; margin-top: 10px; border-radius: 50%; color: var(--ink); background: rgba(29, 29, 27, .06); transition: background-color .2s ease, color .2s ease; }
.tm-in:hover { background: var(--royal); color: #fff; }
.tv .rm-card .tm-in { align-self: flex-start; }

/* ——— 3 · deals team: two wide cards (pc-card pc-wide) on beige; the LinkedIn icon sits in the text column ——— */
.tv .pc-wide .tm-in { margin-top: 12px; }
.tv .pc-wide span { text-wrap: pretty; }
.tv #transactions-team .disclaimer { margin-top: 20px; max-width: none; }

/* ——— 4 · chapter leads by region: region title, then compact lead cards; each card opens the chapter card ——— */
.tm-regions { display: grid; gap: clamp(28px, 3vw, 40px); }
.tm-region { display: grid; gap: 16px; padding-top: clamp(20px, 2.2vw, 28px); border-top: 1px solid rgba(29, 29, 27, .12); }
.tm-region h3 { margin: 0; font: 400 clamp(21px, 1.7vw, 24px)/1.2 var(--serif); letter-spacing: -.01em; color: var(--ink); }
@media (min-width: 900px) {
  .tm-region { grid-template-columns: 200px minmax(0, 1fr); gap: 16px 32px; align-items: start; }
  .tm-region h3 { padding-top: 10px; }
}
.tm-leads { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 560px) { .tm-leads { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .tm-leads { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.tm-lead { display: flex; align-items: center; gap: 14px; min-width: 0; padding: 12px 16px 12px 12px; border-radius: var(--r-md); background: var(--beige); color: var(--ink); text-decoration: none; transition: background-color .2s ease; }
.tm-lead:hover { background: #ECE3DB; }
.tm-lead img { flex: none; width: 56px; height: 56px; border-radius: 50%; object-fit: cover; object-position: 50% 30%; background: #fff; }
.tm-lead > div { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.tm-lead b { font: 400 18px/1.2 var(--serif); letter-spacing: -.01em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tm-lead span { font: 400 13px/1.4 var(--sans); color: rgba(29, 29, 27, .64); }

/* ——— 5 · venture partners: five round faces (pc-faces-grid), LinkedIn icon under the role ——— */
.tv .pc-faces-grid.five { gap: 28px 16px; }
@media (min-width: 900px) { .tv .pc-faces-grid.five { grid-template-columns: repeat(5, minmax(0, 1fr)); } }   /* five across from tablet up, so no one is orphaned on a second row */
.tv .pc-face img { width: 112px; height: 112px; }
.tv .pc-face b { font-size: 20px; }
.tv .pc-face .tm-in { margin-top: 10px; }

/* ——— 6 · help build VNTR: the closing card (pc-close) on beige, not blue — the v2 footer below it is already blue ——— */
.tv .pc-close { background: var(--beige); color: var(--ink); padding: clamp(36px, 5vw, 72px) clamp(24px, 4vw, 56px); }
.tv section .pc-close h2 { color: var(--ink); margin-bottom: 14px !important; }
.tv .pc-close .sub { color: var(--mute); margin: 0 auto 28px; max-width: 34em; }
.tv .pc-close a:focus-visible { outline-color: var(--royal); }

/* ——— chapter card (chapters.js): on this page the "no lead" link goes to membership-v2 ——— */
.tv .ch-modal .ch-nolead .link { color: var(--royal); }

@media (prefers-reduced-motion: reduce) { .tm-in, .tm-lead { transition: none; } }

/* team member without a photo yet: initials on the photo tone */
.tm-noph { display: grid; place-items: center; }
.tm-noph span { font: 300 clamp(40px, 4vw, 64px)/1 var(--serif); letter-spacing: -.02em; color: rgba(29, 29, 27, .35); }
/* seven people in the core team: one row on desktop */
@media (min-width: 1100px) { #leadership .rm-grid { grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 24px 14px; } }

/* tones alternate after the deals team left (founder, 26.10): chapter leads on beige → white cards; venture partners on white
   → the default beige cards, same as the leads used to be. A venture-partner card opens LinkedIn. */
#chapter-leads .tm-lead, #venture-partners .tm-lead { background: #fff; }
#chapter-leads .tm-lead:hover, #venture-partners .tm-lead:hover { background: #FBF8F5; }

/* venture partners continue the chapter-leads beige, divided by a line instead of a colour change (founder, 26.10) */
#chapter-leads { padding-bottom: clamp(28px, 3vw, 40px); }
#venture-partners { padding-top: 0; }
#venture-partners > .wrap { border-top: 1px solid rgba(29, 29, 27, .12); padding-top: clamp(40px, 4.4vw, 64px); }
/* founder, 26.10: tighter gap under the heading, the same air below the cards as above the heading */
#venture-partners .h-row { margin-bottom: clamp(20px, 2vw, 28px); }
#venture-partners { padding-bottom: clamp(40px, 4.4vw, 64px); }