/* ════════════════════════════════════════════════════════════════
   cultivAIte · Über-uns / Team — geteilte Basis für team-a … team-f
   Scope: body.tm  ·  ergänzt css/style.css (Tokens, Header, Footer, Sektionen)
   Nur transform / opacity / grid-rows animiert. reduced-motion = statisch.
   Bausteine, die alle Varianten teilen:
     · Mission-Auftakt (ersetzt die alte H1 „Wir sind cultivAite")
     · kleinere Portrait-Ausschnitte
     · prominenter, flüssiger „Mehr über"-Link (Grid-Rows-Akkordeon)
     · Founding-Team-Flagge + Netzwerk-Bausteine (erweitertes Team)
   ════════════════════════════════════════════════════════════════ */

body.tm{
  --blue:#0000FE; --ink:#1A1A1A; --paper:#FBFAF9; --paper-pure:#FFFFFF;
  --bone:#EDEAE7; --graphite:#46484B; --silver:#9799A0;
  --yellow:#EFF746; --blue-wash:#ACC1FF;
  --font-serif:'Flecha M', Georgia, serif;
  --font-sans:'Söhne', -apple-system, sans-serif;
  --font-wide:'Söhne Breit','Söhne', sans-serif;
  --font-mono:'Söhne Mono', ui-monospace, monospace;
  --ease:cubic-bezier(.22,.61,.36,1);
  background:var(--paper);
}
.tm-main{color:var(--ink); font-family:var(--font-sans);}
.tm-wrap{max-width:1180px; margin:0 auto; padding:0 28px;}
/* Seitenbreite harmonisieren: die unteren, globalen .container-Sektionen
   auf dieselbe Maßgabe wie .tm-wrap ziehen (sonst wirken die oberen
   Sektionen schmaler als der Rest). */
.tm-main .container{max-width:1180px; padding-left:28px; padding-right:28px;}

/* ── Mission-Auftakt (ersetzt H1) ─────────────────────────────── */
.tm-mission{padding:76px 0 12px;}
.tm-mission__eyebrow{font-family:var(--font-mono); font-size:.7rem; letter-spacing:.22em; text-transform:uppercase; color:var(--silver); margin:0 0 22px;}
.tm-mission__lead{font-family:var(--font-serif); font-weight:400; font-size:clamp(1.9rem,4.6vw,3.4rem); line-height:1.12; letter-spacing:-.015em; margin:0 0 24px; max-width:24ch;}
.tm-mission__lead .nm{background-image:linear-gradient(to top, var(--yellow) 0 24%, transparent 24%);}
.tm-mission__sub{font-size:1.1rem; line-height:1.6; color:var(--graphite); max-width:60ch; margin:0;}

/* ── Founding-Team Flagge ─────────────────────────────────────── */
.tm-flag__meta{font-family:var(--font-mono); font-size:.7rem; letter-spacing:.2em; text-transform:uppercase; color:var(--blue); margin:0 0 10px;}
.tm-flag{font-family:var(--font-wide); font-weight:700; text-transform:uppercase; letter-spacing:.05em; font-size:clamp(1.15rem,2.2vw,1.7rem); color:var(--ink); margin:0;}

/* ── Portrait (kleinerer Ausschnitt als zuvor) ────────────────── */
.tm-photo{width:100%; max-width:150px; aspect-ratio:1/1.22; object-fit:cover; object-position:center top; display:block; background:var(--bone);}
.tm-photo--ph{display:flex; align-items:center; justify-content:center; background:var(--bone);}
.tm-photo--ph span{font-family:var(--font-serif); font-size:3rem; line-height:1; color:var(--blue);}

/* ── Person ───────────────────────────────────────────────────── */
.tm-name{font-family:var(--font-wide); font-weight:700; text-transform:uppercase; font-size:1.05rem; letter-spacing:.03em; margin:0 0 6px;}
.tm-kicker{font-family:var(--font-mono); font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; color:var(--blue); margin:0 0 10px;}
.tm-bio{font-family:var(--font-serif); font-size:1.12rem; line-height:1.45; color:var(--ink); margin:0 0 16px; max-width:34ch;}

