:root{--rot:#E2001A;--rot-dunkel:#B50016;--gelb:#FEED01;--tinte:#191616;--grau:#656464;--linie:#E6E6E6;--breite:1280px;--rand:clamp(16px,4vw,40px)}*{box-sizing:border-box}body{margin:0;color:var(--tinte);font-family:"Source Sans 3",Myriad Pro,Arial,sans-serif;font-size:16px;line-height:1.5;background:#fff url(/assets/Kellys-Produktuebersicht-BG-Streifen-seitlich.jpg) repeat-y 0 0;background-size:100%}button{font:inherit;color:inherit;border:0;background:none;cursor:pointer}:focus-visible{outline:3px solid var(--rot);outline-offset:2px}.huelle{max-width:var(--breite);margin:0 auto;padding:0 var(--rand)}.kopf{background:var(--rot);position:sticky;top:0;z-index:40}.kopf-dienst{display:flex;justify-content:flex-end;gap:18px;align-items:center;padding:6px 0;font-size:14.5px;color:#fff}.kopf-dienst a{color:#fff;text-decoration:none}.kopf-dienst a:hover{text-decoration:underline}.kopf-dienst button{color:#fff;font-size:14.5px;padding:2px 4px}.kopf-dienst button[aria-pressed=true]{font-weight:700;color:var(--gelb)}.kopf-haupt{display:flex;align-items:flex-end;gap:24px}.kopf-logo{display:block;flex:none;margin-bottom:-14px;position:relative;z-index:2}.kopf-logo img{display:block;width:clamp(112px,13vw,168px);height:auto}.kopf-nav{margin-left:auto;display:flex;align-items:stretch;overflow-x:auto;scrollbar-width:none}.kopf-nav::-webkit-scrollbar{display:none}.kopf-nav button{color:#fff;font-weight:700;font-size:14px;text-transform:uppercase;padding:15px 16px;border-left:1px solid rgba(255,255,255,.45);white-space:nowrap}.kopf-nav button:last-child{border-right:1px solid rgba(255,255,255,.45)}.kopf-nav button:hover{background:var(--rot-dunkel)}.kopf-nav button[aria-pressed=true]{color:var(--gelb)}.doppelstrich{height:9px;background:var(--rot);border-top:3px solid #fff}.einstieg{display:flex;align-items:center;gap:34px;padding:34px 0 0;flex-wrap:wrap}.einstieg .text{flex:1;min-width:min(300px,100%)}.einstieg h2{margin:0 0 8px;font-size:clamp(22px,2.8vw,31px);font-weight:700;line-height:1.14}.einstieg p{margin:0;color:var(--grau);font-size:16.5px;max-width:48ch}.fahne{flex:none;width:min(400px,100%);aspect-ratio:297/180;background:url(/assets/logoform.svg) no-repeat center/contain;display:grid;place-items:center;padding:0 34px 34px}.fahne h1{margin:0;color:#fff;font-size:clamp(20px,2.6vw,29px);font-weight:700;text-transform:uppercase;text-align:center;line-height:1.1}.werkzeug{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:26px 0 0}.suche{display:flex;align-items:center;gap:10px;border:2px solid var(--linie);background:#fff;padding:9px 15px;min-width:min(320px,100%)}.suche input{border:0;background:none;font:inherit;width:100%;outline:none}.suche svg{flex:none;color:var(--grau)}.zaehlung{color:var(--grau);font-size:15px}.ansicht{display:flex;border:2px solid var(--rot);margin-left:auto}.ansicht button{display:flex;align-items:center;gap:7px;padding:8px 15px;font-weight:700;font-size:14px;text-transform:uppercase;color:var(--rot)}.ansicht button[aria-pressed=true]{background:var(--rot);color:#fff}.ansicht svg{flex:none}.filter{display:flex;flex-wrap:wrap;gap:9px 26px;padding:20px 0 0}.filter button{display:flex;align-items:center;gap:9px;font-size:16px}.filter .kasten{width:15px;height:15px;background:#b4b4b4;flex:none}.filter button[aria-pressed=true] .kasten{background:var(--rot)}.filter button[aria-pressed=true]{font-weight:700}.filter .zahl{color:var(--grau);font-size:14px}.trennlinie{border:0;border-top:2px dashed var(--rot);margin:24px 0 0}main{padding-bottom:170px}.gruppe{padding-top:40px}.gruppe-kopf{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding-bottom:8px}.gruppe-kopf h2{margin:0;color:var(--rot);font-size:clamp(18px,2.1vw,23px);font-weight:700;text-transform:uppercase}.gruppe-kopf .zahl{color:var(--grau);font-size:15px}.gruppe-kopf .tat{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap}.gruppe-kopf .tat button{font-weight:700;font-size:13.5px;text-transform:uppercase;padding:8px 15px;border:2px solid var(--rot);color:var(--rot);background:#fff}.gruppe-kopf .tat button:hover,.gruppe-kopf .tat .voll{background:var(--rot);color:#fff}.gruppe-kopf .tat .voll:hover{background:var(--rot-dunkel);border-color:var(--rot-dunkel)}.raster{display:grid;gap:34px 20px;grid-template-columns:repeat(auto-fill,minmax(196px,1fr));padding-top:20px}.motiv{position:relative;text-align:center;padding-bottom:42px}.motiv .buehne{height:210px;display:flex;align-items:center;justify-content:center;cursor:zoom-in;padding:6px;overflow:hidden}.motiv img{max-width:100%;max-height:198px;object-fit:contain;transition:transform .18s ease}.motiv:hover img{transform:scale(1.05)}.motiv .name{font-weight:700;font-size:15.5px;line-height:1.28;padding:14px 6px 0}.motiv .ean{color:var(--grau);font-size:13px;padding-top:3px}.motiv .haken{position:absolute;top:2px;left:2px;width:22px;height:22px;background:#fff;border:2px solid #B4B4B4;color:transparent;display:grid;place-items:center;font-size:13px;line-height:1;font-weight:700}.motiv.gewaehlt .haken{background:var(--rot);border-color:var(--rot);color:#fff}.motiv.gewaehlt .name{color:var(--rot)}.motiv .laden{position:absolute;left:6px;right:6px;bottom:0;display:flex;gap:2px;opacity:0;transform:translateY(5px);transition:opacity .15s,transform .15s}.motiv:hover .laden,.motiv:focus-within .laden{opacity:1;transform:translateY(0)}.motiv .laden button{flex:1;background:var(--rot);color:#fff;font-weight:700;font-size:12.5px;letter-spacing:.05em;text-transform:uppercase;padding:8px 2px}.motiv .laden button:hover{background:var(--rot-dunkel)}.liste{background:#fff;border:2px solid var(--linie);margin-top:18px}.liste-kopf,.zeile{display:grid;grid-template-columns:44px 62px 1fr 158px auto;align-items:center;gap:14px;padding:8px 14px}.liste-kopf{background:#f7f7f7;border-bottom:2px solid var(--linie);font-size:12.5px;font-weight:700;text-transform:uppercase;color:var(--grau);letter-spacing:.04em;padding-top:10px;padding-bottom:10px}.zeile+.zeile{border-top:1px solid var(--linie)}.zeile:hover{background:#fafafa}.zeile.gewaehlt{background:#fff2f3}.kasten{width:20px;height:20px;background:#fff;border:2px solid #B4B4B4;display:grid;place-items:center;font-size:13px;font-weight:700;line-height:1;color:transparent}.zeile.gewaehlt .kasten,.liste-kopf .kasten.an{background:var(--rot);border-color:var(--rot);color:#fff}.zeile .mini{width:62px;height:62px;display:flex;align-items:center;justify-content:center;cursor:zoom-in;padding:3px}.zeile .mini img{max-width:100%;max-height:56px;object-fit:contain}.zeile .wort{min-width:0}.zeile .wort .name{font-weight:700;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.zeile .wort .ean{color:var(--grau);font-size:13.5px}.spalte-kat{color:var(--grau);font-size:13.5px;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.spalte-format{display:flex;gap:5px}.spalte-format button{border:2px solid var(--linie);color:var(--grau);font-weight:700;font-size:12px;letter-spacing:.04em;padding:6px 11px;text-transform:uppercase;background:#fff}.spalte-format button:hover{border-color:var(--rot);color:var(--rot)}.leer{padding:80px 0;text-align:center;color:var(--grau);font-size:18px}.auswahl{position:fixed;left:0;right:0;bottom:0;z-index:50;background:var(--rot);color:#fff;border-top:3px solid #fff;transform:translateY(115%);transition:transform .2s ease}.auswahl.an{transform:translateY(0)}.auswahl .huelle{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding-top:12px;padding-bottom:12px}.auswahl .zahl{font-weight:700;font-size:16px}.formatwahl{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.formatwahl .titel{font-size:14px;opacity:.85}.formatwahl button{border:2px solid rgba(255,255,255,.65);padding:6px 13px;font-size:13.5px;font-weight:700;text-transform:uppercase}.formatwahl button[aria-pressed=true]{background:#fff;color:var(--rot);border-color:#fff}.auswahl .rechts{margin-left:auto;display:flex;gap:9px}.auswahl .rechts button{font-weight:700;font-size:14px;text-transform:uppercase;padding:9px 18px}.auswahl .laden{background:#fff;color:var(--rot)}.auswahl .weg{border:2px solid rgba(255,255,255,.6)}.lupe{position:fixed;inset:0;z-index:60;background:#191616d6;display:none;place-items:center;padding:var(--rand)}.lupe.an{display:grid}.lupe-blatt{background:#fff;max-width:940px;width:100%;max-height:100%;overflow:auto;display:grid;grid-template-columns:1fr 304px}.lupe-blatt .gross{display:grid;place-items:center;padding:34px;min-height:0}.lupe-blatt .gross img{max-width:100%;max-height:62vh;object-fit:contain}.lupe-seite{border-left:2px solid var(--linie);padding:30px 26px}.lupe-seite h3{margin:0 0 4px;font-size:21px;font-weight:700;line-height:1.25}.lupe-seite .ean{color:var(--grau);font-size:14.5px}.lupe-seite .kat{display:inline-block;margin-top:12px;background:var(--rot);color:#fff;font-weight:700;font-size:12.5px;text-transform:uppercase;padding:5px 12px}.lupe-seite .knoepfe{display:grid;gap:8px;margin-top:24px}.lupe-seite .knoepfe button{border:2px solid var(--rot);color:var(--rot);font-weight:700;font-size:14.5px;padding:12px 16px;display:flex;justify-content:space-between;gap:10px;text-transform:uppercase}.lupe-seite .knoepfe button:hover,.lupe-seite .knoepfe .stark{background:var(--rot);color:#fff}.lupe-seite .knoepfe .stark:hover{background:var(--rot-dunkel);border-color:var(--rot-dunkel)}.lupe-zu{position:absolute;top:12px;right:16px;color:#fff;font-size:34px;line-height:1;padding:4px 12px;font-weight:300}@media(max-width:1000px){.liste-kopf,.zeile{grid-template-columns:40px 54px 1fr auto}.spalte-kat{display:none}}@media(max-width:760px){.kopf-nav{display:none}.liste-kopf,.zeile{grid-template-columns:36px 48px 1fr;row-gap:8px}.zeile .spalte-format{grid-column:1/-1;justify-content:flex-end}.liste-kopf .spalte-format{display:none}.lupe-blatt{grid-template-columns:1fr}.lupe-seite{border-left:0;border-top:2px solid var(--linie)}.lupe-blatt .gross img{max-height:38vh}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}