:root{
  --white:#FFFFFF;
  --gray:#F5F5F7;
  --gray-2:#EDEDF0;
  --ink:#1C1C1E;
  --ink-2:#3A3A3C;
  --muted:#6E6E73;
  --line:#D2D2D7;
  --blue:#007AFF;
  --blue-press:#0062CC;
  --shadow:0 0.625rem 2.5rem rgba(0,0,0,0.05);
  --shadow-hover:0 1rem 3.125rem rgba(0,0,0,0.09);
  --r-sm:0.875rem; --r-md:1.25rem; --r-lg:1.75rem; --r-xl:2.125rem;
  --wrap:73.75rem;
  --gutter:1.25rem;
  --font:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Helvetica Neue",Helvetica,Arial,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{font-size:100%;-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--white);color:var(--ink);
  font-family:var(--font);font-size:1.0625rem;line-height:1.5;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  letter-spacing:-.011em;overflow-x:hidden;
}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
h1,h2,h3,h4{margin:0;font-weight:700;letter-spacing:-.03em;line-height:1.06;font-family:var(--font)}
button,input,select,textarea{font-family:var(--font)}
p{margin:0}
.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter)}
@media(min-width:40rem){ :root{--gutter:1.625rem} }

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.4375rem;
  padding:.75rem 1.625rem;border-radius:61.25rem;font-size:1rem;font-weight:500;
  letter-spacing:-.014em;white-space:nowrap;
  transition:background .22s ease,color .22s ease,border-color .22s ease;
}
.btn-primary{background:var(--blue);color:#fff}
.btn-primary:hover{background:var(--blue-press)}
.btn-secondary{background:var(--gray);color:var(--ink)}
.btn-secondary:hover{background:var(--gray-2)}
.btn-outline{border:1px solid var(--blue);color:var(--blue)}
.btn-outline:hover{background:var(--blue);color:#fff}
.btn-sm{padding:.5625rem 1.125rem;font-size:.875rem}
.btn,.btn-sm{min-height:2.75rem}
@media(min-width:64rem){ .btn-sm{min-height:2.25rem} }

.lnk-arrow{color:var(--blue);font-size:1.0625rem;font-weight:400;display:inline-flex;align-items:center;gap:.5rem}
.lnk-arrow svg{width:1.0625rem;height:1.0625rem;stroke:currentColor;stroke-width:1.9;fill:none;transition:transform .25s ease}
.lnk-arrow:hover{text-decoration:underline}
.lnk-arrow:hover svg{transform:translateX(.25rem)}

.sec{padding:4.5rem 0}
.sec-h{text-align:center;max-width:45rem;margin:0 auto 2.5rem}
.eyebrow{display:block;color:var(--blue);font-size:1.0625rem;font-weight:600;margin-bottom:.625rem}
.sec-h h2{font-size:clamp(1.875rem,7vw,3.125rem)}
.sec-h p{margin-top:.875rem;color:var(--muted);font-size:1.0625rem;line-height:1.48}
@media(min-width:40rem){ .sec{padding:5.5rem 0} .sec-h{margin-bottom:3rem} .sec-h p{font-size:1.1875rem;margin-top:1rem} }
@media(min-width:64rem){ .sec{padding:6.5rem 0} .sec-h{margin-bottom:3.5rem} }

/* ===== ANNOUNCE + NAV ===== */
.announce{background:var(--gray);color:var(--ink-2);font-size:.8125rem}
.announce .wrap{display:flex;align-items:center;justify-content:center;gap:1.125rem;height:2.75rem;overflow:hidden}
.announce span{display:inline-flex;align-items:center;gap:.4375rem;white-space:nowrap}
.announce svg{width:.875rem;height:.875rem;flex:none;stroke:var(--blue);stroke-width:2;fill:none}
.announce .opt{display:none}
@media(min-width:40rem){ .announce .wrap{gap:1.625rem} .announce .opt{display:inline-flex} }

.nav{
  position:sticky;top:0;z-index:80;background:rgba(255,255,255,.78);
  backdrop-filter:saturate(180%) blur(1.25rem);-webkit-backdrop-filter:saturate(180%) blur(1.25rem);
  border-bottom:1px solid rgba(0,0,0,.07);
}
.nav > .wrap{display:flex;align-items:center;height:3.5rem;gap:.625rem;position:relative}
.brand{font-size:1.1875rem;font-weight:700;letter-spacing:-.028em;display:flex;align-items:center;gap:.5625rem;flex:none;color:var(--blue)}
.brand:hover{color:var(--blue-press)}
.brand img{width:1.5rem;height:1.5rem;border-radius:.375rem}
.nav-links{display:none}
.nav-shop-btn{display:none}

.burger{display:grid}
.burger svg{transition:opacity .2s ease}
.burger .ic-x{display:none}
.burger[aria-expanded="true"] .ic-b{display:none}
.burger[aria-expanded="true"] .ic-x{display:block}
.mnav{
  position:absolute;top:100%;left:0;right:0;z-index:79;background:var(--white);
  border-bottom:1px solid var(--line);box-shadow:var(--shadow);
  max-height:0;overflow:hidden;visibility:hidden;opacity:0;
  transition:max-height .34s cubic-bezier(.4,0,.2,1),opacity .22s ease,visibility .34s;
}
.mnav.open{max-height:min(80vh,34rem);overflow-y:auto;visibility:visible;opacity:1}
.mnav > .wrap{display:block;height:auto;padding-top:.25rem;padding-bottom:1.25rem}
.mnav a{
  display:flex;align-items:center;justify-content:space-between;
  min-height:3.25rem;padding:.75rem .25rem;font-size:1.1875rem;font-weight:500;
  letter-spacing:-.02em;border-bottom:1px solid rgba(0,0,0,.07);
}
.mnav a:last-child{border-bottom:0}
.mnav a svg{width:1rem;height:1rem;stroke:var(--muted);stroke-width:2;fill:none;flex:none}
.mnav a:active{color:var(--blue)}
.mnav .mn-count{
  margin-left:auto;margin-right:.625rem;min-width:1.375rem;height:1.375rem;padding:0 .4375rem;
  border-radius:61.25rem;background:var(--blue);color:#fff;font-size:.75rem;font-weight:600;
  display:inline-flex;align-items:center;justify-content:center;
}
.mnav .mn-sec{
  display:block;padding:1rem .25rem .375rem;font-size:.75rem;font-weight:600;
  letter-spacing:.06em;text-transform:uppercase;color:var(--muted);border:0;min-height:0;
}
.mnav .mn-shop{color:var(--blue);font-weight:700}

.cart-toast{
  position:fixed;left:50%;bottom:1.5rem;transform:translate(-50%,1rem);
  display:flex;align-items:center;gap:.5rem;background:#34C759;color:#fff;
  padding:.75rem 1.375rem;border-radius:61.25rem;font-size:.9375rem;font-weight:600;
  letter-spacing:-.01em;box-shadow:0 .5rem 1.75rem rgba(52,199,89,.35);
  opacity:0;pointer-events:none;transition:opacity .25s ease,transform .25s ease;z-index:200;
}
.cart-toast svg{width:1.125rem;height:1.125rem;flex:none}
.cart-toast.show{opacity:1;transform:translate(-50%,0)}

.nav-ic{display:flex;align-items:center;gap:.125rem;margin-left:auto;flex:none}
.nav-ic a,.nav-ic button{width:2.75rem;height:2.75rem;display:grid;place-items:center;border-radius:.5625rem;position:relative;transition:background .18s}
.nav-ic a:hover,.nav-ic button:hover{background:rgba(0,0,0,.045)}
.nav-ic svg{width:1.1875rem;height:1.1875rem;stroke:var(--ink-2);stroke-width:1.7;fill:none}
.nav-ic .ic-cart{stroke:var(--blue)}
.cart-n{
  position:absolute;top:.125rem;right:.0625rem;min-width:.9375rem;height:.9375rem;padding:0 .25rem;
  border-radius:61.25rem;background:var(--blue);color:#fff;font-size:.59rem;font-weight:600;
  display:grid;place-items:center;border:1.5px solid #fff;
}
@media(min-width:75rem){ .nav-links{gap:.375rem} .nav-links a{padding:.5rem 1.0625rem} }
@media(min-width:64rem){
  .nav > .wrap{height:4.25rem}
  .nav-shop-btn{display:inline-flex;margin-right:.375rem}
  .nav-links{display:flex;align-items:center;gap:.125rem;margin:0 auto 0 0}
  .nav-links a{padding:.5rem .8125rem;font-size:1.125rem;font-weight:500;color:var(--ink-2);
    border-radius:.625rem;letter-spacing:-.018em;transition:color .18s,background .18s}
  .nav-links a:hover{color:var(--ink);background:rgba(0,0,0,.045)}
  .nav-ic{margin-left:0}
  .nav-ic a,.nav-ic button{width:2.375rem;height:2.375rem}
  .burger{display:none!important}
  .mnav{display:none}
}

/* ===== HERO ===== */
.hero{background:var(--gray);padding:2.5rem 0 4rem}
.hero-grid{display:grid;grid-template-columns:1fr;gap:2.5rem;align-items:center}
.hero-txt{text-align:center}
.hero-txt h1{font-size:clamp(2.125rem,8vw,3.375rem);line-height:1.06;letter-spacing:-.035em}
@media(max-width:48rem){
  .hero{padding-top:2.75rem;padding-bottom:3rem}
  .hero-txt h1{letter-spacing:-.022em;line-height:1.16;word-spacing:.01em}
  .hero-txt{padding:0 .25rem}
  .slider{max-width:100vw}
}
.hero-txt .sub{margin:1rem auto 0;font-size:clamp(1.0625rem,3.4vw,1.25rem);line-height:1.45;color:var(--muted);max-width:30rem}
.hero-cta{margin-top:1.75rem;display:flex;justify-content:center}
.hero-cta-btn{
  font-size:1.0625rem;font-weight:600;padding:.9375rem 2.125rem;
  box-shadow:0 .625rem 1.875rem rgba(0,122,255,.3);
  transition:background .22s ease,box-shadow .22s ease,transform .22s ease;
}
.hero-cta-btn:hover{box-shadow:0 .875rem 2.25rem rgba(0,98,204,.38);transform:translateY(-.0625rem)}
.hero-cta-btn svg{width:1.0625rem;height:1.0625rem;stroke:currentColor;stroke-width:1.9;fill:none;transition:transform .25s ease}
.hero-cta-btn:hover svg{transform:translateX(.25rem)}
@media(max-width:48rem){
  .hero-cta{width:100%}
  .hero-cta-btn{width:100%}
}
@media(min-width:40rem){ .hero{padding:3.25rem 0 4.5rem} }
@media(min-width:64rem){
  .hero{padding:3.75rem 0 5rem}
  .hero-grid{grid-template-columns:minmax(0,26rem) 1fr;gap:3rem}
  .hero-txt{text-align:left}
  .hero-txt .sub{margin-left:0;margin-right:0}
  .hero-cta{justify-content:flex-start}
}

/* ---- Slider ---- */
.slider{position:relative;width:100%;max-width:100%;overflow:hidden}
.slider-vp{overflow:hidden;border-radius:var(--r-xl);width:100%;max-width:100%}
.slider-track{display:flex;width:100%;transition:transform .6s cubic-bezier(.65,0,.35,1)}
.slide{
  flex:0 0 100%;min-width:0;max-width:100%;display:flex;flex-direction:column;overflow:hidden;
  background:var(--white);border-radius:var(--r-xl);box-shadow:var(--shadow);
}
.slide-vis{background:var(--gray);position:relative;overflow:hidden;padding:0;border-radius:var(--r-xl) var(--r-xl) 0 0}
.slide-vis .frame{display:block;width:100%;aspect-ratio:4/3}
.slide-vis img{width:100%;height:100%;object-fit:cover;object-position:center}
.slide-txt{padding:1.75rem 1.5rem 2rem;text-align:center}
.slide-tag{display:inline-block;font-size:.8125rem;font-weight:600;color:var(--blue);margin-bottom:.625rem}
.slide h2{font-size:clamp(1.375rem,5vw,1.75rem);letter-spacing:-.03em;line-height:1.12}
.slide-desc{margin:.75rem auto 0;color:var(--muted);font-size:.9375rem;line-height:1.5;max-width:24rem}
.deal{display:flex;align-items:flex-end;justify-content:center;gap:1rem;margin-top:1.25rem}
.deal-off{font-size:clamp(1.5rem,6vw,2rem);font-weight:700;letter-spacing:-.04em;color:var(--blue);line-height:.95}
.deal-save{padding-bottom:.25rem;text-align:left}
.deal-save b{display:block;font-size:.8125rem;font-weight:600;color:var(--ink);white-space:nowrap}
.deal-save span{display:block;font-size:.75rem;color:var(--muted);margin-top:.0625rem}
.price-line{display:flex;align-items:baseline;justify-content:center;gap:.625rem;margin-top:1rem}
.price-now{font-size:1.5rem;font-weight:600;letter-spacing:-.03em}
.price-was{font-size:1rem;color:var(--muted);text-decoration:line-through}
.vat{margin-top:.3125rem;font-size:.7rem;color:var(--muted)}
.slide-cta{display:flex;flex-direction:column;align-items:center;gap:.5rem;margin-top:1.375rem}
.slide-cta .cta-row{display:flex;flex-wrap:wrap;justify-content:center;gap:.5625rem;width:100%}
.slide-cta .btn{flex:1 1 auto}
.slide-cta .view-cart{
  display:none;align-items:center;gap:.375rem;color:var(--blue);font-size:.875rem;font-weight:500;
}
.slide-cta .view-cart.show{display:inline-flex}
.slide-cta .view-cart svg{width:.9375rem;height:.9375rem;stroke:currentColor;stroke-width:2;fill:none}

@media(min-width:56rem){
  .slide{display:grid;grid-template-columns:1fr 1fr;align-items:stretch;min-height:20rem}
  .slide-vis{order:2;height:100%}
  .slide-vis .frame{aspect-ratio:auto;height:100%;width:100%}
  .slide-txt{order:1;display:flex;flex-direction:column;justify-content:center;text-align:left;padding:2rem 2.25rem}
  .slide-desc{margin-left:0;margin-right:0}
  .deal{justify-content:flex-start}
  .price-line{justify-content:flex-start}
  .slide-cta{align-items:flex-start}
  .slide-cta .cta-row{justify-content:flex-start}
}

.slider-bar{display:flex;flex-direction:column;align-items:center;gap:.875rem;margin-top:1.25rem}
.slider-arws{display:flex;gap:.625rem;order:2}
.arw{width:2.5rem;height:2.5rem;border-radius:50%;background:rgba(0,0,0,.05);display:grid;place-items:center;flex:none;transition:background .2s}
.arw:hover{background:rgba(0,0,0,.1)}
.arw svg{width:.9375rem;height:.9375rem;stroke:var(--ink-2);stroke-width:2;fill:none}
.sldnav{order:1;display:grid;grid-template-columns:1fr;gap:.5rem;width:100%}
.sldnav-i{
  position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:flex-start;gap:.0625rem;
  padding:.5625rem .875rem;min-height:2.75rem;background:var(--white);border:1px solid var(--line);
  border-radius:var(--r-sm);text-align:left;transition:border-color .22s ease,box-shadow .22s ease;
}
.sldnav-i:hover{border-color:var(--blue);box-shadow:var(--shadow)}
.sldnav-i .sn-name{font-size:.8125rem;font-weight:600;color:var(--ink);line-height:1.3}
.sldnav-i .sn-price{font-size:.8125rem;color:var(--muted)}
.sldnav-i.on{border-color:var(--blue)}
.sldnav-i.on .sn-price{color:var(--blue);font-weight:600}
.sn-bar{position:absolute;left:0;bottom:0;height:2px;width:100%;background:var(--blue);transform:scaleX(0);transform-origin:left}
.sldnav-i.on .sn-bar{animation:snfill 6s linear forwards}
.slider:hover .sldnav-i.on .sn-bar{animation-play-state:paused}
@keyframes snfill{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media(min-width:34rem){ .slider-bar{flex-direction:row;justify-content:center;gap:.875rem} .sldnav{grid-template-columns:repeat(3,1fr);gap:.5rem;width:auto;flex:1 1 auto;max-width:32rem} }
@media(prefers-reduced-motion:reduce){ .sldnav-i.on .sn-bar{animation:none;transform:scaleX(1)} }

.qadd{
  position:absolute;bottom:.875rem;right:.875rem;z-index:3;width:2.5rem;height:2.5rem;border-radius:50%;
  background:var(--white);box-shadow:var(--shadow);display:grid;place-items:center;
  transition:background .2s ease,transform .2s ease,opacity .25s ease;
}
.qadd svg{width:1rem;height:1rem;stroke:var(--blue);stroke-width:1.8;fill:none}
.qadd:hover{background:var(--blue);transform:scale(1.07)}
.qadd:hover svg{stroke:#fff}
.qadd.done{background:var(--blue)}
.qadd.done svg{stroke:#fff}
@media(hover:hover) and (min-width:64rem){ .card .qadd{opacity:0} .card:hover .qadd,.card:focus-within .qadd{opacity:1} }
@media(hover:none){ .card .qadd{display:none} }

/* ===== KATEGORIEN ===== */
.overlap{position:relative;z-index:5;background:var(--white);padding-top:3.75rem}
@media(min-width:64rem){ .overlap{padding-top:5.625rem} }
.cat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.5rem}
@media(min-width:40rem){ .cat-grid{grid-template-columns:repeat(3,1fr);gap:.75rem} }
@media(min-width:64rem){ .cat-grid{grid-template-columns:repeat(4,1fr);gap:.875rem} }
.cat{display:flex;flex-direction:column;align-items:center;text-align:center;padding:1.75rem 1rem 1.5rem;border-radius:var(--r-md);transition:background .25s ease,transform .25s ease,box-shadow .25s ease}
.cat:hover{background:var(--gray);transform:translateY(-.25rem);box-shadow:var(--shadow-hover)}
.cat-ic{width:3.75rem;height:3.75rem;border-radius:50%;background:var(--gray);display:grid;place-items:center;margin-bottom:.9375rem;transition:background .25s}
.cat:hover .cat-ic{background:var(--gray-2)}
.cat-ic svg{width:1.5rem;height:1.5rem;stroke:var(--blue);stroke-width:1.5;fill:none}
.cat h3{font-size:.9375rem;font-weight:600;letter-spacing:-.02em}
.cat span{margin-top:.3125rem;font-size:.8125rem;color:var(--muted)}
@media(min-width:64rem){ .cat{padding:2.125rem 1.125rem 1.75rem} .cat-ic{width:4.125rem;height:4.125rem;margin-bottom:1.0625rem} .cat-ic svg{width:1.6875rem;height:1.6875rem} .cat h3{font-size:1rem} }

/* ===== BESTSELLER ===== */
.prod-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.625rem}
@media(min-width:64rem){ .prod-grid{grid-template-columns:repeat(4,1fr);gap:1.125rem} }
.card{display:flex;flex-direction:column;padding:.875rem;border-radius:var(--r-lg);transition:background .25s,box-shadow .25s,transform .25s}
.card:hover{background:var(--gray);box-shadow:var(--shadow-hover);transform:translateY(-.25rem)}
.card-vis{position:relative;background:var(--gray);border-radius:var(--r-md);aspect-ratio:1/1;display:grid;place-items:center;padding:1.25rem;overflow:hidden}
.card-vis img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;transition:transform .45s cubic-bezier(.2,.8,.3,1)}
.card:hover .card-vis img{transform:scale(1.045)}
.card-body{display:flex;flex-direction:column;flex:1;padding:.875rem .25rem .25rem}
.card h3{font-size:.9375rem;font-weight:600;letter-spacing:-.02em;line-height:1.3}
.card-price{display:flex;align-items:baseline;gap:.5rem;margin-top:.5rem}
.card-price .now{font-size:1.0625rem;font-weight:600;letter-spacing:-.02em}
.card-price .was{font-size:.8125rem;color:var(--muted);text-decoration:line-through}
.card-btn{
  display:flex;align-items:center;justify-content:center;gap:.375rem;margin-top:.875rem;
  width:100%;min-height:2.5rem;background:var(--gray);color:var(--ink);border-radius:61.25rem;
  font-size:.875rem;font-weight:500;transition:background .2s ease,color .2s ease;
}
.card-btn svg{width:.9375rem;height:.9375rem;stroke:currentColor;fill:none}
.card-btn:hover,.card-btn.done{background:var(--blue);color:#fff}
.prod-more{display:flex;justify-content:center;margin-top:2.25rem}

/* ===== SOCIAL ===== */
.social{background:var(--gray);padding:3.5rem 0}
@media(min-width:64rem){ .social{padding:4.5rem 0} }
.social-head{text-align:center;max-width:34rem;margin:0 auto 2.25rem}
.social-head h2{font-size:clamp(1.625rem,5.5vw,2.25rem);letter-spacing:-.03em}
.social-head p{margin-top:.875rem;color:var(--muted);font-size:1.0625rem;line-height:1.5}
.soc-cards{display:grid;grid-template-columns:1fr;gap:1rem;max-width:56rem;margin:0 auto}
@media(min-width:40rem){ .soc-cards{grid-template-columns:repeat(3,1fr);gap:1.25rem} }
.soc-card{
  display:flex;flex-direction:column;align-items:center;text-align:center;gap:.875rem;
  padding:2.25rem 1.5rem;border-radius:var(--r-lg);background:var(--white);border:1px solid var(--line);
  transition:transform .28s cubic-bezier(.2,.8,.3,1),box-shadow .28s ease,border-color .28s ease;
}
.soc-card:hover{transform:translateY(-.5rem);box-shadow:var(--shadow-hover);border-color:transparent}
.soc-ic{width:3.75rem;height:3.75rem;border-radius:50%;display:grid;place-items:center;flex:none;transition:transform .28s cubic-bezier(.2,.8,.3,1)}
.soc-card:hover .soc-ic{transform:scale(1.08)}
.soc-ic svg{width:1.75rem;height:1.75rem;fill:#fff}
.soc-ic.ig{background:radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%)}
.soc-ic.tt{background:var(--ink)}
.soc-ic.fb{background:#1877F2}
.soc-card h3{font-size:1.0625rem;font-weight:600;letter-spacing:-.02em}
.soc-card .soc-handle{font-size:.8125rem;color:var(--muted)}
.soc-card .soc-cta{margin-top:.375rem;display:inline-flex;align-items:center;gap:.375rem;font-size:.875rem;font-weight:500;color:var(--blue)}
.soc-card .soc-cta svg{width:.9375rem;height:.9375rem;stroke:currentColor;stroke-width:2;fill:none;transition:transform .25s ease}
.soc-card:hover .soc-cta svg{transform:translateX(.1875rem)}

/* ===== ACTION ===== */
.action{padding:4.5rem 0}
@media(min-width:64rem){ .action{padding:6.5rem 0} }
.action-box{background:var(--gray);border-radius:var(--r-xl);padding:3.5rem 1.5rem;text-align:center}
@media(min-width:40rem){ .action-box{padding:4.5rem 2.5rem} }
@media(min-width:64rem){ .action-box{padding:5.5rem 3.5rem} }
.action-box h2{font-size:clamp(2rem,7.5vw,3.625rem);letter-spacing:-.035em;line-height:1.05}
.action-box p{margin:1.125rem auto 0;max-width:35rem;color:var(--muted);font-size:1.0625rem;line-height:1.48}
@media(min-width:40rem){ .action-box p{font-size:1.1875rem} }
.action-cta{display:flex;flex-wrap:wrap;gap:.75rem;justify-content:center;margin-top:2rem}
.action-pts{display:flex;flex-wrap:wrap;justify-content:center;gap:.875rem 2.25rem;margin-top:2.75rem;padding-top:2rem;border-top:1px solid var(--line)}
.action-pts div{display:flex;align-items:center;gap:.5625rem;font-size:.9375rem;color:var(--ink-2)}
.action-pts svg{width:1.0625rem;height:1.0625rem;stroke:var(--blue);stroke-width:2;fill:none;flex:none}

/* ===== FOOTER ===== */
.ft{background:var(--gray);font-size:.75rem;color:var(--muted);padding:2.75rem 0 2.125rem;line-height:1.6}
.ft-cols{display:grid;grid-template-columns:repeat(2,1fr);gap:1.75rem;padding-bottom:2.125rem}
@media(min-width:48rem){ .ft-cols{grid-template-columns:repeat(4,1fr);gap:2.125rem} }
.ft h4{font-size:.75rem;font-weight:600;color:var(--ink);margin-bottom:.75rem}
.ft ul{list-style:none;margin:0;padding:0;display:grid;gap:.5625rem}
.ft ul a:hover{text-decoration:underline;color:var(--ink-2)}
.ft-legal{border-top:1px solid var(--line);padding-top:1.375rem}
.ft-legal p{max-width:50rem}
.ft-bot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.875rem;margin-top:1.125rem;padding-top:1.125rem;border-top:1px solid var(--line)}
.ft-bot nav{display:flex;flex-wrap:wrap;gap:1.25rem}
.ft-bot a:hover{text-decoration:underline}
.ft-soc{display:flex;gap:1rem;margin-top:.875rem}
.ft-soc a{opacity:.55;transition:opacity .2s}
.ft-soc a:hover{opacity:1}
.ft-soc svg{width:1.0625rem;height:1.0625rem;fill:var(--ink-2)}

.js .rv{opacity:0;transform:translateY(1.375rem);transition:opacity .8s cubic-bezier(.2,.8,.3,1),transform .8s cubic-bezier(.2,.8,.3,1)}
.js .rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){ .rv{opacity:1;transform:none;transition:none} .slider-track{transition:none} html{scroll-behavior:auto} }

/* ===== ÜBER CARMIC ===== */
.about-grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 3rem;
  align-items: start;
  max-width: 64rem;
  margin: 0 auto;
}
.about-txt p {
  color: var(--ink-2);
  font-size: 1.0625rem;
  line-height: 1.65;
  margin-bottom: 1rem;
}
.about-txt p:last-child { margin-bottom: 0; }
.about-vis {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  align-items: center;
  position: sticky;
  top: 6rem;
}
.about-icon {
  width: 9rem;
  height: 9rem;
  border-radius: 50%;
  background: var(--gray);
  display: grid;
  place-items: center;
}
.about-icon svg {
  width: 4rem;
  height: 4rem;
  stroke: var(--blue);
  stroke-width: 1.4;
  fill: none;
}
.about-facts {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.75rem;
  width: 100%;
  text-align: center;
}
.about-facts div {
  background: var(--gray);
  border-radius: var(--r-md);
  padding: 1rem 1.25rem;
}
.about-facts strong {
  display: block;
  font-size: 1.5rem;
  color: var(--blue);
  font-weight: 700;
  letter-spacing: -.02em;
}
.about-facts span {
  display: block;
  font-size: 0.8125rem;
  color: var(--muted);
  margin-top: 0.25rem;
}
@media (max-width: 48rem) {
  .about-grid { grid-template-columns: 1fr; gap: 2rem; }
  .about-vis { position: static; }
  .about-icon { width: 6rem; height: 6rem; }
  .about-icon svg { width: 2.75rem; height: 2.75rem; }
}

/* ===== KUNDENSTIMMEN ===== */
.review-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(18rem, 22rem));
  gap: 1.25rem;
  justify-content: center;
  max-width: 60rem;
  margin: 0 auto;
}
.review-card {
  background: var(--gray);
  border-radius: var(--r-lg);
  padding: 2rem 1.75rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.review-stars {
  color: #34C759;
  font-size: 1.375rem;
  letter-spacing: 0.15rem;
  line-height: 1;
}
.review-stars .star-empty {
  color: var(--line);
}
.review-text {
  color: var(--ink);
  font-size: 1.0625rem;
  line-height: 1.55;
  font-style: italic;
}
.review-author {
  color: var(--ink-2);
  font-size: 0.9375rem;
  font-weight: 600;
  margin-top: auto;
}
.review-product {
  color: var(--muted);
  font-size: 0.8125rem;
  margin-top: 0.25rem;
}
.reviews-note {
  text-align: center;
  margin-top: 2rem;
  font-size: 0.8125rem;
  color: var(--muted);
}
@media (max-width: 48rem) {
  .review-grid { grid-template-columns: 1fr; gap: 1rem; }
  .review-card { padding: 1.75rem 1.5rem; }
}

/* ============================================================
   MOBIL & TABLET — gezielte Nachbesserungen
   ============================================================ */
@media(max-width:48rem){
  .hero-txt h1{font-size:clamp(1.8rem,7vw,2.2rem);letter-spacing:-.02em;line-height:1.18}
  .hero-txt .sub{font-size:1rem}
  .slider-vp{border-radius:var(--r-lg)}
  .slide{border-radius:var(--r-lg)}
  .slide-vis{border-radius:var(--r-lg) var(--r-lg) 0 0}
  .slide-vis .frame{aspect-ratio:16/10;width:100%}
  .slide-txt{padding:1.125rem 1rem 1.375rem;text-align:center}
  .slide-tag{font-size:.75rem;margin-bottom:.4375rem}
  .slide h2{font-size:1.0625rem;line-height:1.2}
  .slide-desc{font-size:.8125rem;line-height:1.4;margin-top:.4375rem}
  .deal{margin-top:.75rem;gap:.625rem}
  .deal-off{font-size:1.25rem}
  .deal-save b{font-size:.71875rem}
  .deal-save span{font-size:.65rem}
  .price-line{margin-top:.625rem;gap:.5rem}
  .price-now{font-size:1.1875rem}
  .price-was{font-size:.8125rem}
  .vat{font-size:.625rem}
  .slide-cta{margin-top:.875rem;gap:.375rem}
  .slide-cta .cta-row{gap:.4375rem}
  .slide-cta .btn{min-height:2.375rem;font-size:.875rem;padding:.5625rem 1.125rem}
  .slider-bar{margin-top:.875rem;gap:.625rem}
  .sldnav{gap:.375rem}
  .sldnav-i{padding:.4375rem .625rem;min-height:2.375rem}
  .sldnav-i .sn-name{font-size:.75rem}
  .sldnav-i .sn-price{font-size:.75rem}
  .arw{width:2.125rem;height:2.125rem}
  .sec{padding:3rem 0}
  .hero{padding:2rem 0 2.75rem}
  .overlap{padding-top:2.5rem}
  .social{padding:2.75rem 0}
  .action{padding:3rem 0}
}

@media(max-width:30rem){
  .prod-grid{grid-template-columns:1fr;gap:.75rem}
  .hero-txt h1{font-size:1.8rem}
  .slide-vis .frame{aspect-ratio:16/11}
  .slide-txt{padding:1rem .875rem 1.125rem}
  .slide h2{font-size:1rem}
  .deal-off{font-size:1.125rem}
  .sldnav{grid-template-columns:1fr}
  .wrap{padding:0 1rem}
}

@media(min-width:30.0625rem) and (max-width:48rem){
  .cat-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:30rem){
  .cat-grid{grid-template-columns:repeat(2,1fr);gap:.5rem}
}

@media(max-width:47.9375rem){
  .ft-cols{grid-template-columns:1fr;gap:2rem}
}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ===== ÜBER CARMIC ===== */
.about-grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 3rem;
  align-items: start;
  max-width: 64rem;
  margin: 0 auto;
}
.about-txt p {
  color: var(--ink-2);
  font-size: 1.0625rem;
  line-height: 1.65;
  margin-bottom: 1rem;
}
.about-txt p:last-child { margin-bottom: 0; }
.about-vis {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  align-items: center;
  position: sticky;
  top: 6rem;
}
.about-icon {
  width: 9rem;
  height: 9rem;
  border-radius: 50%;
  background: var(--gray);
  display: grid;
  place-items: center;
}
.about-icon svg {
  width: 4rem;
  height: 4rem;
  stroke: var(--blue);
  stroke-width: 1.4;
  fill: none;
}
.about-facts {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.75rem;
  width: 100%;
  text-align: center;
}
.about-facts div {
  background: var(--gray);
  border-radius: var(--r-md);
  padding: 1rem 1.25rem;
}
.about-facts strong {
  display: block;
  font-size: 1.5rem;
  color: var(--blue);
  font-weight: 700;
  letter-spacing: -.02em;
}
.about-facts span {
  display: block;
  font-size: 0.8125rem;
  color: var(--muted);
  margin-top: 0.25rem;
}
@media (max-width: 48rem) {
  .about-grid { grid-template-columns: 1fr; gap: 2rem; }
  .about-vis { position: static; }
  .about-icon { width: 6rem; height: 6rem; }
  .about-icon svg { width: 2.75rem; height: 2.75rem; }
}

