/* A continuous corridor; sections are transparent planes in the same space. */
.gang-seite { background:#101820; }
.gang-aktiv { overflow-anchor:none; }
.gang-hintergrund { position:fixed; inset:0; z-index:-1; overflow:hidden; pointer-events:none; background:#101820; }
.gang-bild { position:absolute; inset:-2%; width:104%; height:104%; object-fit:cover; object-position:50% 54%; transform-origin:50% 54%; }
.gang-raumbild { position:absolute; inset:0; width:100%; height:100%; opacity:0; }
.raum-bereit .gang-raumbild { opacity:1; }
.raum-bereit .gang-bild { visibility:hidden; }
.gang-hintergrund::after { content:""; position:absolute; inset:0; background:radial-gradient(ellipse at 50% 48%,rgba(9,16,23,.36),rgba(9,16,23,.8) 80%),linear-gradient(180deg,rgba(9,16,23,.35),transparent 35%,rgba(9,16,23,.5)); }
.gang-seite main>.variante { background:transparent; color:var(--papier); }
.gang-seite main>.variante::after,.gang-seite main .grund { display:none; }
.gang-seite .g-papier .lead,.gang-seite .g-papier .frage-gross p,.gang-seite .g-papier .strahl p { color:var(--frost); }
.gang-seite .g-papier .h2 em,.gang-seite .g-papier .icon,.gang-seite .strahl li.an .nr { color:var(--kernlicht); }
.gang-seite .strahl::after { background:var(--kernlicht); }
.gang-seite .strahl .knoten { background:var(--tiefe); }
.gang-seite .konturen article { background:rgba(13,22,30,.55); }
.gang-seite .band-dunkel { background:transparent!important; }
.gang-seite .fuss { position:relative; z-index:12; background:rgba(13,22,30,.94); }
.gang-seite .reise-ebene { text-shadow:0 2px 24px rgba(0,0,0,.38); }
.gang-seite .reise-ebene .knopf { text-shadow:none; }
.gang-seite .reise-ebene { font-size:1rem; line-height:1.55; }
.gang-seite .reise-ebene .h2 { font-size:clamp(1.65rem,3.1vw,3rem); line-height:1.14; max-width:26ch; }
.gang-seite .reise-ebene .lead { font-size:clamp(1rem,1.3vw,1.15rem); line-height:1.55; max-width:52ch; margin-top:1.2rem; }
.gang-seite .reise-ebene .frage-gross { gap:.85rem; margin-top:2rem; }
.gang-seite .reise-ebene .frage-gross h3 { font-size:clamp(1.6rem,2.8vw,2.6rem); line-height:1.16; }
.gang-seite .reise-ebene .frage-gross .icon { --gr:52px; }
.gang-seite .reise-ebene .konturen h3 { font-size:clamp(1.2rem,1.65vw,1.55rem); line-height:1.2; }
.gang-seite .reise-ebene .konturen .icon { --gr:44px!important; }
.gang-seite .reise-ebene .zahlreihe strong { font-size:clamp(1.75rem,4vw,3.5rem); letter-spacing:-.025em; }
.gang-seite .reise-ebene .zahlreihe { gap:1.5rem; margin-top:2rem; }
.gang-seite .reise-ebene .zahlreihe span { margin-top:.75rem; padding-top:.75rem; }
.gang-seite .reise-ebene .strahl .nr { font-size:2.4rem; }
.gang-seite .reise-ebene .strahl h3 { font-size:1.1rem; }
.gang-seite .reise-ebene .betrieb { margin-top:2rem; }
.gang-seite .reise-ebene .betrieb .icon { --gr:44px; }
.gang-seite .reise-ebene .betrieb span { font-size:1rem; }
.gang-seite .reise-ebene .fragen summary { font-size:1rem; padding-block:.7rem; grid-template-columns:3.4rem 1fr 2rem; }
.gang-seite .reise-ebene .fragen summary .plus { width:2rem; height:2rem; }
.gang-seite .reise-ebene .fragen summary .nr { font-size:1.25rem; }
.gang-seite .reise-ebene .fragen .antwort { font-size:1rem; }
.gang-seite .reise-ebene .logo-hero { width:clamp(150px,18vw,240px); margin-bottom:1.8rem; }
.gang-seite .reise-ebene .h-claim { font-size:clamp(1.6rem,3.9vw,3.6rem); letter-spacing:.18em; line-height:1.18; }
.gang-seite .reise-ebene .h-claim+ .lead { margin-top:1.4rem; }
.gang-seite .reise-ebene .knopf { margin-top:1.6rem; }
.gang-seite .reise-ebene .mia { font-size:clamp(2.8rem,6vw,5rem); line-height:1.05; }
.gang-seite .reise-ebene .raster .h2 { font-size:clamp(1.6rem,2.6vw,2.4rem); }
.gang-seite .reise-ebene blockquote p { font-size:1.05rem; }
.gang-seite .reise-ebene .frage-gross:first-child { margin-top:0; }
.gang-seite .reise-ebene .logo-hero { margin-inline:auto; }

/* The section stays in document flow for native scrolling and anchor links. */
.gang-aktiv main>.reise-station { height:var(--reise-strecke); min-height:0; padding:0; display:block; overflow:visible; isolation:auto; scroll-margin-top:0; }
.gang-aktiv .reise-fenster { position:fixed; inset:0; z-index:10; perspective:1200px; perspective-origin:50% 48%; pointer-events:none; overflow:hidden; visibility:hidden; }
.gang-aktiv .reise-fenster.sichtbar { visibility:visible; }
.gang-aktiv .reise-traeger { position:absolute; inset:0; transform:translateZ(var(--reise-z,0px)); opacity:var(--reise-deckung,0); will-change:transform,opacity; }
.gang-aktiv .reise-traeger::before { content:""; position:absolute; inset:86px clamp(12px,3vw,48px) 66px; border:1px solid rgba(201,235,253,.18); border-radius:24px; pointer-events:none; box-shadow:0 0 60px rgba(79,182,232,.045); }
.gang-aktiv .reise-ebene { padding:16px 0; transform:translateY(var(--reise-y,0px)) scale(var(--reise-mass,1)); transform-origin:50% 0; will-change:transform; }
.gang-aktiv .reise-fenster.lesbar .reise-ebene { pointer-events:auto; }
.gang-aktiv .reise-ebene>.wrap { width:min(1140px,100% - 2*clamp(28px,6vw,90px)); }
.gang-aktiv .reise-ebene .konturen { margin-top:1.5rem; }
.gang-aktiv .reise-ebene .konturen article { min-height:0; padding:1.2rem; gap:.8rem; }
.gang-aktiv .reise-ebene .strahl { margin-top:2rem; gap:1rem; }
.gang-aktiv .reise-ebene .raster { margin-top:1.8rem; }
.gang-aktiv .reise-ebene .fragen { margin-top:1.5rem; }
.gang-aktiv .reise-ebene .wege { margin-top:1.8rem; }
.gang-aktiv .reise-ebene .wege .icon { --gr:40px; }
.gang-aktiv .reise-ebene .knopfzeile { margin-top:0; }
.gang-aktiv .reise-ebene .band { margin-top:2rem; padding-block:1rem; }
.gang-aktiv .reise-ebene .band-titel { margin-top:2rem; }
/* Keep the principle illustration within a single reading screen. */
.gang-aktiv #prinzip .prinzip { gap:clamp(1rem,3vw,2.5rem); }
.gang-aktiv #prinzip .schaubild { display:block; width:min(100%,480px); max-height:26svh; margin-inline:auto; }
.gang-aktiv #prinzip .betrieb { margin-top:1.25rem; gap:1rem; }
.gang-aktiv #prinzip .betrieb li { padding-top:.7rem; gap:.5rem; }
.gang-aktiv #prinzip .betrieb .icon { --gr:36px; }
.gang-seite #prinzip .schaubild .modell-label { font-size:24px; letter-spacing:.04em; }
@media(max-width:900px) {
  .gang-aktiv #prinzip .schaubild { width:min(100%,360px); max-height:22svh; }
  .gang-aktiv #prinzip .schaubild text { font-size:20px; letter-spacing:.08em; }
  .gang-aktiv #prinzip .betrieb li { flex-direction:row; align-items:center; gap:.7rem; }
  .gang-aktiv #prinzip .betrieb .icon { flex-shrink:0; }
  .gang-aktiv #versprechen .konturen article { display:grid; grid-template-columns:36px 10rem minmax(0,1fr); align-items:center; padding:.85rem; gap:.75rem; }
  .gang-aktiv #versprechen .konturen .icon { --gr:32px!important; }
}
.reise-bedienung { position:fixed; inset:auto clamp(16px,3vw,48px) 22px; z-index:51; display:flex; align-items:center; justify-content:space-between; gap:1rem; pointer-events:none; font:400 .68rem/1.4 var(--t); letter-spacing:.12em; color:rgba(222,232,244,.65); }
.reise-hinweis { display:flex; align-items:center; gap:12px; }
.reise-hinweis::before { content:"↓"; font-size:1rem; color:var(--kernlicht); }
.reise-schalter { pointer-events:auto; color:var(--frost); background:rgba(13,22,30,.8); border:1px solid rgba(201,235,253,.22); border-radius:99px; padding:9px 14px; font:inherit; letter-spacing:.04em; cursor:pointer; }
.reise-schalter:hover { border-color:var(--kernlicht); }
.reise-bedienung.am-ende .reise-hinweis { visibility:hidden; }
.gang-seite:not(.gang-aktiv) .reise-hinweis { visibility:hidden; }
.gang-seite:not(.gang-aktiv) .reise-fenster { position:static; }
.gang-seite:not(.gang-aktiv) .reise-traeger { opacity:1; transform:none; }
.gang-seite:not(.gang-aktiv) .reise-ebene { transform:none; }
.gang-seite:not(.gang-aktiv) .header .reise-ebene { width:100%; }
@media(max-width:760px) {
  .gang-aktiv .reise-ebene>.wrap { width:calc(100% - 48px); }
  .gang-aktiv .reise-traeger::before { inset:78px 10px 66px; border-radius:18px; }
  .gang-aktiv .reise-ebene .h2 { font-size:clamp(1.65rem,4.4vw,2rem); }
  .gang-aktiv .reise-ebene .frage-gross { margin-top:2rem; }
  .gang-aktiv .reise-ebene .fragen summary { grid-template-columns:1.9rem 1fr 2rem; gap:.6rem; padding-inline:0; }
  .gang-aktiv .reise-ebene .fragen summary .plus { width:2rem; height:2rem; }
  .gang-aktiv .reise-ebene .fragen .antwort { padding-left:2.5rem; padding-right:0; }
  .reise-hinweis { font-size:.6rem; letter-spacing:.06em; }
}
@media(max-width:600px) {
  .gang-aktiv .reise-ebene .prinzip { gap:1rem; }
  .gang-aktiv .reise-ebene .schaubild { max-width:300px; margin-inline:auto; }
  .gang-aktiv .reise-ebene .betrieb { margin-top:1rem; gap:.75rem; }
  .gang-aktiv .reise-ebene .betrieb li { gap:.4rem; padding-top:.6rem; }
  .gang-aktiv .reise-ebene .betrieb .icon { --gr:36px; }
  .gang-aktiv .reise-ebene .zahlreihe { grid-template-columns:1fr; gap:1.1rem; }
  .gang-aktiv .reise-ebene .zahlreihe li { display:grid; grid-template-columns:7.5rem 1fr; gap:1rem; align-items:start; }
  .gang-aktiv .reise-ebene .zahlreihe span { border-top:0; margin:0; padding:0; }
  .gang-aktiv .reise-ebene .wege { gap:1rem; }
  .gang-aktiv #prinzip .schaubild { width:min(100%,270px); max-height:19svh; }
  .gang-aktiv #prinzip .betrieb { margin-top:.85rem; gap:.7rem; }
  .gang-aktiv #prinzip .betrieb .icon { --gr:28px; }
  .gang-aktiv #prinzip .betrieb span { font-size:.9rem; }
  .gang-aktiv #versprechen .konturen { gap:.6rem; margin-top:1rem; }
  .gang-aktiv #versprechen .konturen article { grid-template-columns:28px minmax(0,1fr); gap:.3rem .6rem; padding:.7rem; }
  .gang-aktiv #versprechen .konturen .icon { --gr:26px!important; grid-row:span 2; align-self:start; }
  .gang-aktiv #versprechen .konturen h3 { font-size:1.05rem; }
  .gang-aktiv #versprechen .konturen p { grid-column:2; font-size:.9rem; line-height:1.45; }
}
@media(max-height:720px) and (min-width:901px) {
  .gang-aktiv .reise-ebene .h2 { font-size:2.2rem; }
  .gang-aktiv .reise-ebene .h-claim { font-size:2.8rem; }
  .gang-aktiv .reise-ebene .mia { font-size:3.6rem; }
  .gang-aktiv .reise-ebene .konturen article { padding:1rem; gap:.6rem; }
}
@media(prefers-reduced-motion:reduce) {
  .gang-bild { transform:none!important; }
}