/* ERSTFAHRT Shop – Markenhandbuch v2.1: Nachtschwarz traegt, Silber spricht, Gruen genau einmal (Startstrich).
   Michroma Versalien fuer Kicker, Montserrat 800 fuer Titel, Inter fuer Saetze. Handy zuerst. */
@font-face{font-family:Michroma;src:url(/fonts/michroma-latin-400-normal.woff2) format("woff2");font-display:swap}
@font-face{font-family:Montserrat;font-weight:800;src:url(/fonts/montserrat-latin-800-normal.woff2) format("woff2");font-display:swap}
@font-face{font-family:Inter;font-weight:400;src:url(/fonts/inter-latin-400-normal.woff2) format("woff2");font-display:swap}
@font-face{font-family:Inter;font-weight:600;src:url(/fonts/inter-latin-600-normal.woff2) format("woff2");font-display:swap}
:root{--bk:#0D0D0F;--fl:#141418;--fl2:#1B1B20;--an:#24252A;--si:#D9DBDF;--mu:#A3A5AC;--gr:#8B8D94;--ws:#FFFFFF;--g:#7CE404;
--tech:Michroma,"Eurostile","Arial Narrow",sans-serif;--word:Montserrat,"Helvetica Neue",Arial,sans-serif;--text:Inter,-apple-system,system-ui,sans-serif;
--gl:max(16px,env(safe-area-inset-left,0px));--gr2:max(16px,env(safe-area-inset-right,0px));--ease:cubic-bezier(.2,.7,.1,1);color-scheme:dark}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
html,body{margin:0;background:var(--bk)}
body{color:var(--si);font:400 16px/1.55 var(--text);-webkit-font-smoothing:antialiased;min-height:100svh;display:flex;flex-direction:column;overflow-x:hidden}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
:focus-visible{outline:1px solid var(--ws);outline-offset:3px}
.k{font:400 10px/1.5 var(--tech);letter-spacing:.18em;color:var(--gr);margin:0;text-transform:uppercase}
.wrap{width:100%;max-width:1180px;margin:0 auto;padding:0 var(--gr2) 48px var(--gl);flex:1}
.schmal{max-width:620px}
.testband{margin:0;padding:6px 16px;text-align:center;font:400 9.5px/1.4 var(--tech);letter-spacing:.2em;color:var(--bk);background:var(--si)}

/* Kopf */
.kopf{position:sticky;top:0;z-index:20;display:flex;justify-content:space-between;align-items:center;height:56px;padding:0 var(--gr2) 0 var(--gl);background:rgba(13,13,15,.86);-webkit-backdrop-filter:saturate(1.4) blur(18px);backdrop-filter:saturate(1.4) blur(18px);border-bottom:1px solid var(--an)}
.marke{display:flex;align-items:center;gap:12px;text-decoration:none;min-height:44px}
.marke img{width:118px;height:auto}
.korbknopf{font:400 10px/1 var(--tech);letter-spacing:.18em;color:var(--si);background:transparent;border:1px solid var(--an);border-radius:999px;height:40px;padding:0 14px;display:flex;align-items:center;gap:8px;cursor:pointer}
.korbknopf .zahl{display:inline-grid;place-items:center;min-width:20px;height:20px;border-radius:10px;background:var(--si);color:var(--bk);font-size:9.5px;letter-spacing:0;padding:0 5px}
.korbknopf .zahl[data-null]{background:transparent;color:var(--gr)}

/* Buehne */
.buehne{padding:48px 0 32px;display:grid;gap:12px}
h1{margin:0;font:800 clamp(36px,9vw,72px)/1.04 var(--word);letter-spacing:-.01em;color:var(--ws);text-wrap:balance}
h2{margin:0;font:800 22px/1.2 var(--word);color:var(--ws)}
.lead{margin:0;font:400 18px/1.5 var(--text);color:var(--si);max-width:40ch}
.ss{display:block;height:2px;width:96px;background:var(--si);position:relative;margin-top:8px}
.ss b{position:absolute;left:0;top:0;height:2px;width:16px;background:var(--g)}
.fein{margin:0;font-size:13px;line-height:1.5;color:var(--gr)}
.fein a{color:var(--si)}
.mitte{text-align:center;margin-top:28px}
.meldung{margin:0;padding:12px 14px;border:1px solid var(--an);border-radius:12px;background:var(--fl2);color:var(--ws);font-size:15px}