/* ===== KUNDENSTIMMEN ===== */
.review-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(18rem, 22rem));
  gap: 1.25rem;
  justify-content: center;
  max-width: 60rem;
  margin: 0 auto;
}
.review-card {
  background: var(--gray);
  border-radius: var(--r-lg);
  padding: 2rem 1.75rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.review-stars {
  color: #34C759;
  font-size: 1.375rem;
  letter-spacing: 0.15rem;
  line-height: 1;
}
.review-stars .star-empty {
  color: var(--line);
}
.review-text {
  color: var(--ink);
  font-size: 1.0625rem;
  line-height: 1.55;
  font-style: italic;
}
.review-author {
  color: var(--ink-2);
  font-size: 0.9375rem;
  font-weight: 600;
  margin-top: auto;
}
.review-product {
  color: var(--muted);
  font-size: 0.8125rem;
  margin-top: 0.25rem;
}
.reviews-note {
  text-align: center;
  margin-top: 2rem;
  font-size: 0.8125rem;
  color: var(--muted);
}
@media (max-width: 48rem) {
  .review-grid { grid-template-columns: 1fr; gap: 1rem; }
  .review-card { padding: 1.75rem 1.5rem; }
}

/* ===== HERO-CTA-BUTTON (größerer „Zum Shop"-Button) ===== */
.hero-cta-btn{
  font-size:1.0625rem;font-weight:600;padding:.9375rem 2.125rem;
  box-shadow:0 .625rem 1.875rem rgba(0,122,255,.3);
  transition:background .22s ease,box-shadow .22s ease,transform .22s ease;
}
.hero-cta-btn:hover{box-shadow:0 .875rem 2.25rem rgba(0,98,204,.38);transform:translateY(-.0625rem)}
.hero-cta-btn svg{width:1.0625rem;height:1.0625rem;stroke:currentColor;stroke-width:1.9;fill:none;transition:transform .25s ease}
.hero-cta-btn:hover svg{transform:translateX(.25rem)}
@media(max-width:48rem){
  .hero-cta{width:100%}
  .hero-cta-btn{width:100%}
}
/* ============================================================
   KONTAKTFORMULAR (CF7)
   ============================================================ */

/* Container für das Formular */
.wpcf7 {
  max-width: 40rem;
  margin: 0 auto;
  padding: 2.5rem 0;
}

/* Jede Zeile (p-Block) */
.wpcf7 p {
  margin-bottom: 1.5rem;
  display: flex;
  flex-direction: column;
}

/* Labels über den Feldern */
.wpcf7 label {
  display: block;
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--ink);
  margin-bottom: 0.5rem;
}

