/* ============================================================
   Struktur-Umbau 2026-09 — neuer Foto-Hero, Siegel, Unterseiten
   Lädt NACH styles.css und nutzt deren Design-Tokens.
   ============================================================ */

/* ---------- Neuer Hero: Vortragsfoto als Bühne ---------- */
.hero-stage{position:relative;z-index:1;display:flex;flex-direction:column;justify-content:flex-end;min-height:max(580px,calc(100svh - var(--header-h)));isolation:isolate;overflow:hidden}
.hero-stage__bg{position:absolute;inset:0;z-index:0;margin:0}
.hero-stage__bg img{width:100%;height:100%;object-fit:cover;object-position:50% 50%;filter:contrast(1.04) saturate(.94)}
.hero-stage__scrim{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(to top,rgba(7,12,22,.93) 0%,rgba(7,12,22,.6) 36%,rgba(7,12,22,.16) 68%,rgba(7,12,22,.34) 100%)}
.hero-stage__inner{position:relative;z-index:2;width:100%;max-width:var(--shell);margin-inline:auto;padding:clamp(120px,16vh,180px) var(--gut) clamp(30px,5vh,60px)}
.hero-stage__content{max-width:640px}
.hero-stage__eyebrow{display:inline-flex;align-items:center;gap:9px;flex-wrap:wrap;margin:0 0 clamp(16px,2.4vw,24px);padding:9px 15px;border:1px solid rgba(255,255,255,.3);border-radius:999px;background:rgba(11,18,32,.6);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#F4F1EA;font-size:12px;font-weight:600;letter-spacing:.07em;text-transform:uppercase}
.hero-stage__eyebrow i{color:rgba(244,241,234,.6);font-style:normal}
.hero-stage h1{margin:0 0 clamp(14px,2vw,20px);font-family:var(--f-display);font-weight:var(--w-display);font-size:clamp(46px,7.6vw,96px);line-height:.98;letter-spacing:-.02em;color:#fff;text-shadow:0 2px 20px rgba(0,0,0,.5)}
.hero-stage__lede{max-width:52ch;color:rgba(244,241,234,.94);font-size:clamp(16px,1.4vw,19px);line-height:1.62;text-shadow:0 1px 12px rgba(0,0,0,.55)}
.hero-stage__lede strong{color:#fff;font-weight:600}
.hero-stage__actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px 26px;margin-top:clamp(22px,3vw,32px)}
.hero-stage .btn--text{color:rgba(244,241,234,.88);border-bottom-color:rgba(244,241,234,.4)}
.hero-stage .btn--text:hover{color:#fff;border-bottom-color:var(--accent-soft)}
@media(min-width:900px){
  .hero-stage__bg img{object-position:50% 48%}
  /* Michael steht links der Bildmitte: Text rechts, Abdunklung nur rechts + Fuß */
  .hero-stage__scrim{background:linear-gradient(100deg,rgba(7,12,22,.12) 0%,rgba(7,12,22,.08) 34%,rgba(7,12,22,.6) 58%,rgba(7,12,22,.9) 100%),linear-gradient(to top,rgba(7,12,22,.68),transparent 42%)}
  .hero-stage__content{margin-left:0;margin-right:auto;max-width:620px}
}
@media(max-width:899px){
  /* Hochformat-Bild: Michael oben/mittig sichtbar, Text unten auf Abdunklung */
  .hero-stage__bg img{object-position:50% 18%}
  .hero-stage__inner{padding-top:clamp(96px,14vh,140px)}
  .hero-stage__actions .btn--primary{width:100%}
}

/* ---------- Siegel (BAFA + KI-Manager): identische Höhe ---------- */
.siegel-row{--siegel-h:126px;display:flex;align-items:flex-start;gap:clamp(16px,2.4vw,28px)}
.siegel{display:inline-block;transition:transform .25s var(--ease-out)}
.siegel:hover{transform:translateY(-3px)}
.siegel:focus-visible{outline:2px solid var(--accent-soft);outline-offset:4px;border-radius:8px}
.siegel img{display:block;height:var(--siegel-h);width:auto;filter:drop-shadow(0 10px 26px rgba(0,0,0,.4))}
.hero-stage .siegel-row{margin-top:clamp(26px,3.6vw,42px)}
.siegel-row--footer{--siegel-h:76px;margin-top:6px}
.siegel-row--footer .siegel img{filter:drop-shadow(0 6px 16px rgba(0,0,0,.3))}
.vertrauen-siegel{display:flex;flex-wrap:wrap;gap:clamp(24px,4vw,48px);align-items:center;margin-bottom:clamp(36px,5vw,56px)}
.vertrauen-siegel .siegel-row{--siegel-h:150px}
.vertrauen-siegel__text{flex:1 1 320px;max-width:56ch;color:var(--muted);font-size:15.5px;line-height:1.66}
.vertrauen-siegel__text strong{color:var(--text)}
@media(max-width:560px){.siegel-row{--siegel-h:100px}.siegel-row--footer{--siegel-h:64px}.vertrauen-siegel .siegel-row{--siegel-h:118px}}

/* ---------- Unterseiten-Kopf + Brotkrumen ---------- */
.page-hero{position:relative;z-index:1;padding:clamp(112px,15vh,168px) 0 clamp(20px,4vw,40px)}
.page-hero .scene-kicker{margin-top:0}
.page-hero h1{font-family:var(--f-display);font-weight:600;font-size:clamp(38px,6vw,72px);line-height:1.02;letter-spacing:-.03em;color:var(--text);margin:6px 0 0}
.page-hero h1 em{font-family:var(--f-accent);font-style:italic;font-weight:600;color:var(--accent)}
.page-hero p{max-width:60ch;margin:22px 0 0;color:var(--muted);font-size:clamp(16px,1.4vw,18px);line-height:1.66}
.crumbs{display:flex;flex-wrap:wrap;gap:8px;align-items:center;color:var(--faint);font-size:13px;margin-bottom:18px}
.crumbs a{color:var(--muted);transition:color .2s ease}
.crumbs a:hover{color:var(--text)}
.crumbs .sep{color:var(--faint)}

/* ---------- Rollen-Karten der Startseite verlinken ---------- */
.role__go{position:absolute;inset:0;z-index:2;border-radius:inherit}
.role__go:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.role__more{display:inline-flex;align-items:center;gap:7px;margin-top:18px;color:var(--accent-soft);font-size:13px;font-weight:600;transition:gap .24s var(--ease-out),color .24s var(--ease-out)}
.role:hover .role__more{color:var(--accent);gap:11px}

/* ---------- Rollen ausführlich (Über mich) ---------- */
.rolle-detail{display:grid;grid-template-columns:72px 1fr;gap:clamp(24px,4vw,56px);padding:clamp(30px,3.4vw,48px) 0;border-top:1px solid var(--line-soft);scroll-margin-top:110px}
.rolle-detail:last-of-type{border-bottom:1px solid var(--line-soft)}
.rolle-detail h3{font-size:clamp(22px,2.4vw,30px);margin-bottom:14px;color:var(--text)}
.rolle-detail p{max-width:720px;color:var(--muted);font-size:16px;line-height:1.66}
.rolle-detail p+p{margin-top:14px}
.rolle-detail ul{margin-top:18px;display:grid;gap:12px}
.rolle-detail ul li{position:relative;padding-left:24px;color:var(--text);font-size:15.5px;line-height:1.55}
.rolle-detail ul li:before{content:"";position:absolute;left:0;top:11px;width:13px;height:2px;background:var(--accent);border-radius:2px}
@media(max-width:820px){.rolle-detail{grid-template-columns:1fr;gap:10px}}

/* ---------- Zahlen-Band (Über mich) ---------- */
.zahlen{display:grid;grid-template-columns:repeat(3,minmax(0,auto));gap:clamp(24px,5vw,64px);margin:clamp(28px,4vw,44px) 0 0;padding:clamp(22px,3vw,32px) 0 0;border-top:1px solid var(--line-soft);scroll-margin-top:110px}
.zahlen dt{font-family:var(--f-display);font-size:clamp(30px,3.4vw,44px);font-weight:600;line-height:1;color:var(--text);letter-spacing:-.03em}
.zahlen dd{margin:8px 0 0;color:var(--muted);font-size:12px;letter-spacing:.06em;text-transform:uppercase}
@media(max-width:560px){.zahlen{grid-template-columns:1fr 1fr;gap:20px}}

/* ---------- Platzhalter „in Vorbereitung" (Presse) / Hinweise ---------- */
.stub-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.stub-panel{padding:clamp(24px,3vw,36px);border:1px dashed var(--line);border-radius:18px;background:var(--panel)}
.stub-badge{display:inline-block;margin-bottom:12px;padding:5px 12px;border-radius:999px;border:1px solid #c16a4f59;background:#c16a4f14;color:var(--accent-soft);font-size:11px;font-weight:700;letter-spacing:.09em;text-transform:uppercase}
.stub-panel strong{display:block;color:var(--text);font-family:var(--f-display);font-weight:600;font-size:19px;margin-bottom:8px}
.stub-panel p{color:var(--muted);font-size:15px;line-height:1.62}
@media(max-width:820px){.stub-grid{grid-template-columns:1fr}}

/* ---------- Hinweis-Panel (Terminbuchung Kontakt) ---------- */
.termin-hinweis{margin-top:26px;padding:20px 24px;border:1px dashed var(--line);border-radius:16px;background:var(--panel);color:var(--muted);font-size:14.5px;line-height:1.62}
.termin-hinweis strong{display:block;color:var(--text);font-family:var(--f-display);font-weight:600;font-size:17px;margin-bottom:6px}

/* ---------- Media-Gruppen mit statischen Karten (Mediathek/Presse) ---------- */
.media__note{margin-top:14px;color:var(--faint);font-size:13px;line-height:1.6}
.media__videos--two{grid-template-columns:repeat(2,1fr)}
@media(max-width:900px){.media__videos--two{grid-template-columns:1fr}}

/* ============================================================
   Feinschliff 2026-09-03 — Siegel im Hero, Scroll-Hinweis,
   Menü ohne Nummern, Marker statt Ziffern, Podcast-Playlists
   ============================================================ */

/* ---------- Kopfmenü: Haus-Symbol zur Startseite ---------- */
.nav__home{display:inline-flex;align-items:center;justify-content:center;padding:4px 2px}
.nav a.nav__home:after{display:none}
.nav__home svg{width:17px;height:17px;display:block}

/* ---------- Mobiles Menü: keine Nummern mehr ---------- */
.mobile-menu a{grid-template-columns:1fr 26px}
.mobile-menu a>span{display:none}
.mobile-menu a:after{grid-column:2;justify-self:end}

/* ---------- Hero: Siegel groß in der freien Fläche rechts (Desktop) ---------- */
.hero-stage__siegel{position:absolute;right:var(--gut);top:50%;z-index:3;transform:translateY(-50%);display:flex;flex-direction:column;align-items:center;gap:clamp(18px,3vh,34px);--siegel-h:clamp(150px,19vh,216px)}
.hero-stage__siegel .siegel img{height:var(--siegel-h);width:auto;filter:drop-shadow(0 16px 38px rgba(0,0,0,.55))}
@media(max-width:899px){.hero-stage__siegel{display:none}}

/* ---------- Siegel-Band unter dem Hero (nur mobil) ---------- */
.siegel-band{display:none}
@media(max-width:899px){
  .siegel-band{display:flex;justify-content:center;align-items:flex-start;gap:clamp(22px,8vw,44px);padding:28px var(--gut);--siegel-h:128px;background:linear-gradient(180deg,#0d1626,#0F1A30);border-bottom:1px solid rgba(255,255,255,.08)}
  .siegel-band .siegel img{height:var(--siegel-h);width:auto;filter:drop-shadow(0 10px 26px rgba(0,0,0,.45))}
}

/* ---------- Scroll-Hinweis am unteren Hero-Rand ---------- */
.hero-stage__cue{position:absolute;left:50%;bottom:16px;z-index:3;transform:translateX(-50%);display:inline-flex;flex-direction:column;align-items:center;gap:7px;color:rgba(244,241,234,.72);transition:color .25s ease}
.hero-stage__cue:hover{color:#fff}
.hero-stage__cue:focus-visible{outline:2px solid var(--accent-soft);outline-offset:4px;border-radius:10px}
.hero-stage__cue-mouse{display:block;position:relative;width:21px;height:33px;border:1.6px solid currentColor;border-radius:11px}
.hero-stage__cue-mouse i{position:absolute;left:50%;top:6px;width:3px;height:7px;margin-left:-1.5px;border-radius:3px;background:var(--accent-soft);animation:cue-drop 1.9s var(--ease-in-out) infinite}
@keyframes cue-drop{0%{transform:translateY(0);opacity:1}72%{transform:translateY(13px);opacity:0}to{transform:translateY(0);opacity:0}}
.hero-stage__cue-label{font-size:10px;font-weight:600;letter-spacing:.16em;text-transform:uppercase}
@media(max-width:899px){.hero-stage__inner{padding-bottom:clamp(66px,9vh,92px)}.hero-stage__cue{bottom:12px}.hero-stage__cue-label{display:none}}
@media(prefers-reduced-motion:reduce){.hero-stage__cue-mouse i{animation:none;opacity:.9}}

/* ---------- Akzent-Marker als Ersatz der entfernten Nummern ---------- */
.role__mark{display:block;width:26px;height:2px;margin-bottom:28px;background:var(--accent);border-radius:2px}
.module__mark{display:block;width:26px;height:2px;background:var(--accent);border-radius:2px}
.rolle-detail__mark{display:block;width:34px;height:3px;margin-top:16px;background:var(--accent);border-radius:2px}
@media(max-width:820px){.rolle-detail__mark{margin-top:2px}}

/* ---------- Podcast-Playlists (Mediathek) ---------- */
.podcast-links{margin-top:clamp(28px,4vw,44px);display:flex;flex-wrap:wrap;justify-content:center;gap:14px}


/* ---------- Über mich 2026-09-03: Porträt im Hochformat (Original 1080×1578, Person unbeschnitten) ---------- */
.editorial__frame.editorial__frame--portrait{max-width:460px}
.editorial__frame.editorial__frame--portrait img{aspect-ratio:1080/1578;height:auto;max-height:none;object-fit:cover;object-position:50% 50%}
@media(min-width:901px){
  .editorial__sticky--portrait{top:clamp(84px,10vh,120px)}
}
@media(max-width:900px){
  .editorial__frame.editorial__frame--portrait{max-width:480px;margin-inline:auto}
  .editorial__frame.editorial__frame--portrait img{aspect-ratio:1080/1578;max-height:none;object-position:50% 50%}
}

/* ---------- Qualifikationen: Siegel groß, identische Darstellungsgröße, sachliche Einordnung ---------- */
.quali__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(18px,2.4vw,28px)}
.quali-card{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(20px,2.8vw,38px);align-items:center;padding:clamp(24px,3vw,40px);border:1px solid var(--line-soft);border-radius:22px;background:var(--bg-2);box-shadow:0 30px 80px -56px rgba(0,0,0,.65)}
.quali-card__siegel{display:inline-block;transition:transform .25s var(--ease-out)}
.quali-card__siegel:hover{transform:translateY(-3px)}
.quali-card__siegel:focus-visible{outline:2px solid var(--accent-soft);outline-offset:4px;border-radius:8px}
.quali-card__siegel img{display:block;height:clamp(230px,24vw,330px);width:auto;filter:drop-shadow(0 14px 34px rgba(0,0,0,.4))}
.quali-card__scope{display:inline-block;margin-bottom:10px;color:var(--accent-soft);font-size:11.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase}
.quali-card__copy h3{font-size:clamp(20px,2vw,26px);color:var(--text);margin-bottom:10px}
.quali-card__copy p{color:var(--muted);font-size:15px;line-height:1.64;max-width:44ch}
@media(max-width:1100px){.quali__grid{grid-template-columns:1fr}}
@media(max-width:560px){
  .quali-card{grid-template-columns:1fr}
  .quali-card__siegel{justify-self:center}
  .quali-card__siegel img{height:clamp(240px,66vw,300px)}
  .quali-card__copy{text-align:left}
}

/* ---------- Zwischen-CTA (Über mich): ruhige Handlungsaufforderung im Seitenverlauf ---------- */
.zwischen-cta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 28px;margin-top:clamp(36px,5vw,56px);padding:clamp(20px,2.6vw,28px) clamp(22px,3vw,36px);border:1px solid var(--line-soft);border-radius:18px;background:var(--panel)}
.zwischen-cta p{color:var(--muted);font-size:15.5px;line-height:1.5;max-width:52ch;margin:0}
@media(max-width:640px){.zwischen-cta{flex-direction:column;align-items:stretch;text-align:center}.zwischen-cta .btn{width:100%}}

/* ---------- Stationen: KI-Manager-Badge (gleiche Gestaltung wie BAFA-Badge) ---------- */
.station__badge--ki strong:before{content:"\1F393\a0\a0"}

/* ---------- Events: Veranstalter-Label (eigen = Akzent, fremd = neutral) ---------- */
.ev-org{position:absolute;z-index:3;top:14px;right:14px;display:inline-flex;align-items:center;padding:7px 13px;border-radius:999px;font-family:var(--f-body);font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;line-height:1.2;max-width:calc(100% - 96px);backdrop-filter:blur(8px);box-shadow:0 12px 30px -16px rgba(0,0,0,.6)}
.ev-org--own{background:linear-gradient(135deg,var(--accent),var(--accent-deep));border:1px solid rgba(232,159,134,.5);color:#fff}
.ev-org--guest{background:rgba(11,18,32,.62);border:1px solid rgba(255,255,255,.32);color:#E6EAF2}

/* ---------- Startseite Events-Aside: kompakte Gast-Termine ---------- */
.ev-aside__list{margin:20px 0 22px;display:grid}
.ev-aside__list li{display:grid;gap:3px;padding:12px 0;border-top:1px solid var(--line-soft);font-size:13.5px;line-height:1.5;color:var(--muted)}
.ev-aside__list li:last-child{border-bottom:1px solid var(--line-soft)}
.ev-aside__list b{color:var(--text);font-weight:600}
.ev-aside__org{color:var(--faint);font-size:12px;letter-spacing:.04em}