/* Raster */
.raster{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr;gap:28px}
@media (min-width:640px){.raster{grid-template-columns:1fr 1fr;gap:24px}}
@media (min-width:1000px){.raster{grid-template-columns:repeat(3,1fr)}}
.kachel a{display:grid;gap:6px;text-decoration:none}
.bild{position:relative;display:block;aspect-ratio:860/1068;border-radius:20px;overflow:hidden;background:var(--fl)}
.bild img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.kachel a:hover .bild img{transform:scale(1.025)}
.visu{position:absolute;left:12px;bottom:12px;margin:0;font:400 8.5px/1 var(--tech);letter-spacing:.18em;color:var(--si);background:rgba(13,13,15,.78);padding:6px 8px;border-radius:6px}
.name{font:800 19px/1.25 var(--word);color:var(--ws);margin-top:8px}
.preis{font:400 15px/1.4 var(--text);color:var(--si)}
.folgt{color:var(--gr)}

/* Knoepfe */
.knopf{display:flex;align-items:center;justify-content:center;width:100%;height:54px;border:0;border-radius:14px;background:var(--ws);color:var(--bk);font:600 17px/1 var(--text);text-decoration:none;cursor:pointer;touch-action:manipulation;transition:opacity .2s}
.knopf:hover{opacity:.9}
.knopf:disabled{background:var(--an);color:var(--gr);cursor:default;opacity:1}
.knopf.zweit{background:transparent;color:var(--ws);border:1px solid var(--an)}
.knopf+.knopf{margin-top:10px}

/* Produktseite */
.zurueck{display:inline-block;padding:16px 0;text-decoration:none}
.pgrid{display:grid;gap:24px}
@media (min-width:900px){.pgrid{grid-template-columns:1.25fr 1fr;gap:56px;align-items:start}.pinfo{position:sticky;top:80px}}
.galerie{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 calc(-1 * var(--gr2)) 0 calc(-1 * var(--gl));padding:0 var(--gr2) 0 var(--gl);scrollbar-width:none;overscroll-behavior-x:contain}
.galerie::-webkit-scrollbar{display:none}
.galerie figure{position:relative;flex:0 0 88%;margin:0;scroll-snap-align:center;border-radius:20px;overflow:hidden;background:var(--fl);aspect-ratio:860/1068}
.galerie figure:only-child{flex-basis:100%}
.galerie img{width:100%;height:100%;object-fit:cover}
@media (min-width:900px){.galerie{display:grid;gap:16px;overflow:visible;margin:0;padding:0}.galerie figure{flex:none}}
.pinfo{display:grid;gap:16px}
.pinfo h1{font-size:clamp(32px,7vw,48px)}
.preis.gross{font:400 20px/1.3 var(--text);color:var(--ws);margin:0}
.text{margin:0;color:var(--si);max-width:44ch}
.wahlform{display:grid;gap:18px;margin-top:6px}
.option{border:0;margin:0;padding:0;display:grid;gap:10px;min-width:0}
.option legend{padding:0;margin-bottom:10px}
.werte{display:flex;flex-wrap:wrap;gap:8px}
.wert{position:relative}
.wert input{position:absolute;opacity:0;width:1px;height:1px}
.wert span{display:flex;align-items:center;justify-content:center;min-width:56px;height:48px;padding:0 16px;border:1px solid var(--an);border-radius:12px;font:600 15px/1 var(--text);color:var(--si);cursor:pointer;touch-action:manipulation}
.wert.breit span{min-width:0}
.wert input:checked+span{border-color:var(--ws);color:var(--ws);box-shadow:inset 0 0 0 1px var(--ws)}
.wert input:focus-visible+span{outline:1px solid var(--ws);outline-offset:3px}
.menge{display:grid;gap:10px;max-width:120px}
select{font:600 16px/1 var(--text);color:var(--ws);background:var(--fl);border:1px solid var(--an);border-radius:12px;height:48px;padding:0 14px;width:100%}
.eck{display:grid;gap:14px;margin:12px 0 0;padding-top:20px;border-top:1px solid var(--an)}
.eck div{display:grid;gap:4px}
.eck dd{margin:0;font-size:14px;color:var(--si)}

