
/* Seitenhintergrund hell setzen. Das Elementor-Kit faerbt den body dunkel (#020B1A);
   das seitenspezifische CSS kommt erst spaet im HTML, wodurch die Seite bis dahin
   dunkel rendert. Dieses CSS wird inline und frueh ausgeliefert und verhindert das. */
body.page-id-1396, body.page-id-1396 .site-main{background-color:#FFFFFF}
/* Hero behaelt den dunklen Grund - ebenfalls inline, damit er nicht kurz hell aufblitzt */
#ps-hero{background-color:#020B1A}
.ps-hub-formate{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:22px}
.ps-hub-format{background:#fff;border:1px solid #E4E8EE;border-radius:12px;padding:24px 22px;
 transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}
.ps-hub-format:hover{transform:translateY(-4px);border-color:var(--akzent);box-shadow:0 12px 28px rgba(8,21,41,.10)}
.ps-hub-format-strich{display:block;width:40px;height:4px;border-radius:2px;background:var(--akzent);margin-bottom:15px}
.ps-hub-format-titel{font-size:1.1rem!important;font-weight:700!important;color:#1A1A1A!important;margin:0 0 7px!important;line-height:1.3!important}
.ps-hub-format-text{color:#54595F;font-size:.94rem;line-height:1.58;margin:0}

/* Rubriken – kompakt: Name, Pointe, optionales Beispiel */
.ps-hub-rubriken{display:grid;grid-template-columns:repeat(auto-fill,minmax(268px,1fr));gap:18px}
.ps-hub-rubrik{background:#fff;border:1px solid #E4E8EE;border-radius:10px;padding:20px 20px 18px;
 border-left:3px solid #1E87FF;transition:transform .22s ease,box-shadow .22s ease}
.ps-hub-rubrik:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(8,21,41,.10)}
.ps-hub-rubrik-titel{font-size:1rem!important;font-weight:700!important;color:#1A1A1A!important;margin:0 0 7px!important;line-height:1.3!important}
.ps-hub-rubrik-pointe{color:#54595F;font-size:.92rem;line-height:1.5;margin:0}
.ps-hub-rubrik-beispiel{color:#7A7A7A;font-size:.86rem;line-height:1.45;margin:9px 0 0;padding-top:9px;
 border-top:1px dashed #E4E8EE;font-style:italic}

/* Ensemble – Character Cards mit Buehne fuer die spaeteren Puppengrafiken */
.ps-ensemble{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.ps-figur{background:#fff;border:1px solid #E4E8EE;border-radius:14px;overflow:hidden;
 transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease}
.ps-figur:hover{transform:translateY(-5px);border-color:var(--akzent);box-shadow:0 18px 38px rgba(8,21,41,.13)}
.ps-figur[open]{border-color:var(--akzent);box-shadow:0 18px 38px rgba(8,21,41,.13)}
.ps-figur-kopf{list-style:none;cursor:pointer;display:block;position:relative;padding:0 0 20px}
.ps-figur-kopf::-webkit-details-marker{display:none}
.ps-figur-kopf:focus-visible{outline:3px solid var(--akzent);outline-offset:-3px}

/* Fachbereich */
.ps-figur-bereich{position:absolute;top:14px;left:14px;z-index:2;font-size:.68rem;font-weight:600;
 letter-spacing:.05em;text-transform:uppercase;color:#5C6B7E;background:rgba(255,255,255,.92);
 border:1px solid #E4E8EE;border-radius:999px;padding:4px 10px}

/* Buehne: fester Rahmen, Figur wird eingepasst statt beschnitten */
.ps-figur-buehne{display:flex;align-items:flex-end;justify-content:center;height:250px;
 background:linear-gradient(180deg,#F7F9FC 0%,#EDF1F7 100%);position:relative;overflow:hidden}
.ps-figur-buehne:after{content:"";position:absolute;inset:0;
 background-image:linear-gradient(rgba(30,135,255,.05) 1px,transparent 1px),
 linear-gradient(90deg,rgba(30,135,255,.05) 1px,transparent 1px);background-size:22px 22px}
.ps-figur-bild{position:relative;z-index:1;max-width:100%;max-height:100%;width:auto;height:auto;
 object-fit:contain;object-position:bottom center;transition:transform .3s ease}
.ps-figur:hover .ps-figur-bild{transform:translateY(-6px) scale(1.02)}
/* Platzhalter, bis die Puppen vorliegen */
.ps-figur-platzhalter{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;
 width:96px;height:96px;border-radius:50%;background:var(--akzent);margin-bottom:56px;
 transition:transform .3s ease}
.ps-figur:hover .ps-figur-platzhalter{transform:translateY(-6px)}
.ps-figur-initialen{color:#fff;font-weight:700;font-size:1.85rem;letter-spacing:.02em}

.ps-figur-daten{display:block;padding:18px 20px 0}
.ps-figur-name{display:block;font-size:1.13rem;font-weight:700;color:#1A1A1A;line-height:1.28}
.ps-figur-rolle{display:block;color:#6B7A8D;font-size:.86rem;line-height:1.45;margin-top:3px}
.ps-figur-alter{display:block;color:#9AA8B8;font-size:.79rem;margin-top:4px}

/* Zitat – deutlich hervorgehoben */
.ps-figur-zitat{display:block;margin:14px 20px 0;padding:12px 15px;background:#F5F8FC;
 border-left:3px solid var(--akzent);border-radius:0 8px 8px 0;color:#1A1A1A;
 font-size:1rem;font-weight:600;line-height:1.42}

.ps-figur-mehr{display:flex;align-items:center;gap:7px;margin:14px 20px 0;color:var(--akzent);
 font-size:.85rem;font-weight:600;opacity:.75;transition:opacity .22s ease}
.ps-figur:hover .ps-figur-mehr{opacity:1}
.ps-figur-pfeil{width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;
 transform:rotate(45deg);transition:transform .25s ease;margin-top:-3px}
.ps-figur[open] .ps-figur-pfeil{transform:rotate(-135deg);margin-top:2px}
.ps-figur[open] .ps-figur-mehr-text:after{content:" schließen"}
.ps-figur[open] .ps-figur-mehr-text{font-size:0}
.ps-figur[open] .ps-figur-mehr-text:after{font-size:.85rem}

/* Detailbereich */
.ps-figur-detail{padding:4px 20px 22px;border-top:1px solid #F0F3F7;margin:16px 20px 0;padding-left:0;padding-right:0}
.ps-figur-text{color:#54595F;font-size:.93rem;line-height:1.62;margin:14px 0 0}
.ps-figur-eigenart{color:#6B7A8D;font-size:.9rem;line-height:1.55;margin:10px 0 0;font-style:italic}
.ps-figur-saetze{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-direction:column;gap:5px}
.ps-figur-saetze li{color:#6B7A8D;font-size:.86rem;line-height:1.45;padding-left:14px;position:relative}
.ps-figur-saetze li:before{content:"›";position:absolute;left:0;color:var(--akzent);font-weight:700}
.ps-figur-fuss{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.ps-figur-funktion,.ps-figur-typisch{display:inline-flex;align-items:center;gap:6px;font-size:.8rem;
 border-radius:6px;padding:6px 10px}
.ps-figur-funktion{background:var(--akzent);color:#fff;font-weight:600}
.ps-figur-funktion span{opacity:.8;font-weight:400;font-size:.72rem;text-transform:uppercase;letter-spacing:.05em}
.ps-figur-typisch{background:#F0F3F7;color:#54595F;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.ps-figur-typisch-icon{font-size:.9rem}
.ps-figur-serienrolle{color:#54595F;font-size:.9rem;line-height:1.55;margin:12px 0 0;
 padding-top:12px;border-top:1px dashed #E4E8EE}

@media(max-width:1024px){
 .ps-ensemble{grid-template-columns:repeat(2,1fr);gap:22px}
 .ps-figur-buehne{height:230px}
}
@media(max-width:767px){
 .ps-ensemble{grid-template-columns:1fr;gap:20px}
 .ps-figur-buehne{height:260px}
 .ps-figur-platzhalter{width:104px;height:104px;margin-bottom:60px}
 .ps-figur-initialen{font-size:2rem}
 .ps-figur-name{font-size:1.08rem}
}

/* Netzwerk: Zentrum mit fuenf angebundenen Formaten – bewusst KEINE Kette */
.ps-hub-netz{display:flex;flex-direction:column;align-items:center;gap:0}
.ps-hub-netz-zentrum{position:relative;text-align:center;background:#081529;color:#fff;
 border-radius:14px;padding:26px 34px;max-width:460px;z-index:2;
 box-shadow:0 14px 34px rgba(8,21,41,.20)}
.ps-hub-netz-zentrum-titel{display:block;font-size:1.22rem;font-weight:700;line-height:1.35}
.ps-hub-netz-zentrum-sub{display:block;margin-top:8px;font-size:.83rem;letter-spacing:.06em;
 text-transform:uppercase;color:#7FB4E8}
/* waagerechte Sammelschiene unter dem Zentrum */
.ps-hub-netz-karten{position:relative;display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
 gap:20px;width:100%;margin-top:38px;padding-top:22px}
.ps-hub-netz-karten:before{content:"";position:absolute;top:0;left:10%;right:10%;height:2px;background:#CFDAE7}
/* senkrechte Anbindung vom Zentrum zur Schiene */
.ps-hub-netz:before{content:"";width:2px;height:38px;background:#CFDAE7;margin-top:-38px;
 position:relative;top:38px;z-index:1}
.ps-hub-netz-karte{position:relative;background:#fff;border:1px solid #E4E8EE;border-radius:11px;
 padding:20px 18px;border-top:3px solid var(--k,#1E87FF);
 transition:transform .22s ease,box-shadow .22s ease}
.ps-hub-netz-karte:hover{transform:translateY(-4px);box-shadow:0 12px 26px rgba(8,21,41,.11)}
.ps-hub-netz-karte--serie{--k:#1E87FF}
.ps-hub-netz-karte--story{--k:#FA4676}
.ps-hub-netz-karte--comedy{--k:#E8B64C}
.ps-hub-netz-karte--news{--k:#007FAD}
.ps-hub-netz-karte--tutorial{--k:#61CE70}
/* Stichleitung von der Schiene zur Karte */
.ps-hub-netz-verbindung{position:absolute;top:-22px;left:50%;width:2px;height:22px;background:#CFDAE7}
.ps-hub-netz-titel{font-size:1rem!important;font-weight:700!important;color:#1A1A1A!important;margin:0 0 7px!important;line-height:1.3!important}
.ps-hub-netz-text{color:#54595F;font-size:.9rem;line-height:1.55;margin:0}

.ps-hub-kernsatz{text-align:center;font-size:1.12rem;font-weight:700;color:#1A1A1A;
 margin:34px 0 0;padding:16px 20px;background:#1E87FF12;border-radius:10px}

/* Verbindungsbeispiele – in beide Richtungen, keine Reihenfolge */
.ps-hub-verbindungen{display:grid;grid-template-columns:repeat(auto-fill,minmax(310px,1fr));gap:12px;margin-top:22px}
.ps-hub-verbindung-zeile{background:#fff;border:1px solid #E4E8EE;border-radius:9px;padding:14px 16px}
.ps-hub-vb{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:5px}
.ps-hub-vb-a,.ps-hub-vb-b{font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;
 background:#F0F4F9;color:#40566F;border-radius:4px;padding:3px 8px}
.ps-hub-vb-pfeil{color:#9AB0C6;font-size:.95rem}
.ps-hub-vb-text{display:block;color:#54595F;font-size:.89rem;line-height:1.5}

/* Beispielweg – ausdruecklich als EIN Weg gekennzeichnet */
.ps-hub-weg{background:#F4F6F9;border:1px dashed #C6D2E0;border-radius:12px;padding:26px 24px;max-width:620px}
.ps-hub-weg-label{display:inline-block;font-size:.72rem;text-transform:uppercase;letter-spacing:.09em;
 font-weight:700;color:#fff;background:#8C9AAC;border-radius:4px;padding:5px 11px;margin-bottom:16px}
.ps-hub-wegschritt{background:#fff;border:1px solid #E4E8EE;border-left:3px solid #1E87FF;border-radius:8px;
 padding:12px 16px;display:flex;flex-wrap:wrap;align-items:baseline;gap:5px 10px}
.ps-hub-wegschritt--news-short{border-left-color:#007FAD}
.ps-hub-wegschritt--story-short{border-left-color:#FA4676}
.ps-hub-wegschritt--hauptfolge{border-left-color:#1E87FF}
.ps-hub-wegschritt--tutorial{border-left-color:#61CE70}
.ps-hub-weg-wann{font-weight:700;color:#1A1A1A;font-size:.9rem}
.ps-hub-weg-typ{font-size:.7rem;text-transform:uppercase;letter-spacing:.06em;font-weight:700;
 color:#40566F;background:#EEF2F7;border-radius:4px;padding:3px 8px}
.ps-hub-weg-text{flex-basis:100%;color:#54595F;font-size:.9rem;line-height:1.5}
.ps-hub-weg-pfeil{display:block;text-align:center;color:#B6C3D2;font-size:1.2rem;line-height:1;padding:5px 0}
.ps-hub-weg-hinweis{margin:18px 0 0;padding:13px 15px;background:#fff;border-left:3px solid #E8B64C;
 border-radius:0 7px 7px 0;color:#54595F;font-size:.89rem;line-height:1.55;font-style:italic}

/* Filter-Navigation */
.ps-hub-nav{display:flex;flex-wrap:wrap;gap:9px}
.ps-hub-nav-pill{display:inline-block;padding:8px 16px;border-radius:999px;border:1px solid #DCE3EC;
 background:#fff;color:#54595F;font-size:.88rem;font-weight:500;cursor:default}
.ps-hub-nav-pill--aktiv{background:#1E87FF;border-color:#1E87FF;color:#fff;font-weight:600}

/* Firmengedaechtnis – Statuskarten */
.ps-hub-gags{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:14px}
.ps-hub-gag{background:#fff;border:1px solid #E4E8EE;border-radius:10px;padding:15px 17px;
 font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.ps-hub-gag-titel{display:flex;align-items:center;justify-content:space-between;font-weight:700;
 color:#1A1A1A;font-size:.83rem;text-transform:uppercase;letter-spacing:.05em;margin-bottom:9px;
 padding-bottom:8px;border-bottom:1px solid #F0F3F7}
.ps-hub-gag-punkt{width:8px;height:8px;border-radius:50%;display:inline-block}
.ps-hub-gag-punkt--ok{background:#61CE70}
.ps-hub-gag-punkt--warn{background:#E8B64C}
.ps-hub-gag-punkt--alarm{background:#FA4676}
.ps-hub-gag-zeile{display:flex;justify-content:space-between;gap:10px;padding:3px 0;font-size:.85rem}
.ps-hub-gag-wer{color:#8C9AAC}
.ps-hub-gag-was{color:#1A1A1A;text-align:right}

/* Terminal */
.ps-hub-terminal{background:#0C1930;border-radius:10px;overflow:hidden;box-shadow:0 14px 34px rgba(8,21,41,.20);max-width:440px}
.ps-hub-terminal-leiste{display:flex;align-items:center;gap:7px;padding:11px 14px;background:#081529;border-bottom:1px solid #1B2942}
.ps-hub-terminal-leiste span{width:10px;height:10px;border-radius:50%;background:#3A4A63}
.ps-hub-terminal-leiste span:first-child{background:#FA4676}
.ps-hub-terminal-leiste span:nth-child(2){background:#E8B64C}
.ps-hub-terminal-leiste span:nth-child(3){background:#61CE70}
.ps-hub-terminal-leiste em{margin-left:8px;color:#7E93B0;font-size:.78rem;font-style:normal;
 font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.ps-hub-terminal-inhalt{padding:16px 18px 18px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.85rem}
.ps-hub-status-zeile{display:flex;gap:9px;padding:4px 0}
.ps-hub-status-key{color:#7E93B0;min-width:120px}
.ps-hub-status-val--ok{color:#61CE70}
.ps-hub-status-val--warn{color:#E8B64C}
.ps-hub-status-val--alarm{color:#FA4676}
.ps-hub-status-kommentar{color:#4A5D78;font-size:.79rem;margin-top:12px;padding-top:10px;border-top:1px solid #1B2942}

/* Staffel */
.ps-hub-staffel{background:#fff;border:1px solid #E4E8EE;border-radius:14px;padding:32px 30px;box-shadow:0 12px 30px rgba(8,21,41,.07)}
.ps-hub-staffel-label{display:inline-block;font-size:.73rem;text-transform:uppercase;letter-spacing:.09em;
 font-weight:700;color:#fff;background:#1E87FF;border-radius:4px;padding:5px 11px;margin-bottom:11px}
.ps-hub-staffel-kopf h3{font-size:1.55rem!important;font-weight:700!important;color:#1A1A1A!important;margin:0 0 15px!important;line-height:1.25!important}
.ps-hub-staffel-text{color:#54595F;font-size:1rem;line-height:1.68;margin:0 0 20px}
.ps-hub-staffel-frage{padding:19px 21px;background:#1E87FF12;border-left:3px solid #1E87FF;border-radius:0 8px 8px 0}
.ps-hub-staffel-frage span{display:block;font-size:.73rem;text-transform:uppercase;letter-spacing:.08em;color:#007FAD;font-weight:700;margin-bottom:6px}
.ps-hub-staffel-frage p{color:#1A1A1A;font-size:1.02rem;font-weight:600;line-height:1.55;margin:0}
.ps-hub-staffel-hinweis{color:#8C9AAC;font-size:.85rem;font-style:italic;margin:18px 0 0}

/* Fiktionshinweis */
.ps-hub-fiktion{background:#FFF8E6;border:1px solid #F0DFB0;border-left:4px solid #E8B64C;border-radius:10px;padding:22px 24px}
.ps-hub-fiktion h3{font-size:1.08rem!important;font-weight:700!important;color:#1A1A1A!important;margin:0 0 9px!important}
.ps-hub-fiktion p{color:#54595F;font-size:.95rem;line-height:1.62;margin:0}

.ps-hub-kommentar{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
 color:#9AA8BC;font-size:.83rem;margin:0 0 6px}

/* Trenner zwischen den beiden Informationsebenen */
.ps-hub-ebene{display:flex;align-items:center;gap:16px;margin:0}
.ps-hub-ebene:before,.ps-hub-ebene:after{content:"";flex:1;height:1px;background:#DCE3EC}
.ps-hub-ebene span{font-size:.76rem;text-transform:uppercase;letter-spacing:.12em;font-weight:700;color:#8C9AAC;white-space:nowrap}


@media(max-width:767px){
 .ps-hub-formate,.ps-hub-rubriken,.ps-hub-gags{grid-template-columns:1fr}
 .ps-hub-staffel{padding:24px 19px}
 .ps-hub-staffel-kopf h3{font-size:1.3rem!important}
 .ps-hub-terminal{max-width:100%}
 .ps-hub-status-key{min-width:108px}
 .ps-hub-netz-karten{grid-template-columns:1fr;margin-top:26px;padding-top:18px}
 .ps-hub-netz-karten:before{left:50%;right:auto;width:2px;top:0;bottom:0;height:auto}
 .ps-hub-netz-verbindung{display:none}
 .ps-hub-netz-zentrum{padding:22px 20px}
 .ps-hub-netz-zentrum-titel{font-size:1.08rem}
 .ps-hub-verbindungen{grid-template-columns:1fr}
 .ps-hub-weg{padding:20px 17px}
 .ps-hub-ebene span{font-size:.7rem;letter-spacing:.08em;white-space:normal;text-align:center}
}
/*# sourceURL=ps-hub-inline-css */
