/* FotoShop24 – Pastell-Design (Aufbau nach babatasfoto.com, eigene Gestaltung). Hell + Dunkel. Texte dunkel auf Pastell (WCAG AA). */
*{margin:0;padding:0;box-sizing:border-box}
:root{
  --bg:#FBF9FF;--surf:#FFFFFF;--surf2:#F6F2FF;--ink:#2A2140;--ink2:#433A5C;--mut:#6B6480;--bd:#E9E3F6;--bd2:#DCD3F0;
  --lav:#C8B6FF;--lav-d:#B4A0FA;--lav-l:#EEE8FF;--mint:#B8F2E6;--peach:#FFD6C0;--blue:#BDE0FE;--pink:#FFC8DD;--butter:#FFF1B8;
  --acc:#5B3FD1;--brand:#6B4FD8;--brand2:#C8B6FF;--dark:#2A2140;
  --top:#F3EEFF;--bar:#C8B6FF;--barink:#2A2140;--ft:#F4F0FC;
  --b-ship:#CFF5EC;--b-ship-i:#0E5544;--b-new:#D4E9FF;--b-new-i:#0B3D66;--b-sale:#FFE0D1;--b-sale-i:#7A2E0E;
  --sh:0 1px 2px rgba(42,33,64,.05),0 8px 24px rgba(42,33,64,.06);--sh2:0 14px 40px rgba(42,33,64,.14);
  --r:16px;--wrap:1240px;
}
html[data-theme=dark]{color-scheme:dark;
  --bg:#15121D;--surf:#1F1A2B;--surf2:#262036;--ink:#EEEAF7;--ink2:#D3CDE5;--mut:#A9A1BE;--bd:#2F2840;--bd2:#3B3350;
  --lav:#C8B6FF;--lav-d:#D7C9FF;--lav-l:#2C2443;--mint:#B8F2E6;--peach:#FFD6C0;--blue:#BDE0FE;--pink:#FFC8DD;--butter:#FFF1B8;
  --acc:#CDBEFF;--brand:#8E78F0;--dark:#EEEAF7;
  --top:#1A1625;--bar:#3A2F5E;--barink:#EEEAF7;--ft:#1A1625;
  --b-ship:#B8F2E6;--b-ship-i:#0E3D33;--b-new:#BDE0FE;--b-new-i:#0B2E4D;--b-sale:#FFD6C0;--b-sale-i:#5C2209;
  --sh:0 1px 2px rgba(0,0,0,.3),0 8px 24px rgba(0,0,0,.25);--sh2:0 14px 40px rgba(0,0,0,.45);
}
body{background:var(--bg);color:var(--ink);font:15px/1.55 Inter,-apple-system,"Segoe UI",Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{max-width:100%}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--acc);outline-offset:2px;border-radius:6px}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 20px}
.skip{position:absolute;left:-999px;top:0;background:var(--ink);color:var(--bg);padding:8px 14px;z-index:999}.skip:focus{left:8px}
.ico{flex:none;vertical-align:middle}

/* Topbar */
.top{background:var(--top);font-size:12.8px;color:var(--ink2);border-bottom:1px solid var(--bd)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:36px}
.top a,.top button{display:inline-flex;align-items:center;gap:6px}
.top-l,.top-r{display:flex;align-items:center;gap:18px}
.top-r a{padding-left:16px;border-left:1px solid var(--bd2)}.top-r a:first-child{border:0;padding:0}
.top a:hover{color:var(--acc)}
.theme-t{border:1px solid var(--bd2);background:var(--surf);border-radius:99px;width:30px;height:24px;justify-content:center;cursor:pointer}
.theme-t .i-sun,[data-theme=dark] .theme-t .i-moon{display:none}[data-theme=dark] .theme-t .i-sun{display:inline}