/* Warenkorb als Seitenleiste */
.schleier{position:fixed;inset:0;z-index:40;background:rgba(0,0,0,.55);opacity:0;transition:opacity .3s}
.schleier.an{opacity:1}
.korb{position:fixed;z-index:50;top:0;right:0;bottom:0;width:min(440px,100%);background:var(--fl);border-left:1px solid var(--an);display:flex;flex-direction:column;transform:translateX(100%);transition:transform .38s var(--ease);padding-bottom:env(safe-area-inset-bottom,0px)}
.korb.an{transform:none}
.korbkopf{display:flex;justify-content:space-between;align-items:center;padding:calc(14px + env(safe-area-inset-top,0px)) 20px 14px;border-bottom:1px solid var(--an)}
.zu{font:400 9.5px/1 var(--tech);letter-spacing:.18em;color:var(--gr);background:none;border:0;height:44px;padding:0 0 0 12px;cursor:pointer}
.korbinhalt{flex:1;overflow-y:auto;padding:8px 20px;overscroll-behavior:contain}
.leer{color:var(--gr);margin:24px 0}
.pos{display:grid;grid-template-columns:64px minmax(0,1fr) auto;gap:12px;align-items:start;padding:16px 0;border-bottom:1px solid var(--an)}
.pos img{width:64px;height:80px;object-fit:cover;border-radius:10px;background:var(--bk)}
.pos .pn{font:600 15px/1.3 var(--text);color:var(--ws)}
.pos .pa{font-size:13px;color:var(--gr)}
.pos .pb{font:400 14px/1.3 var(--text);color:var(--si);white-space:nowrap}
.stepper{display:flex;flex-wrap:wrap;align-items:center;gap:4px;margin-top:8px}
.stepper button{width:36px;height:36px;border-radius:10px;border:1px solid var(--an);background:transparent;color:var(--si);font:600 16px/1 var(--text);cursor:pointer}
.stepper output{min-width:28px;text-align:center;font:600 15px/1 var(--text);color:var(--ws)}
.stepper .weg{width:auto;padding:0 8px;margin-left:2px;border-color:transparent;font:400 9px/1 var(--tech);letter-spacing:.14em;color:var(--gr)}
.korbfuss{padding:16px 20px 20px;border-top:1px solid var(--an);display:grid;gap:12px;background:var(--fl)}
.summe{margin:0;display:grid;gap:6px}
.summe div{display:flex;justify-content:space-between;font-size:15px}
.summe dt{color:var(--mu)}.summe dd{margin:0;color:var(--si);font-variant-numeric:tabular-nums}
.summe .tot{padding-top:8px;border-top:1px solid var(--an);font-weight:600}
.summe .tot dt,.summe .tot dd{color:var(--ws);font-size:17px}
.arten{margin:0;text-align:center;font:400 8.5px/1.4 var(--tech);letter-spacing:.16em;color:var(--gr)}
body.offen{overflow:hidden}

/* Danke, Tor, Verwalten, Recht */
.tor,.schmal{display:grid;gap:16px;align-content:start;padding-top:48px}
.tor .knopf{max-width:340px}
.zeilen{list-style:none;margin:8px 0;padding:0;display:grid}
.zeilen li{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--an);font-size:15px}
.zeilen li small{display:block;color:var(--gr);font-size:13px}
.zeilen li.tot{font-weight:600;color:var(--ws);border-bottom:0}
.filter{display:flex;gap:8px}
.filter a{font:600 14px/40px var(--text);height:40px;padding:0 16px;border-radius:999px;border:1px solid var(--an);text-decoration:none}
.filter a[aria-current]{background:var(--ws);color:var(--bk)}
.best{border:1px solid var(--an);border-radius:20px;padding:20px;display:grid;gap:12px;background:var(--fl)}
.best header{display:grid;gap:4px}
.adr{margin:0;font-size:15px;color:var(--ws)}
.statusform{display:grid;gap:12px}
.feld{display:grid;gap:6px}
.feld input{font:400 16px/1 var(--text);color:var(--ws);background:var(--bk);border:1px solid var(--an);border-radius:12px;height:48px;padding:0 14px}
.recht h2{font-size:18px;margin-top:16px}
.recht p,.recht li{color:var(--si);max-width:62ch}
.recht ul{padding-left:20px;display:grid;gap:8px}


