/* Journey-Vorschau Stufe 1 (Finn, 14.10.2026): Eröffnung (Glasakte-Film v3 als Scroll-Kapitel, Stand 15.10.2026), K1 Was wir tun,
   K2 Warum das neu ist. Keine Inline-Stile, keine Inline-Skripte (scharfe CSP der Startseite).
   Farbsystem nach MM 13.10.2026: Jade #00B37E, echtes Gold #D4AF37, Schwarz; Seitenfläche #0B0F14 und Text #F2EFE9
   wie akte.css (--akte-grund, --akte-text), Textakzent #DCCAA8 aus glasakte_text_ebene_v2.html.
   Schriften lokal (OFL): Fraunces kursiv (Papier-Stimme), Inter (Lesetext), Geist Mono (Daten-Stimme). */

@font-face{font-family:Fraunces;font-style:italic;font-weight:100 900;font-display:swap;src:url("fonts/fraunces-italic-var-latin.woff2") format("woff2")}
@font-face{font-family:Inter;font-style:normal;font-weight:100 900;font-display:swap;src:url("fonts/inter-normal-var-latin.woff2") format("woff2")}
@font-face{font-family:"Geist Mono";font-style:normal;font-weight:100 900;font-display:swap;src:url("fonts/geistmono-normal-var-latin.woff2") format("woff2")}

:root{
  --grund:#0B0F14; --text:#F2EFE9; --akzent:#DCCAA8; --jade:#00B37E; --gold:#D4AF37;
  --leise:rgb(242 239 233/.74); --linie:rgb(242 239 233/.12);
  --serif:Fraunces,Georgia,"Times New Roman",serif;
  --sans:Inter,"Helvetica Neue",Helvetica,Arial,sans-serif;
  --mono:"Geist Mono",ui-monospace,"SF Mono",Menlo,monospace;
  --rand:clamp(18px,6.25vw,96px);
  --kopf-h:64px;
}
*,*::before,*::after{box-sizing:border-box}
html{background:var(--grund);color:var(--text);-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;font-family:var(--sans);font-size:1.0625rem;line-height:1.55;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
main{overflow-x:clip}
img,video,canvas{display:block;max-width:100%}
a{color:inherit}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:4px}
.nur-sr{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.kicker{margin:0 0 1rem;font-family:var(--mono);font-size:.78rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--jade)}

/* Sprunglink */
.sprung{position:absolute;left:12px;top:-60px;z-index:80;padding:.7em 1.1em;background:var(--text);color:var(--grund);font-weight:600;text-decoration:none;border-radius:8px}
.sprung:focus{top:12px}

/* ---------- Kopfzeile ---------- */
.kopf{position:fixed;top:0;left:0;right:0;z-index:60;display:flex;align-items:center;justify-content:space-between;gap:1rem;
  min-height:var(--kopf-h);padding:10px var(--rand);
  background:rgb(11 15 20/.58);-webkit-backdrop-filter:blur(18px) saturate(1.2);backdrop-filter:blur(18px) saturate(1.2);
  border-bottom:1px solid rgb(242 239 233/.08)}
.kopf__marke{display:flex;align-items:baseline;gap:.75rem;text-decoration:none;white-space:nowrap}
.kopf__wort{font-weight:650;letter-spacing:.14em;font-size:1rem}
.kopf__zeile{font-size:.82rem;color:var(--leise)}
.kopf__nav{position:relative}
.kopf__liste{display:flex;gap:clamp(14px,2.2vw,34px);margin:0;padding:0;list-style:none}
.kopf__liste a{display:inline-block;white-space:nowrap;padding:.5em 0;font-size:.92rem;font-weight:500;text-decoration:none;color:var(--text);background:linear-gradient(var(--gold),var(--gold)) 0 100%/0 1px no-repeat;transition:background-size .3s ease}
.kopf__liste a:hover,.kopf__liste a[aria-current="true"]{background-size:100% 1px}
.kopf__knopf{display:none;min-height:40px;padding:0 1rem;font:inherit;font-size:.9rem;font-weight:550;color:var(--text);background:rgb(242 239 233/.08);border:1px solid rgb(242 239 233/.2);border-radius:999px;cursor:pointer}
@media (max-width:899.98px){.kopf__zeile{display:none}}
/* Stufe 3: zehn Kapitel passen erst ab 1680 px in eine Zeile, darunter übernimmt der Menüknopf */
@media (max-width:1679.98px){
  .js .kopf__knopf{display:inline-flex;align-items:center}
  .js .kopf__liste{position:absolute;right:0;top:calc(100% + 10px);flex-direction:column;gap:0;min-width:13rem;padding:.4rem 1rem;
    background:rgb(11 15 20/.94);border:1px solid rgb(242 239 233/.14);border-radius:14px;box-shadow:0 20px 60px rgb(0 0 0/.45);
    visibility:hidden;opacity:0;transform:translateY(-6px);transition:opacity .2s ease,transform .2s ease,visibility 0s linear .2s}
  .js .kopf__liste.ist-offen{visibility:visible;opacity:1;transform:none;transition:opacity .2s ease,transform .2s ease}
  .js .kopf__liste a{display:block;padding:.75em 0;font-size:1rem}
  .nojs .kopf__liste{flex-wrap:wrap;justify-content:flex-end;gap:2px 12px}
  .nojs .kopf__liste a{font-size:.85rem}
}

/* ---------- K0 Film als Scroll-Kapitel ---------- */
.film{position:relative}
.film__buehne{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;container-type:size;z-index:1;background:var(--grund)}
.film__stationen{position:relative;z-index:2;margin-top:-100vh;margin-top:-100svh;pointer-events:none}
.film__station{height:100vh;height:100svh}
.film__station--schluss{height:170vh;height:170svh}
.hoch .film__station{height:88vh;height:88svh}
.hoch .film__station--schluss{height:150vh;height:150svh}
.film__bild{position:absolute;inset:0;transform:scale(1.045) translate3d(var(--px,0px),var(--py,0px),0);transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.film__poster img,.film__video,.film__stand img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:50% 50%}
.film__video{opacity:0;transition:opacity .28s ease}
.film__video.ist-sichtbar{opacity:1}
.film__stand img{opacity:0;transition:opacity .45s ease}
.film__stand img.ist-sichtbar{opacity:1}

/* Textebene, übernommen aus glasakte_text_ebene_v2.html (Maße in Container-Einheiten der Bühne) */
.gt-ebene{position:absolute;inset:0;pointer-events:none;color:var(--text);font-family:var(--sans);-webkit-font-smoothing:antialiased}
.gt-verlauf{position:absolute;inset:0;opacity:0}
.gt-verlauf--links{background:radial-gradient(135% 118% at 0% 100%,rgb(6 8 7/.9) 0%,rgb(6 8 7/.8) 26%,rgb(6 8 7/.52) 45%,rgb(6 8 7/.2) 60%,rgb(6 8 7/.06) 70%,rgb(6 8 7/0) 78%)}
.gt-verlauf--rechts{background:radial-gradient(135% 118% at 100% 100%,rgb(6 8 7/.9) 0%,rgb(6 8 7/.8) 26%,rgb(6 8 7/.52) 45%,rgb(6 8 7/.2) 60%,rgb(6 8 7/.06) 70%,rgb(6 8 7/0) 78%)}
.gt-ki-verlauf{position:absolute;right:0;bottom:0;width:28cqw;height:19cqh;background:radial-gradient(farthest-side at 100% 100%,rgb(6 8 7/.84) 0%,rgb(6 8 7/.62) 42%,rgb(6 8 7/.2) 78%,rgb(6 8 7/0) 100%)}
.gt-satz{position:absolute;left:6.25cqw;bottom:11.5cqh;width:46cqw;visibility:hidden}
.gt-satz--schluss{visibility:visible}
.gt-satz[data-ort=rechts]{left:auto;right:5.6cqw;width:44cqw}
.gt-kopf{margin:0;font-family:var(--serif);font-style:italic;font-weight:340;font-variation-settings:"opsz" 144;font-size:6cqw;line-height:.95;letter-spacing:-.03em;max-width:12.5ch;text-wrap:balance;text-shadow:0 .02em .6em rgb(6 8 7/.45)}
.gt-satz[data-stil=daten] .gt-kopf{font-family:var(--mono);font-style:normal;font-weight:350;font-variation-settings:normal;font-size:3.9cqw;line-height:1.1;letter-spacing:-.04em;max-width:15ch;text-wrap:wrap}
.gt-nacht{position:absolute;inset:0;background:var(--grund);opacity:0}
.gt-staub{position:absolute;inset:0;width:100%;height:100%;max-width:none;display:block}
/* Schluss v3 (MM 14.10.2026 "den Slogan zentral und groß mit effekt"): mittig und groß auf Schwarz, Zeile 1 und 2 Metallgold
   (Verlauf um #D4AF37, dunkelste Stufe #A8832E, 5,45:1 auf #0B0F14), Zeile 3 Jade (dunkelste Stufe #00A070, 5,7:1).
   Goldstaub fliegt auf die Glyphen, jede Zeile öffnet sich mit einer weichen Maske von links, danach ein Lichtschein. */