/* ── Flüssiger, prominenter „Mehr über"-Link (Grid-Rows-Akkordeon) */
.tm-more{display:inline-flex; align-items:center; gap:10px; background:none; border:0; cursor:pointer; padding:7px 0; font-family:var(--font-mono); font-size:.82rem; letter-spacing:.1em; text-transform:uppercase; color:var(--blue); border-bottom:2px solid var(--blue-wash); transition:border-color .2s var(--ease), gap .2s var(--ease);}
.tm-more:hover{border-color:var(--blue); gap:15px;}
.tm-more__arrow{transition:transform .3s var(--ease);}
.tm-more[aria-expanded="true"] .tm-more__arrow{transform:rotate(90deg);}
.tm-more__panel{display:grid; grid-template-rows:0fr; transition:grid-template-rows .5s var(--ease);}
.tm-more__panel>div{overflow:hidden;}
.tm-more[aria-expanded="true"]+.tm-more__panel{grid-template-rows:1fr;}
.tm-more__inner{padding-top:18px;}
.tm-more__inner h4{font-family:var(--font-wide); font-weight:700; font-size:.78rem; text-transform:uppercase; letter-spacing:.1em; margin:18px 0 8px; color:var(--ink);}
.tm-more__inner p{font-size:1rem; line-height:1.7; color:var(--ink); margin:0 0 12px; max-width:64ch;}
.tm-more__stations{font-size:.9rem !important; line-height:1.85 !important; color:var(--silver) !important;}

/* ── Erweitertes Team / Netzwerk (Bausteine) ──────────────────── */
.tm-net__meta{font-family:var(--font-mono); font-size:.7rem; letter-spacing:.2em; text-transform:uppercase; color:var(--blue); margin:0 0 10px;}
.tm-net__h{font-family:var(--font-serif); font-weight:400; font-size:clamp(1.5rem,3vw,2.3rem); line-height:1.12; letter-spacing:-.01em; margin:0 0 16px;}
.tm-net__text{font-size:1.08rem; line-height:1.6; color:var(--graphite); max-width:58ch; margin:0;}

/* Disziplin-Chips */
.tm-tags{display:flex; flex-wrap:wrap; gap:10px; margin:0; padding:0; list-style:none;}
.tm-tags li{font-family:var(--font-mono); font-size:.78rem; letter-spacing:.04em; color:var(--ink); border:1px solid rgba(26,26,26,.18); padding:7px 13px; background:var(--paper-pure);}

/* Kennzahl */
.tm-stat{display:flex; align-items:baseline; gap:14px;}
.tm-stat__num{font-family:var(--font-serif); font-size:clamp(3rem,8vw,5.5rem); line-height:.9; color:var(--blue);}
.tm-stat__label{font-family:var(--font-mono); font-size:.8rem; letter-spacing:.08em; text-transform:uppercase; color:var(--graphite); max-width:18ch;}

/* Avatar-Cluster: 3 Kern-Punkte gefüllt + Ring kleiner Netzwerk-Punkte */
.tm-cluster{display:flex; flex-wrap:wrap; align-items:center; gap:9px;}
.tm-cluster .dot{display:block; border-radius:50%;}
.tm-cluster .dot--core{width:22px; height:22px; background:var(--blue);}
.tm-cluster .dot--net{width:13px; height:13px; background:var(--blue-wash);}
.tm-cluster .dot--more{font-family:var(--font-mono); font-size:.82rem; color:var(--graphite); margin-left:4px;}

/* ── Reveal-Scaffold (greift via js/team.js; reduced-motion = aus) */
.tm-reveal{opacity:0; transform:translateY(16px); transition:opacity .6s var(--ease), transform .6s var(--ease); transition-delay:calc(var(--i,0)*70ms);}
.tm-reveal.is-in{opacity:1; transform:none;}

@media (prefers-reduced-motion:reduce){
  body.tm .tm-reveal{opacity:1 !important; transform:none !important; transition:none !important;}
  body.tm *{animation:none !important;}
  body.tm .tm-more__panel{transition:none !important;}
}