
@font-face{font-family:'TT Travels Next';src:url(tt-travels-next.woff2) format('woff2');font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:'Space Grotesk';src:url(space-grotesk.woff2) format('woff2');font-weight:300 700;font-style:normal;font-display:swap}
body{margin:0}
a{color:#16242E;text-decoration:none}a:hover{color:#0B4257}
.pg{font-family:'Space Grotesk',system-ui,sans-serif;color:#16242E;background:#DCE8EE;font-size:17px;line-height:1.62;-webkit-font-smoothing:antialiased;overflow-x:clip;cursor:url(cursor-yellow.svg) 10 10,auto}
.pg a,.pg button,.pg label,.pg summary,.pg .gal img,.pg .thumbs .t{cursor:url(cursor-hover.svg) 10 10,pointer}
.pg *{box-sizing:border-box}
.pg img{display:block;max-width:100%}
.pg h1,.pg h2,.pg h3,.pg p,.pg ul,.pg dl,.pg dd,.pg figure{margin:0;padding:0}
.w{max-width:1360px;margin:0 auto;padding:0 40px}
.tt{font-family:'TT Travels Next','Space Grotesk',sans-serif}
/* Kopf */
.hd{background:#67909F;position:sticky;top:0;z-index:60;transition:box-shadow .3s}
.hd.scrolled{box-shadow:0 10px 30px rgba(22,36,46,.22)}
.hd.scrolled .w{min-height:70px}.hd.scrolled .logo img{height:38px}
.hd .w{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:92px;padding-top:12px;padding-bottom:12px;transition:min-height .3s}
.hd .logo img{height:46px;width:auto;transition:height .3s}
.nav{display:flex;flex-wrap:wrap;gap:6px 30px;font-family:'TT Travels Next',sans-serif;font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.nav a{padding:12px 0;background:linear-gradient(#16242E,#16242E) left calc(100% - 6px)/0 2px no-repeat;transition:background-size .35s cubic-bezier(.2,.7,.2,1)}
.nav a.on{background-size:100% 2px;color:#16242E}
.nav a:hover{background-image:linear-gradient(#FFFFFF,#FFFFFF);background-size:100% 2px;color:#FFFFFF}
.hd .lang a:hover{color:#FFFFFF}
.nav a{transition:background-size .35s cubic-bezier(.2,.7,.2,1),color .25s}
.hd .right{display:flex;align-items:center;gap:22px}
.lang{font-family:'TT Travels Next',sans-serif;font-size:12px;font-weight:600;letter-spacing:.1em;display:flex;gap:8px;align-items:center}
.lang a{padding:12px 2px}.lang .on{border-bottom:2px solid #16242E}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 22px;border-radius:999px;font-family:'TT Travels Next',sans-serif;font-weight:600;font-size:13px;letter-spacing:.03em;white-space:nowrap;border:0;cursor:pointer;transition:transform .2s,background .2s}
.btn svg{flex:none;transition:transform .3s cubic-bezier(.2,.7,.2,1)}
.btn:hover .ic-out{transform:translate(3px,-3px)}.btn:hover .ic-arr{transform:translateX(5px)}.btn.buy:hover .ic-cart{animation:cartnudge .55s cubic-bezier(.2,.7,.2,1)}
.btn.buy{background:#FBC100;color:#16242E}.btn.buy:hover{background:#16242E;color:#FFFFFF}
.btn.line{background:transparent;color:#16242E;box-shadow:inset 0 0 0 1.5px #16242E}.btn.line:hover{background:#16242E;color:#FFFFFF}
.btn.big{min-height:60px;font-size:15px;padding:0 30px}
.btn.wide{width:100%;padding:0 14px;gap:8px}
/* Typo */
.eyebrow{font-family:'TT Travels Next',sans-serif;font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:#3D6475}
.h-xl{font-family:'TT Travels Next',sans-serif;font-weight:700;font-size:clamp(34px,4.6vw,72px);line-height:1.05;letter-spacing:-.025em}
.h-l{font-family:'TT Travels Next',sans-serif;font-weight:700;font-size:clamp(28px,3.1vw,46px);line-height:1.1;letter-spacing:-.02em}
.h-m{font-family:'TT Travels Next',sans-serif;font-weight:700;font-size:clamp(21px,1.8vw,27px);line-height:1.2;letter-spacing:-.01em}
.lead{font-size:clamp(19px,1.6vw,24px);line-height:1.5}
.note{font-size:14px;color:#3D6475}
.sec{padding:112px 0}
.split{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:56px 72px;align-items:start}
.cols2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 48px}
.stack{display:flex;flex-direction:column;gap:22px}
/* Farbflächen */
.blue{background:#67909F}
.blue .eyebrow,.blue .note,.blue .by,.blue .card .by,.blue .person .by{color:#16242E}
.blue .h-xl,.blue .h-l,.blue .h-m{color:#FFFFFF}
.deep{background:#1F3A47;color:#FFFFFF}
.deep a{color:#FFFFFF}.deep a:hover{color:#BFD8E4}
.deep .eyebrow,.deep .note,.deep .by,.deep .card .by{color:#BFD8E4}
.deep .price s{color:#BFD8E4}
.deep .btn.buy{color:#16242E}.deep .btn.buy:hover{background:#FFFFFF;color:#16242E}
.deep .btn.line{color:#FFFFFF;box-shadow:inset 0 0 0 1.5px #FFFFFF}.deep .btn.line:hover{background:#FFFFFF;color:#16242E}
.phero{padding:72px 0 88px}
.crumb{font-family:'TT Travels Next',sans-serif;font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;display:flex;gap:10px;flex-wrap:wrap;padding:0 0 26px}
/* Regal */
.shelf{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:48px 20px}
.shelf.s4{grid-template-columns:repeat(4,minmax(0,1fr))}
.card{display:flex;flex-direction:column;gap:18px}
.tile{display:grid;place-items:center;aspect-ratio:4/5;background:#FFFFFF;border-radius:4px;transition:background .3s}
.card:hover .tile,.tile:hover{background:#F1F6F9}
.bk{position:relative;display:block;border-radius:2px 5px 5px 2px;overflow:hidden;box-shadow:0 1px 2px rgba(22,36,46,.28),10px 18px 34px rgba(22,36,46,.24),2px 4px 8px rgba(22,36,46,.14);transition:transform .35s}
.bk img{width:100%;height:auto}
.bk::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,0) 0,rgba(255,255,255,.26) 1.6%,rgba(10,20,28,.2) 3%,rgba(255,255,255,.1) 4.4%,rgba(255,255,255,0) 7%);pointer-events:none}
.bk.flat{border-radius:2px}.bk.flat::after{display:none}
.bk::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(115deg,rgba(255,255,255,0) 36%,rgba(255,255,255,.3) 50%,rgba(255,255,255,0) 64%);transform:translateX(-130%);transition:transform 1s cubic-bezier(.2,.7,.2,1);pointer-events:none}
.card:hover .bk::before,.stage:hover .bk::before,.tile:hover .bk::before{transform:translateX(130%)}
.card:hover .bk,.tile:hover .bk{transform:translateY(-8px) rotate(-1.2deg)}
.card h3{font-family:'TT Travels Next',sans-serif;font-weight:700;font-size:17px;line-height:1.25}
.card .by{font-size:15px;color:#3D6475}
.card .row{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.shelf .card .row{flex-direction:column;gap:8px;flex:1}
.shelf .card .btn{margin-top:auto}
.price{font-family:'TT Travels Next',sans-serif;font-weight:600;font-size:16px;white-space:nowrap}
.price s{font-weight:400;color:#3D6475;margin-left:8px}
.hint{display:flex;gap:18px;align-items:center;background:#FFFFFF;color:#16242E;box-shadow:inset 0 0 0 1.5px #FBC100;border-radius:6px;padding:16px 20px;font-size:15px;line-height:1.5}
.hint img{height:34px;width:auto;flex:none}
/* Bilder */
.hero{position:relative;aspect-ratio:2000/800;min-height:300px;background:#BFD8E4;overflow:hidden}
.hero::before{content:"";position:absolute;inset:-6% 0;background:url(hero.jpg) center/cover no-repeat;animation:kenburns 3.2s cubic-bezier(.2,.7,.2,1) both;transform:translateY(var(--py,0))}
.people{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:40px 20px}
.people.s4{grid-template-columns:repeat(4,minmax(0,1fr))}
.person .ph{display:block;overflow:hidden;border-radius:4px}
.person img{aspect-ratio:4/5;object-fit:cover;width:100%;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.person:hover img{transform:scale(1.04)}
.person h3{font-family:'TT Travels Next',sans-serif;font-weight:700;font-size:17px;margin-top:16px}
.person p{font-size:15px}
/* Produkt */
.pdp{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:48px 72px;align-items:start;padding:40px 0 72px}
.stage{display:grid;place-items:center;aspect-ratio:1/1;background:#FFFFFF;border-radius:4px;overflow:hidden}
.thumbs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-top:12px}
.thumbs .t{aspect-ratio:1/1;background:#FFFFFF;border-radius:4px;overflow:hidden;display:grid;place-items:center}
.thumbs .t.on{box-shadow:inset 0 0 0 2px #16242E}
.thumbs .t img{width:100%;height:100%;object-fit:cover}
.buybox{border-radius:6px;padding:28px;display:flex;flex-direction:column;gap:20px;background:#FFFFFF}
.buybox .amount{font-family:'TT Travels Next',sans-serif;font-weight:700;font-size:38px;line-height:1}
.buybox .amount s{font-size:18px;font-weight:400;color:#3D6475;margin-left:12px}
.qty{display:inline-flex;align-items:center;border-radius:999px;box-shadow:inset 0 0 0 1.5px #16242E;height:60px}
.qty button{width:52px;height:60px;border:0;background:transparent;font-size:22px;color:#16242E;cursor:pointer;font-family:inherit}
.qty span{min-width:28px;text-align:center;font-family:'TT Travels Next',sans-serif;font-weight:600}
.buyrow{display:flex;gap:12px;flex-wrap:wrap}
.buyrow .btn{flex:1 1 200px}
.opts{display:flex;gap:10px;flex-wrap:wrap}
.opts button{min-height:48px;padding:0 20px;border-radius:999px;border:0;background:transparent;box-shadow:inset 0 0 0 1.5px #9DB8C4;font-family:'TT Travels Next',sans-serif;font-weight:600;font-size:13px;color:#16242E;cursor:pointer}
.opts button.on{background:#16242E;color:#FFFFFF;box-shadow:none}
.facts{list-style:none;display:flex;flex-direction:column;gap:10px;font-size:15px}
.facts li{display:flex;gap:10px;align-items:flex-start}
.facts svg{flex:none;margin-top:3px;color:#3D6475}
.pg .specs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 32px;border-top:1px solid #16242E;margin-bottom:112px}
.specs div{padding:14px 0;border-bottom:1px solid #A9C3CF;font-size:16px}
.specs dt{font-family:'TT Travels Next',sans-serif;font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#3D6475}
.gal{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.gal.g3{grid-template-columns:repeat(3,minmax(0,1fr))}.gal.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.gal img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:4px;transition:transform .5s cubic-bezier(.2,.7,.2,1),box-shadow .5s}
.gal img:hover{transform:scale(1.02);box-shadow:0 14px 34px rgba(22,36,46,.25)}
.gal.g2 img,.gal.wide img{aspect-ratio:3/2}
.gal.cal img{aspect-ratio:2500/1819;background:#FFFFFF}
.prose{max-width:820px;display:flex;flex-direction:column;gap:16px}
.prose h2{font-family:'TT Travels Next',sans-serif;font-weight:700;font-size:20px;line-height:1.3;margin-top:28px}
.prose a{text-decoration:underline}
.acard{display:grid;grid-template-columns:220px minmax(0,1fr);gap:40px;align-items:center}
.acard img{aspect-ratio:4/5;object-fit:cover;width:100%;border-radius:4px}
.member{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:40px 72px;align-items:center;padding:56px 0;border-top:1px solid #A9C3CF}
.member:first-child{border-top:0;padding-top:0}
.member img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:4px}
.legal{max-width:820px;display:flex;flex-direction:column;gap:28px}
.legal dl{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:0 32px;border-top:1px solid #16242E}
.legal dt,.legal dd{padding:12px 0;border-bottom:1px solid #A9C3CF}
.legal dt{font-family:'TT Travels Next',sans-serif;font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#3D6475;padding-top:17px}
/* Fuß */
.ft{background:#16242E;color:#FFFFFF;padding:96px 0 36px}
.ft a{color:#FFFFFF}.ft a:hover{color:#BFD8E4}
.ft .top{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:48px 72px;align-items:start;padding-bottom:72px}
.ft .cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
.ft .h{font-family:'TT Travels Next',sans-serif;font-weight:600;font-size:12px;letter-spacing:.16em;text-transform:uppercase;margin-bottom:14px;color:#BFD8E4}
.ft ul{list-style:none;display:flex;flex-direction:column;gap:4px;font-size:16px}
.ft li a{display:inline-block;padding:5px 0}
.family{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid #35505D}
.family a{display:flex;flex-direction:column;gap:18px;padding:40px 32px;border-left:1px solid #35505D}
.family a:first-child{border-left:0;padding-left:0}
.family img{height:60px;width:auto;align-self:flex-start;opacity:.86;transition:opacity .3s,transform .3s cubic-bezier(.2,.7,.2,1)}
.family a:hover img{opacity:1;transform:translateX(5px)}
.family span{font-size:15px;line-height:1.5;color:#BFD8E4}
.ft .base{padding-top:28px;border-top:1px solid #35505D;display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;font-size:14px;color:#BFD8E4}
@media (max-width:1100px){
 .shelf,.shelf.s4{grid-template-columns:repeat(3,minmax(0,1fr))}.people,.people.s4{grid-template-columns:repeat(3,minmax(0,1fr))}
 .split,.pdp,.ft .top,.member{grid-template-columns:minmax(0,1fr)}.sec{padding:80px 0}.gal{grid-template-columns:repeat(2,minmax(0,1fr))}.pg .specs{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
 .w{padding:0 20px}.shelf,.shelf.s4,.people,.people.s4{grid-template-columns:repeat(2,minmax(0,1fr));gap:36px 14px}.cols2,.pg .specs,.ft .cols,.family,.legal dl{grid-template-columns:minmax(0,1fr)}
 .sec{padding:64px 0}.nav{gap:0 20px;font-size:12px}.hd .logo img{height:36px}.acard{grid-template-columns:minmax(0,1fr)}.acard img{max-width:220px}
 .gal.g3,.gal.g2{grid-template-columns:minmax(0,1fr)}.buybox{padding:20px}.thumbs{grid-template-columns:repeat(4,minmax(0,1fr))}
 .family a{border-left:0;padding:28px 0;border-top:1px solid #35505D}.family a:first-child{border-top:0}.member img{max-width:260px}.phero{padding:48px 0 56px}
 .legal dt{border-bottom:0;padding-bottom:0}.pg .specs{margin-bottom:64px}
}

/* Rechtliche Seiten (Aufbau wie viento-studio.com) */
.lhero h1 span{display:block}.lhero h1 span:first-child{color:#16242E}
.lhero .arrow{font-size:34px;line-height:1;color:#FFFFFF;display:block;margin:30px 0}
.lhero .intro{max-width:760px;display:flex;flex-direction:column;gap:6px;font-size:18px;line-height:1.6}
.lgrid{display:grid;grid-template-columns:300px minmax(0,1fr);gap:80px;align-items:start}
.toc{display:flex;flex-direction:column;position:sticky;top:104px}
.toc .h{font-family:'TT Travels Next',sans-serif;font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:#3D6475;padding-bottom:14px}
.toc a{display:grid;grid-template-columns:36px minmax(0,1fr);gap:8px;padding:9px 0;border-top:1px solid #A9C3CF;font-size:15px;line-height:1.4;transition:padding-left .3s cubic-bezier(.2,.7,.2,1)}
.toc a:hover{padding-left:6px}
.toc a span:first-child{font-family:'TT Travels Next',sans-serif;font-weight:700;font-size:13px;color:#3D6475}
.lbody{border-bottom:1px solid #A9C3CF}
.lsec{display:flex;flex-direction:column;gap:18px;padding:40px 0 44px;border-top:1px solid #A9C3CF;scroll-margin-top:110px}
.lsec h2{display:flex;gap:20px;align-items:baseline;font-family:'TT Travels Next',sans-serif;font-weight:700;font-size:24px;line-height:1.2}
.lsec h2 span:first-child{font-size:14px;color:#3D6475;flex:none}
.ltxt{display:flex;flex-direction:column;gap:16px;font-size:17px;line-height:1.7;max-width:820px}
.ltxt a{text-decoration:underline}
.ltxt dl{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:0 32px}
.ltxt dt,.ltxt dd{padding:10px 0;border-bottom:1px solid #C3D6DF}
.ltxt dt{font-family:'TT Travels Next',sans-serif;font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#3D6475;padding-top:15px}
/* Mobiles Menü */
.burger{display:none;width:48px;height:48px;border:0;background:transparent;padding:0;place-items:center;color:#16242E}
.burger i{display:block;width:26px;height:2px;background:#16242E;margin:3px 0;transition:transform .3s,opacity .3s,width .3s}
.burger i:last-child{width:17px}
.menu-open .burger i:nth-child(1){transform:translateY(8px) rotate(45deg)}.menu-open .burger i:nth-child(2){opacity:0}.menu-open .burger i:nth-child(3){width:26px;transform:translateY(-8px) rotate(-45deg)}
.mm{position:fixed;inset:0;z-index:55;background:#1F3A47;color:#FFFFFF;padding:110px 24px 28px;display:flex;flex-direction:column;justify-content:space-between;gap:24px;opacity:0;visibility:hidden;transition:opacity .35s,visibility .35s;overflow:auto}
.menu-open .mm{opacity:1;visibility:visible}
.mm nav a{display:block;color:#FFFFFF;font-family:'TT Travels Next',sans-serif;font-weight:700;font-size:clamp(30px,8vw,48px);line-height:1.2;padding:10px 0;border-bottom:1px solid #35505D;transform:translateY(16px);opacity:0;transition:transform .5s cubic-bezier(.2,.7,.2,1),opacity .5s}
.menu-open .mm nav a{transform:none;opacity:1}
.mm nav a:nth-child(2){transition-delay:.04s}.mm nav a:nth-child(3){transition-delay:.08s}.mm nav a:nth-child(4){transition-delay:.12s}.mm nav a:nth-child(5){transition-delay:.16s}.mm nav a:nth-child(6){transition-delay:.2s}
.mm .foot{display:flex;flex-direction:column;gap:18px}
.mm .lang a{color:#FFFFFF}.mm .lang .on{border-bottom-color:#FFFFFF}
/* Kaufleiste am Handy */
.buybar{display:none;position:fixed;left:0;right:0;bottom:0;z-index:50;background:#FFFFFF;padding:12px 20px 16px;gap:14px;align-items:center;box-shadow:0 -8px 24px rgba(22,36,46,.14)}
.buybar .btn{flex:1;min-height:54px;font-size:14px;padding:0 14px}
/* Lightbox */
.lb{position:fixed;inset:0;z-index:80;background:rgba(15,26,33,.94);display:grid;place-items:center;opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s}
.lb.on{opacity:1;visibility:visible}
.lb img{max-width:92vw;max-height:86vh;border-radius:4px;transform:scale(.97);transition:transform .4s cubic-bezier(.2,.7,.2,1)}
.lb.on img{transform:none}
.lb button{position:absolute;border:0;background:transparent;color:#FFFFFF;font-family:'TT Travels Next',sans-serif;font-size:14px;font-weight:600;padding:18px;min-width:48px;min-height:48px}
.lb .x{top:10px;right:14px}.lb .p{left:8px;top:50%;font-size:26px}.lb .n{right:8px;top:50%;font-size:26px}
.stage img.shot{width:100%;height:100%;object-fit:cover}
/* Animationen */
@keyframes rise{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@keyframes kenburns{from{scale:1.09}to{scale:1}}
@keyframes bookin{from{opacity:0;transform:translateY(30px) rotate(-4deg)}to{opacity:1;transform:none}}
@keyframes cartnudge{0%{transform:none}35%{transform:translateX(-3px) rotate(-10deg)}70%{transform:translateX(2px) rotate(4deg)}100%{transform:none}}
.ld{animation:rise .9s cubic-bezier(.2,.7,.2,1) both}.ld.l2{animation-delay:.1s}.ld.l3{animation-delay:.22s}.ld.l4{animation-delay:.34s}
.stage .bk{animation:bookin 1.1s cubic-bezier(.2,.7,.2,1) .15s both}
.rv-on .rv{opacity:0;transform:translateY(28px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1)}
.rv-on .rv.in{opacity:1;transform:none}
.rv-on .rv.d1{transition-delay:.07s}.rv-on .rv.d2{transition-delay:.14s}.rv-on .rv.d3{transition-delay:.21s}.rv-on .rv.d4{transition-delay:.28s}
@media (max-width:1000px){
 .hd .nav,.hd .right .lang,.hd .right .btn{display:none}.burger{display:grid}.hd .w{min-height:68px}.hd .logo img{height:38px}
 .lgrid{grid-template-columns:minmax(0,1fr);gap:40px}.toc{display:none}
}
@media (max-width:640px){
 .buybar{display:flex}.has-buybar .ft{padding-bottom:110px}.hint{flex-direction:column;align-items:flex-start;gap:10px}.hint img{height:28px}.ltxt dl{grid-template-columns:minmax(0,1fr)}.ltxt dt{border-bottom:0;padding-bottom:0}.lsec h2{font-size:20px;gap:12px}
 .people.s4,.shelf.s4{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (prefers-reduced-motion:reduce){.pg *,.pg *::before,.pg *::after{animation:none!important;transition:none!important}.rv-on .rv{opacity:1;transform:none}}

/* Preise in den Karten eine Spur groesser */
.price{font-size:19px}
.price s{font-size:15px;margin-left:9px}
.card .row{gap:14px;flex-wrap:wrap}
.card .row>*{min-width:0}
.shelf .card .row{gap:6px}

/* Kauf-Buttons: nichts läuft aus der Pille, Inhalt passt sich der Kartenbreite an */
.btn{overflow:hidden}
.btn .lbl{display:block;min-width:0;overflow:hidden}
.btn .lbl-s{display:none}
.btn .run{display:flex;gap:30px;width:max-content;white-space:nowrap}
.btn.mq .lbl{-webkit-mask-image:linear-gradient(90deg,#000 72%,rgba(0,0,0,0));mask-image:linear-gradient(90deg,#000 72%,rgba(0,0,0,0))}
.btn.mq:hover .lbl,.btn.mq:focus-visible .lbl{-webkit-mask-image:none;mask-image:none}
.btn.mq:hover .run,.btn.mq:focus-visible .run{animation:marquee var(--mqt,6s) linear infinite}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(calc(-50% - 15px))}}
.btn.wide{padding:0 18px;gap:10px}
.shelf .card,.cols2 .card{container-type:inline-size}
.card .btn.wide .ic-out{display:none}
@container (max-width: 214px){.card .btn.wide{padding:0 14px;gap:8px}.card .btn.wide .lbl{display:none}.card .btn.wide .lbl-s{display:block}}
@container (max-width: 152px){.card .btn.wide .ic-cart{display:none}}
/* Regal: weniger Spalten, damit die Karten Platz haben */
@media (max-width:1299px){.shelf{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:1059px){.shelf,.shelf.s4{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:799px){.shelf,.shelf.s4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:420px){.buybar .btn .ic-out{display:none}}
@media (max-width:379px){.buybar .btn .lbl{display:none}.buybar .btn .lbl-s{display:block}}
@media (max-width:420px){.buybox .btn.line .lbl{display:none}.buybox .btn.line .lbl-s{display:block}}
