/* Durchsatzwerk "Kino" v6 – gemeinsame Bausteine für ALLE Seiten (lädt nach dw-v5.css).
   Echtes Logo, Vollbild-Film-Einstieg, Film-Bänder, Scroll-Bühne. Nur Markenfarben. */
/* ---- Navigation mit dem echten Logo ---- */
.brand{gap:10px}
.brand img{width:36px;height:36px;border-radius:9px;display:block;box-shadow:0 0 0 1px rgba(232,241,236,.16)}
.brand .wm{font-weight:800;font-size:19px;letter-spacing:-.02em;color:#fff;line-height:1}
.brand .wm span{color:var(--mint)}
.foot .brand img{width:40px;height:40px;border-radius:10px}
/* ---- Gemeinsame Schrift-Bausteine ---- */
.kh-k,.sdots button,.kh-cue{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.kh-k{display:inline-flex;gap:10px;align-items:center;font-size:12px;font-weight:600;line-height:1.2;letter-spacing:.22em;text-transform:uppercase;color:#fff;margin:0 0 22px}
.kh-k::before{content:"";width:8px;height:8px;background:var(--mint);flex:none}
.kh-h{margin:0;font-weight:400;text-transform:uppercase;letter-spacing:.045em;font-size:clamp(30px,4.3vw,62px);line-height:1.05;text-wrap:balance;text-shadow:0 2px 30px rgba(0,0,0,.45);color:#fff}
.kh-h strong{font-weight:800}
.kh-h .grad{font-weight:800;background:linear-gradient(100deg,#fff 10%,var(--mint) 90%);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none}
/* ---- Film-Einstieg ---- */
.kh{position:relative;isolation:isolate;min-height:100svh;display:flex;align-items:flex-end;overflow:hidden;background:var(--ink);color:#fff;padding:0}
.kh-media{position:absolute;inset:0;z-index:-2;overflow:hidden;background:var(--deep)}
.kh-media img,.kh-media video{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:cover;max-width:none}
.kh-media video{opacity:0;transition:opacity .9s ease}
.kh-media video.on{opacity:1}
.kh-media video.fade{opacity:0}
.kh-shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(23,32,28,.9) 0%,rgba(23,32,28,.6) 38%,rgba(23,32,28,.12) 74%),linear-gradient(to top,rgba(23,32,28,.92),rgba(23,32,28,0) 40%),linear-gradient(to bottom,rgba(23,32,28,.72),rgba(23,32,28,0) 24%)}
.kh-in{width:100%;display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);gap:48px;align-items:end;padding-top:150px;padding-bottom:88px}
.kh-copy{max-width:780px}
.kh .lead{margin:22px 0 0;max-width:36rem;color:#E8F1EC;font-size:clamp(16px,1.3vw,19px);line-height:1.6}
.kh .ctas{margin-top:30px}
.kh .chips{margin-top:26px}
.kh-aside{justify-self:end;width:100%;max-width:520px;align-self:center}
.kh-aside .stack{height:560px}
.kh-cue{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);font-size:11px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:rgba(232,241,236,.75);display:flex;flex-direction:column;align-items:center;gap:8px}
.kh-cue::after{content:"";width:1px;height:28px;background:linear-gradient(var(--mint),transparent);animation:khcue 2.2s ease-in-out infinite}
@keyframes khcue{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
/* ---- Film-Band (Trenner zwischen Abschnitten) ---- */
.kb{position:relative;isolation:isolate;min-height:clamp(420px,70vh,660px);display:flex;align-items:center;overflow:hidden;background:var(--ink);padding:0}
.kb .kh-shade{background:linear-gradient(90deg,rgba(23,32,28,.9) 0%,rgba(23,32,28,.5) 55%,rgba(23,32,28,.18) 100%),linear-gradient(to top,rgba(23,32,28,.75),rgba(23,32,28,0) 30%),linear-gradient(to bottom,rgba(23,32,28,.85),rgba(23,32,28,0) 30%)}
.kb-in{width:100%;padding-top:80px;padding-bottom:80px}
.kb-h{margin:0;font-weight:400;text-transform:uppercase;letter-spacing:.045em;font-size:clamp(28px,3.9vw,56px);line-height:1.06;text-wrap:balance;max-width:16em;color:#fff;text-shadow:0 2px 30px rgba(0,0,0,.45)}
.kb-h strong{font-weight:800}
.kb-p{margin:20px 0 0;max-width:34rem;color:#E8F1EC;font-size:clamp(16px,1.3vw,19px)}
.kb .kh-k{margin-bottom:20px}
/* ---- Scroll-Bühne (Startseite) ---- */
#stage{display:none;position:relative;height:620vh;background:var(--ink)}
.stage-on #stage{display:block}
.stage-on #hero-statisch{display:none}
.stage-pin{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:var(--ink)}
.stage-media{position:absolute;inset:0;z-index:0}
.sv{position:absolute;inset:0;opacity:0;transition:opacity 1s ease;overflow:hidden;background:var(--deep)}
.sv.on{opacity:1}
.sv img,.sv video{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:cover}
.sv video{opacity:0;transition:opacity .9s ease}.sv video.on{opacity:1}.sv video.fade{opacity:0}
.stage-pin .kh-shade{z-index:1;transition:background .6s}
.stage-pin[data-k="4"] .kh-shade{background:linear-gradient(rgba(23,32,28,.78),rgba(23,32,28,.78))}
.stage-pin[data-k="5"] .kh-shade{background:linear-gradient(rgba(23,32,28,.72),rgba(23,32,28,.72))}
.stage-titles{position:absolute;left:0;right:0;top:0;bottom:0;margin:0 auto;z-index:2;display:grid;align-items:center;padding-top:70px;pointer-events:none}
.st{grid-area:1/1;max-width:35rem;opacity:0;visibility:hidden;transform:translateY(18px);transition:opacity .6s var(--ease),transform .6s var(--ease),visibility 0s .6s}
.st.on{opacity:1;visibility:visible;transform:none;transition-delay:0s}
.st.c{justify-self:center;text-align:center;max-width:62rem}
.st .kh-h{font-size:clamp(30px,4.5vw,64px)}
.st p{margin:20px 0 0;color:#E8F1EC;font-size:clamp(16px,1.35vw,19px);max-width:34rem}
.st.c p{margin-left:auto;margin-right:auto}
.st .note{font-size:13px;color:rgba(232,241,236,.75);margin-top:14px}
.st .ctas{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px;pointer-events:auto}.st.c .ctas{justify-content:center}
.sectors{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:28px auto 0;max-width:62rem;text-align:left}
.sectors div{border:1px solid rgba(232,241,236,.26);border-radius:16px;background:rgba(11,58,44,.66);backdrop-filter:blur(12px);padding:16px 16px 18px}
.sectors b{display:block;font:600 11.5px/1.3 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--mint);margin-bottom:8px}
.sectors span{display:block;font-size:14px;line-height:1.45;color:#E8F1EC}
.sdots{position:absolute;right:16px;top:50%;transform:translateY(-50%);z-index:3;display:flex;flex-direction:column;gap:2px;align-items:flex-end}
.sdots button{background:none;border:0;cursor:pointer;display:flex;align-items:center;gap:10px;min-height:30px;padding:0;font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:rgba(232,241,236,.75)}
.sdots button span{opacity:0;transition:opacity .3s}.sdots button:hover span,.sdots button.on span{opacity:1}
.sdots button::after{content:"";width:18px;height:2px;background:rgba(232,241,236,.3);transition:width .3s,background .3s}
.sdots button.on{color:#fff}.sdots button.on::after{width:34px;background:var(--mint)}
.stage-pin .kh-cue{z-index:3;opacity:0;transition:opacity .4s}
.stage-pin[data-k="0"] .kh-cue{opacity:1}
.sbar{position:absolute;left:0;right:0;bottom:0;height:2px;z-index:3}.sbar b{display:block;height:100%;width:0;background:var(--mint)}
/* ---- Mobil ---- */
@media(max-width:1000px){
 .kh{align-items:flex-start}
 .kh-in{grid-template-columns:1fr;padding-top:118px;padding-bottom:64px;gap:36px}
 .kh-aside{justify-self:start;max-width:none}
 .kh-aside .stack{height:auto;transform:none;margin:0;perspective:none}
 .kh-aside .stack .tilt3d{position:static;display:grid;gap:14px;transform:none}
 .kh-shade{background:linear-gradient(to bottom,rgba(23,32,28,.9) 0%,rgba(23,32,28,.66) 55%,rgba(23,32,28,.5) 100%)}
 .kh-cue{display:none}
}
@media(max-width:900px){.sectors{grid-template-columns:repeat(2,1fr)}.sdots{display:none}}
@media(max-width:760px){
 .stage-titles{align-items:start;padding-top:96px}
 .st .kh-h{font-size:clamp(28px,8vw,38px)}
 .st p{font-size:15.5px}
 .sectors{grid-template-columns:1fr 1fr;gap:8px}.sectors div{padding:12px}.sectors span{font-size:12.5px}
 .st .ctas .btn{flex:1}
 .kb-in{padding-top:56px;padding-bottom:56px}
}
@media(prefers-reduced-motion:reduce){.kh-cue::after{animation:none}.kh-media video,.sv video{display:none}.sv,.st{transition:none}}
/* ---- Korrekturen ---- */
.nav .links a{white-space:nowrap}
.nav .links{gap:2px}
.pb-aside .badge3d{display:none}
.kh-aside .stack{margin-bottom:0}
/* ---- Feinschliff v6.1 ---- */
.kh-h,.kb-h,.st .kh-h,.kh-k{hyphens:none;-webkit-hyphens:none;overflow-wrap:normal;word-break:normal}
.kh-h{font-size:clamp(28px,3.8vw,56px)}
.kh-copy{max-width:830px}
.st{max-width:46rem}.st.c{max-width:62rem}
.st .kh-h{font-size:clamp(30px,4.1vw,60px)}
.stat b{white-space:nowrap;font-size:clamp(36px,3.9vw,58px)}
.sdots{right:auto;left:50%;top:auto;bottom:22px;transform:translateX(-50%);flex-direction:row;gap:6px;align-items:center}
.sdots button{min-height:24px;padding:10px 0}
.sdots button span{display:none}
.sdots button::after{width:30px;height:3px;border-radius:2px}
.sdots button.on::after{width:48px}
.stage-pin .kh-cue{left:28px;right:auto;transform:none;align-items:flex-start;bottom:24px}
@media(max-width:760px){
 .st .ctas{flex-direction:column;align-items:stretch}.st .ctas .btn{flex:none;width:100%}
 .kh .ctas{flex-direction:column;align-items:stretch}.kh .ctas .btn{width:100%}
}
@media(max-width:640px){.cmpt{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}}
/* ===== v7: Scroll-Film, Klick-Details, Kacheln ===== */
.stage-media .sf{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .6s}
.stage-media .sf.ready{opacity:1}
.stage-media .sfimg{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:cover}
#stage{height:560vh}
.stage-pin[data-k="1"] .kh-shade{background:linear-gradient(90deg,rgba(23,32,28,.9) 0%,rgba(23,32,28,.55) 45%,rgba(23,32,28,.25) 100%),linear-gradient(to top,rgba(23,32,28,.8),rgba(23,32,28,0) 40%)}
.pills{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:28px}
.pills span{border:1px solid rgba(232,241,236,.3);background:rgba(11,58,44,.6);backdrop-filter:blur(10px);border-radius:999px;padding:11px 20px;font-weight:700;font-size:clamp(14px,1.2vw,17px)}
/* Klick-Details */
details.more{margin-top:28px;border:1px solid var(--line);border-radius:20px;background:rgba(232,241,236,.03);overflow:hidden}
details.more>summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 24px;font-weight:700;font-size:clamp(16px,1.3vw,18px);min-height:64px}
details.more>summary::-webkit-details-marker{display:none}
details.more>summary::after{content:"+";flex:none;width:36px;height:36px;border-radius:50%;border:1px solid rgba(159,209,184,.5);display:grid;place-items:center;font-size:22px;line-height:1;color:var(--mint);transition:transform .25s,background .25s}
details.more>summary:hover::after{background:rgba(159,209,184,.12)}
details.more[open]>summary::after{transform:rotate(45deg)}
details.more>summary small{display:block;font-weight:400;font-size:14px;color:var(--soft);margin-top:3px}
.more-in{padding:6px 24px 30px;animation:morein .35s ease}
@keyframes morein{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.more-in .sec-head{margin-top:18px}
/* Große Angebots-Kacheln */
.bigtiles{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.bt{position:relative;isolation:isolate;display:flex;flex-direction:column;gap:12px;min-height:330px;padding:30px;border-radius:24px;border:1px solid var(--line);color:#fff;text-decoration:none;overflow:hidden;background:var(--deep);transition:transform .3s var(--ease),border-color .3s}
.bt::before{content:"";position:absolute;inset:0;z-index:-2;background:var(--bg) center/cover;opacity:.45;transition:opacity .4s,transform .8s var(--ease)}
.bt::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(to top,rgba(11,58,44,.95) 10%,rgba(11,58,44,.55) 60%,rgba(11,58,44,.4))}
.bt:hover{transform:translateY(-5px);border-color:rgba(159,209,184,.6)}.bt:hover::before{opacity:.65;transform:scale(1.05)}
.bt .kh-k{margin:0}
.bt h3{margin:0;font-size:clamp(22px,2vw,28px);line-height:1.15;letter-spacing:-.01em}
.bt p{margin:0;color:#E8F1EC;font-size:16px}
.bt .price{margin-top:auto;font-size:34px;font-weight:800;letter-spacing:-.02em}
.bt .go{font-weight:700;color:var(--mint)}
.minis{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:18px}
.mini{display:flex;flex-direction:column;gap:6px;padding:20px;border:1px solid var(--line);border-radius:18px;background:rgba(232,241,236,.04);color:#fff;text-decoration:none;transition:.25s}
.mini:hover{border-color:rgba(159,209,184,.55);transform:translateY(-3px)}
.mini b{font-size:18px}.mini span{color:var(--soft);font-size:15px}.mini i{font-style:normal;margin-top:auto;padding-top:8px;font-weight:800;color:var(--mint)}
@media(max-width:1000px){.bigtiles{grid-template-columns:1fr}.bt{min-height:260px}.minis{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.minis{grid-template-columns:1fr}details.more>summary{padding:16px 18px}.more-in{padding:4px 16px 24px}}
.js #stage{display:block}
.js #hero-statisch{display:none}
.no-stage #stage{display:none}
.no-stage #hero-statisch{display:flex}
/* ---- Kompakter: weniger Leerraum zwischen Abschnitten ---- */
section{padding:clamp(48px,6.2vw,88px) 0}
.sec-head{margin-bottom:clamp(26px,3.4vw,44px)}
.kh,.kb,#stage{padding:0}
.final,.ki-finsec{margin-top:0}
/* ===== v8: Tür-Durchflug (Scroll zoomt durch Türen von Branche zu Branche) ===== */
#stage.dz-stage{height:620vh}
.dz{position:absolute;inset:0;overflow:hidden;background:var(--deep)}
.dz img{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:cover;max-width:none;opacity:0;will-change:transform,opacity;backface-visibility:hidden}
.dz img:first-child{opacity:1}
.dz-glow{position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at var(--gx,50%) var(--gy,52%),rgba(232,241,236,.95) 0%,rgba(159,209,184,.55) 20%,rgba(159,209,184,0) 55%);opacity:0;mix-blend-mode:screen}
.dz-end{position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 50% 50%,#9FD1B8 0%,#0F4D3A 55%,#0B3A2C 100%);opacity:0}
.stage-pin[data-k="6"] .kh-shade{background:linear-gradient(rgba(11,58,44,.25),rgba(11,58,44,.25))}
/* Hero-Bilder auf Unterseiten: sanfte Bewegung */
.kh-media img.kb-img{animation:kbz 22s ease-in-out infinite alternate;transform-origin:50% 55%}
@keyframes kbz{from{transform:scale(1)}to{transform:scale(1.09)}}
.kh-media.px img,.kb .kh-media img{will-change:transform}
@media(prefers-reduced-motion:reduce){.kh-media img.kb-img{animation:none}}
/* v9: Scroll-Tiefe + Brücken-Helfer */
.kh-media,.kb .kh-media{will-change:transform}
.kh-in{will-change:opacity,transform}
.stack-cards{display:grid;gap:16px}
.chips2{margin-top:26px}
@media(max-width:760px){.kh-media{transform:none!important}}

html,body{overflow-x:clip}
.cmpt,.tbl-wrap{max-width:100%;overflow-x:auto}
.kh-s{min-height:64svh}
@media(max-width:760px){.kh-s{min-height:0}}
