/* OKNXT Unterseite Über uns (texte.md Abschnitt 6). Baut auf site.css, abschnitte.css und agenten-seite.css auf.
   Grundfassung ohne Bewegung ist vollständig lesbar; ueber-uns-seite.js schaltet die Szenen an. */

/* ---------- U1 · Einstieg ---------- */
.ue-start{position:relative;padding:clamp(28px,5vh,64px) var(--seitenrand) 0}
.ue-start-innen{max-width:var(--ab-breite);margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(24px,4vw,64px);align-items:center;min-height:calc(100svh - var(--oben-hoehe,100px) - 40px)}
.ue-start .h1{max-width:14ch;font-size:clamp(2.5rem,5vw,4.6rem)}
.ue-start .einstieg-aktionen{display:flex;align-items:center;flex-wrap:wrap;gap:24px;margin-top:36px}
.ue-js .ue-start-text>*{opacity:0;transform:translateY(24px);transition:opacity .8s ease,transform 1s cubic-bezier(.2,.8,.2,1)}
.ue-js .ue-an .ue-start-text>*{opacity:1;transform:none}
.ue-an .ue-start-text>:nth-child(2){transition-delay:.1s}.ue-an .ue-start-text>:nth-child(3){transition-delay:.25s}.ue-an .ue-start-text>:nth-child(4){transition-delay:.4s}

