/* genaumarkt · Designsystem siehe DESIGN.md. Weißer Grund, Graphit, Maßband-Gelb als Akzent, Archivo + IBM Plex Mono. */
@font-face{font-family:"Archivo";src:url(/assets/fonts/archivo-latin.woff2) format("woff2");font-weight:100 900;font-stretch:62% 125%;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Archivo";src:url(/assets/fonts/archivo-latin-ext.woff2) format("woff2");font-weight:100 900;font-stretch:62% 125%;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"IBM Plex Mono";src:url(/assets/fonts/plexmono-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url(/assets/fonts/plexmono-500.woff2) format("woff2");font-weight:500;font-display:swap}
:root{--papier:#fff;--flaeche:#f0f2f3;--linie:#d3d8db;--ink:#14181b;--ink2:#4a545b;--gelb:#ffc20e;--gruen:#0f7b4f;--rot:#b3261e;--blau:#0b57d0;
--s1:4px;--s2:8px;--s3:16px;--s4:24px;--s5:40px;--s6:64px;--s7:104px;--g:16px;--breite:1240px;--sans:"Archivo",system-ui,-apple-system,"Segoe UI",sans-serif;--mono:"IBM Plex Mono",ui-monospace,Menlo,monospace}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;font:400 16px/1.6 var(--sans);color:var(--ink);background:var(--papier);overflow-x:hidden}
img,svg{max-width:100%}img{height:auto;display:block}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:3px}a:hover{text-decoration-thickness:2px}
h1,h2,h3,h4{font-stretch:112%;font-weight:700;line-height:1.15;letter-spacing:-.01em;margin:0 0 var(--s3);text-wrap:balance}
h1{font-size:clamp(1.9rem,5.4vw,2.9rem)}h2{font-size:clamp(1.4rem,3.4vw,1.9rem)}h3{font-size:1.2rem}h4{font-size:1rem}
p{margin:0 0 var(--s3)}ul,ol{margin:0 0 var(--s3);padding-left:1.25rem}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--blau);outline-offset:2px}
.wrap{max-width:var(--breite);margin:0 auto;padding-inline:var(--g)}.schmal{max-width:760px;margin-inline:auto}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:0;background:var(--ink);color:#fff;padding:var(--s2) var(--s3);z-index:100}.skip:focus{left:0}
.i{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none;vertical-align:-4px}
.mono{font-family:var(--mono);font-size:.92em}.klein{font-size:.875rem}.muted{color:var(--ink2)}.nowrap{white-space:nowrap}.r{text-align:right}
.lead{font-size:1.15rem;line-height:1.55;color:var(--ink2);max-width:62ch}
.gruen{color:var(--gruen)}
/* Knöpfe */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);min-height:44px;padding:0 var(--s4);background:var(--ink);color:#fff;border:2px solid var(--ink);border-radius:2px;font-weight:600;text-decoration:none;cursor:pointer;line-height:1.2;text-align:center}
.btn:hover{background:#000}.btn--hell{background:#fff;color:var(--ink)}.btn--hell:hover{background:var(--flaeche)}
.btn--gross{min-height:52px;font-size:1.05rem}.btn--klein{min-height:36px;padding:0 var(--s3);font-size:.9rem}.btn--voll{width:100%}
.btn--gelb{background:var(--gelb);color:var(--ink);border-color:var(--gelb)}.btn--gelb:hover{background:#f0b400}
.btn--rot{background:var(--ink)}.btn--text{background:none;border-color:transparent;color:var(--ink);text-decoration:underline;padding:0 var(--s2)}
.btn[disabled]{opacity:.45;cursor:not-allowed}
.linkpfeil{display:inline-flex;gap:var(--s2);align-items:center;font-weight:600;text-decoration:none;border-bottom:2px solid var(--gelb)}.linkpfeil:hover{background:var(--gelb)}
/* Skala */
.skala{position:absolute;left:12px;right:12px;bottom:10px;height:14px;border-bottom:1px solid var(--ink);background:repeating-linear-gradient(90deg,var(--ink) 0 1px,transparent 1px 40px) left bottom/100% 14px no-repeat,repeating-linear-gradient(90deg,var(--ink2) 0 1px,transparent 1px 8px) left bottom/100% 7px no-repeat;opacity:.55;pointer-events:none}
.skala--gross{left:0;right:0;bottom:0;height:22px;opacity:.8}
/* Wortmarke */
.wm{display:inline-flex;align-items:center;gap:10px;font-stretch:112%;font-size:1.3rem;letter-spacing:-.01em;line-height:1}.wm__skala{width:30px;height:30px;flex:none}.wm__text{font-weight:400}.wm__text b{font-weight:800}
.wm--hell{color:#fff}
/* Kopf */
.kopf{background:#fff;position:sticky;top:0;z-index:40;border-bottom:1px solid var(--linie)}
.service{background:var(--ink);color:#e6eaec;font-size:.8rem}.service__zeile{display:flex;justify-content:space-between;gap:var(--s3);padding-block:6px;align-items:center}.service__rechts{display:flex;gap:var(--s4);align-items:center}.service a{text-decoration:none;font-family:var(--mono)}.service a:hover{text-decoration:underline}
.mwst{display:inline-flex;border:1px solid #5b666d}.mwst button{background:none;border:0;color:#e6eaec;padding:2px 10px;cursor:pointer;font-size:.78rem}.mwst button[aria-pressed="true"]{background:var(--gelb);color:var(--ink)}
.kopf__zeile{display:grid;grid-template-columns:auto 1fr auto;gap:var(--s3);align-items:center;padding-block:var(--s3)}
.kopf__logo{text-decoration:none;color:var(--ink)}
.ikon{position:relative;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;background:none;border:0;color:var(--ink);cursor:pointer;text-decoration:none}.ikon .i{width:24px;height:24px}.ikon:hover{background:var(--flaeche)}
.ikon--menue{display:none}
.kopf__ikonen{display:flex;gap:2px}
.zahl{position:absolute;top:2px;right:0;min-width:19px;height:19px;padding:0 4px;background:var(--gelb);color:var(--ink);font:600 .7rem/19px var(--mono);text-align:center}.zahl[data-n="0"]{display:none}
.suche{position:relative;display:flex;max-width:620px;width:100%;justify-self:center}.suche input{flex:1;min-width:0;height:46px;padding:0 var(--s3);border:2px solid var(--ink);border-right:0;border-radius:2px 0 0 2px;background:#fff}
.suche button{width:52px;border:2px solid var(--ink);background:var(--ink);color:#fff;cursor:pointer;border-radius:0 2px 2px 0}
.suche--gross{max-width:520px;margin:var(--s4) 0}.suche--gross .btn{border-radius:0 2px 2px 0}
.suche__treffer{display:none;position:absolute;top:100%;left:0;right:0;background:#fff;border:2px solid var(--ink);border-top:0;max-height:70vh;overflow:auto;z-index:50}.suche__treffer.offen{display:block}
.st{display:flex;gap:var(--s3);align-items:center;padding:var(--s2) var(--s3);text-decoration:none;border-top:1px solid var(--linie)}.st:hover,.st[aria-selected="true"]{background:var(--flaeche)}.st img{width:44px;height:44px;object-fit:contain;background:var(--flaeche)}.st span{display:block;min-width:0}.st small{display:block;color:var(--ink2)}.st__preis{margin-left:auto;font-family:var(--mono)}
.nav{border-top:1px solid var(--linie)}.nav__liste{display:flex;gap:var(--s2);list-style:none;margin:0;padding:0}
.nav__punkt{position:static}.nav__link{display:block;padding:12px var(--s3);font-weight:600;text-decoration:none;border-bottom:3px solid transparent}.nav__punkt:hover>.nav__link,.nav__link:focus-visible{border-bottom-color:var(--gelb)}
.menue{display:none;position:absolute;left:0;right:0;background:#fff;border-bottom:1px solid var(--ink);border-top:1px solid var(--linie);box-shadow:0 18px 30px rgba(20,24,27,.12)}.nav__punkt:hover>.menue,.nav__punkt:focus-within>.menue{display:block}
.menue__raster{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:var(--s4);padding-block:var(--s4)}
.menue__titel{display:block;font-weight:700;text-decoration:none;margin-bottom:var(--s2)}.menue ul{list-style:none;margin:0;padding:0}.menue li a{display:block;padding:3px 0;text-decoration:none;color:var(--ink2)}.menue li a:hover{color:var(--ink);text-decoration:underline}
.nav .wrap{position:relative}.nav{position:relative}
.mnav,.drawer{position:fixed;inset:0;z-index:80;visibility:hidden}.mnav.offen,.drawer.offen{visibility:visible}
.mnav__bg,.drawer__bg{position:absolute;inset:0;background:rgba(20,24,27,.55);opacity:0;transition:opacity .2s}.offen .mnav__bg,.offen .drawer__bg{opacity:1}
.mnav__panel,.drawer__panel{position:absolute;top:0;bottom:0;background:#fff;display:flex;flex-direction:column;transition:transform .22s}
.mnav__panel{left:0;width:min(88vw,380px);transform:translateX(-100%)}.drawer__panel{right:0;width:min(100vw,440px);transform:translateX(100%)}.offen .mnav__panel,.offen .drawer__panel{transform:none}
.drawer__kopf{display:flex;justify-content:space-between;align-items:center;padding:var(--s3);border-bottom:1px solid var(--linie)}.drawer__kopf h2{margin:0;font-size:1.3rem}.x{width:44px;height:44px;background:none;border:0;cursor:pointer}
.drawer__inhalt{flex:1;overflow:auto;padding:var(--s3)}.drawer__fuss{padding:var(--s3);border-top:1px solid var(--ink);display:grid;gap:var(--s2)}
.mnav__liste{list-style:none;margin:0;padding:var(--s3);overflow:auto}.mnav__liste>li{border-bottom:1px solid var(--linie);padding:var(--s2) 0}.mnav__liste a{display:block;padding:6px 0;text-decoration:none}.mnav__liste ul{list-style:none;padding-left:var(--s3);margin:0}
.krumen{padding-block:var(--s3);font-size:.85rem;color:var(--ink2)}.krumen ol{display:flex;flex-wrap:wrap;gap:var(--s1) var(--s2);list-style:none;margin:0;padding:0}.krumen li+li::before{content:"/";margin-right:var(--s2);color:var(--linie)}.krumen a{text-decoration:none}.krumen a:hover{text-decoration:underline}
/* Startseite */
.held{padding-block:var(--s5) var(--s6);background:#fff}.held__raster{display:grid;gap:var(--s5);align-items:center}
.held__text h1{max-width:16ch}.held__knoepfe{display:flex;flex-wrap:wrap;gap:var(--s3);margin-top:var(--s4)}
.held__bild{position:relative;background:var(--flaeche);aspect-ratio:1;max-width:560px;width:100%;justify-self:center}.held__bild img{width:100%;height:100%;object-fit:contain}
.ab{padding-block:var(--s6)}.ab--grau{background:var(--flaeche)}.ab__kopf{display:flex;justify-content:space-between;align-items:baseline;gap:var(--s3);flex-wrap:wrap;margin-bottom:var(--s4)}.ab__kopf h2{margin:0}
.gruppe{margin-bottom:var(--s5)}.gruppe__titel{font-size:1rem;font-stretch:100%;text-transform:uppercase;letter-spacing:.08em;margin-bottom:var(--s3)}.gruppe__titel a{text-decoration:none}
.kacheln{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s3)}
.kachel{display:flex;flex-direction:column;text-decoration:none;border:1px solid var(--linie);background:#fff}.kachel:hover{border-color:var(--ink)}.kachel__bild{background:var(--flaeche);aspect-ratio:1;display:block}.kachel__bild img{width:100%;height:100%;object-fit:contain}.kachel__text{display:flex;flex-direction:column;gap:2px;padding:var(--s3)}.kachel__text b{font-weight:600}.kachel__text small{color:var(--ink2)}
.fakten{margin:0;display:grid;gap:0}.fakten>div{display:grid;gap:2px;padding:var(--s3) 0;border-top:1px solid var(--linie)}.fakten dt{font-weight:700}.fakten dd{margin:0;color:var(--ink2)}
.zweispalt{display:grid;gap:var(--s5)}
.ratliste{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:var(--s3)}.rat{display:flex;flex-direction:column;gap:var(--s2);padding:var(--s4);background:#fff;border:1px solid var(--linie);text-decoration:none}.rat:hover{border-color:var(--ink)}.rat b{font-stretch:108%}.rat span{color:var(--ink2);font-size:.92rem}
.ab--grau .rat{background:#fff}
/* Kategorie und Karten */
.seitenkopf{padding-block:var(--s3) var(--s4)}
.raster{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s3)}
.karte{display:flex;flex-direction:column;border:1px solid var(--linie);background:#fff;min-width:0}.karte:hover{border-color:var(--ink)}
.karte__bild{position:relative;display:block;background:var(--flaeche);aspect-ratio:1}.karte__bild img{width:100%;height:100%;object-fit:contain}
.karte__text{display:flex;flex-direction:column;gap:4px;padding:var(--s3);flex:1}.karte__marke{font-size:.75rem;letter-spacing:.09em;text-transform:uppercase;color:var(--ink2);margin:0}.karte__marke a{text-decoration:none}
.karte__name{font-weight:600;text-decoration:none;line-height:1.3;overflow-wrap:anywhere}.karte__name::after{content:"";position:absolute;inset:0}.karte{position:relative}
.karte__fuss{margin-top:auto;padding-top:var(--s2);display:flex;justify-content:space-between;gap:var(--s2);align-items:baseline;flex-wrap:wrap}.karte__lz{font-size:.72rem;color:var(--ink2)}
.preis{font-family:var(--mono);font-weight:500}.preis--gross{font-size:2rem;line-height:1.1}
.chips{display:flex;flex-wrap:wrap;gap:var(--s2);margin-bottom:var(--s4)}.chip{display:inline-flex;gap:var(--s2);align-items:center;min-height:38px;padding:0 var(--s3);border:1px solid var(--linie);background:#fff;text-decoration:none;cursor:pointer;border-radius:2px}.chip:hover{border-color:var(--ink)}.chip[aria-pressed="true"]{background:var(--ink);color:#fff;border-color:var(--ink)}.chip small{color:var(--ink2)}
.werkzeugleiste{display:flex;flex-wrap:wrap;gap:var(--s3);align-items:center;justify-content:space-between;margin-bottom:var(--s3)}.werkzeugleiste .chips{margin:0}
select,input[type=text],input[type=email],input[type=tel],input[type=number],input[type=search],textarea{border:1px solid #8a959c;background:#fff;border-radius:2px;min-height:44px;padding:0 var(--s3);max-width:100%}textarea{padding:var(--s2) var(--s3);min-height:110px;width:100%}select{padding-right:var(--s3)}
.fach{margin-top:var(--s6);max-width:820px}
.faq details{border-top:1px solid var(--linie);padding:var(--s3) 0}.faq details:last-child{border-bottom:1px solid var(--linie)}.faq summary{cursor:pointer;font-weight:600;list-style:none;display:flex;justify-content:space-between;gap:var(--s3)}.faq summary::-webkit-details-marker{display:none}.faq summary::after{content:"+";font-family:var(--mono)}.faq details[open] summary::after{content:"–"}.faq p{margin:var(--s2) 0 0;color:var(--ink2)}
/* Produkt */
.produkt{display:grid;gap:var(--s4);padding-bottom:var(--s5)}
.galerie__haupt{position:relative;background:var(--flaeche);aspect-ratio:1}.galerie__haupt img{width:100%;height:100%;object-fit:contain}
.galerie__thumbs{display:flex;gap:var(--s2);margin-top:var(--s2);flex-wrap:wrap}.galerie__thumbs button{width:72px;height:72px;padding:0;background:var(--flaeche);border:2px solid transparent;cursor:pointer}.galerie__thumbs button[aria-current="true"]{border-color:var(--ink)}.galerie__thumbs img{width:100%;height:100%;object-fit:contain}
.kauf__box{display:grid;gap:var(--s3);align-content:start}.kauf h1{font-size:clamp(1.6rem,4.4vw,2.3rem);margin:0}
.kauf__meta{display:flex;flex-wrap:wrap;gap:var(--s2) var(--s4);color:var(--ink2);margin:0;font-size:.85rem}.kauf__meta span:empty{display:none}
.kauf__preis{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--s2) var(--s3)}.pangv{font-size:.85rem;color:var(--ink2)}
.opt{display:grid;gap:var(--s2)}.opt__titel{font-weight:600;font-size:.9rem}.opt select{width:100%}
.segment{display:flex;flex-wrap:wrap;gap:var(--s2)}.segment button{min-height:44px;padding:0 var(--s3);border:1px solid #8a959c;background:#fff;cursor:pointer;border-radius:2px}.segment button[aria-checked="true"]{border:2px solid var(--ink);background:var(--flaeche);font-weight:600}
.kauf__zeile{display:flex;gap:var(--s2);flex-wrap:wrap}.kauf__zeile .btn--gross{flex:1;min-width:180px}
.menge{display:inline-flex;border:1px solid #8a959c;border-radius:2px;background:#fff}.menge button{width:44px;background:none;border:0;cursor:pointer}.menge input{width:56px;border:0;text-align:center;font-family:var(--mono);min-height:50px;padding:0;-moz-appearance:textfield}.menge input::-webkit-inner-spin-button{display:none}
.zeilensumme{margin:0;font-size:.9rem;min-height:1.4em;font-family:var(--mono)}
.kauf__fakten{margin:0;display:grid;border-top:1px solid var(--ink)}.kauf__fakten>div{display:grid;grid-template-columns:110px 1fr;gap:var(--s3);padding:10px 0;border-bottom:1px solid var(--linie)}.kauf__fakten dt{color:var(--ink2);font-size:.85rem}.kauf__fakten dd{margin:0}
.hinweisliste{list-style:none;margin:0;padding:0;display:grid;gap:6px;font-size:.9rem;color:var(--ink2)}.hinweisliste li::before{content:"✓";margin-right:var(--s2);color:var(--gruen);font-weight:700}
.merk[aria-pressed="true"]{background:var(--gelb);border-color:var(--ink)}
.tabs{margin-top:var(--s4)}.tabs__leiste{display:none}
.tab{border-top:1px solid var(--ink)}.tab__titel{margin:0;font-size:1.05rem}.tab__titel button{display:flex;justify-content:space-between;width:100%;padding:var(--s3) 0;background:none;border:0;cursor:pointer;font:inherit;font-stretch:108%;font-weight:700;text-align:left}.tab__titel button[aria-expanded="true"] .i{transform:rotate(180deg)}
.tab__inhalt{display:none;padding-bottom:var(--s4)}.tab.an .tab__inhalt{display:block}
.reihe{margin-top:var(--s6)}
.klebeleiste{position:fixed;left:0;right:0;bottom:0;z-index:30;background:#fff;border-top:2px solid var(--ink);padding:var(--s2) var(--g);display:flex;justify-content:space-between;align-items:center;gap:var(--s3);transform:translateY(110%);transition:transform .2s}.klebeleiste.zeigen{transform:none}
.merkmale{list-style:none;padding:0}.merkmale li{padding:6px 0 6px 22px;position:relative}.merkmale li::before{content:"";position:absolute;left:0;top:.95em;width:10px;height:2px;background:var(--ink)}
/* Prosa, Tabellen, Ratgeber */
.prosa{max-width:72ch}.prosa h2{margin-top:var(--s5)}.prosa h3{margin-top:var(--s4)}.prosa li{margin-bottom:4px}.prosa a{color:var(--ink);font-weight:500}
.tabelle-wrap{overflow-x:auto;margin:0 0 var(--s3);-webkit-overflow-scrolling:touch}table{border-collapse:collapse;width:100%;font-size:.92rem}th,td{padding:10px var(--s3);border-bottom:1px solid var(--linie);text-align:left;vertical-align:top}thead th{border-bottom:2px solid var(--ink);font-weight:700;white-space:nowrap}td.r,th.r{text-align:right}.daten td:first-child{min-width:180px}
.lesen{display:grid;gap:var(--s5);padding-block:var(--s3) var(--s6)}.artikel h1{max-width:20ch}.artikel__stand{color:var(--ink2);margin-bottom:var(--s4)}
.toc{border:1px solid var(--linie);padding:var(--s3);margin-bottom:var(--s3)}.toc ol{margin:var(--s2) 0 0;padding-left:1.2rem}.toc a{text-decoration:none}.toc a:hover{text-decoration:underline}
.lesen__hilfe{border:1px solid var(--ink);padding:var(--s3);background:var(--gelb)}.lesen__hilfe .btn{background:#fff}.lesen__hilfe p{margin:var(--s2) 0 var(--s3)}
.quellen{font-size:.9rem;color:var(--ink2)}
.seitenkasten{border:1px solid var(--linie);padding:var(--s4);background:var(--flaeche);align-self:start}.seitenkasten h2{font-size:1.1rem}
/* Fuß */
.fuss{background:var(--ink);color:#d7dde0;margin-top:var(--s6);padding-top:var(--s5)}.fuss a{color:#fff}.fuss__raster{display:grid;gap:var(--s5);grid-template-columns:repeat(2,minmax(0,1fr))}.fuss__marke{grid-column:1/-1}.fuss__marke p{max-width:46ch}
.fuss__h{font-size:.8rem;text-transform:uppercase;letter-spacing:.1em;font-stretch:100%;color:var(--gelb);margin-bottom:var(--s3)}.fuss ul{list-style:none;margin:0;padding:0}.fuss li{padding:3px 0}.fuss li.ein{padding-left:var(--s3);font-size:.9rem}.fuss li a{text-decoration:none}.fuss li a:hover{text-decoration:underline}
.fuss .btn--hell{color:var(--ink)}
.fuss__unten{border-top:1px solid #3b454b;margin-top:var(--s5);padding-block:var(--s4);display:grid;gap:var(--s2);color:#b3bdc2}.zbadge{display:inline-block;border:1px solid #5b666d;padding:2px 8px;font-size:.78rem;margin:0 4px 4px 0;color:#fff}
.fuss--kasse{margin-top:var(--s5);padding-top:var(--s3);padding-bottom:var(--s3)}
.kopf--kasse .kopf__zeile{grid-template-columns:auto 1fr auto}.kasse__sicher{justify-self:center;color:var(--ink2);font-size:.9rem}
/* Formulare und Shop-Ansichten */
.feld{display:grid;gap:4px;margin-bottom:var(--s3)}.feld label,.feld .lbl{font-weight:600;font-size:.9rem}.feld small{color:var(--ink2)}.feld.fehler input,.feld.fehler select,.feld.fehler textarea{border:2px solid var(--rot)}.feld.fehler label{color:var(--rot)}
.felder2,.felder3{display:grid;gap:0 var(--s3)}.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.box{border:1px solid var(--linie);background:var(--flaeche);padding:var(--s3);margin-bottom:var(--s3)}.box--err{border-color:var(--rot);background:#fdf1f0;color:#7d1a14}.box--ok{border-color:var(--gruen);background:#eaf6f0}.box--warn{border-color:#b58900;background:#fff7dc}.box--blau{border-color:var(--blau);background:#eef3fd}
.demo-hinweis{background:#fff7dc;border:1px dashed #b58900;padding:var(--s3)}
.seite-shop{padding-block:var(--s3) var(--s6)}.seite-shop>h1{margin-bottom:var(--s4)}
.leer{padding:var(--s5) 0}
.korb{display:grid;gap:var(--s5)}
.schritte{display:flex;gap:var(--s3);list-style:none;margin:0 0 var(--s4);padding:0;font-size:.85rem;flex-wrap:wrap}.schritte li,.schritte span{display:flex;gap:6px;align-items:center;color:var(--ink2)}.schritte b{display:inline-grid;place-items:center;width:24px;height:24px;border:1px solid var(--ink2);font-family:var(--mono);font-size:.78rem}.schritte .an{color:var(--ink);font-weight:700}.schritte .an b,.schritte .fertig b{background:var(--ink);color:#fff;border-color:var(--ink)}.schritte a{text-decoration:none;display:flex;gap:6px;align-items:center}
.kasse__h2{margin-top:0}
.wahl{display:grid;gap:var(--s2);margin-bottom:var(--s3)}.wahl label{display:grid;grid-template-columns:auto 1fr auto;gap:var(--s3);align-items:center;padding:var(--s3);border:1px solid #8a959c;cursor:pointer}.wahl label:has(input:checked){border:2px solid var(--ink);background:var(--flaeche);padding:calc(var(--s3) - 1px)}.wahl small{display:block;color:var(--ink2)}.wahl .rechts{font-family:var(--mono);text-align:right}.wahl input{width:20px;height:20px;accent-color:var(--ink)}.wahl label.aus{opacity:.55}
.zusammenfassung,.summen{border:1px solid var(--ink);padding:var(--s4);background:#fff;align-self:start}.summen dl{display:grid;grid-template-columns:1fr auto;gap:6px var(--s3);margin:0 0 var(--s3)}.summen dd{margin:0;text-align:right;font-family:var(--mono)}.summen .gesamt{font-weight:700;font-size:1.15rem;border-top:1px solid var(--ink);padding-top:8px}
.rechtlich{font-size:.85rem;color:var(--ink2)}
.pos{display:grid;grid-template-columns:64px 1fr auto;gap:var(--s3);padding:var(--s3) 0;border-bottom:1px solid var(--linie);align-items:start}.pos img{width:64px;height:64px;object-fit:contain;background:var(--flaeche)}.pos__name{font-weight:600;text-decoration:none;overflow-wrap:anywhere}.pos__var{font-size:.82rem;color:var(--ink2);overflow-wrap:anywhere}.pos__zeile{display:flex;gap:var(--s2);align-items:center;margin-top:var(--s2);flex-wrap:wrap}.pos__summe{text-align:right;font-family:var(--mono)}.pos__summe small{display:block;color:var(--ink2)}.pos .menge input{min-height:38px;width:46px}.pos .menge button{width:36px}
.frei{font-size:.88rem}.frei__balken{height:4px;background:var(--linie);margin-top:6px}.frei__balken i{display:block;height:100%;background:var(--ink)}
.bestellkarte{border:1px solid var(--linie);padding:var(--s4);margin-bottom:var(--s3)}.bestellkarte__kopf{display:flex;flex-wrap:wrap;gap:var(--s2) var(--s3);align-items:center;margin-bottom:var(--s3)}
.status{display:inline-block;padding:2px 10px;font-size:.78rem;font-weight:600;border:1px solid var(--ink2)}.status--ok{background:#e6f4ee;border-color:var(--gruen);color:#0b5a3a}.status--warn{background:#fff7dc;border-color:#b58900}.status--blau{background:#eef3fd;border-color:var(--blau)}
.verlauf{display:flex;list-style:none;padding:0;margin:0 0 var(--s3);gap:0}.verlauf li{flex:1;font-size:.78rem;padding-top:8px;border-top:3px solid var(--linie);color:var(--ink2)}.verlauf li.an{border-top-color:var(--ink);color:var(--ink);font-weight:600}
.konto-raster{display:grid;gap:var(--s4)}.konto-nav{display:flex;gap:var(--s2);flex-wrap:wrap}.konto-nav button{min-height:40px;padding:0 var(--s3);border:1px solid var(--linie);background:#fff;cursor:pointer}.konto-nav button[aria-current="true"]{background:var(--ink);color:#fff}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:var(--ink);color:#fff;padding:12px 20px;z-index:120;max-width:90vw}
.lade{display:inline-block;width:14px;height:14px;border:2px solid var(--linie);border-top-color:var(--ink);border-radius:50%;animation:dreh .8s linear infinite;vertical-align:-2px}@keyframes dreh{to{transform:rotate(360deg)}}
.nur-druck{display:none}
@media (min-width:560px){.raster{grid-template-columns:repeat(3,minmax(0,1fr))}.kacheln{grid-template-columns:repeat(3,minmax(0,1fr))}.felder2{grid-template-columns:1fr 1fr}.felder3{grid-template-columns:1fr 2fr 1fr}}
@media (min-width:900px){:root{--g:24px}.held__raster{grid-template-columns:1.1fr .9fr}.zweispalt{grid-template-columns:1fr 1fr}.produkt{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:var(--s5)}.kauf__box{position:sticky;top:150px}
 .tabs__leiste{display:flex;gap:0;border-bottom:1px solid var(--ink);flex-wrap:wrap}.tabs__reiter{padding:12px var(--s4);text-decoration:none;font-weight:600;border-bottom:3px solid transparent;margin-bottom:-1px}.tabs__reiter[aria-selected="true"]{border-bottom-color:var(--gelb);background:var(--flaeche)}
 .tab{border:0}.tab__titel{display:none}.tab__inhalt{padding:var(--s4) 0}.tab:not(.an){display:none}.tab.an .tab__inhalt{display:block}
 .korb{grid-template-columns:minmax(0,1fr) 400px}.lesen{grid-template-columns:minmax(0,1fr) 300px}.lesen--ohne{grid-template-columns:1fr}.lesen__seite{position:sticky;top:150px;align-self:start}.konto-raster{grid-template-columns:220px 1fr}.konto-nav{flex-direction:column}
 .fuss__raster{grid-template-columns:1.4fr 1fr 1fr 1fr}.fuss__marke{grid-column:auto}.klebeleiste{display:none}}
@media (min-width:1100px){.raster{grid-template-columns:repeat(4,minmax(0,1fr))}.kacheln{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:899px){.ikon--menue{display:inline-flex}.nav{display:none}.kopf__zeile{grid-template-columns:auto auto 1fr}.kopf__logo{grid-column:2}.kopf__ikonen{grid-column:3;justify-self:end}.suche{grid-column:1/-1;grid-row:2;max-width:none}.service__zeile{justify-content:center}.service__zeile>span:first-child{display:none}.service__rechts{gap:var(--s3)}.service a:last-of-type{display:none}}
@media (max-width:440px){.kopf__ikonen>a{display:none}.kopf__zeile{gap:var(--s2)}}
@media (max-width:420px){.wm{font-size:1.1rem}.wm__skala{width:26px;height:26px}.kauf__fakten>div{grid-template-columns:1fr;gap:0}}
@media print{.kopf,.fuss,.krumen,.no-print,.drawer,.mnav,.klebeleiste{display:none!important}.nur-druck{display:block}body{background:#fff}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}
.lesen>*,.produkt>*,.korb>*,.zweispalt>*,.held__raster>*,.konto-raster>*{min-width:0}
.prosa,.box,.bestellkarte,.seitenkasten{overflow-wrap:anywhere}.suche--gross input{flex:1}
.suche--gross .btn{width:auto;flex:none;border-color:var(--ink)}.suche--gross{max-width:100%}
.karte__sub{display:block;overflow-wrap:anywhere;font-size:.8rem;color:var(--ink2)}.karte__text,.karte__name{min-width:0;overflow-wrap:anywhere}.karte__fuss{min-width:0}
.b2b{background:var(--gelb);color:var(--ink);font-size:.82rem;line-height:1.35}.b2b .wrap{padding-block:6px}
.b2b-hinweis{margin:0;padding:8px 12px;background:var(--flaeche);border-left:0;font-size:.88rem;font-weight:600}
.uvp{margin:-6px 0 0;font-size:.88rem;color:var(--ink2)}.uvp s{font-family:var(--mono)}.spar{color:var(--ok,#1b6b3a);font-weight:600;white-space:nowrap}.karte__spar{margin:0 0 4px;font-size:.82rem;font-weight:600;color:var(--ok,#1b6b3a)}.karte__spar small{font-weight:400;color:var(--ink2)}.pos__summe .spar{display:block;font-weight:600;color:var(--ok,#1b6b3a)}
.check-unternehmer{display:flex;gap:var(--s2);align-items:flex-start;margin:var(--s3) 0;padding:var(--s3);border:2px solid var(--ink);font-weight:600;cursor:pointer}.check-unternehmer input{width:22px;height:22px;flex:none;accent-color:var(--ink);margin-top:2px}
.segment .btn,.segment label{white-space:normal;text-align:left;justify-content:flex-start;max-width:100%;height:auto;padding-block:8px}.segment label input{flex:none}
.wahl label,.wahl span{min-width:0}.wahl span{overflow-wrap:anywhere}.wahl .rechts{white-space:nowrap}@media (max-width:420px){.wahl label{padding:12px;gap:var(--s2)}}