mit Farbverlauf. Bei Zubehoer
(heller Sandton) las sich das als fehlendes Bild — genau das gemeldete
Fehlerbild. Jetzt steckt ein
darin; die Farbflaeche bleibt nur
noch Grund fuer Artikel ohne hinterlegtes Bild. `contain`, weil die
Aufnahmen unterschiedliche Seitenverhaeltnisse haben und ein Zuschnitt
im 60-px-Rahmen vom Erdspiess nichts uebrig liesse. */
.citem .thumb{width:60px;height:75px;border-radius:4px;background:var(--sand);
flex-shrink:0;position:relative;overflow:hidden;border:1px solid var(--linie)}
.citem .thumb img.bild{position:absolute;inset:0;width:100%;height:100%;
object-fit:contain;background:var(--grund)}
.citem .thumb.leer{background:linear-gradient(160deg,#a05a34,#6d3a20)}
.citem .info{flex:1;min-width:0}
.citem .info h4{font-size:.9rem;color:var(--anthrazit);margin-bottom:.2rem;line-height:1.3}
.citem .info .meta{font-size:.78rem;color:var(--grau)}
.citem .disc-note{font-size:.76rem;color:var(--gruen-tief);font-weight:600;margin-top:.3rem}
.citem .cqty{display:flex;align-items:center;gap:.4rem;margin-top:.5rem}
.citem .cqty button{width:26px;height:26px;border:1px solid var(--linie);background:#fff;border-radius:3px;color:var(--gold-text);font-size:1rem;line-height:1}
.citem .cqty span{min-width:24px;text-align:center;font-weight:600;font-size:.9rem}
.citem .cqty .rm{margin-left:.5rem;color:var(--grau);border:none;background:none;font-size:.76rem;text-decoration:underline;width:auto}
.citem .cprice{text-align:right;white-space:nowrap}
.citem .cprice .amt{font-weight:700;color:var(--anthrazit)}
.citem .cprice .was{font-size:.75rem;color:var(--grau);text-decoration:line-through}
.drawer-foot{border-top:1px solid var(--linie);padding:1.2rem 1.3rem}
.sumrow{display:flex;justify-content:space-between;font-size:.9rem;margin-bottom:.5rem;color:#555}
.sumrow.total{font-size:1.15rem;font-weight:700;color:var(--anthrazit);margin:.6rem 0}
.sumrow .vat-info{color:var(--grau);font-size:.8rem}
.btn-checkout{width:100%;background:var(--rost);color:#fff;border:none;border-radius:4px;padding:1rem;font-size:1.05rem;font-weight:600;margin-top:.6rem}
.btn-checkout:hover{background:var(--rost-tief)}
/* Fassung 144 (Uebergabe Chat 05.10.2026, B): die Lade scrollt selbst, Kopf und Fuss stehen fest. Der Fuss traegt
nur Zwischensumme und „Zur Kasse“ — so bleibt auf 360 x 640 (sichtbar 512 px) die erste Artikelzeile ganz im
Bild, und im Querformat (280 px) ist „Zur Kasse“ erreichbar. Diese Regeln stehen HINTER den Grundregeln der
Lade und ueberschreiben sie bei gleicher Spezifitaet. */
.drawer{overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.drawer-h{position:sticky;top:0;z-index:2;background:#fff;flex-shrink:0}
.drawer-body{flex:1 0 auto;overflow-y:visible}
.drawer-foot{position:sticky;bottom:0;z-index:2;background:#fff;flex-shrink:0;padding:.75rem 1.3rem calc(.85rem + env(safe-area-inset-bottom))}
.drawer-foot .sumrow.total{margin:0 0 .1rem;align-items:baseline}
.drawer-foot .inkl{font-size:.75rem;font-weight:400;color:var(--grau)}
.korb-infos{padding:1rem 0 .2rem}
.korb-infos .gb-zeile{margin:16px 0}
.korb-infos + .checkliste{margin-top:16px}
.toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%) translateY(20px);background:var(--anthrazit);color:#fff;padding:.8rem 1.4rem;border-radius:6px;font-size:.9rem;z-index:120;opacity:0;pointer-events:none;transition:.25s}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
/* Footer */
footer{background:var(--anthrazit);color:#bdbdbd;font-size:.86rem;margin-top:2rem}
.foot{max-width:1240px;margin:0 auto;padding:2.5rem 1.5rem 1.5rem;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:2rem}
.foot h4{color:#fff;font-size:.95rem;margin-bottom:.8rem}
.foot a{display:block;padding:.25rem 0;cursor:pointer}
.foot a:hover{color:var(--rost-hell)}
/* Cookie-Einstellungen (Fassung 74): eine Schaltflaeche im Stil der Links
daneben — sie fuehrt nirgendwohin, sie oeffnet Shopifys Einstellungen. */
.foot-cookies{display:block;padding:.25rem 0;background:none;border:0;color:inherit;
font:inherit;text-align:left;cursor:pointer}
.foot-cookies:hover{color:var(--rost-hell)}
.foot-logo{font-weight:700;font-size:1.25rem;color:#fff;margin-bottom:.5rem}
.foot-logo b{color:var(--rost-hell)}
.foot p{line-height:1.6;max-width:22rem}
.pay{display:flex;gap:.4rem;margin-top:.9rem;flex-wrap:wrap}
.pay span{background:rgba(255,255,255,.12);padding:.2rem .5rem;border-radius:3px;font-size:.7rem}
.foot-bottom{border-top:1px solid rgba(255,255,255,.14);padding:1rem 1.5rem;text-align:center;font-size:.76rem;color:#888}
/* Widerrufsbutton erste Stufe (§ 356a BGB). Er muss gut lesbar und darf nicht
schwaecher gesetzt sein als die uebrigen Footer-Links: groesser (.9 statt
.86 rem), reines Weiss statt #bdbdbd und ein Rahmen, der ihn als Schaltflaeche
ausweist. */
.foot-widerruf{display:inline-block;margin-top:.55rem;padding:.45rem .9rem;font-size:.9rem;
font-weight:700;color:#fff;border:1px solid rgba(255,255,255,.55);border-radius:4px}
.foot-widerruf:hover{color:#fff;background:rgba(255,255,255,.12);border-color:#fff}
/* Fassung 137: Profile in sozialen Netzwerken. Tippflaeche 44 x 44 wie .cartbtn
(Fassung 124), 8 px Abstand, eine Zeile in der ersten Footer-Spalte. Die
Spezifitaet (.foot .footer-social a) schlaegt .foot a — sonst truege jeder Link
display:block und padding .25rem 0. Der Rand links setzt die 24-px-Glyphe
buendig unter den Text der Spalte: (44 - 24) / 2 = 10 px. */
.foot .footer-social{display:flex;flex-wrap:wrap;gap:8px;margin:.8rem 0 0 -10px}
.foot .footer-social:empty{display:none}
.foot .footer-social a{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;
width:44px;height:44px;padding:0;border-radius:4px;color:#bdbdbd}
.foot .footer-social a:hover,.foot .footer-social a:focus-visible{color:var(--rost-hell)}
.foot .footer-social svg{display:block;width:24px;height:24px;fill:currentColor}
/* Das Sprite traegt nur die Symbole. `hidden` wirkt auf ein