/* ============================================================================
   U³ — Seite „Team" · Sektions-Styles (5.2 Gründer, 5.3 Beirat, 5.4 Stats)
   Baut auf tokens.css + styles.css + za.css. Nur var(--u3-…).
   ========================================================================== */

/* Gemeinsamer Porträt-Rahmen (natürlich gerahmt, leichter Petrol-Ton) */
.tm-frame { position: relative; overflow: hidden; background: var(--u3-papier); border: 1px solid var(--u3-line); aspect-ratio: 4 / 5; }
.tm-frame img { width: 100%; height: 100%; object-fit: cover; object-position: top center; filter: grayscale(.4); }
.tm-frame__tint { position: absolute; inset: 0; background: rgba(22,62,72,.05); mix-blend-mode: multiply; }
.tm-frame .ph { background-color: var(--u3-papier); }

/* ===========================================================================
   5.2 GRÜNDER — Louis prominent (Porträt + Bio)
   =========================================================================== */
.tm-founder-grid { display: grid; grid-template-columns: 400px 1fr; gap: 60px; align-items: center; }
.tm-founder--right .tm-founder-grid { grid-template-columns: 1fr 400px; }
.tm-founder--right .tm-founder__media { order: 2; }
.tm-founder__name { font-family: var(--u3-font-serif); font-weight: 500; font-size: clamp(28px, 3.6vw, 42px); color: var(--u3-petrol-ink); letter-spacing: -0.4px; }
.tm-founder__role { margin-top: 8px; }
.tm-founder__bio { margin-top: 24px; font-size: clamp(16px, 1.7vw, 18px); line-height: 1.66; color: var(--u3-ink-2); max-width: 58ch; }
.tm-founder__link { margin-top: 26px; }

/* ===========================================================================
   5.3 BEIRAT — Till & Lukas
   =========================================================================== */
.tm-board__head { margin-bottom: 42px; }
.tm-board__title { font-size: clamp(26px, 3.2vw, 38px); margin-top: 14px; }
.tm-board__text { margin-top: 16px; font-size: 17px; line-height: 1.6; color: var(--u3-ink-2); max-width: 60ch; }

/* A · Zwei Karten (Porträt oben, Name/Rolle/Bio darunter) */
.tm-board-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 360px)); gap: 48px; }
.tm-member__cap { margin-top: 20px; }
.tm-member__name { font-family: var(--u3-font-serif); font-weight: 500; font-size: clamp(22px, 2.4vw, 27px); color: var(--u3-petrol-ink); letter-spacing: -0.3px; }
.tm-member__role { margin-top: 5px; }
.tm-member__bio { margin-top: 16px; font-size: 15.5px; line-height: 1.62; color: var(--u3-ink-3); }
.tm-member__link { margin-top: 18px; }

/* B · Zwei Zeilen (Porträt links, Bio rechts) */
.tm-board-rows { display: grid; }
.tm-board-row { display: grid; grid-template-columns: 220px 1fr; gap: 40px; align-items: start; padding: 36px 0; border-top: 1px solid var(--u3-line); }
.tm-board-row:first-child { border-top: none; padding-top: 4px; }
.tm-board-row .tm-frame { aspect-ratio: 1 / 1; }

/* ===========================================================================
   5.4 VERTRAUEN IN ZAHLEN — drei Stats
   =========================================================================== */
/* A · Hairline-Raster auf Kalk (reuse .stats__grid/.stat aus styles.css) */

/* B · Petrol-Band (Höhepunkt) */
.tm-statsband { position: relative; overflow: hidden; background: var(--u3-petrol); }
.tm-statsband__glow { position: absolute; inset: 0; pointer-events: none; background: radial-gradient(125% 110% at 80% -18%, rgba(74,142,155,.45) 0%, rgba(74,142,155,0) 52%); }
.tm-statsband > .u3-container { position: relative; z-index: 1; }
.tm-statsband__head { margin-bottom: 36px; }
.tm-statsband-grid { display: grid; grid-template-columns: repeat(3, 1fr); }
.tm-statcell { padding: 34px 32px 4px 0; border-left: 1px solid var(--u3-line-dark); padding-left: 32px; }
.tm-statcell:first-child { border-left: none; padding-left: 0; }
.tm-statcell__num { font-family: var(--u3-font-serif); font-weight: 600; font-size: clamp(52px, 7vw, 88px); line-height: .92; color: var(--u3-on-petrol-head); letter-spacing: -1px; }
.tm-statcell__label { display: block; margin-top: 14px; color: var(--u3-on-petrol-label); max-width: 200px; }

/* ===========================================================================
   RESPONSIVE
   =========================================================================== */
@media (max-width: 860px) {
  .tm-founder-grid, .tm-founder--right .tm-founder-grid { grid-template-columns: 1fr; gap: 32px; }
  .tm-founder--right .tm-founder__media { order: 0; }
  .tm-founder__media { max-width: 360px; }
  .tm-board-cards { grid-template-columns: 1fr 1fr; gap: 28px; }
}
@media (max-width: 640px) {
  .tm-board-cards { grid-template-columns: 1fr; gap: 32px; max-width: 380px; }
  .tm-board-row { grid-template-columns: 120px 1fr; gap: 24px; }
  .tm-statsband-grid { grid-template-columns: 1fr; }
  .tm-statcell { border-left: none; padding-left: 0; padding-top: 28px; border-top: 1px solid var(--u3-line-dark); }
  .tm-statcell:first-child { border-top: none; padding-top: 0; }
}
@media (max-width: 480px) {
  /* Beirat: Foto nach oben stapeln, kein Leerraum neben langer Bio */
  .tm-board-row { grid-template-columns: 1fr; gap: 16px; }
  .tm-board-row .tm-frame { width: 128px; }
}