@font-face{font-family:"Marcellus";src:url(fonts/marcellus.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Hanken Grotesk";src:url(fonts/hanken.woff2) format("woff2");font-weight:400 700;font-display:swap}
:root{
  --papier:#fff;--stein:#efeeeb;--tinte:#24161a;--grau:#6b5f60;--aub:#2b1a1c;--aub2:#3a2427;
  --messing:#c89b42;--messing-t:#8a5f1c;--linie:#e2dfda;--lotus:#efe4cf;--rot:#9b2f22;
  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:40px;--s7:64px;--s8:104px;
  --w:1320px;--rad:2px;
  --serif:"Marcellus",Georgia,serif;--sans:"Hanken Grotesk",system-ui,-apple-system,sans-serif;
  --ease:cubic-bezier(.22,.8,.24,1);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:120px}
body{margin:0;background:var(--papier);color:var(--tinte);font:400 16px/1.6 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block;height:auto}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.12;margin:0;letter-spacing:.005em;text-wrap:balance}
p{margin:0 0 var(--s4)}
.wrap{max-width:var(--w);margin:0 auto;padding:0 clamp(16px,4vw,40px)}
.skip{position:absolute;left:-999px;top:0;background:var(--tinte);color:#fff;padding:8px 12px;z-index:100}
.skip:focus{left:8px}
:focus-visible{outline:2px solid var(--messing-t);outline-offset:2px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Entwurfsband + Versandleiste */
.draft{background:var(--aub);color:var(--lotus);font-size:12px;text-align:center;padding:5px 12px;letter-spacing:.02em}
.draft a{color:var(--messing);text-decoration:none}
.ship{border-bottom:1px solid var(--linie);font-size:13px;text-align:center;padding:7px 12px;color:var(--grau)}
.ship b{color:var(--tinte);font-weight:600}

/* Kopf */
.hd{position:sticky;top:0;z-index:40;background:#fff;border-bottom:1px solid var(--linie)}
.hd-in{display:flex;align-items:center;gap:var(--s5);height:76px}
.logo{display:block;flex:0 0 auto}
.logo img{width:230px;height:auto}
.nav{display:flex;gap:var(--s5);margin-left:auto;font-size:15px}
.nav a{text-decoration:none;padding:6px 0;border-bottom:1px solid transparent}
.nav a:hover,.nav a[aria-current=page]{border-color:var(--tinte)}
.tools{display:flex;align-items:center;gap:var(--s2)}
.ib{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:44px;height:44px;padding:0 8px;background:none;border:0;cursor:pointer;text-decoration:none;font-size:14px}
.ib svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.5}
.cartn{font-variant-numeric:tabular-nums;font-weight:600}
.burger{display:none}
.cats{border-top:1px solid var(--linie);overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.cats::-webkit-scrollbar{display:none}
.cats ul{display:flex;gap:var(--s5);list-style:none;margin:0 auto;padding:0 clamp(16px,4vw,40px);max-width:var(--w);white-space:nowrap}
.cats a{display:block;text-decoration:none;font-size:14px;padding:11px 0;color:var(--grau);border-bottom:2px solid transparent}
.cats a:hover{color:var(--tinte)}
.cats a[aria-current=page]{color:var(--tinte);border-color:var(--messing)}
.cats sup{font-size:10px;margin-left:2px;color:var(--grau)}

/* Mobilmenü */
.mm{position:fixed;inset:0;z-index:60;background:var(--papier);display:none;flex-direction:column;overflow:auto}
.mm.open{display:flex}
.mm-top{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-bottom:1px solid var(--linie)}
.mm nav{padding:8px 16px 40px}
.mm a{display:flex;justify-content:space-between;text-decoration:none;padding:14px 0;border-bottom:1px solid var(--linie);font-size:18px}
.mm a span{color:var(--grau);font-size:14px}
.mm h2{font-size:13px;font-family:var(--sans);text-transform:uppercase;letter-spacing:.12em;color:var(--grau);margin:24px 0 4px}

/* Knöpfe */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:0 24px;border:1px solid var(--tinte);background:var(--tinte);color:#fff;border-radius:var(--rad);text-decoration:none;font-weight:600;font-size:15px;cursor:pointer;transition:background .2s var(--ease),color .2s var(--ease),transform .15s var(--ease)}
.btn:hover{background:var(--aub2)}
.btn:active{transform:translateY(1px)}
.btn.hell{background:transparent;color:var(--tinte)}
.btn.hell:hover{background:var(--tinte);color:#fff}
.btn.messing{background:var(--messing);border-color:var(--messing);color:var(--aub)}
.btn.messing:hover{background:#d8ad55}
.btn.lin{background:transparent;color:var(--lotus);border-color:rgba(239,228,207,.5)}
.btn.lin:hover{border-color:var(--lotus)}
.btn[disabled]{opacity:.45;cursor:not-allowed}
.tl{color:var(--messing-t);font-weight:600;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}

/* Hero: Klangprobe */
.kp{background:var(--aub);color:var(--lotus);overflow:hidden}
.kp-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);grid-template-areas:"h s" "r s";grid-template-rows:auto auto;column-gap:var(--s6);align-content:center;align-items:end;min-height:min(716px,calc(100svh - 184px));padding-top:var(--s6);padding-bottom:var(--s6)}
.kp h1{font-size:clamp(34px,4.3vw,60px);color:#fff;max-width:13em}
.kp-h{grid-area:h}.kp-r{grid-area:r;align-self:start}.schale-wrap{grid-area:s;align-self:center}
.kp .lead{font-size:clamp(16px,1.3vw,18px);max-width:34em;margin:var(--s5) 0 var(--s6);color:rgba(239,228,207,.86)}
.kp-acts{display:flex;flex-wrap:wrap;gap:var(--s3)}
.kp-fakt{display:flex;flex-wrap:wrap;gap:var(--s2) var(--s5);margin-top:var(--s6);padding-top:var(--s4);border-top:1px solid rgba(239,228,207,.18);font-size:14px;color:rgba(239,228,207,.75);list-style:none;padding-left:0}
.kp-fakt b{color:var(--lotus);font-weight:600}
.schale{position:relative;justify-self:center;width:min(100%,500px);aspect-ratio:1;border:0;background:none;padding:0;cursor:pointer;border-radius:50%;-webkit-tap-highlight-color:transparent}
.schale img{width:100%;height:100%;border-radius:50%;transition:transform .5s var(--ease)}
.schale canvas{position:absolute;inset:-7%;width:114%;height:114%;pointer-events:none}
.schale.an img{animation:zit .7s var(--ease)}
@keyframes zit{0%{transform:scale(1)}12%{transform:scale(.985)}40%{transform:scale(1.004)}100%{transform:scale(1)}}
.schale-hint{position:absolute;left:50%;bottom:-6px;transform:translate(-50%,100%);font-size:14px;color:var(--messing);white-space:nowrap;display:flex;align-items:center;gap:8px}
.schale-wrap{display:flex;flex-direction:column;align-items:center;gap:52px}
.toene{display:grid;grid-template-columns:auto 1fr auto;gap:6px 14px;width:min(100%,420px);font-size:13px;color:rgba(239,228,207,.7);font-variant-numeric:tabular-nums}
.toene i{display:block;height:2px;align-self:center;background:rgba(239,228,207,.14);position:relative;overflow:hidden}
.toene i::after{content:"";position:absolute;inset:0;background:var(--messing);transform-origin:left;transform:scaleX(var(--a,0))}
.toene-n{grid-column:1/-1;font-size:12px;color:rgba(239,228,207,.55);margin-top:4px}
.toene-n a{color:var(--lotus)}

/* Abschnitte */
.sec{padding:var(--s8) 0}
.sec-k{display:flex;justify-content:space-between;align-items:end;gap:var(--s5);margin-bottom:var(--s6);flex-wrap:wrap}
.sec h2{font-size:clamp(28px,3vw,40px)}
.sec-k p{margin:0;color:var(--grau);max-width:40em}

/* Kategorie-Übersicht Startseite */
.kat-gross{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--s4)}
.kt{position:relative;display:block;text-decoration:none;background:var(--stein);overflow:hidden}
.kt img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply;padding:8%;transition:transform .6s var(--ease)}
.kt.cover img{object-fit:cover;padding:0;mix-blend-mode:normal}
.kt:hover img{transform:scale(1.03)}
.kt-t{position:absolute;left:0;right:0;bottom:0;display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:14px 18px;background:rgba(255,255,255,.94)}
.kt-t b{font:400 21px/1.2 var(--serif)}
.kt-t span{font-size:13px;color:var(--grau);white-space:nowrap}
.kt.a{grid-column:span 7;height:clamp(300px,38vw,540px)}
.kt.b{grid-column:span 5;height:clamp(300px,38vw,540px)}
.kt.c{grid-column:span 4;aspect-ratio:1}
.kat-liste{margin-top:var(--s6);display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:0 var(--s5);list-style:none;padding:0;border-top:1px solid var(--linie)}
.kat-liste a{display:grid;grid-template-columns:64px 1fr auto;gap:14px;align-items:center;padding:10px 0;border-bottom:1px solid var(--linie);text-decoration:none}
.kat-liste img{width:64px;height:64px;object-fit:contain;background:var(--stein);mix-blend-mode:multiply;padding:4px}
.kat-liste .imgb{background:var(--stein)}
.kat-liste b{font-weight:500}
.kat-liste span{font-size:13px;color:var(--grau)}
.kat-liste a:hover b{text-decoration:underline;text-underline-offset:3px}

/* Produktraster */
.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s6) var(--s4)}
.grid.vier{grid-template-columns:repeat(4,minmax(0,1fr))}
.pc{position:relative;display:flex;flex-direction:column}
.pc-bild{position:relative;display:block;aspect-ratio:1;background:var(--stein);overflow:hidden}
.pc-bild img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:7%;mix-blend-mode:multiply;transition:opacity .45s var(--ease),transform .6s var(--ease)}
.pc-bild.cover img.i0{object-fit:cover;padding:0;mix-blend-mode:normal}
.pc-bild img.i1{opacity:0}
.pc-bild img.i1.cover{object-fit:cover;padding:0;mix-blend-mode:normal}
.pc:hover .pc-bild img.i1{opacity:1}
.pc:hover .pc-bild.zwei img.i0{opacity:0}
.pc:hover .pc-bild img{transform:scale(1.025)}
.pc-txt{display:grid;grid-template-columns:1fr auto;gap:2px 12px;padding-top:var(--s3)}
.pc-n{font-weight:500;line-height:1.35;text-decoration:none}
.pc-n::after{content:"";position:absolute;inset:0}
.pc-s{grid-column:1;font-size:13px;color:var(--grau);line-height:1.4;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.pc-p{grid-row:1;grid-column:2;font-family:var(--serif);font-size:19px;white-space:nowrap;text-align:right}
.pc-p small{font-family:var(--sans);font-size:12px;color:var(--grau);margin-right:3px}
.pc-aus{position:absolute;top:12px;left:12px;font-size:12px;font-weight:600;color:var(--rot);background:#fff;padding:3px 8px;z-index:2}
.pc-add{position:absolute;right:10px;top:calc(100% - 0px);z-index:3}
.pc-plus{position:absolute;right:10px;bottom:10px;z-index:3;width:44px;height:44px;border:1px solid var(--tinte);background:#fff;border-radius:var(--rad);display:flex;align-items:center;justify-content:center;cursor:pointer;opacity:0;transform:translateY(6px);transition:all .25s var(--ease)}
.pc-plus svg{width:20px;height:20px;stroke:var(--tinte);stroke-width:1.6;fill:none}
.pc:hover .pc-plus,.pc-plus:focus-visible{opacity:1;transform:none}
.pc-plus:hover{background:var(--tinte)}
.pc-plus:hover svg{stroke:#fff}
@media (hover:none){.pc-plus{opacity:1;transform:none;width:40px;height:40px}}

/* Kategorieseite */
.kopf{padding-top:var(--s6);padding-bottom:var(--s5)}
.crumb{font-size:13px;color:var(--grau);margin-bottom:var(--s4)}
.crumb a{text-decoration:none}
.crumb a:hover{text-decoration:underline}
.kopf h1{font-size:clamp(34px,4.4vw,60px)}
.kopf-z{display:flex;justify-content:space-between;align-items:end;gap:var(--s5);flex-wrap:wrap}
.kopf-z p{margin:0;color:var(--grau)}
.subs{display:flex;flex-wrap:wrap;gap:var(--s2);margin-top:var(--s5)}
.subs a{text-decoration:none;font-size:14px;padding:8px 14px;border:1px solid var(--linie);border-radius:var(--rad)}
.subs a:hover{border-color:var(--tinte)}
.subs a[aria-current=page]{background:var(--tinte);color:#fff;border-color:var(--tinte)}
.leiste{position:sticky;top:76px;z-index:20;background:#fff;border-top:1px solid var(--linie);border-bottom:1px solid var(--linie);margin-bottom:var(--s6)}
.leiste-in{display:flex;gap:var(--s5);align-items:center;justify-content:space-between;height:54px;font-size:14px}
.leiste label{display:flex;align-items:center;gap:8px;cursor:pointer}
.leiste select{border:0;background:none;font-weight:600;cursor:pointer;padding:6px 0}
.leiste input[type=checkbox]{width:18px;height:18px;accent-color:var(--tinte)}
.zahl{color:var(--grau);font-variant-numeric:tabular-nums}

/* Produktseite */
.pd{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:clamp(24px,5vw,72px);padding-top:var(--s5);padding-bottom:var(--s7)}
.gal-main{position:relative;background:var(--stein);aspect-ratio:1;overflow:hidden}
.gal-main img{width:100%;height:100%;object-fit:contain;padding:5%;mix-blend-mode:multiply}
.gal-main img.cover{object-fit:cover;padding:0;mix-blend-mode:normal}
.gal-th{display:flex;gap:var(--s2);margin-top:var(--s2);flex-wrap:wrap}
.gal-th button{width:88px;height:88px;padding:0;border:1px solid transparent;background:var(--stein);cursor:pointer}
.gal-th button[aria-current=true]{border-color:var(--tinte)}
.gal-th img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply;padding:6%}
.kauf{position:sticky;top:110px;align-self:start}
.kauf h1{font-size:clamp(30px,3vw,44px)}
.kauf-s{color:var(--grau);margin:var(--s3) 0 var(--s5);font-size:15px}
.preis{font-family:var(--serif);font-size:40px;line-height:1}
.preis small{font:400 15px var(--sans);color:var(--grau)}
.preis-n{font-size:13px;color:var(--grau);margin:8px 0 var(--s5)}
.staffel{width:100%;border-collapse:collapse;font-size:14px;margin:0 0 var(--s5)}
.staffel th,.staffel td{text-align:left;padding:8px 0;border-bottom:1px solid var(--linie);font-weight:400}
.staffel th{color:var(--grau);font-size:12px;text-transform:uppercase;letter-spacing:.08em}
.staffel td:last-child,.staffel th:last-child{text-align:right;font-variant-numeric:tabular-nums}
.opt{margin-bottom:var(--s4)}
.opt label{display:block;font-size:13px;font-weight:600;margin-bottom:6px}
.opt select,.feld input,.feld select{width:100%;height:50px;border:1px solid #cfc9c2;border-radius:var(--rad);background:#fff;padding:0 14px}
.kauf-row{display:flex;gap:var(--s2);margin:var(--s4) 0}
.menge{display:flex;align-items:center;border:1px solid #cfc9c2;border-radius:var(--rad);height:50px}
.menge button{width:44px;height:100%;border:0;background:none;cursor:pointer;font-size:20px}
.menge input{width:40px;border:0;text-align:center;font-variant-numeric:tabular-nums;-moz-appearance:textfield}
.menge input::-webkit-inner-spin-button{display:none}
.kauf-row .btn{flex:1}
.fakten{list-style:none;padding:0;margin:var(--s5) 0;border-top:1px solid var(--linie);font-size:15px}
.fakten li{display:grid;grid-template-columns:110px 1fr;gap:12px;padding:10px 0;border-bottom:1px solid var(--linie)}
.fakten span{color:var(--grau)}
.payrow{display:flex;flex-wrap:wrap;gap:6px;margin-top:var(--s4)}
.pm{display:inline-flex;align-items:center;justify-content:center;height:28px;min-width:48px;padding:0 8px;border:1px solid var(--linie);border-radius:3px;background:#fff;font:700 11px/1 var(--sans);letter-spacing:.01em;white-space:nowrap}
.pm.visa{color:#1a1f71;font-style:italic;font-size:13px}
.pm.mc{gap:0}
.pm.mc i{width:14px;height:14px;border-radius:50%;background:#eb001b;display:block}
.pm.mc i+i{background:#f79e1b;margin-left:-6px;mix-blend-mode:multiply}
.pm.klarna{background:#ffb3c7;border-color:#ffb3c7;color:#0b051d}
.pm.paypal{color:#003087;font-style:italic;font-size:12px}
.pm.paypal b{color:#009cde}
.pm.apple{background:#000;border-color:#000;color:#fff;font-size:12px}
.pm.gpay{color:#3c4043;font-size:12px}
.pm.gpay b:nth-child(1){color:#4285f4}
.pm.sepa{color:#10298e;font-size:11px}
.beschr{max-width:62ch;padding:var(--s6) 0 var(--s7);border-top:1px solid var(--linie)}
.beschr h2{font-size:28px;margin-bottom:var(--s4)}
.beschr ul{padding-left:20px}
.ke{background:var(--aub);color:var(--lotus);padding:var(--s5);margin:var(--s5) 0;display:grid;grid-template-columns:auto 1fr;gap:var(--s4);align-items:center}
.ke button{width:64px;height:64px;border-radius:50%;border:1px solid var(--messing);background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;position:relative}
.ke button svg{width:30px;height:30px;stroke:var(--messing);fill:none;stroke-width:1.4}
.ke button.an::after{content:"";position:absolute;inset:-1px;border-radius:50%;border:1px solid var(--messing);animation:ring 1.6s var(--ease) forwards}
@keyframes ring{to{transform:scale(1.9);opacity:0}}
.ke b{display:block;color:#fff;font-weight:600}
.ke p{margin:2px 0 0;font-size:13px;color:rgba(239,228,207,.72)}

/* Text-Abschnitte */
.zwei{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,6vw,96px);align-items:start}
.prosa{max-width:62ch;font-size:17px}
.prosa h2{margin-bottom:var(--s5)}
.lager{background:var(--stein)}
.adr{font-style:normal;font-size:17px;line-height:1.7}
.adr a{text-decoration:none;border-bottom:1px solid currentColor}
.bez{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));border-top:1px solid var(--linie);border-left:1px solid var(--linie)}
.bez div{border-right:1px solid var(--linie);border-bottom:1px solid var(--linie);padding:var(--s5) var(--s4);display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.bez .pm{height:34px;min-width:64px;font-size:13px}
.bez b{font-weight:600;font-size:15px}
.bez span{font-size:13px;color:var(--grau);line-height:1.45}
.staffel-bsp{font-variant-numeric:tabular-nums}

/* Warenkorb + Kasse */
.wk{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(300px,1fr);gap:clamp(24px,5vw,72px);padding-bottom:var(--s8)}
.wk-liste{list-style:none;margin:0;padding:0;border-top:1px solid var(--linie)}
.wk-liste li{display:grid;grid-template-columns:110px 1fr auto;gap:var(--s4);padding:var(--s4) 0;border-bottom:1px solid var(--linie);align-items:start}
.wk-liste img{width:110px;height:110px;object-fit:contain;background:var(--stein);mix-blend-mode:multiply;padding:6%}
.wk-liste .wk-n{font-weight:500;text-decoration:none}
.wk-liste .wk-o{font-size:13px;color:var(--grau)}
.wk-liste .wk-p{font-family:var(--serif);font-size:20px;text-align:right}
.wk-liste .wk-act{display:flex;gap:var(--s3);align-items:center;margin-top:10px}
.wk-liste .menge{height:40px}
.wk-liste .menge button{width:36px}
.wk-del{background:none;border:0;font-size:13px;text-decoration:underline;color:var(--grau);cursor:pointer;padding:8px 0}
.sum{background:var(--stein);padding:var(--s5);position:sticky;top:110px;align-self:start}
.sum h2{font-size:24px;margin-bottom:var(--s4)}
.sum dl{display:grid;grid-template-columns:1fr auto;gap:8px 0;margin:0 0 var(--s4);font-size:15px}
.sum dd{margin:0;text-align:right;font-variant-numeric:tabular-nums}
.sum .ges{font-family:var(--serif);font-size:24px;border-top:1px solid #d6d1ca;padding-top:12px}
.sum .hin{font-size:13px;color:var(--grau)}
.leer{padding:var(--s7) 0;text-align:left}
.ks{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(300px,1fr);gap:clamp(24px,5vw,72px);padding-bottom:var(--s8)}
.ks fieldset{border:0;padding:0;margin:0 0 var(--s6)}
.ks legend{font:400 24px/1.2 var(--serif);margin-bottom:var(--s4);padding:0;display:flex;gap:12px;align-items:baseline}
.ks legend span{font:600 13px var(--sans);color:var(--messing-t)}
.felder{display:grid;grid-template-columns:1fr 1fr;gap:var(--s3)}
.felder .voll{grid-column:1/-1}
.feld label{display:block;font-size:13px;font-weight:600;margin-bottom:6px}
.zahlarten{border:1px solid var(--linie);border-radius:var(--rad)}
.za{border-bottom:1px solid var(--linie)}
.za:last-child{border-bottom:0}
.za>label{display:flex;align-items:center;gap:14px;padding:16px;cursor:pointer;min-height:60px}
.za input[type=radio]{width:20px;height:20px;accent-color:var(--tinte);flex:0 0 auto}
.za-n{flex:1;font-weight:500}
.za-n small{display:block;font-weight:400;color:var(--grau);font-size:13px}
.za-marks{display:flex;gap:4px;flex-wrap:wrap;justify-content:flex-end}
.za-d{display:none;padding:0 16px 18px 50px;font-size:14px;color:var(--grau)}
.za.sel{background:#faf9f7}
.za.sel .za-d{display:block}
.demo{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}
.demo div{height:46px;border:1px dashed #c9c2b9;border-radius:var(--rad);display:flex;align-items:center;padding:0 12px;color:#9a8f86;font-size:13px;background:#fff}
.demo .voll{grid-column:1/-1}
.wallet{display:flex;align-items:center;justify-content:center;height:48px;border-radius:6px;font-weight:600;margin-top:10px;max-width:320px}
.wallet.apple{background:#000;color:#fff}
.wallet.google{background:#000;color:#fff}
.wallet.pp{background:#ffc439;color:#003087;font-style:italic;font-weight:800}
.wallet.kl{background:#ffb3c7;color:#0b051d}
.ks-pos{list-style:none;margin:0 0 var(--s4);padding:0}
.ks-pos li{display:grid;grid-template-columns:56px 1fr auto;gap:12px;align-items:center;padding:8px 0;font-size:14px}
.ks-pos img{width:56px;height:56px;object-fit:contain;background:#fff;mix-blend-mode:multiply;padding:4px}
.ks-pos .q{color:var(--grau);font-size:12px}
.check{display:flex;gap:10px;align-items:flex-start;font-size:13px;margin:var(--s4) 0;color:var(--grau)}
.check input{margin-top:3px;accent-color:var(--tinte)}
dialog{border:0;padding:var(--s6);max-width:480px;width:calc(100% - 32px);border-radius:var(--rad)}
dialog::backdrop{background:rgba(43,26,28,.6)}
dialog h2{font-size:28px;margin-bottom:var(--s3)}

/* Toast */
.toast{position:fixed;right:16px;bottom:16px;z-index:70;background:var(--tinte);color:#fff;padding:14px 16px;display:flex;gap:14px;align-items:center;max-width:min(420px,calc(100% - 32px));transform:translateY(140%);transition:transform .35s var(--ease);font-size:14px}
.toast.on{transform:none}
.toast img{width:48px;height:48px;object-fit:contain;background:#fff;padding:3px}
.toast a{color:var(--messing);font-weight:600;white-space:nowrap}

/* Suche */
.such{position:fixed;inset:0;z-index:65;background:rgba(43,26,28,.55);display:none}
.such.open{display:block}
.such-box{background:#fff;max-width:760px;margin:0 auto;padding:var(--s4)}
.such-box input{width:100%;height:56px;border:0;border-bottom:1px solid var(--tinte);font-size:20px;padding:0 4px;outline:none}
.such-erg{list-style:none;margin:0;padding:0;max-height:min(70vh,560px);overflow:auto}
.such-erg a{display:grid;grid-template-columns:56px 1fr auto;gap:12px;align-items:center;padding:8px 4px;text-decoration:none;border-bottom:1px solid var(--linie)}
.such-erg img{width:56px;height:56px;object-fit:contain;background:var(--stein);mix-blend-mode:multiply;padding:3px}
.such-erg span{font-family:var(--serif)}
.such-leer{padding:16px 4px;color:var(--grau);font-size:14px}

/* Fuß */
.ft{background:var(--aub);color:rgba(239,228,207,.78);padding:var(--s7) 0 var(--s5);font-size:14px}
.ft-g{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:var(--s6)}
.ft img{width:220px;margin-bottom:var(--s4)}
.ft h2{font:600 12px var(--sans);text-transform:uppercase;letter-spacing:.14em;color:var(--messing);margin-bottom:var(--s3)}
.ft ul{list-style:none;margin:0;padding:0;line-height:2}
.ft a{text-decoration:none}
.ft a:hover{color:#fff}
.ft-u{margin-top:var(--s6);padding-top:var(--s4);border-top:1px solid rgba(239,228,207,.15);display:flex;justify-content:space-between;gap:var(--s4);flex-wrap:wrap;font-size:12px}
.ft .pm{border-color:transparent}

.rv{opacity:0;transform:translateY(14px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.rv.in{opacity:1;transform:none}
.platz{max-width:62ch;padding-bottom:var(--s8)}
.platz h2{font-size:24px;margin:var(--s5) 0 var(--s2)}
.kform{display:grid;gap:var(--s3);max-width:560px}
.kform textarea{width:100%;min-height:140px;border:1px solid #cfc9c2;border-radius:var(--rad);padding:12px 14px}

@media (max-width:1100px){
  .nav{display:none}
  .burger{display:inline-flex}
  .grid.vier{grid-template-columns:repeat(3,minmax(0,1fr))}
  .bez{grid-template-columns:repeat(3,minmax(0,1fr))}
  .ft-g{grid-template-columns:1fr 1fr}
}
@media (max-width:860px){
  .kp-in{grid-template-columns:1fr;grid-template-areas:"h" "s" "r";row-gap:var(--s4);min-height:0;padding-top:var(--s5);padding-bottom:var(--s6)}
  .kp .lead{margin-top:var(--s4)}
  .toene{display:none}
  .schale{width:min(72vw,300px)}
  .schale-wrap{gap:40px;margin-bottom:8px}
  .kp-fakt{margin-top:var(--s5)}
  .grid,.grid.vier{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s5) var(--s3)}
  .kt.a,.kt.b{grid-column:span 12;aspect-ratio:4/3;height:auto}
  .kt.c{grid-column:span 6}
  .kt-t{padding:10px 12px}
  .kt-t b{font-size:17px}
  .pd,.wk,.ks,.zwei{grid-template-columns:1fr}
  .kauf,.sum{position:static}
  .sec{padding:var(--s7) 0}
  .pc-p{grid-row:auto;grid-column:1;text-align:left;font-size:17px}
  .pc-txt{grid-template-columns:1fr}
}
@media (max-width:560px){
  .hd-in{height:60px;gap:var(--s2)}
  .logo img{width:168px}
  .leiste{top:60px}
  .tools .ib span.lbl{display:none}
  .kt.c{grid-column:span 6;aspect-ratio:1}
  .kt-t{flex-direction:column;gap:0}
  .bez{grid-template-columns:repeat(2,minmax(0,1fr))}
  .felder,.demo{grid-template-columns:1fr}
  .wk-liste li{grid-template-columns:80px 1fr}
  .wk-liste img{width:80px;height:80px}
  .wk-liste .wk-p{grid-column:2;text-align:left}
  .gal-th button{width:64px;height:64px}
  .ft-g{grid-template-columns:1fr}
  .kp h1{font-size:30px}
  .nm{display:none}
  .leiste [data-zahl]{display:none}
  .leiste-in{justify-content:flex-end}
  .leiste label{white-space:nowrap}
  .draft{font-size:11px}
  .ship{font-size:12px}
  .za-marks{display:none}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.rv{opacity:1;transform:none}}