/* Eingabefelder */
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 input[type="url"],
.wpcf7 select,
.wpcf7 textarea {
  width: 100%;
  min-height: 2.875rem;
  padding: 0.75rem 1.125rem;
  font-family: var(--font);
  font-size: 1rem;
  color: var(--ink);
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 0.625rem;
  transition: border-color .2s ease, box-shadow .2s ease;
}

/* Fokus-Effekt */
.wpcf7 input:focus,
.wpcf7 select:focus,
.wpcf7 textarea:focus {
  outline: none;
  border-color: var(--blue);
  box-shadow: 0 0 0 0.1875rem rgba(0,122,255,.14);
}

/* Textarea */
.wpcf7 textarea {
  min-height: 8rem;
  resize: vertical;
  padding: 0.875rem 1.125rem;
}

/* Dropdown-Pfeil */
.wpcf7 select {
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236E6E73' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 1rem center;
  background-size: 1.125rem;
  padding-right: 2.75rem;
}

/* Radiobuttons */
.wpcf7-radio {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
}

.wpcf7-radio .wpcf7-list-item {
  margin: 0;
}

.wpcf7-radio input[type="radio"] {
  margin-right: 0.5rem;
  width: 1.125rem;
  height: 1.125rem;
  accent-color: var(--blue);
}