.ue-duo{position:relative;width:100%;max-width:640px;justify-self:end;padding-top:64px;--mx:0;--my:0}
.ue-duo-feld{position:relative;aspect-ratio:1200/913}
.ue-portal{position:absolute;left:50%;top:44%;width:100%;aspect-ratio:1;transform:translate(-50%,-50%) translate(calc(var(--mx) * -10px),calc(var(--my) * -10px))}
.ue-portal i{position:absolute;inset:0;border-radius:50%;border:1px solid rgba(143,164,255,.22);transition:opacity 1s ease,transform 1.4s cubic-bezier(.2,.8,.2,1)}
.ue-portal i:nth-child(2){inset:9%;border-color:rgba(92,203,255,.28);transition-delay:.12s}
.ue-portal i:nth-child(3){inset:18%;border:0;background:conic-gradient(from 0deg,transparent 0 62%,rgba(0,180,249,.9) 78%,rgba(155,5,254,.95) 88%,transparent 90%);-webkit-mask:radial-gradient(circle,transparent 63%,#000 64.5%,#000 66%,transparent 67.5%);mask:radial-gradient(circle,transparent 63%,#000 64.5%,#000 66%,transparent 67.5%);transition-delay:.24s;filter:drop-shadow(0 0 8px rgba(47,107,255,.9))}
.ue-portal-kern{position:absolute;inset:22%;border-radius:50%;background:radial-gradient(circle at 50% 45%,rgba(120,110,255,.55),rgba(47,107,255,.22) 45%,transparent 70%);filter:blur(10px);transition:opacity 1.6s ease .3s}
.ue-js .ue-portal i,.ue-js .ue-portal-kern{opacity:0;transform:scale(.6)}
.ue-js .ue-an .ue-portal i,.ue-js .ue-an .ue-portal-kern{opacity:1;transform:none}
.ue-an .ue-portal i:nth-child(3){animation:ue-dreh 7s linear infinite}
@keyframes ue-dreh{to{transform:rotate(1turn)}}
/* Lichtpunkt in der Mitte: zündet, die Teilchen strömen heraus, danach Druckwellen */
.ue-funke{position:absolute;left:50%;top:50%;width:14px;height:14px;margin:-7px;border-radius:50%;background:#fff;box-shadow:0 0 24px 8px #5CCBFF,0 0 90px 34px rgba(47,107,255,.55);opacity:0;transform:scale(0);pointer-events:none}
.ue-an .ue-funke{animation:ue-funke 1s cubic-bezier(.2,1.4,.4,1) .15s forwards}
.ue-geformt .ue-funke{animation:ue-funke-aus .5s ease forwards}
@keyframes ue-funke{60%{opacity:1;transform:scale(2.2)}to{opacity:1;transform:scale(1.2)}}
@keyframes ue-funke-aus{from{opacity:1;transform:scale(1.2)}to{opacity:0;transform:scale(4)}}
.ue-welle{position:absolute;inset:28%;border-radius:50%;border:2px solid #8FDCFF;box-shadow:0 0 30px rgba(92,203,255,.6),inset 0 0 30px rgba(92,203,255,.4);opacity:0;pointer-events:none}
.ue-geformt .ue-welle{animation:ue-druck 1.5s cubic-bezier(.15,.8,.3,1) forwards}
.ue-geformt .ue-welle+.ue-welle{animation-delay:.22s;border-color:#C495FF}
@keyframes ue-druck{from{opacity:1;transform:scale(.25)}to{opacity:0;transform:scale(2)}}
.ue-duo-ebene{position:absolute;inset:0;filter:drop-shadow(0 0 36px rgba(47,107,255,.4));transform:translate(calc(var(--mx) * 14px),calc(var(--my) * 8px))}
.ue-duo-bild{display:block;width:100%;height:100%;object-fit:contain;-webkit-mask:linear-gradient(180deg,#000 80%,transparent 98%);mask:linear-gradient(180deg,#000 80%,transparent 98%)}
.ue-js .ue-duo-bild{opacity:0}
.ue-js .ue-geformt .ue-duo-bild{opacity:1;transition:opacity .9s ease;animation:ue-aufblitzen 1.4s ease}
@keyframes ue-aufblitzen{from{filter:brightness(2.2) saturate(.4)}to{filter:none}}
.ue-teilchen{position:absolute;left:-20%;top:-20%;width:140%;height:140%;pointer-events:none;z-index:2;transition:opacity 1s ease .2s}
.ue-geformt .ue-teilchen{opacity:0}
/* Namen über den Köpfen, mit kurzer Linie nach unten */
.ue-name{position:absolute;top:-58px;margin:0;display:flex;flex-direction:column;gap:2px;padding:8px 14px;border-radius:14px;background:color-mix(in srgb,var(--panel) 82%,transparent);border:1px solid var(--linie-stark);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transition:opacity .6s ease .5s,transform .8s cubic-bezier(.2,1.3,.4,1) .5s;z-index:3}
.ue-name::after{content:"";position:absolute;top:100%;width:1px;height:22px;background:linear-gradient(180deg,rgba(143,220,255,.8),transparent)}
.ue-name b{font-weight:600;font-size:.95rem}
.ue-name span{font-size:.68rem;color:var(--cyan)}
.ue-name-e{left:6%}.ue-name-e::after{left:42%}
.ue-name-a{right:4%;top:-44px;transition-delay:.65s}.ue-name-a::after{right:40%}
.ue-js .ue-name{opacity:0;transform:translateY(-12px)}
.ue-js .ue-geformt .ue-name{opacity:1;transform:none}
/* Zahlen als Reihe unter dem Foto, nicht auf den Personen */
.ue-zahlen{list-style:none;margin:-30px 0 0;padding:0;position:relative;z-index:3;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.ue-zahl{display:flex;flex-direction:column;padding:14px 16px;border-radius:18px;background:linear-gradient(160deg,rgba(28,33,48,.92),rgba(17,20,28,.88));border:1px solid rgba(143,164,255,.25);box-shadow:0 20px 50px -20px rgba(0,0,0,.8),0 0 30px -10px rgba(47,107,255,.5);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);transition:opacity .5s ease,transform .8s cubic-bezier(.2,1.5,.4,1)}
.ue-zahl b{font-size:clamp(1.5rem,2.2vw,2.1rem);font-weight:600;letter-spacing:-.03em;line-height:1.05;display:flex;align-items:center;gap:6px;font-variant-numeric:tabular-nums}
.ue-zahl>span{font-size:.8rem;color:var(--text-2)}
.ue-zahl-2{transition-delay:.15s}.ue-zahl-3{transition-delay:.3s}
.ue-js .ue-zahl{opacity:0;transform:translateY(24px) scale(.9)}
.ue-js .ue-geformt .ue-zahl{opacity:1;transform:none}
.ue-stern svg{width:.8em;height:.8em;fill:#FFC94D;filter:drop-shadow(0 0 6px rgba(255,201,77,.6))}

/* ---------- U2 · Geschichte ---------- */
.ue-ge-buehne{max-width:var(--ab-breite);margin:0 auto;position:relative}
.ue-ge-kopf{margin-bottom:clamp(28px,4vw,48px)}
.ue-ge-raster{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,600px);grid-template-rows:auto 1fr;column-gap:clamp(32px,5vw,80px);align-items:start}
.ue-jahr{grid-area:1/1;margin:0 0 6px;font-size:clamp(5rem,11vw,10rem);font-weight:600;line-height:.95;letter-spacing:-.06em;font-variant-numeric:tabular-nums;background:linear-gradient(100deg,#5CCBFF,#8FA4FF 40%,#C495FF);-webkit-background-clip:text;background-clip:text;color:transparent;position:relative}
.ue-jahr::after{content:"";position:absolute;left:0;bottom:-6px;width:min(320px,70%);height:2px;background:var(--verlauf);border-radius:2px;opacity:.6}
.ue-stationen,.ue-st{display:contents}
.ue-st-text{grid-area:2/1;align-self:start;padding-top:30px;transition:opacity .5s ease,transform .7s cubic-bezier(.2,.8,.2,1)}
.ue-st-text h3{font-size:clamp(1.5rem,2.2vw,2rem);margin-bottom:14px}
.ue-st-text p:not(.ue-st-jahr){color:var(--text-2);max-width:46ch;margin:0;font-size:1.08rem}
.ue-st-jahr{display:none}
.ue-sz{grid-area:1/2/3/3;position:relative;height:420px;border-radius:var(--radius-gross);border:1px solid var(--linie-stark);background:radial-gradient(70% 60% at 50% 40%,rgba(80,70,200,.22),transparent 70%),linear-gradient(180deg,var(--panel-2),var(--panel));box-shadow:var(--schatten);overflow:hidden;transition:opacity .5s ease,transform .7s cubic-bezier(.2,.8,.2,1)}
/* Ohne Anheften (kein JS): alle Stationen untereinander wie auf dem Handy */
.ue-geschichte:not(.ue-gepinnt) .ue-ge-raster{display:block}
.ue-geschichte:not(.ue-gepinnt) .ue-jahr,.ue-geschichte:not(.ue-gepinnt) .ue-leiste{display:none}
.ue-geschichte:not(.ue-gepinnt) .ue-stationen{display:flex;flex-direction:column;gap:72px}
.ue-geschichte:not(.ue-gepinnt) .ue-st{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,600px);column-gap:clamp(32px,5vw,80px);align-items:center}
.ue-geschichte:not(.ue-gepinnt) .ue-st-text,.ue-geschichte:not(.ue-gepinnt) .ue-sz{grid-area:auto}
.ue-geschichte:not(.ue-gepinnt) .ue-st-jahr{display:block;margin:0 0 6px;font-size:clamp(3.4rem,6vw,5rem);font-weight:600;letter-spacing:-.05em;line-height:1;background:var(--verlauf);-webkit-background-clip:text;background-clip:text;color:transparent}
/* Angeheftet (Desktop): immer nur eine Station sichtbar */
.ue-gepinnt .ue-st-text,.ue-gepinnt .ue-sz{opacity:0;transform:translateY(26px);pointer-events:none}
.ue-gepinnt .ue-st.an .ue-st-text,.ue-gepinnt .ue-st.an .ue-sz{opacity:1;transform:none;pointer-events:auto}
.ue-gepinnt .ue-st.an .ue-sz{transition-delay:.08s}
.ue-gepinnt .ue-ge-buehne{display:flex;flex-direction:column;padding:0}
.ue-gepinnt .ue-ge-kopf{margin-bottom:clamp(16px,3vh,40px)}

/* Leiste mit den Jahren */
.ue-leiste{position:relative;display:flex;justify-content:space-between;margin-top:clamp(28px,4vh,52px);padding:0 4px}
.ue-leiste-bahn{position:absolute;left:14px;right:14px;top:11px;height:2px;border-radius:2px;background:rgba(255,255,255,.12)}
.ue-leiste-bahn i{position:absolute;left:0;top:0;bottom:0;width:calc(var(--p,0) * 100%);border-radius:inherit;background:var(--verlauf);box-shadow:0 0 10px rgba(47,107,255,.8)}
.ue-leiste button{position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;background:none;border:0;padding:0;color:var(--text-3);font:500 .9rem/1 "JetBrains Mono",monospace;letter-spacing:.08em;cursor:pointer;transition:color .3s}
.ue-leiste button i{width:22px;height:22px;border-radius:50%;background:var(--grund);border:2px solid rgba(255,255,255,.25);transition:all .4s cubic-bezier(.2,1.4,.4,1)}
.ue-leiste button.vorbei i{border-color:var(--blau);background:var(--blau)}
.ue-leiste button.an{color:var(--text)}
.ue-leiste button.an i{border-color:#fff;background:radial-gradient(circle,#fff 30%,var(--cyan) 70%);box-shadow:0 0 0 6px rgba(0,180,249,.18),0 0 22px rgba(0,180,249,.8);transform:scale(1.15)}
.ue-leiste button:hover{color:var(--text)}

/* Szene 2014: Team wächst, ringsum wuchern Programme, die nicht miteinander reden */
.ue-sz-buero .ue-wirr,.ue-werkzeuge,.ue-team-kern{position:absolute;left:0;right:0;top:16px;bottom:70px}
.ue-wirr{width:100%;height:calc(100% - 86px)}
.ue-wirr path{fill:none;stroke:rgba(255,120,120,.55);stroke-width:1.4;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:1}
.ue-st.an .ue-wirr path{animation:en-faden 1.1s ease forwards;animation-delay:calc(3.2s + var(--n) * 160ms)}
.ue-team-kern{pointer-events:none}
.ue-team-zahl{position:absolute;left:50%;top:50%;width:84px;height:84px;margin:-42px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(circle,#1C2236,#11141C);box-shadow:0 0 0 2px rgba(143,164,255,.35),0 0 40px rgba(47,107,255,.45);z-index:2}
.ue-team-zahl b{font-size:1.9rem;font-weight:600;line-height:1;letter-spacing:-.03em;background:var(--verlauf);-webkit-background-clip:text;background-clip:text;color:transparent;font-variant-numeric:tabular-nums}
.ue-team-zahl small{font-size:.7rem;color:var(--text-2);margin-top:2px}
.ue-koepfe{position:absolute;left:50%;top:50%;width:0;height:0;z-index:1}
.ue-koepfe i{position:absolute;left:0;top:0;width:15px;height:15px;margin:-11px 0 0 -7.5px;border-radius:50%;background:var(--b);box-shadow:0 0 10px var(--b);opacity:0;transform:translate(var(--x),var(--y)) scale(0)}
.ue-koepfe i::after{content:"";position:absolute;left:50%;top:112%;width:21px;height:8px;margin-left:-10.5px;border-radius:10px 10px 3px 3px;background:var(--b);opacity:.55}
.ue-st.an .ue-koepfe i{animation:ue-kopf .45s cubic-bezier(.2,1.6,.4,1) forwards;animation-delay:calc(.35s + var(--n) * 90ms)}
@keyframes ue-kopf{to{opacity:1;transform:translate(var(--x),var(--y)) scale(1)}}
.ue-werkzeuge{list-style:none;margin:0;padding:0}
.ue-werkzeuge li{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%) scale(.7);display:grid;grid-template-columns:auto 1fr;column-gap:8px;align-items:center;width:142px;padding:8px 10px;border-radius:12px;background:var(--panel-3);border:1px solid var(--linie-stark);box-shadow:0 12px 26px rgba(0,0,0,.45);opacity:0;z-index:2}
.ue-werkzeuge svg{grid-row:1/3;width:20px;height:20px;fill:none;stroke:var(--text-2);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.ue-werkzeuge b{font-size:.8rem;font-weight:600;line-height:1.2}
.ue-werkzeuge em{font-style:normal;font-size:.7rem;line-height:1.2;color:var(--fehler);opacity:0;transition:opacity .4s ease}
.ue-st.an .ue-werkzeuge li{animation:ue-werkzeug .55s cubic-bezier(.2,1.5,.4,1) forwards;animation-delay:calc(2.3s + var(--n) * 140ms)}
@keyframes ue-werkzeug{to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
.ue-st.an .ue-werkzeuge em{opacity:1;transition-delay:calc(4s + var(--n) * 150ms)}
.ue-st.an .ue-werkzeuge li{border-color:var(--linie-stark)}
.ue-st.an .ue-werkzeuge li::after{content:"";position:absolute;inset:-1px;border-radius:inherit;border:1px solid rgba(255,120,120,.55);opacity:0;animation:ue-warn .5s ease forwards;animation-delay:calc(4s + var(--n) * 150ms)}
@keyframes ue-warn{to{opacity:1}}
.ue-bremse{position:absolute;left:22px;right:22px;bottom:18px;margin:0;display:flex;align-items:center;gap:10px;font-size:.86rem;color:var(--fehler);padding:9px 12px;border-radius:10px;background:rgba(255,90,90,.08);border:1px solid rgba(255,120,120,.25);opacity:0;transition:opacity .5s ease}
.ue-bremse i{flex:none;width:14px;height:14px;border-radius:50%;border:2px solid rgba(255,154,154,.3);border-top-color:var(--fehler);animation:ue-dreh .9s linear infinite}
.ue-st.an .ue-bremse{opacity:1;transition-delay:4.9s;animation:ue-ruckeln .5s ease 5.3s 2}
@keyframes ue-ruckeln{25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}

/* Szene 2019: das heutige OKNXT-Dashboard (Nachbau von der Startseite, Beispieldaten) */
.ue-heute{position:absolute;left:22px;top:15px;margin:0;display:flex;align-items:center;gap:8px;font-size:.68rem;color:var(--text-2);opacity:0;transition:opacity .5s ease .2s}
.ue-heute i{width:7px;height:7px;border-radius:50%;background:#3DDC84;box-shadow:0 0 8px #3DDC84}
.ue-st.an .ue-heute{opacity:1}
.ue-app{position:absolute;left:22px;right:22px;top:42px;opacity:0;transform:translateY(30px) scale(.96);transition:opacity .6s ease,transform .9s cubic-bezier(.2,.8,.2,1)}
.ue-st.an .ue-app{opacity:1;transform:none}
.ue-app .ox-rahmen{box-shadow:0 30px 60px -30px rgba(0,0,0,.9),0 20px 80px -40px rgba(47,107,255,.6)}
.ue-app .ox-kpi,.ue-app .ox-karte,.ue-app .ox-tab tbody tr{opacity:0}
.ue-st.an .ue-app .ox-kpi{animation:ue-kpi .5s cubic-bezier(.2,1.4,.4,1) forwards}
.ue-st.an .ue-app .ox-kpi:nth-child(1){animation-delay:.7s}.ue-st.an .ue-app .ox-kpi:nth-child(2){animation-delay:.82s}.ue-st.an .ue-app .ox-kpi:nth-child(3){animation-delay:.94s}.ue-st.an .ue-app .ox-kpi:nth-child(4){animation-delay:1.06s}.ue-st.an .ue-app .ox-kpi:nth-child(5){animation-delay:1.18s}.ue-st.an .ue-app .ox-kpi:nth-child(6){animation-delay:1.3s}
@keyframes ue-kpi{from{opacity:0;transform:translateY(16px) scale(.94)}to{opacity:1;transform:none}}
.ue-st.an .ue-app .ox-karte{animation:ue-kpi .6s ease 1.5s forwards}
.ue-st.an .ue-app .ox-karte+.ox-karte{animation-delay:1.7s}
.ue-app .ox-balken b{transform:scaleY(0);transform-origin:50% 100%}
.ue-st.an .ue-app .ox-balken b{animation:ue-balken .8s cubic-bezier(.2,.8,.2,1) forwards}
.ue-st.an .ue-app .ox-balken div:nth-child(1) b{animation-delay:1.9s}.ue-st.an .ue-app .ox-balken div:nth-child(2) b{animation-delay:2s}.ue-st.an .ue-app .ox-balken div:nth-child(3) b{animation-delay:2.1s}.ue-st.an .ue-app .ox-balken div:nth-child(4) b{animation-delay:2.2s}.ue-st.an .ue-app .ox-balken div:nth-child(5) b{animation-delay:2.3s}
@keyframes ue-balken{to{transform:scaleY(1)}}
.ue-st.an .ue-app .ox-tab tbody tr{animation:ue-kpi .4s ease forwards}
.ue-st.an .ue-app .ox-tab tbody tr:nth-child(1){animation-delay:2s}.ue-st.an .ue-app .ox-tab tbody tr:nth-child(2){animation-delay:2.1s}.ue-st.an .ue-app .ox-tab tbody tr:nth-child(3){animation-delay:2.2s}.ue-st.an .ue-app .ox-tab tbody tr:nth-child(4){animation-delay:2.3s}.ue-st.an .ue-app .ox-tab tbody tr:nth-child(5){animation-delay:2.4s}.ue-st.an .ue-app .ox-tab tbody tr:nth-child(6){animation-delay:2.5s}.ue-st.an .ue-app .ox-tab tbody tr:nth-child(7){animation-delay:2.6s}

/* Szene 2025: Agenten ziehen ein */
.ue-sz-ki{--r:140px}
.ue-ring{list-style:none;margin:0;padding:0}
.ue-ring li{position:absolute;left:50%;top:42%;width:0;height:0;transform:rotate(var(--w)) translateY(calc(var(--r) * -1)) rotate(calc(-1 * var(--w)))}
.ue-ring img{position:absolute;left:-26px;top:-26px;width:52px;height:52px;max-width:none;border-radius:50%;object-fit:cover;box-shadow:0 0 0 2px rgba(143,220,255,.55),0 0 20px rgba(47,107,255,.6);opacity:0;transform:scale(.2)}
.ue-st.an .ue-ring img{animation:ue-ankommen .9s cubic-bezier(.2,1.3,.4,1) forwards;animation-delay:calc(.5s + var(--n) * 120ms)}
@keyframes ue-ankommen{from{opacity:0;transform:scale(.2) rotate(-90deg)}to{opacity:1;transform:none}}
.ue-ring-bahn{position:absolute;left:50%;top:42%;width:calc(var(--r) * 2);height:calc(var(--r) * 2);margin:calc(var(--r) * -1) 0 0 calc(var(--r) * -1);border-radius:50%;border:1px dashed rgba(143,164,255,.3);opacity:0;transition:opacity .8s ease .3s}
.ue-st.an .ue-ring-bahn{opacity:1;animation:ue-dreh 40s linear infinite}
.ue-ring-kern{position:absolute;left:50%;top:42%;width:84px;height:84px;margin:-42px;border-radius:50%;padding:3px;background:var(--verlauf);box-shadow:0 0 50px rgba(47,107,255,.8);transform:scale(0);transition:transform .7s cubic-bezier(.2,1.6,.4,1) .2s}
.ue-ring-kern img{width:100%;height:100%;border-radius:50%;object-fit:cover;display:block}
.ue-st.an .ue-ring-kern{transform:none}
.ue-blase{position:absolute;margin:0;max-width:220px;padding:10px 13px;border-radius:14px 14px 14px 4px;background:var(--panel-3);border:1px solid rgba(0,180,249,.35);font-size:.8rem;line-height:1.4;box-shadow:0 14px 34px rgba(0,0,0,.5);opacity:0;transform:translateY(10px) scale(.95);transition:all .5s cubic-bezier(.2,1.3,.4,1);z-index:2}
.ue-blase b{display:block;font-size:.7rem;color:var(--cyan);margin-bottom:2px}
.ue-blase-1{left:16px;bottom:16px}
.ue-blase-2{right:16px;bottom:16px;border-color:rgba(255,176,32,.5);border-radius:14px 14px 4px 14px}
.ue-blase-2 b{color:var(--bern)}
.ue-st.an .ue-blase-1{opacity:1;transform:none;transition-delay:2s}
.ue-st.an .ue-blase-2{opacity:1;transform:none;transition-delay:2.8s}

/* Szene 2026: Punktkarte Deutschland, Welle läuft von Magdeburg aus */
.ue-sz-start{display:grid;grid-template-columns:1fr 1fr;align-items:center}
@keyframes en-faden{to{stroke-dashoffset:0}}
.ue-karte{position:relative;height:360px;aspect-ratio:.741;justify-self:center}
.ue-de{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.ue-de circle{fill:rgba(143,164,255,.22);stroke:none}
.ue-st.an .ue-de circle{animation:ue-punkt 1.4s ease forwards;animation-delay:calc(.5s + var(--d) * 1.5s)}
@keyframes ue-punkt{0%{fill:rgba(143,164,255,.22)}25%{fill:#BDEBFF}100%{fill:#2F8CFF}}
.ue-de .ue-md{fill:#fff;filter:drop-shadow(0 0 3px #5CCBFF) drop-shadow(0 0 8px #2F6BFF);animation:none!important}
.ue-karte::before,.ue-karte::after{content:"";position:absolute;left:var(--mx);top:var(--my);width:20px;height:20px;margin:-10px;border-radius:50%;border:2px solid #5CCBFF;opacity:0}
.ue-st.an .ue-karte::before{animation:ue-welle 2.4s ease-out .3s infinite}
.ue-st.an .ue-karte::after{animation:ue-welle 2.4s ease-out 1.5s infinite}
@keyframes ue-welle{from{transform:scale(.6);opacity:1}to{transform:scale(4);opacity:0}}
.ue-md-name{position:absolute;left:var(--mx);top:var(--my);transform:translate(12px,-50%);font-size:.64rem;color:#fff;padding:3px 7px;border-radius:6px;background:rgba(9,11,16,.75);border:1px solid rgba(92,203,255,.45);white-space:nowrap}
.ue-marken{display:flex;flex-direction:column;align-items:center;gap:14px;padding-right:20px;text-align:center}
.ue-yaidos{width:150px;height:auto;filter:brightness(0) invert(1);opacity:0;transform:translateY(-10px);transition:all .7s ease .3s}
.ue-plus{font-size:.7rem;color:var(--text-3);opacity:0;transition:opacity .5s ease .8s}
.ue-oknxt{position:relative;display:grid;place-items:center;padding:18px 26px;border-radius:20px;background:rgba(9,11,16,.6);border:1px solid rgba(143,164,255,.35);transform:scale(.4);opacity:0;transition:all .9s cubic-bezier(.2,1.5,.4,1) 1.1s}
.ue-oknxt img{width:170px;height:auto;position:relative;z-index:1}
.ue-oknxt i{position:absolute;inset:0;border-radius:inherit;border:2px solid #5CCBFF;opacity:0}
.ue-st.an .ue-oknxt i{animation:ue-stoss 1.6s ease-out 1.6s 2}
.ue-st.an .ue-oknxt i+i{animation-delay:2s}
@keyframes ue-stoss{from{transform:scale(1);opacity:.9}to{transform:scale(1.7,2.2);opacity:0}}
.ue-marken p{margin:6px 0 0;font-size:.72rem;color:var(--cyan);opacity:0;transition:opacity .6s ease 2.6s}
.ue-st.an .ue-yaidos,.ue-st.an .ue-plus,.ue-st.an .ue-oknxt,.ue-st.an .ue-marken p{opacity:1;transform:none}

/* ---------- U3 · Vision und Mission ---------- */
.ue-vision .ab-innen{max-width:1100px;text-align:center}
.ue-vision-satz{margin:0 auto;max-width:22ch;font-size:clamp(2.2rem,4.6vw,4.2rem);font-weight:500;line-height:1.12;letter-spacing:-.035em;text-wrap:balance}
.ue-vision-satz span{color:var(--text);transition:color .35s ease,text-shadow .35s ease}
.ue-js .ue-vision-satz span{color:rgba(246,244,238,.16)}
.ue-js .ue-vision-satz span.an{color:var(--text)}
.ue-js .ue-vision-satz span.jetzt{color:#BFE9FF;text-shadow:0 0 24px rgba(92,203,255,.7)}
.ue-mission{position:relative;max-width:820px;margin:clamp(56px,6vw,84px) auto 0;padding:clamp(28px,3vw,40px) clamp(24px,4vw,52px);border-radius:var(--radius-gross);border:1px solid var(--linie-stark);background:linear-gradient(160deg,var(--panel-2),var(--panel));box-shadow:var(--schatten);overflow:hidden;text-align:left}
.ue-mission::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:conic-gradient(from var(--w,0deg),transparent 0 70%,#00B4F9 80%,#9B05FE 90%,transparent);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:ue-umrandung 6s linear infinite}
@property --w{syntax:"<angle>";inherits:false;initial-value:0deg}
@keyframes ue-umrandung{to{--w:360deg}}
.ue-mission-licht{position:absolute;right:-80px;top:-80px;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,rgba(47,107,255,.35),transparent 70%);pointer-events:none}
.ue-mission .ak-zeile{margin-bottom:12px}
.ue-mission-text{position:relative;margin:0;font-size:clamp(1.15rem,1.6vw,1.45rem);line-height:1.5;color:var(--text)}
.ue-js .ue-mission{opacity:0;transform:translateY(30px);transition:opacity .8s ease,transform 1s cubic-bezier(.2,.8,.2,1)}
.ue-js .ue-mission.ue-sichtbar{opacity:1;transform:none}

/* ---------- U4 · Wofür wir stehen ---------- */
.ue-werte-raster{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:18px;perspective:1400px}
.ue-wert{position:relative;padding:28px 26px 30px;border-radius:var(--radius-gross);border:1px solid var(--linie-stark);background:linear-gradient(160deg,var(--panel-2),var(--panel));overflow:hidden;--lx:50%;--ly:0%;transition:border-color .3s,transform .4s cubic-bezier(.2,.8,.2,1)}
.ue-wert::before{content:"";position:absolute;inset:0;background:radial-gradient(260px circle at var(--lx) var(--ly),rgba(47,107,255,.22),transparent 60%);opacity:0;transition:opacity .3s;pointer-events:none}
.ue-wert:hover{border-color:rgba(92,203,255,.4);transform:translateY(-4px)}
.ue-wert:hover::before{opacity:1}
.ue-wert-ic{position:relative;display:grid;place-items:center;width:52px;height:52px;border-radius:16px;background:linear-gradient(140deg,rgba(0,180,249,.18),rgba(155,5,254,.18));border:1px solid rgba(143,164,255,.3);margin-bottom:22px}
.ue-wert-ic svg{width:26px;height:26px;fill:none;stroke:#8FDCFF;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.ue-wert-nr{position:absolute;right:24px;top:28px;font-size:.72rem;color:var(--text-3)}
.ue-wert h3{font-size:1.2rem;margin-bottom:10px}
.ue-wert p{margin:0;color:var(--text-2);font-size:.98rem}
.ue-js .ue-wert{opacity:0;transform:rotateX(-24deg) translateY(40px);transform-origin:50% 0}
.ue-js .ue-werte-an .ue-wert{opacity:1;transform:none;transition:opacity .6s ease,transform .9s cubic-bezier(.2,1.2,.4,1),border-color .3s;transition-delay:calc(var(--n) * 110ms)}
.ue-js .ue-werte-an .ue-wert:hover{transform:translateY(-4px);transition-delay:0s}
.ue-wert-ic svg path{stroke-dasharray:80;stroke-dashoffset:0}
.ue-js .ue-wert-ic svg path{stroke-dashoffset:80}
.ue-js .ue-werte-an .ue-wert-ic svg path{stroke-dashoffset:0;transition:stroke-dashoffset 1.2s ease;transition-delay:calc(.4s + var(--n) * 110ms)}

/* ---------- U5 · Gründer ---------- */
.ue-gp-liste{display:flex;flex-direction:column;gap:24px;max-width:1120px;margin:0 auto}
.ue-gp{position:relative;isolation:isolate;display:grid;grid-template-columns:300px minmax(0,1fr);gap:clamp(28px,4vw,64px);align-items:start;padding:clamp(26px,3vw,40px);border-radius:28px;box-shadow:var(--schatten)}
/* Kartenfläche als eigene Ebene: an der Stelle des Porträts ausgestanzt, dort sieht man den echten Seitenhintergrund */
.ue-gp::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;border:1px solid var(--linie-stark);background:radial-gradient(60% 80% at 0% 0%,rgba(80,70,200,.18),transparent 70%),linear-gradient(160deg,var(--panel-2),var(--panel));-webkit-mask:radial-gradient(circle 100px at var(--lx,190px) var(--ly,184px),transparent 99.5px,#000 100.5px);mask:radial-gradient(circle 100px at var(--lx,190px) var(--ly,184px),transparent 99.5px,#000 100.5px)}
.ue-gp-kopf{display:flex;flex-direction:column;align-items:center;text-align:center}
.ue-gp-bild{position:relative;width:200px;height:200px;margin:44px 0 22px}
/* Das Loch in der Karte: dunkler Kreis mit demselben Punktraster wie der Seitenhintergrund */
.ue-gp-loch{position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 50% 75%,rgba(47,107,255,.16),transparent 65%);box-shadow:inset 0 10px 22px rgba(0,0,0,.4),inset 0 -6px 16px rgba(92,203,255,.08),0 0 0 1px rgba(143,164,255,.28)}
.ue-gp-schnitt{position:absolute;inset:0;border-radius:50%;overflow:hidden}
/* Figur: gleicher Maßstab für beide (Kopf mittig, Oberkörper sichtbar), 44 px über den Kreis hinaus */
.ue-gp-figur{position:absolute;left:50%;top:-44px;width:240px;height:288px;max-width:none;margin-left:-120px;filter:drop-shadow(0 12px 18px rgba(0,0,0,.55))}
.ue-gp-schnitt .ue-gp-figur{top:-44px}
/* Obere Ebene: nur der Kopf, liegt über dem Ring, damit er aus dem Loch herausschaut */
.ue-gp-oben{clip-path:inset(0 27% 70% 27%);z-index:2}
.ue-gp-ring{position:absolute;inset:-9px;z-index:1;border-radius:50%;background:conic-gradient(from 0deg,transparent 0 60%,#00B4F9 78%,#9B05FE 92%,transparent);-webkit-mask:radial-gradient(circle,transparent 66%,#000 67.5%,#000 69%,transparent 70.5%);mask:radial-gradient(circle,transparent 66%,#000 67.5%,#000 69%,transparent 70.5%);animation:ue-dreh 6s linear infinite;filter:drop-shadow(0 0 6px rgba(47,107,255,.9))}
.ue-gp[data-wer="alexander"] .ue-gp-ring{animation-direction:reverse}
.ue-gp-punkt{position:absolute;left:50%;top:50%;width:0;height:0;z-index:3;animation:ue-dreh 6s linear infinite}
.ue-gp-punkt::after{content:"";position:absolute;left:-4px;top:-113px;width:8px;height:8px;border-radius:50%;background:#fff;box-shadow:0 0 12px 3px #5CCBFF}
.ue-gp[data-wer="alexander"] .ue-gp-punkt{animation-direction:reverse}
.ue-gp-kopf h3{font-size:1.6rem;letter-spacing:-.025em}
.ue-gp-rolle{margin:8px 0 16px;color:var(--text-3);font-size:.88rem;line-height:1.45}
.ue-gp .textlink svg{width:16px;height:16px;fill:currentColor;stroke:none}
.ue-gp-text{margin:0 0 14px;color:var(--text-2);font-size:1.02rem}
.ue-zitat{margin:0 0 22px;font-size:clamp(1.15rem,1.5vw,1.35rem);line-height:1.45;font-weight:500}
.ue-zitat p{margin:0}
.ue-zitat span{transition:color .4s ease;transition-delay:calc(.3s + var(--n) * 45ms)}
.ue-js .ue-zitat span{color:rgba(246,244,238,.2)}
.ue-js .ue-gp-an .ue-zitat span{color:var(--text)}
.ue-gp-stationen{list-style:none;margin:22px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:12px;position:relative}
.ue-gp-stationen::before{content:"";position:absolute;left:0;right:0;top:9px;height:2px;border-radius:2px;background:linear-gradient(90deg,var(--cyan),var(--blau),var(--violett));transform-origin:0 50%;opacity:.7}
.ue-gp-stationen li{position:relative;padding-top:26px;display:flex;flex-direction:column;gap:3px}
.ue-gp-stationen li::before{content:"";position:absolute;left:0;top:3px;width:14px;height:14px;border-radius:50%;background:var(--grund);border:2px solid #8FDCFF;box-shadow:0 0 10px rgba(92,203,255,.7)}
.ue-gp-stationen span{font-size:.68rem;color:var(--cyan)}
.ue-gp-stationen b{font-size:.95rem;font-weight:600;line-height:1.3}
.ue-gp-stationen small{font-size:.82rem;color:var(--text-3)}
.ue-js .ue-gp-stationen::before{transform:scaleX(0);transition:transform 1.4s cubic-bezier(.4,0,.2,1) .4s}
.ue-js .ue-gp-an .ue-gp-stationen::before{transform:none}
.ue-js .ue-gp-stationen li{opacity:0;transform:translateY(12px);transition:opacity .5s ease,transform .6s ease;transition-delay:calc(.6s + var(--n) * 350ms)}
.ue-js .ue-gp-an .ue-gp-stationen li{opacity:1;transform:none}
.ue-js .ue-gp-bild{transform:scale(.6) rotate(-20deg);opacity:0;transition:transform 1s cubic-bezier(.2,1.4,.4,1),opacity .6s ease}
.ue-js .ue-gp-an .ue-gp-bild{transform:none;opacity:1}

/* ---------- U4 · YAIDOS und Sorglosmakler ---------- */
.ue-fi{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(32px,5vw,80px);align-items:center}
.ue-fi+.ue-fi{margin-top:150px}
.ue-fi-sorglos{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}
.ue-fi-text .textlink{margin-top:26px}
.ue-fi-text .h2{font-size:clamp(1.9rem,3vw,2.8rem)}
/* YAIDOS-Kern: drei Umlaufbahnen speisen den Kern, Strahl zu OKNXT; Maus kippt die Szene */
.ue-kb{position:relative;height:clamp(360px,34vw,440px);border-radius:var(--radius-gross);border:1px solid var(--linie-stark);background:radial-gradient(45% 55% at 40% 50%,rgba(80,70,200,.32),transparent 70%),radial-gradient(30% 40% at 85% 50%,rgba(155,5,254,.18),transparent 70%),#07090F;box-shadow:var(--schatten);overflow:hidden;perspective:1100px}
.ue-kb::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(143,164,255,.22) 1px,transparent 1.3px);background-size:18px 18px;-webkit-mask:radial-gradient(75% 75% at 40% 50%,#000,transparent);mask:radial-gradient(75% 75% at 40% 50%,#000,transparent)}
.ue-kb-innen{position:absolute;inset:0;transform-style:preserve-3d;transform:rotateX(var(--kx,0deg)) rotateY(var(--ky,0deg));transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.ue-kb-fluss{position:absolute;inset:0;width:100%;height:100%}
.ue-kb-kern{position:absolute;left:38%;top:50%;width:0;height:0;z-index:50;transform:translateZ(40px)}
.ue-kb-glut{position:absolute;left:-90px;top:-90px;width:180px;height:180px;border-radius:50%;background:radial-gradient(circle,rgba(120,170,255,.55),rgba(47,107,255,.18) 40%,transparent 70%);animation:ue-glut 2.6s ease-in-out infinite}
@keyframes ue-glut{50%{transform:scale(1.18);opacity:.75}}
.ue-kb-wuerfel{position:absolute;left:-40px;top:-40px;width:80px;height:80px;border-radius:24px;display:grid;place-items:center;background:linear-gradient(150deg,#1A2140,#0B0E18);border:1px solid rgba(143,164,255,.55);box-shadow:0 0 0 6px rgba(47,107,255,.12),0 0 50px rgba(47,107,255,.8),inset 0 1px 0 rgba(255,255,255,.2);transform:rotate(45deg)}
.ue-kb-wuerfel img{width:46px;height:46px;transform:rotate(-45deg)}
.ue-kb-kern small{position:absolute;left:0;top:56px;transform:translateX(-50%);font-size:.66rem;color:#8FDCFF;white-space:nowrap}
.ue-kb-ziel{position:absolute;left:84%;top:50%;z-index:60;display:flex;flex-direction:column;align-items:center;gap:6px;padding:14px 18px;border-radius:16px;background:rgba(20,24,38,.92);border:1px solid rgba(196,149,255,.55);box-shadow:0 0 30px rgba(155,5,254,.35);transform:translate(-50%,-50%) translateZ(30px);transition:box-shadow 1.2s ease,border-color 1.2s ease}
.ue-kb-ziel img{width:112px;height:auto}
.ue-kb-ziel small{font-size:.62rem;color:#C495FF}
.ue-kb-ziel.trifft{box-shadow:0 0 0 4px rgba(196,149,255,.12),0 0 56px rgba(155,5,254,.6);border-color:#D9C2FF}
.ue-team{position:relative;margin:0}
.ue-team-rahmen{position:relative;border-radius:var(--radius-gross);overflow:hidden;aspect-ratio:900/548;box-shadow:var(--schatten),0 0 0 1px var(--linie-stark);transition:clip-path 1.4s cubic-bezier(.6,0,.2,1)}
.ue-team-rahmen img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 2.4s cubic-bezier(.2,.8,.2,1);filter:saturate(.85)}
.ue-team-rahmen::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(9,11,16,.8))}
.ue-team figcaption{position:absolute;left:22px;bottom:18px;display:flex;flex-direction:column;z-index:2;transition:all .7s ease 1.2s}
.ue-team figcaption b{font-size:clamp(1.6rem,2.4vw,2.2rem);font-weight:600;letter-spacing:-.03em;line-height:1.1}
.ue-team figcaption>span{font-size:.86rem;color:var(--text-2)}
.ue-js .ue-team-rahmen{clip-path:inset(14% 32% 14% 32% round 24px)}
.ue-js .ue-team-rahmen img{transform:scale(1.25)}
.ue-js .ue-team figcaption{opacity:0;transform:translateY(10px)}
.ue-js .ue-team-an .ue-team-rahmen{clip-path:inset(0 0 0 0 round 24px)}
.ue-js .ue-team-an .ue-team-rahmen img{transform:scale(1)}
.ue-js .ue-team-an figcaption{opacity:1;transform:none}
.ue-sorglos-logo{display:block;width:170px;height:auto;margin:0 0 18px;opacity:.92}
.ue-belege{margin-top:26px;display:flex;flex-direction:column;gap:18px}
.ue-sterne-zeile{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin:0}
.ue-sterne-zeile>b{font-size:2.2rem;font-weight:600;letter-spacing:-.03em;line-height:1;font-variant-numeric:tabular-nums}
.ue-sterne-zeile>span:last-child{display:block;font-size:.92rem;color:var(--text-2)}
.ue-sterne-zeile small{display:block;font-size:.76rem;color:var(--text-3)}
.ue-sterne{position:relative;display:inline-block;line-height:0}
.ue-sterne svg{width:22px;height:22px;margin-right:2px}
.ue-sterne-leer svg{fill:rgba(255,255,255,.14)}
.ue-sterne-voll{position:absolute;inset:0;white-space:nowrap;overflow:hidden;width:97%;transition:width 1.6s cubic-bezier(.4,0,.2,1) .3s}
.ue-sterne-voll svg{fill:#FFC94D;filter:drop-shadow(0 0 5px rgba(255,201,77,.6))}
.ue-js .ue-sterne-voll{width:0}
.ue-js .ue-belege-an .ue-sterne-voll{width:97%}
.ue-siegel{display:flex;align-items:center;flex-wrap:wrap;gap:14px}
.ue-siegel img{width:64px;height:64px;object-fit:contain;transition:all .7s cubic-bezier(.2,1.5,.4,1)}
.ue-siegel img:nth-of-type(1){transition-delay:1.2s}.ue-siegel img:nth-of-type(2){transition-delay:1.4s}
.ue-award{display:flex;flex-direction:column;gap:4px;padding:10px 14px;border-radius:14px;border:1px solid rgba(255,201,77,.35);background:rgba(255,201,77,.07);font-size:.66rem;color:#FFE2A0;transition:all .6s ease 1s}
.ue-award b{font:600 .9rem/1.2 "Manrope",sans-serif;letter-spacing:0;text-transform:none;color:var(--text)}
.ue-js .ue-siegel img{opacity:0;transform:scale(.5) rotate(-20deg)}
.ue-js .ue-award{opacity:0;transform:translateY(8px)}
.ue-js .ue-belege-an .ue-siegel img,.ue-js .ue-belege-an .ue-award{opacity:1;transform:none}

/* ---------- Presse: Vorschaubild nach dem Video bei IMMOBILIEN-PROFI, in OKNXT-Farben ---------- */
.ue-video{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(24px,3.4vw,48px);align-items:center;max-width:1100px;margin:0 auto;padding:clamp(14px,1.6vw,20px);border-radius:30px;border:1px solid var(--linie-stark);background:linear-gradient(160deg,var(--panel-2),var(--panel));box-shadow:var(--schatten);color:inherit;text-decoration:none;transition:border-color .3s,box-shadow .3s,transform .4s cubic-bezier(.2,.8,.2,1)}
.ue-video:hover{border-color:rgba(0,180,249,.5);box-shadow:var(--schatten),0 0 70px -10px rgba(47,107,255,.55);transform:translateY(-3px)}
.ue-vb{position:relative;aspect-ratio:16/9;border-radius:20px;overflow:hidden;container-type:inline-size;background:radial-gradient(60% 90% at 78% 70%,rgba(155,5,254,.45),transparent 70%),radial-gradient(70% 90% at 15% 30%,rgba(47,107,255,.5),transparent 70%),linear-gradient(135deg,#0B1A4A 0%,#1A1260 55%,#2B0D55 100%)}
.ue-vb::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.13) 1px,transparent 1.3px);background-size:2.2cqw 2.2cqw}
.ue-vb-licht{position:absolute;right:-10%;top:-30%;width:70%;height:120%;background:conic-gradient(from 200deg at 50% 50%,transparent,rgba(92,203,255,.18),transparent 30%);filter:blur(10px);animation:ue-dreh 18s linear infinite}
.ue-vb-oben{position:absolute;left:4cqw;right:4cqw;top:3.6cqw;display:flex;justify-content:space-between;align-items:center;gap:2cqw;z-index:3}
.ue-vb-tt{display:inline-flex;align-items:center;gap:.8cqw;padding:.9cqw 1.8cqw;border-radius:99px;background:#fff;color:#2F3BD6;font:800 1.9cqw/1 "Manrope",sans-serif;letter-spacing:.04em;text-transform:uppercase;font-style:italic;box-shadow:0 .6cqw 2cqw rgba(0,0,0,.35)}
.ue-vb-tt svg{width:2.2cqw;height:2.2cqw;fill:none;stroke:currentColor;stroke-width:2.4}
.ue-vb-chips{display:flex;gap:.8cqw}
.ue-vb-chips i{font:700 1.45cqw/1 "Manrope",sans-serif;font-style:normal;padding:.9cqw 1.6cqw;border-radius:99px;border:.15cqw solid rgba(255,255,255,.5);color:#fff;background:rgba(9,11,16,.35)}
.ue-vb-chips i:first-child{background:#fff;color:#1A1260;border-color:#fff}
.ue-vb-links{position:absolute;left:4cqw;top:12cqw;width:52%;z-index:3}
.ue-vb-marke{display:flex;align-items:center;gap:2cqw;margin:0 0 2.4cqw}
.ue-vb-logo{display:inline-flex;align-items:flex-end;gap:.8cqw;padding:1.4cqw 2cqw;border-radius:1.4cqw;background:#090B10;box-shadow:0 .8cqw 2.4cqw rgba(0,0,0,.45)}
.ue-vb-logo img{width:17cqw;height:auto}
.ue-vb-logo small{font:600 1.1cqw/1 "Manrope",sans-serif;color:#C9CCD6;margin-bottom:.2cqw}
.ue-vb-marke b{font-size:1.3cqw;color:#fff;letter-spacing:.22em}
.ue-vb-titel{margin:0;font:800 4.1cqw/1.04 "Manrope",sans-serif;letter-spacing:-.01em;text-transform:uppercase;color:#fff;text-wrap:balance}
.ue-vb-titel em{font-style:normal;background:linear-gradient(100deg,#8FDCFF,#C495FF);-webkit-background-clip:text;background-clip:text;color:transparent}
.ue-vb-unter{margin:2.2cqw 0 0;max-width:40cqw;font:500 1.55cqw/1.45 "Manrope",sans-serif;color:rgba(255,255,255,.85)}
.ue-vb-rechts{position:absolute;right:0;bottom:0;width:46%;height:72%;z-index:2}
.ue-vb-duo{position:absolute;right:-3%;bottom:0;height:100%;width:auto;max-width:none;filter:drop-shadow(0 0 3cqw rgba(92,140,255,.45));transition:transform 1.2s cubic-bezier(.2,.8,.2,1)}
.ue-video:hover .ue-vb-duo{transform:scale(1.03)}
.ue-vb-name{position:absolute;bottom:8.6cqw;display:flex;flex-direction:column;gap:.3cqw;padding:1.1cqw 1.6cqw;border-radius:1.2cqw;background:#fff;color:#141527;box-shadow:0 1cqw 3cqw rgba(0,0,0,.4)}
.ue-vb-name b{font:800 1.5cqw/1.1 "Manrope",sans-serif}
.ue-vb-name small{font:600 1.1cqw/1.1 "Manrope",sans-serif;color:#5557E6}
.ue-vb-name-e{left:4%}.ue-vb-name-a{right:3%}
.ue-vb-play{position:absolute;left:50%;top:50%;width:9cqw;height:9cqw;margin:-4.5cqw;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.95);box-shadow:0 0 0 1.2cqw rgba(255,255,255,.18),0 2cqw 4cqw rgba(0,0,0,.5);z-index:5;opacity:0;transform:scale(.8);transition:opacity .3s,transform .4s cubic-bezier(.2,1.5,.4,1)}
.ue-vb-play svg{width:3.6cqw;height:3.6cqw;fill:#141527;margin-left:.5cqw}
.ue-video:hover .ue-vb-play,.ue-video:focus-visible .ue-vb-play{opacity:1;transform:none}
.ue-vb-leiste{position:absolute;left:1.6cqw;right:1.6cqw;bottom:1.6cqw;height:5cqw;display:flex;align-items:center;gap:1.6cqw;padding:0 1.6cqw 0 0;border-radius:1cqw;background:rgba(9,11,16,.82);z-index:4}
.ue-vb-knopf{display:grid;place-items:center;width:6cqw;height:5cqw;border-radius:1cqw;background:linear-gradient(140deg,#00B4F9,#2F6BFF 50%,#9B05FE)}
.ue-vb-knopf svg{width:2.2cqw;height:2.2cqw;fill:#fff}
.ue-vb-zeit{position:relative;flex:1;height:.5cqw;border-radius:1cqw;background:rgba(255,255,255,.22);overflow:hidden}
.ue-vb-zeit i{position:absolute;left:0;top:0;bottom:0;width:0;background:var(--verlauf)}
.ue-video:hover .ue-vb-zeit i{width:38%;transition:width 2.4s ease}
.ue-vb-dauer{font-size:1.3cqw;color:#fff;letter-spacing:.06em}
.ue-video-text{display:flex;flex-direction:column;gap:14px;padding:6px clamp(8px,1.6vw,22px) 6px 0}
.ue-video-quelle{margin:0 0 12px;font-size:.72rem;color:var(--cyan)}
.ue-video-text h3{font-size:clamp(1.3rem,2vw,1.7rem);line-height:1.25}
.ue-video-text p:not(.ue-video-quelle){color:var(--text-2);margin:0 0 16px}

/* ---------- Handy und Tablet ---------- */
@media (max-width:900px){
  .ue-start-innen{grid-template-columns:1fr;min-height:0}
  .ue-duo{justify-self:center;max-width:520px;margin-top:20px}
  .ue-duo{padding-top:54px}
  .ue-zahlen{gap:8px;margin-top:-18px}
  .ue-zahl{padding:10px 11px}
  .ue-geschichte .ue-st{grid-template-columns:1fr!important}
  .ue-geschichte:not(.ue-gepinnt) .ue-stationen{gap:56px}
  .ue-st-text{padding-top:0;margin-bottom:22px}
  .ue-sz{height:380px}
  .ue-sz-start{grid-template-columns:1fr;grid-template-rows:auto auto;gap:18px;padding:22px 0 26px;height:auto}
  .ue-karte{height:230px}
  .ue-marken{padding:0 20px}
  .ue-werte-raster{grid-template-columns:1fr 1fr}
  .ue-gp{grid-template-columns:1fr}
  .ue-gp-stationen{grid-template-columns:1fr;gap:16px}
  .ue-gp-stationen::before{left:6px;right:auto;top:6px;bottom:6px;width:2px;height:auto;background:linear-gradient(180deg,var(--cyan),var(--blau),var(--violett))}
  .ue-js .ue-gp-stationen::before{transform:scaleY(0);transform-origin:50% 0}
  .ue-gp-stationen li{padding:0 0 0 28px}
  .ue-fi,.ue-fi-sorglos{grid-template-columns:1fr}
  .ue-fi-sorglos .ue-team{order:2}
  .ue-video{grid-template-columns:1fr}
  .ue-video-text{padding:8px 6px 6px}
}
@media (max-width:600px){
  .ue-sz-ki{--r:105px}
  .ue-ring img{width:42px;height:42px;left:-21px;top:-21px}
  .ue-blase{max-width:46%;font-size:.74rem}
  .ue-kb-ziel{left:82%;padding:10px 12px}
  .ue-kb-ziel img{width:74px}
  .ue-kb-wuerfel{transform:rotate(45deg) scale(.8)}
  .ue-name{padding:6px 10px;top:-50px}
  .ue-name-a{top:-40px}
  .ue-name b{font-size:.8rem}
  .ue-zahl b{font-size:1.3rem}
  .ue-zahl>span{font-size:.7rem}
  .ue-werte-raster{grid-template-columns:1fr}
  .ue-werkzeuge li{width:108px;padding:6px 7px;column-gap:6px}
  .ue-werkzeuge li:nth-child(-n+3){left:62px}
  .ue-werkzeuge li:nth-child(n+4){left:calc(100% - 62px)}
  .ue-werkzeuge svg{width:16px;height:16px}
  .ue-werkzeuge b{font-size:.7rem}
  .ue-werkzeuge em{font-size:.62rem}
  .ue-koepfe{transform:scale(.8)}
  .ue-team-zahl{transform:scale(.85)}
  .ue-bremse{font-size:.76rem}
  .ue-app{left:12px;right:12px}
}

/* ---------- Reduzierte Bewegung: alles sofort im Endzustand ---------- */
@media (prefers-reduced-motion:reduce){
  .ue-seite *,.ue-seite *::before,.ue-seite *::after{animation:none!important;transition:none!important}
  .ue-bremse,.ue-werkzeuge em,.ue-heute,.ue-app,.ue-app .ox-kpi,.ue-app .ox-karte,.ue-app .ox-tab tbody tr,.ue-ring img,.ue-ring-bahn,.ue-blase,.ue-karte>i,.ue-yaidos,.ue-plus,.ue-oknxt,.ue-marken p,.ue-fluss{opacity:1!important;transform:none!important}
  .ue-ring-kern{transform:none!important}
  .ue-wirr path{stroke-dashoffset:0}
  .ue-mission::before,.ue-gp-ring,.ue-gp-punkt{animation:none!important}
  .ue-koepfe i{opacity:1;transform:translate(var(--x),var(--y))}
  .ue-werkzeuge li{opacity:1;transform:translate(-50%,-50%)}
  .ue-app .ox-balken b{transform:none}
  .ue-de circle{fill:#2F8CFF}
  .ue-teilchen,.ue-funke,.ue-welle{display:none}
}

/* ---------- Über uns auf dem Handy (18.10.2026) ---------- */
@media (max-width:640px){
  .ue-seite{--pe-abstand:84px}
  /* Grundsätze: Symbol neben der Überschrift, Karten kompakter */
  .ue-seite .ue-wert{display:grid;grid-template-columns:40px minmax(0,1fr);column-gap:14px;align-items:center;padding:18px 18px 20px}
  .ue-seite .ue-wert-ic{width:40px;height:40px;border-radius:12px;margin:0}
  .ue-seite .ue-wert-ic svg{width:20px;height:20px}
  .ue-seite .ue-wert-nr{top:14px;right:16px}
  .ue-seite .ue-wert h3{margin:0;padding-right:22px;font-size:1.05rem}
  .ue-seite .ue-wert p{grid-column:1 / -1;margin-top:10px;font-size:.92rem}
  .ue-seite .ue-werte-raster{gap:12px}
  /* Fragen: statt Wischleiste und Chat eine Liste zum Aufklappen wie auf der Startseite */
  .ue-seite .fa-js .fa-knoepfe,.ue-seite .fa-js .fa-chat,.ue-seite .fa-js .fa-unter{display:none}
  .ue-seite .fa-js .fragen-liste{position:static;width:auto;height:auto;overflow:visible;clip:auto;margin-top:18px}
  .ue-seite .fragen-liste summary{padding:16px 0;font-size:1rem;gap:16px}
}
@media (hover:none){.ue-seite .ue-wert:hover{transform:none}}
/* Safari: overflow+border-radius schneidet Kinder mit filter eckig ab (Foto unten gerade statt rund, Feedback iPhone 18.10.2026) — Kreis per clip-path */
.ue-gp-schnitt{clip-path:circle(50% at 50% 50%);-webkit-clip-path:circle(50% at 50% 50%);-webkit-mask-image:-webkit-radial-gradient(white,black)}
/* Gründer: Figur fährt von unten durch das Loch hoch und schaut oben heraus (Feedback 18.10.2026).
   Der Kopf über dem Ring liegt in einem festen Ausschnitt (Rechteck über der Kreismitte), damit beide Ebenen gemeinsam hochfahren können. */
.ue-gp-ausblick{position:absolute;left:45px;top:-60px;width:110px;height:102px;overflow:hidden;clip-path:inset(0);z-index:2;pointer-events:none}
.ue-gp-ausblick .ue-gp-oben{clip-path:none;top:16px}
.ue-js .ue-gp-bild{transform:scale(.7);transition:transform .7s cubic-bezier(.2,1.3,.4,1),opacity .5s ease}
.ue-js .ue-gp-figur{transform:translateY(270px)}
.ue-js .ue-gp-kopf-an .ue-gp-figur{transform:none;transition:transform 1.3s cubic-bezier(.33,1.12,.5,1) .15s}
.ue-js .ue-gp-kopf-an .ue-gp-bild{transform:none;opacity:1}
@media (prefers-reduced-motion:reduce){.ue-js .ue-gp-figur{transform:none;transition:none}.ue-js .ue-gp-bild{transform:none}}
