/* Ürün listeleme (kategori) sayfası · .ls: yapışkan sol sütun (arama, ürün grupları, teklif kutusu) + 3 sütun ızgara + sayfalama */
.kat{--k:#1b1c1f;--r:#d61116;--gr:#5d6167;--gr2:#8b8f95;--ac:#f3f4f6;--cz:#e6e8eb;--ease:cubic-bezier(.2,.7,.2,1);padding:72px 0 120px;background:#fff;font-family:"Plus Jakarta Sans",sans-serif;color:var(--k)}
.kat button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
.kat a:not(.bx){color:inherit;text-decoration:none}
.kat svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
[data-gir]{opacity:0;transform:translateY(24px);transition:opacity .7s var(--ease),transform .7s var(--ease);transition-delay:calc(var(--i,0) % 3 * 80ms)}
[data-gir].gor{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){[data-gir]{opacity:1;transform:none;transition:none}}

.ls-gv{display:grid;grid-template-columns:280px minmax(0,1fr);gap:56px;align-items:start}
.ls-sol{align-self:stretch}
.ls-si{position:sticky;top:110px;transition:top .45s var(--ease)}
body.is-hidden .ls-si{top:32px}

/* arama */
.ls-ara{position:relative;display:flex;align-items:center;background:var(--ac)}
.ls-ara::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--r);transform:scaleX(0);transform-origin:left;transition:transform .45s var(--ease)}
.ls-ara:focus-within::after{transform:none}
.ls-ara input{width:100%;height:54px;padding:0 84px 0 18px;border:0;outline:0;background:transparent;font:500 14.5px "Plus Jakarta Sans",sans-serif;color:var(--k);-webkit-appearance:none;appearance:none}
.ls-ara input::placeholder{color:var(--gr2)}
.ls-ara input::-webkit-search-cancel-button{display:none}
.ls-ai{position:absolute;right:18px;display:grid;color:var(--gr);pointer-events:none}
.ls-ax{position:absolute;right:46px;width:26px;height:26px;font-size:20px !important;line-height:1;color:var(--gr2) !important}
.ls-ax:hover{color:var(--k) !important}