/* Kopf */
.hd{background:var(--surf);border-bottom:1px solid var(--bd)}
.hd .wrap{display:flex;align-items:center;gap:28px;height:92px}
.hd-burger{display:none;border:0;background:none;width:42px;height:42px;border-radius:12px;align-items:center;justify-content:center;cursor:pointer}
.logo{display:flex;align-items:center;gap:10px;font-weight:800;font-size:27px;letter-spacing:-.035em;color:var(--ink);flex:none}
.logo b{font-weight:800;color:var(--acc)}
.srch{flex:1;display:flex;max-width:640px;margin:0 auto;height:52px;border:2px solid var(--bd2);border-radius:14px;background:var(--surf);overflow:hidden;transition:border-color .15s,box-shadow .15s}
.srch:focus-within{border-color:var(--lav-d);box-shadow:0 0 0 4px color-mix(in srgb,var(--lav) 35%,transparent)}
.srch input{flex:1;border:0;background:none;padding:0 18px;font-size:15.5px;min-width:0;outline:0}
.srch input::placeholder{color:var(--mut);font-style:italic}
.srch button{width:62px;border:0;background:var(--lav);color:var(--ink);cursor:pointer;display:flex;align-items:center;justify-content:center}
.srch button:hover{background:var(--lav-d)}
.cartbox{display:flex;align-items:stretch;border:2px solid var(--bd2);border-radius:14px;height:52px;overflow:hidden;flex:none;background:var(--surf)}
.cartbox:hover{border-color:var(--lav-d)}
.cb-txt{display:flex;flex-direction:column;justify-content:center;padding:0 16px;line-height:1.2}
.cb-txt b{font-size:13px;text-transform:uppercase;letter-spacing:.05em}.cb-txt small{font-size:12.5px;color:var(--mut)}
.cb-ic{width:54px;background:var(--mint);color:#1F3B36;display:flex;align-items:center;justify-content:center;position:relative}
.cb-ic i{position:absolute;top:7px;right:7px;background:var(--ink);color:var(--bg);font:800 10.5px/17px Inter,sans-serif;min-width:17px;height:17px;border-radius:9px;text-align:center;font-style:normal;padding:0 4px}

/* Kategorie-Leiste */
.cbar{background:var(--bar);color:var(--barink);position:sticky;top:0;z-index:50;box-shadow:0 1px 0 rgba(42,33,64,.06)}
.cbar .wrap{display:flex;align-items:center;height:50px}
.allcats{position:relative;width:282px;flex:none;height:100%}
.allcats-b{height:100%;width:100%;display:flex;align-items:center;gap:10px;padding:0 18px;border:0;background:color-mix(in srgb,var(--ink) 8%,transparent);color:inherit;font-weight:700;font-size:14px;letter-spacing:.03em;text-transform:uppercase;cursor:pointer}
.allcats-b .ico:last-child{margin-left:auto;transition:transform .15s}
.allcats.open .allcats-b .ico:last-child{transform:rotate(180deg)}
.allcats.home .allcats-b{cursor:default}.allcats.home .allcats-b .ico:last-child{display:none}
.cbar-l{display:flex;list-style:none;margin-left:auto;height:100%}
.cbar-l a{display:flex;align-items:center;height:100%;padding:0 18px;font-weight:600;font-size:14.5px;border-left:1px solid color-mix(in srgb,var(--ink) 10%,transparent)}
.cbar-l li:first-child a{border:0}
.cbar-l a:hover,.cbar-l a[aria-current]{background:color-mix(in srgb,var(--surf) 35%,transparent)}
.cbar-cart{display:none;align-items:center;gap:8px;height:100%;padding:0 18px;margin-left:8px;background:var(--ink);color:var(--bg);font-weight:700;font-size:14px}
.cbar.stuck .cbar-cart{display:flex}

/* Mega-Menue */
.mm{background:var(--surf);border:1px solid var(--bd);border-radius:0 0 var(--r) var(--r);position:relative}
.mm-drop{position:absolute;left:0;top:100%;width:282px;display:none;box-shadow:var(--sh2);color:var(--ink)}
.allcats.open .mm-drop,.allcats:not(.home):hover .mm-drop{display:block}
.mm-list{list-style:none;padding:6px 0}
.mm-a{display:flex;align-items:center;gap:10px;padding:2px 14px 2px 12px;min-height:28px;font-size:13.6px;font-weight:500;color:var(--ink);border-left:3px solid transparent}
.mm-ic{width:24px;height:24px;border-radius:7px;background:var(--t);color:#2A2140;display:flex;align-items:center;justify-content:center;flex:none}
.mm-n{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mm-chev{color:var(--mut);opacity:.7}
.mm-li:hover>.mm-a,.mm-li:focus-within>.mm-a{background:var(--lav-l);border-left-color:var(--lav-d);font-weight:600}
.mm-fly{display:none;position:absolute;left:100%;top:-1px;min-height:calc(100% + 2px);width:var(--flyw,720px);background:var(--surf);border:1px solid var(--bd);border-left:3px solid var(--lav-d);border-radius:0 var(--r) var(--r) 0;box-shadow:var(--sh2);z-index:60;padding:22px 24px;grid-template-columns:1fr 240px;gap:22px}
.mm-li:hover>.mm-fly,.mm-li:focus-within>.mm-fly{display:grid}
.mm-h{display:inline-block;font-size:17px;font-weight:800;padding-bottom:9px;margin-bottom:12px;border-bottom:2px solid var(--lav)}
.mm-subs{list-style:none;columns:2;column-gap:26px}
.mm-subs li{break-inside:avoid}
.mm-subs a{display:block;padding:7px 0;font-size:14.3px;color:var(--ink2)}
.mm-subs a:hover,.mm-all:hover{color:var(--acc)}
.mm-all{display:inline-flex;align-items:center;gap:4px;margin-top:14px;font-weight:700;font-size:13.5px;color:var(--acc)}
.mm-art{border-radius:14px;background:radial-gradient(circle at 30% 25%,color-mix(in srgb,#fff 55%,var(--t)),var(--t));color:#2A2140;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;min-height:250px}
.mm-art .ico{stroke-width:1.1;opacity:.85}
.mm-art span{font-size:12.5px;font-weight:700;background:rgba(255,255,255,.7);padding:5px 12px;border-radius:99px}

/* Hauptbereich */
.main{padding-top:22px;padding-bottom:10px;min-height:50vh}
.box{background:var(--surf);border:1px solid var(--bd);border-radius:var(--r);box-shadow:var(--sh);margin-bottom:22px}
.box-h{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 22px 0}
.box-h h2{font-size:20px;font-weight:800;letter-spacing:-.02em;position:relative;padding-left:14px}
.box-h h2::before{content:"";position:absolute;left:0;top:4px;bottom:4px;width:5px;border-radius:4px;background:var(--lav)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--lav);color:#2A2140;font-weight:700;padding:12px 22px;border-radius:12px;border:0;cursor:pointer;font-size:15px;transition:background .15s,transform .15s;text-decoration:none}
.btn:hover{background:var(--lav-d);transform:translateY(-1px)}
.btn.ghost{background:var(--surf);color:var(--ink);border:1.5px solid var(--bd2)}
.btn.mint{background:var(--mint);color:#1F3B36}.btn.dark{background:var(--ink);color:var(--bg)}
.crumb{font-size:13px;color:var(--mut);margin-bottom:12px}.crumb a:hover{color:var(--acc)}.crumb b{color:var(--ink);font-weight:600}
h1.pg-h{font-size:28px;font-weight:800;letter-spacing:-.025em;line-height:1.2;margin-bottom:8px}
.lead{color:var(--mut);max-width:780px}

/* Startseite: Kategorien links + Hero */
.homegrid{display:grid;grid-template-columns:282px 1fr;gap:0;margin-bottom:22px;position:relative}
.homegrid .mm{border-radius:0 0 0 var(--r);border-right:0;height:100%;--flyw:calc(var(--wrap) - 40px - 282px)}
.homegrid .mm-fly{min-height:calc(100% + 2px)}
.hero{position:relative;overflow:hidden;border-radius:0 var(--r) var(--r) 0;min-height:420px;background:var(--surf2);border:1px solid var(--bd);border-left:0}
.slide{position:absolute;inset:0;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;padding:40px 48px;visibility:hidden;transform:translateX(100%);transition:transform .6s cubic-bezier(.65,0,.35,1);will-change:transform}
.slide.on{visibility:visible;transform:none}
@media (prefers-reduced-motion:reduce){.slide{transition:none}}
.slide .eb{display:inline-block;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;background:rgba(255,255,255,.75);color:#2A2140;padding:6px 12px;border-radius:99px;margin-bottom:16px}
.slide .h{font-size:40px;line-height:1.08;font-weight:800;letter-spacing:-.035em;color:#2A2140;max-width:470px}
.slide p{margin:14px 0 24px;font-size:16.5px;color:#433A5C;max-width:430px}
.slide .btn{background:#2A2140;color:#fff}.slide .btn:hover{background:#433A5C}
.slide .art{height:100%;display:flex;align-items:center;justify-content:center}
.slide .art svg{width:100%;max-width:400px;height:auto}
.s1{background:linear-gradient(125deg,#E9E1FF 0%,#FFD9E8 100%)}
.s2{background:linear-gradient(125deg,#D6F7EF 0%,#D8ECFF 100%)}
.s3{background:linear-gradient(125deg,#FFE6D6 0%,#FFF6CC 100%)}
.dots{position:absolute;left:0;right:0;bottom:16px;display:flex;justify-content:center;gap:8px;z-index:3}
.dots button{width:10px;height:10px;border-radius:99px;border:0;background:rgba(42,33,64,.25);cursor:pointer;transition:width .25s,background .25s;padding:0}
.dots button[aria-current=true]{width:30px;background:#2A2140}
.hero-arr{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:38px;height:38px;border-radius:50%;border:0;background:rgba(255,255,255,.75);color:#2A2140;display:flex;align-items:center;justify-content:center;cursor:pointer;opacity:0;transition:opacity .2s}
.hero:hover .hero-arr,.hero-arr:focus-visible{opacity:1}.hero-arr.l{left:14px}.hero-arr.r{right:14px}

/* Vertrauens-Leiste */
.trust{display:grid;grid-template-columns:repeat(4,1fr);background:var(--surf);border:1px solid var(--bd);border-radius:var(--r);box-shadow:var(--sh);margin-bottom:22px}
.trust>div{display:flex;align-items:center;gap:14px;padding:18px 22px;border-left:1px solid var(--bd)}
.trust>div:first-child{border:0}
.trust .ti{width:46px;height:46px;border-radius:14px;background:var(--t);color:#2A2140;display:flex;align-items:center;justify-content:center;flex:none}
.trust b{display:block;font-size:14.5px;font-weight:800;text-transform:uppercase;letter-spacing:.02em}
.trust small{color:var(--mut);font-size:13px}

/* Kamera-Finder */
.finderbox{display:grid;grid-template-columns:1.1fr 1fr;gap:26px;padding:24px 26px;align-items:center;background:linear-gradient(120deg,var(--lav-l),var(--surf) 60%)}
.finderbox h2{font-size:22px;font-weight:800;letter-spacing:-.02em}
.finderbox p{color:var(--mut);margin:6px 0 14px}
.brandchips{display:flex;flex-wrap:wrap;gap:8px}
.brandchips a{padding:7px 13px;border-radius:99px;background:var(--surf);border:1.5px solid var(--bd2);font-weight:700;font-size:13.5px}
.brandchips a:hover{border-color:var(--lav-d);background:var(--lav-l)}
.finder{display:grid;grid-template-columns:1fr 1fr auto;gap:10px;align-items:end}
.finder label span{display:block;font-size:12px;font-weight:700;color:var(--mut);margin-bottom:5px;text-transform:uppercase;letter-spacing:.04em}
.finder select{width:100%;height:46px;border:1.5px solid var(--bd2);border-radius:12px;background:var(--surf);padding:0 12px;font-size:15px}
.finder select:disabled{opacity:.55}
.finder .btn{height:46px}
.popmodels{margin-top:12px;font-size:13.5px;color:var(--mut)}.popmodels a{color:var(--acc);font-weight:600;margin-right:10px;white-space:nowrap}

/* Produktkarten + Karussell */
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px}
.pc{position:relative;display:flex;flex-direction:column;background:var(--surf);border:1px solid var(--bd);border-radius:14px;overflow:hidden;transition:box-shadow .18s,transform .18s,border-color .18s}
.pc:hover{box-shadow:var(--sh2);transform:translateY(-3px);border-color:var(--bd2)}
.pc-bd{position:absolute;top:10px;left:10px;right:10px;display:flex;flex-wrap:wrap;gap:4px;z-index:2}
.bd{font-size:9.5px;font-weight:800;letter-spacing:.05em;padding:3px 7px;border-radius:5px;line-height:1.3}
.bd-ship{background:var(--b-ship);color:var(--b-ship-i)}.bd-new{background:var(--b-new);color:var(--b-new-i)}.bd-sale{background:var(--b-sale);color:var(--b-sale-i)}
.pc-img{aspect-ratio:1;display:flex;align-items:center;justify-content:center;background:#fff;padding:30px 14px 8px}
.pc-img img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply}
.pc-b{display:flex;flex-direction:column;padding:10px 14px 15px;flex:1;border-top:1px solid var(--bd)}
.pc-cat{font-size:11.5px;font-weight:700;color:var(--acc);text-transform:uppercase;letter-spacing:.04em;margin-bottom:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pc-t{font-size:14px;line-height:1.38;height:2.76em;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;color:var(--ink2)}
.pc-p{margin-top:auto;padding-top:9px;font-weight:800;font-size:18.5px;letter-spacing:-.02em}
.pc-p small{font-size:12px;font-weight:600;color:var(--mut)}.pc-p s{font-size:13px;color:var(--mut);font-weight:600;margin-left:4px}
.car .car-track{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 3*14px)/4);gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding:16px 22px 22px;scrollbar-width:none;scroll-padding:0 22px}
.car .car-track::-webkit-scrollbar{display:none}
.car .pc{scroll-snap-align:start}
.car-nav{display:flex;align-items:center;gap:6px}
.car-nav .more{font-weight:700;font-size:13.5px;color:var(--acc);margin-right:6px}
.car-btn{width:34px;height:34px;border-radius:10px;border:1.5px solid var(--bd2);background:var(--surf);display:flex;align-items:center;justify-content:center;cursor:pointer}
.car-btn:hover{background:var(--lav);border-color:var(--lav);color:#2A2140}

/* Kategorie-Kacheln */
.ctiles{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;padding:16px 22px 22px}
.ctile{display:flex;flex-direction:column;align-items:center;gap:10px;padding:18px 10px 14px;border-radius:14px;background:color-mix(in srgb,var(--t) 38%,var(--surf));text-align:center;font-weight:700;font-size:13.5px;line-height:1.3;transition:transform .15s,box-shadow .15s}
.ctile:hover{transform:translateY(-3px);box-shadow:var(--sh)}
.ctile .ci{width:58px;height:58px;border-radius:18px;background:var(--t);color:#2A2140;display:flex;align-items:center;justify-content:center}
.ctile small{font-weight:600;color:var(--mut);font-size:12px}

/* Ratgeber */
.rg{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;padding:16px 22px 22px}
.rg a{display:flex;flex-direction:column;border:1px solid var(--bd);border-radius:14px;overflow:hidden;background:var(--surf);transition:box-shadow .15s}
.rg a:hover{box-shadow:var(--sh2)}
.rg .ri{height:130px;display:flex;align-items:center;justify-content:center;background:linear-gradient(130deg,var(--t),color-mix(in srgb,var(--t) 40%,#fff));color:#2A2140}
.rg .ri .ico{stroke-width:1.2}
.rg .rb{padding:14px 16px 16px}
.rg .rb small{font-size:11.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--acc)}
.rg .rb b{display:block;font-size:16px;line-height:1.3;margin:4px 0 6px}
.rg .rb p{font-size:13.5px;color:var(--mut)}
.rg .rb em{display:inline-block;margin-top:10px;font-style:normal;font-weight:700;font-size:13px;color:var(--acc)}
.seo-txt{padding:22px 26px;font-size:14px;color:var(--mut);columns:2;column-gap:36px}
.seo-txt h2{column-span:all;font-size:18px;color:var(--ink);margin-bottom:10px}
.seo-txt p{margin-bottom:10px;break-inside:avoid}

/* Listen-Layout mit Seitenleiste */
.shell{display:grid;grid-template-columns:262px 1fr;gap:24px;align-items:start;padding-top:22px;padding-bottom:10px}
.content{min-width:0;min-height:50vh}
.side{position:sticky;top:64px;max-height:calc(100vh - 80px);overflow:auto;background:var(--surf);border:1px solid var(--bd);border-radius:var(--r);padding:10px 8px 14px;scrollbar-width:thin}
.side-h{display:none}
.side-cat{display:flex;align-items:center;gap:9px;padding:6px 8px;border-radius:10px;font-size:13.8px;font-weight:600;color:var(--ink2)}
.side-cat .ic{width:26px;height:26px;border-radius:8px;background:var(--t);color:#2A2140;display:flex;align-items:center;justify-content:center;flex:none}
.side-cat .nm{flex:1}.side-cat .ct{font-size:11.5px;color:var(--mut);background:var(--surf2);padding:1px 7px;border-radius:99px}
.side-cat:hover{background:var(--surf2)}.side-cat.on{background:var(--lav-l);color:var(--ink)}
.side-subs{display:flex;flex-direction:column;margin:2px 0 8px 42px;border-left:2px solid var(--bd);padding-left:8px}
.side-subs a{padding:5px 8px;font-size:13.3px;color:var(--mut);border-radius:8px}
.side-subs a:hover,.side-subs a.on{color:var(--acc);font-weight:700}.side-subs i{font-style:normal;font-size:11.5px;opacity:.75}
.side-finder{margin-top:12px;border-top:1px solid var(--bd);padding:14px 8px 0}
.side-finder b{display:block;font-size:13.5px;margin-bottom:10px}
.side-finder .finder{grid-template-columns:1fr}
.side-scrim{display:none}
.tbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:6px 0 16px}
.tbar-f{display:none;align-items:center;gap:7px;border:1.5px solid var(--bd2);background:var(--surf);border-radius:10px;padding:8px 13px;font-weight:700;font-size:13.5px;cursor:pointer}
.tbar-n{font-size:13.5px;color:var(--mut);font-weight:600}
.tbar-s{margin-left:auto;display:flex;align-items:center;gap:8px;font-size:13px;color:var(--mut)}
.tbar-s select{border:1.5px solid var(--bd2);background:var(--surf);border-radius:10px;padding:8px 10px;font-size:14px;color:var(--ink)}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 16px}
.chips a{padding:7px 14px;border-radius:99px;background:var(--surf);border:1.5px solid var(--bd2);font-size:13.5px;font-weight:600}
.chips a:hover{border-color:var(--lav-d)}.chips a.on{background:var(--lav);border-color:var(--lav);color:#2A2140}
.chips a i{font-style:normal;opacity:.65;font-weight:500}
.pager{display:flex;gap:6px;justify-content:center;flex-wrap:wrap;margin:26px 0 6px}
.pager a{min-width:40px;height:40px;padding:0 12px;border-radius:10px;border:1.5px solid var(--bd2);background:var(--surf);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px}
.pager a.on{background:var(--lav);border-color:var(--lav);color:#2A2140}
.fs-empty{text-align:center;padding:50px 20px;background:var(--surf);border:1.5px dashed var(--bd2);border-radius:var(--r);color:var(--mut)}
.fs-empty p{margin-bottom:16px}
.intro{margin:34px 0 0;max-width:900px;font-size:14px;color:var(--mut)}.intro p{margin-bottom:8px}
.faq{max-width:900px;margin-top:10px}.faq h2{font-size:20px;margin:30px 0 12px}
.faq details{background:var(--surf);border:1px solid var(--bd);border-radius:12px;padding:13px 18px;margin-bottom:9px}
.faq summary{font-weight:700;cursor:pointer}.faq p{margin-top:8px;color:var(--mut)}
.mtiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px;margin:8px 0 22px}
.mtiles a{display:flex;flex-direction:column;gap:2px;padding:14px 16px;border-radius:12px;background:var(--surf);border:1.5px solid var(--bd);font-weight:700}
.mtiles a:hover{border-color:var(--lav-d);background:var(--lav-l)}.mtiles small{font-weight:500;color:var(--mut);font-size:12.5px}
.mtiles a.empty{opacity:.6}

/* Produktseite */
.pd{display:grid;grid-template-columns:1fr 1fr;gap:34px;background:var(--surf);border:1px solid var(--bd);border-radius:var(--r);padding:26px;box-shadow:var(--sh)}
.pd-main{width:100%;aspect-ratio:1;object-fit:contain;background:#fff;border-radius:12px;border:1px solid var(--bd);display:block}
.pd-th{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.pd-th button{width:64px;height:64px;border:1.5px solid var(--bd2);border-radius:10px;background:#fff;padding:3px;cursor:pointer}
.pd-th button[aria-current=true]{border-color:var(--lav-d);box-shadow:0 0 0 2px var(--lav)}
.pd-th img{width:100%;height:100%;object-fit:contain}
.pd h1{font-size:23px;line-height:1.3;letter-spacing:-.015em}
.pd-fit{margin-top:10px;padding:10px 13px;background:var(--surf2);border-radius:10px;font-size:13.5px}
.pd-fit a{color:var(--acc);font-weight:600}
.pd-price{font-size:32px;font-weight:800;letter-spacing:-.03em;margin:16px 0 4px}
.pd-price small{font-size:15px;color:var(--mut);font-weight:600}
.pd-ship{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:16px}
.pd label.f{display:block;font-weight:700;font-size:13.5px;margin-bottom:6px}
.pd select,.pd input[type=number]{border:1.5px solid var(--bd2);border-radius:11px;background:var(--surf);padding:11px 12px;font-size:15px}
.pd select{width:100%;margin-bottom:14px}
.pd-buy{display:flex;gap:10px;align-items:center}.pd-buy input{width:78px}.pd-buy .btn{flex:1;height:48px}
.pd-usp{list-style:none;margin-top:16px;display:grid;gap:7px;font-size:13.5px;color:var(--ink2)}
.pd-usp li{display:flex;gap:8px;align-items:center}
.pd-desc{margin-top:22px;border-top:1px solid var(--bd);padding-top:16px}
.pd-desc h2{font-size:16px;margin-bottom:6px}.pd-desc p{white-space:pre-wrap;color:var(--mut);font-size:14px}

/* Info-/Rechtsseiten (Engine-Klassen) */
.legal-w{max-width:900px;margin:0 auto}
.legal-w h1{font-size:30px;margin:4px 0 6px;letter-spacing:-.02em}
.legal{background:var(--surf);border:1px solid var(--bd);border-radius:var(--r);padding:26px 30px;margin-top:16px}
.legal h2{font-size:19px;margin:26px 0 8px}.legal h2:first-child{margin-top:0}
.legal h3{font-size:16px;margin:18px 0 6px}
.legal p{margin:8px 0;color:var(--ink2)}.legal ul{margin:8px 0 8px 22px;color:var(--ink2)}.legal li{margin:5px 0}
.legal a{color:var(--acc);font-weight:600}.legal strong{color:var(--ink)}
.legal .box{background:var(--surf2);border:1px solid var(--bd);border-radius:12px;padding:14px 16px;margin:14px 0}
.legal-foot{color:var(--mut);font-size:13px;margin-top:20px}
.card{background:var(--surf);border:1px solid var(--bd);border-radius:14px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px}
.badge{position:absolute;top:10px;left:10px;background:var(--lav);color:#2A2140;font-size:11px;font-weight:800;padding:3px 8px;border-radius:6px}
input,select,textarea{background:var(--surf);color:var(--ink)}
[data-theme=dark] [style*="background:#fff"]{background:var(--surf)!important}
[data-theme=dark] [style*="color:#334155"],[data-theme=dark] [style*="color:#475569"],[data-theme=dark] [style*="color:#374151"]{color:var(--ink2)!important}
[data-theme=dark] .pc-img,[data-theme=dark] .pd-main,[data-theme=dark] .pd-th button{background:#F4F1FA}

/* Fuss */
.ft{margin-top:40px;background:var(--ft);border-top:1px solid var(--bd);color:var(--ink2);font-size:14px}
.ft-cols{display:grid;grid-template-columns:repeat(4,1fr) 1.45fr;gap:28px;padding:40px 0 30px}
.ft-c b{display:block;font-size:13.5px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--ink);margin-bottom:12px;padding-bottom:8px;border-bottom:2px solid var(--lav);width:fit-content}
.ft-c a{display:block;padding:4px 0;color:var(--ink2)}.ft-c a:hover{color:var(--acc)}
.ft-nl p{font-size:13.5px;color:var(--mut);margin-bottom:10px}
.nl{display:flex;border:1.5px solid var(--bd2);border-radius:12px;overflow:hidden;background:var(--surf)}
.nl input{flex:1;border:0;padding:0 12px;min-width:0;height:44px;outline:0;background:none}
.nl .btn{border-radius:0;padding:0 16px}
.ft-nl small{display:block;margin-top:8px;font-size:12px;color:var(--mut)}.ft-nl small a{display:inline;color:var(--acc)}
.ft-pay{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:16px 0;border-top:1px solid var(--bd)}
.ft-pay span{background:var(--surf);border:1px solid var(--bd2);border-radius:7px;padding:5px 10px;font-weight:800;font-size:12px;color:var(--ink)}
.ft-pay em{font-style:normal;margin-left:auto;font-size:13px;color:var(--mut);display:flex;align-items:center;gap:6px}
.ft-bot{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;padding:14px 0;border-top:1px solid var(--bd);font-size:13px;color:var(--mut)}
.ft-tm{font-size:11.5px;color:var(--mut);padding-bottom:22px;max-width:900px}

/* Schublade (mobil) */
.drawer{position:fixed;top:0;left:0;bottom:0;width:min(86vw,360px);background:var(--surf);z-index:200;transform:translateX(-102%);transition:transform .25s ease;overflow-y:auto;padding:0 0 30px;box-shadow:var(--sh2)}
.dr-open .drawer{transform:none}
.dr-scrim,.side-scrim{position:fixed;inset:0;background:rgba(20,16,30,.45);z-index:150;opacity:0;pointer-events:none;transition:opacity .25s}
.dr-open .dr-scrim,.side-open .side-scrim{opacity:1;pointer-events:auto}
.dr-h{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--bd);background:var(--bar)}
.dr-h .logo{font-size:22px}.dr-h button{border:0;background:none;width:40px;height:40px;cursor:pointer;color:var(--barink)}
.dr-sec{padding:12px 16px;border-bottom:1px solid var(--bd)}
.dr-sec>b{display:block;font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--mut);margin-bottom:6px}
.dr-sec details summary{display:flex;align-items:center;gap:10px;padding:8px 0;font-weight:600;cursor:pointer;list-style:none}
.dr-sec details summary::-webkit-details-marker{display:none}
.dr-chev{margin-left:auto;color:var(--mut);transition:transform .15s}.dr-sec details[open] .dr-chev{transform:rotate(180deg)}
.dr-sec details a{display:block;padding:7px 0 7px 36px;font-size:14px;color:var(--ink2)}
.dr-sec>a{display:flex;align-items:center;gap:8px;padding:8px 0;font-weight:600}
.dr-links a{display:block;padding:9px 0;font-weight:600}
.dr-open,.side-open{overflow:hidden}

@media (max-width:1100px){
  .ft-cols{grid-template-columns:repeat(3,1fr)}.ft-nl{grid-column:span 3}
  .ctiles{grid-template-columns:repeat(4,1fr)}
  .car .car-track{grid-auto-columns:calc((100% - 2*14px)/3)}
  .cbar-l a{padding:0 12px}
  .slide .h{font-size:34px}
}
@media (max-width:900px){
  .wrap{padding:0 16px}
  .top-l .top-wa span,.top-r a:not(:first-child):not([href="/kontakt"]){display:none}
  .top-r a:first-child{display:none}
  .top .wrap{gap:10px}.top-l{gap:12px;min-width:0}.top-l a{white-space:nowrap}
  .hd .wrap{flex-wrap:wrap;height:auto;gap:10px 8px;padding-top:10px;padding-bottom:12px}
  .hd-burger{display:flex;margin-left:-8px}
  .logo{font-size:23px}.logo-i{width:32px;height:27px}
  .srch{order:3;flex:1 1 100%;height:46px;margin:0}
  .cartbox{margin-left:auto;height:44px;border:0}.cb-txt{display:none}.cb-ic{border-radius:12px;width:48px}
  .cbar{display:none}
  .homegrid{grid-template-columns:1fr}.homegrid>.mm{display:none}
  .hero{border-radius:var(--r);border-left:1px solid var(--bd);min-height:330px}
  .slide{grid-template-columns:1fr;padding:26px 22px 54px;align-content:start}
  .slide .art{position:absolute;right:-24px;bottom:30px;width:52%;opacity:.95;height:auto;pointer-events:none}
  .slide .h{font-size:27px;max-width:72%}.slide p{font-size:14.5px;max-width:62%;margin:10px 0 18px}
  .trust{grid-template-columns:1fr 1fr}.trust>div{padding:14px;gap:10px}.trust>div:nth-child(3){border-left:0}.trust>div:nth-child(n+3){border-top:1px solid var(--bd)}
  .trust .ti{width:38px;height:38px;border-radius:11px}.trust b{font-size:12.5px}.trust small{font-size:12px}
  .finderbox{grid-template-columns:1fr;padding:18px 16px;gap:14px}.finder{grid-template-columns:1fr 1fr}.finder .btn{grid-column:span 2}
  .box-h{padding:14px 16px 0}.box-h h2{font-size:18px}
  .car .car-track{grid-auto-columns:46%;padding:14px 16px 18px;gap:10px;scroll-padding:0 16px}
  .car-btn{display:none}
  .ctiles{grid-template-columns:repeat(3,1fr);padding:14px 16px 16px;gap:8px}.ctile{font-size:12px;padding:12px 6px}.ctile .ci{width:46px;height:46px;border-radius:14px}
  .rg{grid-template-columns:1fr;padding:14px 16px 16px}.rg .ri{height:96px}
  .seo-txt{columns:1;padding:18px 16px}
  .shell{grid-template-columns:1fr;padding-top:14px}
  .side{position:fixed;top:0;left:0;bottom:0;width:min(86vw,340px);max-height:none;z-index:200;border-radius:0;transform:translateX(-102%);transition:transform .25s;padding-top:0}
  .side-open .side{transform:none}
  .side-h{display:flex;align-items:center;justify-content:space-between;padding:12px 8px;position:sticky;top:0;background:var(--surf)}
  .side-h button{border:0;background:none;font-size:28px;width:40px;cursor:pointer}
  .side-scrim{display:block}
  .tbar-f{display:inline-flex}
  .pgrid{grid-template-columns:repeat(2,1fr);gap:10px}
  .pc-img{padding:28px 8px 6px}.pc-b{padding:8px 10px 12px}.pc-t{font-size:13px}.pc-p{font-size:16.5px}
  .bd{font-size:8.5px;padding:2px 5px}
  .pd{grid-template-columns:1fr;padding:16px;gap:18px}.pd h1{font-size:20px}
  .ft-cols{grid-template-columns:1fr 1fr;gap:22px}.ft-nl{grid-column:span 2}
  .ft-pay em{margin-left:0;width:100%}
  h1.pg-h{font-size:23px}
  .legal{padding:18px 16px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
[data-theme=dark] .ctile{background:var(--surf2)}
[data-theme=dark] .ctile:hover{background:color-mix(in srgb,var(--t) 16%,var(--surf2))}
[data-theme=dark] .finderbox{background:linear-gradient(120deg,#2C2443,var(--surf) 65%)}
.finderbox>div,.finder label{min-width:0}.finder select{min-width:0;max-width:100%}
.hero{isolation:isolate}.slide .art{overflow:hidden}
@media (max-width:560px){.top-wa{display:none!important}.top{font-size:12.3px}.top .wrap{min-height:34px}}
@media (max-width:900px){.slide .art{right:-12px;width:48%}.slide .h{font-size:25px}}
.popmodels{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:baseline}.popmodels a{margin:0}
.pd-dtxt{max-height:420px;overflow:auto;padding-right:6px;line-height:1.6}
.pd-main{height:auto}

/* Produkt-Folien (babatasfoto-Stil, pastell) */
.s4{background:linear-gradient(125deg,#D8ECFF 0%,#EEE8FF 100%)}
.s5{background:linear-gradient(125deg,#FFE0EC 0%,#FFF1D6 100%)}
.s6{background:linear-gradient(125deg,#DDF6EE 0%,#FFF6CC 100%)}
.s7{background:linear-gradient(125deg,#EEE8FF 0%,#D6F7EF 100%)}
.s8{background:linear-gradient(125deg,#FFE6D6 0%,#FFE0EC 100%)}
.slide.ps{grid-template-columns:1fr 1fr;padding:34px 40px 46px 48px}
.slide.ps .eb{background:var(--brand);color:#fff;letter-spacing:.1em}
.slide.ps .h{font-size:42px;color:#3A2A7A}
.slide.ps p{margin:12px 0 14px;color:#433A5C}
.ps-meta{display:flex;flex-wrap:wrap;gap:6px 0;margin:0 0 22px;font-size:13.5px;font-weight:700;color:#5B3FD1;letter-spacing:.02em}
.ps-meta span{padding:0 12px;border-left:2px solid rgba(91,63,209,.3)}.ps-meta span:first-child{padding-left:0;border-left:0}
.ps-meta b{font-size:17px;font-weight:800}
.slide.ps .btn{background:var(--brand);color:#fff;border-radius:99px;padding:12px 22px;box-shadow:0 8px 20px rgba(107,79,216,.28)}
.slide.ps .btn:hover{background:#5B3FD1}
.ps-img{position:relative;display:flex;align-items:center;justify-content:center;height:100%;min-height:300px}
.ps-img::before{content:"";position:absolute;width:min(380px,92%);aspect-ratio:1;border-radius:50%;background:rgba(255,255,255,.75);box-shadow:0 20px 50px rgba(91,63,209,.16)}
.ps-img img{position:relative;width:min(340px,82%);height:auto;aspect-ratio:1;object-fit:contain;mix-blend-mode:multiply;border-radius:24px;transition:transform .5s ease}
.slide.ps.on .ps-img img{animation:psIn .7s ease .35s both}
@keyframes psIn{from{opacity:0;transform:translateX(24px) scale(.96)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.slide.ps.on .ps-img img{animation:none}}
.dots button{width:11px;height:11px;background:transparent;border:2px solid rgba(91,63,209,.55)}
.dots button[aria-current=true]{width:38px;background:var(--brand);border-color:var(--brand)}
@media (max-width:1100px){.slide.ps .h{font-size:34px}}
@media (max-width:760px){.slide.ps{grid-template-columns:1fr;padding:22px 20px 44px}.slide.ps .h{font-size:25px;max-width:62%}.slide.ps p{max-width:60%;font-size:14px}
 .ps-meta{max-width:62%;font-size:12px}.ps-meta b{font-size:15px}
 .ps-img{position:absolute;right:-10px;bottom:34px;width:46%;height:auto;min-height:0}.ps-img img{width:100%}}
@media (max-width:760px){.slide.ps p{display:none}.ps-meta span:not(:first-child){display:none}.ps-meta{margin:10px 0 16px}.slide.ps .h{max-width:58%}.slide.ps .btn{padding:10px 18px;font-size:14px}}

/* ===== Farben wie babatasfoto.com (Rot #EA222F, Grau #EEEEEE, Text #333, Fira Sans) – ueberschreibt das Pastell-Thema ===== */
:root{
  --bg:#EEEEEE;--surf:#FFFFFF;--surf2:#F7F7F7;--ink:#333333;--ink2:#484848;--mut:#666666;--bd:#E3E3E3;--bd2:#D5D5D5;
  --lav:#EA222F;--lav-d:#C81B27;--lav-l:#FDECEE;
  --acc:#EA222F;--brand:#EA222F;--brand2:#F6C9CC;--dark:#333333;
  --top:#FFFFFF;--bar:#EA222F;--barink:#FFFFFF;--ft:#FFFFFF;
  --b-ship:#4EC248;--b-ship-i:#FFFFFF;--b-new:#607D8B;--b-new-i:#FFFFFF;--b-sale:#EA222F;--b-sale-i:#FFFFFF;
  --sh:0 1px 3px rgba(0,0,0,.08);--sh2:0 10px 30px rgba(0,0,0,.14);--r:6px;
}
html[data-theme=dark]{
  --bg:#141414;--surf:#1E1E1E;--surf2:#262626;--ink:#EDEDED;--ink2:#D0D0D0;--mut:#A8A8A8;--bd:#2E2E2E;--bd2:#3A3A3A;
  --lav:#EA222F;--lav-d:#FF4A55;--lav-l:#3A1C1F;--acc:#FF5A63;--brand:#EA222F;--dark:#EDEDED;
  --top:#1A1A1A;--bar:#C81B27;--barink:#FFFFFF;--ft:#1A1A1A;
  --b-ship:#3FA83A;--b-ship-i:#FFFFFF;--b-new:#546E7A;--b-new-i:#FFFFFF;--b-sale:#EA222F;--b-sale-i:#FFFFFF;
}
body{font-family:"Fira Sans",-apple-system,"Segoe UI",Helvetica,Arial,sans-serif}
.btn{background:var(--brand);color:#fff;border-radius:4px}.btn:hover{background:#C81B27;color:#fff}
.mm-ic,.side-cat .ic,.trust .ti{background:transparent;color:var(--brand)}
.mm-li:hover>.mm-a,.mm-li:focus-within>.mm-a{background:var(--brand);color:#fff;border-left-color:#C81B27}
.mm-li:hover>.mm-a .mm-ic,.mm-li:focus-within>.mm-a .mm-ic{color:#fff}
.mm-art{background:var(--surf2);color:var(--brand)}.mm-art span{background:#fff;color:var(--ink)}
.trust .ti{border:2px solid var(--brand);border-radius:50%}
.trust b{text-transform:uppercase;letter-spacing:.02em}
.ctile{background:var(--surf);border:1px solid var(--bd)}.ctile:hover{border-color:var(--brand)}
.ctile .ci{background:var(--lav-l);color:var(--brand)}
.rg .ri{background:var(--surf2);color:var(--brand)}
.box-h{justify-content:center;position:relative}.box-h h2{text-transform:uppercase;font-size:19px;letter-spacing:.01em;padding-left:0}
.box-h h2::before{display:none}.box-h .car-nav{position:absolute;right:22px}
.car-btn{background:var(--brand);border-color:var(--brand);color:#fff;border-radius:3px;width:28px;height:28px}
.car-btn:hover{background:#C81B27;border-color:#C81B27;color:#fff}
.chips a.on,.pager a.on{background:var(--brand);border-color:var(--brand);color:#fff}
.badge{background:var(--brand);color:#fff}
.bd{border-radius:3px}
/* Slider: helle Flaechen, rote Akzente, keine Pastelltoene */
.s1,.s2,.s3,.s4,.s5,.s6,.s7,.s8{background:linear-gradient(120deg,#FFFFFF 0%,#F3F3F3 60%,#ECECEC 100%)}
html[data-theme=dark] .s1,html[data-theme=dark] .s2,html[data-theme=dark] .s3,html[data-theme=dark] .s4,html[data-theme=dark] .s5,html[data-theme=dark] .s6,html[data-theme=dark] .s7,html[data-theme=dark] .s8{background:linear-gradient(120deg,#FFFFFF 0%,#F3F3F3 60%,#ECECEC 100%)}
.slide.ps .eb,.slide .eb{background:var(--brand);color:#fff;border-radius:3px}
.slide .h,.slide.ps .h{color:#222}
.slide p,.slide.ps p{color:#555}
.ps-meta{color:var(--brand)}.ps-meta span{border-left-color:rgba(234,34,47,.35)}
.slide .btn,.slide.ps .btn{background:var(--brand);color:#fff;border-radius:4px;box-shadow:0 6px 16px rgba(234,34,47,.25)}
.slide.ps .btn:hover{background:#C81B27}
.ps-img::before{background:#fff;box-shadow:0 18px 44px rgba(0,0,0,.10)}
.dots button{background:#fff;border:2px solid #333;width:12px;height:12px}
.dots button[aria-current=true]{width:40px;background:var(--brand);border-color:var(--brand)}
.hero-arr{background:#fff;color:#333;box-shadow:0 2px 8px rgba(0,0,0,.15)}
.cb-ic{background:var(--brand);color:#fff}
.btn.mint{background:var(--brand);color:#fff}
.finderbox{background:var(--surf)}
.side-cat.on{background:var(--brand);color:#fff}.side-cat.on .ic{color:#fff}
.cbar{box-shadow:0 2px 4px rgba(0,0,0,.12)}
.cbar-l a{font-weight:500;border-left-color:rgba(255,255,255,.28)}
.cbar-l a:hover,.cbar-l a[aria-current]{background:#C81B27}
.cbar-cart{background:#C81B27;color:#fff}
:root{--bg:#FFFFFF}
/* roter Menue-Balken nur so breit wie Kopfzeile (Logo bis Warenkorb) */
.cbar{background:var(--bg);box-shadow:none}
.cbar .wrap{background:var(--bar);background-clip:content-box;border-radius:0}
.cbar.stuck .wrap{box-shadow:none}
.side-cat .sc-chev,.side-subs .sc-chev{flex:none;opacity:.45;transition:transform .15s,opacity .15s}
.side-subs a{display:flex;align-items:center;justify-content:space-between;gap:8px}
.side-cat:hover .sc-chev,.side-subs a:hover .sc-chev{opacity:.9;transform:translateX(2px)}
.side-cat.on .sc-chev{opacity:1;color:#fff}
.srch button{color:#fff}.srch button svg{stroke:#fff;stroke-width:2.4}
.srch:focus-within{border-color:var(--brand);box-shadow:0 0 0 3px rgba(234,34,47,.18)}
