:root{--gold:#d4b675;--gold2:#f3e7c8;--bg:#0a0b0e;--panel:#13141a;--card:#181a22;--line:rgba(212,182,117,.20);--txt:#f4f1ea;--mut:#9a968d;--green:#7fd6a8;--red:#e08a8a;}
*{margin:0;padding:0;box-sizing:border-box;}
body{font-family:'Helvetica Neue',Arial,sans-serif;background:var(--bg);color:var(--txt);font-size:15px;}
a{color:inherit;text-decoration:none;}
/* topbar */
.topbar{display:flex;align-items:center;gap:24px;padding:14px 26px;background:var(--panel);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5;}
.logo{font-weight:900;letter-spacing:3px;color:var(--gold);font-size:16px;}
.logo span{color:var(--mut);font-size:11px;letter-spacing:2px;}
.topbar nav{display:flex;align-items:center;gap:20px;margin-left:auto;}
.topbar nav a{color:var(--mut);font-weight:700;font-size:14px;}
.topbar nav a:hover{color:var(--txt);}
.topbar .me{color:var(--gold);font-size:13px;}
.topbar .out{color:var(--red);}
.wrap{max-width:1240px;margin:0 auto;padding:26px;}
/* bars/buttons */
.bar{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;}
h1{font-size:26px;font-weight:900;letter-spacing:-.5px;}
h3{font-size:16px;margin-bottom:12px;color:var(--gold2);}
.btn{display:inline-block;background:linear-gradient(120deg,var(--gold2),var(--gold));color:#1a1407;font-weight:800;padding:11px 18px;border:none;border-radius:10px;cursor:pointer;font-size:14px;}
.btn.ghost{background:transparent;border:1px solid var(--line);color:var(--txt);}
.btn.small{padding:8px 14px;font-size:13px;}
.btn:hover{filter:brightness(1.06);}
.link{background:none;border:none;color:var(--gold);cursor:pointer;font-size:13px;font-weight:700;text-decoration:underline;}
.info{background:rgba(127,214,168,.1);border:1px solid rgba(127,214,168,.3);color:var(--green);padding:12px 16px;border-radius:10px;margin-bottom:16px;}
.err{background:rgba(224,138,138,.12);border:1px solid rgba(224,138,138,.35);color:var(--red);padding:11px 14px;border-radius:10px;margin-bottom:14px;}
/* stats */
.stats{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin-bottom:22px;}
.stat{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:18px;}
.stat .v{font-size:26px;font-weight:900;color:var(--gold2);}
.stat .l{color:var(--mut);font-size:13px;margin-top:4px;}
.stat.warn .v{color:var(--red);}
@media(max-width:900px){.stats{grid-template-columns:repeat(2,1fr);}}
/* board */
.board{display:flex;gap:14px;overflow-x:auto;padding-bottom:10px;}
.col{flex:0 0 240px;background:var(--panel);border:1px solid var(--line);border-radius:14px;display:flex;flex-direction:column;}
.col-head{padding:13px 15px;font-weight:800;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;}
.col-head span{color:var(--mut);font-weight:700;}
.col-body{padding:10px;min-height:120px;display:flex;flex-direction:column;gap:10px;}
.cardlink{display:block;}
.lead-card{background:var(--card);border:1px solid rgba(255,255,255,.06);border-radius:11px;padding:13px;cursor:grab;transition:border-color .2s;}
.lead-card:hover{border-color:var(--gold);}
.lc-name{font-weight:800;}
.lc-meta{color:var(--gold2);font-size:13px;margin-top:5px;}
.lc-src{color:var(--mut);font-size:11px;margin-top:6px;text-transform:uppercase;letter-spacing:1px;}
/* detail */
.detail{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start;}
@media(max-width:860px){.detail{grid-template-columns:1fr;}}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:20px;margin-bottom:18px;}
.form label{display:block;font-weight:700;font-size:13px;margin:12px 0 6px;color:var(--mut);}
.form input,.form select,.form textarea{width:100%;background:var(--card);border:1px solid var(--line);border-radius:9px;padding:11px;color:var(--txt);font-size:14px;font-family:inherit;}
.form textarea{min-height:80px;resize:vertical;}
.form .row{display:flex;gap:12px;}.form .row>div{flex:1;}
.form .btn{margin-top:16px;}
.kv{display:grid;gap:8px;}
.kv div{display:flex;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.05);padding:6px 0;}
.kv b{color:var(--mut);font-weight:700;}
.moti{margin-top:12px;color:var(--gold2);font-style:italic;border-left:2px solid var(--gold);padding-left:12px;}
.task{display:flex;justify-content:space-between;align-items:center;padding:9px 0;border-bottom:1px solid rgba(255,255,255,.05);font-size:14px;}
.task.done{color:var(--mut);text-decoration:line-through;}
.timeline{margin-top:8px;}
.tl{padding:11px 0;border-bottom:1px solid rgba(255,255,255,.05);}
.tl-meta{color:var(--mut);font-size:12px;margin-bottom:3px;}
.tl.stage .tl-body,.tl.system .tl-body{color:var(--gold2);font-size:13px;}
/* table */
.tbl{width:100%;border-collapse:collapse;background:var(--panel);border:1px solid var(--line);border-radius:12px;overflow:hidden;}
.tbl th{text-align:left;padding:12px 14px;color:var(--mut);font-size:12px;text-transform:uppercase;letter-spacing:1px;border-bottom:1px solid var(--line);}
.tbl td{padding:12px 14px;border-bottom:1px solid rgba(255,255,255,.04);}
.tbl tr[onclick]{cursor:pointer;}
.tbl tr:hover td{background:rgba(212,182,117,.05);}
.dim{color:var(--mut);font-size:13px;}
.pill{display:inline-block;padding:4px 10px;border-radius:999px;font-size:12px;font-weight:700;background:rgba(255,255,255,.06);}
.pill.s-gewonnen{background:rgba(127,214,168,.15);color:var(--green);}
.pill.s-verloren{background:rgba(224,138,138,.15);color:var(--red);}
.pill.s-neu{color:var(--gold2);}
.search{display:flex;gap:8px;}.search input{background:var(--card);border:1px solid var(--line);border-radius:9px;padding:9px 12px;color:var(--txt);}
/* login */
.login-bg{display:flex;align-items:center;justify-content:center;min-height:100vh;background-image:radial-gradient(900px 600px at 50% 0%,rgba(212,182,117,.12),transparent 60%);}
.login-card{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:34px;width:340px;}
.login-card .brand{text-align:center;font-weight:900;letter-spacing:5px;color:var(--gold);font-size:18px;margin-bottom:24px;}
.login-card .brand span{display:block;font-size:11px;color:var(--mut);letter-spacing:3px;margin-top:4px;}
.login-card label{display:block;font-size:13px;color:var(--mut);margin:14px 0 6px;font-weight:700;}
.login-card input{width:100%;background:var(--card);border:1px solid var(--line);border-radius:9px;padding:12px;color:var(--txt);}
.login-card button{width:100%;margin-top:22px;background:linear-gradient(120deg,var(--gold2),var(--gold));color:#1a1407;font-weight:800;padding:13px;border:none;border-radius:10px;cursor:pointer;}

/* ---- Member-Dashboard / Module ---- */
.hello{margin-bottom:24px;}
.hello h1{font-size:30px;}
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px;}
.tile{display:block;background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:22px;transition:transform .2s,border-color .2s;}
.tile:hover{transform:translateY(-4px);border-color:var(--gold);}
.tile-ic{font-size:30px;}
.tile-t{font-weight:900;font-size:19px;margin-top:10px;color:var(--gold2);}
.tile-d{color:var(--mut);font-size:14px;margin-top:4px;min-height:38px;}
.tile-s{margin-top:10px;font-size:13px;color:var(--txt);}
.tile-s .warn{color:var(--red);font-weight:700;}
.tile.soon{opacity:.6;cursor:default;}
.tile.soon:hover{transform:none;border-color:var(--line);}
.tile.res{cursor:default;}
.tile.res:hover{transform:none;}
.res-foot{margin-top:14px;display:flex;align-items:center;gap:12px;}
.progress{height:7px;background:rgba(255,255,255,.08);border-radius:5px;margin-top:12px;overflow:hidden;}
.pbar{height:100%;background:linear-gradient(90deg,var(--gold2),var(--gold));}
.cat{margin:26px 0 12px;color:var(--gold);font-size:15px;text-transform:uppercase;letter-spacing:2px;}
.lead-text{color:var(--mut);margin-bottom:16px;max-width:680px;}
/* Academy */
.video{position:relative;padding-bottom:56.25%;height:0;border-radius:14px;overflow:hidden;margin-bottom:18px;border:1px solid var(--line);}
.video iframe{position:absolute;inset:0;width:100%;height:100%;}
.lesson-list{display:flex;flex-direction:column;gap:8px;}
.lesson-row{display:flex;align-items:center;gap:14px;background:var(--panel);border:1px solid var(--line);border-radius:11px;padding:14px 16px;}
.lesson-row:hover{border-color:var(--gold);}
.ln-num{width:28px;height:28px;border-radius:50%;background:var(--card);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px;color:var(--gold);}
.ln-title{font-weight:700;flex:1;}
.ln-tag{color:var(--mut);font-size:12px;}
/* Funnel (Statistik) */
.funnel-row{display:flex;align-items:center;gap:12px;margin-bottom:10px;}
.funnel-row .fl{width:130px;font-size:14px;color:var(--mut);}
.ftrack{flex:1;background:rgba(255,255,255,.06);border-radius:6px;height:22px;overflow:hidden;}
.fbar{height:100%;background:linear-gradient(90deg,var(--gold2),var(--gold));border-radius:6px;min-width:2px;}
.fbar.s-gewonnen{background:linear-gradient(90deg,#7fd6a8,#4caa7d);}
.fbar.s-verloren{background:linear-gradient(90deg,#e08a8a,#b85c5c);}
.funnel-row .fn{width:36px;text-align:right;font-weight:800;}

/* ---- Sales-Cockpit ---- */
.kpis{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin-bottom:22px;}
@media(max-width:1000px){.kpis{grid-template-columns:repeat(3,1fr);}}
@media(max-width:620px){.kpis{grid-template-columns:repeat(2,1fr);}}
.kpi{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:16px;}
.kpi .v{font-size:23px;font-weight:900;color:var(--txt);letter-spacing:-.5px;}
.kpi .l{color:var(--mut);font-size:12px;margin-top:5px;}
.kpi.gold{background:linear-gradient(160deg,rgba(212,182,117,.16),rgba(212,182,117,.03));border-color:rgba(212,182,117,.4);}
.kpi.gold .v{color:var(--gold2);}
.kpi.warn .v{color:var(--red);}
.rank{display:flex;align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid rgba(255,255,255,.05);}
.rank .r-pos{width:26px;height:26px;border-radius:50%;background:var(--card);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-weight:900;font-size:13px;color:var(--gold);}
.rank .r-name{font-weight:800;flex:1;}
.rank .r-stat{font-size:12.5px;color:var(--mut);}
.rank .r-stat b{color:var(--gold2);}
.filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px;}
.filters input,.filters select{background:var(--card);border:1px solid var(--line);border-radius:9px;padding:9px 12px;color:var(--txt);font-size:13.5px;}

/* ---- Kalender ---- */
.cat.cal-overdue{color:var(--red);} .cat.cal-today{color:var(--gold);}
.cal-list{display:flex;flex-direction:column;gap:8px;margin-bottom:18px;}
.cal-item{display:flex;align-items:center;gap:14px;background:var(--panel);border:1px solid var(--line);border-radius:11px;padding:12px 16px;}
.cal-time{font-weight:800;color:var(--gold2);font-size:13px;min-width:110px;}
.cal-title{flex:1;font-weight:700;}
.cal-who{font-size:12px;}
/* ---- Stufen-Editor ---- */
.stage-row{display:flex;gap:8px;align-items:center;margin-bottom:8px;}
.stage-row input,.stage-row select{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:8px 10px;color:var(--txt);font-size:13.5px;}

/* ---- Board/Liste-Umschalter ---- */
.toggle{display:inline-flex;background:var(--card);border:1px solid var(--line);border-radius:10px;overflow:hidden;}
.toggle a{padding:8px 14px;font-size:13.5px;font-weight:700;color:var(--mut);}
.toggle a.on{background:linear-gradient(120deg,var(--gold2),var(--gold));color:#1a1407;}
.toggle a:hover:not(.on){color:var(--txt);}

/* ---- CLOSER DNA ---- */
.dna-brand{font-weight:900;letter-spacing:6px;color:#d4b675;font-size:22px;}
.dna-brand span{display:block;font-size:10px;letter-spacing:4px;color:var(--mut);margin-top:5px;}
.dna-brand.big{font-size:34px;}
.dna-hero{text-align:center;padding:18px 0 26px;background:radial-gradient(700px 300px at 50% 0%,rgba(212,182,117,.12),transparent 60%);border-radius:16px;margin-bottom:22px;}
.dna-intro{color:var(--mut);max-width:620px;margin:16px auto 0;font-size:16px;line-height:1.6;}
.dna-form{display:flex;flex-direction:column;gap:14px;}
.dna-q{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:20px;}
.dna-qh{font-size:16px;margin-bottom:14px;}
.dna-cat{display:inline-block;font-size:11px;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:#d4b675;background:rgba(212,182,117,.12);border:1px solid var(--line);padding:3px 9px;border-radius:999px;margin-right:8px;}
.dna-opts{display:flex;flex-direction:column;gap:8px;}
.dna-opt{display:flex;align-items:center;gap:11px;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:12px 14px;cursor:pointer;font-size:14.5px;transition:border-color .15s;}
.dna-opt:hover{border-color:var(--gold);}
.dna-opt input{accent-color:#d4b675;width:17px;height:17px;}
/* Ergebnis */
.dna-result{max-width:560px;margin:10px auto;text-align:center;background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:40px;}
.dna-result .dna-brand{margin-bottom:18px;}
.dna-score{font-size:88px;font-weight:900;line-height:1;background:linear-gradient(120deg,#f3e7c8,#d4b675);-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
.dna-score small{font-size:30px;}
.dna-level{font-size:26px;font-weight:900;letter-spacing:1px;margin-top:8px;}
.dna-result.ready .dna-level{color:#7fd6a8;} .dna-result.almost .dna-level{color:#d4b675;}
.dna-result.mid .dna-level{color:#e6c87a;} .dna-result.low .dna-level{color:#e08a8a;}
.dna-sub{color:var(--mut);margin-top:8px;}
.dna-bars{margin:26px 0;display:flex;flex-direction:column;gap:12px;text-align:left;}
.dna-bar .dl{font-size:13px;color:var(--mut);margin-bottom:5px;display:flex;justify-content:space-between;}
.dna-bar .dt{height:9px;background:rgba(255,255,255,.07);border-radius:5px;overflow:hidden;}
.dna-bar .df{height:100%;background:linear-gradient(90deg,#f3e7c8,#d4b675);}
.dna-cta{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;}

/* ---- Power Dialer ---- */
.dialer-progress{height:6px;background:rgba(255,255,255,.07);border-radius:4px;margin-bottom:20px;overflow:hidden;}
.dialer-progress div{height:100%;background:linear-gradient(90deg,#f3e7c8,#d4b675);transition:width .3s;}
.dialer{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start;}
@media(max-width:820px){.dialer{grid-template-columns:1fr;}}
.dcall{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:26px;text-align:center;}
.dc-name{font-size:30px;font-weight:900;letter-spacing:-.5px;}
.dc-meta{color:var(--mut);margin-top:8px;font-size:14px;}
.dc-phone{display:block;margin:20px auto;font-size:30px;font-weight:900;color:#0a0b0e;background:linear-gradient(120deg,#f3e7c8,#d4b675);border-radius:14px;padding:18px;text-decoration:none;box-shadow:0 10px 34px rgba(212,182,117,.3);}
.dc-phone:hover{filter:brightness(1.05);}
.dc-info{text-align:left;margin-top:18px;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:14px;font-size:14px;}
.dc-info b{color:var(--mut);}
.dc-info .moti{color:var(--gold2);font-style:italic;margin-top:8px;}
.dc-notes{text-align:left;margin-top:14px;font-size:13.5px;}
.dc-notes b{color:var(--mut);}
.dc-notes .dn{margin-top:5px;color:#cdc6b6;}
.ddisp{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:26px;}
.ddisp textarea{width:100%;min-height:80px;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:12px;color:var(--txt);font-family:inherit;}
.ddisp input[type=datetime-local]{width:100%;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:11px;color:var(--txt);}
.dbtns{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px;}
.db{padding:16px;border:none;border-radius:12px;font-weight:800;font-size:15px;cursor:pointer;color:#fff;}
.db.b-ok{background:linear-gradient(120deg,#4caa7d,#7fd6a8);color:#06281a;}
.db.b-app{background:linear-gradient(120deg,#d4b675,#f3e7c8);color:#1a1407;}
.db.b-no{background:#33343d;}
.db.b-lost{background:linear-gradient(120deg,#b85c5c,#e08a8a);color:#2a0c0c;}
.db:hover{filter:brightness(1.07);}
.dskip{display:block;text-align:center;margin-top:14px;color:var(--mut);font-weight:700;}
.dialer-end{text-align:center;padding:50px 20px;}
.dialer-end .de-ic{font-size:60px;} .dialer-end h1{margin:12px 0;} .dialer-end .btn{margin:8px 6px 0;}

/* ---- Dialer: erweiterte Buttons + Stufen-Select ---- */
.dstage{width:100%;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:11px;color:var(--txt);margin-bottom:10px;font-size:14px;}
.dbtns{grid-template-columns:1fr 1fr;}
.db.b-fu{background:linear-gradient(120deg,#6aa9d8,#9cc9ec);color:#06243a;}
.db.b-warn{background:#5a4a2a;color:#f0e0b8;}
.db.b-skip{background:transparent;border:1px solid var(--line);color:var(--mut);}
/* Funnel-Zeilen klickbar */
a.funnel-row{text-decoration:none;color:inherit;border-radius:8px;padding:3px 6px;margin:0 -6px;transition:background .15s;}
a.funnel-row:hover{background:rgba(212,182,117,.08);}
a.funnel-row:hover .fl{color:var(--gold2);}

/* Board-Spaltenkopf klickbar */
a.col-head{text-decoration:none;color:inherit;transition:color .15s,background .15s;}
a.col-head:hover{color:var(--gold2);background:rgba(212,182,117,.06);}

/* ---- Stufen-Schnellleiste ---- */
.stage-chips{display:flex;gap:8px;overflow-x:auto;padding-bottom:10px;margin-bottom:14px;}
.stage-chips .chip{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;background:var(--panel);border:1px solid var(--line);
  border-radius:999px;padding:8px 15px;font-size:13.5px;font-weight:700;color:var(--txt);transition:border-color .15s,background .15s;}
.stage-chips .chip span{background:rgba(212,182,117,.16);color:var(--gold2);border-radius:999px;padding:1px 9px;font-size:12px;font-weight:800;}
.stage-chips .chip:hover{border-color:var(--gold);background:rgba(212,182,117,.07);color:var(--gold2);}

/* ---- CLOSER DNA: Stepper ---- */
.dna-progress{height:8px;background:rgba(255,255,255,.07);border-radius:5px;overflow:hidden;margin-bottom:10px;}
.dna-progress div{height:100%;background:linear-gradient(90deg,#f3e7c8,#d4b675);transition:width .3s;}
.dna-stepinfo{text-align:center;color:var(--mut);font-size:14px;margin-bottom:18px;}
.dna-stepinfo b{color:var(--gold2);}
.dna-q.shake{animation:shake .4s;}
@keyframes shake{0%,100%{transform:translateX(0);}25%{transform:translateX(-8px);}75%{transform:translateX(8px);}}
.dna-nav{display:flex;gap:12px;justify-content:space-between;margin-top:6px;}
.dna-nav .btn{min-width:130px;}
#dnaNext,#dnaSubmit{margin-left:auto;}
/* ---- CLOSER DNA: Tacho ---- */
.tacho{position:relative;width:300px;max-width:90%;margin:6px auto 4px;}
.tacho svg{width:100%;display:block;overflow:visible;}
.t-track{fill:none;stroke:#2a2b34;stroke-width:13;stroke-linecap:round;}
.t-val{fill:none;stroke-width:13;stroke-linecap:round;transition:stroke-dashoffset 1.4s cubic-bezier(.2,.7,.2,1);}
.t-needle{stroke:#fff;stroke-width:3.5;stroke-linecap:round;transform:rotate(-90deg);transform-box:view-box;transform-origin:100px 100px;transition:transform 1.4s cubic-bezier(.25,.85,.3,1);filter:drop-shadow(0 2px 4px rgba(0,0,0,.5));}
.t-hub{fill:#fff;}
.t-num{position:absolute;left:0;right:0;bottom:-6px;text-align:center;font-size:44px;font-weight:900;line-height:1;
  background:linear-gradient(120deg,#f3e7c8,#d4b675);-webkit-background-clip:text;-webkit-text-fill-color:transparent;}

/* ======== GLOBALER EFFEKT-LOOK (alle Seiten) ======== */
.fx-bg{position:fixed;inset:0;z-index:-3;pointer-events:none;background:
  radial-gradient(800px 520px at 12% -5%, rgba(212,182,117,.10), transparent 60%),
  radial-gradient(720px 520px at 95% 0%, rgba(124,160,232,.06), transparent 60%);}
.fx-bg::after{content:"";position:absolute;left:50%;top:-12%;width:900px;height:900px;transform:translateX(-50%);
  background:radial-gradient(circle, rgba(212,182,117,.07), transparent 60%);animation:fxAura 7s ease-in-out infinite;}
@keyframes fxAura{0%,100%{opacity:.55;transform:translateX(-50%) scale(1);}50%{opacity:1;transform:translateX(-50%) scale(1.1);}}
.fx-part{position:fixed;border-radius:50%;background:radial-gradient(circle,#fff,rgba(212,182,117,.5) 40%,transparent 70%);z-index:-1;pointer-events:none;opacity:.4;animation:fxFloat linear infinite;}
@keyframes fxFloat{to{transform:translateY(-105vh);opacity:0;}}
@keyframes fxIn{from{opacity:0;transform:translateY(16px);}to{opacity:1;transform:none;}}
/* Glas-Optik + Einblenden für bestehende Komponenten */
.stat,.tile,.panel,.col,.guarantee{background:linear-gradient(150deg,rgba(255,255,255,.055),rgba(255,255,255,.015))!important;
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);}
.stat,.tile,.col,.panel,.lesson-row{animation:fxIn .5s cubic-bezier(.2,.7,.2,1) both;will-change:transform;}
.stat,.tile,.lesson-row{transition:transform .25s,border-color .25s,box-shadow .25s;}
.stat:hover,.lesson-row:hover{box-shadow:0 12px 34px rgba(0,0,0,.32),0 0 24px rgba(212,182,117,.12);border-color:rgba(212,182,117,.4);}
.tile:hover{box-shadow:0 14px 36px rgba(0,0,0,.34),0 0 28px rgba(212,182,117,.14);}
/* Stagger */
.board .col:nth-child(2){animation-delay:.05s}.board .col:nth-child(3){animation-delay:.1s}.board .col:nth-child(4){animation-delay:.15s}.board .col:nth-child(5){animation-delay:.2s}.board .col:nth-child(n+6){animation-delay:.25s}
.tiles .tile:nth-child(2){animation-delay:.06s}.tiles .tile:nth-child(3){animation-delay:.12s}.tiles .tile:nth-child(4){animation-delay:.18s}.tiles .tile:nth-child(n+5){animation-delay:.24s}
.stats .stat:nth-child(2){animation-delay:.05s}.stats .stat:nth-child(3){animation-delay:.1s}.stats .stat:nth-child(4){animation-delay:.15s}.stats .stat:nth-child(5){animation-delay:.2s}
.lesson-list .lesson-row:nth-child(2){animation-delay:.05s}.lesson-list .lesson-row:nth-child(3){animation-delay:.1s}.lesson-list .lesson-row:nth-child(n+4){animation-delay:.15s}

/* ---- Navigation mit Untermenüs ---- */
.topbar nav .grp{position:relative;}
.topbar nav .grp>.gt{cursor:pointer;color:var(--mut);font-weight:700;font-size:14px;}
.topbar nav .grp:hover>.gt{color:var(--txt);}
.topbar nav .grp>.gt::after{content:" ▾";font-size:9px;opacity:.6;}
.topbar nav .grp::after{content:"";position:absolute;top:100%;left:0;right:0;height:16px;}
.topbar nav .submenu{position:absolute;top:calc(100% + 14px);left:50%;transform:translateX(-50%) translateY(6px);
  background:var(--panel);border:1px solid var(--line);border-radius:13px;padding:8px;min-width:185px;
  display:flex;flex-direction:column;gap:2px;box-shadow:0 18px 44px rgba(0,0,0,.55);z-index:30;opacity:0;pointer-events:none;transition:opacity .15s,transform .15s;}
.topbar nav .grp:hover .submenu{opacity:1;pointer-events:auto;transform:translateX(-50%) translateY(0);}
.topbar nav .submenu a{padding:10px 13px;border-radius:9px;color:var(--mut)!important;font-weight:700;font-size:14px;white-space:nowrap;}
.topbar nav .submenu a:hover{background:rgba(212,182,117,.1);color:var(--gold2)!important;}

/* ======== MOBILE-OPTIMIERUNG ======== */
.navtoggle{display:none;background:none;border:none;color:var(--gold);font-size:26px;cursor:pointer;margin-left:auto;line-height:1;}
@media(max-width:820px){
  .topbar{flex-wrap:wrap;gap:0;padding:12px 16px;}
  .logo{font-size:15px;}
  .navtoggle{display:block;}
  .topbar nav{display:none;width:100%;flex-direction:column;align-items:stretch;gap:0;margin:8px -16px 0;order:5;background:var(--panel);}
  .topbar nav.open{display:flex;}
  .topbar nav>a,.topbar nav .grp>.gt{display:block;padding:14px 18px;border-top:1px solid rgba(255,255,255,.06);font-size:15px;width:100%;color:var(--txt);}
  .topbar nav .grp{width:100%;position:static;}
  .topbar nav .grp>.gt::after{float:right;opacity:.7;}
  .topbar nav .grp::after{display:none;}
  .topbar nav .submenu{position:static;transform:none;display:none;opacity:1;pointer-events:auto;box-shadow:none;border:none;border-radius:0;background:rgba(0,0,0,.2);padding:4px 0;min-width:0;}
  .topbar nav .grp.sub-open .submenu{display:flex;}
  .topbar nav .submenu a{padding:12px 18px 12px 34px;font-size:14.5px;}
  .topbar .me{display:none;}
  .topbar .out{padding:14px 18px;border-top:1px solid rgba(255,255,255,.06);}
  .wrap{padding:18px 14px;}
  h1{font-size:23px;}
  .bar{flex-wrap:wrap;gap:10px;}
  .tbl{display:block;overflow-x:auto;white-space:nowrap;-webkit-overflow-scrolling:touch;}
  .detail{grid-template-columns:1fr!important;}
  .cp-side{position:static;}
  .tr-foot input{font-size:16px;} /* iOS-Zoom vermeiden */
  .form input,.form select,.form textarea,.filters input,.filters select{font-size:16px;}
}
