@font-face{font-family:Inter;font-weight:400;font-display:swap;src:url(fonts/inter-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:Inter;font-weight:600;font-display:swap;src:url(fonts/inter-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:Inter;font-weight:700;font-display:swap;src:url(fonts/inter-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:Jakarta;font-weight:700;font-display:swap;src:url(fonts/plus-jakarta-sans-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:Jakarta;font-weight:800;font-display:swap;src:url(fonts/plus-jakarta-sans-latin-800-normal.woff2) format("woff2")}
/* Farben: Grund Aubergine-Schwarz · Aktion Koralle (nur Buttons, Bonus, MDH-Links) · Vertrauen Türkis (Kicker, Daten, Links, Ränge) */
:root{--bg:#15111a;--bg2:#1e1824;--bg3:#2a2231;--bg4:#33293b;--line:#3a2f43;--fg:#f4eef7;--mut:#b7a9c2;
--cta:#ff6b57;--cta2:#ff8a78;--trust:#3fd0c9;--trust2:#8be6e1;--trust-bg:rgba(63,208,201,.1);
--gold:#f4c15d;--ok:#5fd39a;--warn:#f4c15d;--off:#9a8aa6;--vio:#b897ff;--sky:#72b8ff;--rose:#ff86c0;--live:#ff3b5c;
--r:16px;color-scheme:dark}
[hidden]{display:none!important}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-padding-top:12px}
body{margin:0;background:var(--bg);color:var(--fg);font:16px/1.6 Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;overflow-x:hidden}
a{color:var(--trust);text-underline-offset:3px}a:hover{color:var(--trust2)}
img{max-width:100%;height:auto;display:block}
.wrap{max-width:1160px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right))}
.narrow{max-width:820px}
h1,h2,h3{font-family:Jakarta,Inter,system-ui,sans-serif;line-height:1.18;text-wrap:balance;margin:0 0 .5em;letter-spacing:-.015em}
h1{font-size:clamp(30px,5.4vw,48px);font-weight:800}
h2{font-size:clamp(22px,3vw,28px);font-weight:800;margin-top:1.7em}
h3{font-size:18px;font-weight:700}
p{margin:0 0 1em}.mut{color:var(--mut)}.small{font-size:14px}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ic{flex:none;display:inline-block;vertical-align:middle}
.lead{font-size:18px;color:#e4dbe9;max-width:780px}
.kicker{font-family:Jakarta,Inter,sans-serif;font-weight:800;font-size:14px;letter-spacing:.09em;text-transform:uppercase;color:var(--trust);margin:0 0 6px}
h2+p,.kicker+h2{margin-top:0}
article>.kicker:not(:first-child){margin-top:2.4em}
.sec-head{margin-top:2.2em}.sec-head h2{margin:0 0 .3em}

/* Bonus-Leiste */
.bonusbar{display:block;background:linear-gradient(90deg,var(--cta),#ff8a6b);color:#1b0f0d;text-decoration:none;font-size:14px;line-height:1.35}
.bonusbar .wrap{display:flex;align-items:center;gap:10px;min-height:46px;padding-top:6px;padding-bottom:6px}
.bonusbar small{font-size:14px;opacity:.85;white-space:nowrap}
.bonusbar,.bonusbar b,.bonusbar small,.bonusbar span{color:#1b0f0d}
.bonusbar:hover{filter:brightness(1.06)}

/* Kopf */
header.top{border-bottom:1px solid var(--line);background:linear-gradient(180deg,#1b1521,var(--bg))}
header.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:12px 24px;padding-top:12px;padding-bottom:14px;flex-wrap:wrap}
.logo{display:inline-flex;align-items:center;gap:10px;min-height:44px;color:var(--fg);text-decoration:none}
.logo span{font-family:Jakarta,sans-serif;font-weight:800;font-size:21px;letter-spacing:-.02em}
.logo i{font-style:normal;color:var(--cta)}.logo small{font-size:21px;color:var(--trust)}
.logo:hover{color:var(--fg)}
nav.main{display:flex;flex-wrap:wrap;gap:8px}
nav.main a{--c:var(--trust);display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:44px;padding:0 16px;border-radius:999px;color:var(--fg);font-weight:600;font-size:15px;text-decoration:none;white-space:nowrap;
border:1.5px solid transparent;background:linear-gradient(var(--bg2),var(--bg2)) padding-box,linear-gradient(120deg,var(--c),rgba(255,255,255,.08)) border-box}
nav.main a .ic{color:var(--c)}
nav.main a:hover{color:#fff;background:linear-gradient(var(--bg3),var(--bg3)) padding-box,linear-gradient(120deg,var(--c),var(--c)) border-box}
nav.main a[aria-current]{color:#14101a;background:linear-gradient(120deg,var(--c),color-mix(in srgb,var(--c) 55%,#fff)) padding-box,linear-gradient(120deg,var(--c),var(--c)) border-box}
nav.main a[aria-current] .ic{color:#14101a}
.n-top{--c:var(--gold)!important}.n-akt{--c:var(--ok)!important}.n-th{--c:var(--vio)!important}.n-vgl{--c:var(--trust)!important}.n-live{--c:var(--live)!important}
nav.main .n-live{flex-direction:row;gap:7px}
nav.main .n-live small{font-size:14px;font-weight:400;color:var(--mut);margin-left:2px}
.live{width:10px;height:10px;border-radius:50%;background:var(--live);box-shadow:0 0 0 0 rgba(255,59,92,.7);animation:lp 1.8s ease-out infinite}
@keyframes lp{0%{box-shadow:0 0 0 0 rgba(255,59,92,.65)}80%,100%{box-shadow:0 0 0 8px rgba(255,59,92,0)}}
@media(prefers-reduced-motion:reduce){.live{animation:none}}

main{padding:20px 0 56px}
.crumbs{font-size:14px;color:var(--mut);margin-bottom:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.crumbs a{color:var(--mut);display:inline-flex;align-items:center;min-height:44px}

/* Knöpfe */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:12px 22px;border-radius:14px;background:linear-gradient(135deg,var(--cta),#ff8a6b);color:#1b0f0d;font-weight:700;font-size:16px;text-decoration:none;border:0;box-shadow:0 8px 24px rgba(255,107,87,.25);cursor:pointer;font-family:inherit;text-align:center}
.btn:hover{filter:brightness(1.07);color:#1b0f0d}
.btn.ghost{background:transparent;color:var(--fg);border:1px solid var(--line);box-shadow:none}
.btn2{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:10px 18px;border-radius:14px;border:1.5px solid rgba(63,208,201,.5);background:var(--trust-bg);color:var(--trust2);font-weight:700;text-decoration:none}
.btn2:hover{border-color:var(--trust);color:#fff}
.more{margin:16px 0 0}
.ad{display:flex;gap:8px;align-items:flex-start;font-size:14px;line-height:1.45;color:var(--mut);margin:10px 0 0}
.ad .ic{color:var(--trust);margin-top:1px}
.bonus{display:flex;gap:9px;align-items:flex-start;font-size:14px;line-height:1.5;margin:12px 0 0;padding:10px 12px;border-radius:12px;background:rgba(255,107,87,.08);border:1px solid rgba(255,107,87,.28)}
.bonus .ic{color:var(--cta2);margin-top:1px}.bonus b{color:var(--cta2)}

/* Chips, Abzeichen */
.badge{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:600;padding:5px 12px;border-radius:999px;background:var(--bg3);color:var(--mut);margin:0 6px 6px 0;line-height:1.3}
.badge.aktiv{color:var(--ok);background:rgba(95,211,154,.12);border:1px solid rgba(95,211,154,.35)}
.badge.ruhig{color:var(--warn);background:rgba(244,193,93,.1);border:1px solid rgba(244,193,93,.3)}
.badge.inaktiv{color:var(--off);border:1px solid var(--line)}
.badge.gold{background:rgba(244,193,93,.12);color:var(--gold)}
.badge.rang{color:var(--trust2);background:var(--trust-bg);border:1px solid rgba(63,208,201,.3)}
.badge .ic{color:currentColor}
.chips-row{margin:4px 0 14px}
.dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--off);flex:none}
.tm .dot{align-self:flex-start;margin-top:6px}
.dot.aktiv{background:var(--ok);box-shadow:0 0 0 3px rgba(95,211,154,.18)}.dot.ruhig{background:var(--warn)}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}
.chips a{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:8px 16px;border-radius:999px;border:1px solid var(--line);color:var(--fg);text-decoration:none;background:var(--bg2);font-weight:600;font-size:15px}
.chips a b{font-weight:700;color:var(--trust);font-size:14px}
.chips a:hover{border-color:var(--trust)}
.chips.th a:nth-child(5n+1){border-color:rgba(184,151,255,.45)}.chips.th a:nth-child(5n+2){border-color:rgba(63,208,201,.45)}.chips.th a:nth-child(5n+3){border-color:rgba(244,193,93,.4)}.chips.th a:nth-child(5n+4){border-color:rgba(255,134,192,.4)}.chips.th a:nth-child(5n+5){border-color:rgba(114,184,255,.45)}
.chips.mt a{border-color:rgba(63,208,201,.45);background:var(--trust-bg)}
.rk{position:absolute;left:8px;top:8px;display:inline-flex;align-items:center;justify-content:center;min-width:38px;height:38px;padding:0 9px;border-radius:999px;background:rgba(21,17,26,.88);border:2px solid var(--trust);color:#fff;font-family:Jakarta,sans-serif;font-weight:800;font-size:15px;line-height:1}
.rk.big{left:12px;top:12px;min-width:52px;height:52px;font-size:19px}

/* Karten */
.card{background:var(--bg2);border:1px solid var(--line);border-radius:var(--r);padding:18px}
.card h3{margin-top:0}

/* Kennzahl-Kacheln */
.kz{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:14px 0 16px}
.k{--c:var(--trust);position:relative;display:grid;align-content:center;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:10px;align-items:center;padding:12px 14px;border-radius:14px;background:linear-gradient(135deg,color-mix(in srgb,var(--c) 13%,var(--bg2)),var(--bg2) 70%);border:1px solid color-mix(in srgb,var(--c) 32%,var(--line));min-width:0}
.k .ic{grid-row:1/3;color:var(--c);width:34px;height:34px;padding:7px;border-radius:10px;background:color-mix(in srgb,var(--c) 16%,transparent)}
.k b{font-family:Jakarta,sans-serif;font-weight:800;font-size:22px;line-height:1.15;overflow-wrap:anywhere}
.k span{font-size:14px;color:var(--mut);line-height:1.3}
.k.wide{grid-column:1/-1}.k.wide b{font-size:20px}
.k-vid{--c:var(--trust)}.k-fans{--c:var(--vio)}.k-neu{--c:var(--ok)}.k-jahr{--c:var(--gold)}.k-top{--c:var(--sky)}
@media(min-width:900px){.kz{grid-template-columns:repeat(3,minmax(0,1fr))}.kz.four{grid-template-columns:repeat(4,minmax(0,1fr))}.k.wide{grid-column:span 2}}

/* Profil-Hero */
.phero{display:grid;grid-template-columns:1fr;gap:16px;padding:12px;background:linear-gradient(160deg,#241c2b,var(--bg2) 55%)}
.phero-pic{position:relative;border-radius:14px;overflow:hidden;aspect-ratio:4/5;background:var(--bg3)}
.phero-pic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 12%}
.phero-pic .mono{position:absolute;inset:0;font-size:120px}
.phero-pic.nopic{aspect-ratio:2/1}.phero-pic.nopic .mono{font-size:80px}
.phero-pic:after{content:"";position:absolute;left:0;right:0;bottom:0;height:22%;background:linear-gradient(transparent,rgba(30,24,36,.55));pointer-events:none}
.amb{position:absolute;right:12px;top:12px;display:inline-flex;gap:6px;align-items:center;padding:6px 11px;border-radius:999px;background:rgba(21,17,26,.88);border:1.5px solid var(--gold);color:var(--gold);font-size:14px;font-weight:700}
.phero-body{padding:0 4px 4px;min-width:0}
.phero-body h1{margin-bottom:8px}
.ctabox{margin-top:4px}.ctabox .btn{width:100%}
@media(min-width:820px){.phero{grid-template-columns:minmax(300px,380px) 1fr;gap:28px;padding:18px}.phero-pic,.phero-pic.nopic{aspect-ratio:2/3;align-self:start}.phero-body{padding:6px 6px 6px 0}.ctabox .btn{width:auto;min-width:320px}}
.subnav{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0 4px}
.subnav a{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border-radius:999px;font-weight:600;font-size:15px;color:var(--fg);text-decoration:none;border:1.5px solid transparent;background:linear-gradient(var(--bg2),var(--bg2)) padding-box,linear-gradient(120deg,var(--trust),rgba(184,151,255,.6)) border-box}
.subnav a:hover{color:#fff;background:linear-gradient(var(--bg3),var(--bg3)) padding-box,linear-gradient(120deg,var(--trust),var(--vio)) border-box}
.subnav a.mdh{color:#1b0f0d;background:linear-gradient(135deg,var(--cta),#ff8a6b) padding-box,linear-gradient(135deg,var(--cta),#ff8a6b) border-box}
article>.lead{margin-top:22px}

/* Model+Thema-Hero */
.mthero{display:grid;grid-template-columns:112px 1fr;gap:16px;align-items:center;padding:12px}
.mt-pic{position:relative;display:block;aspect-ratio:2/3;border-radius:12px;overflow:hidden;background:var(--bg3)}
.mt-pic img{width:100%;height:100%;object-fit:cover}.mt-pic .mono{position:absolute;inset:0;font-size:48px}
.mt-pic .rk{left:6px;top:6px;min-width:34px;height:34px;font-size:14px}
.mthero h1{font-size:clamp(26px,5vw,40px);margin-bottom:6px}
.mthero .chips-row{margin-bottom:0}
@media(min-width:720px){.mthero{grid-template-columns:150px 1fr;gap:24px;padding:16px}}

/* Porträt-Kacheln */
.tiles{display:grid;gap:12px;grid-template-columns:repeat(2,minmax(0,1fr));margin:14px 0 6px}
@media(min-width:640px){.tiles{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(min-width:900px){.tiles{grid-template-columns:repeat(auto-fill,minmax(176px,1fr));gap:16px}}
.tile{display:flex;flex-direction:column;background:var(--bg2);border:1px solid var(--line);border-radius:14px;overflow:hidden;text-decoration:none;color:var(--fg);transition:border-color .15s,transform .15s}
.tile:hover{border-color:var(--trust);color:var(--fg);transform:translateY(-2px)}
.tp{position:relative;display:block;aspect-ratio:2/3;background:var(--bg3);overflow:hidden}
.tp img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 15%}
.tp .mono{position:absolute;inset:0;font-size:64px}
.tb{display:flex;flex-direction:column;gap:2px;padding:10px 12px 12px;min-width:0}
.tb b{font-family:Jakarta,sans-serif;font-weight:800;font-size:16px;line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tm{display:flex;align-items:baseline;gap:7px;font-size:14px;color:var(--fg);line-height:1.35}
.t2{font-size:14px;color:var(--mut);line-height:1.35;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.themes .tp{aspect-ratio:3/4}
.themes .tp:after{content:"";position:absolute;inset:40% 0 0;background:linear-gradient(transparent,rgba(21,17,26,.92))}
.tname{position:absolute;left:12px;right:12px;bottom:10px;z-index:1;font-family:Jakarta,sans-serif;font-weight:800;font-size:19px;line-height:1.2;color:#fff;text-shadow:0 2px 8px rgba(0,0,0,.6)}
.themes .tm{color:var(--trust2)}
.mono{--g:#5a2f6e;display:flex;align-items:center;justify-content:center;width:100%;height:100%;font-family:Jakarta,sans-serif;font-weight:800;color:rgba(255,255,255,.95);text-shadow:0 4px 18px rgba(0,0,0,.35);background:radial-gradient(circle at 50% 38%,rgba(255,255,255,.16),transparent 52%),radial-gradient(circle at 100% 100%,rgba(63,208,201,.18),transparent 45%),linear-gradient(155deg,var(--g),#1c1522 85%)}
.mono.h1{--g:#1f6b6a}.mono.h2{--g:#8a3b4f}.mono.h3{--g:#3b4f8a}.mono.h4{--g:#7a5a24}.mono.h5{--g:#2f6e48}

/* So funktioniert's */
.steps{display:grid;grid-template-columns:1fr;gap:4px;padding:8px;margin:22px 0 0}
@media(min-width:820px){.steps{grid-template-columns:repeat(3,1fr)}}
.step{display:flex;gap:14px;align-items:flex-start;padding:12px}
.step b{display:block;font-family:Jakarta,sans-serif;font-size:17px;margin-bottom:2px}
.step p{margin:0;color:var(--mut);font-size:15px}
.step-n{display:flex;align-items:center;justify-content:center;width:40px;height:40px;flex:none;border-radius:12px;background:var(--trust-bg);border:1px solid rgba(63,208,201,.35);color:var(--trust);font-family:Jakarta,sans-serif;font-weight:800;font-size:18px}

/* Bonus-Kasten */
.bonusbox{display:grid;grid-template-columns:1fr;gap:16px;margin:30px 0 8px;padding:20px;border-radius:20px;background:radial-gradient(circle at 0 0,rgba(255,107,87,.24),transparent 60%),linear-gradient(135deg,#2c1a1f,#221a2b);border:1px solid rgba(255,107,87,.4)}
.bb-top{display:flex;align-items:center;gap:12px;margin-bottom:10px}.bb-top .kicker{margin:0;color:var(--cta2)}
.bb-ic{display:flex;align-items:center;justify-content:center;width:48px;height:48px;flex:none;border-radius:14px;background:linear-gradient(135deg,var(--cta),#ff9a72);color:#1b0f0d}
.bb-txt h2{margin:0 0 6px;font-size:clamp(22px,3vw,28px)}.bb-txt p{margin:0;color:#e4dbe9}
.bb-cta .btn{width:100%}
@media(min-width:820px){.bonusbox{grid-template-columns:1fr minmax(300px,360px);align-items:center;gap:28px;padding:26px 28px}}

/* Tabellen */
.tbl-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:14px;margin:12px 0 18px;background:var(--bg2)}
table{border-collapse:collapse;width:100%;font-size:15px}
th,td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:top}
th{background:var(--bg3);font-weight:600;color:var(--mut);font-size:14px;white-space:nowrap}
td.n,th.n{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
tr:last-child td{border-bottom:0}
tbody tr:hover td{background:rgba(255,255,255,.02)}
tr.self td{background:rgba(63,208,201,.1)}
.rnum{color:var(--trust);font-weight:700}
th button{all:unset;cursor:pointer;color:var(--mut);display:inline-flex;align-items:center;min-height:44px;min-width:44px}th button:after{content:" ↕";opacity:.5;margin-left:3px}
table.nw td{white-space:nowrap}td .badge{white-space:nowrap;margin-bottom:0}
td.pc{white-space:nowrap}
.bar{display:inline-block;vertical-align:middle;width:70px;height:8px;background:var(--bg4);border-radius:4px;overflow:hidden}.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--trust),var(--sky));border-radius:4px}
.tbl-det{margin:18px 0}
.tbl-det summary{gap:10px;color:var(--trust2)}
.tbl-det[open] summary{margin-bottom:4px}
.flt{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.flt label{font-size:14px;color:var(--mut)}
.flt input{min-height:44px;padding:8px 14px;border-radius:12px;border:1px solid var(--line);background:var(--bg2);color:var(--fg);font:inherit;flex:1 1 220px;max-width:360px}
.flt input:focus{outline:2px solid var(--trust);outline-offset:1px}

/* Monatsverlauf als waagerechte Balken */
.hchart{display:grid;gap:6px;margin:6px 0 4px}
.hchart div{display:grid;grid-template-columns:7.5em 1fr 2.2em;align-items:center;gap:10px;font-size:14px}
.hchart span{color:var(--mut);white-space:nowrap}
.hchart i{display:block;height:12px;width:max(var(--w),3px);border-radius:6px;background:linear-gradient(90deg,var(--ok),var(--trust))}
.hchart em{font-style:normal;font-weight:700;text-align:right;font-variant-numeric:tabular-nums}

/* Sonstiges */
.dq{font-size:14px;color:var(--mut);border-left:3px solid var(--trust);padding:10px 14px;background:var(--bg2);border-radius:0 12px 12px 0;margin:24px 0}
details{background:var(--bg2);border:1px solid var(--line);border-radius:14px;padding:0 16px;margin:8px 0}
summary{cursor:pointer;font-weight:600;min-height:48px;display:flex;align-items:center}
details p{margin:0 0 14px}
dl.sb{display:grid;grid-template-columns:max-content 1fr;gap:8px 18px;margin:0}dl.sb dt{color:var(--mut)}dl.sb dd{margin:0;font-weight:600}
.cta-box{background:radial-gradient(circle at 100% 0,rgba(255,107,87,.16),transparent 55%),linear-gradient(135deg,#2a1a1f,#22192a);border:1px solid rgba(255,107,87,.35);border-radius:20px;padding:20px;margin:28px 0}
.cta-box h3{font-size:21px;margin:0 0 6px}.cta-box .kicker{color:var(--cta2)}
.tv{margin:0;padding-left:1.4em;display:grid;gap:6px}.tv li span:first-child{font-weight:600}
.qa{margin:0;display:grid;gap:4px}.qa dt{font-weight:600;margin-top:8px}.qa dd{margin:0}
.src li{margin-bottom:6px}
.cols{display:grid;grid-template-columns:2fr 1fr;gap:28px}@media(max-width:860px){.cols{grid-template-columns:1fr}}
.toc a{display:block;color:var(--mut);text-decoration:none;padding:8px 0;min-height:44px}

/* Fuß */
footer{border-top:1px solid var(--line);padding:28px 0;color:var(--mut);font-size:14px;background:#120e16}
footer nav{display:flex;flex-wrap:wrap;gap:0 18px;margin-bottom:10px}footer a{color:var(--mut);min-height:44px;display:inline-flex;align-items:center}footer a:hover{color:var(--fg)}
.linkbtn{all:unset;cursor:pointer;color:var(--mut);text-decoration:underline;text-underline-offset:3px;min-height:44px;display:inline-flex;align-items:center;font-size:14px}

/* Altersabfrage, Einwilligung (nur Aussehen) */
.gate{position:fixed;inset:0;background:rgba(10,8,12,.97);z-index:100;display:flex;align-items:center;justify-content:center;padding:16px}
.gate .box{max-width:460px;background:var(--bg2);border:1px solid var(--line);border-radius:20px;padding:26px;text-align:center;box-shadow:0 20px 60px rgba(0,0,0,.5)}
.gate .row{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:16px}
.cc{position:fixed;left:0;right:0;bottom:0;z-index:90;background:var(--bg2);border-top:1px solid var(--line);padding:14px 0 calc(14px + env(safe-area-inset-bottom));box-shadow:0 -10px 30px rgba(0,0,0,.4)}
.cc .wrap{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap}.cc p{margin:0;font-size:14px;color:var(--mut);max-width:720px}.cc .row{display:flex;gap:8px;flex-wrap:wrap}

/* Sticky-CTA (mobil) und Nach-oben */
.sticky-cta{display:none}
.totop{position:fixed;right:14px;bottom:18px;z-index:21;display:flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:999px;background:#1d1723;border:1px solid var(--line);color:var(--trust);box-shadow:0 6px 18px rgba(0,0,0,.5);cursor:pointer;transition:opacity .2s,transform .2s}
.totop.off{opacity:0;transform:translateY(12px);pointer-events:none}
.totop:hover{border-color:var(--trust)}
@media(max-width:819px){
.sticky-cta{display:flex;flex-direction:column;gap:3px;position:fixed;left:8px;right:8px;bottom:max(8px,env(safe-area-inset-bottom));z-index:20;padding:8px;border-radius:18px;background:rgba(27,21,33,.97);border:1px solid var(--line);box-shadow:0 8px 28px rgba(0,0,0,.6);transition:transform .2s,opacity .2s}
.sticky-cta.off{transform:translateY(140%);opacity:0;pointer-events:none}
.sticky-cta .btn{flex-direction:column;gap:0;min-height:52px;padding:8px 14px;line-height:1.2}
.sticky-cta .btn b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.sticky-cta .btn small{font-size:14px;font-weight:600;opacity:.85}
.sticky-cta span{font-size:14px;color:var(--mut);text-align:center;line-height:1.3}
.has-sticky footer{padding-bottom:130px}
.totop.lift{bottom:var(--sticky-h,120px)}
}

/* Handy */
@media(max-width:640px){
header.top .wrap{gap:10px;padding-top:10px;padding-bottom:12px}
nav.main{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:7px;width:100%}
nav.main a{padding:0 6px;font-size:14px;gap:5px}
nav.main a.n-top{grid-column:span 3}nav.main a.n-akt{grid-column:span 5}nav.main a.n-th{grid-column:span 4}nav.main a.n-vgl{grid-column:span 4}nav.main a.n-live{grid-column:span 8}
nav.main .ic{width:16px;height:16px}
.bonusbar .wrap{gap:9px;min-height:44px}.bonusbar .bb-l{display:none}
.bonusbar small{display:block;white-space:normal;font-size:14px}
main{padding-top:8px}
h1{font-size:29px}
h2{margin-top:1.5em}
.lead{font-size:17px}
.tb{padding:9px 10px 11px}.tb b{font-size:15px}
.k{padding:11px 12px;column-gap:9px}.k b{font-size:20px}.k .ic{width:30px;height:30px;padding:6px}
.card{padding:14px}
th,td{padding:9px 10px}
}
@media(max-width:360px){nav.main a{font-size:14px;padding:0 4px}nav.main a .ic{display:none}}
.sec-head+.steps{margin-top:12px}

/* Profil-Abschnitte als Karten (Mobil-Überarbeitung 08.11., Muster dam) */
.subnav a{gap:7px}.subnav a .ic{color:var(--trust)}
@media(max-width:819px){.subnav{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin:14px -16px 0;padding:2px 16px 6px;-webkit-mask:linear-gradient(90deg,#000 88%,transparent)}.subnav::-webkit-scrollbar{display:none}.subnav a{flex:none}}
.lead.intro{margin:18px 0 0;padding:18px 18px 18px 20px;border-radius:var(--r);background:linear-gradient(135deg,rgba(63,208,201,.10),var(--bg2) 60%);border:1px solid var(--line);border-left:4px solid var(--trust);font-size:17px;line-height:1.65;color:#ece4f1}
.sec{background:var(--bg2);border:1px solid var(--line);border-radius:20px;padding:20px 18px;margin:18px 0 0}
.sec>.kicker{margin-top:0!important}.sec h2{margin-top:0}.sec h3{margin:22px 0 10px;font-size:17px}
.sec>p{color:#e8e0ee}.sec>p:last-child,.sec .note:last-child{margin-bottom:0}
.note{margin:10px 0 0}
/* Vorlieben-Raster */
.vg{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:16px 0 4px}
@media(min-width:720px){.vg{grid-template-columns:repeat(3,minmax(0,1fr))}}
.vgi{display:flex;flex-direction:column;gap:3px;padding:11px 12px;border-radius:14px;background:var(--bg3);border:1px solid var(--line);color:var(--fg);text-decoration:none;min-width:0;min-height:44px}
a.vgi{border-color:rgba(63,208,201,.38)}a.vgi:hover{border-color:var(--trust);color:var(--fg)}
.vgl{font-size:14px;font-weight:600;line-height:1.3;color:var(--fg);overflow-wrap:anywhere}a.vgi .vgl{color:var(--trust2)}
.vgi b{font-family:Jakarta,sans-serif;font-weight:800;font-size:20px;line-height:1.2}.vgi b small{font-family:Inter,sans-serif;font-size:13px;font-weight:600;color:var(--mut)}
.vgi .bar{width:100%;height:6px;margin:2px 0}
.vgr{font-size:13px;color:var(--mut);line-height:1.3}
.vgi:first-child{grid-column:1/-1;background:linear-gradient(135deg,rgba(114,184,255,.14),var(--bg3) 70%)}.vgi:first-child b{font-size:24px}
/* Fragen-Karten */
.qcards{display:grid;gap:8px;margin:16px 0 0}
@media(min-width:720px){.qcards{grid-template-columns:repeat(2,minmax(0,1fr))}}
.qc{padding:13px 14px;border-radius:14px;background:var(--bg3);border:1px solid var(--line)}
.qc b{display:block;color:var(--trust2);font-weight:700;font-size:15px;line-height:1.35;margin-bottom:4px}.qc p{margin:0;font-size:15px;line-height:1.5}
/* Videoliste */
.vlist{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.vlist li{display:flex;gap:12px;align-items:flex-start;padding:11px 12px;border-radius:14px;background:var(--bg3);border:1px solid var(--line)}
.vn{flex:none;display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:9px;background:var(--trust-bg);color:var(--trust);font-family:Jakarta,sans-serif;font-weight:800;font-size:15px}
.vt{display:flex;flex-direction:column;gap:3px;min-width:0;font-weight:600;font-size:15px;line-height:1.4;overflow-wrap:anywhere}
.vt small{font-weight:400;font-size:13px;color:var(--mut)}
/* Medien-Karten */
.srcs{display:grid;gap:10px;margin:14px 0 0}
@media(min-width:720px){.srcs{grid-template-columns:repeat(2,minmax(0,1fr))}}
.srcc{display:flex;flex-direction:column;gap:6px;padding:14px;border-radius:14px;background:var(--bg3);border:1px solid var(--line)}
.srcm{font-size:13px;color:var(--mut);line-height:1.4}.srcm b{color:var(--cta2);font-weight:700}
.srcc p{margin:0;font-size:15px;line-height:1.5}
.srcc a{display:inline-flex;align-items:center;min-height:44px;font-weight:700;text-decoration:none;align-self:flex-start}
.sec .kz{margin-top:16px}
.sec dl.sb{margin-top:6px}
@media(max-width:640px){.sec{padding:18px 14px;border-radius:18px}.lead.intro{padding:16px 16px 16px 18px;font-size:16.5px}.hchart div{grid-template-columns:6.8em 1fr 2em;gap:8px}}

.sec details{background:var(--bg3)}.sec .tiles{margin-bottom:0}.sec .chips{margin-bottom:0}

/* Ranglisten als Zeilen statt Tabellen (mobil) */
.rlist{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:8px}
.rlist li>a,.rlist li>div{display:flex;align-items:center;gap:12px;min-height:56px;padding:10px 12px;border-radius:14px;background:var(--bg3);border:1px solid var(--line);color:var(--fg);text-decoration:none}
.rlist li>a:hover{border-color:var(--trust);color:var(--fg)}
.rlist li.self>div{border-color:var(--trust);background:linear-gradient(135deg,rgba(63,208,201,.14),var(--bg3) 70%)}
.rn{flex:none;display:flex;align-items:center;justify-content:center;min-width:34px;height:34px;padding:0 6px;border-radius:10px;background:var(--trust-bg);color:var(--trust);font-family:Jakarta,sans-serif;font-weight:800;font-size:15px}
.rb{display:flex;flex-direction:column;min-width:0;flex:1}.rb b{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rlist a .rb b{color:var(--trust2)}
.rb small{font-size:13px;color:var(--mut);line-height:1.35}
.rv{flex:none;display:flex;flex-direction:column;align-items:flex-end;font-family:Jakarta,sans-serif;font-weight:800;font-size:18px;line-height:1.1}.rv small{font-family:Inter,sans-serif;font-weight:400;font-size:12px;color:var(--mut)}
.m-only{display:none}@media(max-width:719px){.m-only{display:grid}.d-only{display:none}}

/* === dam-Muster 08.11.: Model-Karten, kompakte Zeilen, farbige Abschnitte === */
.mc{background:var(--bg2);border:1px solid var(--line);border-radius:20px;padding:14px;display:flex;flex-direction:column;gap:12px}
.mc-top{display:grid;grid-template-columns:104px 1fr;gap:14px;align-items:center}
.mc-pic{position:relative;display:block;aspect-ratio:4/5;border-radius:14px;overflow:hidden;background:var(--bg3)}
.mc-pic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 15%}.mc-pic .mono{position:absolute;inset:0;font-size:44px}
.mc-pic .rk{left:6px;top:6px;min-width:32px;height:32px;font-size:14px}
.mc-h{min-width:0}.mc-h h3{margin:0 0 4px;font-size:22px;font-weight:800}.mc-h h3 a{color:var(--fg);text-decoration:none}
.mc-meta{margin:0 0 6px;font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--trust)}
.mc-h .badge{margin:0;font-size:13px}
.mc-z{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.mc-z div{background:var(--bg3);border-radius:12px;padding:9px 10px;min-width:0}.mc-z b{display:block;font-family:Jakarta,sans-serif;font-weight:800;font-size:19px;line-height:1.2}.mc-z span{font-size:13px;color:var(--mut);line-height:1.25;display:block}
.mc-l{margin:0;font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--mut)}
.pref{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.pref span{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:44px;padding:8px 12px;border-radius:12px;border:1px solid var(--line);background:var(--bg);font-size:14px;line-height:1.25;min-width:0}
.pref b{color:var(--trust);font-weight:700;font-variant-numeric:tabular-nums}
.mc-b{display:grid;gap:8px}.mc-b .btn{width:100%;min-height:48px}
.mc-ad{margin:-4px 0 0;font-size:13px;color:var(--mut)}
.mcards{display:grid;gap:14px;margin:14px 0}
@media(min-width:760px){.mcards{grid-template-columns:repeat(2,minmax(0,1fr))}.mc-b{grid-template-columns:1fr 1fr}}
@media(min-width:1100px){.mcards{grid-template-columns:repeat(3,minmax(0,1fr))}}
.mrows{display:grid;gap:8px;margin:14px 0}
@media(min-width:760px){.mrows{grid-template-columns:repeat(2,minmax(0,1fr))}}
.mr{display:flex;align-items:center;gap:12px;padding:8px 12px 8px 8px;min-height:72px;border-radius:16px;background:var(--bg2);border:1px solid var(--line);color:var(--fg);text-decoration:none}
.mr:hover{border-color:var(--trust);color:var(--fg)}
.mr-pic{position:relative;flex:none;width:56px;height:56px;border-radius:12px;overflow:hidden;background:var(--bg3)}
.mr-pic img{width:100%;height:100%;object-fit:cover;object-position:50% 15%}.mr-pic .mono{position:absolute;inset:0;font-size:24px}
.mr-rk{flex:none;min-width:30px;text-align:center;font-family:Jakarta,sans-serif;font-weight:800;font-size:17px;color:var(--trust)}
.mr-b{display:flex;flex-direction:column;min-width:0;flex:1}.mr-b b{font-weight:700;font-size:16px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mr-b small{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--mut);line-height:1.35;flex-wrap:wrap}
.mr-go{flex:none;font-size:24px;color:var(--mut);line-height:1}
/* farbige Abschnitte */
.sec{--sc:var(--trust);border-top:3px solid var(--sc)}
.sec>.kicker{color:var(--sc)}
.sec h2{display:flex;align-items:center;gap:10px}
.sec h2 .hi{flex:none;display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:11px;background:color-mix(in srgb,var(--sc) 18%,transparent);color:var(--sc)}
.sec h3{color:var(--sc)}
#schwerpunkte{--sc:var(--rose)}#persoenlich{--sc:var(--vio)}#werdegang{--sc:var(--gold)}#medien{--sc:var(--sky)}#katalog{--sc:var(--ok)}#steckbrief{--sc:var(--trust)}#aehnlich{--sc:var(--cta2)}#alternativen{--sc:var(--ok)}#faq{--sc:var(--trust)}
.sec .qc b{color:var(--sc)}.sec .vn{background:color-mix(in srgb,var(--sc) 16%,transparent);color:var(--sc)}
.pref.big{margin:16px 0 4px}
@media(min-width:720px){.pref.big{grid-template-columns:repeat(3,minmax(0,1fr))}}
a.pl{color:var(--trust2);text-decoration:none;border-color:rgba(63,208,201,.4)}a.pl:hover{border-color:var(--trust)}
.sub-h{margin:22px 0 4px;font-size:18px;color:var(--trust2)}
/* Videokarten mit CSS-Cover (L156) */
.vstrip{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;margin:12px -16px 4px;padding:2px 16px 10px;scrollbar-width:none}.vstrip::-webkit-scrollbar{display:none}
.sec .vstrip{margin-left:-18px;margin-right:-18px;padding-left:18px;padding-right:18px}
@media(max-width:640px){.sec .vstrip{margin-left:-14px;margin-right:-14px;padding-left:14px;padding-right:14px}}
.vc{flex:none;width:min(72vw,280px);scroll-snap-align:start;display:flex;flex-direction:column;gap:6px;color:var(--fg);text-decoration:none}
.vc:hover{color:var(--fg)}.vc:hover .vc-cv{border-color:var(--rose)}
.vc-cv{--a:#8a2a5c;--b:#2a1240;position:relative;display:block;aspect-ratio:16/9;border-radius:14px;overflow:hidden;border:3px solid color-mix(in srgb,var(--rose) 55%,transparent);background:radial-gradient(circle at 78% 22%,rgba(255,255,255,.18),transparent 40%),repeating-linear-gradient(135deg,rgba(255,255,255,.035) 0 10px,transparent 10px 20px),linear-gradient(135deg,var(--a),var(--b))}
.vc-cv.h1{--a:#9a3b2a;--b:#3a1420}.vc-cv.h2{--a:#2a5a8a;--b:#1a1238}.vc-cv.h3{--a:#7a2a8a;--b:#200f2e}.vc-cv.h4{--a:#a3374f;--b:#2b0f22}.vc-cv.h5{--a:#1f6b6a;--b:#14222e}
.vc-pl{position:absolute;left:50%;top:44%;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:50%;background:rgba(0,0,0,.45);color:#fff;border:2px solid rgba(255,255,255,.75)}
.vc-tt{position:absolute;left:10px;right:10px;top:8px;font-family:Jakarta,sans-serif;font-weight:800;font-size:13px;line-height:1.2;color:#fff;text-transform:uppercase;letter-spacing:.02em;text-shadow:0 2px 6px rgba(0,0,0,.6);overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.vc-v{position:absolute;left:8px;bottom:8px;padding:3px 9px;border-radius:999px;background:var(--live);color:#fff;font-size:12px;font-weight:800}
.vc-18{position:absolute;right:8px;bottom:8px;padding:3px 8px;border-radius:8px;background:rgba(0,0,0,.6);color:#fff;font-size:12px;font-weight:800}
.vc-t{font-weight:700;font-size:15px;line-height:1.35;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.vc-d{font-size:13px;color:var(--mut)}
.mc .vstrip{margin:0 -14px;padding:0 14px 4px}.mc .vc{width:min(62vw,230px)}
/* Profil-Hero kompakter wie dam */
.phero-pic{aspect-ratio:1/1;max-height:360px}
@media(min-width:820px){.phero-pic,.phero-pic.nopic{aspect-ratio:2/3;max-height:none}}
.vsec{margin:22px 0 0}.vh2{margin:0 0 2px;font-size:22px}.vsec .mut{margin:0}
.btn.wide{width:100%;margin-top:6px}
.mcards{grid-template-columns:minmax(0,1fr)}.mc{min-width:0}.sec,.vsec{min-width:0}
@media(min-width:760px){.mcards{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(min-width:1100px){.mcards{grid-template-columns:repeat(3,minmax(0,1fr))}}
.pref span,.pref a{display:flex;align-items:center;justify-content:space-between;gap:6px;min-width:0}
.pref span>:not(b),.pref{overflow-wrap:anywhere}.pref b{flex:none}
.pref span,.pref a.pl{font-size:13.5px;padding:8px 10px}
.mr-b small{display:block}.mr-b small .dot{display:inline-block;vertical-align:middle;margin:-2px 5px 0 0}
.mc-z b{font-size:17px}
.pref a.pl{min-height:44px;border-radius:12px;border:1px solid rgba(63,208,201,.45);background:var(--bg);line-height:1.25}
.vstrip{scroll-padding-inline:16px}.sec .vstrip{scroll-padding-inline:18px}.sec .k b{font-size:18px}.sec .k.wide b{font-size:18px}
.phero-pic{max-height:300px}@media(min-width:820px){.phero-pic{max-height:none}}