.wpcf7-radio label {
  display: inline-flex;
  align-items: center;
  font-weight: 400;
  font-size: 1rem;
  cursor: pointer;
}

/* Checkboxen */
.wpcf7-acceptance {
  margin-bottom: 1rem;
}

.wpcf7-acceptance label {
  display: flex;
  align-items: flex-start;
  gap: 0.625rem;
  font-weight: 400;
  font-size: 0.9375rem;
  line-height: 1.5;
  cursor: pointer;
}

.wpcf7-acceptance input[type="checkbox"] {
  margin-top: 0.1875rem;
  width: 1.125rem;
  height: 1.125rem;
  accent-color: var(--blue);
  flex-shrink: 0;
  cursor: pointer;
}

.wpcf7-acceptance a {
  color: var(--blue);
  text-decoration: underline;
}

/* Submit-Button */
.wpcf7 input[type="submit"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 3rem;
  padding: 0.9375rem 2.125rem;
  margin-top: 0.5rem;
  font-family: var(--font);
  font-size: 1.0625rem;
  font-weight: 600;
  color: #fff;
  background: var(--blue);
  border: 0;
  border-radius: 61.25rem;
  cursor: pointer;
  transition: background .22s ease, box-shadow .22s ease, transform .22s ease;
  box-shadow: 0 0.625rem 1.875rem rgba(0,122,255,.3);
}