.gt-satz[data-schluss]{left:0;right:0;top:0;bottom:0;width:auto;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.gt-satz[data-schluss] .gt-kopf{font-size:min(9.2cqw,16.4cqh);line-height:1;max-width:none;text-wrap:nowrap;text-shadow:none;margin-top:-1.2cqh}
.gt-zeile{display:block;width:fit-content;margin:0 auto;padding:.04em .2em .12em;
  -webkit-mask-image:linear-gradient(90deg,#000 0%,#000 calc(var(--gt-maske,114%) - 14%),transparent var(--gt-maske,114%));
  mask-image:linear-gradient(90deg,#000 0%,#000 calc(var(--gt-maske,114%) - 14%),transparent var(--gt-maske,114%));
  background-repeat:no-repeat;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;
  filter:drop-shadow(0 0 1.2cqw var(--gt-glut,rgb(212 175 55/.28)))}
.gt-zeile--gold{background-image:linear-gradient(105deg,rgb(255 247 222/0) 43%,rgb(255 247 222/.92) 50%,rgb(255 247 222/0) 57%),linear-gradient(100deg,#A8832E 0%,#E3C26C 19%,#C2952F 40%,#F0DD9C 57%,#B98A2C 77%,#DDBB62 100%);
  background-size:300% 100%,220% 100%;background-position:var(--gt-licht,100%) 0,var(--gt-glanz,10%) 0}
.gt-zeile--jade{--gt-glut:rgb(0 179 126/.3);background-image:linear-gradient(105deg,rgb(226 255 244/0) 43%,rgb(226 255 244/.9) 50%,rgb(226 255 244/0) 57%),linear-gradient(100deg,#00A070 0%,#2CCB97 22%,#00B37E 45%,#43DDAA 62%,#00A574 82%,#1FC08C 100%);
  background-size:300% 100%,220% 100%;background-position:var(--gt-licht,100%) 0,var(--gt-glanz,10%) 0}
.gt-satz[data-schluss] .gt-unter{margin:2.4cqw auto 0;font-size:1.9cqw;max-width:40em;text-align:center;text-shadow:none}
@media (forced-colors: active){.gt-zeile{background:none;color:CanvasText;-webkit-text-fill-color:CanvasText;-webkit-mask-image:none;mask-image:none;filter:none}}
.gt-unter{margin:1.5cqw 0 0;font-size:1.5cqw;line-height:1.35;font-weight:450;letter-spacing:-.005em;text-wrap:balance;color:rgb(242 239 233/.9);text-shadow:0 0 .8em rgb(6 8 7/.45)}
.gt-akzent{color:var(--akzent);font-style:inherit}
.gt-w{display:inline-block;white-space:nowrap}
.gt-umbruch{display:inline}
.gt-z{opacity:0}
.gt-ki{position:absolute;right:2.9cqw;bottom:3.4cqh;margin:0;font-size:max(11px,.7cqw);font-weight:500;letter-spacing:.02em;color:rgb(242 239 233/.92);text-shadow:0 0 .7em rgb(6 8 7/.75),0 0 .2em rgb(6 8 7/.6)}
.js .gt-satz--schluss .gt-kopf,.js .gt-satz--schluss .gt-unter{opacity:0}
.js .gt-satz--schluss.ist-bereit .gt-kopf,.js .gt-satz--schluss.ist-bereit .gt-unter{opacity:1}

/* Stationsschiene: am Rechner senkrecht rechts mit goldener Fortschrittslinie, am Handy oben als Balken */
.film__schiene{position:absolute;right:clamp(14px,2.2vw,34px);top:50%;transform:translateY(-50%);margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:6px;z-index:3}
.film__schiene::before,.film__schiene::after{content:"";position:absolute;right:11px;top:12px;width:1px;background:rgb(242 239 233/.22)}
.film__schiene::before{bottom:12px}
.film__schiene::after{height:calc((100% - 24px) * var(--fortschritt,0));background:var(--gold);transition:height .5s ease}
.film__schiene button{position:relative;display:flex;align-items:center;justify-content:flex-end;gap:.7rem;min-height:30px;min-width:24px;padding:0;font:inherit;color:var(--text);background:none;border:0;cursor:pointer}
.film__punkt{position:relative;z-index:1;width:9px;height:9px;margin-right:7px;border-radius:50%;background:var(--grund);box-shadow:0 0 0 1.5px rgb(242 239 233/.55);transition:background .3s,box-shadow .3s,transform .3s}
.film__marke{order:-1;font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;padding:.3em .6em;border-radius:6px;background:rgb(11 15 20/.7);opacity:0;transform:translateX(6px);transition:opacity .25s,transform .25s}
.film__schiene button:hover .film__marke,.film__schiene button:focus-visible .film__marke,.film__schiene button[aria-current="step"] .film__marke{opacity:1;transform:none}
.film__schiene button[aria-current="step"] .film__punkt{background:var(--gold);box-shadow:0 0 0 1.5px var(--gold),0 0 14px rgb(212 175 55/.7);transform:scale(1.25)}
.film__schiene button.ist-gesehen .film__punkt{background:rgb(212 175 55/.55);box-shadow:0 0 0 1.5px rgb(212 175 55/.8)}

.film__steuer{position:absolute;left:6.25cqw;top:calc(var(--kopf-h) + 18px);display:flex;gap:8px;z-index:3}
.film__knopf{min-height:36px;padding:0 .95rem;font:inherit;font-size:.82rem;font-weight:550;color:var(--text);background:rgb(11 15 20/.55);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgb(242 239 233/.22);border-radius:999px;cursor:pointer}
.film__knopf:hover{border-color:var(--gold)}
.film__knopf[hidden]{display:none}
.nojs .film__steuer,.nojs .film__schiene{display:none}
.film__hinweis{position:absolute;left:50%;bottom:3.4cqh;transform:translateX(-50%);margin:0;display:flex;flex-direction:column;align-items:center;gap:8px;font-family:var(--mono);font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:rgb(242 239 233/.86);transition:opacity .4s}
.film__hinweis::after{content:"";width:1px;height:34px;background:linear-gradient(var(--gold),rgb(212 175 55/0));transform-origin:top;animation:hinweis 2.2s cubic-bezier(.6,0,.2,1) infinite}
.film__hinweis.ist-weg{opacity:0}
@keyframes hinweis{0%{transform:scaleY(0)}45%{transform:scaleY(1)}100%{transform:scaleY(1);opacity:0}}

/* Hochformat: Text unten über die ganze Breite, Schiene oben als Balken, Bedienung rechts oben */
@container (max-aspect-ratio: 1/1){
  .gt-verlauf--links,.gt-verlauf--rechts{background:linear-gradient(to top,rgb(6 8 7/.9) 0%,rgb(6 8 7/.8) 24%,rgb(6 8 7/.55) 40%,rgb(6 8 7/.22) 54%,rgb(6 8 7/0) 66%)}
  .gt-ki-verlauf{left:0;right:auto;width:80cqw;height:10cqh;background:radial-gradient(farthest-side at 0% 100%,rgb(6 8 7/.7) 0%,rgb(6 8 7/.42) 50%,rgb(6 8 7/0) 100%)}
  .gt-satz,.gt-satz[data-ort=rechts]{left:7cqw;right:7cqw;width:auto;bottom:9cqh}
  .gt-kopf{font-size:11cqw;max-width:11ch}
  .gt-satz[data-stil=daten] .gt-kopf{font-size:7.2cqw}
  .gt-satz[data-schluss]{left:0;right:0;width:auto;bottom:0}
  .gt-umbruch{display:none}
  .gt-satz[data-schluss] .gt-kopf{font-size:min(13.5cqw,7.6cqh);max-width:none}
  .gt-unter{margin-top:4cqw;font-size:4.3cqw}
  .gt-satz[data-schluss] .gt-unter{margin-top:5cqw;font-size:4.2cqw;max-width:78cqw;text-wrap:balance}
  .gt-ki{right:auto;left:7cqw;bottom:3.2cqh;font-size:max(10px,2.7cqw)}
  .film__schiene{left:16px;right:16px;top:calc(var(--kopf-h) + 8px);transform:none;flex-direction:row;gap:5px}
  .film__schiene::before,.film__schiene::after{display:none}
  .film__schiene li{flex:1}
  .film__schiene button{width:100%;min-height:24px;justify-content:stretch}
  .film__punkt{width:100%;height:3px;margin:0;border-radius:2px;box-shadow:none;background:rgb(242 239 233/.3)}
  .film__schiene button[aria-current="step"] .film__punkt{transform:none;background:var(--gold);box-shadow:0 0 10px rgb(212 175 55/.6)}
  .film__schiene button.ist-gesehen .film__punkt{background:rgb(212 175 55/.75);box-shadow:none}
  .film__marke{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);padding:0}
  .film__steuer{left:auto;right:16px;top:calc(var(--kopf-h) + 42px)}
  .film__hinweis{left:auto;right:7cqw;transform:none;bottom:3.2cqh}
}

/* Ohne JavaScript: Poster mit Slogan, keine Stationen */
.nojs .film__stationen{display:none}
.nojs .film__buehne{position:relative}
.nojs .film__hinweis{display:none}
.nojs .gt-nacht{opacity:.78}

/* ---------- K1 Was wir tun ---------- */
.k1{position:relative;background:var(--grund)}
.k1__szene{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;z-index:1;
  background:radial-gradient(60% 55% at 72% 46%,rgb(0 179 126/.10) 0%,rgb(0 179 126/0) 70%),radial-gradient(40% 40% at 20% 80%,rgb(212 175 55/.06) 0%,rgb(212 175 55/0) 70%),var(--grund)}
.k1__leinwand{position:absolute;inset:0;width:100%;height:100%;max-width:none;touch-action:pan-y;cursor:grab}
.k1__leinwand.ist-gezogen{cursor:grabbing}
.k1__griff{position:absolute;right:var(--rand);bottom:9svh;margin:0;font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:rgb(242 239 233/.8);opacity:0;transition:opacity .5s}
.k1__griff.ist-sichtbar{opacity:1}
.k1__griff::before{content:"";display:inline-block;width:26px;height:1px;margin:0 .7em .25em 0;background:var(--gold);vertical-align:middle}
.k1__technik{position:absolute;left:var(--rand);bottom:3svh;margin:0;font-family:var(--mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:rgb(242 239 233/.6)}
.k1__schritte{position:relative;z-index:2;margin-top:-100vh;margin-top:-100svh;pointer-events:none}
.k1__schritt{min-height:100vh;min-height:100svh;display:flex;align-items:center;padding:calc(var(--kopf-h) + 24px) var(--rand) 48px}
.karte{pointer-events:auto;max-width:33rem;padding:clamp(22px,2.6vw,38px);background:rgb(11 15 20/.66);-webkit-backdrop-filter:blur(16px) saturate(1.15);backdrop-filter:blur(16px) saturate(1.15);border:1px solid rgb(242 239 233/.1);border-radius:20px;box-shadow:0 30px 80px rgb(0 0 0/.35)}
.karte--glas{border-color:rgb(212 175 55/.38);box-shadow:inset 0 0 0 1px rgb(0 179 126/.14),0 30px 90px rgb(0 0 0/.4),0 0 60px rgb(0 179 126/.08)}
.k1__titel{margin:0 0 1rem;font-family:var(--serif);font-style:italic;font-weight:320;font-variation-settings:"opsz" 144;font-size:clamp(2.2rem,4.4vw,4.2rem);line-height:.98;letter-spacing:-.03em}
.k1__gross{margin:0;font-family:var(--serif);font-style:italic;font-weight:330;font-variation-settings:"opsz" 144;font-size:clamp(1.55rem,2.7vw,2.6rem);line-height:1.12;letter-spacing:-.02em;text-wrap:balance}
.k1__text{margin:0;color:rgb(242 239 233/.88);text-wrap:pretty}
.k1__zettel{display:flex;flex-wrap:wrap;gap:.5rem .55rem;margin:1.4rem 0 0;padding:0;list-style:none}
.k1__zettel li{padding:.42em .75em;font-family:var(--mono);font-size:.8rem;color:#17191C;background:#F2EFE9;border-radius:3px;box-shadow:0 6px 18px rgb(0 0 0/.35);transform:rotate(var(--r,0deg))}
.k1__zettel li:nth-child(1){--r:-2.2deg}.k1__zettel li:nth-child(2){--r:1.6deg}.k1__zettel li:nth-child(3){--r:-.8deg}.k1__zettel li:nth-child(4){--r:2.4deg}.k1__zettel li:nth-child(5){--r:-1.4deg}
.k1__felder{margin:1.4rem 0 0}
.k1__felder div{display:grid;grid-template-columns:7.2em 1fr;gap:.8rem;align-items:baseline;padding:.6em 0;border-top:1px solid var(--linie)}
.k1__felder dt{font-family:var(--mono);font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;color:rgb(242 239 233/.68)}
.k1__felder dd{margin:0;font-weight:520}
.k1__felder dd::before{content:"";display:inline-block;width:7px;height:7px;margin-right:.6em;border-radius:50%;background:var(--jade);box-shadow:0 0 10px rgb(0 179 126/.8);vertical-align:.1em}
.bewegt .k1.ist-bereit .k1__schritt .karte{opacity:.0;transform:translate3d(0,40px,0);transition:opacity .8s ease,transform 1s cubic-bezier(.2,.75,.2,1)}
.bewegt .k1.ist-bereit .k1__schritt.ist-aktiv .karte{opacity:1;transform:none}
.bewegt .k1.ist-bereit .k1__zettel li{opacity:0;transform:translate3d(0,24px,0) rotate(calc(var(--r) * 4));transition:opacity .6s ease,transform .9s cubic-bezier(.2,.8,.2,1.2)}
.bewegt .k1.ist-bereit .ist-aktiv .k1__zettel li{opacity:1;transform:rotate(var(--r))}
.bewegt .ist-aktiv .k1__zettel li:nth-child(2){transition-delay:.08s}.bewegt .ist-aktiv .k1__zettel li:nth-child(3){transition-delay:.16s}.bewegt .ist-aktiv .k1__zettel li:nth-child(4){transition-delay:.24s}.bewegt .ist-aktiv .k1__zettel li:nth-child(5){transition-delay:.32s}
@media (max-aspect-ratio:1/1){
  .k1__schritt{align-items:flex-end;padding-bottom:7svh}
  .karte{max-width:none;width:100%}
  /* Hochformat: Hinweis in eine zweite Zeile unter die Technikzeile, sonst laufen beide bei 390 px ineinander (blick_v3 15.10.2026) */
  .k1__griff{right:var(--rand);left:auto;top:calc(var(--kopf-h) + 18px + 2.3em);bottom:auto}
  .k1__technik{left:auto;right:var(--rand);top:calc(var(--kopf-h) + 18px);bottom:auto}
  /* Hochformat: die Kugel reicht bis an die beiden Zeilen oben rechts (Aufnahme 15.10., 45 bis 52 s); ein Hof allein reichte
     nicht (Aufnahme 19:35), deshalb liegen beide Zeilen auf einem dunklen Schild über der Leinwand */
  .k1__griff,.k1__technik{padding:.28em .6em;border-radius:3px;background:rgb(10 12 14/.74)}
}

/* ---------- K2 Warum das neu ist ---------- */
.k2{position:relative;height:300vh;height:300svh;background:var(--grund)}
.k2__buehne{position:sticky;top:0;height:100vh;height:100svh;display:grid;align-items:center;overflow:clip;padding:calc(var(--kopf-h) + 16px) var(--rand) 40px}
.k2__licht{position:absolute;inset:0;pointer-events:none;background:radial-gradient(42vmax 42vmax at var(--lx,62%) var(--ly,38%),rgb(0 179 126/.13) 0%,rgb(0 179 126/0) 62%),radial-gradient(30vmax 30vmax at calc(100% - var(--lx,62%)) calc(100% - var(--ly,38%)),rgb(212 175 55/.07) 0%,rgb(212 175 55/0) 65%)}
.k2__innen{position:relative;max-width:1180px}
.k2__titel{--wght:340;--opsz:144;margin:0 0 clamp(1.2rem,3vh,2.4rem);font-family:var(--serif);font-style:italic;font-weight:var(--wght);font-variation-settings:"opsz" var(--opsz);font-size:clamp(2.7rem,8.4vw,8.8rem);line-height:.9;letter-spacing:-.035em}
.k2__b{display:inline-block;will-change:transform}
.k2__wort{display:inline-block;white-space:nowrap}
.k2__zeilen{margin:0 0 clamp(1.2rem,3vh,2.2rem);font-size:clamp(1.25rem,2.5vw,2.25rem);line-height:1.2;font-weight:450;letter-spacing:-.01em}
.k2__zeile{display:block;overflow:clip;padding-bottom:.08em}
.k2__zeile>span{display:inline-block}
.k2__daten{font-family:var(--mono);font-weight:450;color:var(--jade);letter-spacing:-.03em}
.k2__satz{margin:0 0 clamp(1.4rem,3.4vh,2.6rem);max-width:30ch;font-family:var(--serif);font-style:italic;font-weight:330;font-variation-settings:"opsz" 144;font-size:clamp(1.4rem,2.6vw,2.5rem);line-height:1.15;letter-spacing:-.02em;color:var(--akzent)}
.k2__branche{margin:0;display:flex;flex-wrap:wrap;align-items:baseline;gap:.2em .6em;font-size:clamp(1rem,1.4vw,1.25rem);color:var(--leise)}
.k2__rolle{position:relative;display:inline-block;height:1.15em;overflow:clip;vertical-align:bottom;font-family:var(--serif);font-style:italic;font-weight:420;font-variation-settings:"opsz" 144;font-size:clamp(2rem,4.6vw,4.4rem);line-height:1.15;letter-spacing:-.03em;color:var(--gold)}
.k2__rolle-spur{display:flex;flex-direction:column;transition:transform .7s cubic-bezier(.7,0,.2,1)}
.k2__rolle-spur span{display:block;white-space:nowrap}
.ruhig .k2__rolle-spur{transition:none}

/* ---------- Fuß ---------- */
.fuss{padding:48px var(--rand) 56px;border-top:1px solid var(--linie);font-size:.9rem;color:var(--leise)}
.fuss p{margin:0 0 .4rem}
.fuss__klein{font-size:.8rem}

/* Reduzierte Bewegung: keine Parallaxe, keine Endlosbewegung, nur Überblendungen */
@media (prefers-reduced-motion: reduce){
  .film__bild{transform:none;transition:none}
  .film__hinweis::after{animation:none}
  .k2__rolle-spur,.film__schiene::after{transition:none}
}
.ruhig .film__bild{transform:none}
.gt-grundlinie{display:inline-block;width:0;height:0;vertical-align:baseline}

/* ======================================================================================================================
   Stufe 2 (Finn, 15.10.2026): Kapitelnavigation, Nähte zwischen den Kapiteln, K2 Walze rechts, K3 Glasräume,
   K4 Demo-Fächer, K5 Himmel mit Datenuhr, Fuß wie auf den Bestandsseiten. Werte, die JS setzt, kommen als
   Custom Properties über CSSOM (scharfe CSP, keine style-Attribute im HTML).
   ====================================================================================================================== */
@property --ring{syntax:"<angle>";inherits:false;initial-value:0deg}

/* ---------- Kapitelnavigation und Fortschritt ---------- */
.kapitel{position:fixed;right:clamp(10px,1.4vw,26px);top:50%;transform:translateY(-50%);z-index:55;opacity:0;visibility:hidden;transition:opacity .5s,visibility .5s}
.im-kapitel .kapitel,.nojs .kapitel{opacity:1;visibility:visible}
.kapitel__liste{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:2px}
.kapitel a{display:flex;align-items:center;justify-content:flex-end;gap:.55em;min-height:34px;padding:3px 4px;text-decoration:none;font-family:var(--mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--text)}
.kapitel__nr{order:2;display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;border:1px solid rgb(242 239 233/.28);background:rgb(11 15 20/.72);font-size:.6rem;letter-spacing:.04em;transition:background .3s,border-color .3s,color .3s}
.kapitel__name{padding:.25em .55em;border-radius:3px;background:rgb(11 15 20/.96);box-shadow:0 0 0 1px rgb(242 239 233/.12);opacity:0;transform:translateX(6px);transition:opacity .3s,transform .3s;white-space:nowrap}
/* Korrektur 16.10.2026 (Leitstand, Überlappungsprobe): Der Name erscheint nur noch beim Darüberfahren und beim Fokus,
   als deckendes Schild. Das selbsttätige Einblenden beim Kapitelwechsel (Stufe 3, 2,8 s) legte das Schild auf
   Seitentext: auf den Namen der Naht (1440 px, "Hausbeweis" über "Projektprüfung") und auf die Wörter der Walze in K2
   bei allen sechs geprüften Breiten. Das aktuelle Kapitel zeigt weiter der goldene Punkt. */
.kapitel a:hover .kapitel__name,.kapitel a:focus-visible .kapitel__name{opacity:1;transform:none}
.kapitel a[aria-current="true"] .kapitel__nr{background:var(--gold);border-color:var(--gold);color:#17191C}
.fortschritt{position:fixed;left:0;right:0;top:var(--kopf-h);height:2px;z-index:61;pointer-events:none}
.fortschritt__balken{display:block;height:100%;background:linear-gradient(90deg,var(--jade),var(--gold));transform-origin:0 50%;transform:scaleX(var(--fs,0))}
@media (max-width:899.98px),(max-aspect-ratio:1/1){.kapitel{display:none}}

/* ---------- Nähte zwischen den Kapiteln: Lichtlinie zieht sich mit dem Scrollen, Nummer und Name steigen auf ---------- */
.naht{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:clamp(12px,2vw,28px);min-height:34vh;min-height:34svh;padding:0 var(--rand);background:var(--grund);font-family:var(--mono);font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:rgb(242 239 233/.78)}
.naht__nr{font-family:var(--serif);font-style:italic;font-weight:330;font-variation-settings:"opsz" 144;font-size:clamp(2.4rem,5vw,4.6rem);line-height:1;letter-spacing:-.02em;text-transform:none;color:var(--gold)}
.naht__linie{position:relative;height:1px;background:rgb(242 239 233/.14)}
.naht__linie::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--gold),var(--jade));transform-origin:0 50%;transform:scaleX(var(--np,1))}
.naht__licht{position:absolute;top:0;left:calc(var(--np,1) * 100%);width:9px;height:9px;margin:-4px 0 0 -4px;border-radius:50%;background:#fff;box-shadow:0 0 12px 4px rgb(212 175 55/.75),0 0 40px 12px rgb(0 179 126/.3);opacity:var(--nl,0)}
.bewegt .naht__nr,.bewegt .naht__name{opacity:var(--no,1);transform:translateY(calc((1 - var(--no,1)) * 18px))}
/* Korrektur 16.10.2026 (Leitstand): Die Naht hält rechts die Kapitelschiene frei, auch für das längste Schild.
   --schiene misst kapitel.js (Fensterbreite minus linke Kante der Schiene), Rückfall ohne JS 260 px. Nur dort, wo die
   Schiene steht (gleiche Grenze wie .kapitel{display:none}). */
@media (min-width:900px) and (min-aspect-ratio:1/1){.naht{padding-right:calc(var(--schiene,260px) + 24px)}}

/* ---------- K2: Walze der drei Datenwörter füllt am Rechner die rechte Hälfte ---------- */
.k2__trommel{display:none}
@media (min-width:1100px) and (min-aspect-ratio:1/1){
  .k2__innen{max-width:min(1180px,56vw)}
  .k2__trommel{display:block;position:absolute;right:var(--rand);top:50%;width:32vw;height:64vh;transform:translateY(-50%);perspective:1100px;pointer-events:none}
  .k2__walze{position:absolute;inset:0;transform-style:preserve-3d;transform:rotateY(var(--wy,-16deg)) rotateX(var(--wr,0deg))}
  .k2__walze span{position:absolute;left:0;right:0;top:50%;height:1.2em;margin-top:-.6em;text-align:right;font-family:var(--mono);font-weight:450;font-size:clamp(3rem,5.6vw,6.6rem);line-height:1.2;letter-spacing:-.04em;color:transparent;-webkit-text-stroke:1px rgb(0 179 126/.5);backface-visibility:hidden;transform:rotateX(calc(var(--i) * -60deg)) translateZ(23vh);transition:color .4s,text-shadow .4s}
  .k2__walze span:nth-child(1){--i:0}.k2__walze span:nth-child(2){--i:1}.k2__walze span:nth-child(3){--i:2}
  .k2__walze span:nth-child(4){--i:3}.k2__walze span:nth-child(5){--i:4}.k2__walze span:nth-child(6){--i:5}
  .k2__walze span.ist-vorn{color:var(--jade);-webkit-text-stroke:0;text-shadow:0 0 42px rgb(0 179 126/.35)}
}

/* ---------- K3 Leistungen: drei Glasräume ---------- */
.k3{position:relative;background:var(--grund)}
.k3__szene{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;z-index:1;background:radial-gradient(70% 60% at 50% 42%,rgb(0 179 126/.10) 0%,rgb(0 179 126/0) 70%),var(--grund)}
.k3__platz{position:absolute;inset:0}
.k3__platz canvas{position:absolute;inset:0;width:100%;height:100%;max-width:none;touch-action:pan-y}
.k3__platz.ohne-gl{background:center/cover no-repeat url("media/station-4-quer-1280.webp");opacity:.55}
.k3__technik,.k3__ki{position:absolute;bottom:3svh;margin:0;padding:.28em .6em;border-radius:3px;background:rgb(11 15 20/.74);font-family:var(--mono);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:rgb(242 239 233/.72)}
.k3__technik{left:var(--rand)}
.k3__ki{right:var(--rand)}
.k3__schritte{position:relative;z-index:2;margin-top:-100vh;margin-top:-100svh;pointer-events:none}
.k3__schritt{min-height:100vh;min-height:100svh;display:flex;align-items:center;justify-content:flex-start;padding:calc(var(--kopf-h) + 24px) var(--rand) 48px}
.k3__schritt:nth-child(even){justify-content:flex-end}
.k3__karte{position:relative;transform:perspective(900px) rotateX(var(--kx,0deg)) rotateY(var(--ky,0deg));transition:transform .3s ease-out,opacity .8s ease,translate 1s cubic-bezier(.2,.75,.2,1)}
.k3__karte::before{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1px;pointer-events:none;background:conic-gradient(from var(--ring),transparent 0 66%,rgb(212 175 55/.95) 78%,rgb(0 179 126/.95) 88%,transparent 97%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);opacity:var(--go,0);transition:opacity .35s}
.k3__karte::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(380px circle at var(--gx,50%) var(--gy,0%),rgb(255 255 255/.09),rgb(255 255 255/0) 50%);opacity:var(--go,0);transition:opacity .35s}
.bewegt .k3__karte:hover::before{animation:k3-ring 3.6s linear infinite}
@keyframes k3-ring{to{--ring:360deg}}
.bewegt .k3.ist-bereit .k3__schritt .karte{opacity:0;translate:0 40px}
.bewegt .k3.ist-bereit .k3__schritt.ist-aktiv .karte{opacity:1;translate:0 0}
.k3__titel{margin:0 0 1rem;font-family:var(--serif);font-style:italic;font-weight:320;font-variation-settings:"opsz" 144;font-size:clamp(2.2rem,4.4vw,4.2rem);line-height:.98;letter-spacing:-.03em}
.k3__gross{margin:0 0 1rem;font-family:var(--serif);font-style:italic;font-weight:330;font-variation-settings:"opsz" 144;font-size:clamp(1.5rem,2.5vw,2.4rem);line-height:1.12;letter-spacing:-.02em;text-wrap:balance}
.k3__text{margin:0;color:rgb(242 239 233/.88);text-wrap:pretty}
.k3__label{display:block;margin:1.2rem 0 .45rem;font-family:var(--mono);font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;color:var(--akzent)}
.k3__eingabe{width:100%;min-height:48px;padding:.5em .8em;border-radius:10px;border:1px solid rgb(0 179 126/.55);background:rgb(5 8 12/.7);color:var(--text);font:inherit;font-size:1.1rem}
.k3__eingabe::placeholder{color:rgb(242 239 233/.55)}
.k3__eingabe:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.k3__leise{margin:.5rem 0 0;font-size:.82rem;color:var(--leise)}
.k3__mehr{margin:1rem 0 0;font-size:.95rem}
.k3__mehr a{color:var(--akzent);text-decoration-color:rgb(212 175 55/.6);text-underline-offset:.2em}
@media (max-aspect-ratio:1/1){
  .k3__schritt,.k3__schritt:nth-child(even){align-items:flex-end;justify-content:stretch;padding-bottom:7svh}
  .k3__technik{left:auto;right:var(--rand);top:calc(var(--kopf-h) + 18px);bottom:auto}
  .k3__ki{right:var(--rand);top:calc(var(--kopf-h) + 18px + 2.3em);bottom:auto}
}

/* ---------- K4 Demos im Musterbetrieb: CSS-3D-Fächer ---------- */
.k4{position:relative;padding:clamp(64px,10vh,120px) 0 clamp(56px,9vh,110px);background:radial-gradient(70% 50% at 50% 62%,rgb(212 175 55/.07) 0%,rgb(212 175 55/0) 70%),var(--grund);overflow:clip}
.k4__innen{padding:0 var(--rand)}
.k4__kopf{max-width:46rem;margin:0 0 clamp(24px,5vh,56px)}
.k4__titel{margin:0 0 1rem;font-family:var(--serif);font-style:italic;font-weight:320;font-variation-settings:"opsz" 144;font-size:clamp(2.4rem,5.4vw,5.2rem);line-height:.96;letter-spacing:-.03em}
.k4__text{margin:0;max-width:38rem;color:rgb(242 239 233/.88)}
.k4__buehne{position:relative;perspective:1400px;perspective-origin:50% 35%;touch-action:pan-y;-webkit-user-select:none;user-select:none}
.k4__faecher{position:relative;height:clamp(400px,64vh,640px);margin:0;padding:0;list-style:none;transform-style:preserve-3d}
.k4__karte{--kb:min(78vw,540px);position:absolute;left:50%;top:0;width:var(--kb);margin-left:calc(var(--kb) / -2);transform-style:preserve-3d;transform:translate3d(var(--tx,0px),0,var(--tz,0px)) rotateY(var(--ry,0deg));opacity:var(--op,1);z-index:var(--zi,1)}
.k4__rahmen{display:block;width:100%;padding:10px;border-radius:22px;border:1px solid rgb(242 239 233/.18);background:linear-gradient(135deg,rgb(255 255 255/.12),rgb(255 255 255/.03));-webkit-backdrop-filter:blur(14px) saturate(1.3);backdrop-filter:blur(14px) saturate(1.3);box-shadow:inset 0 1px 0 rgb(255 255 255/.28),inset 0 -1px 0 rgb(0 0 0/.3),0 40px 80px rgb(0 0 0/.45);color:inherit;font:inherit;cursor:pointer}
.k4__fenster{display:block;aspect-ratio:16/10;overflow:hidden;border-radius:14px;background:#11161d}
.k4__bild{width:100%;height:auto;max-width:none;transform:translateY(var(--sy,0px));transition:transform 6s cubic-bezier(.45,0,.2,1)}
.k4__unter{margin-top:14px;text-align:center;opacity:var(--uo,1)}
.k4__name{margin:0;font-family:var(--mono);font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--jade)}
.k4__satz{margin:.3rem 0 0;font-family:var(--serif);font-style:italic;font-weight:340;font-variation-settings:"opsz" 144;font-size:clamp(1.1rem,1.6vw,1.45rem);line-height:1.2}
.k4__steuer{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:clamp(16px,3vh,32px)}
.k4__pfeil{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;border:1px solid rgb(242 239 233/.28);background:rgb(11 15 20/.6);color:var(--text);font-size:1.15rem;cursor:pointer}
.k4__zaehler{margin:0;min-width:6em;text-align:center;font-family:var(--mono);font-size:.8rem;letter-spacing:.12em;color:var(--leise)}
.nojs .k4__faecher{height:auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px}
.nojs .k4__karte{position:relative;left:auto;margin:0;width:auto;transform:none}
.nojs .k4__steuer{display:none}
.k4__gross{width:min(1180px,94vw);max-width:none;max-height:92vh;padding:0;border:1px solid rgb(242 239 233/.18);border-radius:22px;background:rgb(11 15 20/.94);color:var(--text);overflow:hidden}
.k4__gross[open]{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr)}
.k4__gross::backdrop{background:rgb(5 7 10/.74);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.k4__gross-rahmen{max-height:92vh;overflow:auto;padding:12px;overscroll-behavior:contain}
.k4__gross-bild{width:100%;height:auto;border-radius:12px}
.k4__gross-text{align-self:center;padding:clamp(20px,3vw,40px)}
.k4__gross-titel{margin:0 0 .6rem;font-family:var(--serif);font-style:italic;font-weight:330;font-variation-settings:"opsz" 144;font-size:clamp(1.8rem,3vw,2.8rem);line-height:1}
.k4__gross-links{display:flex;flex-wrap:wrap;gap:10px;margin:1.4rem 0 0}
.knopf{display:inline-flex;align-items:center;min-height:44px;padding:0 1.2em;border-radius:999px;border:0;background:var(--gold);color:#17191C;font:inherit;font-weight:600;text-decoration:none;cursor:pointer}
.knopf--leise{background:transparent;color:var(--text);border:1px solid rgb(242 239 233/.32)}
::view-transition-group(k4-demo){animation-duration:.55s;animation-timing-function:cubic-bezier(.2,.8,.2,1)}
@media (max-aspect-ratio:1/1){
  .k4__gross[open]{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto;overflow:auto}
  .k4__gross-rahmen{max-height:58vh}
}

/* ---------- K5 Hausbeweis: Himmel im Shader, Datenuhr ---------- */
.k5{position:relative;height:420vh;height:420svh;background:#05070B}
.k5__szene{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:clamp(20px,4vw,64px);padding:calc(var(--kopf-h) + 20px) var(--rand) 28px}
.k5__himmel{position:absolute;inset:0;background:linear-gradient(180deg,#081428 0%,#16294a 58%,#2a2416 100%)}
.k5__himmel canvas{position:absolute;inset:0;width:100%;height:100%;max-width:none}
.k5__karte{position:relative;grid-column:1;grid-row:1;max-width:34rem}
.k5__uhr-platz{position:relative;grid-column:2;grid-row:1;justify-self:center;width:min(38vw,60vh);aspect-ratio:1}
.k5__uhr{display:block;width:100%;height:100%;overflow:visible}
.k5__ring{fill:rgb(11 15 20/.46);stroke:rgb(242 239 233/.38);stroke-width:1}
.k5__strich{stroke:rgb(242 239 233/.42);stroke-width:1}
.k5__strich--gross{stroke:rgb(242 239 233/.85);stroke-width:1.6}
.k5__ziffer{fill:rgb(242 239 233/.8);font-family:var(--mono);font-size:8px;text-anchor:middle;dominant-baseline:central}
.k5__marke circle{fill:#0B0F14;stroke:var(--jade);stroke-width:1.6;transition:fill .4s}
.k5__marke.ist-fertig circle{fill:var(--jade)}
.k5__zeiger{stroke:var(--gold);stroke-width:2.2;stroke-linecap:round}
.k5__nabe,.k5__jetzt path{fill:var(--gold)}
.k5__zeit{position:absolute;left:50%;top:64%;transform:translateX(-50%);margin:0;padding:.2em .6em;border-radius:4px;background:rgb(11 15 20/.66);font-family:var(--mono);font-size:clamp(1rem,1.6vw,1.4rem);letter-spacing:.08em}
.k5__titel{margin:0 0 1rem;font-family:var(--serif);font-style:italic;font-weight:320;font-variation-settings:"opsz" 144;font-size:clamp(2rem,3.8vw,3.8rem);line-height:.98;letter-spacing:-.03em}
.k5__text{margin:0;color:rgb(242 239 233/.88)}
.k5__laeufe{display:grid;gap:6px;margin:1.1rem 0 .9rem;padding:0;list-style:none}
.k5__laeufe button{display:grid;grid-template-columns:4.2em minmax(0,1fr) 24px;align-items:center;gap:.8em;width:100%;min-height:40px;padding:.3em .7em;border-radius:9px;border:1px solid var(--linie);background:rgb(11 15 20/.5);color:var(--text);font:inherit;text-align:left;cursor:pointer;transition:border-color .3s,background .3s}
.k5__laeufe button.ist-fertig{border-color:rgb(0 179 126/.55);background:rgb(0 179 126/.1)}
.k5__laeufe button.ist-jetzt{border-color:var(--gold)}
.k5__uhrzeit{font-family:var(--mono);font-size:.85rem;color:var(--akzent)}
.k5__haken{position:relative;width:22px;height:22px;justify-self:end;border-radius:50%;border:1.5px solid rgb(242 239 233/.4)}
.k5__haken::after{content:"";position:absolute;left:6px;top:2.5px;width:6px;height:11px;border:solid #0B0F14;border-width:0 2px 2px 0;transform:rotate(45deg) scale(0);transition:transform .35s cubic-bezier(.3,1.6,.5,1) .3s}
.ist-fertig .k5__haken{background:var(--jade);border-color:var(--jade)}
.bewegt .ist-fertig .k5__haken{animation:k5-leiste .55s ease-out}
.ist-fertig .k5__haken::after{transform:rotate(45deg) scale(1)}
@keyframes k5-leiste{0%{transform:scale(1)}40%{transform:scale(1.9,.5);border-radius:6px}100%{transform:scale(1)}}
.k5__leise{margin:0;font-size:.85rem;color:var(--leise)}
@media (max-aspect-ratio:1/1){
  .k5__szene{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);align-items:start;align-content:start;gap:10px;padding-top:calc(var(--kopf-h) + 12px)}
  .k5__uhr-platz{grid-column:1;grid-row:1;width:min(52vw,24vh)}
  .k5__karte{grid-column:1;grid-row:2;max-width:none;padding:18px}
  .k5__text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  .k5__titel{font-size:clamp(1.8rem,8vw,2.4rem)}
  .k5__zeit{top:auto;bottom:-6px;font-size:.9rem}
}

/* ---------- Fuß wie auf den Bestandsseiten ---------- */
.fuss__innen{display:grid;gap:.9rem;max-width:1180px}
.fuss__marke{margin:0;color:var(--text)}
.fuss__kurz{font-weight:650;letter-spacing:.14em}
.fuss__unter{color:var(--leise)}
.fuss__adresse{display:grid;gap:.2rem;font-style:normal}
.fuss__links{display:flex;flex-wrap:wrap;gap:.4rem 1.4rem;margin:0;padding:0;list-style:none}
.fuss__links a,.fuss__adresse a{color:var(--text);text-decoration-color:rgb(212 175 55/.6);text-underline-offset:.2em}
.fuss__links a{display:inline-flex;align-items:center;min-height:32px}

@media (prefers-reduced-motion: reduce){
  .k4__bild,.k3__karte{transition:none}
  .k3__karte:hover::before{animation:none}
}

/* ======================================================================================================================
   Stufe 3 (Finn, 16.10.2026): K6 Projektprüfung (CSS Scroll-driven Animations), K7 Flug auf die Deutschlandkarte
   (WebGL2), K8 Glasstapel mit KI-Lichtkörper (CSS), K9 Termin in Liquid Glass. Werte aus dem Skript nur als
   Custom Properties über CSSOM (scharfe CSP).
   ====================================================================================================================== */

/* ---------- K6 Projektprüfung ---------- */
.k6{position:relative;background:radial-gradient(60% 45% at 28% 58%,rgb(0 179 126/.07) 0%,rgb(0 179 126/0) 70%),var(--grund)}
.k6__lauf{position:relative}
.k6__szene{display:grid;grid-template-columns:minmax(0,1fr) minmax(17rem,21rem);grid-template-rows:auto minmax(0,1fr);gap:clamp(14px,2.2vh,26px) clamp(24px,3vw,52px);padding:calc(var(--kopf-h) + 26px) var(--rand) 36px}
.js.bewegt .k6__lauf{height:300vh;height:300svh;view-timeline:--k6 block}
.js.bewegt .k6__szene{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden}
.k6__kopf{grid-column:1;grid-row:1;max-width:54rem}
.k6__titel{margin:0 0 .7rem;font-family:var(--serif);font-style:italic;font-weight:320;font-variation-settings:"opsz" 144;font-size:clamp(2rem,3.6vw,3.6rem);line-height:.98;letter-spacing:-.03em;text-wrap:balance}
.k6__maschine,.k7__maschine,.k9__maschine{margin:0 0 .8rem;font-family:var(--mono);font-size:.76rem;line-height:1.5;letter-spacing:.03em;color:var(--akzent)}
.k6__text{margin:0;max-width:46rem;color:rgb(242 239 233/.88);text-wrap:pretty}
.k6__text--nach{display:none}
.k6__weg-rahmen{grid-column:1;grid-row:2;container-type:size;min-height:0;display:grid;place-items:center}
.ruhig .k6__weg-rahmen,.nojs .k6__weg-rahmen{height:clamp(240px,30vw,460px)}
.k6__weg{position:relative;width:min(100cqw,calc(100cqh * 1200 / 420));aspect-ratio:1200/420}
.k6__svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.k6__svg--hoch{display:none}
.k6__bahn{fill:none;stroke:rgb(242 239 233/.2);stroke-width:2;stroke-dasharray:2 7;stroke-linecap:round}
.k6__linie{fill:none;stroke-width:3.2;stroke-linecap:round;stroke-dasharray:1 1;stroke-dashoffset:calc(1 - var(--k6q,1))}
.k6__svg--quer .k6__linie{stroke:url(#k6-verlauf-q)}
.k6__svg--hoch .k6__linie{stroke:url(#k6-verlauf-h)}
@supports (animation-timeline: view()) and (animation-range: contain 0% contain 100%){
  .js.bewegt .k6__linie{animation:k6-zug linear both;animation-timeline:--k6;animation-range:contain 5% contain 80%}
  @keyframes k6-zug{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
}
.k6__stapel rect{fill:#E9E3D6;stroke:rgb(11 15 20/.5);stroke-width:1}
.k6__akte{opacity:0;transition:opacity .3s}
.k6__akte.ist-unterwegs{opacity:1}
.k6__akte rect{fill:#F2EFE9;stroke:var(--gold);stroke-width:1.5}
.k6__akte path{fill:none;stroke:rgb(11 15 20/.55);stroke-width:2;stroke-linecap:round}
.k6__stempel{fill:var(--jade);opacity:0;transform-box:fill-box;transform-origin:center;transform:scale(.3);transition:opacity .25s,transform .45s cubic-bezier(.3,1.7,.5,1)}
.k6__stempel.ist-da{opacity:1;transform:none}
.k6__eingang{position:absolute;left:2.5%;top:calc(54.76% + 30px);margin:0;transform:translateX(-12%);font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--leise)}
.k6__stationen{position:absolute;inset:0;margin:0;padding:0;list-style:none;counter-reset:k6}
.k6__station{position:absolute;left:var(--sx);top:var(--sy);width:0;height:0;counter-increment:k6}
.k6__station--1{--sx:18.333%;--sy:28.571%}
.k6__station--2{--sx:37.5%;--sy:59.524%}
.k6__station--3{--sx:56.667%;--sy:26.19%}
.k6__station--4{--sx:75%;--sy:57.143%}
.k6__punkt{position:absolute;left:-22px;top:-22px;display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:none;color:var(--text);font:inherit;cursor:pointer}
.k6__nr{position:relative;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;border:1.5px solid rgb(242 239 233/.45);background:#0B0F14;font-family:var(--mono);font-size:.74rem;transition:background .35s,border-color .35s,box-shadow .35s}
.k6__nr::before{content:counter(k6)}
.k6__station.ist-geprueft .k6__nr{background:var(--jade);border-color:var(--jade);color:#04110c}
.k6__station.ist-geprueft .k6__nr::before{content:"";width:6px;height:11px;margin-top:-3px;border:solid #04110c;border-width:0 2px 2px 0;transform:rotate(45deg)}
.k6__station.ist-jetzt .k6__nr{box-shadow:0 0 0 6px rgb(0 179 126/.22),0 0 30px rgb(0 179 126/.5)}
.k6__name{position:absolute;left:50%;width:max-content;max-width:11.5rem;transform:translateX(-50%);font-family:var(--mono);font-size:.72rem;line-height:1.35;letter-spacing:.06em;text-transform:uppercase;text-align:center;color:rgb(242 239 233/.86);pointer-events:none}
.k6__station--1 .k6__name,.k6__station--3 .k6__name{bottom:44px}
.k6__station--2 .k6__name,.k6__station--4 .k6__name{top:44px}
.k6__info{position:absolute;left:50%;z-index:3;width:16rem;margin:0;padding:.75rem .9rem;border-radius:12px;border:1px solid rgb(0 179 126/.45);background:rgb(8 12 16/.94);font-size:.86rem;line-height:1.45;color:var(--text);transform:translate(-50%,6px);opacity:0;visibility:hidden;transition:opacity .2s,transform .25s,visibility .2s;pointer-events:none}
.k6__info-kopf{display:block;margin-bottom:.25rem;font-family:var(--mono);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--jade)}
.k6__station--1 .k6__info,.k6__station--3 .k6__info{top:30px}
.k6__station--2 .k6__info,.k6__station--4 .k6__info{bottom:30px}
.k6__punkt:hover+.k6__info,.k6__punkt:focus-visible+.k6__info,.k6__station.ist-offen .k6__info{opacity:1;visibility:visible;transform:translate(-50%,0)}
.k6__bericht{grid-column:2;grid-row:1 / span 2;align-self:center;max-width:none;width:100%;padding:clamp(18px,2vw,28px)}
.k6__bericht .kicker{margin-bottom:.35rem}
.k6__leise{margin:0;font-size:.8rem;color:var(--leise)}
.k6__befunde{display:flex;flex-direction:column;gap:10px;margin:.9rem 0 0;padding:0;list-style:none}
.k6__eintrag{opacity:0;transform:translateY(16px) scale(.97);transition:opacity .5s,transform .6s cubic-bezier(.2,.8,.2,1)}
.k6__eintrag.ist-da{opacity:1;transform:none}
.nojs .k6__eintrag{opacity:1;transform:none}
.k6__befund{position:relative;display:block;width:100%;padding:0;border:0;border-radius:12px;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer;perspective:700px}
.k6__seite{display:flex;align-items:center;justify-content:space-between;gap:.6em;min-height:58px;padding:.55em .9em;border-radius:12px;border:1px solid var(--linie);background:rgb(14 19 25/.9);-webkit-backface-visibility:hidden;backface-visibility:hidden;transition:transform .6s cubic-bezier(.3,1.25,.5,1)}
.k6__seite--hinten{position:absolute;inset:0;transform:rotateX(180deg);flex-direction:column;align-items:flex-start;justify-content:center;gap:.1em}
.k6__hname{font-size:.74rem;line-height:1.25;color:rgb(242 239 233/.78)}
.k6__befund[aria-pressed="true"] .k6__seite--vorn{transform:rotateX(-180deg)}
.k6__befund[aria-pressed="true"] .k6__seite--hinten{transform:rotateX(0deg)}
.k6__bpunkt{font-size:.92rem;line-height:1.3}
.k6__dreh{flex:none;font-family:var(--mono);font-size:.64rem;letter-spacing:.12em;text-transform:uppercase;color:var(--akzent)}
.k6__stand{font-family:var(--mono);font-size:.82rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
.k6__seite--fehlt{border-color:rgb(229 72 77/.6);background:rgb(54 16 20/.95)}
.k6__seite--fehlt .k6__stand{color:#FF8A8E}
.k6__seite--veraltet{border-color:rgb(212 175 55/.6);background:rgb(43 35 12/.95)}
.k6__seite--veraltet .k6__stand{color:#F0D27A}
.k6__seite--vorhanden{border-color:rgb(0 179 126/.6);background:rgb(5 40 30/.95)}
.k6__seite--vorhanden .k6__stand{color:#5EE6B5}
.k6__nach{padding:clamp(20px,4vh,40px) var(--rand) clamp(56px,9vh,110px)}
.k6__hinweis{max-width:62rem;margin:0;padding:clamp(16px,2vw,24px);border-left:2px solid var(--gold);background:rgb(242 239 233/.04);font-size:.9rem;line-height:1.6;color:rgb(242 239 233/.82)}
.k6__mehr,.k7__mehr,.k8__mehr{margin:1rem 0 0;font-size:.95rem}
.k6__mehr a,.k7__mehr a,.k8__mehr a,.k7__quelle a{color:var(--akzent);text-decoration-color:rgb(212 175 55/.6);text-underline-offset:.2em}
@media (max-aspect-ratio:1/1){
  .js.bewegt .k6__lauf{height:280svh}
  .k6__szene{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto;gap:10px;padding:calc(var(--kopf-h) + 14px) var(--rand) 16px}
  .k6__titel{font-size:clamp(1.7rem,7.4vw,2.4rem)}
  .k6__maschine{font-size:.7rem;margin-bottom:0}
  .js .k6__text--szene{display:none}
  .js .k6__text--nach{display:block;margin:0 0 1.2rem}
  .k6__weg-rahmen{justify-items:start}
  .ruhig .k6__weg-rahmen,.nojs .k6__weg-rahmen{height:min(110vw,520px)}
  .k6__weg{width:min(100cqw,calc(100cqh * 360 / 1000));aspect-ratio:360/1000}
  .k6__svg--quer{display:none}
  .k6__svg--hoch{display:block}
  .k6__eingang{left:16.67%;top:2%;transform:translate(26px,-50%)}
  .k6__station--1{--sx:41.667%;--sy:17%}
  .k6__station--2{--sx:19.444%;--sy:38%}
  .k6__station--3{--sx:44.444%;--sy:59%}
  .k6__station--4{--sx:19.444%;--sy:80%}
  .k6__station .k6__name{top:50%;bottom:auto;left:50px;max-width:min(52vw,13rem);transform:translateY(-50%);text-align:left;font-size:.68rem}
  .k6__station .k6__info{top:26px;bottom:auto;left:20px;width:min(70vw,17rem);transform:translate(0,6px)}
  .k6__punkt:hover+.k6__info,.k6__punkt:focus-visible+.k6__info,.k6__station.ist-offen .k6__info{transform:none}
  .k6__bericht{grid-column:1;grid-row:3;padding:12px 14px}
  .k6__bericht .k6__leise{font-size:.72rem}
  .k6__befunde{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:.5rem}
  .k6__seite{min-height:50px;padding:.4em .6em}
  .k6__bpunkt{font-size:.74rem}
  .k6__dreh{display:none}
  .k6__stand{font-size:.72rem}
  .k6__hname{font-size:.64rem}
}

/* ---------- K7 Für Energieunternehmen: Flug auf die Karte ---------- */
.k7{position:relative;background:#06080c}
.k7__szene{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;z-index:1;background:radial-gradient(80% 60% at 60% 70%,rgb(212 175 55/.07) 0%,rgb(212 175 55/0) 70%),#06080c}
.k7__platz{position:absolute;inset:0}
.k7__platz canvas{position:absolute;inset:0;width:100%;height:100%;max-width:none;touch-action:pan-y;cursor:grab}
.k7__platz canvas:active{cursor:grabbing}
.k7__svg{position:absolute;right:6%;top:12%;width:44%;height:78%}
.k7__svg-umriss{fill:rgb(0 179 126/.06);stroke:var(--gold);stroke-width:.02}
.k7__svg-punkt{fill:var(--akzent);opacity:.7}
.k7__svg-punkt.ist-gewaehlt{fill:var(--jade);opacity:1}
.k7__film{position:absolute;inset:0;z-index:1}
.k7__video{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover}
.k7__technik,.k7__legende,.k7__ki{position:absolute;bottom:3svh;z-index:2;margin:0;padding:.28em .6em;border-radius:3px;background:rgb(11 15 20/.74);font-family:var(--mono);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:rgb(242 239 233/.72)}
.k7__technik{left:var(--rand)}
.k7__technik:empty{display:none}
.k7__legende{right:var(--rand);max-width:min(26rem,60vw);text-align:right;opacity:0;transition:opacity .6s}
.k7__legende.ist-da{opacity:1}
.k7__ki{right:var(--rand);bottom:calc(3svh + 2.4em)}
.k7__tipp{position:absolute;left:0;top:0;z-index:3;margin:0;padding:.3em .6em;border-radius:6px;background:rgb(8 12 16/.92);border:1px solid rgb(0 179 126/.5);font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;white-space:nowrap;color:var(--text);opacity:0;transition:opacity .2s;pointer-events:none}
.k7__tipp.ist-da{opacity:1}
.k7__schritte{position:relative;z-index:2;margin-top:-100vh;margin-top:-100svh;pointer-events:none}
.k7__schritt{min-height:100vh;min-height:100svh;display:flex;align-items:center;justify-content:flex-start;padding:calc(var(--kopf-h) + 24px) var(--rand) 48px}
.k7__schritt:nth-child(2){justify-content:flex-end}
.k7__schritt--suche{min-height:150vh;min-height:150svh;align-items:flex-start}
.k7__suche{position:sticky;top:calc(var(--kopf-h) + 24px);max-width:31rem}
.k7__titel{margin:0 0 1rem;font-family:var(--serif);font-style:italic;font-weight:320;font-variation-settings:"opsz" 144;font-size:clamp(2.2rem,4.4vw,4.2rem);line-height:.98;letter-spacing:-.03em;text-wrap:balance}
.k7__klein-titel{margin:0 0 .8rem;font-family:var(--serif);font-style:italic;font-weight:330;font-variation-settings:"opsz" 144;font-size:clamp(1.5rem,2.4vw,2.3rem);line-height:1.1;letter-spacing:-.02em;text-wrap:balance}
.k7__text{margin:0;color:rgb(242 239 233/.88)}
.k7__gross{margin:0;font-family:var(--serif);font-style:italic;font-weight:330;font-variation-settings:"opsz" 144;font-size:clamp(1.5rem,2.5vw,2.4rem);line-height:1.15;letter-spacing:-.02em;text-wrap:balance}
.k7__plz-titel{margin:0 0 .3rem;font-family:var(--mono);font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--jade)}
.k7__frage{margin:0 0 .8rem;font-size:.95rem;color:rgb(242 239 233/.88)}
.k7__zeile{display:flex;gap:10px}
.k7__eingabe{flex:1;min-width:0;min-height:48px;padding:.5em .8em;border-radius:10px;border:1px solid rgb(0 179 126/.55);background:rgb(5 8 12/.75);color:var(--text);font-family:var(--mono);font-size:1.15rem;letter-spacing:.18em}
.k7__eingabe::placeholder{font-family:var(--sans);letter-spacing:0;font-size:1rem;color:rgb(242 239 233/.55)}
.k7__eingabe[aria-invalid="true"]{border-color:#E5484D}
.k7__zeile .knopf{min-height:48px}
.k7__ergebnis{min-height:2.6em;margin:.8rem 0 .4rem}
.k7__ergebnis p{margin:0}
.k7__meldung{font-size:.92rem;color:rgb(242 239 233/.86)}
.k7__meldung--fehler{color:#FF9A9D}
.k7__liste{display:grid;gap:6px;margin:0;padding:0;list-style:none}
.k7__treffer{display:grid;gap:.1rem;padding:.55em .75em;border-radius:10px;border:1px solid rgb(0 179 126/.5);background:rgb(0 179 126/.1)}
.k7__treffer strong{font-weight:600}
.k7__weg,.k7__stand{font-family:var(--mono);font-size:.74rem;letter-spacing:.04em;color:var(--akzent)}
.k7__stand{margin-top:.35rem!important}
.k7__quelle{margin:.5rem 0 0;font-size:.76rem;line-height:1.45;color:var(--leise)}
@media (max-aspect-ratio:1/1){
  .k7__schritt,.k7__schritt:nth-child(2){align-items:flex-end;justify-content:stretch;padding-bottom:7svh}
  .k7__schritt--suche{align-items:flex-start;padding-top:calc(var(--kopf-h) + 10px)}
  .k7__suche{top:calc(var(--kopf-h) + 10px);max-width:none;padding:16px}
  .k7__suche .k7__frage{font-size:.86rem;margin-bottom:.6rem}
  .k7__suche .k7__quelle{font-size:.68rem}
  .k7__technik{left:var(--rand);right:auto;top:calc(var(--kopf-h) + 18px);bottom:auto;max-width:calc(100% - 2 * var(--rand));font-size:.58rem}
  .k7__legende{left:var(--rand);right:var(--rand);max-width:none;text-align:left;font-size:.6rem}
  .k7__svg{left:10%;right:auto;top:auto;bottom:6%;width:80%;height:52%}
}

/* ---------- K8 Über JMEC: Glasstapel und Lichtkörper ---------- */
@property --k8w{syntax:"<angle>";inherits:false;initial-value:0deg}
.k8{position:relative;padding:clamp(64px,10vh,120px) 0 clamp(40px,8vh,96px);background:radial-gradient(45% 40% at 22% 30%,rgb(0 179 126/.09) 0%,rgb(0 179 126/0) 70%),var(--grund)}
.k8__innen{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(28px,5vw,88px);padding:0 var(--rand)}
.k8__seite{position:sticky;top:calc(var(--kopf-h) + 36px);align-self:start;display:grid;gap:28px}
.k8__orb-platz{width:clamp(150px,15vw,230px);aspect-ratio:1;translate:var(--ox,0px) var(--oy,0px)}
.k8__orb{position:relative;display:grid;place-items:center;width:100%;height:100%;scale:calc(1 + var(--atem,0) * .2)}
.k8__orb::before{content:"";position:absolute;inset:-4%;border-radius:50%;background:conic-gradient(from var(--k8w),#D4AF37,#00B37E,#DCCAA8,#1F8F7A,#D4AF37);-webkit-mask:radial-gradient(circle,transparent 66%,#000 67.5%);mask:radial-gradient(circle,transparent 66%,#000 67.5%);animation:k8-ring 7s linear infinite}
.k8__orb::after{content:"";position:absolute;inset:6%;border-radius:50%;border:1px solid rgb(212 175 55/.5);animation:k8-halo 3.2s ease-out infinite}
.k8__kern{position:relative;width:88%;height:88%;border-radius:50%;overflow:hidden;background:#04070A;box-shadow:0 0 calc(50px + var(--atem,0) * 60px) rgb(0 179 126/.3)}
.k8__kern i{position:absolute;width:58%;height:58%;border-radius:50%;filter:blur(18px);mix-blend-mode:screen;animation:k8-wirbel 7s ease-in-out infinite alternate}
.k8__kern i:nth-child(1){background:#00B37E;left:2%;top:4%}
.k8__kern i:nth-child(2){background:#D4AF37;right:2%;top:12%;animation-delay:-1.6s}
.k8__kern i:nth-child(3){background:#1F8F7A;left:16%;bottom:2%;animation-delay:-3.1s}
.k8__kern i:nth-child(4){background:#DCCAA8;right:8%;bottom:8%;animation-delay:-4.4s;opacity:.7}
.k8__kern i:nth-child(5){background:#7AE0C0;left:28%;top:28%;animation-delay:-2.3s;opacity:.55}
@keyframes k8-wirbel{to{transform:translate(22%,-16%) rotate(130deg) scale(1.3)}}
@keyframes k8-ring{to{--k8w:360deg}}
@keyframes k8-halo{from{transform:scale(1);opacity:.8}to{transform:scale(1.32);opacity:0}}
.k8__titel{margin:0 0 .9rem;font-family:var(--serif);font-style:italic;font-weight:320;font-variation-settings:"opsz" 144;font-size:clamp(2.2rem,4.2vw,4rem);line-height:.98;letter-spacing:-.03em;text-wrap:balance}
.k8__text{margin:0 0 .6rem;font-size:1.1rem;color:rgb(242 239 233/.9)}
.k8__leise{margin:0;font-size:.88rem;color:var(--leise)}
.k8__stapel{margin:0;padding:0 0 14vh;list-style:none} /* Luft unter der letzten Karte, damit auch sie andockt und der Stapel sich schließt */
.k8__karte{position:sticky;top:calc(var(--kopf-h) + 36px + var(--i,0) * 22px);height:min(62vh,500px);margin-bottom:22vh}
.k8__karte:nth-child(2){--i:1}
.k8__karte:nth-child(3){--i:2;margin-bottom:0}
.k8__glas{position:relative;height:100%;display:flex;flex-direction:column;justify-content:flex-end;padding:clamp(24px,3vw,44px);border-radius:26px;border:1px solid rgb(242 239 233/.14);background:linear-gradient(150deg,rgb(255 255 255/.09),rgb(255 255 255/.02) 60%),rgb(12 17 23/.82);-webkit-backdrop-filter:blur(16px) saturate(1.3);backdrop-filter:blur(16px) saturate(1.3);box-shadow:inset 0 1px 0 rgb(255 255 255/.14),0 30px 80px rgb(0 0 0/.45);transform-origin:50% 0;transform:scale(calc(1 - var(--d,0) * .07));filter:brightness(calc(1 - var(--d,0) * .5))}
.k8__glas::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(420px circle at var(--lx,50%) var(--ly,0%),rgb(255 255 255/.1),rgb(255 255 255/0) 55%);opacity:var(--lo,0);transition:opacity .4s}
.k8__nr{position:absolute;top:clamp(18px,2.4vw,34px);left:clamp(24px,3vw,44px);margin:0;font-family:var(--serif);font-style:italic;font-weight:300;font-variation-settings:"opsz" 144;font-size:clamp(3.4rem,7vw,6.4rem);line-height:1;color:var(--gold)}
.k8__schritt-titel{margin:0 0 .5rem;font-family:var(--mono);font-size:.82rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--jade)}
.k8__satz{margin:0 0 .8rem;font-family:var(--serif);font-style:italic;font-weight:330;font-variation-settings:"opsz" 144;font-size:clamp(1.5rem,2.6vw,2.5rem);line-height:1.12;letter-spacing:-.02em;text-wrap:balance}
.k8__mehrtext{margin:0;max-width:36rem;color:rgb(242 239 233/.84)}
@media (max-aspect-ratio:1/1){
  .k8__innen{grid-template-columns:1fr;gap:24px}
  .k8__seite{position:relative;top:auto;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:18px}
  .k8__orb-platz{width:96px}
  .k8__titel{font-size:clamp(1.8rem,8vw,2.4rem)}
  .k8__karte{top:calc(var(--kopf-h) + 14px + var(--i,0) * 14px);height:min(60svh,500px);margin-bottom:14svh}
  .k8__nr{font-size:3rem}
  .k8__glas{padding:22px 20px}
}

/* ---------- K9 Termin: Liquid Glass über dem Schlussbild ---------- */
.k9{position:relative;min-height:100vh;min-height:100svh;display:grid;align-items:center;justify-items:center;padding:calc(var(--kopf-h) + 32px) var(--rand) 64px;overflow:hidden;isolation:isolate;background:#05070B}
.k9__grund{position:absolute;inset:0;z-index:-2}
.k9__grund img{width:100%;height:100%;max-width:none;object-fit:cover;opacity:.6;transform:scale(1.07) translate(var(--px,0px),var(--py,0px))}
.k9__grund::after{content:"";position:absolute;inset:0;background:radial-gradient(70% 70% at 50% 50%,rgb(5 7 11/.25),rgb(5 7 11/.85))}
.k9__signal{position:absolute;inset:0;z-index:-1;width:100%;height:100%;pointer-events:none}
.k9__bahn{fill:none;stroke:url(#k9-verlauf);stroke-width:1.6;stroke-linecap:round;stroke-dasharray:1 1;stroke-dashoffset:calc(1 - var(--k9p,1));opacity:.85}
.k9__filter{position:absolute;width:0;height:0;overflow:hidden}
.k9__glas{position:relative;max-width:46rem;padding:clamp(24px,3.6vw,52px);border-radius:30px;border:1px solid rgb(255 255 255/.18);background:linear-gradient(135deg,rgb(255 255 255/.1),rgb(255 255 255/.02)),rgb(9 13 18/.5);-webkit-backdrop-filter:blur(20px) saturate(1.5);backdrop-filter:blur(20px) saturate(1.5);box-shadow:inset 0 1px 0 rgb(255 255 255/.22),inset 0 -1px 0 rgb(0 0 0/.3),0 40px 120px rgb(0 0 0/.55)}
.k9__glas.ist-fluessig{-webkit-backdrop-filter:blur(20px) saturate(1.5);backdrop-filter:url(#k9-lg) blur(3px) saturate(1.6) brightness(1.02)}
.k9__glas::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(460px circle at var(--lx,50%) var(--ly,0%),rgb(255 255 255/.11),rgb(255 255 255/0) 55%);opacity:var(--lo,0);transition:opacity .4s}
.k9__titel{margin:0 0 1rem;font-family:var(--serif);font-style:italic;font-weight:320;font-variation-settings:"opsz" 144;font-size:clamp(2rem,4vw,3.8rem);line-height:1;letter-spacing:-.03em;text-wrap:balance}
.k9__text{margin:0 0 .9rem;font-size:1.08rem;color:rgb(242 239 233/.92);text-wrap:pretty}
.k9__knoepfe{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-top:1.6rem}
.k9__termin{position:relative;display:inline-flex;align-items:center;justify-content:center;min-height:56px;padding:0 1.7em;border-radius:999px;background:var(--gold);color:#17191C;font-weight:650;font-size:1.05rem;text-decoration:none;translate:var(--mx,0px) var(--my,0px);transition:box-shadow .5s}
.k9__termin::after{content:"";position:absolute;inset:-2px;border-radius:inherit;border:1.5px solid rgb(212 175 55/.8);opacity:0;pointer-events:none}
.k9__termin.ist-geladen{box-shadow:0 0 0 1px rgb(212 175 55/.5),0 0 44px rgb(212 175 55/.45)}
.k9__termin.ist-geladen::after{animation:k9-puls 2.4s ease-out infinite}
@keyframes k9-puls{from{transform:scale(1);opacity:.9}to{transform:scale(1.25,1.6);opacity:0}}
.k9__termin-licht{position:absolute;inset:0;border-radius:inherit;background:radial-gradient(60% 120% at 30% 0%,rgb(255 255 255/.45),rgb(255 255 255/0) 60%);pointer-events:none}
.k9__termin-text{position:relative}
.k9__anruf{position:relative;display:inline-flex;min-height:56px;perspective:600px;color:var(--text);text-decoration:none}
.k9__anruf-koerper{display:inline-flex;align-items:center;justify-content:center;min-height:56px;padding:0 1.4em;border-radius:999px;border:1px solid rgb(242 239 233/.34);background:rgb(11 15 20/.6);font-weight:550;transform:rotateX(var(--ax,0deg)) rotateY(var(--ay,0deg));transition:background .3s,border-color .3s}
.k9__anruf:hover .k9__anruf-koerper,.k9__anruf:focus-visible .k9__anruf-koerper{background:rgb(0 179 126/.2);border-color:var(--jade)}
.k9__hallo{position:absolute;left:50%;bottom:calc(100% + 10px);padding:.3em .75em;border-radius:14px 14px 14px 4px;background:var(--jade);color:#04110c;font-weight:650;font-size:.86rem;white-space:nowrap;transform:translate(-50%,10px) scale(.5);transform-origin:20% 100%;opacity:0;transition:transform .5s cubic-bezier(.3,1.8,.5,1),opacity .2s;pointer-events:none}
.k9__anruf:hover .k9__hallo,.k9__anruf:focus-visible .k9__hallo{transform:translate(-50%,0) scale(1);opacity:1}
.k9__ki{position:absolute;right:var(--rand);bottom:2.4svh;margin:0;padding:.28em .6em;border-radius:3px;background:rgb(11 15 20/.74);font-family:var(--mono);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:rgb(242 239 233/.72)}
.k9__blende{position:fixed;inset:0;z-index:95;background:var(--grund);clip-path:circle(0 at var(--bx,50%) var(--by,50%));pointer-events:none;transition:clip-path .6s cubic-bezier(.7,0,.2,1)}
.k9__blende.ist-an{clip-path:circle(150vmax at var(--bx,50%) var(--by,50%))}
@media (max-aspect-ratio:1/1){
  .k9{align-items:end;padding-bottom:max(28px,env(safe-area-inset-bottom))}
  .k9__glas{padding:22px 20px;border-radius:24px}
  .k9__titel{font-size:clamp(1.8rem,8vw,2.4rem)}
  .k9__text{font-size:1rem}
  .k9__knoepfe{flex-direction:column;align-items:stretch}
  .k9__termin,.k9__anruf,.k9__anruf-koerper{width:100%}
  .k9__ki{top:calc(var(--kopf-h) + 14px);bottom:auto}
  .k9__grund img{object-position:45% 50%}
}

@media (prefers-reduced-motion: reduce){
  .k6__seite,.k6__eintrag,.k6__stempel,.k6__info,.k9__hallo,.k9__blende,.k9__termin{transition:none}
  .k8__orb::before,.k8__orb::after,.k8__kern i,.k9__termin.ist-geladen::after{animation:none}
}
.ruhig .k8__orb::before,.ruhig .k8__orb::after,.ruhig .k8__kern i,.ruhig .k9__termin.ist-geladen::after{animation:none}

/* Rundgang (16.10.2026): Knopf für Anhalten und Fortsetzen, WCAG 2.2.2. Lage und Form siehe Regeln am Ende des Blocks. Zustände über data-zustand (rundgang.js): faehrt, wartet (Ruhe läuft, Linie füllt sich bis zum Weiterlaufen),
   pause, bereit, ende. Hintergrund deckt voll (Prüfung Überlappung: Seitentext verschwindet darunter). */
.rundgang{position:fixed;left:max(14px,env(safe-area-inset-left));bottom:max(14px,env(safe-area-inset-bottom));z-index:70;display:inline-flex;align-items:center;gap:.6rem;min-height:40px;padding:0 1rem 0 .85rem;font:inherit;font-size:.82rem;font-weight:550;line-height:1;color:var(--text);background:rgb(11 15 20/.72);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgb(242 239 233/.24);border-radius:999px;cursor:pointer;overflow:hidden;transition:border-color .3s}
.rundgang[hidden]{display:none}
.rundgang:hover{border-color:var(--gold)}
.rundgang:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.rundgang__zeichen{position:relative;flex:none;width:10px;height:12px}
.rundgang__zeichen::before,.rundgang__zeichen::after{content:"";position:absolute;top:0;bottom:0;width:3px;border-radius:1px;background:currentColor}
.rundgang__zeichen::before{left:1px}
.rundgang__zeichen::after{right:1px}
.rundgang:is([data-zustand="pause"],[data-zustand="bereit"],[data-zustand="ende"]) .rundgang__zeichen::before{left:1px;width:0;height:0;bottom:auto;border-radius:0;background:none;border-style:solid;border-width:6px 0 6px 10px;border-color:transparent transparent transparent currentColor}
.rundgang:is([data-zustand="pause"],[data-zustand="bereit"],[data-zustand="ende"]) .rundgang__zeichen::after{display:none}
.rundgang__uhr{position:absolute;left:0;right:0;bottom:0;height:2px;background:linear-gradient(90deg,var(--jade),var(--gold));transform-origin:0 50%;transform:scaleX(var(--rg,0));opacity:0;transition:opacity .3s}
.rundgang[data-zustand="wartet"] .rundgang__uhr{opacity:1}
.nojs .rundgang{display:none}
/* Lage (16.10.2026): Unten links lag der Knopf am Handy über den Schrittkarten (Kontaktbogen) und am Rechner bei 1280 bis
   1920 px auf Seitentext und quer über den Nähten (pruefen_final3, Überlappung). Querformat ab 900 px: rechtsbündig in der
   Spalte der Kapitelschiene direkt unter ihr, wo Nähte und Kapitel Platz freihalten (--rg-oben setzt rundgang.js aus der
   Unterkante von .kapitel). Hochformat und schmaler: rund, 44 px, unten rechts, Text nur für Bildschirmleser. */
/* Zweiter Schritt: Auch unter der Schiene lag die Pille in der rechten Spalte auf Seitentext. Deshalb überall rund, 44 px, auf
   deckendem Grund; Text nur für Bildschirmleser, title zeigt den Zustand mit der Maus. */
.rundgang{width:44px;height:44px;min-height:44px;padding:0;gap:0;justify-content:center;background:rgb(11 15 20);-webkit-backdrop-filter:none;backdrop-filter:none}
.rundgang__text{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@media (min-width:900px) and (min-aspect-ratio:1/1){.rundgang{left:auto;right:clamp(10px,1.4vw,26px);bottom:auto;top:var(--rg-oben,calc(50% + 190px))}}
@media (max-width:899.98px),(max-aspect-ratio:1/1){.rundgang{left:auto;right:max(12px,env(safe-area-inset-right));bottom:max(12px,env(safe-area-inset-bottom))}}
@media (forced-colors: active){.rundgang{border-color:ButtonText}.rundgang__uhr{background:Highlight}}
@media (prefers-reduced-motion: reduce){.rundgang,.rundgang__uhr{transition:none}}