/* Glassmorphism-Schicht (alle Seiten außer /os/) – additiv über site.css/showcase.css */
:root{--gl-bg:linear-gradient(145deg,#ffffff8f,#ffffff3d);--gl-bg-2:linear-gradient(145deg,#ffffffb3,#ffffff66);--gl-brd:#ffffffd1;--gl-hi:#fffffff5;--gl-sh:0 30px 60px -36px #54449c4d,0 1px 3px #54449c14;--gl-blur:blur(26px) saturate(1.6)}
html[data-theme=dark]{--gl-bg:linear-gradient(145deg,#ffffff12,#ffffff06);--gl-bg-2:linear-gradient(145deg,#ffffff1c,#ffffff0d);--gl-brd:#ffffff1a;--gl-hi:#ffffff1f;--gl-sh:0 30px 60px -36px #000000cc,0 1px 3px #0006}
body{background:var(--bg);position:relative}
body:before{content:"";position:fixed;inset:-10%;z-index:-1;pointer-events:none;
background:radial-gradient(50vmax 50vmax at 8% 4%,#c2b3f1cc,#0000 66%),radial-gradient(44vmax 44vmax at 94% 14%,#d9cff799,#0000 66%),radial-gradient(52vmax 52vmax at 74% 96%,#c9bdf280,#0000 66%),radial-gradient(34vmax 34vmax at 2% 82%,#e6def980,#0000 66%);
filter:blur(30px);animation:gl-drift 40s ease-in-out infinite alternate}
html[data-theme=dark] body:before{background:radial-gradient(42vmax 42vmax at 12% 8%,#6f5bc355,#0000 70%),radial-gradient(38vmax 38vmax at 88% 18%,#2a7fbf40,#0000 70%),radial-gradient(46vmax 46vmax at 70% 92%,#b0407a38,#0000 70%),radial-gradient(34vmax 34vmax at 6% 78%,#54449c4d,#0000 70%)}
@keyframes gl-drift{to{transform:translate3d(2%,-3%,0) scale(1.08)}}
.section.white,.footer{background:#0000;border-color:var(--gl-brd)}
.pt-card,.pa-card,.card,.srch-card,.st-card,.sp-card,.vt-card,.dz-card,.nx-card,.nx-app-card,.tm-pcard,.pz-card,.ct-card,.ck-card,.aud-card,.vo-box,.pz-final-box,.sh-panel,.faq details,.steps>div,.pk,.plan,.ig-pill,.nav,.menu{background:var(--gl-bg);-webkit-backdrop-filter:var(--gl-blur);backdrop-filter:var(--gl-blur);border:1px solid var(--gl-brd);box-shadow:inset 0 1px var(--gl-hi),var(--gl-sh)}
.pt-card,.pa-card,.st-card,.nx-card,.sp-card,.vt-card,.dz-card{border-radius:22px;transition:transform .45s cubic-bezier(.2,.8,.2,1),background .35s,box-shadow .35s}
.pt-card:hover,.pa-card:hover,.st-card:hover,.nx-card:hover{transform:translateY(-2px);background:var(--gl-bg-2);box-shadow:inset 0 1px var(--gl-hi),0 36px 70px -34px #54449c66}
.section .btn.ghost,.wrap .btn.ghost{background:var(--gl-bg);-webkit-backdrop-filter:var(--gl-blur);backdrop-filter:var(--gl-blur);border:1px solid var(--gl-brd);box-shadow:inset 0 1px var(--gl-hi)}
@media (prefers-reduced-motion:reduce){body:before{animation:none}.pt-card,.pa-card{transition:none}}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){:root{--gl-bg:#ffffffe6}html[data-theme=dark]{--gl-bg:#1b1b1fee}}

header.top:not(.nav){background:var(--gl-bg-2);-webkit-backdrop-filter:var(--gl-blur);backdrop-filter:var(--gl-blur);border-bottom:1px solid var(--gl-brd)}
.steps>div{border-radius:20px}
.nav,.menu{border-radius:20px}

/* Liquid-Glass (iOS 26): dünnes, klares Glas – nur feine Lichtkante, kaum Füllung, Schrift bleibt dunkel */
:root{--lq-fill:linear-gradient(160deg,#ffffff73,#ffffff1f 45%,#ffffff47);--lq-blur:blur(16px) saturate(1.8);--lq-rim:inset 0 0 0 1px #ffffffd9,inset 1px 1px 2px -1px #fffffff2,inset -1px -1px 2px -1px #ffffffa6,0 0 0 1px #54449c2e,0 6px 18px -8px #54449c4d}
html[data-theme=dark]{--lq-fill:linear-gradient(160deg,#ffffff2e,#ffffff08 45%,#ffffff1a);--lq-rim:inset 0 0 0 1px #ffffff59,inset 1px 1px 2px -1px #ffffff8c,inset -1px -1px 2px -1px #ffffff40,0 0 0 1px #00000040,0 6px 18px -8px #000000b3}
.facts>span,.nx-chip,.chips label>span,.btn,.burger{background:var(--lq-fill);-webkit-backdrop-filter:var(--lq-blur);backdrop-filter:var(--lq-blur);border:0;box-shadow:var(--lq-rim)}
.btn,.btn.ghost{color:var(--ink)}
.btn.ghost{background:linear-gradient(160deg,#ffffff8c,#ffffff26 50%,#ffffff59);box-shadow:var(--lq-rim),inset 0 0 0 1px #ffffff59}
.btn:not(.ghost){color:#fff;font-weight:700;background:linear-gradient(180deg,#ffffff2e 0%,#ffffff00 38%),linear-gradient(180deg,#0e0d14f2,#050508f7);-webkit-backdrop-filter:blur(18px) saturate(1.6);backdrop-filter:blur(18px) saturate(1.6);box-shadow:inset 0 0 0 1px #ffffff73,inset 0 1px 0 #ffffffa6,inset 1px 1px 2px -1px #ffffff99,inset -1px -1px 2px -1px #ffffff4d,0 8px 20px -10px #050508a6}
html[data-theme=dark] .btn,html[data-theme=dark] .btn.ghost{color:#fff}
html[data-theme=dark] .btn:not(.ghost){background:linear-gradient(160deg,#ffffffe6,#ffffffb3);color:#0b0b0e;box-shadow:var(--lq-rim)}
.facts>span{display:inline-flex;align-items:center;padding:9px 16px;border-radius:999px}
.btn,.burger{transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .35s,background .35s}
.btn:hover,.burger:hover{transform:translateY(-1px) scale(1.025)}
.btn:active,.burger:active{transform:scale(.97)}

/* Flächen als Glas: Menü, Header, Pop-ups, Karten – durchscheinend, feine Lichtkante */
:root{--lq-surf:linear-gradient(160deg,#ffffff8f,#ffffff4d 45%,#ffffff73);--lq-surf-blur:blur(30px) saturate(1.9);--lq-surf-rim:inset 0 0 0 1px #ffffffe6,inset 1px 1px 2px -1px #ffffff,inset -1px -1px 2px -1px #ffffffa6,0 0 0 1px #54449c26,0 24px 56px -28px #54449c66}
html[data-theme=dark]{--lq-surf:linear-gradient(160deg,#ffffff1f,#ffffff08 45%,#ffffff14);--lq-surf-rim:inset 0 0 0 1px #ffffff40,inset 1px 1px 2px -1px #ffffff66,inset -1px -1px 2px -1px #ffffff26,0 0 0 1px #00000066,0 24px 56px -28px #000000cc}
.nav,.menu,.cookie,.fd-toast,.ck-dlg,.srch-card,.aud-card,.ck-card,.pt-card,.pa-card,.st-card,.nx-card,.sp-card,.vt-card,.dz-card,.tm-pcard,.pz-card,.ct-card,.faq details,.steps>div,.pk,.plan{background:var(--lq-surf);-webkit-backdrop-filter:var(--lq-surf-blur);backdrop-filter:var(--lq-surf-blur);border:0;box-shadow:var(--lq-surf-rim)}
input[type=text],input[type=email],input[type=tel],textarea,select{background:linear-gradient(160deg,#ffffff99,#ffffff4d);-webkit-backdrop-filter:blur(14px) saturate(1.6);backdrop-filter:blur(14px) saturate(1.6);border:0;box-shadow:inset 0 0 0 1px #54449c33,inset 1px 1px 2px -1px #54449c26,inset -1px -1px 2px -1px #ffffffd9}
input[type=text]:focus,input[type=email]:focus,input[type=tel]:focus,textarea:focus,select:focus{box-shadow:inset 0 0 0 1px #6f5bc399,0 0 0 4px #6f5bc324}
html[data-theme=dark] input[type=text],html[data-theme=dark] input[type=email],html[data-theme=dark] input[type=tel],html[data-theme=dark] textarea,html[data-theme=dark] select{background:linear-gradient(160deg,#ffffff1a,#ffffff08);box-shadow:inset 0 0 0 1px #ffffff33,inset 1px 1px 2px -1px #00000066}
/* Scroll-Effekt: Header wird beim Scrollen kräftiger (Chrome/Edge; sonst unverändert) */
@supports (animation-timeline:scroll()){@keyframes lq-nav{from{backdrop-filter:blur(16px) saturate(1.5)}to{backdrop-filter:blur(34px) saturate(2.1);box-shadow:var(--lq-surf-rim),0 18px 40px -18px #54449c80}}.nav{animation:lq-nav linear both;animation-timeline:scroll(root);animation-range:0 160px}}
#redeemCode{background:none;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none}
/* Pop-ups über Text: genug Deckkraft für gute Lesbarkeit */
.cookie,.fd-toast,.ck-dlg{background:linear-gradient(160deg,#ffffffd9,#ffffffb8 50%,#ffffffcc)}
html[data-theme=dark] .cookie,html[data-theme=dark] .fd-toast,html[data-theme=dark] .ck-dlg{background:linear-gradient(160deg,#2a2833e6,#17161dd9)}
@media(max-width:560px){.cookie,.fd-toast{background:linear-gradient(160deg,#fffffff2,#ffffffe0)}html[data-theme=dark] .cookie,html[data-theme=dark] .fd-toast{background:#1c1a24f5}}
.menu-open .fd-toast{opacity:0;pointer-events:none}

/* Dunkle Bereiche (Über uns usw.): Pillen als helles Klarglas mit Lichtkante statt flacher Kontur */
.tm-dark .btn,.tm-dark .btn:not(.ghost),.ex-own .btn,.ex-own .btn:not(.ghost){color:#fff;background:linear-gradient(160deg,#ffffff38,#ffffff0d 50%,#ffffff24);-webkit-backdrop-filter:blur(18px) saturate(1.8);backdrop-filter:blur(18px) saturate(1.8);box-shadow:inset 0 0 0 1px #ffffff73,inset 0 1px 0 #ffffffa6,inset 1px 1px 2px -1px #ffffffb3,inset -1px -1px 2px -1px #ffffff59,0 10px 24px -12px #000000cc}
.tm-dark .btn.primary,.tm-dark .tm-end .btn:not(.ghost){background:linear-gradient(160deg,#ffffffeb,#ffffffb8);color:#0b0a12}
.tm-facts li,.tm-badge,.tm-float,.tm-fout,.tm-dark .eyebrow{background:linear-gradient(160deg,#ffffff2e,#ffffff08 50%,#ffffff1a);-webkit-backdrop-filter:blur(16px) saturate(1.8);backdrop-filter:blur(16px) saturate(1.8);border:0;box-shadow:inset 0 0 0 1px #ffffff59,inset 1px 1px 2px -1px #ffffff8c,inset -1px -1px 2px -1px #ffffff40,0 8px 20px -10px #000000b3}
.tm-facts li{border-radius:999px;padding:10px 16px}
.tm-fout{background:linear-gradient(160deg,#7fe0bc47,#7fe0bc14 50%,#7fe0bc2e);color:#a6f0d4;box-shadow:inset 0 0 0 1px #7fe0bc8c,inset 1px 1px 2px -1px #d9fff0b3,inset -1px -1px 2px -1px #7fe0bc59,0 8px 20px -10px #000000b3}
.tm-badge{background:linear-gradient(160deg,#fffffff2,#ffffffd9);box-shadow:inset 0 0 0 1px #fff,0 0 0 1px #ffffff40,0 14px 30px -14px #000000b3}
header.top:not(.nav){background:linear-gradient(180deg,#ffffffeb,#fafaffdb)}
.sub-top{background:linear-gradient(180deg,#ffffffeb,#f8f7fce6);box-shadow:inset 0 -1px 0 #54449c26}

/* Überall gleiche Pillen: helle Seiten = Weißglas, dunkle Bereiche = Klarglas */
.ws-facts li,.chips a,.sub-nav a,.xs-jump a,.xs-aud,.aud-switch,.kt-badge,.kt-pill,.st-meta li,.incl>span{background:var(--lq-fill);border:0;box-shadow:var(--lq-rim)}
.ws-facts li{border-radius:999px;padding:9px 16px}
.chips a:hover,.sub-nav a:hover,.xs-jump a:hover{box-shadow:var(--lq-rim),inset 0 0 0 1px #6f5bc366}
.xs-dark .btn,.xs-dark .btn:not(.ghost){color:#fff;background:linear-gradient(160deg,#ffffff38,#ffffff0d 50%,#ffffff24);-webkit-backdrop-filter:blur(18px) saturate(1.8);backdrop-filter:blur(18px) saturate(1.8);box-shadow:inset 0 0 0 1px #ffffff73,inset 0 1px 0 #ffffffa6,inset 1px 1px 2px -1px #ffffffb3,inset -1px -1px 2px -1px #ffffff59,0 10px 24px -12px #000000cc}
.xs-facts li,.xs-dark .xs-chip,.xs-dark .xs-aud{background:linear-gradient(160deg,#ffffff2e,#ffffff08 50%,#ffffff1a);-webkit-backdrop-filter:blur(16px) saturate(1.8);backdrop-filter:blur(16px) saturate(1.8);border:0;box-shadow:inset 0 0 0 1px #ffffff59,inset 1px 1px 2px -1px #ffffff8c,inset -1px -1px 2px -1px #ffffff40,0 8px 20px -10px #000000b3}
.xs-facts li{border-radius:999px;padding:10px 16px}
html[data-theme=dark] .ws-facts li,html[data-theme=dark] .chips a,html[data-theme=dark] .sub-nav a,html[data-theme=dark] .facts>span{color:#ededf2}
html[data-theme=dark] .ws-facts li,html[data-theme=dark] .chips a,html[data-theme=dark] .sub-nav a{background:var(--lq-fill);border:0;box-shadow:var(--lq-rim)}
html[data-theme=dark] .tm-dark .btn:not(.ghost),html[data-theme=dark] .ex-own .btn:not(.ghost),html[data-theme=dark] .xs-dark .btn:not(.ghost){color:#fff;background:linear-gradient(160deg,#ffffff38,#ffffff0d 50%,#ffffff24);box-shadow:inset 0 0 0 1px #ffffff73,inset 0 1px 0 #ffffffa6,inset 1px 1px 2px -1px #ffffffb3,inset -1px -1px 2px -1px #ffffff59,0 10px 24px -12px #000000cc}

/* Weicher Blur-Verlauf am unteren Bildschirmrand (ProgressiveBlur, nur CSS) */
body::after{content:"";position:fixed;left:0;right:0;bottom:0;height:min(14vh,96px);z-index:30;pointer-events:none;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);-webkit-mask-image:linear-gradient(to top,#000 8%,transparent);mask-image:linear-gradient(to top,#000 8%,transparent)}
@media (prefers-reduced-transparency:reduce){body::after{display:none}}

/* Theme-Wechsel: runder Aufdeckeffekt ab dem Schalter (View Transitions) */
::view-transition-old(root),::view-transition-new(root){animation:none;mix-blend-mode:normal}
::view-transition-old(root){z-index:0}
::view-transition-new(root){z-index:1}

/* Geräte- und Leistungs-Abschnitt: Karten in den Mockups brauchen keinen Hintergrund-Blur (beim Theme-Wechsel/Scrollen sehr teuer) */
#geraete{--gl-blur:none;--lq-surf-blur:none}
#leistungen,#ablauf{--gl-blur:blur(8px);--lq-surf-blur:blur(8px)}