.wpcf7 input[type="submit"]:hover {
  background: var(--blue-press);
  box-shadow: 0 0.875rem 2.25rem rgba(0,98,204,.38);
  transform: translateY(-.0625rem);
}

/* Honeypot-Feld unsichtbar */
.hp-field {
  position: absolute;
  left: -9999px;
  opacity: 0;
  height: 0;
  overflow: hidden;
}

/* Erfolgs- / Fehlermeldungen */
.wpcf7-response-output {
  margin-top: 1.5rem !important;
  padding: 1rem 1.25rem !important;
  border-radius: 0.625rem !important;
  font-size: 0.9375rem !important;
  border: 0 !important;
}

.wpcf7-mail-sent-ok {
  background: #E9F9EF;
  color: #0B7A3E;
}

.wpcf7-validation-errors,
.wpcf7-mail-sent-ng,
.wpcf7-spam-blocked {
  background: #FDEBEE;
  color: #D6304A;
}

/* Fehlermeldungen unter Feldern */
.wpcf7-not-valid-tip {
  display: block;
  margin-top: 0.375rem;
  font-size: 0.8125rem;
  color: #D6304A;
}

/* Auf Handy: Padding reduzieren */
@media (max-width: 48rem) {
  .wpcf7 {
    padding: 1.5rem 1rem;
  }
}
/* ===== Toast-Inhalt, Zähler-Puls, Warte-Zustand ===== */
.cart-toast{ max-width:22rem; }

