/* ===== inline-01 ===== */
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#08090c;color:#f2f0ea;font-family:Arial,Helvetica,sans-serif;overflow-x:hidden;cursor:none}::selection{background:#d7ff5f;color:#08090c}a{color:inherit;text-decoration:none}button{font:inherit}.mono,.eyebrow,.tag,.num,nav,.tiny{font-family:Consolas,Monaco,monospace;letter-spacing:.12em;text-transform:uppercase}.progress{position:fixed;z-index:999;left:0;top:0;height:2px;width:0;background:#d7ff5f}.cursor,.dot{position:fixed;z-index:1000;left:0;top:0;pointer-events:none;border-radius:50%;transform:translate(-50%,-50%)}.cursor{width:38px;height:38px;border:1px solid #fff9;mix-blend-mode:difference;transition:width .2s,height .2s}.dot{width:4px;height:4px;background:#fff}.cursor.hot{width:68px;height:68px}nav{position:fixed;z-index:100;top:0;left:0;right:0;height:76px;padding:0 4vw;display:flex;align-items:center;justify-content:space-between;background:linear-gradient(#08090ccc,transparent);font-size:10px}.brand{display:flex;gap:8px;align-items:center}.brand b{font-size:18px}.navlinks{display:flex;gap:30px}.navlinks a{opacity:.65;transition:.2s}.navlinks a:hover{opacity:1}.cta{border:1px solid #ffffff45;border-radius:99px;padding:13px 18px;transition:.25s}.cta:hover{background:#f2f0ea;color:#08090c}.hero{height:520vh;position:relative;background:#050509}.heroStage{position:sticky;top:0;height:100svh;min-height:680px;overflow:hidden}.hero canvas{position:absolute;inset:0;width:100%;height:100%}.vignette{position:absolute;inset:0;background:radial-gradient(circle at 50% 48%,transparent 0 22%,#05050922 48%,#050509d8 92%),linear-gradient(90deg,#050509a8 0,transparent 45%,#05050955);pointer-events:none}.grid{position:absolute;inset:0;background-image:linear-gradient(#ffffff08 1px,transparent 1px),linear-gradient(90deg,#ffffff08 1px,transparent 1px);background-size:72px 72px;mask-image:linear-gradient(to bottom,transparent,#000 20%,#000 70%,transparent);opacity:.2;transform:perspective(500px) rotateX(62deg) scale(1.8) translateY(26%)}.heroCopy{position:absolute;z-index:5;left:5vw;right:5vw;top:16vh;will-change:transform,opacity}.eyebrow{font-size:9px;color:#b8b4b3}.hero h1{font-size:clamp(70px,10.5vw,180px);line-height:.75;letter-spacing:-.075em;margin:8vh 0 5vh;max-width:1250px}.outline{color:transparent;-webkit-text-stroke:1px #eee}.acid{color:#d7ff5f}.heroBottom{display:flex;align-items:center;gap:4vw}.heroBottom p{font-size:13px;line-height:1.6;color:#aaa6a5}.magnetic{display:inline-flex;align-items:center;gap:14px;background:#f0eee8;color:#090a0d;border-radius:99px;padding:20px 25px;font:10px Consolas,monospace;transition:transform .15s,background .2s}.magnetic:hover{background:#d7ff5f}.scroll{position:absolute;z-index:6;right:4vw;bottom:5vh;font-size:8px;writing-mode:vertical-rl;color:#777}.heroPhase{position:absolute;z-index:8;left:50%;top:50%;transform:translate(-50%,-50%) scale(.9);font-weight:900;font-size:clamp(70px,16vw,260px);line-height:.75;letter-spacing:-.08em;text-align:center;opacity:0;pointer-events:none;mix-blend-mode:screen;will-change:transform,opacity}.heroPhase span{display:block;color:#f4f0ff;text-shadow:0 0 40px #8a6cff88}.heroPhase small{display:block;font:9px Consolas,monospace;letter-spacing:.4em;color:#d7ff5f;margin-top:30px}.heroPortal{position:absolute;z-index:7;left:50%;top:50%;width:12vmin;height:12vmin;border:1px solid #d7ff5f;border-radius:50%;transform:translate(-50%,-50%) scale(0);box-shadow:0 0 60px #d7ff5f88,inset 0 0 30px #d7ff5f55;opacity:0;will-change:transform,opacity}.heroHud{position:absolute;z-index:9;left:5vw;bottom:5vh;font:8px Consolas,monospace;letter-spacing:.16em;color:#ffffff66}.heroHud b{color:#d7ff5f;font-weight:400}.heroCounter{position:absolute;z-index:9;right:5vw;top:14vh;font:9px Consolas,monospace;color:#ffffff66}.heroCounter strong{font-size:34px;color:#fff;letter-spacing:-.05em}.heroFlash{position:absolute;inset:0;z-index:4;background:#d7ff5f;opacity:0;pointer-events:none;mix-blend-mode:screen}.section{padding:12vh 6vw}.paper{background:#e9e5dd;color:#0a0b0d}.label{font:9px Consolas,monospace;letter-spacing:.13em;text-transform:uppercase;opacity:.55}.statement{min-height:100vh;display:flex;align-items:center}.statement h2,.big{font-size:clamp(62px,9vw,150px);line-height:.82;letter-spacing:-.075em;margin:35px 0}.statement h2 i,.big i{font-family:Georgia,serif;font-weight:400;color:#777}.statement p{max-width:650px;margin-left:auto;font-size:17px;line-height:1.7;color:#5c5855}.reveal{opacity:0;transform:translateY(55px);filter:blur(8px);transition:1s cubic-bezier(.16,1,.3,1)}.reveal.on{opacity:1;transform:none;filter:none}.head{display:flex;justify-content:space-between;border-top:1px solid #ffffff25;padding-top:14px}.intro{display:grid;grid-template-columns:1.4fr .6fr;gap:8vw;align-items:end;margin:9vh 0}.intro p{font-size:13px;line-height:1.7;color:#989597}.workgrid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.tilt{perspective:1200px}.card{height:76vh;min-height:570px;position:relative;overflow:hidden;border:1px solid #ffffff17;padding:24px;display:flex;flex-direction:column;justify-content:space-between;transform-style:preserve-3d;transition:transform .12s ease-out}.card:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at var(--x,50%) var(--y,50%),#ffffff38,transparent 24%);opacity:.6;pointer-events:none}.top{display:flex;justify-content:space-between;font:9px Consolas,monospace;letter-spacing:.12em;position:relative;z-index:2}.visual{position:absolute;inset:12% 7% 31%;display:grid;place-items:center}.artifact{width:42%;aspect-ratio:1;box-shadow:0 40px 100px #0009;transform:translateZ(60px);animation:float 5s ease-in-out infinite}.slot{position:absolute;bottom:0;font:8px Consolas,monospace;letter-spacing:.18em;opacity:.55}.c1{background:radial-gradient(circle at 55% 35%,#927bff,#251e49 35%,#0a0910 73%)}.c1 .artifact{border-radius:50%;background:radial-gradient(circle at 34% 25%,#fff,#d6d0ff 12%,#4e3b9c 45%,#08070e 72%)}.c2{background:linear-gradient(145deg,#1b433b,#08100f 62%)}.c2 .artifact{border-radius:42% 58% 65% 35%;background:conic-gradient(#b7ffec,#0e6856,#a7ffe9,#163d35)}.c3{background:linear-gradient(160deg,#382b35,#100d12 62%)}.c3 .artifact{width:50%;border:1px solid #fff8;background:linear-gradient(135deg,#ffffffc2,#79677722);transform:rotate(28deg) translateZ(60px);backdrop-filter:blur(12px)}.c4{background:radial-gradient(circle at 50% 36%,#d9ff55,#51611b 18%,#0b0c08 62%)}.c4 .artifact{border-radius:22%;background:repeating-radial-gradient(circle,#d9ff55 0 2px,transparent 3px 12px);box-shadow:0 0 100px #d9ff5544}.card h3{position:relative;z-index:2;font-size:clamp(48px,6vw,96px);line-height:.78;letter-spacing:-.07em;margin:0}.card p{position:relative;z-index:2;max-width:380px;color:#c5c1c0;font-size:12px;line-height:1.6}@keyframes float{50%{transform:translateY(-18px) translateZ(60px)}}.compare{min-height:100vh;background:#111216;color:#f2f1ec;display:grid;place-items:center;position:relative;overflow:hidden}.compareInner{width:min(1100px,88vw)}.compare .label{color:#b9ff38}.compare h2{font-size:clamp(65px,9vw,145px);line-height:.78;letter-spacing:-.075em;margin:20px 0 60px}.slider{height:430px;position:relative;overflow:hidden;background:#dedbd3;box-shadow:0 40px 100px #00000055}.before,.after{position:absolute;inset:0;display:grid;place-items:center}.before{background:linear-gradient(135deg,#ddd,#aaa);color:#555}.before .mock{width:70%;height:60%;background:white;border:1px solid #aaa;padding:25px}.mock b{display:block;font-size:32px;margin-bottom:25px}.mock span{display:block;height:10px;background:#ddd;margin:10px 0}.after{clip-path:inset(0 50% 0 0);background:radial-gradient(circle at 55% 40%,#846aff,#17132c 30%,#08090c 70%);color:#fff}.after strong{font-size:clamp(50px,8vw,120px);letter-spacing:-.07em}.handle{position:absolute;z-index:5;top:0;bottom:0;left:50%;width:2px;background:#fff}.handle:after{content:"↔";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:54px;height:54px;border-radius:50%;background:#fff;color:#000;display:grid;place-items:center;font-size:20px}.marquee{overflow:hidden;border-block:1px solid #ffffff22;padding:18px 0;white-space:nowrap}.marquee div{font:10px Consolas,monospace;letter-spacing:.16em;width:max-content;animation:marquee 24s linear infinite}@keyframes marquee{to{transform:translateX(-50%)}}.about{background:#e9e5dd;color:#090a0c}.aboutgrid{display:grid;grid-template-columns:.8fr 1.2fr;gap:8vw;margin-top:7vh}.portrait{height:70vh;min-height:520px;background:linear-gradient(145deg,#c8c2ba,#918c86);position:relative;display:grid;place-items:center;overflow:hidden}.portrait:after{content:"";position:absolute;width:80%;aspect-ratio:1;border-radius:50%;background:linear-gradient(135deg,#826dff,#9dffe8);filter:blur(50px);opacity:.65}.portrait strong{z-index:2;font-size:clamp(48px,6vw,95px);line-height:.8;letter-spacing:-.07em;mix-blend-mode:overlay}.about h2{font-size:clamp(60px,7vw,115px);line-height:.82;letter-spacing:-.07em;margin:0 0 45px}.lead{font-size:20px;line-height:1.5}.about p:not(.lead){color:#5c5855;line-height:1.75}.facts{display:grid;grid-template-columns:1fr 1fr;margin-top:7vh;border-top:1px solid #aaa}.facts div{padding:22px 8px;border-bottom:1px solid #aaa}.facts b{display:block;font-size:70px;letter-spacing:-.07em}.facts span{font:9px Consolas,monospace}.lab{min-height:100vh;background:#0a0b0e;position:relative;overflow:hidden}.orb{position:absolute;width:60vw;aspect-ratio:1;border-radius:50%;right:-15vw;top:4vh;background:radial-gradient(circle at 35% 30%,#fff,#c7bfff 12%,#5f4ab8 34%,#10110d 66%);filter:saturate(1.2);box-shadow:0 0 160px #6f5aff44}.lab .big{position:relative;z-index:2}.lab p{position:relative;z-index:2;max-width:620px;color:#aaa;line-height:1.7}.chips{position:relative;z-index:2;display:flex;flex-wrap:wrap;gap:8px;margin-top:7vh}.chips span{border:1px solid #ffffff38;border-radius:99px;padding:12px 15px;font:9px Consolas,monospace}.processRows{border-top:1px solid #ffffff25;margin-top:8vh}.row{display:grid;grid-template-columns:70px 1fr 1fr 40px;align-items:center;border-bottom:1px solid #ffffff25;padding:28px 0}.row h3{font-size:clamp(34px,5vw,74px);letter-spacing:-.06em;margin:0}.row p{color:#999;line-height:1.6;font-size:12px;max-width:430px}.contact{min-height:100vh;display:flex;align-items:center;justify-content:center;text-align:center;position:relative;overflow:hidden}.rings{position:absolute;width:68vw;aspect-ratio:1;border:1px solid #725cff66;border-radius:50%;box-shadow:0 0 0 80px #725cff0c,0 0 0 160px #725cff0a,0 0 0 240px #725cff08;animation:pulse 5s ease-in-out infinite}.contact h2{position:relative;z-index:2;font-size:clamp(62px,9vw,145px);line-height:.78;letter-spacing:-.075em;margin:25px 0}.contact .inner{position:relative;z-index:3}.contact p{font:10px Consolas,monospace;letter-spacing:.1em;color:#999}.contact .magnetic{margin-top:30px}@keyframes pulse{50%{transform:scale(1.07);opacity:.6}}footer{height:110px;border-top:1px solid #ffffff22;display:flex;align-items:center;justify-content:space-between;padding:0 5vw;font:9px Consolas,monospace;color:#888}@media(max-width:800px){body{cursor:auto}.cursor,.dot{display:none}nav{height:64px}.navlinks{display:none}.heroStage{min-height:680px}.heroCopy{top:16vh}.hero h1{font-size:16vw;margin-top:10vh}.heroBottom{flex-direction:column;align-items:flex-start}.grid{background-size:45px 45px}.statement h2,.big{font-size:15vw}.statement p{margin-left:0}.intro{grid-template-columns:1fr}.workgrid{grid-template-columns:1fr}.card{height:68vh;min-height:510px}.aboutgrid{grid-template-columns:1fr}.portrait{height:55vh;min-height:430px}.row{grid-template-columns:42px 1fr 20px;gap:8px}.row p{grid-column:2/4}.slider{height:330px}.facts b{font-size:52px}footer span:last-child{display:none}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}.reveal{opacity:1;transform:none;filter:none}.card{transform:none!important}}

