/* AXODREN — Bausteine der Branchenseiten (04.09.2026) */

/* Platzhalter für noch fehlende Motive */
.ph{border:1px dashed rgba(0,0,0,.3);display:grid;place-items:center;font:400 .74rem/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:#77777e;background:transparent}
.ph--sq{aspect-ratio:1}
.ph--wide{aspect-ratio:16/9}
.ph--dark{border-color:rgba(242,241,239,.35);color:#9a9aa0}

/* These + Intro (weiß) */
.thesis{background:#fff;padding:clamp(3rem,8vh,5rem) 0}
.thesis .inner{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:clamp(2rem,5vw,5rem);align-items:center}
.thesis h2{margin:0 0 1rem;font-family:var(--disp);font-weight:700;font-size:clamp(2rem,3.4vw,3.4rem);line-height:1.06;letter-spacing:-.01em;max-width:30rem}
.thesis__lead{margin:0 0 1rem;color:var(--mut);font-size:1rem;line-height:1.65;max-width:34rem}
.thesis__lead+.thesis__lead{margin-top:0}
.thesis__fig{margin:0;width:100%;max-width:36rem;justify-self:center}
.thesis__fig img,.thesis__fig .ph{display:block;width:100%;height:auto}

/* Wo es hakt (schwarz): vier Situationen, Hover zeigt „Was wir daraus machen" */
.hakt{background:var(--ink);color:var(--bone);padding:clamp(3rem,8vh,5rem) 0}
.hakt h2{margin:0 0 .8rem;font-family:var(--disp);font-weight:700;font-size:clamp(2rem,3.1vw,3rem);line-height:1.08;letter-spacing:-.01em;max-width:34rem}
.hakt__lead{margin:0 0 clamp(2rem,5vh,3rem);color:#b9b9c0;font-size:.98rem;line-height:1.65;max-width:38rem}
.hakt__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(1.2rem,2.4vw,2rem)}
.hakt__grid--6{grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1.4rem,3vw,2.6rem) clamp(1.2rem,2.4vw,2rem)}
.hakt__item{position:relative;display:block;color:inherit}
.hakt__vis{position:relative;overflow:hidden;border-radius:.6rem;background:#000;aspect-ratio:1}
.hakt__vis img{display:block;width:100%;height:100%;object-fit:cover;filter:invert(1);transition:transform .6s cubic-bezier(.16,1,.3,1),opacity .4s ease}
.hakt__vis .ph{position:absolute;inset:0;aspect-ratio:auto}
.hakt__out{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;padding:1.1rem;margin:0;background:linear-gradient(to top,rgba(0,0,0,.94) 0%,rgba(0,0,0,.6) 55%,rgba(0,0,0,0) 100%);color:#f2f1ef;font-size:.88rem;line-height:1.5;opacity:0;transition:opacity .35s ease}
.hakt__out b{display:block;font:700 .7rem/1 var(--read);letter-spacing:.18em;text-transform:uppercase;color:#9a9aa0;margin-bottom:.45rem}
.hakt__item:hover .hakt__vis img,.hakt__item:focus-within .hakt__vis img{transform:scale(1.04);opacity:.5}
.hakt__item:hover .hakt__out,.hakt__item:focus-within .hakt__out{opacity:1}
.hakt__no{margin:1rem 0 .3rem;font:400 .74rem/1 var(--mono);letter-spacing:.08em;color:#9a9aa0}
.hakt h3{margin:0 0 .4rem;font-family:var(--disp);font-weight:700;font-size:1.15rem;line-height:1.25}
.hakt__item>p{margin:0;color:#b9b9c0;font-size:.9rem;line-height:1.6}

/* Ein Tag im Betrieb (geteilt: links weiß und haftend, rechts schwarz) */
.day{position:relative;background:var(--ink);color:var(--bone);padding:clamp(3rem,8vh,5rem) 0;--day-gap:clamp(2rem,6vw,7rem)}
.day::before{content:"";position:absolute;top:0;bottom:0;left:0;background:#fff;width:calc(max(var(--pad),(100% - 76rem)/2) + (min(76rem,100% - 2*var(--pad)) - var(--day-gap))*5/12 + var(--day-gap)/2)}
.day .inner{position:relative;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--day-gap);align-items:start}
.day__side{position:sticky;top:clamp(4.5rem,14vh,8rem);color:var(--ink)}
.day__side h2{margin:0 0 1.2rem;font-family:var(--disp);font-weight:700;font-size:clamp(2rem,3.1vw,3rem);line-height:1.08;letter-spacing:-.01em;color:var(--ink)}
.day__panels{display:grid;min-height:13rem}
.day__panel{grid-area:1/1;opacity:0;transform:translateY(.4em);transition:opacity .4s ease,transform .55s cubic-bezier(.16,1,.3,1);pointer-events:none}
.day__panel.on{opacity:1;transform:none;pointer-events:auto}
.day__panel .day__time{margin:0 0 .4rem;font-family:var(--disp);font-weight:700;font-size:clamp(3.4rem,8vw,6.5rem);line-height:1;letter-spacing:-.02em;color:var(--ink)}
.day__panel h3{margin:0 0 .5rem;font-family:var(--disp);font-weight:700;font-size:clamp(1.2rem,1.8vw,1.6rem);line-height:1.2;color:var(--ink)}
.day__panel p{margin:0;max-width:24rem;color:#55555c;font-size:.95rem;line-height:1.6}
.day__panel p b{display:block;font:700 .7rem/1 var(--read);letter-spacing:.18em;text-transform:uppercase;color:#77777e;margin-bottom:.4rem}
.day__meter{position:relative;height:2px;margin-top:1.6rem;background:#e2e2e6;overflow:hidden}
.day__meter i{position:absolute;inset:0;background:var(--ink);transform-origin:left;transform:scaleX(.2);transition:transform .55s cubic-bezier(.16,1,.3,1)}
.day__scenes{display:grid;gap:clamp(2.5rem,7vh,5rem)}
.day__scene{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(1.4rem,3vw,2.6rem);align-items:center;min-height:min(60vh,580px);opacity:.38;transition:opacity .5s ease}
.day__scene.on{opacity:1}
.day__scene .day__vis{width:100%;max-width:24rem;aspect-ratio:1;border-radius:.6rem;overflow:hidden;background:#000}
.day__scene .day__vis img{display:block;width:100%;height:100%;object-fit:cover;filter:invert(1)}
.day__scene .day__vis .ph{width:100%;height:100%;aspect-ratio:auto}
.day__stamp{margin:0 0 .5rem;font:400 .74rem/1 var(--mono);letter-spacing:.08em;color:#9a9aa0}
.day__scene h4{margin:0 0 .5rem;font-family:var(--disp);font-weight:700;font-size:clamp(1.25rem,1.9vw,1.7rem);line-height:1.2}
.day__scene p:last-child{margin:0;color:#b9b9c0;font-size:.92rem;line-height:1.65;max-width:28rem}
.day__scene .day__ai{display:inline-block;margin:.7rem 0 0;padding:.35rem .6rem;border:1px solid rgba(242,241,239,.3);border-radius:999px;font:700 .68rem/1 var(--read);letter-spacing:.14em;text-transform:uppercase;color:#f2f1ef}

/* Was wir dort bauen (weiß): Zeilen mit Motiv, verlinkt auf die Service-Seiten */
.build{background:#fff;padding:clamp(3rem,8vh,5rem) 0}
.build h2{margin:0 0 .8rem;font-family:var(--disp);font-weight:700;font-size:clamp(2rem,3.1vw,3rem);line-height:1.08;letter-spacing:-.01em;max-width:34rem}
.build__lead{margin:0 0 clamp(1.6rem,4vh,2.4rem);color:var(--mut);font-size:.98rem;line-height:1.65;max-width:38rem}
.build__row{display:grid;grid-template-columns:2.4rem minmax(0,1fr) auto 5.6rem;gap:1.2rem;align-items:center;padding:1.1rem 0;border-top:1px solid #e2e2e6;color:inherit;text-decoration:none;transition:transform .45s cubic-bezier(.16,1,.3,1)}
.build__row:last-child{border-bottom:1px solid #e2e2e6}
.build__row:hover{transform:translateX(.4rem)}
.build__no{font:400 .74rem/1 var(--mono);letter-spacing:.06em;color:#9a9aa0}
.build__name{margin:0;font-family:var(--disp);font-weight:700;font-size:clamp(1.15rem,1.6vw,1.45rem);line-height:1.15}
.build__one{margin:.3rem 0 0;color:#55555c;font-size:.92rem;line-height:1.5;max-width:34rem}
.build__svc{font:700 .7rem/1 var(--read);letter-spacing:.16em;text-transform:uppercase;color:#77777e;white-space:nowrap}
.build__pic{width:5.6rem;height:5.6rem;border-radius:.5rem;overflow:hidden;display:grid;place-items:center}
.build__pic img{width:100%;height:100%;object-fit:contain;filter:invert(1);transition:transform .6s cubic-bezier(.16,1,.3,1)}
.build__row:hover .build__pic img{transform:scale(1.14)}

@media (max-width:880px){
  .thesis .inner{grid-template-columns:1fr}
  .hakt__grid,.hakt__grid--6{grid-template-columns:repeat(2,minmax(0,1fr))}
  .day::before{display:none}
  .day .inner{grid-template-columns:1fr;gap:1.6rem}
  .day__side{position:static;background:#fff;padding:1.4rem var(--pad);margin:0 calc(-1*var(--pad))}
  .day__panels{min-height:0}
  .day__panel{display:none;position:static;opacity:1;transform:none;grid-area:auto}
  .day__panel.on{display:block}
  .day__time{font-size:3rem}
  .day__scene{grid-template-columns:1fr;min-height:0;opacity:1}
  .day__scene .day__vis{max-width:none}
  .build__row{grid-template-columns:1.6rem minmax(0,1fr) 3.6rem;gap:.8rem}
  .build__svc{display:none}
  .build__pic{width:3.6rem;height:3.6rem}
}
@media (max-width:560px){.hakt__grid,.hakt__grid--6{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.hakt__vis img,.hakt__out,.day__panel,.day__scene,.day__meter i,.build__row,.build__pic img{transition:none}.day__scene{opacity:1}}

/* ---------- Branchen-Header, drei Typen (04.09.2026) ---------- */
/* A · Panorama */
.hdrA{background:#fff;position:relative;overflow:hidden}
.hdrA__scene{position:relative;width:100%;aspect-ratio:21/9;overflow:hidden;background:#fff}
.hdrA__scene img,.hdrA__scene .ph{position:absolute;inset:-10% 0 0 0;width:100%;height:120%;object-fit:cover;object-position:center 40%;will-change:transform}
.hdrA__scene .ph{inset:0;height:100%;aspect-ratio:auto}
.hdrA__title{position:relative;max-width:76rem;margin:0 auto;padding:0 var(--pad);margin-top:-.62em}
.hdrA__title h1{margin:0;font-family:var(--disp);font-weight:700;font-size:clamp(3.2rem,9vw,9.4rem);line-height:.92;letter-spacing:-.02em;color:var(--ink);background:#fff;display:inline-block;padding:.08em .25em 0 0}
.hdrA__title .xf{font-family:"Axodren Display Ext","Axodren Display",sans-serif}
.hdrA__sub{max-width:76rem;margin:0 auto;padding:1.2rem var(--pad) clamp(2.4rem,6vh,3.6rem);display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:2rem;align-items:end}
.hdrA__sub p{margin:0;font-family:var(--disp);font-weight:700;font-size:clamp(1.15rem,1.8vw,1.55rem);line-height:1.3;max-width:34rem}
.hdrA__sub small{display:block;margin-top:.6rem;font:400 .95rem/1.6 var(--read);color:var(--mut)}
.hdrA__rule{height:2px;margin-top:1.2rem;background:var(--ink);transform-origin:left;transform:scaleX(0);transition:transform 1.4s cubic-bezier(.16,1,.3,1) .2s}
.hdrA.go .hdrA__rule{transform:none}
.hdrA__tags{display:flex;flex-wrap:wrap;gap:.5rem;justify-self:end}
.hdrA__tags span{font:700 .72rem/1 var(--read);letter-spacing:.14em;text-transform:uppercase;border:1.5px solid var(--ink);border-radius:999px;padding:.55rem .9rem}
/* B · Statement */
.hdrB{background:#fff}
.hdrB .inner{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:clamp(2rem,5vw,5rem);align-items:stretch;padding-block:clamp(3rem,8vh,5rem) clamp(2.4rem,6vh,4rem)}
.hdrB__eyebrow{margin:0 0 1rem;font:700 .72rem/1 var(--read);letter-spacing:.22em;text-transform:uppercase;color:#77777e}
.hdrB h1{margin:0 0 1.2rem;font-family:var(--disp);font-weight:700;font-size:clamp(2.4rem,4.4vw,4.4rem);line-height:1.04;letter-spacing:-.01em}
.hdrB h1 .xf{font-family:"Axodren Display Ext","Axodren Display",sans-serif}
.hdrB p{margin:0 0 1rem;color:var(--mut);font-size:1rem;line-height:1.65;max-width:32rem}
.hdrB__jump{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.6rem}
.hdrB__jump a{font:700 .8rem/1 var(--read);letter-spacing:.1em;text-transform:uppercase;color:#fff;background:var(--ink);border:1.5px solid var(--ink);border-radius:999px;padding:.9rem 1.3rem;text-decoration:none}
.hdrB__jump a.alt{background:#fff;color:var(--ink)}
.hdrB__fig{margin:0;position:relative;overflow:hidden;border-radius:.8rem;min-height:26rem;background:#fff}
.hdrB__fig img,.hdrB__fig .ph{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;aspect-ratio:auto;transform:scale(1.06);transition:transform 1.6s cubic-bezier(.16,1,.3,1)}
.hdrB.go .hdrB__fig img,.hdrB.go .hdrB__fig .ph{transform:none}
.hdrB__fig figcaption{position:absolute;left:1rem;bottom:.9rem;font:700 .68rem/1.6 var(--read);letter-spacing:.16em;text-transform:uppercase;color:#8a8a90}
/* C · Freilegen */
.hdrC{background:#fff;position:relative;min-height:calc(100vh + 70vh)}
.hdrC__pin{position:sticky;top:var(--nav-h,57px);height:calc(100vh - var(--nav-h,57px));overflow:hidden;display:grid;align-items:end}
.hdrC__scene{position:absolute;inset:0;overflow:hidden}
.hdrC__scene img,.hdrC__scene .ph{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 35%;opacity:.3;aspect-ratio:auto;clip-path:inset(0 0 100% 0);transition:clip-path .2s linear}
.hdrC__word{position:relative;max-width:76rem;margin:0 auto;padding:clamp(3rem,10vh,6rem) var(--pad) clamp(2rem,6vh,3.6rem);width:100%;box-sizing:border-box}
.hdrC h1{margin:0;font-family:var(--disp);font-weight:700;font-size:var(--h1,clamp(4rem,15vw,15rem));line-height:.9;letter-spacing:-.03em;color:transparent;-webkit-text-stroke:2px #000;background:linear-gradient(to top,#000 0 var(--fill,0%),transparent var(--fill,0%) 100%);-webkit-background-clip:text;background-clip:text}
.hdrC h1 .xf{font-family:"Axodren Display Ext","Axodren Display",sans-serif}
.hdrC__sub{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:2rem;align-items:end;margin-top:1.4rem}
.hdrC__sub p{margin:0;font-family:var(--disp);font-weight:700;font-size:clamp(1.15rem,1.8vw,1.55rem);line-height:1.3;max-width:34rem}
.hdrC__sub small{display:block;margin-top:.6rem;font:400 .95rem/1.6 var(--read);color:var(--mut)}
@media (max-width:880px){
  .hdrA__scene{aspect-ratio:4/3}.hdrA__sub{grid-template-columns:1fr}.hdrA__tags{justify-self:start}
  .hdrB .inner{grid-template-columns:1fr}.hdrB__fig{min-height:16rem}
  .hdrC{min-height:calc(100vh + 50vh)}.hdrC__sub{grid-template-columns:1fr}.hdrC h1{-webkit-text-stroke:1.2px #000}
}
@media (prefers-reduced-motion:reduce){.hdrC{min-height:0}.hdrC__pin{position:static;height:auto;min-height:min(80vh,760px)}.hdrA__rule{transform:none;transition:none}.hdrB__fig img,.hdrB__fig .ph{transform:none;transition:none}.hdrC h1{--fill:100%}.hdrC__scene img,.hdrC__scene .ph{clip-path:none;transition:none}}

/* ---------- Fabrik-Landkarte: links haftet die Karte (weiß), rechts laufen die Stationen (schwarz) ---------- */
.map{position:relative;background:var(--ink);color:var(--bone);padding:clamp(3rem,8vh,5rem) 0;--map-gap:clamp(2rem,6vw,7rem)}
.map::before{content:"";position:absolute;top:0;bottom:0;left:0;background:#fff;width:calc(max(var(--pad),(100% - 76rem)/2) + (min(76rem,100% - 2*var(--pad)) - var(--map-gap))*6/12 + var(--map-gap)/2)}
.map .inner{position:relative;display:grid;grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:var(--map-gap);align-items:start}
.map__side{position:sticky;top:clamp(4.5rem,12vh,7rem);color:var(--ink)}
.map__side h2{margin:0 0 .6rem;font-family:var(--disp);font-weight:700;font-size:clamp(2rem,3.1vw,3rem);line-height:1.08;letter-spacing:-.01em;color:var(--ink)}
.map__lead{margin:0 0 1.2rem;color:#55555c;font-size:.95rem;line-height:1.6;max-width:28rem}
.map__svg{width:100%;height:auto;display:block}
.map__svg .map__st{cursor:default}
.map__svg .map__st .box{fill:#fff;stroke:#000;stroke-width:2.4;transition:fill .35s ease}
.map__svg .map__st .top{fill:none;stroke:#000;stroke-width:1.6;stroke-dasharray:4 4;transition:stroke .35s ease}
.map__svg .map__st text{font:700 11px "Sen","Helvetica Neue",Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase;fill:#000;transition:fill .35s ease}
.map__svg .map__st.on .box{fill:#000}
.map__svg .map__st.on .top{stroke:#000}
.map__svg .map__st.on text{fill:#fff}
.map__svg .map__st .dot{fill:#fff;stroke:#000;stroke-width:2;opacity:0;transform-origin:center;transform-box:fill-box}
.map__svg .map__st.on .dot{opacity:1;animation:mapPulse 1.6s ease-in-out infinite}
@keyframes mapPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.6)}}
.map__stops{display:grid;gap:clamp(2.5rem,7vh,5rem)}
.map__stop{min-height:min(56vh,540px);display:grid;align-content:center;opacity:.38;transition:opacity .5s ease}
.map__stop.on{opacity:1}
.map__stamp{margin:0 0 .6rem;font:400 .74rem/1 var(--mono);letter-spacing:.08em;color:#9a9aa0}
.map__stop h3{margin:0 0 .6rem;font-family:var(--disp);font-weight:700;font-size:clamp(1.4rem,2.2vw,2rem);line-height:1.15}
.map__stop p{margin:0;color:#b9b9c0;font-size:.95rem;line-height:1.65;max-width:30rem}
.map__link{display:inline-block;margin-top:1rem;font:700 .74rem/1 var(--read);letter-spacing:.14em;text-transform:uppercase;color:#f2f1ef;text-decoration:none;border-bottom:2px solid #f2f1ef;padding-bottom:.3rem}
.map__link:hover{border-color:transparent}
@media (max-width:880px){
  .map::before{display:none}
  .map .inner{grid-template-columns:1fr;gap:1.6rem}
  .map__side{position:static;background:#fff;padding:1.4rem var(--pad);margin:0 calc(-1*var(--pad))}
  .map__stop{min-height:0;opacity:1}
}
@media (prefers-reduced-motion:reduce){.map__stop,.map__svg .map__st .box,.map__svg .map__st .top,.map__svg .map__st text{transition:none}.map__stop{opacity:1}.map__svg .map__st.on .dot{animation:none}}

/* ---------- Automotive: Lieferkette als Stapel (nutzt .how--stack) ---------- */
.chain h2{margin-bottom:.6rem}
.chain__lead{margin:0 0 clamp(1.6rem,4vh,2.6rem);color:#b9b9c0;font-size:.98rem;line-height:1.65;max-width:38rem}

/* ---------- Logistik: Dispo-Board, das sich beim Einscrollen füllt (weiß) ---------- */
.board{background:#fff;padding:clamp(3rem,8vh,5rem) 0}
.board h2{margin:0 0 .6rem;font-family:var(--disp);font-weight:700;font-size:clamp(2rem,3.1vw,3rem);line-height:1.08;letter-spacing:-.01em;max-width:34rem}
.board__lead{margin:0 0 clamp(1.6rem,4vh,2.4rem);color:var(--mut);font-size:.98rem;line-height:1.65;max-width:40rem}
.board__cols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;align-items:start}
.board__col{background:#f4f4f5;border-radius:.8rem;padding:1rem;min-height:18rem}
.board__col h3{margin:0 0 .8rem;font:700 .72rem/1 var(--read);letter-spacing:.2em;text-transform:uppercase;color:#77777e}
.board__card{background:#fff;border:1px solid #e2e2e6;border-radius:.6rem;padding:.8rem .9rem;margin-bottom:.6rem;opacity:0;transform:translateY(14px);transition:opacity .5s ease,transform .6s cubic-bezier(.16,1,.3,1),box-shadow .3s ease}
.board.go .board__card{opacity:1;transform:none}
.board__card b{display:block;font-family:var(--disp);font-weight:700;font-size:1rem;line-height:1.25;margin-bottom:.2rem}
.board__card span{display:block;color:#55555c;font-size:.86rem;line-height:1.45}
.board__card i{display:inline-block;margin-top:.5rem;font:700 .64rem/1 var(--read);letter-spacing:.14em;text-transform:uppercase;font-style:normal;color:#000;border:1px solid #000;border-radius:999px;padding:.32rem .55rem}
.board__card:hover{box-shadow:0 8px 24px rgba(0,0,0,.08);transform:translateY(-2px)}
.board__col:nth-child(1) .board__card:nth-child(2){transition-delay:.05s}.board__col:nth-child(1) .board__card:nth-child(3){transition-delay:.15s}.board__col:nth-child(1) .board__card:nth-child(4){transition-delay:.25s}
.board__col:nth-child(2) .board__card:nth-child(2){transition-delay:.45s}.board__col:nth-child(2) .board__card:nth-child(3){transition-delay:.55s}.board__col:nth-child(2) .board__card:nth-child(4){transition-delay:.65s}
.board__col:nth-child(3) .board__card:nth-child(2){transition-delay:.85s}.board__col:nth-child(3) .board__card:nth-child(3){transition-delay:.95s}
.board__col:nth-child(4) .board__card:nth-child(2){transition-delay:1.15s}.board__col:nth-child(4) .board__card:nth-child(3){transition-delay:1.25s}
.board__foot{margin:1.4rem 0 0;color:var(--mut);font-size:.9rem;line-height:1.6;max-width:40rem}
@media (max-width:880px){.board__cols{grid-template-columns:repeat(2,minmax(0,1fr))}.board__col{min-height:0}}
@media (max-width:560px){.board__cols{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.board__card{opacity:1;transform:none;transition:none}}

/* ---------- Handel: Warenfluss-Linie mit Stationen (weiß), Karten bei Hover/Fokus ---------- */
.flow{background:#fff;padding:clamp(3rem,8vh,5rem) 0 clamp(4rem,10vh,6rem)}
.flow h2{margin:0 0 .6rem;font-family:var(--disp);font-weight:700;font-size:clamp(2rem,3.1vw,3rem);line-height:1.08;letter-spacing:-.01em;max-width:34rem}
.flow__lead{margin:0 0 clamp(2.4rem,6vh,3.6rem);color:var(--mut);font-size:.98rem;line-height:1.65;max-width:40rem}
.flow__line{position:relative;height:2px;margin:0 0 -1px}
.flow__line svg{position:absolute;inset:0;width:100%;height:2px;overflow:visible}
.flow__line path{stroke:#000;stroke-width:2;fill:none;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.8s ease}
.flow.go .flow__line path{stroke-dashoffset:0}
.flow__nodes{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1.2rem}
.flow__node{position:relative;padding-top:1.6rem;outline:none}
.flow__dot{position:absolute;top:-.55rem;left:0;width:1.1rem;height:1.1rem;border-radius:50%;background:#fff;border:2px solid #000;transform:scale(.4);opacity:0;transition:transform .5s cubic-bezier(.16,1,.3,1),opacity .3s ease,background .3s ease}
.flow.go .flow__dot{transform:none;opacity:1}
.flow__node:nth-child(2) .flow__dot{transition-delay:.35s}.flow__node:nth-child(3) .flow__dot{transition-delay:.7s}.flow__node:nth-child(4) .flow__dot{transition-delay:1.05s}.flow__node:nth-child(5) .flow__dot{transition-delay:1.4s}
.flow__node:hover .flow__dot,.flow__node:focus-within .flow__dot,.flow__node:focus .flow__dot{background:#000}
.flow__node h3{margin:0 0 .3rem;font-family:var(--disp);font-weight:700;font-size:1.15rem;line-height:1.2}
.flow__what{margin:0;color:var(--mut);font-size:.88rem;line-height:1.5}
.flow__card{position:absolute;left:0;right:-.6rem;top:calc(100% + .8rem);z-index:3;background:#000;color:#f2f1ef;border-radius:.6rem;padding:1rem 1.1rem;font-size:.88rem;line-height:1.55;opacity:0;transform:translateY(8px);pointer-events:none;transition:opacity .3s ease,transform .4s cubic-bezier(.16,1,.3,1)}
.flow__card b{display:block;font:700 .66rem/1 var(--read);letter-spacing:.18em;text-transform:uppercase;color:#9a9aa0;margin-bottom:.5rem}
.flow__card a{color:#f2f1ef;font-weight:700;text-decoration:none;border-bottom:1px solid rgba(242,241,239,.5)}
.flow__node:hover .flow__card,.flow__node:focus-within .flow__card,.flow__node:focus .flow__card{opacity:1;transform:none;pointer-events:auto}
.flow__hint{margin:1rem 0 0;font:400 .74rem/1 var(--mono);letter-spacing:.08em;color:#77777e}
@media (max-width:880px){
  .flow__line{display:none}
  .flow__nodes{grid-template-columns:1fr;gap:1.4rem}
  .flow__node{padding:0 0 0 1.6rem;border-left:2px solid #000}
  .flow__dot{top:.15rem;left:-.65rem;transform:none;opacity:1;background:#000}
  .flow__card{position:static;opacity:1;transform:none;pointer-events:auto;margin-top:.7rem}
}
@media (prefers-reduced-motion:reduce){.flow__line path{stroke-dashoffset:0;transition:none}.flow__dot{transform:none;opacity:1;transition:none}.flow__card{transition:none}}

/* ---------- Professional Services: Akte mit Fundstellen (weiß) ---------- */
.dossier{background:#fff;padding:clamp(3rem,8vh,5rem) 0}
.dossier h2{margin:0 0 .6rem;font-family:var(--disp);font-weight:700;font-size:clamp(2rem,3.1vw,3rem);line-height:1.08;letter-spacing:-.01em;max-width:34rem}
.dossier__lead{margin:0 0 clamp(1.6rem,4vh,2.4rem);color:var(--mut);font-size:.98rem;line-height:1.65;max-width:40rem}
.dossier__grid{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:clamp(1.6rem,4vw,4rem);align-items:start}
.dossier__doc{overflow:hidden;background:#fff;border:1.5px solid #000;border-radius:.4rem;padding:1.6rem 1.8rem;box-shadow:.5rem .5rem 0 #000}
.dossier__head{display:flex;gap:.6rem;margin-bottom:1.2rem}
.dossier__head span{height:.7rem;background:#000;border-radius:2px;width:38%}
.dossier__head span+span{width:22%;background:#c9c9cf}
.dossier__line{position:relative;height:.55rem;margin:0 0 .7rem;background:#e2e2e6;border-radius:2px}
.dossier__line--short{width:62%}
.dossier__line .mark{position:absolute;left:0;top:-.35rem;max-width:100%;box-sizing:border-box;overflow:hidden;text-overflow:ellipsis;height:1.25rem;line-height:1.25rem;padding:0 .4rem;font:700 .62rem/1.25rem ui-monospace,Menlo,monospace;letter-spacing:.04em;text-transform:uppercase;color:#000;background:#fff;border:1px solid #000;border-radius:2px;white-space:nowrap;transition:background .25s ease,color .25s ease,transform .3s ease}
.dossier__finds{list-style:none;margin:0;padding:0}
.find{display:grid;gap:.25rem;padding:.9rem 1rem;border-top:1px solid #e2e2e6;border-radius:.4rem;cursor:default;outline:none;transition:background .25s ease,transform .3s ease}
.find:last-child{border-bottom:1px solid #e2e2e6}
.find b{font-family:var(--disp);font-weight:700;font-size:1.05rem;line-height:1.3}
.find span{color:#55555c;font-size:.9rem;line-height:1.55}
.find em{font:400 .72rem/1 var(--mono);letter-spacing:.06em;color:#77777e;font-style:normal;margin-top:.2rem}
.find:hover,.find:focus{background:#000;color:#fff;transform:translateX(.3rem)}
.find:hover b,.find:focus b{color:#fff}.find:hover span,.find:focus span{color:#c9c9cf}.find:hover em,.find:focus em{color:#9a9aa0}
.dossier__grid:has(.find--1:hover,.find--1:focus) .mark--1,.dossier__grid:has(.find--2:hover,.find--2:focus) .mark--2,.dossier__grid:has(.find--3:hover,.find--3:focus) .mark--3,.dossier__grid:has(.find--4:hover,.find--4:focus) .mark--4,.dossier__grid:has(.find--5:hover,.find--5:focus) .mark--5{background:#000;color:#fff;transform:scale(1.04)}
.dossier__foot{margin:1.4rem 0 0;color:var(--mut);font-size:.9rem;line-height:1.6;max-width:40rem}
@media (max-width:880px){.dossier__grid{grid-template-columns:1fr}.dossier__doc{padding:1.2rem}.dossier__line .mark{font-size:.56rem;padding:0 .3rem}}
@media (prefers-reduced-motion:reduce){.find,.dossier__line .mark{transition:none}}

/* ---------- Defence: Einstufungs-Schalter (weiß) ---------- */
.levels{background:#fff;padding:clamp(3rem,8vh,5rem) 0}
.levels h2{margin:0 0 .6rem;font-family:var(--disp);font-weight:700;font-size:clamp(2rem,3.1vw,3rem);line-height:1.08;letter-spacing:-.01em;max-width:34rem}
.levels__lead{margin:0 0 clamp(1.4rem,3vh,2rem);color:var(--mut);font-size:.98rem;line-height:1.65;max-width:40rem}
.levels__switch{display:inline-flex;flex-wrap:wrap;gap:.4rem;padding:.35rem;border:1.5px solid #000;border-radius:999px;margin-bottom:clamp(1.4rem,3vh,2rem)}
.levels__btn{font:700 .78rem/1 var(--read);letter-spacing:.1em;text-transform:uppercase;border:0;background:transparent;color:#000;border-radius:999px;padding:.7rem 1.1rem;cursor:pointer;transition:background .25s ease,color .25s ease}
.levels__btn.is-on{background:#000;color:#fff}
.levels__panels{display:grid}
.levels__panel{grid-area:1/1;opacity:0;transform:translateY(8px);pointer-events:none;transition:opacity .35s ease,transform .45s cubic-bezier(.16,1,.3,1)}
.levels__panel.is-on{opacity:1;transform:none;pointer-events:auto}
.levels__arch{display:flex;align-items:center;flex-wrap:wrap;gap:.6rem;margin-bottom:1.4rem}
.levels__arch .node{font:700 .8rem/1.3 var(--read);letter-spacing:.04em;border:1.5px solid #000;border-radius:.5rem;padding:.7rem .9rem;background:#fff}
.levels__arch .node--you{background:#000;color:#fff}
.levels__arch .node--off{border-style:dashed;color:#9a9aa0;border-color:#c9c9cf;text-decoration:line-through}
.levels__arch .link{flex:0 0 3rem;height:2px;background:#000}
.levels__arch .link--off{background:repeating-linear-gradient(90deg,#c9c9cf 0 6px,transparent 6px 12px)}
.levels__list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.levels__list li{border-top:2px solid #000;padding-top:.8rem}
.levels__list b{display:block;font:700 .7rem/1 var(--read);letter-spacing:.2em;text-transform:uppercase;color:#77777e;margin-bottom:.5rem}
.levels__list span{color:#3f3f45;font-size:.92rem;line-height:1.6}
.levels__list a{color:#000;font-weight:700;text-decoration:none;border-bottom:1.5px solid #000}
.levels__foot{margin:1.6rem 0 0;color:var(--mut);font-size:.9rem;line-height:1.6;max-width:40rem}
@media (max-width:880px){.levels__list{grid-template-columns:1fr}.levels__arch .link{flex-basis:1.4rem}}
@media (prefers-reduced-motion:reduce){.levels__panel,.levels__btn{transition:none}}

/* ---------- Übersicht: These-Header ohne Bild, Kachelraster, „Was gleich ist" ---------- */
.hdrT{background:#fff}
.hdrT .inner{padding-block:clamp(3rem,9vh,5.5rem) clamp(2.4rem,6vh,4rem);display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(2rem,5vw,5rem);align-items:end}
.hdrT h1{margin:0 0 1.2rem;font-family:var(--disp);font-weight:700;font-size:clamp(2.6rem,5.2vw,5.4rem);line-height:1.02;letter-spacing:-.01em}
.hdrT h1 .xf{font-family:"Axodren Display Ext","Axodren Display",sans-serif}
.hdrT p{margin:0 0 1rem;color:var(--mut);font-size:1rem;line-height:1.65;max-width:34rem}
.hdrT__jump{display:flex;flex-wrap:wrap;gap:.5rem}
.hdrT__jump a{font:700 .74rem/1 var(--read);letter-spacing:.12em;text-transform:uppercase;color:#000;border:1.5px solid #000;border-radius:999px;padding:.6rem .9rem;text-decoration:none;transition:background .25s ease,color .25s ease}
.hdrT__jump a:hover{background:#000;color:#fff}
.tiles{background:#fff;padding:clamp(3rem,8vh,5rem) 0}
.tiles__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1.2rem,2.4vw,2rem)}
.tile{position:relative;display:block;color:inherit;text-decoration:none;border:1.5px solid #000;border-radius:.8rem;padding:1.2rem;overflow:hidden;transition:transform .45s cubic-bezier(.16,1,.3,1),box-shadow .3s ease}
.tile:hover{transform:translateY(-4px);box-shadow:.5rem .5rem 0 #000}
.tile__vis{aspect-ratio:1;border-radius:.5rem;overflow:hidden;margin-bottom:1rem;background:#fff}
.tile__vis img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.16,1,.3,1)}
.tile__vis .ph{width:100%;height:100%;aspect-ratio:auto}
.tile:hover .tile__vis img{transform:scale(1.06)}
.tile__no{margin:0 0 .3rem;font:400 .74rem/1 var(--mono);letter-spacing:.08em;color:#9a9aa0}
.tile h3{margin:0 0 .5rem;font-family:var(--disp);font-weight:700;font-size:clamp(1.3rem,1.9vw,1.7rem);line-height:1.2}
.tile__txt{display:grid;min-height:3.2rem}
.tile__txt span{grid-area:1/1;color:#55555c;font-size:.92rem;line-height:1.5;transition:opacity .3s ease,transform .4s cubic-bezier(.16,1,.3,1)}
.tile__txt .q{opacity:0;transform:translateY(6px);color:#000;font-weight:700}
.tile:hover .tile__txt .s,.tile:focus-visible .tile__txt .s{opacity:0;transform:translateY(-6px)}
.tile:hover .tile__txt .q,.tile:focus-visible .tile__txt .q{opacity:1;transform:none}
.tile__more{position:absolute;right:1.2rem;bottom:1.2rem;font:700 .7rem/1 var(--read);letter-spacing:.14em;text-transform:uppercase;opacity:0;transition:opacity .3s ease}
.tile:hover .tile__more{opacity:1}
.tile--wide{grid-column:span 2}
.tile--wide .tile__vis{aspect-ratio:21/9}
.same{background:var(--ink);color:var(--bone);padding:clamp(3rem,8vh,5rem) 0}
.same h2{margin:0 0 .8rem;font-family:var(--disp);font-weight:700;font-size:clamp(2rem,3.1vw,3rem);line-height:1.08;letter-spacing:-.01em;max-width:34rem}
.same__lead{margin:0 0 clamp(2rem,5vh,3rem);color:#b9b9c0;font-size:.98rem;line-height:1.65;max-width:38rem}
.same__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1.6rem,3.5vw,3.5rem)}
.same__item{display:block;color:inherit;text-decoration:none}
.same__item img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:cover;border-radius:.6rem;background:#000;transition:transform .6s cubic-bezier(.16,1,.3,1)}
.same__item:hover img{transform:scale(1.04)}
.same__item h3{margin:1.1rem 0 .5rem;font-family:var(--disp);font-weight:700;font-size:1.2rem;line-height:1.25}
.same__item p{margin:0;color:#b9b9c0;font-size:.92rem;line-height:1.65}
.same__item b{display:inline-block;margin-top:.8rem;font:700 .7rem/1 var(--read);letter-spacing:.14em;text-transform:uppercase;color:#f2f1ef;border-bottom:2px solid #f2f1ef;padding-bottom:.25rem}
@media (max-width:880px){.hdrT .inner{grid-template-columns:1fr}.tiles__grid{grid-template-columns:repeat(2,minmax(0,1fr))}.tile--wide{grid-column:span 2}.same__grid{grid-template-columns:1fr}}
@media (max-width:560px){.tiles__grid{grid-template-columns:1fr}.tile--wide{grid-column:auto}.tile--wide .tile__vis{aspect-ratio:1}}
@media (prefers-reduced-motion:reduce){.tile,.tile__vis img,.tile__txt span,.tile__more,.same__item img,.hdrT__jump a{transition:none}.tile__txt .q{display:none}}

/* Gespiegelter Tagesablauf: linke Spalte schwarz, rechte weiß */
.day--inv{background:#fff;color:var(--ink)}
.day--inv::before{background:var(--ink)}
.day--inv .day__side,.day--inv .day__side h2,.day--inv .day__panel .day__time,.day--inv .day__panel h3{color:#f2f1ef}
.day--inv .day__panel p{color:#b9b9c0}
.day--inv .day__panel p b{color:#9a9aa0}
.day--inv .day__meter{background:rgba(242,241,239,.18)}
.day--inv .day__meter i{background:#f2f1ef}
.day--inv .day__scene .day__vis{background:#fff;border:1px solid #e2e2e6}
.day--inv .day__scene .day__vis img{filter:none}
.day--inv .day__scene p:last-child{color:#55555c}
.day--inv .day__scene .day__ai{border-color:rgba(0,0,0,.35);color:var(--ink)}
@media (max-width:880px){.day--inv .day__side{background:var(--ink);color:#f2f1ef}}

/* Fenster-Illustration in der Wochen-Szene (Finanzen) */
.day__scene .day__vis--win{aspect-ratio:auto;max-width:26rem;background:transparent;border:0;border-radius:0;overflow:visible}
.day--inv .day__scene .day__vis--win{background:transparent;border:0}
/* Dossier-Dokument mit Fensterleiste */
.dossier__doc{padding-top:0;overflow:hidden}
.dossier__bar{display:flex;align-items:center;gap:1.2rem;margin:0 -1.8rem 1.2rem;padding:.6rem 1.2rem;background:#000;color:#9a9aa0;font:400 .68rem/1 var(--mono);letter-spacing:.08em}
.dossier__bar i{width:.55rem;height:.55rem;border-radius:50%;background:#ff5f57;box-shadow:.95rem 0 0 #febc2e,1.9rem 0 0 #28c840;margin-right:1.9rem}
.day__scene:has(.day__vis--win){grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)}
.day__scene .day__vis--win{max-width:30rem}