/* ===== sol sütun ortak ===== */
.kat svg.dl{fill:currentColor;stroke:none}
.ls-lb{display:flex;align-items:center;gap:10px;margin:34px 0 14px;font-size:12px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--gr2)}
.ls-gr,.ls-tl,.ls-dg,.ls-alt{list-style:none;margin:0;padding:0}
.kat .ls-g{position:relative;display:flex;align-items:center;width:100%;text-align:left}
.ls-g .nm{flex:1;min-width:0}
.ls-g>svg{width:16px;height:16px;transition:transform .35s var(--ease)}
.ac>.ls-g>svg{transform:rotate(180deg)}
.ls-p{display:grid;grid-template-rows:0fr;transition:grid-template-rows .45s var(--ease)}
.ls-p>div{overflow:hidden}
.ac>.ls-p{grid-template-rows:1fr}
.ls-alt button{display:block;width:100%;text-align:left;font-size:14px;color:var(--gr);transition:color .2s,background .2s}
.ls-alt button:hover{color:var(--k)}
.ls-alt button.on{color:var(--r);font-weight:600}
.lth{position:relative;display:block;flex:none;background:var(--ac);overflow:hidden}
.lth img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply;transition:transform .6s var(--ease)}
.lg{position:relative;display:block;flex:none;width:14px;height:12px}
.lg i{position:absolute;inset:0;transition:background .3s,transform .45s var(--ease)}
.lg .g{background:#878787;clip-path:polygon(0 17%,64.8% 17%,0 100%)}
.lg .r{background:var(--r);clip-path:polygon(100% 0,100% 83.2%,34.9% 83.2%)}
.ls-cta{position:relative;display:flex;flex-direction:column;align-items:flex-start;margin-top:36px}
.ls-cta b{font-size:20px;font-weight:800;line-height:1.25;letter-spacing:-.015em}
.ls-cta>span:not(.fo){margin:8px 0 20px;font-size:14px;line-height:1.55}
/* çip listesi (2 ve 4) */
.ls-ch .ls-alt{display:flex;flex-wrap:wrap;gap:6px}
.ls-ch .ls-alt button{width:auto;padding:8px 12px;background:var(--ac);font-size:13px;font-weight:600}
.ls-ch .ls-alt button:hover{background:var(--cz)}
.ls-ch .ls-alt button.on{background:var(--k);color:#fff}

/* ===== 1 · görselli liste: her grubun küçük ürün görseli, seçili grup koyu satır ===== */
.sb1 .ls-gr{display:flex;flex-direction:column;gap:4px}
.sb1 .ls-g{gap:14px;padding:6px 14px 6px 6px;font-size:15px;font-weight:600;color:var(--k);transition:background .25s,color .25s}
.sb1 .ls-g .lth{width:46px;height:46px;clip-path:polygon(0 0,calc(100% - 9px) 0,100% 9px,100% 100%,0 100%)}
.sb1 .ls-g .lth img{padding:5px}
.sb1 a.ls-g:hover{background:var(--ac)}
.sb1 a.ls-g:hover .lth{background:#fff}
.sb1 .ls-g:hover .lth img{transform:scale(1.1)}
.sb1 .cur>.ls-g{background:var(--k);color:#fff;clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,0 100%)}
.sb1 .cur>.ls-g::after{content:"";position:absolute;right:0;bottom:0;width:14px;height:14px;background:var(--r);clip-path:polygon(100% 0,100% 100%,0 100%)}
.sb1 .cur>.ls-g .lth{background:#fff}
.sb1 .cur>.ls-g>svg{color:rgba(255,255,255,.6)}
.sb1 .ls-alt{padding:8px 0 10px 66px}
.sb1 .ls-alt button{padding:6px 0}
.sb1 .ls-cta{padding:0 24px 24px;background:var(--ac);clip-path:polygon(0 0,calc(100% - 22px) 0,100% 22px,100% 100%,0 100%)}
.sb1 .ls-cta::before{content:"";position:absolute;left:0;top:0;width:20px;height:20px;background:var(--r);clip-path:polygon(0 0,100% 0,0 100%)}
.sb1 .fo{display:block;align-self:stretch;height:132px;margin:8px -40px 4px 28px}
.sb1 .fo img{width:100%;height:100%;object-fit:contain;object-position:right bottom;filter:drop-shadow(0 14px 14px rgba(0,0,0,.12))}
.sb1 .ls-cta>span:not(.fo){color:var(--gr)}

/* ===== 2 · kutucuklar: 2 sütun görselli grup karoları, kırmızı teklif bloğu ===== */
.sb2 .ls-tl{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.sb2 .ls-tl a{position:relative;display:flex;flex-direction:column;height:100%;padding:8px 10px 12px;background:var(--ac);clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,0 100%);transition:background .25s,color .25s}
.sb2 .ls-tl .lth{aspect-ratio:4/3;background:transparent}
.sb2 .ls-tl .lth img{padding:4px}
.sb2 .ls-tl .nm{margin-top:6px;font-size:13px;font-weight:700;line-height:1.3}
.sb2 .ls-tl a:hover{background:#e9ebee}
.sb2 .ls-tl a:hover img{transform:scale(1.08)}
.sb2 .ls-tl a.on{background:var(--k);color:#fff;clip-path:none}
.sb2 .ls-tl li:last-child:nth-child(odd){grid-column:1/-1}
.sb2 .ls-tl li:last-child:nth-child(odd) a{flex-direction:row;align-items:center;gap:12px;padding:8px 14px 8px 8px}
.sb2 .ls-tl li:last-child:nth-child(odd) .lth{width:84px;aspect-ratio:4/3}
.sb2 .ls-tl li:last-child:nth-child(odd) .nm{margin:0}
.sb2 .ls-tl a.on .lth{background:#fff}
.sb2 .ls-tl a.on::after{content:"";position:absolute;right:0;top:0;width:12px;height:12px;background:var(--r);clip-path:polygon(0 0,100% 0,100% 100%)}
:is(.sb2,.sbk) .ls-cta{padding:28px 24px 24px;background:var(--r);color:#fff;overflow:hidden;clip-path:polygon(0 0,calc(100% - 22px) 0,100% 22px,100% 100%,0 100%)}
:is(.sb2,.sbk) .ls-cta>.lg{position:absolute;right:-34px;top:-18px;width:170px;height:134px}
:is(.sb2,.sbk) .ls-cta>.lg .g{background:rgba(255,255,255,.16)}
:is(.sb2,.sbk) .ls-cta>.lg .r{background:rgba(27,28,31,.22)}
:is(.sb2,.sbk) .ls-cta>*{position:relative}
:is(.sb2,.sbk) .ls-cta>.lg{position:absolute}
:is(.sb2,.sbk) .ls-cta>span{color:rgba(255,255,255,.86)}
:is(.sb2,.sbk) .ls-cta .bx1{background:var(--k);color:#fff}
:is(.sb2,.sbk) .ls-cta .bx1 .mk{background:#2a2c30}
:is(.sb2,.sbk) .ls-cta .bx1 .mk .r{background:var(--r)}

/* ===== 3 · beyaz kart: gruplar tek kartta (köşede kırmızı üçgen), altta görselli koyu teklif ===== */
.sb3 .ls-kt{position:relative;background:#fff;box-shadow:0 0 0 1px var(--cz),0 30px 50px -34px rgba(20,21,23,.35)}
.sb3 .ls-kt::after{content:"";position:absolute;right:0;top:0;width:22px;height:22px;background:var(--r);clip-path:polygon(0 0,100% 0,100% 100%)}
.sb3 .ls-kh{padding:24px 22px 16px}
.sb3 .ls-kh b{display:block;margin-bottom:16px;font-size:19px;font-weight:800;letter-spacing:-.015em}
.sb3 .ls-gr{padding:0 10px 14px}
.sb3 .ls-g{gap:14px;padding:11px 12px;font-size:15px;font-weight:500;color:var(--gr);transition:background .25s,color .25s}
.sb3 .ls-g .lg .g,.sb3 .ls-g .lg .r{background:#d3d6da}
.sb3 .ls-g .nm{transition:transform .35s var(--ease)}
.sb3 a.ls-g:hover{color:var(--k)}
.sb3 a.ls-g:hover .nm{transform:translateX(3px)}
.sb3 a.ls-g:hover .lg .r{background:var(--r)}
.sb3 .cur>.ls-g{background:rgba(214,17,22,.06);color:var(--r);font-weight:700}
.sb3 .cur>.ls-g .lg .g{background:#878787}
.sb3 .cur>.ls-g .lg .r{background:var(--r)}
.sb3 .ls-alt{padding:6px 0 8px 40px}
.sb3 .ls-alt button{padding:6px 0}
.sb3 .ls-cta{margin-top:64px;padding:0 24px 24px;background:var(--k);color:#fff}
.sb3 .fo{display:block;align-self:stretch;height:118px;margin:-52px -6px 10px 40px}
.sb3 .fo img{width:100%;height:100%;object-fit:contain;object-position:right bottom;filter:drop-shadow(0 18px 18px rgba(0,0,0,.45))}
.sb3 .ls-cta small{font-size:11.5px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:#ff6b70}
.sb3 .ls-cta b{margin:6px 0 14px}
.sb3 .tl{display:flex;align-items:center;gap:10px;margin-bottom:20px;font-size:16px;font-weight:700;color:#fff}
.sb3 .tl svg{width:16px;height:16px;color:var(--r)}

/* ===== 4 · seçili grup vitrini: üstte grubun görseli ve tanımı, altında alt kategori çipleri ===== */
.sb4 .ls-vt{position:relative;display:flex;flex-direction:column;padding:0 22px 22px;background:var(--ac)}
.sb4 .ls-vt::after{content:"";position:absolute;right:0;top:0;width:22px;height:22px;background:var(--r);clip-path:polygon(0 0,100% 0,100% 100%)}
.sb4 .ls-vt .lth{height:178px;margin:0 -22px 4px;background:transparent}
.sb4 .ls-vt .lth img{padding:16px 10px 0}
.sb4 .ls-vt small{font-size:11.5px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--gr2)}
.sb4 .ls-vt b{margin:6px 0 6px;font-size:23px;font-weight:800;letter-spacing:-.02em;line-height:1.2}
.sb4 .ls-vt>span:last-child{font-size:13.5px;line-height:1.5;color:var(--gr)}
.sb4 .ls-ch{margin:14px 0 22px}
.sb4 .ls-dg{display:flex;flex-direction:column;gap:2px}
.sb4 .ls-dg a{display:flex;align-items:center;gap:12px;padding:5px 8px 5px 5px;font-size:14.5px;font-weight:600;transition:background .25s}
.sb4 .ls-dg .lth{width:38px;height:38px}
.sb4 .ls-dg .lth img{padding:4px}
.sb4 .ls-dg .nm{flex:1}
.sb4 .ls-dg svg{width:16px;height:16px;color:#b5b9be;transition:transform .35s var(--ease),color .25s}
.sb4 .ls-dg a:hover{background:var(--ac)}
.sb4 .ls-dg a:hover .lth{background:#fff}
.sb4 .ls-dg a:hover svg{color:var(--r);transform:translateX(3px)}
.sb4 .ls-cta{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:14px 14px;padding:20px;background:var(--k);color:#fff}
.sb4 .ls-cta .ic{margin:0;display:grid;place-items:center;width:46px;height:46px;background:var(--r);clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,0 100%)}
.sb4 .ls-cta .ic svg{width:20px;height:20px;color:#fff}
.sb4 .ls-cta .tx{display:flex;flex-direction:column;gap:3px;margin:0}
.sb4 .ls-cta .tx small{font-size:12.5px;color:rgba(255,255,255,.62)}
.sb4 .ls-cta .tx a{font-size:17px;font-weight:800;letter-spacing:-.01em;color:#fff}
.sb4 .ls-cta .zl{grid-column:1/-1;justify-self:start;color:#fff}
.sb4 .ls-cta .zl::before{background:rgba(255,255,255,.2)}
.sb4 .ls-cta .zl .mk .g{background:#fff}

/* ızgara üstü */
.ls-ust{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;min-height:54px;padding-bottom:18px;margin-bottom:36px;border-bottom:1px solid var(--cz)}
.ls-ust h2{margin:0;font-size:28px;font-weight:800;letter-spacing:-.02em;line-height:1.2;color:var(--k)}
.ls-ust h2 span{margin-left:12px;font-size:15px;font-weight:500;letter-spacing:0;color:var(--gr2)}

/* ===== ürün kartı konseptleri (html[data-kr]) ===== */
.ls-iz{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px 24px}
.ls-ka{position:relative;display:flex;flex-direction:column;height:100%}
.ls-im{position:relative;display:block;aspect-ratio:1;background:var(--ac);overflow:hidden}
.ls-im img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:11%;mix-blend-mode:multiply;transition:transform .7s var(--ease)}
.ls-ka:hover .ls-im img{transform:scale(1.05)}
.ls-kb{position:relative;display:flex;flex-direction:column;flex:1}
.ls-kb .ad{font-size:16.5px;font-weight:700;line-height:1.35;letter-spacing:-.01em}
.ls-kb .ak{font-size:11.5px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--gr2)}
.ls-ka2{display:flex;align-items:baseline;justify-content:space-between;margin-top:auto}
.ls-ka2 small{font-size:13px;font-weight:500;color:var(--gr2)}
.ls-ka:hover .zl::after{transform:none}
.ls-ka:hover .zl .mk .g{transform:translate(-3px,-3px)}
.ls-ka:hover .zl .mk .r{transform:translate(3px,3px)}
.oz,.ov{display:flex;flex-wrap:wrap;gap:6px}
.oz i,.ov i{font-style:normal;font-size:12px;font-weight:600;padding:5px 9px;background:var(--ac);color:var(--gr)}
/* ok kutusu: logo işareti, hover'da oka döner */
.okk{position:relative;display:block;flex:none;width:44px;height:44px;background:var(--ac);overflow:hidden;transition:background .35s}
.okk .lg{position:absolute;inset:0;margin:auto;width:20px;height:17px;transition:transform .45s var(--ease),opacity .3s}
.okk svg{position:absolute;left:50%;top:50%;width:18px;height:18px;margin:-9px 0 0 -9px;color:#fff;stroke-width:2.2;transform:scale(0) rotate(-45deg);transition:transform .45s var(--ease) .05s}
.ls-ka:hover .okk{background:var(--r)}
.ls-ka:hover .okk .lg{transform:scale(1.6);opacity:0}
.ls-ka:hover .okk svg{transform:none}
/* varsayılan gizli parçalar */
.ks,.ov,.kb,.ls-kb .okk,.ls-kb .oz,.ls-kb .ak,.ls-ka2{display:none}

/* 1 · üst koyu şerit (ürün grubu kartları gibi): model sayısı + seri, hover'da şerit soldan kırmızı; altta ad + ok kutusu */
html[data-kr="1"] .ls-ka{background:#fff;box-shadow:0 0 0 1px var(--cz);transition:box-shadow .35s}
html[data-kr="1"] .ls-ka:hover{box-shadow:0 0 0 1px var(--cz),0 30px 50px -30px rgba(20,21,23,.35)}
html[data-kr="1"] .ks{position:relative;display:flex;align-items:center;justify-content:space-between;gap:10px;height:42px;padding:0 16px;background:var(--k);color:#fff;overflow:hidden}
html[data-kr="1"] .ks::before{content:"";position:absolute;inset:0;background:var(--r);transform:scaleX(0);transform-origin:left;transition:transform .55s var(--ease)}
html[data-kr="1"] .ks>*{position:relative}
html[data-kr="1"] .ks b{font-size:13px;font-weight:700}
html[data-kr="1"] .ks span{font-size:12px;font-weight:500;color:rgba(255,255,255,.6)}
html[data-kr="1"] .ls-ka:hover .ks::before{transform:none}
html[data-kr="1"] .ls-ka:hover .ks span{color:rgba(255,255,255,.85)}
html[data-kr="1"] .ls-im{margin:0}
html[data-kr="1"] .ls-kb{flex-direction:row;align-items:center;gap:14px;padding:16px 16px 16px 18px}
html[data-kr="1"] .ls-kb .ad{flex:1}
html[data-kr="1"] .ls-kb .okk{display:block}

/* 2 · ölçü föyü: beyaz kart, alt kategori etiketi, ad, özellik etiketleri; altta tam genişlik İncele çubuğu (hover'da kırmızı dolar) */
html[data-kr="2"] .ls-ka{background:#fff;box-shadow:0 0 0 1px var(--cz)}
html[data-kr="2"] .ls-im{margin:10px 10px 0}
html[data-kr="2"] .ls-im::after{content:"";position:absolute;right:0;top:0;width:18px;height:18px;background:#fff;clip-path:polygon(0 0,100% 0,100% 100%)}
html[data-kr="2"] .ls-kb{padding:16px 18px 18px}
html[data-kr="2"] .ls-kb .ak{display:block;margin-bottom:6px}
html[data-kr="2"] .ls-kb .oz{display:flex;margin-top:14px}
html[data-kr="2"] .kb{position:relative;display:flex;align-items:center;justify-content:space-between;height:48px;padding-left:18px;border-top:1px solid var(--cz);font-size:14px;font-weight:700;overflow:hidden;transition:color .4s}
html[data-kr="2"] .kb::before{content:"";position:absolute;inset:0;background:var(--k);transform:scaleX(0);transform-origin:left;transition:transform .55s var(--ease)}
html[data-kr="2"] .kb>*,html[data-kr="2"] .kb{z-index:0}
html[data-kr="2"] .kb .okk{height:48px;width:48px;z-index:1}
html[data-kr="2"] .ls-ka:hover .kb{color:#fff}
html[data-kr="2"] .ls-ka:hover .kb::before{transform:none}
html[data-kr="2"] .kb{isolation:isolate}
html[data-kr="2"] .kb::before{z-index:-1}

/* 3 · çerçevesiz, görsel üstte özellikler belirir; altta ad + metin butonu; köşede gri/kırmızı logo üçgenleri */
html[data-kr="3"] .ls-im{clip-path:polygon(0 0,calc(100% - 22px) 0,100% 22px,100% 100%,0 100%)}
html[data-kr="3"] .ls-im::before{content:"";position:absolute;left:0;bottom:0;width:22px;height:22px;background:var(--r);clip-path:polygon(0 0,0 100%,100% 100%);z-index:1;transform:translate(-100%,100%);transition:transform .45s var(--ease)}
html[data-kr="3"] .ls-ka:hover .ls-im::before{transform:none}
html[data-kr="3"] .ov{position:absolute;left:14px;right:14px;bottom:14px;z-index:1;display:flex;justify-content:flex-end}
html[data-kr="3"] .ov i{background:#fff;color:var(--k);opacity:0;transform:translateY(8px);transition:opacity .35s,transform .45s var(--ease)}
html[data-kr="3"] .ov i:nth-child(2){transition-delay:.05s}html[data-kr="3"] .ov i:nth-child(3){transition-delay:.1s}
html[data-kr="3"] .ls-ka:hover .ov i{opacity:1;transform:none}
html[data-kr="3"] .ls-kb{padding-top:16px}
html[data-kr="3"] .ls-kb .ak{display:block;margin-bottom:6px;color:var(--r)}
html[data-kr="3"] .ls-kb .ad{margin-bottom:14px}
html[data-kr="3"] .ls-ka2{display:flex}

/* 4 · koyu alt panel: görselin altında grafit panel (ad + model, ok kutusu); hover'da özellikler panelin üstünden görselin üzerine çıkar */
html[data-kr="4"] .ls-ka{background:var(--ac)}
html[data-kr="4"] .ls-ka::after{content:"";position:absolute;right:0;top:0;width:20px;height:20px;background:#878787;clip-path:polygon(0 0,100% 0,100% 100%);transition:background .3s}
html[data-kr="4"] .ls-ka:hover::after{background:var(--r)}
html[data-kr="4"] .ls-kb{display:grid;grid-template-columns:1fr auto;column-gap:14px;align-items:center;padding:16px 16px 16px 18px;background:var(--k);color:#fff}
html[data-kr="4"] .ls-kb .ad{grid-column:1;font-size:16px}
html[data-kr="4"] .ls-kb .okk{display:block;grid-column:2;grid-row:1/3;background:rgba(255,255,255,.08)}
html[data-kr="4"] .ls-kb .ls-ka2{display:block;grid-column:1;margin:4px 0 0}
html[data-kr="4"] .ls-kb .ls-ka2 .zl{display:none}
html[data-kr="4"] .ls-kb .ls-ka2 small{color:rgba(255,255,255,.55)}
html[data-kr="4"] .ls-kb .oz{display:flex;position:absolute;left:14px;right:14px;bottom:calc(100% + 12px);opacity:0;transform:translateY(8px);transition:opacity .35s,transform .45s var(--ease)}
html[data-kr="4"] .ls-kb .oz i{background:var(--k);color:#fff}
html[data-kr="4"] .ls-ka:hover .ls-kb .oz{opacity:1;transform:none}

/* sayfalama */
.ls-sf{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:64px;padding-top:28px;border-top:1px solid var(--cz)}
.ls-sf>span{font-size:14px;color:var(--gr2)}
.ls-sf>span b{color:var(--k);font-weight:700}
.ls-sf nav{display:flex;gap:6px}
.ls-sf nav button{display:grid;place-items:center;min-width:44px;height:44px;padding:0 6px;font-size:15px;font-weight:600;color:var(--gr);transition:background .2s,color .2s}
.ls-sf nav button:not(.on):not(:disabled):hover{background:var(--ac);color:var(--k)}
.ls-sf nav button.on{background:var(--r);color:#fff;clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,0 100%)}
.ls-sf nav .ok{box-shadow:inset 0 0 0 1px var(--cz)}
.ls-sf nav .ok:disabled{opacity:.35;cursor:default}

.sb2 .ls-tl li:last-child:nth-child(odd) .nm{flex:1}

/* ===== 3A–3D · beyaz kart alternatifleri (.sbk), altta 2'nin kırmızı teklif kutusu ===== */
.sbk .ls-kt{position:relative;z-index:0;background:#fff;box-shadow:0 0 0 1px var(--cz),0 30px 60px -36px rgba(20,21,23,.38)}
.sbk .ls-kh b{display:block;font-size:19px;font-weight:800;letter-spacing:-.015em;line-height:1.2}
.sbk .ls-g{gap:12px;font-size:15px;font-weight:500;color:#3a3d42;transition:background .25s,color .25s}
.sbk .ls-g .nm{transition:transform .35s var(--ease)}
.sbk .ls-alt button{position:relative;padding:6px 0}
.sbk .ls-cta{margin-top:28px}

/* 3A · koyu başlık, satır çizgileri, seçili grup kırmızı satır, hover'da küçük ürün görseli */
.sb5 .ls-kh{position:relative;padding:22px 20px 20px;background:var(--k);color:#fff}
.sb5 .ls-kh::after{content:"";position:absolute;right:0;top:0;width:20px;height:20px;background:var(--r);clip-path:polygon(0 0,100% 0,100% 100%)}
.sb5 .kt{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:16px}
.sb5 .kt small{font-size:12.5px;font-weight:600;color:rgba(255,255,255,.5)}
.sb5 .ls-ara{background:rgba(255,255,255,.08)}
.sb5 .ls-ara input{color:#fff;height:50px}
.sb5 .ls-ara input::placeholder{color:rgba(255,255,255,.45)}
.sb5 .ls-ai{color:rgba(255,255,255,.7)}
.sb5 .ls-gr{padding:8px}
.sb5 .ls-gr>li+li{border-top:1px solid #f0f1f3}
.sb5 .ls-g{padding:11px 12px;min-height:50px}
.sb5 .ls-g .lg .g,.sb5 .ls-g .lg .r{background:#cdd0d4}
.sb5 .ls-g::before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:3px;background:var(--r);transform:scaleY(0);transition:transform .35s var(--ease)}
.sb5 .ls-g .lg i{transition:background .3s,transform .4s var(--ease)}
.sb5 a.ls-g>svg{width:16px;height:16px;color:var(--r);opacity:0;transform:translateX(-8px);transition:opacity .3s,transform .4s var(--ease)}
.sb5 a.ls-g:hover{background:#f6f7f8;color:var(--k)}
.sb5 a.ls-g:hover::before{transform:none}
.sb5 a.ls-g:hover .nm{transform:translateX(4px)}
.sb5 a.ls-g:hover .lg .g{background:#878787;transform:translate(-1px,-1px)}
.sb5 a.ls-g:hover .lg .r{background:var(--r);transform:translate(1px,1px)}
.sb5 a.ls-g:hover>svg{opacity:1;transform:none}
/* seçili: kırmızı satır, sağ altta logodaki gri üçgen */
.sb5 .cur>.ls-g{background:var(--r);color:#fff;font-weight:700}
.sb5 .cur>.ls-g::after{content:"";position:absolute;right:0;bottom:0;width:16px;height:16px;background:#878787;clip-path:polygon(100% 0,100% 100%,0 100%)}
.sb5 .cur>.ls-g>svg{margin-right:6px}
.sb5 .cur>.ls-g .lg .g{background:rgba(255,255,255,.55)}.sb5 .cur>.ls-g .lg .r{background:#fff}
.sb5 .cur{border-top-color:transparent !important}.sb5 .cur+li{border-top-color:transparent}
/* alt kategoriler: gri panelde ayraçlı satırlar, logo üçgeni madde işareti */
.sb5 .ls-alt{margin:6px 0 4px;padding:4px 14px;background:#f6f7f8}
.sb5 .ls-alt li+li{border-top:1px solid #e6e8eb}
.sb5 .ls-alt button{display:flex;align-items:center;gap:12px;padding:11px 4px;font-size:14px;font-weight:500;color:#55595f;transition:color .25s,padding .35s var(--ease)}
.sb5 .ls-alt button::before{content:"";flex:none;width:7px;height:7px;background:#c3c6ca;clip-path:polygon(0 0,100% 0,0 100%);transition:background .25s,transform .35s var(--ease)}
.sb5 .ls-alt button:hover{color:var(--k);padding-left:8px}
.sb5 .ls-alt button:hover::before{background:var(--r)}
.sb5 .ls-alt button.on{color:var(--r);font-weight:700}
.sb5 .ls-alt button.on::before{background:var(--r);transform:scale(1.25)}

/* 3B · üstte kırmızı çizgi, açıklamalı başlık, görselli satırlar */
.sb6 .ls-kt::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--r)}
.sb6 .ls-kh{padding:26px 22px 18px}
.sb6 .ls-kh p{margin:6px 0 16px;font-size:13.5px;line-height:1.5;color:var(--gr2)}
.sb6 .ls-gr{display:flex;flex-direction:column;gap:2px;padding:0 10px 12px}
.sb6 .ls-g{padding:6px 12px 6px 6px;font-weight:600;color:var(--k)}
.sb6 .ls-g .lth{width:44px;height:44px;clip-path:polygon(0 0,calc(100% - 9px) 0,100% 9px,100% 100%,0 100%)}
.sb6 .ls-g .lth img{padding:4px}
.sb6 .ls-g>svg{color:#b8bcc1;transition:transform .35s var(--ease),color .25s}
.sb6 a.ls-g:hover{background:#f6f7f8}
.sb6 a.ls-g:hover .lth{background:#fff}
.sb6 a.ls-g:hover img{transform:scale(1.1)}
.sb6 a.ls-g:hover>svg{color:var(--r);transform:translateX(3px)}
.sb6 .cur>.ls-g{background:var(--ac);font-weight:800}
.sb6 .cur>.ls-g::before{content:"";position:absolute;left:-10px;top:8px;bottom:8px;width:4px;background:var(--r)}
.sb6 .cur>.ls-g .lth{background:#fff}
.sb6 .cur>.ls-g>svg{color:var(--k)}
.sb6 .ls-alt{padding:6px 0 8px 62px}
.sb6 .ls-alt button.on{color:var(--r)}

/* 3C · iki tonlu: gri başlık bölümü, satır sonunda logo işaretli ok kutusu, altta tüm gruplar bağlantısı */
.sb7 .ls-kh{padding:22px 20px 20px;background:var(--ac)}
.sb7 .kt{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.sb7 .kt .lg{width:20px;height:17px}
.sb7 .ls-ara{background:#fff}
.sb7 .ls-gr{padding:6px 0}
.sb7 .ls-gr>li+li>.ls-g{box-shadow:inset 0 1px 0 #f0f1f3}
.sb7 .ls-g{padding:9px 14px 9px 20px;min-height:52px}
.sb7 .ls-g>svg{color:var(--gr2);margin-right:4px}
.sb7 .zk{display:grid;place-items:center;flex:none;width:32px;height:32px;background:var(--ac);transition:background .3s}
.sb7 .zk .lg .g{background:#b8bcc1}.sb7 .zk .lg .r{background:#b8bcc1}
.sb7 a.ls-g:hover{color:var(--k)}
.sb7 a.ls-g:hover .nm{transform:translateX(3px)}
.sb7 a.ls-g:hover .zk{background:var(--k)}
.sb7 a.ls-g:hover .zk .lg .g{background:#878787}.sb7 a.ls-g:hover .zk .lg .r{background:var(--r)}
.sb7 .cur>.ls-g{color:var(--r);font-weight:700}
.sb7 .cur>.ls-g .zk{background:var(--r)}
.sb7 .cur>.ls-g .zk .lg .g{background:rgba(255,255,255,.6)}.sb7 .cur>.ls-g .zk .lg .r{background:#fff}
.sb7 .ls-alt{padding:0 14px 10px 34px}
.sb7 .ls-alt button.on::before{content:"";position:absolute;left:-14px;top:50%;width:6px;height:2px;background:var(--r)}
.sb7 .ls-kf{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-top:1px solid var(--cz);font-size:14px;font-weight:700;transition:background .25s}
.sb7 .ls-kf svg{width:17px;height:17px;color:var(--r);transition:transform .35s var(--ease)}
.sb7 .ls-kf:hover{background:#f6f7f8}
.sb7 .ls-kf:hover svg{transform:translateX(4px)}

/* 3D · arkada kırmızı katman (Neden Zümer kartı gibi), satırlarda ikon kutusu, alt kategoriler rayda */
.sb8 .ls-si{padding:0 10px 10px 0}
.sb8 .ls-kt::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--r);transform:translate(10px,10px)}
.sb8 .ls-kt::after{content:"";position:absolute;inset:0;z-index:-1;background:#fff}
.sb8 .ls-kh{padding:24px 20px 16px}
.sb8 .ls-kh b{margin-bottom:16px}
.sb8 .ls-gr{padding:4px 12px 14px}
.sb8 .ls-g{padding:7px 8px}
.sb8 .ib{display:grid;place-items:center;flex:none;width:34px;height:34px;background:var(--ac);transition:background .3s}
.sb8 .ib .lg .g,.sb8 .ib .lg .r{background:#b8bcc1}
.sb8 a.ls-g:hover{color:var(--k)}
.sb8 a.ls-g:hover .nm{transform:translateX(3px)}
.sb8 a.ls-g:hover .ib{background:var(--k)}
.sb8 a.ls-g:hover .ib .lg .g{background:#878787}.sb8 a.ls-g:hover .ib .lg .r{background:var(--r)}
.sb8 .cur>.ls-g{font-weight:800;color:var(--k)}
.sb8 .cur>.ls-g .ib{background:var(--r)}
.sb8 .cur>.ls-g .ib .lg .g{background:rgba(255,255,255,.6)}.sb8 .cur>.ls-g .ib .lg .r{background:#fff}
.sb8 .cur>.ls-g>svg{color:var(--gr2)}
.sb8 .ls-alt{margin:2px 0 6px 25px;padding:2px 0 2px 21px;border-left:1px solid var(--cz)}
.sb8 .ls-alt button.on::before{content:"";position:absolute;left:-22px;top:4px;bottom:4px;width:3px;background:var(--r)}
.sb8 .ls-cta{margin-top:44px}

/* ===== 3A+ · 3A üstüne detaylar (.sb5.sb9) ===== */
/* kart: güçlü gölge, alt kırmızı taban çizgisi, sağ alt gri üçgen */
.sb9 .ls-kt{box-shadow:0 0 0 1px var(--cz),0 40px 70px -40px rgba(20,21,23,.5)}
.sb9 .ls-kt::before{content:"";position:absolute;left:0;right:18px;bottom:0;height:3px;background:var(--r)}
.sb9 .ls-kt::after{content:"";position:absolute;right:0;bottom:0;width:18px;height:18px;background:#878787;clip-path:polygon(100% 0,100% 100%,0 100%)}
.sb9 .ls-gr{padding-bottom:16px}
/* koyu başlık: silik dev logo işareti, üst etiket, kırmızı kısa çizgi */
.sb9 .ls-kh{overflow:hidden}
.sb9 .ls-kh>*{position:relative}
.sb9 .ls-kh .wm{position:absolute;right:-36px;top:-26px;width:170px;height:146px}
.sb9 .wm .lg{width:100%;height:100%}
.sb9 .wm .lg .g{background:rgba(255,255,255,.035)}
.sb9 .wm .lg .r{background:rgba(214,17,22,.16)}
.sb9 .kt{align-items:flex-end;margin-bottom:18px}
.sb9 .kt>span>small{display:flex;align-items:center;gap:8px;margin-bottom:8px;font-size:11.5px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.55)}
.sb9 .kt>span>small::before{content:"";width:9px;height:9px;background:var(--r);clip-path:polygon(100% 0,100% 100%,0 100%)}
.sb9 .kt b{font-size:20px}
.sb9 .kl{display:block;width:30px;height:3px;margin-top:12px;background:var(--r)}
/* arama: kırmızı kesik köşeli ikon kutusu */
.sb9 .ls-ara{background:#2a2c30}
.sb9 .ls-ara input{padding-right:84px}
.sb9 .ls-ai{right:5px;width:40px;height:40px;place-items:center;background:var(--r);color:#fff;clip-path:polygon(0 0,calc(100% - 9px) 0,100% 9px,100% 100%,0 100%)}
.sb9 .ls-ai svg{width:17px;height:17px}
.sb9 .ls-ax{right:54px}
/* satırlar: ikon kutusu, silikleşen ayraç */
.sb9 .ls-gr>li+li{border-top:0;background:linear-gradient(90deg,#e3e5e8,rgba(227,229,232,0)) top left/100% 1px no-repeat}
.sb9 .ls-gr>.cur,.sb9 .ls-gr>.cur+li{background-image:none}
.sb9 .ib{display:grid;place-items:center;flex:none;width:30px;height:30px;background:var(--ac);transition:background .3s}
.sb9 .ib .lg{width:13px;height:11px}
.sb9 a.ls-g:hover .ib{background:var(--k)}
.sb9 .cur>.ls-g .ib{background:rgba(255,255,255,.16)}
/* aktif: hafif çapraz doku, büyük ad, alt panele inen dil */
.sb9 .cur>.ls-g{background:var(--r) repeating-linear-gradient(135deg,rgba(255,255,255,.03) 0 2px,transparent 2px 9px);font-size:16px}
.sb9 .cur.ac>.ls-g::before{left:21px;top:100%;bottom:auto;width:16px;height:8px;background:var(--r);clip-path:polygon(0 0,100% 0,50% 100%);transform:none;z-index:2}
/* alt kategoriler: aktif satırdan inen kırmızı ray */
.sb9 .ls-alt{position:relative;margin-top:0;padding:10px 14px 6px 46px}
.sb9 .ls-alt::before{content:"";position:absolute;left:28px;top:0;bottom:16px;width:1px;background:rgba(214,17,22,.35)}
.sb9 .ls-alt button.on::after{content:"";position:absolute;left:-19px;top:9px;bottom:9px;width:3px;background:var(--r)}
/* teklif kutusu: belirgin işaret, taşan ürün, telefon */
.sb9 .ls-cta>.lg{right:-40px;top:-30px;width:210px;height:180px}
.sb9 .ls-cta>.lg .g{background:rgba(255,255,255,.2)}
.sb9 .ls-cta>.lg .r{background:rgba(27,28,31,.3)}
.sb9 .ls-cta{margin-top:34px;padding:26px 24px 24px}

/* ===== teklif kutusu stilleri (html[data-ct]) — sade: etiket, başlık, tek cümle, telefon, buton ===== */
.sb9 .ls-cta .ey{display:flex;align-items:center;gap:8px;margin-bottom:10px;font-size:11.5px;font-weight:500;letter-spacing:.08em;text-transform:uppercase}
.sb9 .ls-cta .ey::before{content:"";width:9px;height:9px;background:currentColor;clip-path:polygon(100% 0,100% 100%,0 100%)}
.sb9 .ls-cta>span{margin:8px 0 16px !important;font-size:14px;line-height:1.55}
.sb9 .ls-cta .tl{display:flex;align-items:center;gap:9px;margin-bottom:20px;font-size:16px;font-weight:800;letter-spacing:-.01em}
.sb9 .ls-cta .tl svg{width:15px;height:15px}
/* 1 kırmızı blok, silik dev işaret */
html[data-ct="1"] .sb9 .ls-cta .ey{color:rgba(255,255,255,.75)}
html[data-ct="1"] .sb9 .ls-cta .tl{color:#fff}
html[data-ct="1"] .sb9 .ls-cta>.lg .g{background:rgba(255,255,255,.12)}
html[data-ct="1"] .sb9 .ls-cta>.lg .r{background:rgba(27,28,31,.2)}
/* 2 koyu blok, kırmızı üst şerit, kırmızı buton */
html[data-ct="2"] .sb9 .ls-cta{background:var(--k);clip-path:none;box-shadow:inset 0 4px 0 var(--r)}
html[data-ct="2"] .sb9 .ls-cta>.lg{right:-30px;top:auto;bottom:-40px;width:180px;height:154px}
html[data-ct="2"] .sb9 .ls-cta>.lg .g{background:rgba(255,255,255,.04)}
html[data-ct="2"] .sb9 .ls-cta>.lg .r{background:rgba(214,17,22,.22)}
html[data-ct="2"] .sb9 .ls-cta .ey{color:#ff5a5f}
html[data-ct="2"] .sb9 .ls-cta>span{color:rgba(255,255,255,.65)}
html[data-ct="2"] .sb9 .ls-cta .tl{color:#fff}
html[data-ct="2"] .sb9 .ls-cta .tl svg{color:var(--r)}
html[data-ct="2"] .sb9 .ls-cta .bx1{background:var(--r)}
html[data-ct="2"] .sb9 .ls-cta .bx1 .mk{background:#b30e12}
html[data-ct="2"] .sb9 .ls-cta .bx1 .mk .r{background:#fff}
/* 3 beyaz kart, kalın kırmızı sol kenar, köşede gri üçgen */
html[data-ct="3"] .sb9 .ls-cta{background:#fff;color:var(--k);clip-path:none;box-shadow:0 0 0 1px var(--cz),inset 5px 0 0 var(--r),0 30px 60px -40px rgba(20,21,23,.4)}
html[data-ct="3"] .sb9 .ls-cta::after{content:"";position:absolute;right:0;bottom:0;width:18px;height:18px;background:#878787;clip-path:polygon(100% 0,100% 100%,0 100%)}
html[data-ct="3"] .sb9 .ls-cta>.lg{display:none}
html[data-ct="3"] .sb9 .ls-cta .ey{color:var(--r)}
html[data-ct="3"] .sb9 .ls-cta>span{color:var(--gr)}
html[data-ct="3"] .sb9 .ls-cta .tl svg{color:var(--r)}
html[data-ct="3"] .sb9 .ls-cta .bx1{background:var(--r)}
html[data-ct="3"] .sb9 .ls-cta .bx1 .mk{background:var(--k)}
html[data-ct="3"] .sb9 .ls-cta .bx1 .mk .r{background:var(--r)}
/* 4 iki tonlu: kırmızı üst (başlık), koyu alt bölüm (telefon + tam genişlik buton) */
html[data-ct="4"] .sb9 .ls-cta{padding-bottom:0}
html[data-ct="4"] .sb9 .ls-cta .ey{color:rgba(255,255,255,.75)}
html[data-ct="4"] .sb9 .ls-cta>.lg .g{background:rgba(255,255,255,.12)}
html[data-ct="4"] .sb9 .ls-cta>.lg .r{background:rgba(27,28,31,.2)}
html[data-ct="4"] .sb9 .ls-cta>span{margin-bottom:22px !important}
html[data-ct="4"] .sb9 .ls-cta .tl{align-self:stretch;margin:0 -24px;padding:18px 24px 14px;background:var(--k);color:#fff}
html[data-ct="4"] .sb9 .ls-cta .tl svg{color:var(--r)}
html[data-ct="4"] .sb9 .ls-cta .bx1{align-self:stretch;margin:0 -24px;padding:0 24px 22px;height:auto;border-radius:0;background:var(--k);gap:0;box-shadow:none}
html[data-ct="4"] .sb9 .ls-cta .bx1 .t{flex:1;display:flex;align-items:center;height:48px;padding-left:20px;background:var(--r)}
html[data-ct="4"] .sb9 .ls-cta .bx1 .mk{width:48px;height:48px;border-radius:0}

/* ===== süzgeç etiketleri (html[data-et]) — markup: small + b + i.x ===== */
.ls-etk{display:flex;flex-wrap:wrap;gap:10px}
.ls-etk button{position:relative;display:inline-flex;align-items:center;text-align:left;transition:background .25s,box-shadow .25s,color .25s}
.ls-etk b{max-width:180px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:13.5px;font-weight:700}
.ls-etk small{font-size:12px;font-weight:500;color:var(--gr2)}
.ls-etk .x{position:relative;display:block;flex:none;width:18px;height:18px}
.ls-etk .x::before,.ls-etk .x::after{content:"";position:absolute;left:50%;top:50%;width:11px;height:1.8px;margin:-.9px 0 0 -5.5px;background:currentColor;transform:rotate(45deg);transition:transform .35s var(--ease)}
.ls-etk .x::after{transform:rotate(-45deg)}
.ls-etk button:hover .x::before{transform:rotate(135deg)}
.ls-etk button:hover .x::after{transform:rotate(45deg)}
/* 1 açık gri, kesik köşe, solda kırmızı mini üçgen */
html[data-et="1"] .ls-etk button{gap:8px;height:38px;padding:0 10px 0 12px;background:var(--ac);clip-path:polygon(0 0,calc(100% - 9px) 0,100% 9px,100% 100%,0 100%)}
html[data-et="1"] .ls-etk button::before{content:"";width:7px;height:7px;margin-right:2px;background:var(--r);clip-path:polygon(0 0,100% 0,0 100%)}
html[data-et="1"] .ls-etk small::after{content:":"}
html[data-et="1"] .ls-etk .x{color:var(--gr2)}
html[data-et="1"] .ls-etk button:hover{background:var(--cz)}
html[data-et="1"] .ls-etk button:hover .x{color:var(--r)}
/* 2 çerçeveli, × ayrı bölmede */
html[data-et="2"] .ls-etk button{gap:0;height:38px;box-shadow:inset 0 0 0 1px #d6d9dd}
html[data-et="2"] .ls-etk small{padding-left:14px}
html[data-et="2"] .ls-etk small::after{content:"·";margin:0 7px}
html[data-et="2"] .ls-etk b{padding-right:14px}
html[data-et="2"] .ls-etk .x{width:38px;height:38px;color:var(--gr);box-shadow:inset 1px 0 0 #d6d9dd;transition:background .25s,color .25s}
html[data-et="2"] .ls-etk button:hover{box-shadow:inset 0 0 0 1px var(--r)}
html[data-et="2"] .ls-etk button:hover .x{color:#fff;background:var(--r)}
/* 3 metin + altı çizgi (sitedeki metin butonu gibi) */
html[data-et="3"] .ls-etk{gap:24px}
html[data-et="3"] .ls-etk button{gap:8px;padding:6px 0 9px}
html[data-et="3"] .ls-etk button::before,html[data-et="3"] .ls-etk button::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;clip-path:polygon(0 0,100% 0,calc(100% - 3px) 100%,0 100%)}
html[data-et="3"] .ls-etk button::before{background:#dfe2e6}
html[data-et="3"] .ls-etk button::after{background:var(--r);transform:scaleX(.25);transform-origin:left;transition:transform .5s var(--ease)}
html[data-et="3"] .ls-etk button:hover::after{transform:none}
html[data-et="3"] .ls-etk small::after{content:":"}
html[data-et="3"] .ls-etk .x{color:var(--r)}
/* 4 açık kırmızı zemin, sol kırmızı çizgi */
html[data-et="4"] .ls-etk button{gap:8px;height:38px;padding:0 10px 0 14px;background:rgba(214,17,22,.07);color:var(--r);box-shadow:inset 3px 0 0 var(--r)}
html[data-et="4"] .ls-etk small{color:rgba(214,17,22,.7)}
html[data-et="4"] .ls-etk small::after{content:":"}
html[data-et="4"] .ls-etk button:hover{background:var(--r);color:#fff}
html[data-et="4"] .ls-etk button:hover small{color:rgba(255,255,255,.75)}

/* sonuç yok: kutusuz, ortalı; büyük logo işareti, tek cümle, tek metin butonu */
.ls-bos{display:flex;flex-direction:column;align-items:center;gap:18px;padding:72px 24px 80px;text-align:center}
.ls-bos .lg{width:64px;height:54px;margin-bottom:6px}
.ls-bos .lg .g{background:#d3d6da}
.ls-bos b{font-size:24px;font-weight:800;letter-spacing:-.02em;line-height:1.3;word-break:break-word}

/* kart fotoğraf geçişi (birden fazla fotoğrafı olan ürünler): üst üste görseller, hover'da oklar, altta çizgi göstergeler */
.ls-im img{opacity:0;transition:opacity .45s,transform .7s var(--ease)}
.ls-im img.on{opacity:1}
.ls-im.cok img{transform:translateX(14px)}
.ls-im.cok img.on{transform:none}
.ls-im.cok img.ol{transform:translateX(-14px)}
.ls-ka:hover .ls-im.cok img.on{transform:scale(1.04)}
.sw{position:absolute;top:50%;z-index:2;display:grid;place-items:center;width:34px;height:34px;margin-top:-17px;background:#fff;color:var(--k);box-shadow:0 6px 16px -8px rgba(20,21,23,.35);cursor:pointer;opacity:0;transition:opacity .3s,transform .4s var(--ease),background .25s,color .25s}
.sw svg{width:16px;height:16px}
.sw-p{left:10px;transform:translateX(-6px)}
.sw-n{right:10px;transform:translateX(6px);clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,0 100%)}
.ls-ka:hover .sw,.sw:focus-visible{opacity:1;transform:none}
.sw:hover{background:var(--r);color:#fff}
.dt{position:absolute;left:0;right:0;bottom:12px;z-index:2;display:flex;justify-content:center;gap:5px}
.dt i{display:block;width:14px;height:3px;background:rgba(27,28,31,.18);cursor:pointer;transition:width .4s var(--ease),background .3s}
.dt i.on{width:26px;background:var(--r)}
/* 1: alt kategori adın üstünde küçük etiket */
html[data-kr="1"] .ls-kb{display:grid;grid-template-columns:1fr auto;column-gap:14px;align-items:center}
html[data-kr="1"] .ls-kb .ak{display:block;grid-column:1;margin-bottom:4px;font-size:11px}
html[data-kr="1"] .ls-kb .ad{grid-column:1}
html[data-kr="1"] .ls-kb .okk{grid-column:2;grid-row:1/3}
html[data-kr="1"] .ls-kb .ak{align-self:end}
html[data-kr="1"] .ls-kb .ad{align-self:start}
/* oklar sade: zeminsiz küçük ok, görselin alt köşelerinde göstergelerle aynı hizada (ürünü kapatmaz) */
.sw{top:auto;bottom:4px;margin:0;width:28px;height:24px;background:none;box-shadow:none;clip-path:none;color:#8b8f95}
.sw svg{width:15px;height:15px;stroke-width:2.4}
.sw-p{left:6px}.sw-n{right:6px}
.sw:hover{background:none;color:var(--r)}

/* teklif 4: koyu alt bölümde buton dikeyde ortalı (telefon satırı yok) */
html[data-ct="4"] .sb9 .ls-cta .bx1{padding:22px 24px}

/* ===== mobil ve tablet ===== */
.ls-mb,.ls-mcta,.ls-kp,.ls-ort{display:none}
@media (max-width:1199px) and (min-width:992px){
	.ls-gv{grid-template-columns:260px minmax(0,1fr);gap:36px}
	.ls-iz{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:991px){
	.kat{padding:28px 0 80px}
	.ls-gv{display:block}
	/* üst yapışkan çubuk: grup seçici + arama, altında yana kayan alt kategoriler */
	.ls-mb{display:block;position:sticky;top:0;z-index:15;margin:0 -16px 28px;padding:12px 16px 0;background:#fff;box-shadow:0 1px 0 var(--cz)}
	.ls-mbi{display:flex;gap:8px}
	.ls-mb .mg{flex:1;display:flex;align-items:center;gap:12px;min-width:0;height:54px;padding:0 16px;background:var(--k);color:#fff;text-align:left;clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,0 100%)}
	.ls-mb .mg .lg{width:16px;height:13px}
	.ls-mb .mg .lg .g{background:rgba(255,255,255,.55)}
	.ls-mb .mg span{flex:1;display:flex;flex-direction:column;min-width:0}
	.ls-mb .mg small{font-size:10.5px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.55)}
	.ls-mb .mg b{font-size:16px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
	.ls-mb .mg>svg{color:rgba(255,255,255,.7)}
	.ls-mb .ma{display:grid;place-items:center;flex:none;width:54px;height:54px;background:var(--r);color:#fff;clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,0 100%)}
	.ls-mch{margin:0 -16px;padding:10px 16px 12px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
	.ls-mch::-webkit-scrollbar{display:none}
	.ls-mch .ls-alt{display:flex;gap:6px;width:max-content}
	.ls-mch .ls-alt button{display:inline-flex;align-items:center;gap:8px;width:auto;height:36px;padding:0 12px;background:var(--ac);font-size:13px;font-weight:600;color:var(--gr);white-space:nowrap;clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,0 100%)}
	.ls-mch .ls-alt button.on{background:var(--k);color:#fff}
	.ls-mch .ls-alt button.on::before{content:"";width:7px;height:7px;background:var(--r);clip-path:polygon(0 0,100% 0,0 100%)}
	/* sütun: alttan açılan panel */
	.ls-sol{position:fixed;left:0;right:0;bottom:0;z-index:1001;max-height:86vh;max-height:86svh;overflow:auto;overscroll-behavior:contain;background:#fff;transform:translateY(105%);transition:transform .5s var(--ease);box-shadow:0 -20px 60px -20px rgba(0,0,0,.4)}
	.ls.sh .ls-sol{transform:none}
	.ls-si,.ls-si.uzun{position:relative;top:0}
	.ls-sol .ls-cta{display:none}
	.ls-sol .ls-kt{box-shadow:none}
	.ls-sol .ls-kt::before,.ls-sol .ls-kt::after{display:none}
	.ls-kp{display:grid;place-items:center;position:absolute;right:12px;top:12px;z-index:3;width:40px;height:40px;background:rgba(255,255,255,.1)}
	.ls-kp i::before,.ls-kp i::after{content:"";position:absolute;left:50%;top:50%;width:16px;height:2px;margin:-1px 0 0 -8px;background:#fff;transform:rotate(45deg)}
	.ls-kp i::after{transform:rotate(-45deg)}
	.sb9 .kt{padding-right:48px}
	.sb9 .kt>small{display:none}
	.ls-ort{display:block;position:fixed;inset:0;z-index:1000;background:rgba(20,21,23,.55);opacity:0;visibility:hidden;transition:opacity .4s,visibility .4s}
	.ls.sh .ls-ort{opacity:1;visibility:visible}
	html.ls-kilit{overflow:hidden}
	/* teklif kutusu ürünlerin altında */
	.ls-mcta{display:block;margin-top:56px}
	.ls-mcta .ls-cta{margin:0}
	.ls-iz{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 16px}
	.ls-ust{margin-bottom:24px;min-height:0}
	.ls-ust h2{font-size:24px}
	.ls-ust .ls-etk{display:none}
	.ls-sf{margin-top:44px}
}
@media (max-width:575px){
	.ls-iz{gap:14px 12px}
	html[data-kr="1"] .ks{height:36px;padding:0 10px}
	html[data-kr="1"] .ks span{display:none}
	html[data-kr="1"] .ks b{font-size:12px}
	html[data-kr="1"] .ls-kb{padding:12px 10px 12px 12px;column-gap:8px}
	html[data-kr="1"] .ls-kb .ad{font-size:14px;line-height:1.3}
	html[data-kr="1"] .ls-kb .ak{font-size:10px}
	html[data-kr="1"] .ls-kb .okk{width:34px;height:34px}
	html[data-kr="1"] .ls-kb .okk .lg{width:15px;height:13px}
	.sw{display:none}
	.dt{bottom:8px}.dt i{width:10px}.dt i.on{width:18px}
	.ls-sf{flex-direction:column-reverse;align-items:center;gap:14px}
	.ls-sf nav{gap:2px}
	.ls-sf nav button{min-width:38px;height:40px}
	.ls-bos{padding:48px 16px 56px}
	.ls-bos b{font-size:20px}
}
@media (max-width:991px){
	/* menü yukarı kaydırınca geri gelir; çubuk onun altına iner */
	.ls-mb{transition:top .45s var(--ease)}
	body.is-sticky:not(.is-hidden) .ls-mb{top:68px}
}
.sb9 .ls-ara input{padding-right:56px}
.sb9 .ls-ara:has(.ls-ax:not([hidden])) input{padding-right:86px}
@media (max-width:991px){
	.ls-mb{margin:0 0 28px;padding:12px 0 0}
	.ls-mch{margin:0;padding:10px 0 12px}
}
@media (max-width:991px){
	/* alt kategori şeridi: sağda (ve kaydırınca solda) beyaz geçiş, aktif etiket kırmızı + beyaz işaret */
	.ls-mcw{position:relative}
	.ls-mcw::before,.ls-mcw::after{content:"";position:absolute;top:0;bottom:0;z-index:1;width:56px;pointer-events:none;transition:opacity .3s}
	.ls-mcw::after{right:0;background:linear-gradient(90deg,rgba(255,255,255,0),#fff 80%)}
	.ls-mcw::before{left:0;width:32px;background:linear-gradient(270deg,rgba(255,255,255,0),#fff);opacity:0}
	.ls-mcw.son::after{opacity:0}
	.ls-mcw.bas::before{opacity:1}
	.ls-mch .ls-alt{padding-right:40px}
	.ls-mch .ls-alt button.on{background:var(--r);color:#fff}
	.ls-mch .ls-alt button.on::before{width:8px;height:8px;background:#fff}
}

/* ızgara üstü: üst etiket + büyük başlık solda, ürün sayısı sağda, altında markalar sayfasındaki ayraç */
.ls-ust{display:grid;grid-template-columns:1fr auto;align-items:end;gap:14px 24px;min-height:0;padding:0;margin-bottom:40px;border:0}
.ls-ust .ey{display:flex;align-items:center;gap:10px;margin-bottom:12px;font-size:13px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--k)}
.ls-ust .mk2{position:relative;display:block;width:14px;height:14px;flex:none}
.ls-ust .mk2 i{position:absolute;inset:0;margin:auto;width:100%;height:78.7%}
.ls-ust .mk2 .g{background:#878787;clip-path:polygon(0 0,64% 0,0 100%)}
.ls-ust .mk2 .r{background:var(--r);clip-path:polygon(100% 0,100% 100%,36% 100%)}
.ls-ust h2{font-size:clamp(30px,2.6vw,40px);font-weight:800;letter-spacing:-.025em;line-height:1.1}
.ls-ust .us{display:flex;align-items:baseline;gap:8px;padding-bottom:4px}
.ls-ust .us b{font-size:clamp(30px,2.6vw,40px);font-weight:800;letter-spacing:-.03em;line-height:1;color:var(--r)}
.ls-ust .us span{font-size:15px;font-weight:600;color:var(--gr)}
.ls-ust .ls-etk{grid-column:1/-1}
.ls-ust .ay{grid-column:1/-1;margin-top:6px;display:flex;align-items:center;gap:12px}
.ls-ust .ay span{height:1px;background:#d3d7dc;flex:1;transform-origin:left;transform:scaleX(var(--ay,0));transition:transform 1.2s cubic-bezier(.7,0,.2,1)}
.ls-ust .ay span:first-child{flex:0 0 80px;height:3px;background:var(--r)}
.ls-ust .ay .mk2{width:16px;height:16px}
.ls-ust .ay.on{--ay:1}
@media (max-width:991px){
	.ls-ust{margin-bottom:28px}
	.ls-ust h2,.ls-ust .us b{font-size:28px}
	.ls-ust .ey{font-size:12px;margin-bottom:8px}
}
.sb9 .kt b{font-size:24px;letter-spacing:-.02em}
/* ürün görsel alanı beyaz (fotoğraflar beyaz fonlu, Pehlivan'daki gibi); karışım modu gerekmez */
html[data-kr="1"] .ls-im{background:#fff;box-shadow:inset 0 -1px 0 var(--cz)}
html[data-kr="1"] .ls-im img{mix-blend-mode:normal}
html[data-kr="1"] .dt i{background:rgba(27,28,31,.14)}
html[data-kr="1"] .dt i.on{background:var(--r)}

/* sütun olduğu gibi yapışkan: üstten 110px'te (menü gizliyken 32px) sabit, boyutlar değişmez */
/* kart şeridi tek satır: model sayısı kırılmaz, seri yazısı sığmazsa kısalır */
html[data-kr="1"] .ks b{flex:none;white-space:nowrap}
html[data-kr="1"] .ks span{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html[data-kr="1"] .ks span{flex:1;text-overflow:clip;text-align:right}
html[data-kr="1"] .ks span.tas{text-align:left;-webkit-mask-image:linear-gradient(90deg,#000 70%,transparent);mask-image:linear-gradient(90deg,#000 70%,transparent)}
/* süzgeç etiketleri başlık ile ürün sayısı arasında (geniş ekranda); daha dar ekranda başlığın altına iner */
.ls-ust{grid-template-columns:auto 1fr auto;grid-template-areas:"t e s" "a a a"}
.ls-ust .ul{grid-area:t}
.ls-ust .us{grid-area:s}
.ls-ust .ls-etk{grid-area:e;justify-content:flex-end;align-self:end;padding-bottom:4px}
.ls-ust .ay{grid-area:a}
@media (max-width:1199px){
	.ls-ust{grid-template-columns:1fr auto;grid-template-areas:"t s" "e e" "a a"}
	.ls-ust .ls-etk{justify-content:flex-start;padding-bottom:0}
}
/* arama ikonu tıklanabilir: aramayı uygular, mobil paneli kapatır */
.ls-ai{pointer-events:auto;cursor:pointer}