/* Das Team (Kopf, 28.10.): CSS der abgenommenen Seite, unter .team eingebaut von web/team.py. */
:root {
    --holz-tief: #1d120a;
    --holz: #2e1d10;
    --holz-hell: #4a2f19;
    --gold: #f0bf55;
    --gold-hell: #ffe39a;
    --pergament: #fbefd5;
    --pergament-matt: #d8c3a0;
    --himmel: #8fb6ff;
    --linie: rgba(240, 191, 85, 0.45);
    --karte: rgba(74, 47, 25, 0.55);
    --karte-rand: rgba(240, 191, 85, 0.28);
    color-scheme: dark;
}
.team a { color: inherit; text-decoration: none; }
.team {
    max-width: 1120px;
    margin: 0 auto;
    padding-block: 20px 64px;
    padding-left: max(16px, env(safe-area-inset-left, 0px));
    padding-right: max(16px, env(safe-area-inset-right, 0px));
}
.team h1, .team h2, .team h3 { font-family: "Fredoka", "Nunito", system-ui, sans-serif; font-weight: 600; text-wrap: balance; margin: 0; }
.team h1 { font-size: clamp(2rem, 5vw, 3rem); color: var(--gold-hell); }
.team .vorspann { max-width: 62ch; color: var(--pergament-matt); margin: 10px 0 14px; }
.team .selbst {
    max-width: 66ch; margin: 0 0 40px; padding: 12px 16px; border: 1px dashed rgba(143,182,255,0.5);
    border-radius: 12px; color: var(--pergament-matt); font-size: 0.95rem;
}
.team .selbst b { color: var(--himmel); }
/* runde Bilder */
.team .rund { border-radius: 50%; overflow: hidden; background: var(--holz-hell); flex: none; display: block; }
.team .rund img { width: 100%; height: 100%; display: block; }
.team .rund.leer { display: grid; place-items: center; border: 2px dashed var(--karte-rand); background: transparent;
    color: var(--pergament-matt); font-size: 0.7rem; text-align: center; line-height: 1.2;
}
/* Stufen des Organigramms */
.team .ebene { display: flex; justify-content: center; gap: 20px; flex-wrap: wrap; position: relative; }
.team .verbinder { width: 2px; height: 34px; background: var(--linie); margin: 0 auto; }
.team .karte {
    background: var(--karte); border: 1px solid var(--karte-rand); border-radius: 16px;
    padding: 16px 18px; min-width: 0;
}
.team .person { width: min(100%, 340px); text-align: center; border-color: var(--gold); box-shadow: 0 0 40px rgba(240,191,85,0.12); }
.team .kuerzel {
    width: 54px; height: 54px; border-radius: 50%; display: grid; place-items: center; margin: 0 auto 8px;
    font-family: "Fredoka", system-ui, sans-serif; font-size: 1.35rem; color: var(--holz-tief); background: var(--gold);
}
.team .rolle { font-size: 0.78rem; letter-spacing: 0.09em; text-transform: uppercase; color: var(--gold); margin: 2px 0 6px; }
.team .karte p { margin: 0; color: var(--pergament-matt); font-size: 0.95rem; }
.team .ki-zeichen {
    display: inline-block; font-size: 0.68rem; letter-spacing: 0.06em; text-transform: uppercase;
    color: var(--himmel); border: 1px solid rgba(143,182,255,0.5); border-radius: 999px; padding: 0 7px; margin-left: 6px;
    vertical-align: 2px;
}
.team .spitze { align-items: stretch; }
.team .kopf { width: min(100%, 420px); text-align: center; }
.team .kopf .rund, .team .stab .rund { width: 76px; height: 76px; margin: 0 auto 8px; }
.team .stab { display: flex; justify-content: center; margin-top: 14px; }
.team .stab .karte { width: min(100%, 340px); border-style: dashed; text-align: center; }
/* Bereiche */
.team .querbalken { height: 2px; background: var(--linie); margin: 0 12.5%; }
.team .bereiche { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.team .bereich { display: flex; flex-direction: column; align-items: stretch; }
.team .bereich::before { content: ""; width: 2px; height: 22px; background: var(--linie); margin: 0 auto; }
.team .bereich > .karte { flex: 1; display: flex; flex-direction: column; gap: 12px; }
.team .bereich h2 { font-size: 1.2rem; color: var(--gold-hell); text-align: center; }
.team .mitglied { border-top: 1px solid var(--karte-rand); padding-top: 10px; display: flex; gap: 10px; align-items: flex-start; }
.team .mitglied .rund { width: 46px; height: 46px; }
.team .mitglied > div { min-width: 0; }
.team .mitglied h3 { font-size: 1.02rem; color: var(--pergament); }
.team .mitglied.leitet h3::after { content: " · leitet"; font-family: "Nunito", system-ui, sans-serif; font-size: 0.75rem; color: var(--gold); letter-spacing: 0.04em; }
.team a.mitglied:hover h3, .team a.ziel:hover h3 { color: var(--gold-hell); }
.team .fachlich { font-size: 0.8rem; color: var(--himmel); text-align: center; border: 1px dashed rgba(143,182,255,0.45); border-radius: 10px; padding: 4px 8px; }
.team .aussen { margin-top: 40px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; }
.team .aussen .karte { border-style: dashed; }
.team .aussen h3 { font-size: 1.05rem; margin-bottom: 4px; }
.team .aussen .zeile { display: flex; gap: 12px; align-items: flex-start; }
.team .aussen .rund { width: 56px; height: 56px; }
/* Steckbriefe */
.team .steck-titel { margin: 64px 0 6px; font-size: clamp(1.5rem, 3.4vw, 2.1rem); color: var(--gold-hell); }
.team .steck-vorspann { color: var(--pergament-matt); margin: 0 0 24px; max-width: 62ch; }
.team .steckbriefe { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); gap: 18px; }
.team .steckbrief { display: flex; flex-direction: column; gap: 10px; scroll-margin-top: 20px; }
.team .steckbrief .oben { display: flex; gap: 14px; align-items: center; }
.team .steckbrief .rund { width: 112px; height: 112px; box-shadow: 0 0 0 3px var(--karte-rand); }
.team .steckbrief h3 { font-size: 1.25rem; color: var(--gold-hell); }
.team .steckbrief .stil { font-size: 0.8rem; color: var(--himmel); margin-top: 2px; }
.team .steckbrief .feld { font-size: 0.72rem; letter-spacing: 0.09em; text-transform: uppercase; color: var(--gold); margin-bottom: 2px; }
.team .steckbrief blockquote { margin: 0; padding-left: 12px; border-left: 2px solid var(--karte-rand); color: var(--pergament); font-size: 0.93rem; }
.team .steckbrief:target { border-color: var(--gold); box-shadow: 0 0 30px rgba(240,191,85,0.2); }
.team .notiz {
    margin-top: 44px; padding: 16px 18px; border-left: 3px solid var(--himmel);
    background: rgba(143,182,255,0.07); border-radius: 0 12px 12px 0; max-width: 72ch;
    color: var(--pergament-matt); font-size: 0.92rem;
}
.team .notiz b { color: var(--pergament); }
.team .notiz ol { margin: 8px 0 0; padding-left: 1.3em; }
.team .himmel { margin: 4px 0 2px; }
.team .himmel svg { display: block; width: 100%; height: auto; max-height: 196px; }
.team .stern { fill: var(--gold-hell); opacity: 0.35; animation: funkeln 4.5s ease-in-out infinite; }
@keyframes funkeln { 0%, 100% { opacity: 0.2; } 50% { opacity: 0.95; } }
.team .funke { transform-box: view-box; transform-origin: 566px 78px; animation: puls 3.2s ease-in-out infinite; }
@keyframes puls { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.18); } }
.team .verbinder, .team .querbalken, .team .bereich::before { box-shadow: 0 0 10px rgba(240, 191, 85, 0.35); }
.team a.karte, .team a.mitglied { transition: transform 0.18s ease, box-shadow 0.18s ease; }
.team a.karte:hover { transform: translateY(-2px); box-shadow: 0 6px 24px rgba(0, 0, 0, 0.35), 0 0 24px rgba(240, 191, 85, 0.12); }
.team a.mitglied:hover .rund { box-shadow: 0 0 0 2px var(--gold); }
.team .fuss { margin-top: 56px; padding-top: 16px; border-top: 1px solid var(--karte-rand); display: flex; flex-wrap: wrap; gap: 6px 24px; justify-content: space-between; color: var(--pergament-matt); font-size: 0.88rem; }
@media (prefers-reduced-motion: reduce) {
  .team .stern, .team .funke { animation: none; }
  .team a.karte, .team a.mitglied { transition: none; }
}
@media (max-width: 860px) {
  .team .bereiche { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .team .querbalken { margin: 0 25%; }
}
@media (max-width: 560px) {
  .team .bereiche { grid-template-columns: minmax(0, 1fr); }
  .team .querbalken { display: none; }
  .team .aussen { grid-template-columns: minmax(0, 1fr); }
  .team .steckbrief .rund { width: 92px; height: 92px; }
}
/* Einbau: Breite und Schrift der Seite, sonst gibt stil.css main schmal und mittig vor. */
.team.rahmen { width: 100%; text-align: left; font-size: 1.0625rem; line-height: 1.55; }
.team .karte p, .team .steckbrief p { margin: 0; }
.team .hinweis-sprache { margin: 0 0 18px; color: var(--pergament-matt); font-size: 0.95rem; }
/* Funkeln der Sterne versetzt, wie in der Vorlage (dort als style-Attribut). */
.team .himmel .stern:nth-of-type(1) { animation-delay: 2.6s; }
.team .himmel .stern:nth-of-type(2) { animation-delay: 1.5s; }
.team .himmel .stern:nth-of-type(3) { animation-delay: 0.1s; }
.team .himmel .stern:nth-of-type(4) { animation-delay: 1.0s; }
.team .himmel .stern:nth-of-type(5) { animation-delay: 3.8s; }
.team .himmel .stern:nth-of-type(6) { animation-delay: 0.2s; }
.team .himmel .stern:nth-of-type(7) { animation-delay: 1.2s; }
.team .himmel .stern:nth-of-type(8) { animation-delay: 2.3s; }
.team .himmel .stern:nth-of-type(9) { animation-delay: 0.4s; }
.team .himmel .stern:nth-of-type(10) { animation-delay: 2.5s; }
.team .himmel .stern:nth-of-type(11) { animation-delay: 3.1s; }
.team .himmel .stern:nth-of-type(12) { animation-delay: 1.2s; }
.team .himmel .stern:nth-of-type(13) { animation-delay: 2.3s; }
.team .himmel .stern:nth-of-type(14) { animation-delay: 2.4s; }
.team .himmel .stern:nth-of-type(15) { animation-delay: 0.7s; }
.team .himmel .stern:nth-of-type(16) { animation-delay: 1.7s; }
.team .himmel .stern:nth-of-type(17) { animation-delay: 1.4s; }
.team .himmel .stern:nth-of-type(18) { animation-delay: 0.3s; }
.team .himmel .stern:nth-of-type(19) { animation-delay: 2.8s; }
.team .himmel .stern:nth-of-type(20) { animation-delay: 2.6s; }
.team .himmel .stern:nth-of-type(21) { animation-delay: 2.9s; }
.team .himmel .stern:nth-of-type(22) { animation-delay: 3.8s; }
.team .himmel .stern:nth-of-type(23) { animation-delay: 2.0s; }
.team .himmel .stern:nth-of-type(24) { animation-delay: 3.0s; }
.team .himmel .stern:nth-of-type(25) { animation-delay: 0.3s; }
.team .himmel .stern:nth-of-type(26) { animation-delay: 3.5s; }
.team .himmel .stern:nth-of-type(27) { animation-delay: 2.8s; }
.team .himmel .stern:nth-of-type(28) { animation-delay: 0.6s; }
.team .himmel .stern:nth-of-type(29) { animation-delay: 2.6s; }
.team .himmel .stern:nth-of-type(30) { animation-delay: 1.1s; }
.team .himmel .stern:nth-of-type(31) { animation-delay: 2.1s; }
.team .himmel .stern:nth-of-type(32) { animation-delay: 1.8s; }
.team .himmel .stern:nth-of-type(33) { animation-delay: 1.6s; }
.team .himmel .stern:nth-of-type(34) { animation-delay: 2.5s; }
.team .himmel .stern:nth-of-type(35) { animation-delay: 3.9s; }
.team .himmel .stern:nth-of-type(36) { animation-delay: 1.4s; }
.team .himmel .stern:nth-of-type(37) { animation-delay: 2.3s; }
.team .himmel .stern:nth-of-type(38) { animation-delay: 2.5s; }
.team .himmel .stern:nth-of-type(39) { animation-delay: 0.6s; }
.team .himmel .stern:nth-of-type(40) { animation-delay: 1.9s; }
.team .himmel .stern:nth-of-type(41) { animation-delay: 1.9s; }
.team .himmel .stern:nth-of-type(42) { animation-delay: 0.4s; }