/* ---------- Seile mit Produkten (Uebersicht) ---------- */
.uebersicht main{flex:1}
.kurzkopf{padding-block:32px 4px;display:grid;gap:10px}
.kurzkopf h1{font-size:clamp(36px,8vw,60px)}
.regal{display:grid;gap:2px;padding-top:30px}
.regalkopf{display:flex;justify-content:space-between;align-items:baseline;gap:12px;width:100%;max-width:1180px;margin:0 auto;padding-left:var(--gl);padding-right:var(--gr2)}
.regalkopf h2{font-size:24px}
.regalkopf .k{white-space:nowrap}
.rail{position:relative;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;display:flex;align-items:flex-start;gap:18px;padding:0 var(--gr2) 22px var(--gl);scroll-padding-left:var(--gl);overscroll-behavior-x:contain}
.rail::-webkit-scrollbar{display:none}
.rail .seil{position:absolute;left:0;top:0;pointer-events:none;overflow:visible;z-index:2}
.seillinie{fill:none;stroke:var(--si);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.klemme{fill:var(--bk);stroke:var(--si);stroke-width:1.1}
.gehaenge{fill:none;stroke:var(--si);stroke-width:1.1;stroke-linecap:round}
.hang{flex:0 0 46%;max-width:230px;scroll-snap-align:start;position:relative;display:block;padding-top:66px;text-decoration:none;color:inherit;will-change:transform;-webkit-tap-highlight-color:transparent}
.hang .ph{position:relative;display:block;aspect-ratio:860/1068;max-width:100%;overflow:hidden;border:1px solid var(--an);border-radius:14px;background:var(--fl)}
.hang img{width:100%;height:100%;object-fit:cover}
.hang .visu{left:8px;bottom:8px;font-size:7.5px;padding:5px 6px}
.hang .cd{display:block;margin-top:10px;font:400 9px/1.4 var(--tech);letter-spacing:.16em;color:var(--gr)}
.hang .nm{display:block;margin-top:8px;font:800 16px/1.2 var(--word);color:var(--ws)}
.hang .cd+.nm{margin-top:2px}
.hang .pr{display:block;font-size:13.5px;color:var(--mu)}
.hang:focus-visible{outline:none}.hang:focus-visible .ph{outline:1px solid var(--ws);outline-offset:3px}
.unterseil{margin-top:22px}
@media (min-width:760px){.hang{flex-basis:220px}.rail{gap:26px;padding-left:max(32px,calc((100vw - 1180px)/2 + 16px))}.regalkopf h2{font-size:30px}}
/* ---------- Oeffnung ---------- */
.tor2{position:fixed;inset:0;z-index:100;touch-action:none;transition:opacity .45s}
.tor2.weg{opacity:0;pointer-events:none}
.tor2 #torsvg{position:absolute;inset:0;width:100%;height:100%;display:block}
.tagtext{font:400 7.5px/1 var(--tech);letter-spacing:.14em;fill:var(--bk)}
.t2o{position:absolute;left:var(--gl);top:calc(12% + env(safe-area-inset-top,0px));display:grid;gap:10px;pointer-events:none}
.t2o img{width:150px;height:auto}
.t2o .uhr{font:400 34px/1 var(--tech);letter-spacing:.06em;color:var(--si);font-variant-numeric:tabular-nums}
.t2u{position:absolute;right:var(--gr2);bottom:calc(14% + env(safe-area-inset-bottom,0px));display:grid;justify-items:end;gap:12px;pointer-events:none;text-align:right}
.t2u .k{color:var(--si);max-width:22ch}
.t2u .pfeil{width:1px;height:42px;background:linear-gradient(var(--si),transparent);animation:ef-ab 1.8s var(--ease) infinite}
@keyframes ef-ab{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
.t2skip{position:absolute;left:var(--gl);bottom:calc(20px + env(safe-area-inset-bottom,0px));font:400 9px/1 var(--tech);letter-spacing:.2em;color:var(--gr);background:none;border:0;padding:12px 0;cursor:pointer}
@media (min-width:760px){.t2o{left:max(32px,6vw)}.t2o .uhr{font-size:46px}.t2o img{width:200px}}
/* ---------- Fahrt in den Korb ---------- */
.flug{position:fixed;inset:0;z-index:90;pointer-events:none;width:100%;height:100%;overflow:visible;transition:opacity .3s}
.flug.aus{opacity:0}
.flugseil{fill:none;stroke:var(--si);stroke-width:1.6;stroke-linecap:round}
.flugrand{fill:none;stroke:var(--si);stroke-width:1}
.korbknopf.wipp .zahl{animation:ef-wipp .6s var(--ease)}
@keyframes ef-wipp{30%{transform:scale(1.5)}60%{transform:scale(.9)}}

/* ---------- Entwurf: Wasserzeichen quer ueber die Seite ---------- */
.entwurf{position:fixed;inset:-40vmax;z-index:70;pointer-events:none;display:flex;flex-direction:column;justify-content:center;gap:9vmax;transform:rotate(-28deg);overflow:hidden}
.entwurf span{display:block;white-space:nowrap;text-align:center;font:400 clamp(26px,6.5vw,64px)/1 var(--tech);letter-spacing:.22em;color:rgba(217,219,223,.085)}
.entwurf span:nth-child(even){transform:translateX(-18%)}
.vorschlag{font:400 8px/1 var(--tech);letter-spacing:.16em;color:var(--gr);border:1px solid var(--an);border-radius:4px;padding:3px 5px;vertical-align:2px}
@media print{.entwurf{display:none}}
/* Fuss */
.fuss{border-top:1px solid var(--an);padding:28px var(--gr2) calc(24px + env(safe-area-inset-bottom,0px)) var(--gl);display:grid;gap:10px}
.fuss a{color:var(--gr);text-decoration:none}
.fuss a:hover{color:var(--si)}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* ---------- Drop 00 (08.11.2026): Guide 1.4 Seite 17 – Ecken 2 px, Haarlinien Grat, Knopf in Schnee ---------- */
:root{--sn:#F4EFE6;--grat:#24252A}
[hidden]{display:none!important}
.bild,.galerie figure,.hang .ph,.knopf,.wert span,select,.meldung,.best,.feld input,.pos img,.stepper button,.filter a,.vorschlag,.visu,.korbknopf,.korbknopf .zahl{border-radius:2px}
.knopf{background:var(--sn);color:var(--bk);transition:opacity .7s cubic-bezier(.45,0,.2,1)}
.knopf:hover{opacity:1;filter:brightness(1.04)}
.werte.senkrecht{flex-direction:column;align-items:stretch}
.wert.breit span{justify-content:flex-start;height:auto;min-height:52px;padding:12px 14px;display:grid;gap:4px;text-align:left}
.wert span b{font:600 15px/1.3 var(--text)}
.wert span small{font:400 13px/1.4 var(--text);color:var(--gr)}
.wert input:checked+span small{color:var(--si)}
.eingabe{display:grid;gap:8px}
.eingabe input{font:600 18px/1 var(--text);letter-spacing:.04em;color:var(--ws);background:var(--fl);border:1px solid var(--an);border-radius:2px;height:52px;padding:0 14px;width:100%;max-width:200px}
.eingabe input:focus{border-color:var(--si);outline:none}
.eingabe .vorschau{font:400 12px/1.4 var(--tech);letter-spacing:.14em;color:var(--si);min-height:1.4em;text-transform:uppercase}
.edition{margin:0;display:grid;gap:4px;padding:14px 0;border-top:1px solid var(--an);border-bottom:1px solid var(--an);font-size:14px;color:var(--si)}
.edition .zaehler{color:var(--ws);font-variant-numeric:tabular-nums}
.details{margin:0;padding-left:18px;display:grid;gap:4px;font-size:14px;color:var(--si)}
.bildhinweis{margin-top:10px}
.satz{margin:32px 0 0;font:800 20px/1.2 var(--word);color:var(--ws)}
.hang .ph{border-color:var(--an)}
/* Tag-Modus: Kasse, AGB, Impressum (Guide S. 17) */
body.tag{background:#FFFFFF;color:var(--bk)}
.tag .kopf{background:rgba(255,255,255,.92);border-bottom-color:#E4E5E8}
.tag h1,.tag h2{color:var(--bk)}
.tag .lead,.tag .recht p,.tag .recht li,.tag p,.tag li{color:#24252A}
.tag .k{color:#5E6068}
.tag .fuss{border-top-color:#E4E5E8}
.tag .fuss a{color:#5E6068}
.tag a{color:var(--bk)}
.tag .testband{background:var(--bk);color:#FFFFFF}
.tag .entwurf span{color:rgba(13,13,15,.06)}
.recht h1{font-size:clamp(30px,7vw,44px)}
.recht .entwurfhinweis{padding:12px 14px;border:1px solid var(--bk);font-size:14px}
.recht table{border-collapse:collapse;font-size:14px}
.recht td{padding:4px 16px 4px 0;vertical-align:top}
.korb{background:#FFFFFF;color:var(--bk);border-left-color:#E4E5E8}
.korb .korbkopf,.korb .pos,.korb .korbfuss,.korb .summe .tot{border-color:#E4E5E8}
.korb h2,.korb .pos .pn,.korb .stepper output,.korb .summe .tot dt,.korb .summe .tot dd{color:var(--bk)}
.korb .korbfuss{background:#FFFFFF}
.korb .pos .pb,.korb .summe dd{color:#24252A}
.korb .summe dt,.korb .pos .pa,.korb .leer,.korb .fein,.korb .arten,.korb .zu,.korb .stepper .weg{color:#5E6068}
.korb .fein a{color:var(--bk)}
.korb .stepper button{border-color:#D9DBDF;color:var(--bk)}
.korb .knopf{background:var(--bk);color:#FFFFFF}
.korb .knopf:disabled{background:#E4E5E8;color:#8B8D94}
.korb .meldung{background:#F4F4F5;border-color:#E4E5E8;color:var(--bk)}
.korb .pos img{background:#F4F4F5}
.zeilen li>span:last-child{white-space:nowrap}
/* Endkarte vor dem Fuss */
.endkarte{display:grid;justify-items:start;gap:14px;padding:56px var(--gr2) 48px var(--gl);border-top:1px solid var(--an);max-width:1180px;width:100%;margin:0 auto}
.endkarte img{width:200px;height:auto}
.endkarte .satz{margin:0;font:800 clamp(24px,6vw,34px)/1.15 var(--word);color:var(--ws)}
.endkarte .k{color:var(--si);text-decoration:none}
.korb .arten.vor{color:var(--bk);margin-top:4px}
.marke a{display:flex;align-items:center;min-height:44px;text-decoration:none}
.marke a.k{color:var(--gr)}.marke a.k:hover{color:var(--si)}
.zurueckstart{margin-top:22px}.zurueckstart a{text-decoration:none;color:var(--si)}
/* ---------- Danke-Seite (08.11.2026): Versand per Seilbahn, Editionsnummer, So geht es weiter ---------- */
.versand{position:relative;margin:4px 0 0}
.versandbild{display:none}
.versand.js .versandbild{display:block;width:100%;height:200px}
.versandsvg{display:block;width:100%;height:100%;overflow:visible}
.versandtext{margin:0;display:grid;gap:6px}
.versandtext .k{color:var(--si)}
.versandtext .vz{font:400 14px/1.4 var(--text);color:var(--si)}
.versand.js .versandtext{position:absolute;right:0;top:0;text-align:right;justify-items:end;max-width:58%}
.versand.faehrt .versandtext{opacity:0;transform:translateX(-10px)}
.versand.da .versandtext{opacity:1;transform:none;transition:opacity .7s cubic-bezier(.45,0,.2,1),transform .7s cubic-bezier(.45,0,.2,1)}
.zeilen li .nr{display:block;margin-top:8px;font:400 15px/1.3 var(--tech);letter-spacing:.14em;color:var(--ws);text-transform:uppercase;font-variant-numeric:tabular-nums}
.weiterkopf{margin-top:20px}
.weiter{list-style:none;margin:0;padding:0;border-top:1px solid var(--an)}
.weiter li{padding:14px 0;border-bottom:1px solid var(--an);font-size:15px;line-height:1.5;color:var(--si)}
.weiter a,.danke .fein a{color:var(--si)}
.knoepfe{display:grid;margin-top:8px}
/* Warenkorb: AGB bestaetigen */
.agb{display:flex;align-items:flex-start;gap:12px;min-height:44px;padding:6px 0;cursor:pointer;font-size:14px;line-height:1.45;color:#24252A;-webkit-tap-highlight-color:transparent}
.agb input{-webkit-appearance:none;appearance:none;flex:0 0 22px;width:22px;height:22px;margin:0;border:1px solid #8B8D94;border-radius:2px;background:#FFFFFF;display:grid;place-content:center;cursor:pointer}
.agb input::before{content:"";width:11px;height:6px;border-left:2px solid #FFFFFF;border-bottom:2px solid #FFFFFF;transform:translateY(-2px) rotate(-45deg);opacity:0}
.agb input:checked{background:var(--bk);border-color:var(--bk)}
.agb input:checked::before{opacity:1}
.agb input:focus-visible{outline:1px solid var(--bk);outline-offset:3px}
.agb span{padding-top:1px}
.agb a{color:var(--bk)}

/* Vormerken (Tag): ein Gruen = der Startstrich unter dem Titel */
.vmseite{padding-top:48px;padding-bottom:40px}
.vmseite h1{margin:6px 0 0}
.vmstrich{display:block;width:56px;height:4px;margin:18px 0 22px;background:var(--gn,#7CE404)}
.tag .knopf{background:#0D0D0F;color:#FFFFFF}
.tag .knopf.zweit{background:transparent;color:#0D0D0F;border:1px solid #C8C8CE}
.vmform{margin:22px 0 10px}
.vmseite .zeilen{margin:0 0 18px}
.vmseite .fein{margin-top:22px}
.vmsatz{margin:36px 0 0;font:800 20px/1.2 Montserrat,sans-serif;color:#0D0D0F}
.einrform .feld{display:block;margin:0 0 16px}
.einrform .feld input{width:100%;min-height:48px;margin-top:6px;padding:0 12px;border:1px solid #C8C8CE;border-radius:2px;font:400 16px/1 var(--text);color:#0D0D0F;background:#FFFFFF}
.einrform .knopf{margin-top:8px}

/* Countdown und Drop 01 (Vormerken). Kein zusaetzliches Gruen: Auswahl in Weiss. */
.countdown{margin:4px 0 0;font:400 11px/1.5 var(--tech);letter-spacing:.18em;color:var(--si)}
.countdown b{font-weight:400;color:var(--ws)}
.zu01{margin:6px 0 0}.zu01 a{display:inline-flex;align-items:center;min-height:44px;color:var(--si);text-decoration:none;border-bottom:1px solid var(--an)}
.drop01{border-top:1px solid var(--an);margin-top:48px;padding-top:40px;scroll-margin-top:64px}
.drop01 .wrap{display:grid;gap:14px;max-width:860px;flex:none}
.drop01 h2{font:800 clamp(30px,7vw,46px)/1.05 var(--word);color:var(--ws);margin:0}
.drop01 .lead{margin:0;font-size:18px;color:var(--si)}
.d01f{display:grid;gap:16px;margin-top:8px}
.d01f fieldset{border:0;margin:0;padding:0;display:grid;gap:10px}
.d01p .werte{display:flex;gap:10px}
.mgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
@media (min-width:640px){.mgrid{grid-template-columns:repeat(3,1fr)}}
.mot{position:relative;display:grid;gap:6px;cursor:pointer}
.mot input{position:absolute;opacity:0;pointer-events:none}
.mph{display:block;border:1px solid var(--an);border-radius:2px;overflow:hidden;background:var(--fl)}
.mot .mph img{width:100%;aspect-ratio:4/5;object-fit:cover;transition:transform .5s var(--ease)}
.mot:hover .mph img{transform:scale(1.03)}
.mot input:checked+.mph{border-color:var(--ws);box-shadow:0 0 0 1px var(--ws)}
.mot input:focus-visible+.mph{outline:1px solid var(--ws);outline-offset:3px}
.mnm{font:400 10px/1.4 var(--tech);letter-spacing:.16em;text-transform:uppercase;color:var(--mu)}
.mot input:checked~.mnm{color:var(--ws)}
.d01cap .mph{max-width:320px}
.d01reihe{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.d01f .feld{display:grid;gap:6px}
.d01f .feld input,.d01f .feld select{width:100%;height:48px;padding:0 12px;border:1px solid var(--an);border-radius:2px;background:var(--fl2);color:var(--ws);font:400 16px/1 var(--text)}
.d01f .agb{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--mu)}
.d01f .agb input{margin-top:3px;width:20px;height:20px;flex:none}
.vhp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.d01ok{border:1px solid var(--an);border-radius:2px;padding:20px;display:grid;gap:8px}
.d01ok h3{font:800 26px/1.1 var(--word);color:var(--ws);margin:0}.d01ok p{margin:0}
[hidden]{display:none!important}
