:root{--plum:#24123A;--txt:#3B2E4A;--mut:#6B5C7A;--vio:#5B2A86;--lila:#F1E9FA;--gold:#F2B33D;--bg:#FFFFFF;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--plum:#F4ECFB;--txt:#E6DCEF;--mut:#BCA9CC;--lila:#2E1C40;--bg:#1A0F26}}
:root[data-theme="dark"]{--plum:#F4ECFB;--txt:#E6DCEF;--mut:#BCA9CC;--lila:#2E1C40;--bg:#1A0F26}
*{box-sizing:border-box} html,body{overflow-x:hidden} body{margin:0;background:var(--bg);color:var(--txt);font-family:Poppins,system-ui,sans-serif}
.w{max-width:1240px;margin:0 auto;padding:0 4vw}
header{display:flex;align-items:center;justify-content:space-between;padding:18px 0;gap:16px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none} .brand img{width:96px;height:auto}
.brand b{font-size:30px;font-weight:800;color:var(--plum);line-height:1} .brand b span{color:var(--gold)}
.brand small{display:block;font-size:12.5px;color:var(--mut);margin-top:3px}
nav{display:flex;align-items:center;gap:26px;font-size:14.5px;font-weight:500} nav a{color:var(--plum);text-decoration:none}
.btn{background:var(--gold);color:#24123A;font-weight:700;text-decoration:none;border-radius:12px;padding:12px 22px;transition:transform .18s,box-shadow .18s}
.btn:hover{transform:translateY(-3px);box-shadow:0 10px 22px rgba(242,179,61,.45)}
.hero{position:relative;padding:8px 0 40px}
.heroimg{width:100%;height:auto;display:block;border-radius:22px;transition:filter .6s,opacity .6s;animation:spring .9s cubic-bezier(.18,.9,.32,1.35) both}
@keyframes spring{0%{opacity:0;transform:translateY(40px) scale(.95)}100%{opacity:1;transform:none}}
.hero.dim .heroimg{filter:saturate(.35) brightness(1.15);opacity:.45}
.brow{position:absolute;z-index:6;top:22px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.92);padding:8px 10px 8px 16px;border-radius:999px;box-shadow:0 10px 26px rgba(60,20,90,.22)}
.look{color:#5B2A86;font-size:13px;font-weight:500;white-space:nowrap;margin-right:4px} .look b{font-weight:600;color:#B56A00;margin-left:4px}
.bb{width:40px;height:40px;border-radius:50%;padding:0;border:3px solid #F2B33D;background:#fff;cursor:pointer;overflow:hidden;transition:transform .3s,opacity .3s}
.bb:nth-child(odd){border-color:#8A4FC7}
.bb img{width:100%;height:100%;object-fit:cover;filter:blur(1.2px)}
.bb.next{animation:blubber .7s ease-in-out infinite}
@keyframes blubber{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-6px) scale(1.22)}}
.bb.open{opacity:.35;transform:scale(.82)} .bb:hover{transform:scale(1.18);opacity:1}
.pf{position:absolute;z-index:5;left:30%;top:12%;width:40%;max-width:480px;height:auto;opacity:0;pointer-events:none;filter:drop-shadow(0 18px 26px rgba(60,20,90,.25))}
.pf.play{animation:fb 10s cubic-bezier(.22,.85,.24,1) both}
@keyframes fb{0%{opacity:0;transform:translate(var(--sx),var(--sy)) scale(.1)}12%{opacity:1}24%{transform:translate(0,-8px) scale(1.04) rotate(-2deg)}32%{transform:none}86%{opacity:1;transform:none}100%{opacity:0;transform:translate(var(--sx),var(--sy)) scale(.1)}}
.band{background:var(--lila);border-radius:24px;padding:22px;margin-bottom:48px}
.flyers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 18px}
.fly{width:100%;height:auto;display:block;opacity:0;transition:transform .9s cubic-bezier(.18,.9,.32,1.35),opacity .5s}
.fly.l{transform:translateX(-120px) rotate(-14deg) scale(.7)} .fly.r{transform:translateX(120px) rotate(14deg) scale(.7)} .fly.b{transform:translateY(120px) rotate(6deg) scale(.6)}
.fly.in{opacity:1;transform:none} .fly.in:hover{transform:scale(1.05) rotate(-2deg);transition:transform .25s}
@media(max-width:1000px){.flyers{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:820px){nav a:not(.btn){display:none} .brow{top:10px;gap:6px;padding:6px 8px 6px 12px} .look b{display:none} .look{font-size:11.5px} .bb{width:28px;height:28px;border-width:2px} .pf{left:20%;width:60%;top:16%}}
@media(max-width:560px){.flyers{grid-template-columns:1fr} .brand b{font-size:24px} .brand img{width:66px}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important} .fly{opacity:1;transform:none}}

.hero{display:flex;gap:16px;align-items:stretch}
.stage{position:relative;flex:1;min-width:0}
.hero .brow{position:static;transform:none;flex-direction:column;justify-content:center;gap:12px;padding:16px 10px;border-radius:999px;align-self:center}
.hero .look{writing-mode:vertical-rl;transform:rotate(180deg);margin:0 0 4px}
.hero .bb{width:48px;height:48px}
.stage.dim .heroimg{filter:saturate(.35) brightness(1.15);opacity:.45}
@media(max-width:820px){.hero{flex-direction:column}.hero .brow{order:-1;flex-direction:row;padding:6px 10px}.hero .look{writing-mode:horizontal-tb;transform:none}.hero .bb{width:30px;height:30px}}

.heroimg{animation:fadein 1.2s ease both}
@keyframes fadein{from{opacity:0}to{opacity:1}}
.stage.dim .heroimg{filter:saturate(.7) brightness(1.06);opacity:.75}
.heroimg{transition:filter 1.2s ease,opacity 1.2s ease}
.bb,.bb:nth-child(odd){border:2px solid #D9C8EA;animation:none!important;transition:border-color .6s,box-shadow .6s,opacity .6s}
.bb.next{border-color:#F2B33D;box-shadow:0 0 0 4px rgba(242,179,61,.25);transform:none}
.bb.open{opacity:.45;transform:none}
.bb:hover{transform:none;border-color:#8A4FC7}
.bb img{filter:blur(.8px) saturate(.9)}
.pf{filter:drop-shadow(0 10px 18px rgba(60,20,90,.15))}
.pf.play{animation:calm 11s ease both}
@keyframes calm{0%{opacity:0;transform:translate(var(--sx),var(--sy)) scale(.15)}14%{opacity:1;transform:none}86%{opacity:1;transform:none}100%{opacity:0;transform:scale(.96)}}

.screen{position:absolute;left:28.7%;top:21.3%;width:52.8%;height:71.5%;transform:rotate(1deg);background:#fff;border-radius:6px;opacity:0;transition:opacity 1s ease;z-index:5;display:flex;align-items:center;justify-content:center;overflow:visible}
.stage.dim .screen{opacity:1}
.stage.dim .heroimg{filter:none;opacity:1}
.screen .pf{position:static;width:auto;height:94%;max-width:none;filter:none}

.screen{left:0;top:0;width:100%;height:100%;transform:none;border-radius:0;clip-path:polygon(26.8% 20.9%,78.1% 24.0%,81.9% 90.6%,28.6% 92.4%)}
.pf.scr{position:absolute;left:54.3%;top:56.8%;height:62%;width:auto;max-width:none;z-index:6;margin:0;translate:-50% -50%;filter:none}
@media(max-width:820px){.pf.scr{left:54.3%;top:56.8%;width:auto;height:62%}}
.intro{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:4px 0 16px;flex-wrap:wrap}.intro .h1i{margin:0;font-size:clamp(17px,2vw,22px);color:var(--plum);font-weight:500;line-height:1.3}.intro .h1i b{font-weight:700;color:var(--vio)}.intro p{margin:0;font-size:clamp(17px,2vw,22px);color:var(--plum);font-weight:500}.intro p b{font-weight:700;color:var(--vio)}

.w{max-width:1680px;padding:0 3vw}
.hero{gap:10px}
.hero .brow{padding:10px 6px;gap:8px;background:rgba(255,255,255,.75);box-shadow:0 4px 12px rgba(60,20,90,.12)}
.hero .look{writing-mode:horizontal-tb;transform:none;margin:0 0 2px;font-size:11px}
.hero .look b{margin:0;color:#8A6BA8;font-weight:500}
.hero .bb{width:26px;height:26px;border-width:2px;position:relative;cursor:pointer}
.hero .bb::after{content:"";position:absolute;inset:-5px;border-radius:50%;border:2px solid transparent;transition:border-color .3s}
.hero .bb:hover{transform:scale(1.35)!important;opacity:1;border-color:#8A4FC7}
.hero .bb:hover::after{border-color:rgba(138,79,199,.35)}
.hero .bb.next::after{border-color:rgba(242,179,61,.5);animation:ring 2s ease-out infinite}
@keyframes ring{0%{transform:scale(.9);opacity:1}100%{transform:scale(1.5);opacity:0}}
.hero .bb[data-tip]:hover::before{content:attr(data-tip);position:absolute;right:140%;top:50%;transform:translateY(-50%);background:#24123A;color:#fff;font-size:12px;white-space:nowrap;padding:5px 10px;border-radius:8px}
@media(max-width:820px){
 .w{padding:0 4vw}
 header{padding:12px 0}
 .intro{flex-direction:column;align-items:stretch;text-align:center;gap:12px}
 .intro .btn{text-align:center}
 .hero{flex-direction:column;gap:12px}
 .stage{margin:0 -4vw}
 .heroimg{border-radius:0}
 .hero .brow{order:2;flex-direction:row;align-self:center;padding:6px 10px;gap:10px}
 .hero .bb{width:24px;height:24px}
 .hero .bb[data-tip]:hover::before{display:none}
 .screen{clip-path:none!important;background:rgba(255,255,255,.88)}
 .pf.scr{left:50%!important;top:50%!important;height:92%!important}
}

.hero{justify-content:center}
.stage{flex:0 1 auto;width:min(100%,calc((100vh - 220px) * 1.7768))}
@media(max-width:820px){.stage{width:auto}}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.sec{max-width:1180px;margin:0 auto;padding:72px 0 8px}
.kicker{display:inline-block;background:var(--lila);color:var(--vio);font-weight:600;font-size:13px;padding:6px 14px;border-radius:999px;margin-bottom:14px}
.sec h2{font-size:clamp(28px,3.6vw,44px);font-weight:800;color:var(--plum);line-height:1.12;margin:0 0 18px;max-width:22ch}
.big{font-size:clamp(16px,1.5vw,19px);line-height:1.7;max-width:62ch;margin:0 0 16px}
.big b{color:var(--plum)}
.pains{display:grid;gap:10px;margin:22px 0 28px;max-width:820px}
.pain{background:var(--lila);border-radius:14px;padding:16px 20px;font-size:16px;line-height:1.55;display:flex;gap:16px;align-items:baseline}
.pain span{font-weight:800;color:var(--gold);font-size:20px}
.vs{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.vs-col{border-radius:18px;padding:22px 26px}
.vs-col h3{margin:0 0 10px;font-size:20px}
.vs-col ul{margin:0;padding:0;list-style:none}.vs-col li{padding:8px 0 8px 28px;position:relative;line-height:1.5;border-bottom:1px solid rgba(91,42,134,.1)}
.vs-col.old{background:#F4F1F6;color:#7A6E85}.vs-col.old h3{color:#7A6E85}.vs-col.old li::before{content:"✕";position:absolute;left:4px;color:#B9A9C8}
.vs-col.new{background:var(--plum);color:#F4ECFB}.vs-col.new h3{color:var(--gold)}.vs-col.new li::before{content:"✓";position:absolute;left:4px;color:var(--gold);font-weight:800}
.three{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:22px}
.card{border-radius:20px;padding:24px;background:var(--lila)}
.card img,.mod img,.extra img{width:84px;height:84px;object-fit:contain;display:block;margin-bottom:8px}
.card h3,.mod h3{margin:0 0 8px;font-size:19px;color:var(--plum)}
.card p{margin:0;line-height:1.65}
.card.no{background:#FFF6E4}.card.res{background:var(--plum);color:#F4ECFB}.card.res h3,.card.res b{color:var(--gold)}
.feature,.start,.story{display:grid;grid-template-columns:220px 1fr;gap:40px;align-items:center}
.feat-img{width:100%;max-width:220px;height:auto;filter:drop-shadow(0 18px 28px rgba(91,42,134,.18))}
.checks2{list-style:none;padding:0;margin:8px 0 0;display:grid;gap:8px}
.checks2 li{padding-left:30px;position:relative;line-height:1.55}.checks2 li::before{content:"✓";position:absolute;left:4px;top:0;color:var(--vio);font-weight:800}
.mods{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:22px}
.mod{background:var(--bg);border:1.5px solid var(--lila);border-radius:20px;padding:22px;transition:transform .25s,box-shadow .25s,border-color .25s}
.mod:hover{transform:translateY(-4px);border-color:var(--gold);box-shadow:0 14px 30px rgba(91,42,134,.12)}
.mod ul{margin:0;padding-left:18px;line-height:1.6;font-size:14.5px}
.tbl-wrap{overflow-x:auto;margin-top:18px}
.cmp{width:100%;border-collapse:separate;border-spacing:0;min-width:640px;font-size:15px}
.cmp th,.cmp td{padding:14px 16px;text-align:left;vertical-align:top;border-bottom:1px solid var(--lila)}
.cmp th{font-size:13px;text-transform:uppercase;letter-spacing:.04em;color:var(--mut)}
.cmp td:first-child{font-weight:600;color:var(--plum);width:30%}
.cmp td:nth-child(2){color:var(--mut)}
.cmp .me{background:rgba(242,179,61,.12);color:var(--plum);font-weight:600}
.cmp th.me{color:#B56A00;border-radius:12px 12px 0 0}
.steps3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:10px}
.steps3>div{background:var(--lila);border-radius:18px;padding:20px}
.steps3 b{display:inline-flex;width:34px;height:34px;border-radius:50%;background:var(--vio);color:#fff;align-items:center;justify-content:center;font-weight:700}
.steps3 h3{margin:10px 0 6px;color:var(--plum)}.steps3 p{margin:0;line-height:1.6;font-size:15px}
.prices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:24px;align-items:stretch}
.price{position:relative;border:1.5px solid var(--lila);border-radius:22px;padding:28px 24px;display:flex;flex-direction:column}
.price.top{border:2px solid var(--gold);background:linear-gradient(180deg,rgba(242,179,61,.08),transparent 60%)}
.badge{position:absolute;top:-13px;left:24px;background:var(--gold);color:#24123A;font-size:12px;font-weight:700;padding:4px 12px;border-radius:999px}
.price h3{margin:0;font-size:20px;color:var(--plum)}
.amt{font-size:40px;font-weight:800;color:var(--plum);margin:10px 0 2px}.amt small{font-size:15px;font-weight:500;color:var(--mut);margin-left:6px}
.price p{margin:0 0 14px;color:var(--mut)}
.price ul{list-style:none;padding:0;margin:0 0 22px;flex:1}.price li{padding:6px 0 6px 26px;position:relative}.price li::before{content:"✓";position:absolute;left:2px;color:var(--vio);font-weight:800}
.price .btn{text-align:center}
.fine{font-size:14px;color:var(--mut);margin:14px 0 26px}
.extras{display:grid;gap:12px}
.extra{display:grid;grid-template-columns:72px 1fr auto;gap:18px;align-items:center;background:var(--lila);border-radius:18px;padding:14px 22px}
.extra img{width:64px;height:64px;margin:0}
.extra h3{margin:0 0 2px;font-size:17px;color:var(--plum)}.extra p{margin:0;font-size:14.5px;line-height:1.5}
.extra>b{font-size:22px;font-weight:800;color:var(--plum);text-align:right;white-space:nowrap}.extra>b small{display:block;font-size:12.5px;font-weight:500;color:var(--mut)}
blockquote{margin:0 0 12px;font-size:clamp(17px,1.7vw,21px);line-height:1.6;color:var(--plum);font-style:italic;border-left:4px solid var(--gold);padding-left:20px}
.sig2{margin:0 0 18px;color:var(--mut)}
.faq{display:grid;gap:10px;max-width:860px;margin-top:18px}
.faq details{background:var(--lila);border-radius:14px;padding:4px 20px}
.faq summary{cursor:pointer;font-weight:600;color:var(--plum);padding:14px 0;list-style:none;position:relative;padding-right:30px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:0;top:10px;font-size:22px;color:var(--vio);transition:transform .3s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq p{margin:0 0 16px;line-height:1.65}
.cta{text-align:center;background:var(--plum);color:#F4ECFB;border-radius:28px;padding:56px 6vw 56px;margin-top:72px;margin-bottom:24px}
.cta h2{color:#fff;margin:0 auto 12px;max-width:none}.cta .big{margin:0 auto 26px}
.cta .feat-img{max-width:150px;margin:0 auto 8px;display:block}
.ctas{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.cbtn{display:flex;align-items:center;gap:10px;background:#fff;color:#24123A;text-decoration:none;font-weight:700;border-radius:16px;padding:8px 22px 8px 10px;transition:transform .2s}
.cbtn:hover{transform:translateY(-3px)}.cbtn img{width:44px;height:44px}
.foot{text-align:center;padding:26px 0 40px;color:var(--mut);font-size:14px}.foot b{color:var(--plum)}.foot b span{color:var(--gold)}.foot a{color:var(--vio)}
.rv{opacity:0;transform:translateY(34px);transition:opacity .8s ease,transform .8s ease}.rv.in{opacity:1;transform:none}
@media(max-width:900px){.three,.mods,.prices,.steps3,.vs{grid-template-columns:1fr}.feature,.start,.story{grid-template-columns:1fr;gap:10px}.feat-img{max-width:140px}.sec{padding-top:52px}.extra{grid-template-columns:52px 1fr;}.extra img{width:48px;height:48px}.extra>b{grid-column:2;text-align:left}}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none}}

@media(max-width:700px){.cmp{min-width:0}.cmp thead{display:none}.cmp tr{display:block;background:var(--lila);border-radius:14px;margin-bottom:10px;padding:12px 14px}.cmp td{display:block;border:0;padding:3px 0;width:auto!important}.cmp td:nth-child(2)::before{content:"Die üblichen: ";font-weight:600}.cmp td.me{background:none;color:var(--vio)}}
/* Funktionsseite */
.fhead{max-width:1180px;margin:0 auto;padding:24px 0 8px}
.back{display:inline-block;color:var(--vio);text-decoration:none;font-weight:600;margin-bottom:18px}
.fh1{font-size:clamp(32px,4.2vw,52px);font-weight:800;color:var(--plum);line-height:1.1;margin:0 0 14px}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 0;position:sticky;top:0;z-index:20;background:var(--bg);padding:12px 0}
.chips a{background:var(--lila);color:var(--vio);text-decoration:none;font-size:14px;font-weight:600;padding:8px 14px;border-radius:999px;transition:background .2s,color .2s}
.chips a:hover{background:var(--gold);color:#24123A}
.fsec{max-width:1180px;margin:0 auto;padding:56px 0 8px;display:grid;grid-template-columns:200px 1fr;gap:32px;scroll-margin-top:70px}
.fside{position:sticky;top:80px;align-self:start}
.fside img{width:120px;height:120px;object-fit:contain;display:block;filter:drop-shadow(0 12px 20px rgba(91,42,134,.16))}
.fside h2{font-size:26px;font-weight:800;color:var(--plum);line-height:1.15;margin:8px 0 0}
.fgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.fbox{background:var(--lila);border-radius:18px;padding:20px 22px}
.fbox h3{margin:0 0 8px;font-size:18px;color:var(--plum)}
.fbox ul{margin:0;padding-left:18px;line-height:1.6;font-size:15px}
.fbox li{margin:3px 0}.fbox b{color:var(--plum)}
.fbox.yes{background:var(--plum);color:#F4ECFB}.fbox.yes h3,.fbox.yes b{color:var(--gold)}
.fbox.no{background:#FFF6E4}
.note{margin:12px 0 0;font-weight:600;color:var(--plum)}
.morelink{display:inline-block;margin-top:22px;font-weight:700;color:var(--vio);text-decoration:none;border-bottom:2px solid var(--gold);padding-bottom:2px}
@media(max-width:900px){.fsec{grid-template-columns:1fr;gap:10px}.fside{position:static;display:flex;align-items:center;gap:14px}.fside img{width:72px;height:72px}.fside h2{margin:0}.fgrid{grid-template-columns:1fr}.chips{flex-wrap:nowrap;overflow-x:auto}.chips a{white-space:nowrap}}
nav.chips a{display:inline-block!important}
header .btn{white-space:nowrap}
@media(max-width:420px){header .btn{padding:10px 14px;font-size:14px}.brand small{display:none}}

/* ===== Navigation, immer sichtbar ===== */
.skip{position:absolute;left:-9999px;top:0;background:var(--gold);color:#24123A;padding:10px 16px;z-index:200;border-radius:0 0 10px 0;font-weight:700}
.skip:focus{left:0}
header.topnav{position:sticky;top:0;z-index:100;display:block;padding:0;background:#24123A;box-shadow:0 6px 24px rgba(36,18,58,.25);transition:box-shadow .3s}
.tn-in{max-width:1680px;margin:0 auto;padding:0 3vw;height:84px;display:flex;align-items:center;gap:22px;transition:height .3s}
.topnav.small .tn-in{height:62px}
.tn-brand{display:flex;align-items:center;gap:10px;text-decoration:none;flex-shrink:0}
.tn-brand img{width:78px;height:auto;transition:width .3s}
.topnav.small .tn-brand img{width:58px}
.tn-brand b{display:block;font-size:26px;font-weight:800;color:#fff;line-height:1}.tn-brand b i{font-style:normal;color:var(--gold)}
.tn-brand small{display:block;font-size:12px;color:#CBB7DD;margin-top:3px;transition:opacity .3s}
.topnav.small .tn-brand small{opacity:0;height:0;margin:0;overflow:hidden}
.tn-menu{display:flex;align-items:center;gap:4px;margin-left:auto}
.tn-menu .mi{display:inline-flex;align-items:center;gap:4px;color:#EADDF6;text-decoration:none;font:600 15px Poppins,sans-serif;padding:10px 14px;border-radius:12px;background:none;border:0;cursor:pointer;position:relative;transition:background .2s,color .2s}
.tn-menu .mi:hover,.tn-menu .mi:focus-visible{background:rgba(255,255,255,.1);color:#fff}
.tn-menu .mi.on{color:var(--gold)}
.tn-menu .mi.on::after{content:"";position:absolute;left:14px;right:14px;bottom:4px;height:3px;border-radius:3px;background:var(--gold)}
.car{font-size:11px;transition:transform .25s}
.dd{position:relative}
.ddp{position:absolute;top:calc(100% + 10px);left:50%;transform:translate(-50%,8px);width:340px;background:#fff;border-radius:18px;padding:10px;box-shadow:0 22px 50px rgba(36,18,58,.3);opacity:0;visibility:hidden;transition:opacity .2s,transform .2s,visibility .2s}
.ddp::before{content:"";position:absolute;top:-10px;left:0;right:0;height:10px}
.dd:hover .ddp,.dd.open .ddp,.dd:focus-within .ddp{opacity:1;visibility:visible;transform:translate(-50%,0)}
.dd:hover .car,.dd.open .car{transform:rotate(180deg)}
.ddp a{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:12px;text-decoration:none;color:#24123A;transition:background .2s}
.ddp a:hover,.ddp a.on{background:#F1E9FA}
.ddp img{width:52px;height:52px;object-fit:contain}
.ddp b{display:block;font-size:15px}.ddp small{display:block;font-size:12.5px;color:#6B5C7A}
.tn-cta{background:var(--gold);color:#24123A!important;font-weight:700;text-decoration:none;border-radius:12px;padding:12px 20px;white-space:nowrap;transition:transform .2s,box-shadow .2s}
.tn-cta:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(242,179,61,.5)}
.burger{display:none;margin-left:auto;width:46px;height:46px;border-radius:12px;border:0;background:rgba(255,255,255,.1);cursor:pointer;flex-direction:column;align-items:center;justify-content:center;gap:5px}
.burger span{display:block;width:22px;height:2.5px;border-radius:2px;background:#fff;transition:transform .3s,opacity .3s}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}
.mob{display:none}
.appbar{display:none}
@media(max-width:1100px){.tn-menu .mi{padding:10px 9px;font-size:14px}}
@media(max-width:960px){
 .tn-menu,.tn-in>.tn-cta{display:none}
 .burger{display:flex}
 .tn-in{height:66px;padding:0 4vw}.topnav.small .tn-in{height:58px}
 .tn-brand img{width:56px}.tn-brand b{font-size:22px}.tn-brand small{display:none}
 .mob{display:flex;flex-direction:column;gap:6px;position:fixed;inset:66px 0 0 0;z-index:99;background:#24123A;padding:16px 5vw 120px;overflow-y:auto;opacity:0;visibility:hidden;transform:translateY(-12px);transition:opacity .25s,transform .25s,visibility .25s}
 .mob.open{opacity:1;visibility:visible;transform:none}
 .mob a{display:flex;align-items:center;gap:14px;color:#fff;text-decoration:none;font-size:19px;font-weight:600;padding:10px 12px;border-radius:14px}
 .mob a.on{background:rgba(242,179,61,.16);color:var(--gold)}
 .mob a img{width:44px;height:44px;object-fit:contain;background:#fff;border-radius:12px;padding:3px}
 .mob .tn-cta.big{display:block;text-align:center;margin-top:12px;font-size:18px;padding:16px}
 body.menu-open{overflow:hidden}
 .appbar{display:grid;grid-template-columns:repeat(4,1fr);position:fixed;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom,0px));z-index:98;background:rgba(36,18,58,.96);border-radius:22px;padding:6px;box-shadow:0 12px 30px rgba(36,18,58,.35)}
 .appbar a{display:flex;flex-direction:column;align-items:center;gap:2px;text-decoration:none;color:#CBB7DD;font-size:11.5px;font-weight:600;padding:6px 2px;border-radius:16px}
 .appbar a img{width:32px;height:32px;object-fit:contain;background:#fff;border-radius:10px;padding:2px;transition:transform .2s}
 .appbar a.on{background:rgba(242,179,61,.18);color:var(--gold)}
 .appbar a.on img{transform:scale(1.08)}
 body{padding-bottom:96px}
}
/* Unterseiten */
.phead{max-width:1180px;margin:0 auto;padding:48px 0 8px;display:grid;grid-template-columns:1fr 260px;gap:36px;align-items:center}
.phead h1{font-size:clamp(32px,4.4vw,56px);font-weight:800;color:var(--plum);line-height:1.08;margin:0 0 16px}
.ph-img{width:100%;max-width:260px;height:auto;justify-self:end;filter:drop-shadow(0 20px 30px rgba(91,42,134,.2))}
.ph-cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:8px}
.ghost{display:inline-block;padding:12px 22px;border-radius:12px;border:2px solid var(--lila);color:var(--plum);text-decoration:none;font-weight:700}
.ghost:hover{border-color:var(--gold)}
.sparten{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:22px}
.sp{display:block;text-decoration:none;color:var(--txt);background:var(--lila);border-radius:22px;padding:24px;transition:transform .25s,box-shadow .25s}
.sp:hover{transform:translateY(-6px) rotate(-.5deg);box-shadow:0 18px 36px rgba(91,42,134,.16)}
.sp img{width:96px;height:96px;object-fit:contain}
.sp h3{margin:6px 0 6px;font-size:21px;color:var(--plum)}.sp p{margin:0 0 12px;line-height:1.6}
.sp span{font-weight:700;color:var(--vio)}
.band2{display:grid;grid-template-columns:110px 1fr auto;gap:24px;align-items:center;background:var(--plum);color:#F4ECFB;border-radius:24px;padding:24px 32px}
.band2 img{width:100px;height:100px;object-fit:contain;background:#fff;border-radius:20px;padding:6px}
.band2 h2{color:#fff;margin:0 0 6px}.band2 .big{margin:0;color:#E6DCEF}
.fgrid.wide{margin-top:14px}
.facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:20px}
.facts div{background:var(--lila);border-radius:18px;padding:20px}
.facts b{display:block;font-size:26px;font-weight:800;color:var(--vio)}.facts span{display:block;margin-top:4px;line-height:1.5}
.kcards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.kc{display:block;text-decoration:none;color:var(--txt);background:var(--lila);border-radius:22px;padding:26px;text-align:center;transition:transform .25s,box-shadow .25s}
.kc:hover{transform:translateY(-6px);box-shadow:0 18px 36px rgba(91,42,134,.16)}
.kc img{width:100px;height:100px;object-fit:contain}
.kc h3{margin:6px 0;font-size:22px;color:var(--plum)}.kc p{margin:0 0 12px;line-height:1.55}.kc span{font-weight:700;color:var(--vio);word-break:break-word}
.chips{top:62px!important}
.fside{top:84px!important}
.fsec{scroll-margin-top:130px!important}
/* Fuss */
.bigfoot{background:#24123A;color:#CBB7DD;margin-top:60px;padding:48px 3vw 24px}
.bf-in{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:32px}
.bigfoot h3{color:var(--gold);font-size:15px;margin:0 0 10px}
.bigfoot a{display:block;color:#EADDF6;text-decoration:none;padding:4px 0}.bigfoot a:hover{color:var(--gold)}
.bigfoot .tn-brand{display:flex;margin-bottom:10px}.bigfoot p{line-height:1.6;margin:0}
.bf-low{max-width:1180px;margin:30px auto 0!important;padding-top:16px;border-top:1px solid rgba(255,255,255,.12);font-size:13px}
@media(max-width:900px){.phead{grid-template-columns:1fr;gap:6px}.ph-img{max-width:130px;justify-self:start;order:-1}.sparten,.kcards{grid-template-columns:1fr}.facts{grid-template-columns:1fr 1fr}.band2{grid-template-columns:1fr;text-align:left}.bf-in{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.bf-in{grid-template-columns:1fr}}
.intro{margin-top:22px!important}
@media(max-width:960px){.intro{margin-top:14px!important}}
/* Baba-Footer im Darling-Dogs-Stil */
.bigfoot{margin-bottom:0}
.babafoot{background:#FFF6EA;text-align:center;padding:26px 4vw 30px;font-size:15px;color:#4A4A4A}
.bbf-dogs{width:64px;height:auto;display:block;margin:0 auto 8px;animation:bbfhop 2.6s ease-in-out infinite}
@keyframes bbfhop{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
.babafoot p{margin:6px 0;line-height:1.6}
.bbf-links{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px 12px}
.bbf-links b{color:#7B2D9E;font-size:16px;margin-right:10px}
.bbf-links a{color:#555;text-decoration:none}.bbf-links a:hover{color:#7B2D9E}
.bbf-links span{color:#F2B33D;font-weight:700}
.bbf-adr b{color:#7B2D9E;margin-right:6px}
.bbf-note{font-style:italic;color:#888;font-size:13.5px}
.bbf-made{font-size:13px;color:#999}.bbf-made a{color:#B56A00;font-weight:600;text-decoration:none}
@media(max-width:960px){.babafoot{padding-bottom:110px}}
@media (prefers-reduced-motion:reduce){.bbf-dogs{animation:none}}
/* Rechtsseiten */
.legal{max-width:860px;margin:0 auto;padding:48px 0 20px}
.legal h1{font-size:clamp(32px,4vw,48px);font-weight:800;color:var(--plum);margin:0 0 8px}
.legal .stand{color:var(--mut);margin:0 0 28px}
.legal h2{font-size:21px;color:var(--plum);margin:30px 0 8px}
.legal p,.legal li{line-height:1.7}
.legal ul{padding-left:20px}
.legal .box{background:var(--lila);border-radius:16px;padding:18px 22px;margin:14px 0}
.todo{background:#FFE58A;color:#5B3A00;padding:1px 6px;border-radius:5px;font-weight:600}
.legal .hint{background:#FFF6E4;border-left:4px solid var(--gold);padding:12px 16px;margin:0 0 24px;font-size:14.5px}
.legal a{color:var(--vio);font-weight:600}