/* ===== inline-02 ===== */
.boot{position:fixed;inset:0;z-index:999;background:#050505;display:grid;place-items:center;pointer-events:none;animation:bootAway 1.15s cubic-bezier(.7,0,.2,1) 2.85s forwards}
.bootMark{font:800 clamp(34px,6vw,92px)/.8 Arial,sans-serif;letter-spacing:-.07em;transform:scale(.82);opacity:0;animation:bootMark 1.15s cubic-bezier(.2,.8,.2,1) forwards}
.bootMark i{font-style:normal;color:transparent;-webkit-text-stroke:1px #fff}
@keyframes bootMark{0%{opacity:0;transform:scale(.72);filter:blur(18px)}55%{opacity:1;filter:blur(0)}100%{opacity:1;transform:scale(1.05)}}
@keyframes bootAway{to{opacity:0;visibility:hidden;transform:scale(1.08)}}
.ambient{position:absolute;inset:-15%;z-index:0;pointer-events:none;background:radial-gradient(circle at 28% 35%,rgba(185,255,60,.11),transparent 24%),radial-gradient(circle at 72% 62%,rgba(90,130,255,.12),transparent 28%);filter:blur(18px);animation:ambientDrift 7s ease-in-out infinite alternate}
@keyframes ambientDrift{to{transform:translate3d(3%,-2%,0) scale(1.08)}}
.firstCue{position:absolute;z-index:12;left:50%;bottom:4vh;transform:translateX(-50%);font:700 10px/1 Arial,sans-serif;letter-spacing:.28em;white-space:nowrap;opacity:.8}
.firstCue:after{content:"";display:block;width:1px;height:42px;background:#fff;margin:12px auto 0;animation:cue 1.25s ease-in-out infinite}
@keyframes cue{0%{transform:scaleY(.15);transform-origin:top;opacity:.25}50%{transform:scaleY(1);opacity:1}100%{transform:scaleY(.15);transform-origin:bottom;opacity:.25}}
.heroIntroFlash{position:absolute;inset:0;z-index:8;pointer-events:none;background:radial-gradient(circle at center,rgba(255,255,255,.18),transparent 32%);opacity:0;animation:introFlash 2.4s ease-out 1.25s 1}
@keyframes introFlash{0%{opacity:0}18%{opacity:.85}100%{opacity:0}}

/* ===== inline-03 ===== */
.darkBridge{
  position:relative;min-height:105vh;background:#070707!important;color:#f4f2ed!important;
  padding:10vh 5vw 8vh;overflow:hidden;border-top:1px solid rgba(255,255,255,.08)
}
.darkBridge .bridgeGlow{
  position:absolute;width:58vw;height:58vw;right:-22vw;top:-20vw;border-radius:50%;
  background:radial-gradient(circle,rgba(190,255,50,.12),rgba(190,255,50,.025) 35%,transparent 68%);
  filter:blur(20px);pointer-events:none
}
.bridgeTop{display:flex;justify-content:space-between;position:relative;z-index:2;
  font:600 9px/1 Arial,sans-serif;letter-spacing:.26em;color:#777}
.bridgeMain{position:relative;z-index:2;margin-top:13vh}
.bridgeLine{display:grid;grid-template-columns:minmax(90px,14vw) 1fr;align-items:end;
  border-bottom:1px solid rgba(255,255,255,.13);padding:1.1vh 0;transition:.4s}
.bridgeLine span{font:600 10px/1 Arial,sans-serif;letter-spacing:.22em;color:#666;padding-bottom:1.2vw}
.bridgeLine strong{font:900 clamp(76px,14vw,220px)/.75 Arial,Helvetica,sans-serif;
  letter-spacing:-.085em;color:#f3f1ec}
.bridgeLine.accent strong{color:transparent;-webkit-text-stroke:1.5px #baff35}
.bridgeLine:hover{padding-left:1vw}.bridgeLine:hover strong{transform:translateX(1vw)}
.bridgeLine strong{transition:.45s cubic-bezier(.2,.8,.2,1)}
.bridgeBottom{position:relative;z-index:2;margin-top:8vh;display:flex;justify-content:flex-end;gap:9vw;align-items:end}
.bridgeBottom p{width:min(470px,80vw);font:400 clamp(16px,1.35vw,21px)/1.45 Arial,sans-serif;color:#aaa;margin:0}
.bridgeArrow{font:300 64px/1 Arial,sans-serif;color:#baff35;animation:bridgeBob 1.6s ease-in-out infinite}
@keyframes bridgeBob{50%{transform:translateY(12px)}}
@media(max-width:700px){
 .darkBridge{min-height:90vh;padding:10vh 7vw 7vh}
 .bridgeTop span:last-child{display:none}.bridgeMain{margin-top:12vh}
 .bridgeLine{grid-template-columns:1fr}.bridgeLine span{padding:0 0 12px}
 .bridgeLine strong{font-size:22vw}.bridgeBottom{justify-content:space-between;align-items:end}
}

/* ===== inline-04 ===== */
.workGate{background:#070707;color:#f3f1ec;padding:14vh 5vw 10vh;position:relative}
.gateHead{display:grid;grid-template-columns:16vw 1fr minmax(260px,30vw);align-items:end;margin-bottom:12vh}
.gateHead>span{font:600 9px/1 Arial,sans-serif;letter-spacing:.28em;color:#777;align-self:start}
.gateHead h2{font:900 clamp(70px,12vw,180px)/.72 Arial,Helvetica,sans-serif;letter-spacing:-.085em;margin:0}
.gateHead h2 i{font-style:normal;color:transparent;-webkit-text-stroke:1px #777}
.gateHead p{font:400 clamp(15px,1.2vw,19px)/1.5 Arial,sans-serif;color:#888;margin:0 0 .6vw}
.gateList{border-top:1px solid #282828}
.gateRow{min-height:25vh;display:grid;grid-template-columns:8vw 1fr 30vw 55px;align-items:center;text-decoration:none;color:inherit;border-bottom:1px solid #282828;position:relative;overflow:hidden;transition:.45s cubic-bezier(.2,.8,.2,1)}
.gateRow:before{content:"";position:absolute;inset:0;background:#efede7;transform:translateY(102%);transition:.5s cubic-bezier(.7,0,.2,1);z-index:0}
.gateRow>*{position:relative;z-index:1}
.gateNum{font:600 10px/1 Arial,sans-serif;letter-spacing:.2em;color:#666}
.gateRow strong{font:900 clamp(42px,6.5vw,105px)/.75 Arial,Helvetica,sans-serif;letter-spacing:-.065em;transition:.45s}
.gateRow strong em{font-style:normal;color:#5c5c5c;transition:.45s}
.gateMeta{font:600 9px/1.5 Arial,sans-serif;letter-spacing:.2em;color:#686868}
.gateGo{font:300 34px/1 Arial,sans-serif;transition:.45s}
.gateRow:hover:before{transform:translateY(0)}
.gateRow:hover{color:#070707;padding-left:1.2vw}
.gateRow:hover strong em,.gateRow:hover .gateMeta,.gateRow:hover .gateNum{color:#555}
.gateRow:hover .gateGo{transform:rotate(45deg) scale(1.2)}
.gateFooter{height:24vh;display:flex;justify-content:flex-end;align-items:end;font:600 9px/1 Arial,sans-serif;letter-spacing:.27em;color:#666}
.gateFooter b{font-size:35px;color:#baff35;margin-left:20px;animation:gateBob 1.5s ease-in-out infinite}
@keyframes gateBob{50%{transform:translateY(10px)}}
@media(max-width:760px){
 .workGate{padding:12vh 7vw 8vh}.gateHead{grid-template-columns:1fr;margin-bottom:9vh}
 .gateHead>span{margin-bottom:8vh}.gateHead p{margin-top:5vh}
 .gateRow{grid-template-columns:42px 1fr 30px;min-height:22vh}
 .gateMeta{display:none}.gateRow strong{font-size:13vw}.gateGo{font-size:26px}
}

/* ===== mobile-type-only ===== */
@media (max-width:760px){
  .bootMark{
    font-size:clamp(28px,9vw,44px)!important;
    letter-spacing:-.045em!important;
    white-space:nowrap!important;
  }
  .bridgeLine strong{
    font-size:clamp(54px,15vw,86px)!important;
    line-height:.84!important;
    letter-spacing:-.07em!important;
  }
  .gateRow strong{
    font-size:clamp(38px,10.5vw,60px)!important;
    line-height:.86!important;
    letter-spacing:-.055em!important;
  }
  .gateRow strong em{
    font-size:.82em!important;
  }
  .next h2,.contact h2,.final h2,.end h2{
    font-size:clamp(42px,11vw,62px)!important;
    line-height:.9!important;
  }
}
@media (max-width:390px){
  .bridgeLine strong{font-size:14vw!important}
  .gateRow strong{font-size:9.8vw!important}
}

/* ===== category-preview-upgrade ===== */
/* Compact, image-led category gateway */
.gateHead{margin-bottom:7vh!important}
.gateRow{
  min-height:58vh!important;
  isolation:isolate;
  background:#070707;
}
.gateRow:before{display:none!important}
.gatePreview{
  position:absolute!important;z-index:0!important;
  inset:6% 2% 6% 23%;
  background-size:cover;background-position:center;
  opacity:.06;
  transform:scale(1.08);
  filter:saturate(.82) contrast(1.08);
  transition:opacity .8s ease,transform 1.1s cubic-bezier(.2,.8,.2,1),filter .8s ease;
}
.gatePreview:after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,#070707 0%,rgba(7,7,7,.58) 30%,rgba(7,7,7,.16) 68%,rgba(7,7,7,.5) 100%);
}
.gateRow.is-active .gatePreview{
  opacity:.48;transform:scale(1);filter:saturate(.95) contrast(1.05);
}
.gateRow strong,.gateRow .gateNum,.gateRow .gateMeta,.gateRow .gateGo{z-index:2!important}
.gateRow.is-active strong em{color:#a5a5a5}
.gateRow.is-active .gateGo{transform:rotate(45deg) scale(1.15)}
@media(max-width:760px){
 .gateHead{margin-bottom:5vh!important}
 .gateRow{min-height:48vh!important;grid-template-columns:42px 1fr 30px!important}
 .gatePreview{inset:7% -5% 7% 18%;opacity:.04;background-position:center}
 .gateRow.is-active .gatePreview{opacity:.42}
 .gateRow strong{font-size:clamp(36px,10vw,56px)!important}
}

/* ===== boot-subtitle-and-mobile-slider ===== */
.boot{flex-direction:column;gap:22px}
.bootSub{
  font:9px Consolas,Monaco,monospace;
  letter-spacing:.24em;text-transform:uppercase;color:#ffffff82;
  opacity:0;transform:translateY(12px);
  animation:bootSubIn .65s .35s ease forwards;
  text-align:center;padding:0 24px
}
@keyframes bootSubIn{to{opacity:1;transform:none}}
.slider{touch-action:pan-y}
@media(max-width:800px){
  .bootSub{font-size:8px;line-height:1.7;letter-spacing:.17em}
  .handle:after{width:62px;height:62px}
}

/* ===== start-and-hero-speed-fix ===== */
.boot{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:14px!important;
}
.bootMark{margin:0!important}
.bootSub{
  position:static!important;
  display:block!important;
  font:600 clamp(12px,2.8vw,18px)/1.35 Arial,sans-serif!important;
  letter-spacing:.12em!important;
  color:rgba(255,255,255,.72)!important;
  max-width:680px!important;
  padding:0 28px!important;
  margin:0!important;
  text-align:center!important;
}
.firstCue{
  transition:opacity .12s linear,transform .12s linear!important;
}
@media(max-width:800px){
 .boot{gap:12px!important}
 .bootSub{font-size:12px!important;line-height:1.45!important;letter-spacing:.09em!important;max-width:88vw!important}
}

/* ===== real-portrait ===== */
.portraitReal{
 background-size:cover!important;
 background-position:center 20%!important;
 background-repeat:no-repeat!important;
 box-shadow:0 30px 70px rgba(0,0,0,.18);
}
.portraitReal:after{
 content:""!important;
 position:absolute!important;inset:0!important;width:auto!important;
 aspect-ratio:auto!important;border-radius:0!important;
 background:linear-gradient(180deg,transparent 55%,rgba(0,0,0,.16))!important;
 filter:none!important;opacity:1!important;
}
@media(max-width:800px){
 .portraitReal{background-position:center 18%!important;height:62vh!important;min-height:470px!important}
}

/* ===== facts-redesign-v6 ===== */
/* Kompakter, deutlich kräftigerer Zahlenblock */
.facts{
  margin-top:clamp(34px,5vw,70px)!important;
  display:grid!important;
  grid-template-columns:repeat(4,1fr)!important;
  gap:0!important;
  border-top:1px solid rgba(0,0,0,.38)!important;
  border-bottom:1px solid rgba(0,0,0,.38)!important;
}
.fact{
  min-height:190px!important;
  padding:28px 24px 24px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:space-between!important;
  border:0!important;
  border-right:1px solid rgba(0,0,0,.25)!important;
  position:relative!important;
  overflow:hidden!important;
  transition:.35s ease!important;
}
.fact:last-child{border-right:0!important}
.fact:before{
  content:""!important;
  position:absolute!important;left:0;right:100%;bottom:0;height:5px!important;
  background:#0a0a0a!important;
  transition:right .45s cubic-bezier(.2,.8,.2,1)!important;
}
.fact:hover:before{right:0!important}
.fact:hover{background:#0b0b0b!important;color:#f4f1e9!important}
.fact b{
  font-size:clamp(68px,8vw,126px)!important;
  line-height:.72!important;
  letter-spacing:-.075em!important;
  font-weight:800!important;
  margin:0!important;
}
.fact span{
  font:700 12px/1.25 Consolas,Monaco,monospace!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
  margin-top:28px!important;
}
@media(max-width:800px){
 .facts{
   grid-template-columns:1fr 1fr!important;
   margin-top:32px!important;
 }
 .fact{
   min-height:150px!important;
   padding:22px 18px!important;
   border-right:1px solid rgba(0,0,0,.22)!important;
   border-bottom:1px solid rgba(0,0,0,.22)!important;
 }
 .fact:nth-child(2n){border-right:0!important}
 .fact:nth-last-child(-n+2){border-bottom:0!important}
 .fact b{font-size:clamp(64px,20vw,92px)!important}
 .fact span{font-size:11px!important;margin-top:22px!important}
}

/* ===== vertical-journey-v12 ===== */
.facts{display:none!important}
.journey{
  margin-top:clamp(32px,5vw,64px);
  padding:clamp(42px,6vw,76px) clamp(22px,6vw,82px);
  background:#090909;color:#f1eee7;position:relative;overflow:hidden
}
.journeyHead{max-width:900px;margin-bottom:46px}
.journeyHead small{font:700 10px/1 Consolas,monospace;letter-spacing:.22em;color:#d7ff5f}
.journeyHead h3{margin:12px 0 12px;font-size:clamp(42px,6vw,88px);line-height:.86;letter-spacing:-.06em}
.journeyHead p{max-width:620px;color:#8b8b8b;font-size:13px;line-height:1.6}
.journeyList{position:relative;padding-left:56px}
.journeyList:before{
 content:"";position:absolute;left:15px;top:12px;bottom:12px;width:1px;background:#ffffff20
}
.journeyList:after{
 content:"";position:absolute;left:15px;top:12px;width:1px;height:0;background:#d7ff5f;
 transition:height .15s linear
}
.journey.has-progress .journeyList:after{height:var(--journey-progress,0%)}
.journeyItem{
 min-height:128px;display:grid;grid-template-columns:minmax(115px,190px) 1fr;align-items:center;
 border-top:1px solid #ffffff12;position:relative;
 opacity:.34;transform:translateY(20px);transition:.55s cubic-bezier(.2,.8,.2,1)
}
.journeyItem:first-child{border-top:0}
.journeyItem:before{
 content:"";position:absolute;left:-45px;top:50%;width:9px;height:9px;border-radius:50%;
 background:#555;transform:translate(-50%,-50%);transition:.4s
}
.journeyItem.active{opacity:1;transform:none}
.journeyItem.active:before{background:#d7ff5f;box-shadow:0 0 0 8px #d7ff5f15}
.journeyYear{
 font-size:clamp(52px,6vw,92px);font-weight:800;line-height:.75;letter-spacing:-.07em;
 color:#303030;transition:.45s
}
.journeyItem.active .journeyYear{color:#f1eee7}
.journeyEvent b{display:block;font-size:clamp(20px,2.5vw,34px);letter-spacing:-.03em;margin-bottom:5px}
.journeyEvent span{font:400 10px/1.6 Consolas,monospace;letter-spacing:.08em;text-transform:uppercase;color:#777}
.journeyItem.future .journeyYear{color:#d7ff5f30}
.journeyItem.future.active .journeyYear{color:#d7ff5f}
@media(max-width:800px){
 .journey{padding:40px 20px 34px}
 .journeyHead{margin-bottom:26px}
 .journeyHead h3{font-size:48px}
 .journeyList{padding-left:34px}
 .journeyList:before,.journeyList:after{left:7px}
 .journeyItem{min-height:112px;grid-template-columns:100px 1fr;gap:12px}
 .journeyItem:before{left:-27px}
 .journeyYear{font-size:50px}
 .journeyEvent b{font-size:19px}
 .journeyEvent span{font-size:8px;letter-spacing:.05em}
}

/* ===== journey-v13-light ===== */
/* Helle Zeitreise – bewusst nur dieser Bereich */
.journey{
 background:#f1eee6!important;
 color:#111!important;
 box-shadow:
   inset 0 28px 45px -42px rgba(25,25,25,.55),
   inset 0 -28px 45px -42px rgba(25,25,25,.55),
   0 18px 44px rgba(20,20,20,.16)!important;
}
.journeyHead small{color:#87a900!important}
.journeyHead h3{color:#111!important;text-shadow:0 2px 0 rgba(255,255,255,.65)}
.journeyHead p{color:#5f5f5b!important}
.journeyList:before{background:#25252524!important}
.journeyList:after{
 background:#b8e832!important;
 box-shadow:0 0 8px rgba(184,232,50,.32)!important
}
.journeyItem{border-top-color:#16161616!important}
.journeyItem:before{
 background:#a8a8a1!important;
 box-shadow:0 2px 5px rgba(20,20,20,.20)!important
}
.journeyItem.active:before{
 background:#c6f33f!important;
 box-shadow:
   0 0 0 8px rgba(198,243,63,.16),
   0 3px 8px rgba(20,20,20,.26)!important
}
.journeyYear{
 color:#aaa9a2!important;
 text-shadow:0 2px 4px rgba(30,30,30,.12)!important
}
.journeyItem.active .journeyYear{
 color:#111!important;
 text-shadow:0 3px 7px rgba(30,30,30,.18)!important
}
.journeyEvent b{
 color:#151515!important;
 text-shadow:0 1px 0 rgba(255,255,255,.75)!important
}
.journeyEvent span{color:#686862!important}
.journeyItem.future .journeyYear{color:#a4c92e!important}
.journeyItem.future.active .journeyYear{color:#6f8f00!important}

/* ===== ai-section-v14-fill ===== */
.aiPrinciple{
 margin-top:clamp(42px,7vw,82px);
 display:grid;
 grid-template-columns:52px 1fr 52px 1fr 52px 1fr;
 gap:18px 14px;
 padding-top:24px;
 border-top:1px solid rgba(255,255,255,.14);
 max-width:1180px;
}
.aiPrincipleNum{
 font:700 11px/1 Consolas,monospace;
 color:#c6f33f;
 padding-top:4px;
}
.aiPrinciple b{
 display:block;color:#f2efe8;
 font-size:clamp(15px,1.5vw,20px);
 line-height:1.05;margin-bottom:8px;
}
.aiPrinciple span{
 display:block;color:#777;
 font:400 9px/1.55 Consolas,monospace;
 letter-spacing:.05em;text-transform:uppercase;
}
@media(max-width:800px){
 .aiPrinciple{
   grid-template-columns:36px 1fr;
   margin-top:42px;
   gap:20px 8px;
 }
}

/* ===== process-v15-density ===== */
/* Prozess: weniger Leerraum, mehr Inhalt */
.processRow,
.process-item,
.processItem{
 min-height:0!important;
 padding-top:clamp(30px,4vw,48px)!important;
 padding-bottom:clamp(30px,4vw,48px)!important;
}
@media(max-width:800px){
 .processRow,
 .process-item,
 .processItem{
   min-height:0!important;
   padding-top:28px!important;
   padding-bottom:30px!important;
 }
}

/* ===== hero-scroll-length-v20 ===== */
/* Portal endet bei 100% – danach keine zusätzliche leere Bildschirmhöhe mehr. */
@media(max-width:800px){
  #hero{height:410vh!important;min-height:410vh!important}
}
@media(min-width:801px){
  #hero{height:440vh!important;min-height:440vh!important}
}

/* ===== hero-final-gap-fix-v21 ===== */
/* Die letzte, technisch bedingte Hero-Bildschirmhöhe wird vom Folgebereich übernommen. */
#manifesto{
  position:relative!important;
  z-index:8!important;
  margin-top:-92svh!important;
}
@media(max-width:800px){
  #manifesto{margin-top:-96svh!important}
}

/* ===== graphic-portfolio-v22 ===== */
.graphicPortfolio{background:#090a0d;color:#f2f0ea;padding:12vh 5vw 14vh;position:relative}
.gpHead{display:grid;grid-template-columns:.45fr 1.1fr .75fr;gap:4vw;align-items:end;border-top:1px solid #ffffff24;padding-top:18px;margin-bottom:8vh}
.gpHead>span,.gpCaption span,.gpImage figcaption{font:9px Consolas,monospace;letter-spacing:.16em;text-transform:uppercase;color:#8d8d8d}
.gpHead h2{font-size:clamp(66px,10vw,150px);line-height:.76;letter-spacing:-.075em;margin:0}
.gpHead h2 i{font-family:Georgia,serif;font-weight:400;color:#777}
.gpHead p{font-size:14px;line-height:1.75;color:#999;margin:0 0 8px}
.gpHero{position:relative;height:min(78vw,860px);max-height:82vh;overflow:hidden;background:#111}
.gpHero img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s cubic-bezier(.16,1,.3,1)}
.gpHero:hover img{transform:scale(1.025)}
.gpCaption{position:absolute;left:0;right:0;bottom:0;padding:28px;background:linear-gradient(transparent,#050609e8);display:flex;justify-content:space-between;align-items:end}
.gpCaption b{font-size:clamp(28px,4vw,58px);letter-spacing:-.05em}
.gpSplit{display:grid;grid-template-columns:.8fr 1.2fr;gap:7vw;align-items:center;padding:13vh 0}
.gpText .gpNo{font:10px Consolas,monospace;letter-spacing:.18em;color:#d7ff5f}
.gpText h3{font-size:clamp(48px,7vw,100px);line-height:.82;letter-spacing:-.065em;margin:24px 0 35px}
.gpText p{max-width:590px;color:#999;font-size:13px;line-height:1.8}
.gpImage{margin:0;position:relative}.gpImage img{display:block;width:100%;max-height:78vh;object-fit:cover}.gpImage figcaption{margin-top:12px}
.gpSkills{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #ffffff25;border-bottom:1px solid #ffffff25}
.gpSkills>div{padding:28px 24px 32px;border-right:1px solid #ffffff20;min-height:180px}.gpSkills>div:last-child{border-right:0}
.gpSkills b{display:block;font:9px Consolas,monospace;color:#d7ff5f;margin-bottom:34px}.gpSkills strong{display:block;font-size:20px;margin-bottom:12px}.gpSkills span{display:block;color:#777;font-size:11px;line-height:1.6}
.gpReveal{opacity:0;transform:translateY(35px);transition:.9s cubic-bezier(.16,1,.3,1)}.gpReveal.on{opacity:1;transform:none}
@media(max-width:800px){
 .graphicPortfolio{padding:10vh 20px 11vh}
 .gpHead{grid-template-columns:1fr;gap:22px;margin-bottom:5vh}
 .gpHead h2{font-size:19vw}.gpHead p{font-size:13px}
 .gpHero{height:68vh;max-height:none}.gpCaption{padding:18px;display:block}.gpCaption span{display:block;margin-top:8px}
 .gpSplit{grid-template-columns:1fr;padding:9vh 0;gap:6vh}
 .gpText h3{font-size:15vw}
 .gpSkills{grid-template-columns:1fr 1fr}.gpSkills>div{min-height:155px;padding:22px 16px;border-bottom:1px solid #ffffff20}
 .gpSkills>div:nth-child(2){border-right:0}
}

/* ===== inline-18 ===== */
/* VIDEO MOTION INTEGRATED — SCOPED, MOBILE FIX */
.videoMotionWrap{position:relative;z-index:2;background:#050505;overflow:hidden;color:#f4f2ed}
.videoMotionWrap *{box-sizing:border-box}
.videoMotionWrap .videoMotionInner{margin:0;background:#070707;color:#f4f2ed;font-family:Arial,Helvetica,sans-serif;overflow:hidden}
.videoMotionWrap .hero{height:135vh;position:relative;background:#000}
.videoMotionWrap .stick{height:100svh;position:sticky;top:0;overflow:hidden;background:#000}
.videoMotionWrap .stick video{width:100%;height:100%;object-fit:cover;object-position:center center;filter:brightness(.62)}
.videoMotionWrap .heroCopy{position:absolute;z-index:2;left:6vw;right:6vw;bottom:8vh;top:auto}
.videoMotionWrap .eyebrow{font:11px Consolas,monospace;letter-spacing:.28em;text-transform:uppercase}
.videoMotionWrap .hero h1{font-size:clamp(70px,14vw,190px);line-height:.75;letter-spacing:-.075em;margin:18px 0}
.videoMotionWrap .hero p{font-size:clamp(18px,2vw,28px);max-width:700px;color:#ddd}
.videoMotionWrap .statement{min-height:0;padding:9vw 6vw;font-size:clamp(34px,6vw,92px);line-height:.98;letter-spacing:-.05em;max-width:1500px;display:block}
.videoMotionWrap .statement span{color:#666}
.videoMotionWrap .grid{display:grid;grid-template-columns:1fr 1fr;gap:3px;padding:3px;background:#050505;opacity:1;transform:none;mask-image:none}
.videoMotionWrap .card{position:relative;height:72vh;min-height:0;background:#111;overflow:hidden;border:0;padding:0;display:block;transform:none}
.videoMotionWrap .card:nth-child(3n+1){grid-column:1/-1;height:88vh}
.videoMotionWrap .card video{width:100%;height:100%;object-fit:cover;object-position:center center;display:block}
.videoMotionWrap .shade{position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(0,0,0,.8))}
.videoMotionWrap .copy{position:absolute;z-index:2;left:4vw;right:4vw;bottom:4vw}
.videoMotionWrap .copy b{display:block;font-size:11px;letter-spacing:.24em;margin-bottom:10px}
.videoMotionWrap .copy strong{font-size:clamp(26px,4vw,60px);letter-spacing:-.04em;line-height:1}
.videoMotionWrap .split{min-height:82vh;background:#efede7;color:#090909;display:grid;place-items:center;text-align:center;padding:8vw}
.videoMotionWrap .split h2{font-size:clamp(60px,12vw,170px);line-height:.78;letter-spacing:-.075em;margin:20px 0}
.videoMotionWrap .split p{font-size:clamp(18px,2vw,28px);max-width:780px;margin-inline:auto}
.videoMotionWrap .end{padding:10vw 6vw}
.videoMotionWrap .end h2{font-size:clamp(54px,9vw,135px);line-height:.85;letter-spacing:-.065em;margin:0}
.videoMotionWrap .end p{color:#aaa;font-size:20px;max-width:750px}
@media(max-width:760px){
 .videoMotionWrap .hero{height:100svh}
 .videoMotionWrap .stick{height:100svh;position:relative}
 .videoMotionWrap .stick video{object-position:center 42%;filter:brightness(.68)}
 .videoMotionWrap .heroCopy{left:7vw;right:7vw;bottom:8vh}
 .videoMotionWrap .hero h1{font-size:17vw}
 .videoMotionWrap .hero p{font-size:16px;line-height:1.45}
 .videoMotionWrap .statement{padding:11vh 7vw 9vh;font-size:11vw;line-height:.96}
 .videoMotionWrap .grid{grid-template-columns:1fr;gap:2px;padding:2px}
 .videoMotionWrap .card,.videoMotionWrap .card:nth-child(3n+1){grid-column:auto;height:58svh}
 .videoMotionWrap .card video{object-position:center center}
 .videoMotionWrap .copy{left:7vw;right:7vw;bottom:7vw}
 .videoMotionWrap .copy strong{font-size:8vw}
 .videoMotionWrap .split{min-height:72svh;padding:10vh 7vw}
 .videoMotionWrap .split h2{font-size:18vw;margin:18px 0 28px}
 .videoMotionWrap .split p{font-size:18px;line-height:1.4}
 .videoMotionWrap .end{padding:11vh 7vw}
 .videoMotionWrap .end p{font-size:17px;line-height:1.55}
}

/* ===== v46-showcase-frame-fix ===== */
/* Nur Photoshop-Auswahl: weißen Präsentationsrahmen optisch zurücknehmen */
#grafik .workVisual,
#grafik .workMedia,
#grafik .showcaseVisual,
#grafik .showcaseMedia,
#grafik figure {
  background: #090a0d !important;
}
#grafik img {
  box-shadow: none !important;
}

/* ===== v47-real-white-removal ===== */
#grafik img{background:#090a0d!important}

/* ===== v48-video-editorial-layout ===== */
/* VIDEO / MOTION — editorial versetzt, bewusst ohne Rahmen */
#motion .videoOffset48{
  border:0!important;
  box-shadow:none!important;
  overflow:hidden;
}
@media (max-width:800px){
  #motion{
    overflow:hidden!important;
  }
  #motion .videoOffset48{
    width:91%!important;
    margin-top:28px!important;
    margin-bottom:44px!important;
  }
  #motion .videoOffset48:nth-of-type(odd){
    margin-left:0!important;
    margin-right:auto!important;
  }
  #motion .videoOffset48:nth-of-type(even){
    margin-left:auto!important;
    margin-right:0!important;
  }

  /* vorhandene großformatige Motion-Karten ebenfalls rhythmisch trennen */
  #motion .motionCard,
  #motion .videoCard,
  #motion .workCard{
    border:0!important;
    box-shadow:none!important;
    margin-bottom:44px!important;
  }
}

/* ===== v49-motion-real-spacing ===== */
/* Motion: echte Trennung der direkt aufeinanderfolgenden Video-/Bildpanels */
#motion{overflow:hidden!important}

/* Die großflächigen Medienblöcke bekommen auf Desktop UND Mobile eigenen Raum. */
#motion > div,
#motion .motionCard,
#motion .videoCard,
#motion .workCard,
#motion .videoOffset48{
  box-sizing:border-box!important;
}

/* Desktop / 16:9 */
@media (min-width:801px){
  #motion .videoOffset48,
  #motion .motionCard,
  #motion .videoCard,
  #motion .workCard{
    width:88%!important;
    margin-top:0!important;
    margin-bottom:72px!important;
    border:0!important;
    box-shadow:none!important;
  }
  #motion .videoOffset48:nth-of-type(odd),
  #motion .motionCard:nth-of-type(odd),
  #motion .videoCard:nth-of-type(odd),
  #motion .workCard:nth-of-type(odd){
    margin-left:0!important;
    margin-right:auto!important;
  }
  #motion .videoOffset48:nth-of-type(even),
  #motion .motionCard:nth-of-type(even),
  #motion .videoCard:nth-of-type(even),
  #motion .workCard:nth-of-type(even){
    margin-left:auto!important;
    margin-right:0!important;
  }
}

/* Smartphone: ebenfalls klar sichtbarer Abstand statt zusammengeklebter Flächen */
@media (max-width:800px){
  #motion .videoOffset48,
  #motion .motionCard,
  #motion .videoCard,
  #motion .workCard{
    width:92%!important;
    margin-bottom:34px!important;
    border:0!important;
    box-shadow:none!important;
  }
}

/* Sicherheitsregel: unmittelbar aufeinander folgende große Motion-Medien nie kantenbündig verkleben */
#motion video + video,
#motion picture + picture,
#motion figure + figure{
  margin-top:56px!important;
}

/* ===== v50-real-video-cards ===== */
#motion .videoMotionInner{
  overflow:hidden!important;
}
#motion .videoMotionInner article.card{
  width:88%!important;
  margin-top:0!important;
  margin-bottom:56px!important;
  border:0!important;
  box-shadow:none!important;
  position:relative!important;
}
#motion .videoMotionInner article.card:nth-of-type(odd){
  margin-left:0!important;
  margin-right:auto!important;
}
#motion .videoMotionInner article.card:nth-of-type(even){
  margin-left:auto!important;
  margin-right:0!important;
}
#motion .videoMotionInner article.card video{
  width:100%!important;
  display:block!important;
}
@media(max-width:800px){
  #motion .videoMotionInner article.card{
    width:91%!important;
    margin-bottom:38px!important;
  }
  #motion .videoMotionInner article.card:nth-of-type(odd){
    margin-left:0!important;
    margin-right:auto!important;
  }
  #motion .videoMotionInner article.card:nth-of-type(even){
    margin-left:auto!important;
    margin-right:0!important;
  }
}

/* ===== v51-process-parallax-style ===== */
/* Prozess / Arbeitsweise – ruhiger, atmosphärischer Parallax statt Schwarz-Weiß-Fläche */
.processV51{
  position:relative!important;
  isolation:isolate;
  overflow:hidden!important;
  background:#08090d!important;
}
.processV51::before{
  content:"";
  position:absolute;
  z-index:-2;
  left:-12%;
  top:-18%;
  width:124%;
  height:145%;
  pointer-events:none;
  background:
    radial-gradient(ellipse at 18% 22%, rgba(190,255,78,.13) 0%, rgba(190,255,78,.035) 23%, transparent 49%),
    radial-gradient(ellipse at 84% 48%, rgba(75,94,255,.11) 0%, rgba(75,94,255,.025) 25%, transparent 52%),
    radial-gradient(ellipse at 45% 88%, rgba(147,83,255,.09) 0%, transparent 47%),
    linear-gradient(135deg,#07080b 0%,#0b0d14 48%,#08090d 100%);
  transform:translate3d(0,var(--process-parallax,0px),0) scale(1.06);
  will-change:transform;
}
.processV51::after{
  content:"";
  position:absolute;
  z-index:-1;
  inset:0;
  pointer-events:none;
  opacity:.34;
  background-image:
    linear-gradient(rgba(255,255,255,.022) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);
  background-size:52px 52px;
  -webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 16%,#000 88%,transparent 100%);
  mask-image:linear-gradient(to bottom,transparent 0%,#000 16%,#000 88%,transparent 100%);
}

/* Vorhandene Prozesszeilen subtil aufwerten, ohne Karten daraus zu machen */
.processV51 [class*="step"],
.processV51 [class*="process"] article,
.processV51 article{
  position:relative;
}
.processV51 [class*="step"]::before,
.processV51 article::before{
  content:"";
  position:absolute;
  left:0;
  top:-1px;
  width:0;
  height:1px;
  background:linear-gradient(90deg,rgba(190,255,78,.9),rgba(190,255,78,0));
  transition:width .8s cubic-bezier(.2,.7,.2,1);
}
.processV51 [class*="step"].v51-active::before,
.processV51 article.v51-active::before{
  width:42%;
}
.processV51 .v51-active{
  transform:translateX(0);
}
.processV51 [class*="step"],
.processV51 article{
  transition:transform .65s ease,opacity .65s ease;
}
.processV51 [class*="step"]:not(.v51-active),
.processV51 article:not(.v51-active){
  opacity:.72;
}
.processV51 .v51-active{
  opacity:1!important;
}
.processV51 .v51-active [class*="num"],
.processV51 .v51-active [class*="index"]{
  color:#c7ff52!important;
}

@media(max-width:800px){
  .processV51::before{
    width:150%;
    left:-25%;
    height:135%;
    opacity:.95;
  }
}
@media(prefers-reduced-motion:reduce){
  .processV51::before{transform:none!important}
  .processV51 *{transition:none!important}
}

/* ===== v52-process-visual-highlight ===== */
#process-v51.processV52{
  --px:0px;
  position:relative!important;
  isolation:isolate;
  overflow:hidden!important;
  background:
    linear-gradient(180deg,rgba(7,8,12,.92),rgba(8,9,14,.84) 45%,rgba(7,8,12,.94))!important;
}

/* Sichtbare bewegte Hintergrundwelt */
#process-v51.processV52::before{
  content:"";
  position:absolute;
  z-index:-2;
  left:-30%;
  top:-15%;
  width:160%;
  height:135%;
  pointer-events:none;
  background:
    radial-gradient(circle at 20% 18%,rgba(199,255,82,.34) 0 3%,rgba(199,255,82,.11) 16%,transparent 34%),
    radial-gradient(circle at 78% 38%,rgba(57,111,255,.28) 0 5%,rgba(57,111,255,.08) 19%,transparent 38%),
    radial-gradient(circle at 35% 78%,rgba(146,75,255,.26) 0 4%,rgba(146,75,255,.07) 21%,transparent 40%),
    conic-gradient(from 210deg at 50% 55%,transparent 0 18%,rgba(199,255,82,.08) 24%,transparent 31% 61%,rgba(90,75,255,.10) 70%,transparent 78%);
  filter:blur(4px);
  transform:translate3d(0,var(--px),0) rotate(-4deg) scale(1.06);
  will-change:transform;
}
#process-v51.processV52::after{
  content:"";
  position:absolute;
  z-index:-1;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(115deg,transparent 0 47%,rgba(199,255,82,.055) 48%,transparent 49%),
    repeating-linear-gradient(90deg,transparent 0 79px,rgba(255,255,255,.025) 80px);
  opacity:.75;
}

/* Headline bekommt wieder Portfolio-Charakter */
#process-v51 .big i{
  color:#bfff4f!important;
  text-shadow:0 0 42px rgba(191,255,79,.13);
}

/* Die vier Schritte werden zu einer visuellen Scroll-Timeline */
#process-v51 .processRows{
  position:relative;
}
#process-v51 .processRows::before{
  content:"";
  position:absolute;
  left:18px;
  top:0;
  bottom:0;
  width:1px;
  background:linear-gradient(to bottom,rgba(199,255,82,.75),rgba(87,108,255,.35),rgba(199,255,82,.08));
}
#process-v51 .processRows .row{
  position:relative!important;
  margin:0!important;
  padding:54px 24px 58px 64px!important;
  border-top:1px solid rgba(255,255,255,.11)!important;
  background:linear-gradient(100deg,rgba(255,255,255,.018),transparent 65%)!important;
  transition:transform .7s cubic-bezier(.2,.75,.2,1), background .7s ease, opacity .7s ease!important;
}
#process-v51 .processRows .row:nth-child(even){
  background:linear-gradient(260deg,rgba(79,97,255,.045),transparent 68%)!important;
}
#process-v51 .processRows .row::before{
  content:"";
  position:absolute;
  left:12px;
  top:68px;
  width:13px;
  height:13px;
  border-radius:50%;
  background:#0a0b0f;
  border:2px solid #c7ff52;
  box-shadow:0 0 0 7px rgba(199,255,82,.06),0 0 24px rgba(199,255,82,.28);
  transition:transform .55s ease,background .55s ease;
}
#process-v51 .processRows .row.v52-active{
  background:linear-gradient(100deg,rgba(199,255,82,.075),rgba(67,83,255,.035) 55%,transparent)!important;
}
#process-v51 .processRows .row.v52-active::before{
  background:#c7ff52;
  transform:scale(1.25);
}
#process-v51 .processRows .row .num{
  color:#c7ff52!important;
}
#process-v51 .processRows .row h3{
  transition:color .45s ease,transform .55s ease;
}
#process-v51 .processRows .row.v52-active h3{
  color:#fff!important;
  transform:translateX(8px);
}

@media(min-width:801px){
  #process-v51 .processRows .row{
    width:86%;
    margin-bottom:22px!important;
  }
  #process-v51 .processRows .row:nth-child(even){
    margin-left:auto!important;
  }
}
@media(max-width:800px){
  #process-v51.processV52::before{
    left:-55%;
    width:210%;
    opacity:1;
  }
  #process-v51 .processRows .row{
    padding-left:58px!important;
  }
}
@media(prefers-reduced-motion:reduce){
  #process-v51.processV52::before{transform:none!important}
}

/* ===== v53-contact-finish ===== */
/* V53 – Abschluss kompakter + deutscher Parallax-Schriftzug */
.contact{min-height:100svh;align-items:flex-start;padding:9vh 5vw 6vh;isolation:isolate}
.contact .inner{margin-top:0;transform:translateY(0);width:min(1180px,92vw)}
.contact .rings{top:8vh;left:50%;transform:translateX(-50%);z-index:0}
.contactGhost{position:absolute;z-index:1;left:-2vw;right:-2vw;bottom:-1vh;pointer-events:none;text-align:center;font:900 clamp(88px,16vw,250px)/.68 Arial,Helvetica,sans-serif;letter-spacing:-.085em;color:#8170ff12;-webkit-text-stroke:1px #9b8cff24;text-transform:uppercase;will-change:transform;overflow:hidden}
.contactGhost span{display:block;white-space:nowrap}
.contactGhost span:last-child{color:#d7ff5f0b;-webkit-text-stroke-color:#d7ff5f1d}
@media(max-width:800px){
 .contact{min-height:100svh;padding:5.5vh 4vw 3vh}
 .contact .inner{width:100%;transform:translateY(-2vh)}
 .contact h2{margin:12px 0 24px;font-size:clamp(58px,13vw,88px)}
 .contact .magnetic{margin-top:22px}
 .contact .rings{top:4vh;width:82vw}
 .contactGhost{bottom:1vh;font-size:22vw;line-height:.7;left:-8vw;right:-8vw}
}

/* ===== v54-contact-fine-tune ===== */
/* V54: Abschluss – Ghost-Schrift vollständig im Viewport, Footer wirklich am Seitenende */
.contact{min-height:118svh;}
.contactGhost{left:3vw;right:3vw;bottom:5vh;font-size:clamp(72px,12vw,190px);line-height:.72;}
.contactGhost span{white-space:nowrap;}
footer{position:relative;z-index:5;min-height:110px;height:auto;}
@media(max-width:800px){
  .contact{min-height:118svh;padding-bottom:8vh;}
  .contactGhost{left:4vw;right:4vw;bottom:5vh;font-size:15vw;line-height:.74;letter-spacing:-.07em;}
  footer{min-height:120px;padding-top:28px;padding-bottom:28px;}
}

/* ===== v57-ghost-position-stretch ===== */
/* V57: ETWAS / DAS / BLEIBT. tiefer und vertikal großzügiger */
.contactGhost{
  top:69%!important;
  font-size:clamp(76px,12vw,184px)!important;
  line-height:.86!important;
  gap:.42em!important;
}
@media(max-width:800px){
  .contactGhost{
    top:70%!important;
    left:8vw!important;right:8vw!important;
    font-size:17.2vw!important;
    line-height:.88!important;
    gap:.48em!important;
  }
}

/* ===== v62-ideen-raum-fix ===== */
/* V62: ein einziger klarer Parallax-Claim */
.parallax-fill-secondary, .parallaxSecondary, .closing-echo-secondary, .parallax-sentence-secondary {display:none!important;}

/* ===== v62-single-claim ===== */
#contact .contactEcho{display:none!important;}
#contact .contactGhost{top:58%!important;bottom:auto!important;transform:translateY(0);width:100%;text-align:center;line-height:.82!important;}
#contact .contactGhost span{display:block!important;margin:.12em 0!important;}
@media(max-width:760px){#contact .contactGhost{top:56%!important;font-size:clamp(3.2rem,15vw,6rem)!important;line-height:.84!important;}}

/* ===== v65-werkzeugkasten-parallax ===== */
/* V65 – räumliche, dezente Parallax-Typografie im Werkzeugkasten */
.darkBridge{isolation:isolate}
.bridgeGhosts{position:absolute;inset:0;z-index:1;overflow:hidden;pointer-events:none;opacity:1}
.bridgeGhosts span{position:absolute;display:block;font:900 clamp(150px,27vw,430px)/.72 Arial,Helvetica,sans-serif;letter-spacing:-.09em;color:transparent;-webkit-text-stroke:1px rgba(215,255,95,.075);white-space:nowrap;will-change:transform,opacity;mix-blend-mode:screen}
.bridgeGhosts .bgBild{top:2%;left:-5%;opacity:.55}
.bridgeGhosts .bgMove{top:25%;right:-34%;opacity:.42;-webkit-text-stroke-color:rgba(130,108,255,.10)}
.bridgeGhosts .bgKi{top:51%;left:43%;font-size:clamp(220px,39vw,620px);opacity:.34;-webkit-text-stroke-color:rgba(215,255,95,.11)}
.bridgeTop,.bridgeMain,.bridgeBottom{z-index:3}
@media(max-width:700px){
 .darkBridge{min-height:94vh}
 .bridgeGhosts .bgBild{top:1%;left:-12%;font-size:42vw;opacity:.42}
 .bridgeGhosts .bgMove{top:25%;right:-76%;font-size:37vw;opacity:.34}
 .bridgeGhosts .bgKi{top:51%;left:47%;font-size:68vw;opacity:.28}
}
@media(prefers-reduced-motion:reduce){.bridgeGhosts span{transform:none!important}}

/* ===== v66-werkzeugkasten-farben ===== */
/* V66: Zeitangaben grün, KI weiß – klare, konsistente Hierarchie */
.darkBridge .bridgeLine span{color:#baff35!important;}
.darkBridge .bridgeLine.accent strong{color:transparent!important;-webkit-text-fill-color:transparent!important;-webkit-text-stroke:2px #f3f1ec!important;text-stroke:2px #f3f1ec!important;}

/* ===== hs-archive68-css ===== */
.hsArchiveBtn68{display:flex;align-items:center;justify-content:space-between;gap:18px;width:min(92%,1180px);margin:42px auto 78px;padding:18px 0;border:0;border-top:1px solid rgba(255,255,255,.24);border-bottom:1px solid rgba(255,255,255,.24);background:transparent;color:#fff;font:800 12px/1 Arial,sans-serif;letter-spacing:.14em;text-transform:uppercase;cursor:pointer}
.hsArchiveBtn68 b{font-size:25px;color:#c7ff52;font-weight:400}
.hsArchiveBtn68:hover{color:#c7ff52}
.hsArchive68{position:fixed;inset:0;z-index:99990;background:#08090c;color:#fff;overflow:auto;overscroll-behavior:contain;opacity:0;visibility:hidden;transform:translateY(12px);transition:.32s ease}
.hsArchive68.open{opacity:1;visibility:visible;transform:none}
.hsArchive68-head{position:sticky;top:0;z-index:4;display:flex;justify-content:space-between;align-items:flex-end;padding:24px 4vw 20px;background:linear-gradient(#08090c 72%,transparent);border-bottom:1px solid rgba(255,255,255,.12)}
.hsArchive68-head small{font:800 9px Arial,sans-serif;letter-spacing:.17em;color:#c7ff52}
.hsArchive68-head h2{margin:5px 0 0;font:900 clamp(34px,5vw,74px)/.88 Arial,sans-serif;letter-spacing:-.055em}
.hsArchive68-head button{border:1px solid rgba(255,255,255,.3);background:#0c0d11;color:#fff;padding:12px 14px;font:800 9px Arial;letter-spacing:.12em}
.hsArchive68-grid{padding:34px 4vw 90px;columns:3 280px;column-gap:18px}
.hsArchive68-item{break-inside:avoid;margin:0 0 18px;position:relative;overflow:hidden;background:#111;border:0;padding:0;width:100%;cursor:zoom-in;display:block}
.hsArchive68-item img{display:block;width:100%;height:auto;transition:transform .5s ease,filter .5s ease}
.hsArchive68-item:hover img{transform:scale(1.018);filter:brightness(1.06)}
.hsArchive68-item span{position:absolute;left:10px;bottom:9px;background:rgba(0,0,0,.62);padding:6px 8px;font:700 8px Arial;letter-spacing:.12em;color:#ddd}
.hsArchive68-video{break-inside:avoid;margin:0 0 18px;background:#101115;position:relative}
.hsArchive68-video video{display:block;width:100%;height:auto;max-height:72vh;background:#000}
.hsArchive68-video span{display:block;padding:10px 12px;font:700 8px Arial;letter-spacing:.12em;color:#aaa}
.hsLightbox68{position:fixed;inset:0;z-index:100000;background:rgba(3,4,6,.97);display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:.25s}
.hsLightbox68.open{opacity:1;visibility:visible}
#hsLightbox68Stage{width:100%;height:100%;display:flex;align-items:center;justify-content:center;padding:58px 18px 70px;box-sizing:border-box}
#hsLightbox68Stage img{max-width:96vw;max-height:82vh;object-fit:contain}
#hsLightbox68Close{position:absolute;right:18px;top:14px;z-index:2;border:0;background:transparent;color:#fff;font:300 38px Arial;cursor:pointer}
.hsLightbox68-nav{position:absolute;left:50%;bottom:18px;transform:translateX(-50%);display:flex;align-items:center;gap:24px}
.hsLightbox68-nav button{border:0;background:transparent;color:#c7ff52;font-size:28px}
.hsLightbox68-nav span{font:700 9px Arial;letter-spacing:.14em;color:#aaa}
body.hsArchiveLock68{overflow:hidden!important}
@media(max-width:800px){
 .hsArchiveBtn68{width:calc(100% - 36px);margin:28px 18px 58px}
 .hsArchive68-head{padding:18px}
 .hsArchive68-head h2{font-size:12vw}
 .hsArchive68-grid{columns:2 145px;column-gap:10px;padding:20px 10px 70px}
 .hsArchive68-item,.hsArchive68-video{margin-bottom:10px}
}

/* ===== v70-archive-cta ===== */
.hsArchiveBtn68{
  position:relative!important;
  width:min(94%,1180px)!important;
  margin:52px auto 92px!important;
  padding:27px 24px!important;
  border:2px solid #c7ff52!important;
  border-radius:4px!important;
  background:linear-gradient(100deg,rgba(199,255,82,.13),rgba(199,255,82,.025))!important;
  box-shadow:0 0 0 1px rgba(199,255,82,.08),0 14px 45px rgba(0,0,0,.26)!important;
  color:#fff!important;
  overflow:hidden;
  transition:transform .25s ease,background .25s ease,box-shadow .25s ease!important
}
.hsArchiveBtn68:before{
  content:"MEHR ENTDECKEN";
  position:absolute;left:24px;top:10px;
  font:800 8px/1 Arial,sans-serif;letter-spacing:.2em;color:#c7ff52
}
.hsArchiveBtn68 span{
  padding-top:9px;
  font:900 clamp(18px,2.15vw,31px)/1 Arial,sans-serif!important;
  letter-spacing:.055em!important
}
.hsArchiveBtn68 b{
  display:grid!important;place-items:center!important;
  min-width:64px;height:64px;
  border-radius:50%;
  background:#c7ff52!important;color:#08090c!important;
  font:900 44px/1 Arial,sans-serif!important;
  transform:rotate(0deg);transition:transform .25s ease
}
.hsArchiveBtn68:hover,.hsArchiveBtn68:active{
  background:rgba(199,255,82,.19)!important;
  transform:translateY(-2px);
  box-shadow:0 0 0 1px rgba(199,255,82,.15),0 18px 50px rgba(0,0,0,.35)!important
}
.hsArchiveBtn68:hover b{transform:translate(3px,-3px)}
@media(max-width:800px){
 .hsArchiveBtn68{width:calc(100% - 28px)!important;margin:38px 14px 72px!important;padding:27px 18px 22px!important}
 .hsArchiveBtn68:before{left:18px;top:9px}
 .hsArchiveBtn68 span{font-size:20px!important;line-height:1.05!important;text-align:left}
 .hsArchiveBtn68 b{min-width:58px;height:58px;font-size:40px!important}
}

/* ===== v71-tech-hardening ===== */
/* Technischer Endcheck: robuste mobile Darstellung ohne Designänderung */
html{max-width:100%;overflow-x:hidden}
body{max-width:100%;overflow-x:clip}
img,video{max-width:100%}
.hsArchiveBtn68{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.hsArchive68-head button,.hsLightbox68 button{touch-action:manipulation}
@supports not (overflow:clip){body{overflow-x:hidden}}

/* ===== v73-legal ===== */
.hsLegal73{border-top:1px solid rgba(255,255,255,.10);background:#07080a;color:#aaa;padding:18px 5vw 28px;display:flex;justify-content:space-between;gap:20px;align-items:center;font:700 9px/1.4 Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase}
.hsLegal73 div{display:flex;gap:18px;flex-wrap:wrap}.hsLegal73 a{color:#aaa;text-decoration:none}.hsLegal73 a:hover{color:#c7ff52}
.hsLegalPage73{position:fixed;inset:0;z-index:100100;background:#08090c;color:#eee;overflow:auto;padding:7vh max(22px,7vw);opacity:0;visibility:hidden;transition:.25s}
.hsLegalPage73.open{opacity:1;visibility:visible}.hsLegalPage73 .close73{position:fixed;right:22px;top:18px;background:#c7ff52;color:#08090c;border:0;border-radius:50%;width:48px;height:48px;font-size:27px;font-weight:900}
.hsLegalPage73 article{max-width:850px;margin:auto}.hsLegalPage73 h1{font:900 clamp(42px,8vw,92px)/.88 Arial;letter-spacing:-.06em;margin:0 0 42px}.hsLegalPage73 h2{font:800 20px Arial;margin:32px 0 10px}.hsLegalPage73 p{font:400 16px/1.65 Arial;color:#bbb}.todo73{border-left:3px solid #c7ff52;padding:14px 16px;background:rgba(199,255,82,.06);color:#fff!important}
@media(max-width:700px){.hsLegal73{align-items:flex-start;flex-direction:column}}

/* ===== v74-mobile-hero-fix ===== */
@media (max-width:800px){
  #hero .hero-copy{
    left:4vw!important;
    right:4vw!important;
    width:92vw!important;
    max-width:92vw!important;
    overflow:visible!important;
  }
  #hero .hero-copy h1{
    width:100%!important;
    max-width:100%!important;
    font-size:clamp(49px,14.1vw,88px)!important;
    line-height:.86!important;
    letter-spacing:-.065em!important;
    white-space:normal!important;
    overflow:visible!important;
  }
  #hero .hero-copy h1 .outline,
  #hero .hero-copy h1 .acid{
    display:block!important;
    width:max-content!important;
    max-width:100%!important;
    white-space:nowrap!important;
  }
}
@media (max-width:390px){
  #hero .hero-copy h1{font-size:13.5vw!important}
}

/* ===== v75-expert-refinement ===== */
#hero.hero{height:360vh!important}
.boot{animation:bootAway .65s cubic-bezier(.7,0,.2,1) 1.55s forwards!important}
.bootMark{animation:bootMark .75s cubic-bezier(.2,.8,.2,1) forwards!important}
.bootSub{animation-delay:.42s!important}
.heroIntroFlash{animation-duration:1.35s!important;animation-delay:.65s!important}
#hero .heroCopy{top:14vh!important}
#hero .heroBottom p{max-width:520px!important;color:#b7b4b1!important}
#hero .eyebrow{color:#d7ff5f!important;letter-spacing:.16em!important}
#hero .grid{opacity:.12!important}
#hero .vignette{opacity:.92!important}
.darkBridge{min-height:78vh!important;padding-top:8vh!important;padding-bottom:7vh!important}
.darkBridge .bridgeMain{margin-top:8vh!important}
.darkBridge .bridgeLine strong{font-size:clamp(68px,11vw,170px)!important}
.darkBridge .bridgeGhosts{opacity:.30!important}
.darkBridge .bridgeBottom{margin-top:5vh!important}
.workGate{padding-top:9vh!important}.gateHead{margin-bottom:5vh!important}
.videoMotionWrap .end{display:none!important}
.videoMotionWrap .statement{padding-top:7vw!important;padding-bottom:7vw!important}
#ai-final-v40 p{max-width:760px}
#about .aboutgrid{grid-template-columns:.9fr 1.1fr!important;gap:clamp(34px,6vw,90px)!important;align-items:start!important}
#about .aboutgrid>.portrait{grid-column:1!important;grid-row:1!important}
#about .aboutgrid>.portrait+div{grid-column:2!important;grid-row:1!important}
#about .aboutgrid>.journey{grid-column:1/-1!important;grid-row:2!important;margin-top:clamp(40px,6vw,80px)!important}
#about .journey{padding-top:clamp(34px,4vw,56px)!important;padding-bottom:clamp(30px,4vw,52px)!important}
#about .journeyHead{margin-bottom:24px!important}
#about .journeyHead h3{font-size:clamp(40px,5.2vw,74px)!important}
#about .journeyItem{min-height:94px!important}
#about .journeyYear{font-size:clamp(44px,5vw,72px)!important}
#about .journeyEvent b{font-size:clamp(18px,2vw,28px)!important}
#process-v51 .processRows{margin-top:5vh!important}
#process-v51 .row{padding-top:22px!important;padding-bottom:22px!important}
#process-v51 .row h3{font-size:clamp(30px,4.2vw,62px)!important}
@media(max-width:800px){
#hero.hero{height:300vh!important}#hero .heroCopy{top:13vh!important}
#hero .eyebrow{font-size:8px!important;line-height:1.5!important;max-width:82vw!important}
#hero .heroBottom p{font-size:12px!important;line-height:1.55!important}
.darkBridge{min-height:72svh!important;padding-top:7vh!important;padding-bottom:6vh!important}
.darkBridge .bridgeMain{margin-top:6vh!important}.darkBridge .bridgeLine strong{font-size:18vw!important}
.videoMotionWrap .statement{padding-top:8vh!important;padding-bottom:8vh!important}
#about .aboutgrid{display:grid!important;grid-template-columns:1fr!important;gap:30px!important}
#about .aboutgrid>.portrait{grid-column:1!important;grid-row:1!important}
#about .aboutgrid>.portrait+div{grid-column:1!important;grid-row:2!important}
#about .aboutgrid>.journey{grid-column:1!important;grid-row:3!important;margin-top:12px!important}
#about .journeyItem{min-height:92px!important;grid-template-columns:88px 1fr!important}
#about .journeyYear{font-size:42px!important}#about .journeyEvent b{font-size:18px!important}
}

/* ===== v76-hero-hierarchy ===== */
/* V76 – klare Identität + ruhigere Hero-Hierarchie */
#hero .heroIdentity{
  display:flex!important;align-items:baseline!important;flex-wrap:wrap!important;gap:.45em .8em!important;
  max-width:min(900px,82vw)!important;font-size:clamp(12px,1.08vw,17px)!important;line-height:1.45!important;
  letter-spacing:.13em!important;color:#d7ff5f!important;
}
#hero .heroIdentity .heroName{font-weight:800!important;color:#f2f0ea!important;font-size:1.12em!important;}
#hero .heroIdentity .heroName:after{content:" —";color:#777!important;font-weight:400!important;}
#hero .heroIdentity .heroRole{font-weight:700!important;}
#hero .heroIdentity .heroDisciplines{flex-basis:100%!important;color:#b9d95c!important;font-size:.92em!important;}
#hero .heroCopy h1{
  font-size:clamp(62px,8.6vw,148px)!important;line-height:.80!important;margin:6.2vh 0 4.2vh!important;
  max-width:1180px!important;
}
#hero .heroSondern,#hero .heroDive{font-size:.61em!important;letter-spacing:-.045em!important;}
#hero .heroSondern{color:#f2f0ea!important;}
#hero .heroDive{color:#d7ff5f!important;}
nav .brand b{font-size:17px!important;letter-spacing:.10em!important;}
nav .brand span{font-size:11px!important;letter-spacing:.18em!important;}
@media(max-width:800px){
  #hero .heroCopy{top:13.5vh!important;}
  #hero .heroIdentity{display:block!important;max-width:84vw!important;font-size:clamp(11px,3.05vw,15px)!important;line-height:1.5!important;letter-spacing:.11em!important;}
  #hero .heroIdentity .heroName,#hero .heroIdentity .heroRole{display:inline!important;}
  #hero .heroIdentity .heroDisciplines{display:block!important;margin-top:.28em!important;font-size:.90em!important;}
  #hero .heroCopy h1{font-size:clamp(46px,12.2vw,76px)!important;line-height:.84!important;margin:6.5vh 0 4.5vh!important;}
  #hero .heroSondern,#hero .heroDive{font-size:.60em!important;letter-spacing:-.035em!important;}
  nav .brand b{font-size:17px!important;}
  nav .brand span{font-size:10px!important;}
}
@media(max-width:390px){
  #hero .heroIdentity{font-size:10.5px!important;max-width:88vw!important;}
  #hero .heroCopy h1{font-size:11.9vw!important;}
}

/* ===== v77-mobile-flow-fixes ===== */
/* V77 — mobile overflow + clean section transitions */
.motionIntroV77{min-height:72svh;display:flex;flex-direction:column;justify-content:center;position:relative;padding:11vh 6vw 9vh;background:#070707;color:#f4f2ed;border-top:1px solid rgba(255,255,255,.12);overflow:hidden}
.motionIntroV77:before{content:"";position:absolute;width:42vw;height:42vw;right:-12vw;top:8vh;border-radius:50%;background:radial-gradient(circle,rgba(186,255,53,.10),transparent 68%);filter:blur(18px);pointer-events:none}
.motionIntroLabel{position:relative;z-index:1;font:600 10px/1.2 Consolas,monospace;letter-spacing:.24em;color:#9c9c9c;margin-bottom:5vh}
.motionIntroV77 h2{position:relative;z-index:1;margin:0;font:900 clamp(64px,11vw,168px)/.78 Arial,Helvetica,sans-serif;letter-spacing:-.075em}
.motionIntroV77 h2 i{font-style:normal;color:#d7ff5f}
.motionIntroV77 p{position:relative;z-index:1;max-width:720px;margin:5vh 0 0;font:400 clamp(17px,1.65vw,25px)/1.5 Arial,sans-serif;color:#a9a9a9}
.motionIntroArrow{position:absolute;z-index:1;right:6vw;bottom:7vh;font:300 62px/1 Arial,sans-serif;color:#d7ff5f}
.videoMotionWrap .motionVisualV77 .stick{position:relative!important}
@media(max-width:800px){
 #hero .heroPhase{width:88vw!important;max-width:88vw!important;font-size:clamp(44px,13vw,72px)!important;letter-spacing:-.055em!important;line-height:.78!important}
 #hero .heroPhase span{white-space:nowrap!important;display:block!important;max-width:88vw!important}
 #hero .heroPhase small{font-size:8px!important;letter-spacing:.28em!important;margin-top:22px!important;white-space:nowrap!important}
 .darkBridge .bridgeLine strong{font-size:clamp(48px,12.2vw,70px)!important;line-height:.86!important;letter-spacing:-.06em!important;max-width:86vw!important;white-space:nowrap!important}
 .motionIntroV77{min-height:64svh;padding:10vh 7vw 8vh}
 .motionIntroLabel{font-size:9px;margin-bottom:4.5vh}
 .motionIntroV77 h2{font-size:clamp(48px,13.4vw,72px)!important;line-height:.82!important;letter-spacing:-.06em!important}
 .motionIntroV77 p{font-size:16px;line-height:1.5;margin-top:4vh;max-width:86vw}
 .motionIntroArrow{right:7vw;bottom:6vh;font-size:52px}
 .videoMotionWrap .motionVisualV77{height:72svh!important}
 .videoMotionWrap .motionVisualV77 .stick{height:72svh!important}
 .videoMotionWrap .statement{padding-top:9vh!important;padding-bottom:9vh!important}
}
@media(max-width:390px){
 #hero .heroPhase{font-size:12.4vw!important}
 .darkBridge .bridgeLine strong{font-size:11.8vw!important}
 .motionIntroV77 h2{font-size:12.8vw!important}
}

/* ===== v78-video-flow-hardfix ===== */
/* V78 — video flow: intro and media must never occupy the same layer */
#motion{
  position:relative!important;
  isolation:isolate!important;
  background:#070707!important;
  overflow:hidden!important;
}
#motion .videoMotionInner{
  position:relative!important;
  overflow:hidden!important;
  background:#070707!important;
}

/* CRITICAL: .grid inherits position:absolute/inset:0 from the global hero grid. Reset it here. */
#motion .videoMotionInner > .grid{
  position:relative!important;
  inset:auto!important;
  top:auto!important;right:auto!important;bottom:auto!important;left:auto!important;
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  z-index:2!important;
  transform:none!important;
  mask-image:none!important;
  -webkit-mask-image:none!important;
  opacity:1!important;
  overflow:hidden!important;
}

/* A real, self-contained introduction BEFORE any moving image. */
#motion .motionIntroV78{
  position:relative!important;
  z-index:5!important;
  width:100%!important;
  min-height:78svh!important;
  margin:0!important;
  padding:12vh 7vw 11vh!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  background:
    radial-gradient(circle at 78% 34%,rgba(199,255,82,.08),transparent 25%),
    #070707!important;
  border-top:1px solid rgba(255,255,255,.14)!important;
  border-bottom:1px solid rgba(255,255,255,.12)!important;
  overflow:hidden!important;
}
#motion .motionIntroV78:before{
  width:46vw!important;height:46vw!important;
  right:-15vw!important;top:11vh!important;
  opacity:.75!important;
}
#motion .motionIntroV78 .motionIntroLabel{
  margin:0 0 5vh!important;
  font-size:10px!important;
  line-height:1.25!important;
  letter-spacing:.24em!important;
  color:#9b9b9b!important;
}
#motion .motionIntroV78 h2{
  width:min(100%,900px)!important;
  max-width:100%!important;
  margin:0!important;
  font-size:clamp(58px,11vw,150px)!important;
  line-height:.80!important;
  letter-spacing:-.065em!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
}
#motion .motionIntroV78 p{
  width:min(720px,86vw)!important;
  max-width:86vw!important;
  margin:5vh 0 0!important;
  font-size:clamp(17px,1.7vw,24px)!important;
  line-height:1.5!important;
  color:#aaa!important;
}
#motion .motionIntroHint{
  margin-top:7vh;
  font:600 9px/1.2 Consolas,monospace;
  letter-spacing:.22em;
  color:#737373;
}
#motion .motionIntroArrow{
  right:7vw!important;
  bottom:8vh!important;
  font-size:56px!important;
}

/* Each video now owns only its own caption. */
#motion .videoMotionInner article.card{
  position:relative!important;
  z-index:2!important;
  overflow:hidden!important;
}
#motion .videoMotionInner article.card .copy,
#motion .videoMotionInner article.card .copy.videoOffset48{
  position:absolute!important;
  z-index:4!important;
  left:7vw!important;
  right:7vw!important;
  bottom:7vw!important;
  width:auto!important;
  max-width:78%!important;
  margin:0!important;
  padding:0!important;
  transform:none!important;
}
#motion .videoMotionInner article.card .shade{
  z-index:3!important;
  background:linear-gradient(180deg,transparent 38%,rgba(0,0,0,.18) 57%,rgba(0,0,0,.88) 100%)!important;
}
#motion .videoMotionInner article.card .copy b{
  margin:0 0 12px!important;
  font-size:10px!important;
  line-height:1.25!important;
  letter-spacing:.22em!important;
}
#motion .videoMotionInner article.card .copy strong{
  display:block!important;
  font-size:clamp(30px,4.6vw,58px)!important;
  line-height:.98!important;
  letter-spacing:-.035em!important;
  text-wrap:balance;
}

/* Stop the decorative ambient layer from widening the mobile document. */
@media(max-width:800px){
  html,body{width:100%!important;max-width:100%!important;overflow-x:hidden!important}
  body>.ambient{left:0!important;right:0!important;top:0!important;width:100%!important;max-width:100vw!important;transform:none!important}
  #motion .motionIntroV78{min-height:82svh!important;padding:13vh 7vw 11vh!important}
  #motion .motionIntroV78 .motionIntroLabel{font-size:9px!important;margin-bottom:4.5vh!important}
  #motion .motionIntroV78 h2{font-size:clamp(52px,12.7vw,82px)!important;line-height:.82!important;max-width:86vw!important}
  #motion .motionIntroV78 p{font-size:16px!important;line-height:1.5!important;max-width:82vw!important;margin-top:4.5vh!important}
  #motion .motionIntroHint{margin-top:6vh!important;font-size:8px!important}
  #motion .motionIntroArrow{right:7vw!important;bottom:7vh!important;font-size:50px!important}

  #motion .videoMotionInner > .grid{display:grid!important;grid-template-columns:1fr!important;gap:2px!important;padding:2px!important}
  #motion .videoMotionInner article.card,
  #motion .videoMotionInner article.card:nth-child(3n+1){
    width:91%!important;
    height:60svh!important;
    min-height:500px!important;
    margin-top:0!important;
    margin-bottom:44px!important;
  }
  #motion .videoMotionInner article.card .copy{left:7vw!important;right:7vw!important;bottom:7vw!important;max-width:80%!important}
  #motion .videoMotionInner article.card .copy strong{font-size:clamp(32px,7.4vw,50px)!important;line-height:.98!important}
}
@media(max-width:390px){
  #motion .motionIntroV78 h2{font-size:12.2vw!important}
  #motion .motionIntroV78 p{font-size:15px!important}
  #motion .videoMotionInner article.card .copy strong{font-size:7.3vw!important}
}

/* ===== v79-reposition-css ===== */
/* V79 — clearer identity, no duplicate name, stronger hierarchy */
nav .navSpacer79{display:block;min-width:38px;width:38px;height:1px}
#hero .heroIdentity{font-size:clamp(15px,1.45vw,24px)!important;line-height:1.28!important;letter-spacing:.085em!important;color:#f2f0ea!important;max-width:920px!important}
#hero .heroIdentity .heroName{font-size:1.16em!important;font-weight:900!important}
#hero .heroIdentity .heroRole{font-size:1em!important;font-weight:700!important;color:#f2f0ea!important}
#hero .heroIdentity .heroDisciplines{font-size:.78em!important;margin-top:.5em!important;color:#b9ff38!important;letter-spacing:.16em!important}
@media(max-width:800px){
  #hero .heroIdentity{font-size:clamp(13px,3.45vw,17px)!important;line-height:1.35!important;max-width:88vw!important}
  #hero .heroIdentity .heroName,#hero .heroIdentity .heroRole{display:inline!important}
  #hero .heroIdentity .heroDisciplines{display:block!important;font-size:.77em!important;margin-top:.55em!important;white-space:normal!important}
  nav .navSpacer79{width:34px;min-width:34px}
}
@media(max-width:380px){#hero .heroIdentity{font-size:12.5px!important;max-width:90vw!important}}

/* ===== v80-hero-sticky-and-preai ===== */
/* V80 — Mobile Hero: clipping without creating a scroll container. */
html,body{overflow-x:clip!important}
@supports not (overflow:clip){html,body{overflow-x:visible!important}}
@media(max-width:800px){
  #hero.hero{height:360svh!important}
  #hero .heroStage{position:sticky!important;top:0!important;height:100svh!important;min-height:0!important;max-height:100svh!important;overflow:hidden!important}
}

/* Compact retrospective: Photoshop as foundation, not as current headline service. */
.preAi80{position:relative;background:#e9e5dd;color:#090a0d;padding:11vh 5vw 12vh;overflow:hidden;border-top:1px solid #b5afa5}
.preAi80:before{content:"PRE-AI";position:absolute;right:-.04em;top:.15em;font:900 clamp(95px,20vw,330px)/.75 Arial,sans-serif;letter-spacing:-.09em;color:#090a0d08;pointer-events:none;white-space:nowrap}
.preAi80Head{position:relative;z-index:2;display:grid;grid-template-columns:.72fr 1.28fr;gap:7vw;align-items:end;border-top:1px solid #090a0d;padding-top:18px}
.preAi80Kicker{font:700 10px/1.4 Consolas,monospace;letter-spacing:.18em;text-transform:uppercase}
.preAi80 h2{margin:5vh 0 2vh;font:900 clamp(64px,9vw,150px)/.78 Arial,sans-serif;letter-spacing:-.075em;max-width:1050px}
.preAi80 h2 i{font-style:normal;color:transparent;-webkit-text-stroke:1.2px #090a0d}
.preAi80Intro{font-size:clamp(17px,1.55vw,24px);line-height:1.48;max-width:680px;margin:0 0 2vh}
.preAi80Intro b{background:#d7ff5f;padding:0 .12em}
.preAi80Stats{position:relative;z-index:2;display:grid;grid-template-columns:repeat(3,1fr);border-block:1px solid #aaa39a;margin:7vh 0 6vh}
.preAi80Stats div{padding:24px 18px;border-right:1px solid #aaa39a}
.preAi80Stats div:last-child{border-right:0}
.preAi80Stats span{display:block;font:700 9px/1.3 Consolas,monospace;letter-spacing:.16em;text-transform:uppercase;color:#69645e;margin-bottom:9px}
.preAi80Stats strong{font-size:clamp(22px,2.6vw,40px);line-height:1;letter-spacing:-.04em}
.preAi80Grid{position:relative;z-index:2;display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.preAi80Card{position:relative;aspect-ratio:4/3;overflow:hidden;background:#111}
.preAi80Card img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.86) contrast(1.03);transition:transform .7s cubic-bezier(.16,1,.3,1),filter .5s}
.preAi80Card:hover img{transform:scale(1.035);filter:saturate(1) contrast(1.05)}
.preAi80Card:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 52%,rgba(0,0,0,.82))}
.preAi80Caption{position:absolute;z-index:2;left:15px;right:15px;bottom:13px;color:#fff;font:700 9px/1.4 Consolas,monospace;letter-spacing:.13em;text-transform:uppercase}
.preAi80Caption b{color:#d7ff5f;font-weight:700}
.preAi80Lesson{position:relative;z-index:2;display:grid;grid-template-columns:.62fr 1.38fr;gap:7vw;margin-top:7vh;padding-top:26px;border-top:1px solid #090a0d}
.preAi80Lesson .stamp{font:700 10px/1.4 Consolas,monospace;letter-spacing:.18em;text-transform:uppercase;color:#57524d}
.preAi80Lesson p{font-size:clamp(24px,3.25vw,50px);line-height:1.08;letter-spacing:-.045em;margin:0;max-width:1000px}
.preAi80Lesson p strong{color:#090a0d}.preAi80Lesson p em{font-style:normal;background:#d7ff5f;padding:0 .08em}
@media(max-width:800px){
  .preAi80{padding:9vh 18px 10vh}
  .preAi80:before{top:.4em;font-size:34vw}
  .preAi80Head{grid-template-columns:1fr;gap:2vh}
  .preAi80 h2{font-size:16vw;margin:4vh 0 1.5vh;line-height:.8}
  .preAi80Intro{font-size:17px;line-height:1.5}
  .preAi80Stats{grid-template-columns:1fr;margin:5vh 0 4vh}
  .preAi80Stats div{border-right:0;border-bottom:1px solid #aaa39a;padding:17px 6px}
  .preAi80Stats div:last-child{border-bottom:0}
  .preAi80Stats strong{font-size:26px}
  .preAi80Grid{grid-template-columns:1fr 1fr;gap:6px}
  .preAi80Caption{left:10px;right:8px;bottom:9px;font-size:7px;letter-spacing:.09em}
  .preAi80Lesson{grid-template-columns:1fr;gap:2vh;margin-top:5vh;padding-top:20px}
  .preAi80Lesson p{font-size:8vw;line-height:1.06}
}

/* ===== v82-preai-balance ===== */
/* V82 — Pre-AI retrospective: let the work breathe, keep the story readable. */
.preAi80Grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:16px!important;max-width:1180px;margin-left:auto;margin-right:auto}
.preAi80Card{aspect-ratio:16/10!important;cursor:zoom-in;outline:none}
.preAi80Card:focus-visible{box-shadow:0 0 0 3px #d7ff5f}
.preAi80Card:before{content:"↗";position:absolute;z-index:4;right:12px;top:12px;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:rgba(215,255,95,.94);color:#090a0d;font:700 18px/1 Arial;opacity:0;transform:scale(.9);transition:.25s;pointer-events:none}
.preAi80Card:hover:before,.preAi80Card:focus-visible:before{opacity:1;transform:scale(1)}
.preAi80Caption{font-size:10px!important;line-height:1.35!important}
.preAi80Lesson{grid-template-columns:.55fr 1.45fr!important;gap:5vw!important}
.preAi80Lesson p{font-size:clamp(23px,2.35vw,38px)!important;line-height:1.16!important;letter-spacing:-.035em!important;max-width:900px!important}
.preAi82Lightbox{position:fixed;inset:0;z-index:100500;background:rgba(3,4,6,.96);display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity .22s ease,visibility .22s ease;padding:58px 18px 72px;box-sizing:border-box}
.preAi82Lightbox.open{opacity:1;visibility:visible}
.preAi82Lightbox img{max-width:96vw;max-height:84vh;object-fit:contain;box-shadow:0 24px 80px rgba(0,0,0,.45)}
.preAi82Close{position:absolute;right:18px;top:14px;border:0;background:transparent;color:#fff;font:300 38px/1 Arial;cursor:pointer;padding:8px}
.preAi82Hint{position:absolute;left:50%;bottom:20px;transform:translateX(-50%);color:#d7ff5f;font:700 9px/1.3 Consolas,monospace;letter-spacing:.17em;text-transform:uppercase;white-space:nowrap}
body.preAi82Lock{overflow:hidden!important}
@media(max-width:800px){
  .preAi80Grid{grid-template-columns:1fr!important;gap:14px!important}
  .preAi80Card{aspect-ratio:16/10!important}
  .preAi80Card:before{opacity:1!important;transform:scale(1)!important;width:30px;height:30px;font-size:16px;right:10px;top:10px}
  .preAi80Caption{font-size:9px!important;left:12px!important;right:46px!important;bottom:11px!important}
  .preAi80Lesson{grid-template-columns:1fr!important;gap:16px!important;margin-top:5vh!important}
  .preAi80Lesson p{font-size:clamp(21px,5.3vw,28px)!important;line-height:1.18!important;letter-spacing:-.025em!important;max-width:100%!important}
}

/* ===== v83-hero-balance ===== */
/* V83 — calmer, centered hero hierarchy and readable experience line */
#hero .heroCopy{
  left:5vw!important;
  right:5vw!important;
  width:auto!important;
  max-width:none!important;
  top:14.5vh!important;
  text-align:center!important;
}
#hero .heroIdentity{
  display:flex!important;
  justify-content:center!important;
  align-items:baseline!important;
  margin:0 auto!important;
  max-width:min(980px,90vw)!important;
  text-align:center!important;
}
#hero .heroIdentity .heroDisciplines{
  text-align:center!important;
}
#hero .heroCopy h1{
  margin:6vh auto 3.5vh!important;
  max-width:min(1120px,92vw)!important;
  text-align:center!important;
  text-wrap:balance;
}
#hero .heroLead,
#hero .heroLook{
  color:#f2f0ea!important;
  -webkit-text-stroke:0!important;
  text-shadow:0 3px 28px rgba(0,0,0,.55)!important;
}
#hero .heroLook{
  font-weight:900!important;
}
#hero .heroSondern,
#hero .heroDive{
  display:inline!important;
}
#hero .heroBottom{
  position:relative!important;
  z-index:3!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:20px!important;
  width:100%!important;
  margin:0 auto!important;
  text-align:center!important;
}
#hero .heroBottom p{
  position:relative!important;
  z-index:2!important;
  max-width:620px!important;
  margin:0 auto!important;
  padding:10px 18px!important;
  color:#e8e5df!important;
  font-size:clamp(13px,1.15vw,17px)!important;
  line-height:1.55!important;
  text-align:center!important;
  text-shadow:0 2px 10px #050509,0 0 24px #050509!important;
  background:rgba(5,5,9,.62)!important;
  border-radius:8px!important;
  backdrop-filter:blur(5px)!important;
  -webkit-backdrop-filter:blur(5px)!important;
  box-shadow:0 0 34px rgba(5,5,9,.42)!important;
}
#hero .heroBottom .magnetic{
  margin:0 auto!important;
}
@media(max-width:800px){
  #hero .heroCopy{
    left:4.5vw!important;
    right:4.5vw!important;
    top:14vh!important;
    text-align:center!important;
  }
  #hero .heroIdentity{
    display:block!important;
    max-width:91vw!important;
    text-align:center!important;
    font-size:clamp(12.5px,3.25vw,16px)!important;
    line-height:1.42!important;
  }
  #hero .heroIdentity .heroName,
  #hero .heroIdentity .heroRole{display:inline!important}
  #hero .heroIdentity .heroDisciplines{
    display:block!important;
    margin-top:.55em!important;
    text-align:center!important;
    font-size:.76em!important;
  }
  #hero .heroCopy h1{
    max-width:91vw!important;
    margin:5.8vh auto 3.4vh!important;
    font-size:clamp(43px,11.7vw,70px)!important;
    line-height:.84!important;
    letter-spacing:-.058em!important;
    text-align:center!important;
  }
  #hero .heroSondern,
  #hero .heroDive{
    font-size:.58em!important;
    letter-spacing:-.025em!important;
  }
  #hero .heroBottom{gap:17px!important}
  #hero .heroBottom p{
    width:min(88vw,560px)!important;
    max-width:88vw!important;
    padding:9px 13px!important;
    font-size:clamp(12px,3.25vw,14px)!important;
    line-height:1.5!important;
  }
  #hero .heroBottom .magnetic{
    padding:18px 23px!important;
  }
}
@media(max-width:390px){
  #hero .heroCopy{top:13.2vh!important}
  #hero .heroIdentity{font-size:11.6px!important}
  #hero .heroCopy h1{font-size:11.2vw!important;margin-top:5.2vh!important}
  #hero .heroBottom p{font-size:12px!important}
}

/* ===== v84-hero-identity-hierarchy ===== */
/* V84 — clear three-tier identity block, safely separated from progress counter */
#hero .heroIdentity{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:.28em!important;
  width:max-content!important;
  max-width:74vw!important;
  margin:0 auto!important;
  line-height:1.05!important;
  text-align:center!important;
  white-space:normal!important;
}
#hero .heroIdentity .heroName,
#hero .heroIdentity .heroRole,
#hero .heroIdentity .heroDisciplines{
  display:block!important;
  flex-basis:auto!important;
  margin:0!important;
  text-align:center!important;
  white-space:nowrap!important;
}
#hero .heroIdentity .heroName:after{content:""!important;}
#hero .heroIdentity .heroName{
  font-size:clamp(24px,2.4vw,40px)!important;
  line-height:1!important;
  font-weight:900!important;
  letter-spacing:.095em!important;
  color:#f2f0ea!important;
}
#hero .heroIdentity .heroRole{
  font-size:clamp(17px,1.65vw,27px)!important;
  line-height:1.05!important;
  font-weight:600!important;
  letter-spacing:.17em!important;
  color:#d7d4cf!important;
}
#hero .heroIdentity .heroDisciplines{
  margin-top:.55em!important;
  font-size:clamp(11px,.9vw,15px)!important;
  line-height:1.2!important;
  font-weight:600!important;
  letter-spacing:.19em!important;
  color:#b9ff38!important;
}
@media(max-width:800px){
  #hero .heroCopy{
    top:8.6svh!important;
  }
  #hero .heroIdentity{
    width:auto!important;
    max-width:76vw!important;
    gap:.35em!important;
  }
  #hero .heroIdentity .heroName{
    font-size:clamp(21px,5.8vw,27px)!important;
    letter-spacing:.08em!important;
  }
  #hero .heroIdentity .heroRole{
    font-size:clamp(15px,4.05vw,19px)!important;
    letter-spacing:.16em!important;
  }
  #hero .heroIdentity .heroDisciplines{
    margin-top:.58em!important;
    font-size:clamp(10px,2.75vw,13px)!important;
    letter-spacing:.14em!important;
  }
  #hero .heroCopy h1{
    margin-top:7.1svh!important;
  }
  #hero .heroCounter{
    top:17.2svh!important;
    right:4.2vw!important;
  }
}
@media(max-width:390px){
  #hero .heroCopy{top:8.2svh!important;}
  #hero .heroIdentity{max-width:75vw!important;}
  #hero .heroIdentity .heroName{font-size:5.55vw!important;}
  #hero .heroIdentity .heroRole{font-size:3.8vw!important;}
  #hero .heroIdentity .heroDisciplines{font-size:2.55vw!important;}
  #hero .heroCopy h1{margin-top:6.8svh!important;}
  #hero .heroCounter{top:16.8svh!important;}
}

/* ===== v85-web-interactive-css ===== */
/* V85 — WEB / INTERACTIVE */
#web-interactive.web85{
  position:relative; overflow:hidden; background:#090a0d; color:#f3f1eb;
  padding:clamp(88px,11vw,170px) 6vw clamp(96px,12vw,180px);
  border-top:1px solid #ffffff18;
}
#web-interactive.web85:before{
  content:"WEB"; position:absolute; right:-.02em; top:.18em;
  font-size:clamp(150px,27vw,470px); font-weight:900; line-height:.75;
  letter-spacing:-.09em; color:transparent; -webkit-text-stroke:1px #ffffff0b;
  pointer-events:none;
}
.web85Intro{position:relative;z-index:2;display:grid;grid-template-columns:1.15fr .85fr;gap:7vw;align-items:end}
.web85Kicker{grid-column:1/-1;font:11px Consolas,monospace;letter-spacing:.18em;color:#c7ff52;text-transform:uppercase;margin-bottom:3vh}
.web85Intro h2{margin:0;font-size:clamp(52px,7.35vw,118px);line-height:.80;letter-spacing:-.065em;max-width:980px}
.web85Intro h2 span{color:#c7ff52}
.web85Intro h2 em{font-family:Georgia,serif;font-weight:400;color:#89868a}
.web85IntroText{max-width:630px;margin-left:auto}
.web85IntroText p{font-size:clamp(16px,1.35vw,21px);line-height:1.6;color:#b8b5b2;margin:0 0 1.2em}
.web85ThenNow{position:relative;z-index:2;margin:clamp(75px,10vw,150px) 0;display:grid;grid-template-columns:1fr auto 1fr;gap:3vw;align-items:stretch}
.web85Era{min-height:460px;border:1px solid #ffffff22;padding:clamp(26px,3.4vw,54px);display:flex;flex-direction:column;position:relative;overflow:hidden}
.web85EraOld{background:#111216}
.web85EraOld:after{content:"";display:none}
.web85EraNow{background:radial-gradient(circle at 75% 35%,#7a58ff55,transparent 35%),linear-gradient(145deg,#14131c,#0a0b0e 65%)}
.web85EraNow:after{content:"";position:absolute;inset:auto -20% -50% 20%;height:75%;background:radial-gradient(circle,#c7ff5240,transparent 60%);filter:blur(12px)}
.web85Year{font:900 clamp(70px,9vw,148px)/.85 Arial;letter-spacing:-.075em;position:relative;z-index:2}
.web85Era small{font:10px Consolas,monospace;letter-spacing:.2em;color:#c7ff52;margin:18px 0 34px;position:relative;z-index:2}
.web85Era pre{margin:auto 0 28px;background:#050609;border:1px solid #ffffff19;padding:24px;white-space:pre-wrap;overflow:auto;color:#d9d7d0;position:relative;z-index:2}
.web85Era code{font:12px/1.65 Consolas,monospace}
.web85Era p{max-width:520px;color:#989597;font-size:14px;line-height:1.65;margin:0;position:relative;z-index:2}
.web85EraNow strong{font-size:clamp(40px,5vw,80px);line-height:.9;letter-spacing:-.06em;max-width:680px;margin:auto 0 34px;position:relative;z-index:2}
.web85Years{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:12px;color:#c7ff52;font:10px Consolas,monospace;letter-spacing:.16em;writing-mode:vertical-rl;text-orientation:mixed}
.web85Years span{font-size:22px}
.web85LabHead{position:relative;z-index:2;border-top:1px solid #ffffff24;padding-top:28px;display:grid;grid-template-columns:1fr 1.25fr;gap:5vw;align-items:end}
.web85LabHead>span{grid-column:1/-1;font:10px Consolas,monospace;letter-spacing:.18em;color:#c7ff52}
.web85LabHead h3{font-size:clamp(52px,7.4vw,118px);line-height:.82;letter-spacing:-.07em;margin:30px 0 0}
.web85LabHead h3 i{font-family:Georgia,serif;font-weight:400;color:#777}
.web85LabHead p{font-size:17px;line-height:1.65;color:#999;max-width:520px;margin:0 0 5px auto}
.web85Lab{position:relative;z-index:2;display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:55px}
.web85Demo{min-height:530px;border:1px solid #ffffff1f;background:#0d0e12;padding:24px;display:flex;flex-direction:column;overflow:hidden;position:relative;transition:border-color .3s,background .3s}
.web85Demo:hover,.web85Demo:focus-visible,.web85Demo.is-active{border-color:#c7ff5275;background:#111319;outline:none}
.web85DemoNo{font:9px Consolas,monospace;letter-spacing:.17em;color:#c7ff52}
.web85Demo h4{font-size:clamp(28px,2.8vw,46px);line-height:.93;letter-spacing:-.055em;margin:auto 0 16px;position:relative;z-index:3}
.web85Demo p{font-size:13px;line-height:1.6;color:#999;margin:0;max-width:330px;position:relative;z-index:3}
.web85TiltPlane{width:62%;aspect-ratio:1;margin:42px auto 0;display:grid;place-items:center;border:1px solid #ffffff55;background:linear-gradient(145deg,#2d2b38,#0a0b0d);transform:perspective(750px) rotateX(var(--rx,9deg)) rotateY(var(--ry,-10deg)) translateZ(0);transform-style:preserve-3d;transition:transform .15s ease-out;box-shadow:0 45px 80px #0008;position:relative}
.web85TiltPlane:before{content:"";position:absolute;inset:12%;border:1px solid #c7ff5270;transform:translateZ(28px)}
.web85TiltPlane b{font-size:clamp(58px,7vw,108px);letter-spacing:-.08em;transform:translateZ(50px);color:#c7ff52}
.web85TiltPlane small{position:absolute;bottom:14%;font:8px Consolas,monospace;letter-spacing:.18em;transform:translateZ(42px)}
.web85TypeStage{height:245px;margin:36px -24px 0;display:grid;place-items:center;position:relative;overflow:hidden;border-block:1px solid #ffffff18;background:#08090c}
.web85TypeStage span{position:absolute;font:900 clamp(48px,6vw,94px)/.82 Arial;letter-spacing:-.07em;opacity:0;transform:translateY(60%) scale(.84);animation:web85Words 5.2s infinite}
.web85TypeStage span:nth-child(2){animation-delay:1.3s}.web85TypeStage span:nth-child(3){animation-delay:2.6s}.web85TypeStage span:nth-child(4){animation-delay:3.9s;color:#c7ff52}
@keyframes web85Words{0%,20%{opacity:0;transform:translateY(70%) scale(.84)}5%,15%{opacity:1;transform:none}25%,100%{opacity:0;transform:translateY(-70%) scale(1.08)}}
.web85PointerStage{height:245px;margin:36px -24px 0;display:grid;place-items:center;position:relative;overflow:hidden;background:linear-gradient(145deg,#121318,#08090c);border-block:1px solid #ffffff18}
.web85PointerOrb{position:absolute;width:170px;height:170px;border-radius:50%;left:var(--px,58%);top:var(--py,42%);transform:translate(-50%,-50%);background:radial-gradient(circle at 35% 30%,#fff,#c7ff52 10%,#7b5cff 42%,#111 72%);filter:saturate(1.2);box-shadow:0 0 90px #735dff55;transition:left .12s linear,top .12s linear}
.web85PointerStage button{position:relative;z-index:2;border:1px solid #ffffff70;background:#08090cbb;color:#fff;border-radius:99px;padding:17px 22px;font:10px Consolas,monospace;letter-spacing:.12em;backdrop-filter:blur(10px);transition:transform .18s,background .2s,color .2s}
.web85PointerStage button:hover{background:#c7ff52;color:#08090c;transform:scale(1.07)}
.web85Proof{position:relative;z-index:2;margin-top:clamp(70px,9vw,130px);border-top:1px solid #ffffff22;padding-top:28px;display:flex;justify-content:space-between;gap:5vw;align-items:flex-start}
.web85Proof span{font:10px Consolas,monospace;letter-spacing:.18em;color:#c7ff52}
.web85Proof p{font-size:clamp(28px,4.1vw,64px);line-height:.98;letter-spacing:-.045em;max-width:820px;margin:0}
.gatePreviewWeb85{background:
  radial-gradient(circle at 68% 36%,#c7ff52 0 2%,transparent 3%),
  radial-gradient(circle at 58% 48%,#735dff 0 13%,transparent 34%),
  linear-gradient(135deg,#11131a,#050609)!important;
}
.gatePreviewWeb85:after{content:"</>";position:absolute;inset:0;display:grid;place-items:center;font:900 52px Arial;color:#ffffffa8;letter-spacing:-.1em}
#web-interactive + .compare{border-top:1px solid #ffffff12}
@media(max-width:800px){
  #hero .heroIdentity .heroDisciplines{font-size:2.2vw!important;letter-spacing:.12em!important;white-space:nowrap!important}
  #web-interactive.web85{padding:82px 22px 100px}
  #web-interactive.web85:before{font-size:54vw;top:.7em;right:-.12em;-webkit-text-stroke-color:#ffffff08}
  .web85Intro{display:block}
  .web85Kicker{font-size:9px;margin-bottom:26px}
  .web85Intro h2{font-size:10.2vw;line-height:.86;letter-spacing:-.055em;max-width:100%}
  .web85Intro h2 span{display:block}
  .web85Intro h2 em{display:block;font-size:.82em;line-height:.92;margin-top:.12em}
  .web85IntroText{margin:38px 0 0}
  .web85IntroText p{font-size:16px}
  .web85ThenNow{grid-template-columns:1fr;gap:16px;margin:72px 0 88px}
  .web85Era{min-height:410px;padding:26px 22px}
  .web85Year{font-size:21vw}
  .web85EraNow strong{font-size:12vw}
  .web85Years{writing-mode:horizontal-tb;flex-direction:row;padding:18px 0}
  .web85Years span{transform:rotate(0deg)}
  .web85LabHead{display:block}
  .web85LabHead h3{font-size:13vw;margin-top:24px}
  .web85LabHead p{font-size:15px;margin:28px 0 0}
  .web85Lab{grid-template-columns:1fr;margin-top:38px}
  .web85Demo{min-height:480px}
  .web85TiltPlane{width:58%;max-width:260px}
  .web85TypeStage,.web85PointerStage{height:230px}
  .web85Proof{display:block}
  .web85Proof p{font-size:9vw;margin-top:26px}
}
@media(max-width:420px){
  #hero .heroIdentity .heroDisciplines{font-size:2.45vw!important;letter-spacing:.09em!important}
  .web85Intro h2{font-size:10.1vw}
  .web85Era pre{padding:18px}
  .web85Era code{font-size:10.5px}
}
@media(prefers-reduced-motion:reduce){
  .web85TypeStage span{animation:none!important}
  .web85TypeStage span:first-child{opacity:1!important;transform:none!important}
  .web85TiltPlane{transform:none!important}
}

/* ===== v86-web-refine ===== */
.web85EraOld:after{display:none!important}
.web85PointerStage{isolation:isolate;cursor:pointer}
.web85PointerOrb{will-change:left,top,transform,filter;transition:left .28s cubic-bezier(.2,.8,.2,1),top .28s cubic-bezier(.2,.8,.2,1),transform .28s cubic-bezier(.2,.8,.2,1),filter .28s ease,box-shadow .28s ease!important}
.web85PointerStage:after{content:"";position:absolute;z-index:1;left:var(--px,58%);top:var(--py,42%);width:28px;height:28px;border:1px solid #c7ff52;border-radius:50%;transform:translate(-50%,-50%) scale(.25);opacity:0;pointer-events:none}
.web85PointerStage.is-burst .web85PointerOrb{transform:translate(-50%,-50%) scale(1.28) rotate(12deg)!important;filter:saturate(1.55) brightness(1.12)!important;box-shadow:0 0 42px #c7ff52aa,0 0 120px #735dff88!important}
.web85PointerStage.is-burst:after{animation:web86Ripple .68s cubic-bezier(.16,1,.3,1)}
@keyframes web86Ripple{0%{opacity:.9;transform:translate(-50%,-50%) scale(.25)}100%{opacity:0;transform:translate(-50%,-50%) scale(8)}}
.web85PointerStage button{cursor:pointer;min-width:176px}
.web85PointerStage button.is-touched{background:#c7ff52!important;color:#08090c!important;transform:scale(1.08)!important;box-shadow:0 0 0 9px #c7ff5218,0 12px 42px #0007}
#web-interactive.web85{padding-bottom:clamp(76px,8vw,120px)}
.web85Proof{display:none!important}
.web85Compare{min-height:auto!important;display:block!important;padding:clamp(82px,9vw,138px) 0 clamp(92px,10vw,150px)!important;background:#111216!important}
.web85Compare .compareInner{width:min(1100px,88vw)!important;margin:0 auto}
.web85Compare .label{font:700 10px/1.3 Consolas,monospace!important;letter-spacing:.18em!important;color:#c7ff52!important}
.web85Compare h2{font-size:clamp(52px,7.2vw,112px)!important;line-height:.84!important;letter-spacing:-.065em!important;margin:22px 0 22px!important;max-width:980px!important;text-wrap:balance}
.web85Compare h2 span{color:#f2f1ec}
.web86CompareIntro{margin:0 0 clamp(38px,5vw,66px);max-width:720px;color:#aaa7a4;font-size:clamp(16px,1.45vw,21px);line-height:1.55}
.web85Compare .slider{margin-top:0}
@media(max-width:800px){.web85EraOld:after{display:none!important}.web85PointerStage{touch-action:manipulation}.web85PointerStage button{min-width:190px;padding:19px 24px;font-size:11px}.web85Compare{padding:74px 0 92px!important}.web85Compare .compareInner{width:min(92vw,680px)!important}.web85Compare h2{font-size:11.2vw!important;line-height:.89!important;letter-spacing:-.055em!important;margin:18px 0 18px!important}.web86CompareIntro{font-size:15px;line-height:1.5;margin-bottom:34px}.web85Compare .slider{height:330px!important}}

/* ===== v88-tight-flow-web-hero ===== */
/* V88 — tighter editorial rhythm + WEB visibly integrated */

/* Manifesto: use the space instead of leaving a dead zone. */
.darkBridge{
  min-height:auto!important;
  padding-top:clamp(58px,6.5vh,90px)!important;
  padding-bottom:clamp(54px,6vh,84px)!important;
}
.darkBridge .bridgeMain{margin-top:clamp(42px,5vh,68px)!important}
.darkBridge .bridgeLine{padding:.55vh 0!important}
.darkBridge .bridgeLine strong{font-size:clamp(62px,9.5vw,148px)!important}
.darkBridge .bridgeBottom{margin-top:clamp(34px,4vh,54px)!important}
.darkBridge .bridgeWeb strong{color:#f3f1ec!important}
.darkBridge .bridgeWeb span{color:#a8c66b!important}

/* Work gate: remove the large empty runway before the next topic. */
.workGate{padding-top:clamp(58px,7vh,90px)!important;padding-bottom:0!important}
.gateHead{margin-bottom:clamp(42px,5vh,70px)!important}
.gateFooter{
  height:auto!important;
  min-height:0!important;
  padding:clamp(34px,4vh,54px) 0 clamp(42px,5vh,70px)!important;
  align-items:center!important;
}

/* Video introduction: still a real chapter opener, but no near-empty screen. */
#motion .motionIntroV78{
  min-height:auto!important;
  padding:clamp(72px,8vh,112px) 7vw clamp(66px,7vh,98px)!important;
  justify-content:flex-start!important;
}
#motion .motionIntroV78 .motionIntroLabel{margin-bottom:clamp(28px,3.5vh,46px)!important}
#motion .motionIntroV78 p{margin-top:clamp(28px,3.5vh,44px)!important}
#motion .motionIntroHint{margin-top:clamp(34px,4vh,50px)!important}
#motion .motionIntroArrow{bottom:clamp(36px,4vh,56px)!important}

/* ONE LANGUAGE: content-sized instead of a full-screen pause. */
.videoMotionWrap .split{
  min-height:0!important;
  padding:clamp(70px,8vh,112px) 7vw!important;
}
.videoMotionWrap .split h2{
  margin:clamp(16px,2vh,24px) 0 clamp(18px,2.4vh,30px)!important;
  font-size:clamp(58px,9.5vw,140px)!important;
}
.videoMotionWrap .split p{font-size:clamp(17px,1.65vw,24px)!important;line-height:1.45!important}

/* The hero discipline line already names WEB; give it a touch more legibility. */
#hero .heroIdentity .heroDisciplines{color:#c7ff52!important;font-weight:700!important}

@media(max-width:1100px){
  .darkBridge{padding-top:52px!important;padding-bottom:48px!important}
  .darkBridge .bridgeMain{margin-top:38px!important}
  .darkBridge .bridgeBottom{margin-top:30px!important}
  .workGate{padding-top:56px!important}
  .gateHead{margin-bottom:42px!important}
  .gateFooter{padding:30px 0 42px!important}
  #motion .motionIntroV78{padding:68px 7vw 62px!important}
  .videoMotionWrap .split{padding:66px 7vw!important}
}

@media(max-width:800px){
  .darkBridge{min-height:0!important;padding:48px 7vw 44px!important}
  .darkBridge .bridgeMain{margin-top:34px!important}
  .darkBridge .bridgeLine{padding:8px 0!important}
  .darkBridge .bridgeLine strong{font-size:clamp(52px,15vw,82px)!important}
  .darkBridge .bridgeBottom{margin-top:28px!important}
  .workGate{padding:54px 7vw 0!important}
  .gateHead{margin-bottom:38px!important}
  .gateHead>span{margin-bottom:38px!important}
  .gateHead p{margin-top:30px!important}
  .gateFooter{padding:28px 0 38px!important}
  #motion .motionIntroV78{min-height:0!important;padding:64px 7vw 58px!important}
  #motion .motionIntroV78 .motionIntroLabel{margin-bottom:28px!important}
  #motion .motionIntroV78 p{margin-top:28px!important}
  #motion .motionIntroHint{margin-top:32px!important}
  #motion .motionIntroArrow{bottom:34px!important}
  .videoMotionWrap .split{min-height:0!important;padding:64px 7vw!important}
  .videoMotionWrap .split h2{font-size:15vw!important;margin:14px 0 22px!important}
  .videoMotionWrap .split p{font-size:17px!important;line-height:1.42!important}
}

/* ===== v90-scroll-cue ===== */
.firstCue{
  position:absolute!important;
  z-index:30!important;
  left:50%!important;
  bottom:3.2vh!important;
  transform:translateX(-50%)!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  gap:6px!important;
  min-width:230px!important;
  padding:12px 22px 8px!important;
  text-align:center!important;
  white-space:normal!important;
  color:#f5f4ef!important;
  background:linear-gradient(180deg,rgba(8,10,12,.30),rgba(8,10,12,.78))!important;
  border:1px solid rgba(185,255,60,.36)!important;
  border-radius:999px!important;
  box-shadow:0 12px 40px rgba(0,0,0,.28),0 0 34px rgba(185,255,60,.08)!important;
  backdrop-filter:blur(8px)!important;
  -webkit-backdrop-filter:blur(8px)!important;
}
.firstCue strong{
  display:block!important;
  font:800 clamp(16px,1.45vw,22px)/1 Arial,sans-serif!important;
  letter-spacing:.22em!important;
  padding-left:.22em!important;
}
.firstCue span{
  display:block!important;
  font:600 clamp(9px,.72vw,11px)/1.2 Arial,sans-serif!important;
  letter-spacing:.20em!important;
  padding-left:.20em!important;
  color:#b9ff3c!important;
}
.firstCue i{
  display:block!important;
  margin-top:1px!important;
  font:400 31px/1 Arial,sans-serif!important;
  color:#b9ff3c!important;
  font-style:normal!important;
  animation:v90CueArrow 1.15s ease-in-out infinite!important;
  text-shadow:0 0 18px rgba(185,255,60,.42)!important;
}
.firstCue:after{display:none!important}
@keyframes v90CueArrow{
  0%,100%{transform:translateY(0);opacity:.58}
  50%{transform:translateY(8px);opacity:1}
}
@media(max-width:800px){
  .firstCue{
    bottom:2.6vh!important;
    min-width:214px!important;
    padding:11px 18px 7px!important;
    gap:5px!important;
  }
  .firstCue strong{font-size:18px!important}
  .firstCue span{font-size:9px!important}
  .firstCue i{font-size:28px!important}
}

/* ===== v91-workgate-hardfix ===== */
#work .v91GateHead{
  display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;
  width:min(1120px,88vw);margin:0 auto clamp(46px,6vh,78px);padding:0;
}
#work .v91GateHead>span{
  margin:0 0 clamp(22px,3vh,36px);font:600 10px/1.2 Consolas,monospace;letter-spacing:.28em;color:#7c7c7c;
}
#work .v91GateHead h2{
  margin:0;display:flex;flex-direction:column;align-items:center;justify-content:center;
  font-family:Arial,Helvetica,sans-serif;font-weight:900;letter-spacing:-.075em;line-height:.77;
}
#work .v91GateHead h2 strong{
  display:block;font-size:clamp(76px,11vw,168px);font-weight:900;color:#f1f0eb;
}
#work .v91GateHead h2 em{
  display:block;font-size:clamp(76px,11vw,168px);font-weight:900;font-style:normal;color:#c7ff52;
  text-shadow:0 0 38px rgba(199,255,82,.06);
}
#work .v91GateHead p{
  width:min(720px,86vw);margin:clamp(26px,3.5vh,42px) auto 0;
  font:400 clamp(16px,1.35vw,21px)/1.5 Arial,sans-serif;color:#999;text-align:center;
}
@media(max-width:800px){
  #work .v91GateHead{width:90vw;margin-bottom:40px}
  #work .v91GateHead h2 strong,#work .v91GateHead h2 em{font-size:clamp(62px,18vw,104px)}
  #work .v91GateHead p{font-size:16px;line-height:1.45}
}

/* ===== v93-real-fixes ===== */
/* ===== V93 echte Layout-Korrekturen ===== */
.firstCue{
  bottom:max(22px,env(safe-area-inset-bottom) + 18px)!important;
  left:50%!important;
  transform:translateX(-50%)!important;
  width:min(88vw,520px)!important;
  padding:16px 18px 18px!important;
  border:1px solid rgba(255,255,255,.16)!important;
  border-radius:18px!important;
  background:linear-gradient(180deg,rgba(8,9,13,.76),rgba(8,9,13,.42))!important;
  backdrop-filter:blur(10px)!important;
  text-align:center!important;
  box-shadow:0 14px 40px rgba(0,0,0,.25)!important;
}
.firstCue strong{display:block;font-size:clamp(16px,2vw,22px)!important;letter-spacing:.18em!important;margin-bottom:6px!important}
.firstCue span{display:block;font-size:clamp(12px,1.2vw,15px)!important;letter-spacing:.14em!important;color:#c7ff52!important}
.firstCue i{font-size:clamp(28px,3vw,38px)!important;margin-top:8px!important;color:#c7ff52!important}

/* Arbeitsprobe-Sektion ruhiger und zentrierter */
.compare{padding:9vh 5vw 10vh!important}
.compareInner{width:min(980px,90vw)!important;text-align:center!important}
.compare h2{
  font-size:clamp(50px,7.1vw,104px)!important;
  line-height:.84!important;
  letter-spacing:-.065em!important;
  margin:18px auto 24px!important;
  max-width:900px!important;
}
.compare h2 span{display:block!important}
.compare h2 em{font-style:normal!important;color:#c7ff52!important}
.web86CompareIntro{
  max-width:760px!important;
  margin:0 auto 28px!important;
  font-size:clamp(17px,1.7vw,24px)!important;
  line-height:1.45!important;
  color:#a7a9ae!important;
}
.slider{height:420px!important;border-radius:0!important;box-shadow:0 30px 90px rgba(0,0,0,.35)!important}
.handle{width:4px!important;background:rgba(255,255,255,.9)!important}
.handle:after{
  width:76px!important;height:76px!important;font-size:26px!important;
  border:2px solid rgba(0,0,0,.08)!important;box-shadow:0 14px 34px rgba(0,0,0,.24)!important;
}
.after strong{font-size:clamp(48px,7vw,108px)!important;line-height:.86!important;text-align:center!important}
.experienceTag{font-size:11px!important;letter-spacing:.26em!important}

/* Vier Bereiche: klarer, zentriert, Akzent voll statt Outline */
#work .v91GateHead{width:min(980px,92vw)!important;margin-bottom:48px!important}
#work .v91GateHead h2 strong{font-size:clamp(62px,10vw,132px)!important}
#work .v91GateHead h2 em{
  font-size:clamp(62px,10vw,132px)!important;
  color:#c7ff52!important;
  text-shadow:none!important;
}
#work .v91GateHead p{max-width:650px!important;text-align:center!important}

/* Video-Zwischensektion dunkler und kompakter */
.videoMotionWrap .split{
  min-height:58vh!important;
  background:#0b0d12!important;
  color:#f2f1ec!important;
  padding:7.5vw 6vw!important;
}
.videoMotionWrap .split .eyebrow{color:#7c7f86!important}
.videoMotionWrap .split h2{
  font-size:clamp(52px,9vw,110px)!important;
  line-height:.84!important;
  margin:12px 0 18px!important;
}
.videoMotionWrap .split p{
  max-width:760px!important;
  color:#b1b4bb!important;
  font-size:clamp(17px,1.7vw,23px)!important;
  line-height:1.5!important;
}
.videoMotionWrap .end{padding:8vw 6vw!important}
.videoMotionWrap .end h2{font-size:clamp(48px,7vw,96px)!important}
.videoMotionWrap .end p{font-size:clamp(17px,1.5vw,22px)!important;line-height:1.5!important}

/* Photoshop-Archiv weniger dominant */
.preAi80 h2{font-size:clamp(50px,7.4vw,102px)!important;line-height:.84!important;max-width:820px!important}
.preAi80Intro{font-size:clamp(16px,1.4vw,22px)!important;max-width:760px!important}
.preAi80Stats strong{font-size:clamp(20px,2.2vw,34px)!important}

/* Timeline versetzter statt linkslastig */
.journeyHead{text-align:center!important}
.journeyHead p{margin-inline:auto!important;color:#7f7f7f!important}
@media(min-width:761px){
  .journeyList{padding-left:0!important;width:min(1060px,92vw)!important;margin:0 auto!important}
  .journeyList:before,.journeyList:after{left:50%!important;transform:translateX(-50%)!important}
  .journeyItem{grid-template-columns:1fr 1fr!important;min-height:146px!important;padding:0!important}
  .journeyYear,.journeyEvent{padding:26px 28px!important}
  .journeyItem:nth-child(odd) .journeyYear{text-align:right!important;padding-right:52px!important}
  .journeyItem:nth-child(odd) .journeyEvent{grid-column:2!important;padding-left:52px!important;text-align:left!important}
  .journeyItem:nth-child(even) .journeyYear{grid-column:2!important;text-align:left!important;padding-left:52px!important}
  .journeyItem:nth-child(even) .journeyEvent{grid-row:1!important;grid-column:1!important;padding-right:52px!important;text-align:right!important}
}

/* Prozess-Sektion ausgewogener: erster Satz links, grüner Satz rechts */
#process-v51 .big{
  max-width:1200px!important;
  margin:0 auto clamp(42px,6vh,64px)!important;
  font-size:clamp(58px,8vw,134px)!important;
  line-height:.84!important;
  letter-spacing:-.07em!important;
  text-align:left!important;
}
#process-v51 .big i{
  display:block!important;
  text-align:right!important;
  margin-top:.04em!important;
  font-style:italic!important;
}

/* Kontakt kompakter und zentrierter */
.contactV81::before{left:50%!important;transform:translateX(-50%)!important;width:96px!important}
.contactV81Top{max-width:980px!important;margin:0 auto clamp(36px,5vh,64px)!important}
.contactV81 h2{
  max-width:980px!important;
  margin:0 auto!important;
  text-align:center!important;
  font-size:clamp(52px,8.5vw,116px)!important;
  line-height:.84!important;
}
.contactV81 h2 span{display:block!important;color:#c7ff52!important}
.contactV81Lead{margin:28px auto 0!important;text-align:center!important;max-width:760px!important}
.contactV81Links{max-width:980px!important;margin-inline:auto!important}

@media(max-width:760px){
  .compare{padding:70px 0 76px!important}
  .compareInner{width:100%!important}
  .compare .label{display:block!important;margin-bottom:12px!important;text-align:center!important}
  .compare h2{font-size:14vw!important;line-height:.88!important;margin:12px auto 18px!important;padding:0 18px!important}
  .web86CompareIntro{padding:0 18px!important;font-size:16px!important;margin-bottom:22px!important}
  .slider{height:320px!important;margin:0 14px!important}
  .handle:after{width:72px!important;height:72px!important;font-size:24px!important}
  .experienceTag{font-size:9px!important;letter-spacing:.22em!important}

  .videoMotionWrap .split{min-height:auto!important;padding:60px 24px!important}
  .videoMotionWrap .split h2{font-size:15vw!important}
  .videoMotionWrap .split p{font-size:16px!important}
  .videoMotionWrap .end{padding:62px 24px!important}

  .preAi80{padding-left:24px!important;padding-right:24px!important}
  .preAi80Head,.preAi80Lesson{grid-template-columns:1fr!important;gap:22px!important}
  .preAi80 h2{font-size:16vw!important;line-height:.86!important;margin:18px 0 14px!important}
  .preAi80Intro{font-size:16px!important;line-height:1.5!important}

  #work .v91GateHead{margin-bottom:30px!important}
  #work .v91GateHead h2 strong,#work .v91GateHead h2 em{font-size:20vw!important;line-height:.82!important}
  #work .v91GateHead p{font-size:15px!important;line-height:1.45!important;max-width:320px!important}

  .journey{padding-left:20px!important;padding-right:20px!important}
  .journeyHead h3{font-size:13.5vw!important;line-height:.9!important}
  .journeyList{padding-left:24px!important}
  .journeyList:before,.journeyList:after{left:7px!important;transform:none!important}
  .journeyItem{grid-template-columns:1fr!important;min-height:unset!important;padding:18px 0 18px 0!important}
  .journeyYear{font-size:15vw!important;line-height:.88!important;padding:0 0 8px 0!important}
  .journeyEvent{padding:0!important}
  .journeyEvent b{display:block;font-size:8.2vw!important;line-height:.96!important;margin-bottom:6px!important}
  .journeyEvent span{display:block;font-size:10px!important;letter-spacing:.16em!important}

  #process-v51 .big{font-size:14.5vw!important;line-height:.9!important;padding:0 22px!important}
  #process-v51 .big i{text-align:right!important}
  #process-v51 .processRows .row{padding:38px 18px 40px 54px!important}

  .contactV81{padding:72px 20px 78px!important}
  .contactV81Top{display:grid!important;grid-template-columns:1fr!important;justify-items:center!important;text-align:center!important;gap:10px!important}
  .contactV81 h2{font-size:16vw!important;line-height:.88!important}
  .contactV81Lead{font-size:16px!important;max-width:340px!important}
  .contactV81Links{grid-template-columns:1fr!important;gap:14px!important;margin-top:34px!important}
}

/* ===== v94-alignment-fixes ===== */
/* ===== V94: echte Korrekturen laut Screenshots ===== */
:root{--acid:#c7ff52}

/* 1) Manifest / Werkzeugkasten oben zentrieren */
.darkBridge .bridgeTop{width:min(1120px,92vw)!important;margin:0 auto 28px!important}
.darkBridge .bridgeMain{width:min(980px,92vw)!important;margin:0 auto!important;display:grid!important;gap:10px!important}
.darkBridge .bridgeLine{grid-template-columns:1fr!important;justify-items:center!important;text-align:center!important;padding:8px 0 16px!important}
.darkBridge .bridgeLine strong{font-size:clamp(52px,9vw,122px)!important;line-height:.86!important}
.darkBridge .bridgeLine span{margin-bottom:8px!important;letter-spacing:.2em!important}
.darkBridge .bridgeBottom{width:min(760px,90vw)!important;margin:28px auto 0!important;text-align:center!important;display:grid!important;justify-items:center!important;gap:16px!important}
.darkBridge .bridgeArrow{position:static!important;margin:0 auto!important}

/* 2) Gate Footer & Bewegung wirkt mittiger */
.workGate .gateFooter{text-align:center!important;padding-top:34px!important;padding-bottom:40px!important}
.motionIntroV77.motionIntroV78,.motionIntroV78,.motionIntroV77{justify-items:center!important;text-align:center!important;padding:64px 26px 68px!important}
.motionIntroV77 h2,.motionIntroV78 h2{font-size:clamp(54px,8vw,108px)!important;line-height:.84!important;margin:10px auto 18px!important}
.motionIntroV77 h2 i,.motionIntroV78 h2 i{display:block!important;color:var(--acid)!important;font-style:normal!important}
.motionIntroV77 p,.motionIntroV78 p{max-width:860px!important;margin:0 auto!important;font-size:clamp(18px,1.7vw,24px)!important;line-height:1.5!important}
.motionIntroHint,.motionIntroArrow{justify-self:center!important}

/* 3) Eine Bildsprache: kleiner, mittiger, zweite Zeile grün */
.videoMotionWrap .split{background:#0a0c11!important;padding:78px 26px!important}
.videoMotionWrap .split > div{max-width:1080px!important;margin:0 auto!important;text-align:center!important}
.videoMotionWrap .split h2{font-size:clamp(50px,8vw,96px)!important;line-height:.86!important;letter-spacing:-.06em!important;margin:14px auto 18px!important;max-width:980px!important}
.videoMotionWrap .split h2 span{color:var(--acid)!important;display:block!important}
.videoMotionWrap .split p{max-width:900px!important;margin:0 auto!important;font-size:clamp(17px,1.55vw,22px)!important;color:#c6c9cf!important;line-height:1.52!important}
.hsVideoArchiveBridge69{padding:28px 16px 48px!important}

/* 4) Web-Intro konsistenter */
.web85Intro{padding:clamp(56px,7vw,92px) 28px 44px!important;display:grid!important;justify-items:center!important;text-align:center!important}
.web85Intro h2{font-size:clamp(52px,8.6vw,112px)!important;line-height:.86!important;letter-spacing:-.055em!important;margin:16px auto 20px!important;max-width:1120px!important}
.web85Intro h2 .web85Quote{color:var(--acid)!important;display:block!important}
.web85Intro h2 .web85White{display:block!important}
.web85Intro h2 em{display:block!important;color:#cfd2d8!important;font-style:italic!important;font-weight:600!important}
.web85IntroText{max-width:900px!important;margin:0 auto!important}
.web85IntroText p{font-size:clamp(18px,1.45vw,22px)!important;line-height:1.56!important}

/* 5) Helles Textfeld kleiner und ruhiger */
.preAi80Lesson{padding-top:26px!important}
.preAi80Lesson p{max-width:940px!important;margin:0 auto!important;font-size:clamp(18px,2.1vw,32px)!important;line-height:1.24!important}
.preAi80Lesson .stamp{margin-bottom:18px!important}

/* 6) Prompting deutlich kleiner */
#ai-final-v40 h2{font-size:clamp(44px,7.2vw,92px)!important;line-height:.84!important;max-width:860px!important;margin:0 0 28px!important}
#ai-final-v40 .aiV40Image{min-height:460px!important}

/* 7) Prozess-Headline ausgewogen */
#process-v51 .big{max-width:1240px!important;margin:0 auto 54px!important;padding:0 26px!important;font-size:clamp(52px,7.2vw,96px)!important;line-height:.88!important;letter-spacing:-.06em!important}
#process-v51 .big .line-one{display:block!important;text-align:left!important;color:#f4f1e8!important}
#process-v51 .big .line-two{display:block!important;text-align:right!important;color:var(--acid)!important;font-style:italic!important;margin-top:.08em!important}

/* 8) Kontakt sauber auf zwei Zeilen, mittig */
.contactV81Top{max-width:1100px!important;margin:0 auto 26px!important}
.contactV81 h2{max-width:980px!important;margin:0 auto!important;text-align:center!important;font-size:clamp(52px,7.6vw,102px)!important;line-height:.88!important}
.contactV81 h2 span{display:block!important;color:var(--acid)!important}
.contactV81Lead{max-width:760px!important;margin:24px auto 0!important;text-align:center!important}

/* 9) Timeline komplett aufräumen */
.journey{width:min(1100px,94vw)!important;margin:0 auto!important}
.journeyHead{text-align:center!important;margin-bottom:28px!important}
.journeyHead p{max-width:760px!important;margin:10px auto 0!important}
.journeyList{width:100%!important;max-width:100%!important;margin:0 auto!important;padding:0!important;display:grid!important;gap:0!important}
.journeyList:before,.journeyList:after{display:none!important}
.journeyItem{display:grid!important;grid-template-columns:180px 1fr!important;gap:26px!important;align-items:center!important;padding:26px 0!important;border-top:1px solid rgba(0,0,0,.08)!important;min-height:auto!important}
.journeyItem:last-child{border-bottom:1px solid rgba(0,0,0,.08)!important}
.journeyYear{grid-column:1!important;font-size:clamp(44px,6vw,86px)!important;line-height:.9!important;text-align:left!important;padding:0!important}
.journeyEvent{grid-column:2!important;padding:0!important;text-align:left!important}
.journeyEvent b{display:block!important;font-size:clamp(26px,2.4vw,40px)!important;line-height:1.02!important;margin-bottom:6px!important}
.journeyEvent span{display:block!important;font-size:clamp(11px,1vw,14px)!important;letter-spacing:.18em!important;text-transform:uppercase!important;color:#6b6c70!important}

/* Mobile Feinschliff */
@media(max-width:760px){
  .darkBridge .bridgeTop{margin-bottom:20px!important}
  .darkBridge .bridgeLine strong{font-size:18vw!important}
  .darkBridge .bridgeLine span{font-size:10px!important;letter-spacing:.16em!important}
  .darkBridge .bridgeBottom p{font-size:16px!important;line-height:1.45!important}
  
  .motionIntroV77.motionIntroV78,.motionIntroV78,.motionIntroV77{padding:54px 20px 60px!important}
  .motionIntroV77 h2,.motionIntroV78 h2{font-size:15vw!important;line-height:.88!important}
  .motionIntroV77 p,.motionIntroV78 p{font-size:16px!important}
  
  .videoMotionWrap .split{padding:56px 18px!important}
  .videoMotionWrap .split h2{font-size:14vw!important;line-height:.9!important}
  .web85Intro{padding:56px 18px 34px!important}
  .web85Intro h2{font-size:15vw!important;line-height:.9!important}
  .web85IntroText p{font-size:16px!important}
  
  .preAi80Lesson p{font-size:7vw!important;line-height:1.16!important}
  #ai-final-v40 h2{font-size:13.2vw!important;line-height:.88!important}
  
  #process-v51 .big{font-size:11.3vw!important;line-height:.9!important;padding:0 18px!important;margin-bottom:36px!important}
  #process-v51 .big .line-one{white-space:normal!important}
  #process-v51 .big .line-two{margin-top:.14em!important}
  
  .contactV81{padding:74px 18px 78px!important}
  .contactV81 h2{font-size:13.8vw!important;line-height:.92!important;max-width:94vw!important}
  .contactV81Lead{font-size:16px!important;line-height:1.45!important}

  .journey{width:100%!important}
  .journeyList{padding:0!important}
  .journeyItem{grid-template-columns:1fr!important;gap:6px!important;padding:18px 0!important}
  .journeyYear{font-size:14vw!important}
  .journeyEvent b{font-size:8vw!important;line-height:1!important}
  .journeyEvent span{font-size:10px!important;letter-spacing:.14em!important}
}

/* ===== v95-layout-repair ===== */
/* ===== V95: letzte klare Strukturreparaturen ===== */
:root{--acid:#c7ff52}

/* 1) Werkzeugkasten oben: gleiche Achse statt Schieflage */
.darkBridge .bridgeTop{align-items:center!important}
.darkBridge .bridgeMain{width:min(860px,92vw)!important;gap:0!important}
.darkBridge .bridgeLine{grid-template-columns:1fr!important;justify-items:center!important;padding:10px 0 18px!important}
.darkBridge .bridgeLine span{display:block!important;width:min(460px,76vw)!important;text-align:left!important;margin:0 auto 6px!important;padding:0!important;color:var(--acid)!important}
.darkBridge .bridgeLine strong{display:block!important;width:min(460px,76vw)!important;margin:0 auto!important;text-align:left!important;font-size:clamp(60px,10vw,118px)!important;line-height:.88!important}
.darkBridge .bridgeBottom{margin-top:38px!important;gap:18px!important}
.darkBridge .bridgeBottom p{max-width:620px!important;font-size:clamp(18px,1.5vw,24px)!important;line-height:1.45!important}
.darkBridge .bridgeArrow{font-size:72px!important}

/* 2) WEB-Intro: 2-Zeiler sauber, Fließtext darunter statt rechts gequetscht */
.web85Intro{grid-template-columns:1fr!important;gap:22px!important;justify-items:center!important;text-align:center!important;padding:10px 0 8px!important}
.web85Kicker{margin-bottom:8px!important}
.web85Intro h2{max-width:1120px!important;margin:0 auto!important;font-size:clamp(52px,7vw,104px)!important;line-height:.88!important;letter-spacing:-.055em!important}
.web85Intro h2 .web85Quote{display:block!important;color:var(--acid)!important}
.web85Intro h2 .web85White{display:block!important;color:#f2efe7!important}
.web85Intro h2 em{display:block!important;color:#d8d6dc!important;font-style:italic!important;font-weight:600!important;white-space:nowrap!important;font-size:.78em!important;line-height:.95!important}
.web85IntroText{max-width:860px!important;margin:0 auto!important;text-align:center!important}
.web85IntroText p{font-size:clamp(18px,1.45vw,22px)!important;line-height:1.56!important;margin:0 0 1em!important}

/* 3) Helles Fundament-Feld und Prompting kleiner */
.preAi80Lesson p{max-width:900px!important;font-size:clamp(17px,1.7vw,28px)!important;line-height:1.22!important}
#ai-final-v40 h2{max-width:760px!important;font-size:clamp(40px,6.2vw,76px)!important;line-height:.88!important;margin:0 0 24px!important}

/* 4) Timeline: Datum links, Inhalt rechts, kompakter und gefüllt */
.journey{width:min(1020px,92vw)!important;margin:0 auto!important;padding:34px 26px 28px!important}
.journeyHead{margin-bottom:18px!important}
.journeyHead h3{font-size:clamp(38px,4.8vw,64px)!important;line-height:.92!important}
.journeyHead p{max-width:700px!important;font-size:clamp(16px,1.35vw,19px)!important}
.journeyList{padding:0!important}
.journeyList:before,.journeyList:after{display:none!important}
.journeyItem{display:grid!important;grid-template-columns:170px 1fr!important;gap:26px!important;min-height:auto!important;padding:18px 0!important;align-items:start!important;opacity:1!important;transform:none!important;border-top:1px solid rgba(17,17,17,.09)!important}
.journeyItem:first-child{border-top:1px solid rgba(17,17,17,.09)!important}
.journeyItem:before{display:none!important}
.journeyYear{font-size:clamp(48px,5vw,74px)!important;line-height:.9!important;color:#111!important;text-align:left!important;padding-top:2px!important}
.journeyEvent{padding-right:6px!important}
.journeyEvent b{font-size:clamp(24px,2.2vw,34px)!important;line-height:1!important;margin-bottom:5px!important}
.journeyEvent span{display:block!important;font-size:clamp(10px,.9vw,13px)!important;letter-spacing:.15em!important;color:#76726c!important;margin-bottom:10px!important}
.journeyDesc{margin:0!important;max-width:670px!important;font-size:clamp(15px,1.18vw,18px)!important;line-height:1.52!important;color:#4f4d49!important}

/* 5) Prozess-Headline: erste Zeile wirklich eine Zeile */
#process-v51 .big{max-width:1220px!important;font-size:clamp(46px,6.2vw,84px)!important;line-height:.9!important;margin:0 auto 42px!important;padding:0 18px!important}
#process-v51 .big .line-one{display:block!important;white-space:nowrap!important;text-align:left!important}
#process-v51 .big .line-two{display:block!important;white-space:nowrap!important;text-align:right!important;margin-top:.16em!important}

/* 6) Kontakt wirklich 2 Zeilen und mittig */
.contactV81Top{margin:0 auto 18px!important}
.contactV81 h2{max-width:820px!important;margin:0 auto!important;text-align:center!important;font-size:clamp(42px,6.5vw,84px)!important;line-height:.92!important}
.contactV81 h2 br{display:block!important}
.contactV81 h2 span{display:block!important;white-space:nowrap!important}
.contactV81Lead{max-width:780px!important;margin:22px auto 0!important;text-align:center!important}

@media(max-width:760px){
  .darkBridge .bridgeTop{width:min(94vw,520px)!important;margin-bottom:18px!important}
  .darkBridge .bridgeLine span,.darkBridge .bridgeLine strong{width:min(300px,78vw)!important}
  .darkBridge .bridgeLine strong{font-size:16vw!important;line-height:.9!important}
  .darkBridge .bridgeBottom p{font-size:16px!important;line-height:1.45!important}
  .darkBridge .bridgeArrow{font-size:60px!important}

  .web85Intro{padding:0!important;gap:18px!important}
  .web85Intro h2{font-size:13vw!important;line-height:.92!important;max-width:94vw!important}
  .web85Intro h2 em{white-space:normal!important;font-size:.74em!important}
  .web85IntroText p{font-size:16px!important;line-height:1.5!important}

  .preAi80Lesson p{font-size:6.2vw!important;line-height:1.16!important}
  #ai-final-v40 h2{font-size:10.4vw!important;line-height:.9!important;max-width:92vw!important}

  .journey{width:min(94vw,540px)!important;padding:22px 18px 18px!important}
  .journeyItem{grid-template-columns:108px 1fr!important;gap:14px!important;padding:14px 0!important}
  .journeyYear{font-size:11vw!important;line-height:.92!important}
  .journeyEvent b{font-size:6.2vw!important;line-height:1.02!important}
  .journeyEvent span{font-size:9px!important;letter-spacing:.12em!important;margin-bottom:8px!important}
  .journeyDesc{font-size:14px!important;line-height:1.45!important}

  #process-v51 .big{font-size:8.8vw!important;line-height:.92!important;padding:0 16px!important}
  #process-v51 .big .line-one{white-space:nowrap!important}
  #process-v51 .big .line-two{white-space:nowrap!important;margin-top:.14em!important}

  .contactV81{padding:72px 18px 74px!important}
  .contactV81 h2{font-size:10.2vw!important;line-height:.94!important;max-width:92vw!important}
  .contactV81 h2 span{white-space:nowrap!important}
  .contactV81Lead{font-size:16px!important;line-height:1.45!important;max-width:92vw!important}
}

/* ===== v96-mobile-type-fix ===== */
/* V96 — nur mobile Schriftgrößen, keine Layoutänderungen */
@media(max-width:760px){
  /* Fundament: deutlich ruhiger und näher am restlichen Seitenmaßstab */
  .preAi80Lesson p{
    font-size:4.75vw!important;
    line-height:1.22!important;
  }

  /* Prozess-Headline: erste Zeile muss komplett in eine Zeile passen */
  #process-v51 .big{
    font-size:7.35vw!important;
    line-height:.94!important;
  }
  #process-v51 .big .line-two{
    font-size:.92em!important;
  }

  /* Kontakt: beide Headline-Zeilen vollständig im Viewport */
  .contactV81 h2{
    font-size:8.05vw!important;
    line-height:.96!important;
  }
}

/* ===== v99-center-axis ===== */
/* V99 — one exact center axis for bridge -> work section */
.darkBridge .bridgeBottom,
#work .v91GateHead{
  position:relative!important;
  left:50%!important;
  transform:translateX(-50%)!important;
  width:min(92vw,860px)!important;
  max-width:none!important;
  margin-left:0!important;
  margin-right:0!important;
  box-sizing:border-box!important;
}

.darkBridge .bridgeBottom{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  gap:22px!important;
}
.darkBridge .bridgeBottom p{
  width:100%!important;
  max-width:620px!important;
  margin:0 auto!important;
  text-align:center!important;
}

/* Replace the font glyph arrow with a geometrically centered CSS arrow */
.darkBridge .bridgeArrow{
  position:relative!important;
  display:block!important;
  width:64px!important;
  height:82px!important;
  margin:0 auto!important;
  padding:0!important;
  font-size:0!important;
  line-height:0!important;
  color:transparent!important;
  animation:v99ArrowBob 1.6s ease-in-out infinite!important;
}
.darkBridge .bridgeArrow::before{
  content:"";
  position:absolute;
  left:50%;
  top:4px;
  width:4px;
  height:54px;
  border-radius:3px;
  background:#c7ff52;
  transform:translateX(-50%);
}
.darkBridge .bridgeArrow::after{
  content:"";
  position:absolute;
  left:50%;
  top:42px;
  width:28px;
  height:28px;
  border-right:4px solid #c7ff52;
  border-bottom:4px solid #c7ff52;
  transform:translateX(-50%) rotate(45deg);
  transform-origin:center;
}
@keyframes v99ArrowBob{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(8px)}
}

#work .v91GateHead{
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
}
#work .v91GateHead>span,
#work .v91GateHead h2,
#work .v91GateHead p{
  margin-left:auto!important;
  margin-right:auto!important;
  text-align:center!important;
}

@media(max-width:800px){
  .darkBridge .bridgeBottom,
  #work .v91GateHead{
    width:92vw!important;
  }
  .darkBridge .bridgeArrow{
    width:58px!important;
    height:76px!important;
  }
  .darkBridge .bridgeArrow::before{
    height:50px!important;
  }
  .darkBridge .bridgeArrow::after{
    top:39px!important;
    width:25px!important;
    height:25px!important;
  }
}

/* ===== drone-v32-css ===== */
#drohne-v32{position:relative;display:block;width:100%;background:#090a0c;color:#f4f4f1;overflow:hidden}
#drohne-v32 *{box-sizing:border-box}
#drohne-v32 .droneIntro{padding:clamp(72px,9vw,150px) 7vw clamp(58px,7vw,110px);display:grid;grid-template-columns:1.2fr .8fr;gap:8vw;align-items:end}
#drohne-v32 .eyebrow{font:500 12px/1.3 monospace;letter-spacing:.27em;opacity:.58;margin-bottom:24px}
#drohne-v32 h2{font:800 clamp(58px,9vw,140px)/.82 Arial,sans-serif;letter-spacing:-.065em;margin:0}
#drohne-v32 .copy{font:400 clamp(17px,1.45vw,22px)/1.65 Arial,sans-serif;color:rgba(255,255,255,.7);max-width:590px}
#drohne-v32 .copy b{display:block;color:#fff;font-size:clamp(23px,2.2vw,35px);line-height:1.15;margin-bottom:24px}
#drohne-v32 .features{padding:0 4vw 9vw;display:grid;gap:clamp(48px,8vw,110px)}
#drohne-v32 .droneFeature{margin:0}
#drohne-v32 .droneVisual{aspect-ratio:16/9;overflow:hidden;background:#111}
#drohne-v32 .droneVisual img{display:block;width:100%;height:100%;object-fit:cover}
#drohne-v32 .droneCaption{display:flex;justify-content:space-between;padding-top:14px;font:500 11px/1.3 monospace;letter-spacing:.18em;color:rgba(255,255,255,.5)}
#drohne-v32 .droneCaption strong{color:#fff;font-weight:500}
@media(max-width:760px){#drohne-v32 .droneIntro{grid-template-columns:1fr;padding:68px 22px 50px;gap:38px}#drohne-v32 .features{padding:0 10px 72px;gap:52px}#drohne-v32 .droneCaption{padding:12px 5px 0;font-size:9px;letter-spacing:.12em}}

/* ===== ai-v40-mobile ===== */
@media(max-width:800px){#ai-final-v40{padding:72px 18px 58px!important}#ai-final-v40 h2{font-size:16vw!important;line-height:.84!important}#ai-final-v40 .aiV40Grid{display:block!important}#ai-final-v40 .aiV40Image{min-height:62svh!important;margin-bottom:30px!important}}

/* ===== v55-contact-ghost-footer-fix ===== */
/* Visueller Abschluss: Ghost-Typo nutzt die freie Höhe statt am Boden zu kleben */
.contact{min-height:108svh;}
.contactGhost{left:4vw;right:4vw;top:46%;bottom:auto;transform:translateY(-50%);font-size:clamp(84px,14vw,210px);line-height:.78;display:flex;flex-direction:column;justify-content:center;align-items:center;}
.contactGhost span{display:block;width:100%;white-space:nowrap;}
/* Copyright ist der echte Seitenabschluss – nach den Kontaktdaten */
footer{min-height:110px;height:auto;border-top:1px solid #ffffff22;display:flex;align-items:center;justify-content:space-between;padding:28px 5vw;font:9px Consolas,monospace;color:#888;background:#08090c;}
@media(max-width:800px){
 .contact{min-height:105svh;padding-bottom:4vh;}
 .contactGhost{top:53%;left:5vw;right:5vw;font-size:17vw;line-height:.82;letter-spacing:-.075em;}
 .contactGhost span{white-space:nowrap;}
 footer{min-height:105px;padding:28px 5vw;}
}

/* ===== v56-spacing-final ===== */
/* V56: Abschluss-Typografie füllt den Parallaxraum in drei Zeilen */
.contact{min-height:100svh!important;padding-top:3vh!important;padding-bottom:3vh!important;}
.contactGhost{
  top:61%!important;left:7vw!important;right:7vw!important;
  font-size:clamp(78px,12.5vw,190px)!important;line-height:.76!important;
  letter-spacing:-.07em!important;gap:.13em!important;
}
.contactGhost span{width:100%!important;text-align:center!important;white-space:nowrap!important;}
/* Heller Über-mich/Zeitreise-Bereich: verschenkte Kopfhöhe entfernen */
.about{padding-top:6vh!important;padding-bottom:8vh!important;}
.about>.label{margin-bottom:0!important;}
.aboutgrid{margin-top:2.5vh!important;}
.journey{margin-top:0!important;}
@media(max-width:800px){
 .contact{min-height:100svh!important;padding-top:2vh!important;padding-bottom:2vh!important;}
 .contactGhost{top:62%!important;left:8vw!important;right:8vw!important;font-size:18vw!important;line-height:.78!important;gap:.20em!important;letter-spacing:-.07em!important;}
 .about{padding-top:5vh!important;padding-bottom:6vh!important;}
 .aboutgrid{margin-top:1.5vh!important;}
 .journey{margin-top:0!important;padding-top:28px!important;}
}

/* ===== v59-contact-statement-parallax ===== */
/* V59 – klare lesbare zweite Parallax-Ebene statt fragmentierter Typografie */
.contact{overflow:hidden!important;position:relative!important;}
.contactEcho{
 position:absolute;z-index:1;left:5vw;right:5vw;top:78%;pointer-events:none;
 display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.20em;
 font:700 clamp(30px,5.4vw,82px)/.92 Arial,Helvetica,sans-serif;
 letter-spacing:-.045em;text-align:center;text-transform:uppercase;
 color:rgba(244,242,235,.16);-webkit-text-stroke:1px rgba(244,242,235,.10);
 opacity:1;will-change:transform;
}
.contactEcho span{display:block;width:100%;white-space:normal;}
.contactEcho span:last-child{color:rgba(215,255,95,.15);-webkit-text-stroke-color:rgba(215,255,95,.13);}
@media(max-width:800px){
 .contact{min-height:108svh!important;}
 .contactEcho{top:78%;left:8vw;right:8vw;font-size:8.4vw;line-height:.98;gap:.34em;letter-spacing:-.035em;}
}

/* ===== v60-contact-typo-hierarchy ===== */
/* V60 – klare Hierarchie: ETWAS/DAS/BLEIBT kleiner + höher, Statement frei lesbar */
.contactGhost{top:55%!important;font-size:clamp(54px,8.5vw,132px)!important;line-height:.80!important;gap:.16em!important;opacity:.72!important;}
.contactEcho{top:79%!important;z-index:2!important;}
@media(max-width:800px){
 .contactGhost{top:53%!important;left:16vw!important;right:16vw!important;font-size:11.5vw!important;line-height:.82!important;gap:.12em!important;letter-spacing:-.055em!important;opacity:.66!important;}
 .contactEcho{top:78%!important;left:7vw!important;right:7vw!important;font-size:8.2vw!important;line-height:1.02!important;gap:.42em!important;}
}

/* ===== v63-contact-composition-fix ===== */
/* V63 – nicht mehr künstlich füllen: Abschluss auf seinen echten Inhalt kürzen */
#contact.contact{
  min-height:0!important;
  height:auto!important;
  padding:8vh 5vw 10vh!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:hidden!important;
}
#contact .contactGhost,#contact .contactEcho{display:none!important;}
#contact .inner{
  width:min(1180px,92vw)!important;
  margin:0 auto!important;
  transform:none!important;
  padding:2vh 0 4vh!important;
}
#contact .rings{
  width:min(68vw,900px)!important;
  top:50%!important;left:50%!important;
  transform:translate(-50%,-50%)!important;
  opacity:.72!important;
}
@media(max-width:800px){
 #contact.contact{padding:6vh 5vw 7vh!important;}
 #contact .inner{padding:1vh 0 3vh!important;}
 #contact .rings{width:92vw!important;top:50%!important;}
 #kontakt-final-v44{padding-top:8vh!important;}
}

/* ===== v81-professional-footer ===== */
/* V81 — ruhiger, professioneller Seitenabschluss */
.contactV81{
  position:relative;
  background:#090a0d;
  color:#f3f1eb;
  padding:clamp(76px,10vh,130px) 5vw clamp(64px,9vh,110px);
  overflow:hidden;
}
.contactV81::before{
  content:"";
  position:absolute;
  left:5vw;
  top:0;
  width:clamp(64px,9vw,128px);
  height:3px;
  background:#c7ff52;
}
.contactV81Inner{width:min(1180px,90vw);margin:0 auto;}
.contactV81Top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  margin-bottom:clamp(48px,8vh,90px);
  font:700 11px/1.2 Consolas,Monaco,monospace;
  letter-spacing:.18em;
  text-transform:uppercase;
}
.contactV81Kicker{color:#c7ff52;}
.contactV81Place{color:#777b82;}
.contactV81 h2{
  margin:0;
  max-width:1080px;
  font:900 clamp(62px,10.3vw,152px)/.79 Arial,Helvetica,sans-serif;
  letter-spacing:-.07em;
  text-transform:uppercase;
}
.contactV81 h2 span{color:#c7ff52;}
.contactV81Lead{
  max-width:700px;
  margin:clamp(34px,5vh,58px) 0 0;
  color:#a7a9ae;
  font:500 clamp(18px,2vw,24px)/1.45 Arial,Helvetica,sans-serif;
}
.contactV81Links{
  margin-top:clamp(52px,8vh,92px);
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
}
.contactV81Link{
  position:relative;
  min-height:152px;
  padding:25px 28px 27px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:2px;
  display:grid;
  grid-template-columns:1fr auto;
  grid-template-rows:auto 1fr;
  align-items:end;
  transition:border-color .25s ease,background .25s ease,transform .25s ease;
}
.contactV81Link:hover{
  border-color:#c7ff52;
  background:rgba(199,255,82,.035);
  transform:translateY(-3px);
}
.contactV81Meta{
  grid-column:1/3;
  align-self:start;
  color:#777b82;
  font:700 10px/1 Consolas,Monaco,monospace;
  letter-spacing:.19em;
}
.contactV81Link strong{
  overflow-wrap:anywhere;
  font:700 clamp(20px,2.6vw,34px)/1.05 Arial,Helvetica,sans-serif;
  letter-spacing:-.035em;
}
.contactV81Link b{
  color:#c7ff52;
  font:400 clamp(30px,3vw,46px)/1 Arial,Helvetica,sans-serif;
}

/* Nur EIN Footer: Absender + Rechtliches. Alte globale Footer-Regeln gezielt überstimmen. */
footer.hsLegal73.v81FinalFooter{
  min-height:0!important;
  height:auto!important;
  position:relative!important;
  z-index:20!important;
  margin:0!important;
  padding:34px 5vw 38px!important;
  border:0!important;
  border-top:1px solid rgba(255,255,255,.10)!important;
  background:#07080a!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:38px!important;
  color:#8d9096!important;
  text-transform:none!important;
  letter-spacing:normal!important;
  font-family:Arial,Helvetica,sans-serif!important;
}
.v81FooterBrand{display:flex;flex-direction:column;gap:6px;min-width:0;}
.v81FooterBrand strong{
  color:#f3f1eb;
  font:800 20px/1 Arial,Helvetica,sans-serif;
  letter-spacing:.025em;
}
.v81FooterBrand span{
  color:#757980;
  font:700 10px/1.35 Consolas,Monaco,monospace;
  letter-spacing:.11em;
  text-transform:uppercase;
}
.v81FooterRight{
  display:flex!important;
  flex-wrap:wrap;
  justify-content:flex-end;
  align-items:center;
  gap:10px 22px!important;
}
.v81FooterRight .v81Copyright,
footer.hsLegal73.v81FinalFooter a{
  color:#8d9096!important;
  font:700 10px/1.2 Consolas,Monaco,monospace!important;
  letter-spacing:.11em!important;
  text-transform:uppercase!important;
}
footer.hsLegal73.v81FinalFooter a:hover{color:#c7ff52!important;}

@media(max-width:800px){
  .contactV81{padding:72px 5vw 68px;}
  .contactV81::before{left:5vw;width:80px;}
  .contactV81Inner{width:100%;}
  .contactV81Top{margin-bottom:52px;font-size:9px;}
  .contactV81 h2{font-size:clamp(54px,16vw,88px);line-height:.82;letter-spacing:-.065em;}
  .contactV81Lead{font-size:17px;max-width:92%;}
  .contactV81Links{grid-template-columns:1fr;margin-top:54px;gap:12px;}
  .contactV81Link{min-height:126px;padding:21px 22px 22px;}
  .contactV81Link strong{font-size:clamp(20px,6vw,28px);}
  footer.hsLegal73.v81FinalFooter{
    padding:30px 5vw 32px!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    gap:26px!important;
  }
  .v81FooterBrand strong{font-size:19px;}
  .v81FooterBrand span{font-size:9px;line-height:1.5;}
  .v81FooterRight{justify-content:flex-start!important;gap:10px 18px!important;}
}
@media(max-width:430px){
  .contactV81Top{align-items:flex-start;flex-direction:column;gap:8px;}
  .contactV81 h2{font-size:15.4vw;}
}

/* V87 — Erlebnis-Seite des Vergleichsreglers lebt wirklich. */
.web85Compare .slider{isolation:isolate;--slide-x:.5;--xp-x:55%;--xp-y:42%}
.web85Compare .before{z-index:1}
.web85Compare .after{z-index:2;overflow:hidden;background:
 radial-gradient(circle at var(--xp-x) var(--xp-y),rgba(211,255,86,.30) 0 5%,rgba(132,106,255,.48) 13%,rgba(70,49,143,.30) 28%,transparent 48%),
 radial-gradient(circle at 68% 30%,rgba(95,74,255,.35),transparent 28%),
 linear-gradient(135deg,#08090d 0%,#121020 45%,#08090c 100%);
 transition:background-position .18s linear}
.web85Compare .after:before{content:"";position:absolute;inset:-25%;background:
 repeating-radial-gradient(circle at 50% 50%,rgba(255,255,255,.16) 0 1px,transparent 1.5px 18px);
 opacity:.18;mix-blend-mode:screen;animation:xpDrift 14s linear infinite;transform-origin:52% 47%}
.web85Compare .after:after{content:"";position:absolute;width:58%;aspect-ratio:1;border-radius:50%;left:50%;top:48%;transform:translate(-50%,-50%) scale(1);background:radial-gradient(circle at 36% 30%,rgba(255,255,255,.95),rgba(194,255,67,.34) 11%,rgba(110,83,255,.34) 30%,rgba(40,28,82,.12) 52%,transparent 70%);filter:blur(2px);box-shadow:0 0 90px rgba(125,91,255,.36);animation:xpPulse 4.8s ease-in-out infinite;pointer-events:none}
.web85Compare .after strong{position:relative;z-index:5;text-shadow:0 8px 40px rgba(0,0,0,.55);animation:xpTextFloat 5.4s ease-in-out infinite;will-change:transform,filter}
.experienceField{position:absolute;inset:0;z-index:3;pointer-events:none;overflow:hidden;perspective:700px}
.xpOrb{position:absolute;border-radius:50%;filter:blur(1px);opacity:.75;mix-blend-mode:screen;will-change:transform}
.xpOrbA{width:180px;height:180px;left:13%;top:16%;background:radial-gradient(circle at 35% 30%,#fff,rgba(189,255,58,.7) 8%,rgba(91,63,255,.35) 42%,transparent 70%);animation:xpOrbA 8s ease-in-out infinite}
.xpOrbB{width:110px;height:110px;right:10%;bottom:13%;background:radial-gradient(circle at 35% 30%,#fff,rgba(105,233,255,.7) 10%,rgba(106,76,255,.35) 45%,transparent 72%);animation:xpOrbB 10s ease-in-out infinite}
.xpOrbC{width:70px;height:70px;right:30%;top:12%;background:radial-gradient(circle,#c8ff40,rgba(200,255,64,.15) 45%,transparent 70%);animation:xpOrbC 7s ease-in-out infinite}
.xpParticle{position:absolute;width:4px;height:4px;border-radius:50%;background:#fff;box-shadow:0 0 15px #b9ff38;opacity:.62;animation:xpParticle 6s ease-in-out infinite}
.xpParticle.p1{left:16%;top:70%;animation-delay:-.8s}.xpParticle.p2{left:26%;top:24%;animation-delay:-2.1s}.xpParticle.p3{left:39%;top:78%;animation-delay:-4.5s}.xpParticle.p4{left:54%;top:17%;animation-delay:-1.3s}.xpParticle.p5{left:68%;top:68%;animation-delay:-3.8s}.xpParticle.p6{left:78%;top:34%;animation-delay:-5.2s}.xpParticle.p7{left:87%;top:72%;animation-delay:-2.9s}.xpParticle.p8{left:61%;top:48%;animation-delay:-.2s}
.experienceTag{position:absolute;z-index:6;bottom:22px;left:50%;transform:translateX(-50%);white-space:nowrap;font:9px Consolas,monospace;letter-spacing:.18em;color:rgba(255,255,255,.7)}
.web85Compare .slider.is-dragging .after:after{animation-duration:2.1s;filter:blur(0);box-shadow:0 0 120px rgba(185,255,56,.35),0 0 190px rgba(110,79,255,.35)}
.web85Compare .slider.is-dragging .after strong{filter:drop-shadow(0 0 16px rgba(185,255,56,.25))}
@keyframes xpPulse{0%,100%{transform:translate(-50%,-50%) scale(.92);opacity:.72}50%{transform:translate(-50%,-50%) scale(1.08);opacity:1}}
@keyframes xpDrift{to{transform:rotate(360deg) scale(1.06)}}
@keyframes xpTextFloat{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,-9px,28px)}}
@keyframes xpOrbA{0%,100%{transform:translate3d(0,0,0) scale(.9)}50%{transform:translate3d(46px,-28px,80px) scale(1.16)}}
@keyframes xpOrbB{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(-42px,-22px,60px) scale(1.15)}}
@keyframes xpOrbC{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(-35px,35px,90px) scale(.75)}}
@keyframes xpParticle{0%,100%{transform:translate3d(0,10px,0) scale(.65);opacity:.16}45%{opacity:.88}50%{transform:translate3d(20px,-26px,50px) scale(1.4)}75%{opacity:.35}}
@media (max-width:700px){
 .experienceTag{font-size:7px;letter-spacing:.11em;bottom:12px}
 .xpOrbA{width:120px;height:120px}.xpOrbB{width:86px;height:86px}.xpOrbC{width:50px;height:50px}
 .web85Compare .after:after{width:82%}
}
@media (prefers-reduced-motion:reduce){.web85Compare .after:before,.web85Compare .after:after,.web85Compare .after strong,.xpOrb,.xpParticle{animation:none!important}}

/* ===== v89-layout-language-slider-fix ===== */
\n/* V89 — centred work gate, German dark video bridge, unmistakable slider handle */\n.workGate .gateHead{\n  display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;\n  text-align:center!important;max-width:1080px!important;margin:0 auto clamp(48px,6vh,78px)!important;\n}\n.workGate .gateHead>span{align-self:auto!important;margin:0 0 clamp(24px,3vh,38px)!important;color:#858585!important}\n.workGate .gateHead h2{font-size:clamp(76px,11vw,168px)!important;line-height:.77!important;letter-spacing:-.075em!important;margin:0!important}\n.workGate .gateHead h2 i{\n  display:block!important;font-style:normal!important;color:#c7ff52!important;-webkit-text-stroke:0!important;\n  text-shadow:0 0 40px rgba(199,255,82,.06)!important;\n}\n.workGate .gateHead p{\n  max-width:720px!important;margin:clamp(28px,3.5vh,44px) auto 0!important;text-align:center!important;\n  font-size:clamp(16px,1.35vw,21px)!important;line-height:1.5!important;color:#9a9a9a!important;\n}\n\n/* Keep the video philosophy panel in the same dark visual language as the site. */\n.videoMotionWrap .split{\n  background:#090a0d!important;color:#f2f1ec!important;border-top:1px solid #ffffff12!important;border-bottom:1px solid #ffffff12!important;\n}\n.videoMotionWrap .split .eyebrow{color:#c7ff52!important;opacity:.72!important}\n.videoMotionWrap .split h2{color:#f2f1ec!important}\n.videoMotionWrap .split p{color:#aaa7a4!important}\n\n/* Make the comparison control impossible to miss. */\n.web85Compare .slider .handle{width:4px!important;background:#c7ff52!important;box-shadow:0 0 24px rgba(199,255,82,.4)!important}\n.web85Compare .slider .handle:after{\n  content:"↔"!important;width:88px!important;height:88px!important;background:#c7ff52!important;color:#090a0d!important;\n  font-size:34px!important;font-weight:900!important;border:5px solid #f4f4ef!important;box-shadow:0 12px 38px #0008,0 0 0 10px #c7ff5220!important;\n}\n.web85Compare .slider .handle:before{\n  content:"ZIEH MICH"!important;position:absolute!important;z-index:8!important;left:50%!important;top:calc(50% + 62px)!important;\n  transform:translateX(-50%)!important;white-space:nowrap!important;background:#090a0ddd!important;color:#c7ff52!important;\n  border:1px solid #c7ff5277!important;border-radius:999px!important;padding:8px 12px!important;\n  font:700 10px/1 Consolas,monospace!important;letter-spacing:.16em!important;pointer-events:none!important;\n}\n@media(max-width:800px){\n  .workGate .gateHead{margin-bottom:42px!important}\n  .workGate .gateHead h2{font-size:clamp(64px,18vw,104px)!important;line-height:.8!important}\n  .workGate .gateHead p{font-size:16px!important;padding:0 2vw!important}\n  .web85Compare .slider .handle:after{width:76px!important;height:76px!important;font-size:29px!important;border-width:4px!important}\n  .web85Compare .slider .handle:before{top:calc(50% + 54px)!important;font-size:9px!important;padding:7px 10px!important}\n}\n

/* ===== v92-balanced-layout-pass ===== */
/* V92 — less left-heavy, calmer mobile rhythm, clearer emphasis */

/* --- VIDEO bridge: keep "Eine Bildsprache" in the dark system --- */
.videoMotionWrap .split{
  background:#090a0d!important;
  color:#f2f1ec!important;
  border-top:1px solid rgba(255,255,255,.08)!important;
  border-bottom:1px solid rgba(255,255,255,.08)!important;
}
.videoMotionWrap .split>div{
  width:min(1040px,88vw)!important;
  margin:0 auto!important;
}
.videoMotionWrap .split .eyebrow{color:#c7ff52!important;opacity:.76!important}
.videoMotionWrap .split h2{color:#f2f1ec!important}
.videoMotionWrap .split p{color:#aaa7a4!important;max-width:760px!important}

/* --- Workgate / comparison: smaller, cleaner, centered --- */
.web85Compare{
  padding:clamp(72px,8vw,120px) 0 clamp(84px,9vw,132px)!important;
}
.web85Compare .compareInner{
  width:min(1120px,90vw)!important;
  margin:0 auto!important;
  text-align:center!important;
}
.web85Compare .label{
  display:block!important;
  margin:0 auto 18px!important;
  color:#98b12d!important;
}
.web85Compare h2{
  margin:0 auto 18px!important;
  max-width:820px!important;
  font-size:clamp(42px,5.9vw,88px)!important;
  line-height:.9!important;
  letter-spacing:-.055em!important;
  text-wrap:balance!important;
}
.web85Compare h2 span{display:inline!important;color:#f2f1ec!important}
.web85Compare h2 span em{
  color:#c7ff52!important;
  font-style:normal!important;
}
.web86CompareIntro{
  margin:0 auto clamp(34px,4vw,54px)!important;
  max-width:640px!important;
  font-size:clamp(15px,1.25vw,19px)!important;
  line-height:1.55!important;
  color:#a8a4a0!important;
}

/* --- Pre-AI / Photoshop: headline less oversized --- */
.preAi80{padding-top:9vh!important}
.preAi80Head{
  grid-template-columns:.66fr 1.12fr!important;
  gap:5vw!important;
  align-items:start!important;
}
.preAi80 h2{
  margin:3.5vh 0 1.6vh!important;
  font-size:clamp(48px,7vw,106px)!important;
  line-height:.83!important;
  letter-spacing:-.06em!important;
  max-width:760px!important;
}
.preAi80Intro{
  font-size:clamp(16px,1.28vw,20px)!important;
  line-height:1.5!important;
  max-width:720px!important;
}
.preAi80Lesson{
  width:min(980px,100%)!important;
  margin:5.6vh auto 0!important;
}
.preAi80Lesson p{
  font-size:clamp(28px,3.2vw,50px)!important;
  line-height:1.08!important;
  letter-spacing:-.035em!important;
  max-width:1080px!important;
}

/* --- Journey / timeline: alternate instead of everything leaning left --- */
@media(min-width:801px){
  .journey{
    padding:clamp(48px,6vw,76px) clamp(28px,5vw,78px)!important;
  }
  .journeyHead{
    max-width:760px!important;
    margin:0 auto 42px!important;
    text-align:center!important;
  }
  .journeyHead p{margin:0 auto!important}
  .journeyList{
    padding-left:0!important;
    max-width:1100px!important;
    margin:0 auto!important;
  }
  .journeyList:before,
  .journeyList:after{
    left:50%!important;
    transform:translateX(-50%)!important;
  }
  .journeyItem{
    min-height:118px!important;
    grid-template-columns:1fr 1fr!important;
    gap:70px!important;
    align-items:center!important;
    opacity:1!important;
    transform:none!important;
    padding:10px 0!important;
  }
  .journeyItem:before{
    left:50%!important;
    top:50%!important;
    transform:translate(-50%,-50%)!important;
  }
  .journeyYear{
    text-align:right!important;
    padding-right:34px!important;
    font-size:clamp(46px,5vw,82px)!important;
  }
  .journeyEvent{
    padding-left:34px!important;
    max-width:360px!important;
  }
  .journeyItem:nth-child(even) .journeyYear{
    order:2!important;
    text-align:left!important;
    padding-right:0!important;
    padding-left:34px!important;
  }
  .journeyItem:nth-child(even) .journeyEvent{
    order:1!important;
    text-align:right!important;
    padding-left:0!important;
    padding-right:34px!important;
    margin-left:auto!important;
  }
}

/* --- Process section: white title left, green italic title right --- */
@media(min-width:801px){
  #process-v51 .reveal{
    max-width:1160px!important;
    margin:0 auto!important;
  }
  #process-v51 .big{
    max-width:1120px!important;
    margin:0 auto 34px!important;
    font-size:clamp(70px,8vw,132px)!important;
    line-height:.85!important;
  }
  #process-v51 .big i{
    display:block!important;
    width:max-content!important;
    margin-left:auto!important;
    text-align:right!important;
  }
}

/* --- Contact: less blocky, less left-heavy, fewer perceived lines --- */
.contactV81Inner{
  width:min(1140px,90vw)!important;
}
.contactV81 h2{
  max-width:950px!important;
  margin:0 0 24px!important;
  font-size:clamp(52px,8.4vw,118px)!important;
  line-height:.86!important;
  letter-spacing:-.055em!important;
  text-wrap:balance!important;
}
.contactV81 h2 span{
  display:block!important;
  width:max-content!important;
  margin-left:auto!important;
  text-align:right!important;
}
.contactV81Lead{
  max-width:760px!important;
  font-size:clamp(16px,1.22vw,20px)!important;
  color:#a9a7a3!important;
}

/* --- Mobile refinements --- */
@media(max-width:800px){
  .web85Compare .compareInner{width:min(92vw,720px)!important}
  .web85Compare h2{font-size:clamp(38px,11vw,58px)!important;max-width:100%!important}
  .web86CompareIntro{margin-bottom:30px!important}

  .preAi80Head{grid-template-columns:1fr!important;gap:18px!important}
  .preAi80 h2{font-size:clamp(44px,14vw,72px)!important;line-height:.85!important}
  .preAi80Lesson p{font-size:clamp(22px,8.1vw,34px)!important;line-height:1.05!important}

  .contactV81 h2{font-size:clamp(44px,13vw,70px)!important;line-height:.88!important}
  .contactV81 h2 span{margin-left:0!important;width:auto!important;text-align:left!important}
}

/* ===== v97-mobile-type-final ===== */
/* V97 — ONLY the two mobile typography fixes requested */

/* Desktop/contact stays visually two lines */
#contactV81Title .contactLine{display:block!important}
#contactV81Title .contactLine>span{display:inline!important}
#contactV81Title .contactLine>span:first-child::after{content:" "}
#contactV81Title .contactLineGreen{color:#c7ff52!important}

@media(max-width:800px){
  /* Fundament text: substantially smaller, not another tiny tweak */
  .preAi80Lesson p{
    font-size:18px!important;
    line-height:1.36!important;
    letter-spacing:-.012em!important;
    max-width:620px!important;
    margin:0 auto!important;
  }
  .preAi80Lesson p strong{font-weight:700!important}
  .preAi80Lesson p em{padding:0 .08em!important}

  /* Contact: intentionally four clean centered lines on mobile */
  .contactV81Inner{width:92vw!important;margin:0 auto!important}
  #contactV81Title{
    width:100%!important;
    max-width:92vw!important;
    margin:0 auto!important;
    text-align:center!important;
    font-size:clamp(38px,11.2vw,50px)!important;
    line-height:.9!important;
    letter-spacing:-.05em!important;
    overflow:visible!important;
  }
  #contactV81Title .contactLine{display:block!important;width:100%!important;text-align:center!important}
  #contactV81Title .contactLine>span{
    display:block!important;
    width:100%!important;
    text-align:center!important;
    white-space:nowrap!important;
  }
  #contactV81Title .contactLine>span:first-child::after{content:""!important}
  #contactV81Title .contactLineGreen{margin-top:.08em!important;color:#c7ff52!important}
  .contactV81Lead{max-width:92vw!important;margin:26px auto 0!important;text-align:center!important}
}

/* ===== v98-type-balance ===== */
/* V98 — final typography balance; deliberately appended LAST */
:root{--acid:#c7ff52}

/* Major section headings in this pass: centered, not left-heavy */
#work .v91GateHead,
.darkBridge .bridgeMain,
#ai-final-v40 > div{
  text-align:center!important;
}

/* 1 — VIER BEREICHE: clearly smaller */
#work .v91GateHead h2{
  align-items:center!important;
  text-align:center!important;
  line-height:.86!important;
}
#work .v91GateHead h2 strong,
#work .v91GateHead h2 em{
  font-size:clamp(52px,8.2vw,106px)!important;
  line-height:.86!important;
}
#work .v91GateHead>span,
#work .v91GateHead p{ text-align:center!important; }

/* 2 — Werkzeugkasten: same visual axis, smaller headings */
.darkBridge .bridgeMain{
  width:min(780px,88vw)!important;
  margin:0 auto!important;
}
.darkBridge .bridgeLine{
  justify-items:center!important;
  text-align:center!important;
}
.darkBridge .bridgeLine span,
.darkBridge .bridgeLine strong{
  width:auto!important;
  max-width:100%!important;
  text-align:center!important;
  margin-left:auto!important;
  margin-right:auto!important;
}
.darkBridge .bridgeLine strong{
  font-size:clamp(48px,7.3vw,94px)!important;
  line-height:.9!important;
  letter-spacing:-.055em!important;
}
.darkBridge .bridgeBottom{text-align:center!important;justify-items:center!important}

/* 3 — PROMPTING: substantially smaller + centered */
#ai-final-v40 > div > div:first-child{
  text-align:center!important;
  margin-left:auto!important;
  margin-right:auto!important;
}
#ai-final-v40 h2{
  max-width:720px!important;
  margin:0 auto 30px!important;
  text-align:center!important;
  font-size:clamp(38px,5.3vw,72px)!important;
  line-height:.9!important;
  letter-spacing:-.05em!important;
}

/* 4 — Process micro-copy above the good headline */
#process-v51 .head.label{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:18px!important;
  flex-wrap:wrap!important;
  max-width:980px!important;
  margin:0 auto 26px!important;
  padding:0 18px!important;
  text-align:center!important;
}
#process-v51 .head.label span{
  width:auto!important;
  max-width:100%!important;
  text-align:center!important;
  font-size:10px!important;
  line-height:1.35!important;
  letter-spacing:.20em!important;
}
#process-v51 .head.label span:first-child{color:var(--acid)!important}
#process-v51 .head.label span:last-child{color:#92959b!important}

/* 5 — Contact: white statement, only action word green */
#contactV81Title{
  text-align:center!important;
  margin-left:auto!important;
  margin-right:auto!important;
  color:#f3f1eb!important;
}
#contactV81Title .contactWhite,
#contactV81Title .contactWhite>span,
#contactV81Title .contactGreen{
  display:block!important;
  width:100%!important;
  text-align:center!important;
  margin:0!important;
}
#contactV81Title .contactWhite{color:#f3f1eb!important}
#contactV81Title .contactGreen{color:var(--acid)!important}
#contactV81Title .contactWhite>span{color:#f3f1eb!important}

@media(max-width:800px){
  /* VIER BEREICHE now comparable to the other section headings */
  #work .v91GateHead{width:92vw!important;margin-bottom:32px!important}
  #work .v91GateHead h2 strong,
  #work .v91GateHead h2 em{
    font-size:12.2vw!important;
    line-height:.9!important;
  }
  #work .v91GateHead>span{font-size:9px!important;margin-bottom:16px!important}
  #work .v91GateHead p{font-size:15px!important;line-height:1.42!important;max-width:330px!important;margin-top:18px!important}

  /* Werkzeugkasten — avoid BEWEGUNG spilling out */
  .darkBridge .bridgeMain{width:90vw!important}
  .darkBridge .bridgeLine{padding:12px 0 18px!important}
  .darkBridge .bridgeLine span{
    font-size:9px!important;
    letter-spacing:.16em!important;
    margin-bottom:7px!important;
    text-align:center!important;
  }
  .darkBridge .bridgeLine strong{
    font-size:12.1vw!important;
    line-height:.92!important;
    white-space:nowrap!important;
    text-align:center!important;
  }
  .darkBridge .bridgeBottom p{font-size:15px!important;max-width:330px!important}

  /* AI heading — the previous 16vw body-style no longer wins */
  #ai-final-v40{
    padding-left:18px!important;
    padding-right:18px!important;
  }
  #ai-final-v40 > div > div:first-child{
    font-size:9px!important;
    line-height:1.35!important;
    letter-spacing:.16em!important;
    text-align:center!important;
    margin-bottom:18px!important;
  }
  #ai-final-v40 h2{
    font-size:10vw!important;
    line-height:.92!important;
    max-width:92vw!important;
    text-align:center!important;
    margin:0 auto 24px!important;
  }

  /* Process labels: visually belong to headline */
  #process-v51 .head.label{
    flex-direction:column!important;
    gap:5px!important;
    margin-bottom:18px!important;
    padding:0 20px!important;
  }
  #process-v51 .head.label span{
    display:block!important;
    font-size:8.5px!important;
    line-height:1.35!important;
    letter-spacing:.18em!important;
    text-align:center!important;
  }

  /* Contact: 4 compact centered lines, only final action word acid */
  #contactV81Title{
    max-width:94vw!important;
    font-size:10.4vw!important;
    line-height:.9!important;
    letter-spacing:-.045em!important;
    overflow:visible!important;
  }
  #contactV81Title .contactWhite>span,
  #contactV81Title .contactGreen{
    white-space:nowrap!important;
  }
  #contactV81Title .contactGreen{margin-top:.08em!important}
}

@media(max-width:390px){
  #work .v91GateHead h2 strong,
  #work .v91GateHead h2 em{font-size:11.7vw!important}
  .darkBridge .bridgeLine strong{font-size:11.5vw!important}
  #ai-final-v40 h2{font-size:9.6vw!important}
  #contactV81Title{font-size:9.9vw!important}
}

/* ===== v98-contact-flow-patch ===== */
#contactV81Title{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:0!important;
}
#contactV81Title .contactWhite{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  width:100%!important;
}
#contactV81Title .contactWhite>span,
#contactV81Title .contactGreen{
  line-height:.92!important;
  min-height:0!important;
}
#contactV81Title .contactGreen{margin-top:.10em!important}

/* ===== v101-archive-center-fix ===== */
.hsArchive68{
  padding-left:max(14px, env(safe-area-inset-left));
  padding-right:max(14px, env(safe-area-inset-right));
}
.hsArchive68-head{
  width:min(1320px,100%);
  margin:0 auto;
  padding:24px 0 20px!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:end!important;
  gap:18px;
}
.hsArchive68-head>div{min-width:0}
.hsArchive68-head h2{
  max-width:100%;
  overflow-wrap:anywhere;
}
.hsArchive68-grid{
  width:min(1320px,100%);
  margin:0 auto;
  padding:34px 0 90px!important;
}
@media(max-width:800px){
  .hsArchive68{
    padding-left:max(10px, env(safe-area-inset-left));
    padding-right:max(10px, env(safe-area-inset-right));
  }
  .hsArchive68-head{
    width:min(420px,100%);
    padding:16px 0 18px!important;
    gap:10px;
    align-items:start!important;
    grid-template-columns:minmax(0,1fr) auto;
  }
  .hsArchive68-head h2{
    font-size:clamp(28px,9vw,40px)!important;
    line-height:.9!important;
    letter-spacing:-.05em!important;
  }
  .hsArchive68-head button{
    align-self:start;
    padding:11px 12px!important;
    white-space:nowrap;
    font-size:8px!important;
  }
  .hsArchive68-grid{
    width:min(420px,100%);
    padding:18px 0 70px!important;
    columns:2 145px!important;
    column-gap:10px!important;
  }
}

/* ===== v102-archive-header-unified ===== */
/* Einheitlicher, fester Archivkopf für KI / Drohne / Video */
.hsArchive68-head{
  position:sticky!important;
  top:0!important;
  z-index:50!important;
  width:min(1320px,100%)!important;
  min-height:86px!important;
  margin:0 auto!important;
  padding:18px 0 16px!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:16px!important;
  background:#08090c!important;
  border-bottom:1px solid rgba(255,255,255,.14)!important;
  box-shadow:0 10px 24px rgba(0,0,0,.18)!important;
}
.hsArchive68-head>div{min-width:0!important}
.hsArchive68-head small{display:block!important;margin-bottom:5px!important}
.hsArchive68-head h2{
  margin:0!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  max-width:100%!important;
}
.hsArchive68-head button{
  position:static!important;
  justify-self:end!important;
  align-self:center!important;
  white-space:nowrap!important;
  flex:0 0 auto!important;
}
@media(max-width:800px){
  .hsArchive68-head{
    width:100%!important;
    min-height:78px!important;
    padding:14px 0 13px!important;
    gap:10px!important;
  }
  .hsArchive68-head small{font-size:8px!important;letter-spacing:.15em!important}
  .hsArchive68-head h2{
    font-size:clamp(23px,6.8vw,31px)!important;
    line-height:.92!important;
    letter-spacing:-.045em!important;
  }
  .hsArchive68-head button{
    padding:10px 10px!important;
    font-size:7.5px!important;
    letter-spacing:.09em!important;
  }
  .hsArchive68-grid{
    padding-top:18px!important;
  }
}


/* ===== production-hardening ===== */
.skip-link{position:fixed;left:12px;top:12px;z-index:10000;padding:10px 14px;background:#c7ff52;color:#08090c;font:700 14px/1 Arial,sans-serif;transform:translateY(-180%);transition:transform .2s}
.skip-link:focus{transform:none}
html.no-js body{cursor:auto!important}
html.no-js .cursor,html.no-js .dot{display:none!important}
html.no-js .reveal{opacity:1!important;transform:none!important;filter:none!important}
html.no-js .boot{display:none!important}
@media(pointer:coarse){body{cursor:auto!important}.cursor,.dot{display:none!important}}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto!important}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .reveal{opacity:1!important;transform:none!important;filter:none!important}
}
:focus-visible{outline:2px solid #c7ff52;outline-offset:4px}