.cart-toast .ct-row{ display:flex; align-items:flex-start; gap:.75rem; }
.cart-toast .ct-img{ width:48px; height:48px; border-radius:.5rem; object-fit:cover;
  flex:0 0 auto; background:#F5F5F7; }
.cart-toast .ct-txt{ min-width:0; flex:1 1 auto; }
.cart-toast .ct-head{ display:flex; align-items:center; gap:.375rem;
  font-weight:600; font-size:.8125rem; }
.cart-toast .ct-head svg{ width:1rem; height:1rem; flex:0 0 auto; color:#007AFF; }
.cart-toast .ct-name{ font-size:.8125rem; color:#3A3A3C; margin-top:.125rem;
  overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.cart-toast .ct-x{ flex:0 0 auto; border:0; background:none; font-size:1.125rem;
  line-height:1; color:#86868B; cursor:pointer; padding:0 0 0 .25rem; }
.cart-toast .ct-link{ display:inline-block; margin-top:.5rem; font-size:.8125rem;
  font-weight:600; color:#007AFF; text-decoration:none; }
.cart-toast .ct-link:hover{ text-decoration:underline; }

@keyframes ctPulse{
  0%{ transform:scale(1) } 30%{ transform:scale(1.35) }
  60%{ transform:scale(.95) } 100%{ transform:scale(1) }
}
.ct-pulse{ animation:ctPulse .4s ease 2; }

.ct-busy{ opacity:.65; pointer-events:none; }

@media (prefers-reduced-motion: reduce){
  .ct-pulse{ animation:none; }
}