/* 1. TOKENLAR — fp.css üzerine tasarım katmanı */
:root{--lacivert:#12345b;--mavi:#1769aa;--mavi-koyu:#10558d;--turuncu:#a85b16;--cizgi:#dce3e9;--metin-ters:#fff;--soluk:#667481;--golge:0 10px 30px rgba(18,52,91,.08);--golge-xs:0 1px 3px rgba(18,52,91,.06);--olcu:1320px;--btn-h:40px;--gorsel-h:158px;--etiket-bant:36px;--radius-sm:7px;--radius-md:12px;--fs-xs:.75rem;--fs-sm:.875rem;--fs-lg:1.125rem;--fs-h1:clamp(2rem,3.7vw,3.5rem);--fs-h2:clamp(1.55rem,2.5vw,2.3rem);--sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;--sp-5:24px;--sp-6:32px}
*,*::before,*::after{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#f5f7f9;color:#221F1A;font:400 16px/1.6 system-ui,-apple-system,"Segoe UI",Arial,sans-serif}img,svg{max-width:100%}img{height:auto}a{color:var(--lacivert);text-underline-offset:3px}a:hover{color:var(--mavi-koyu)}h1,h2,h3,h4{line-height:1.2;letter-spacing:-.025em;color:#221F1A}h1{font-size:var(--fs-h1)}h2{font-size:var(--fs-h2)}p{margin-top:0}small{font-size:var(--fs-sm)}:where(a,button,input,select,textarea,summary):focus-visible{outline:3px solid #267bc3;outline-offset:3px;box-shadow:0 0 0 5px rgba(38,123,195,.15)}[hidden]{display:none!important}.kap{width:min(calc(100% - 48px),var(--olcu));margin-inline:auto}.bolum{padding-block:64px}.bolum.beyaz{background:#fff}.bolum-baslik{max-width:760px;margin-bottom:28px}.bolum-baslik>span{display:block;color:var(--mavi-koyu);font-size:var(--fs-xs);font-weight:600;letter-spacing:.08em;text-transform:uppercase}.bolum-baslik h2{margin:5px 0 10px}.bolum-baslik p{color:var(--soluk)}.kirinti{display:flex;flex-wrap:wrap;gap:8px;align-items:center;min-height:40px;padding-block:10px;color:var(--soluk);font-size:var(--fs-sm)}.kirinti a{text-decoration:none}
/* 2. ÜST ŞERİT / NAVİGASYON */
.ustserit{background:var(--lacivert);color:#fff;font-size:12px}.ustserit .kap,.ustserit-sag{display:flex;align-items:center;justify-content:space-between;gap:14px}.ustserit a{color:#fff}.ustbilgi{background:#fff;border-bottom:1px solid var(--cizgi)}.ustbilgi>.kap{display:flex;align-items:center;gap:24px;min-height:86px}.logo{display:inline-flex;align-items:center;gap:10px;flex:none;text-decoration:none;color:var(--lacivert)}.logo-isaret{display:grid;place-items:center;min-width:44px;min-height:44px;padding:5px;border-radius:10px;background:var(--lacivert);color:#fff;font-weight:600}.logo-yazi{font-size:20px;font-weight:600;line-height:1.2;letter-spacing:-.03em}.ara{display:flex;align-items:center;flex:1;min-width:0;max-width:600px}.ara input{min-width:0;flex:1;height:var(--btn-h);border:1px solid var(--cizgi);border-radius:var(--radius-sm) 0 0 var(--radius-sm);padding:0 14px;font:inherit}.ara button{border-radius:0 var(--radius-sm) var(--radius-sm) 0}.ust-eylem{display:flex;align-items:center;gap:10px;margin-left:auto}.sepet-dugme{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:var(--btn-h);padding:0 12px;border:1px solid var(--cizgi);border-radius:var(--radius-sm);text-decoration:none;white-space:nowrap}.rozet{display:inline-grid;place-items:center;min-width:20px;min-height:20px;padding:2px 5px;border-radius:99px;background:var(--lacivert);color:#fff;font-size:11px}.menu{display:flex;flex-wrap:wrap;align-items:center;gap:8px 24px;background:#fff}.menu a{display:inline-flex;align-items:center;min-height:40px;text-decoration:none;font-weight:600;font-size:14px}.menu a.aktif{color:var(--mavi-koyu);box-shadow:inset 0 -2px var(--mavi)}.atla{position:absolute;left:10px;top:-100px;z-index:1000;background:#fff;padding:12px}.atla:focus{top:10px}
/* 3. BUTONLAR / DURUMLAR */
.btn,.btn-cizgi,.btn-wa,.btn-kucuk,.marka-btn,.sepet-dugme{height:var(--btn-h);min-height:var(--btn-h);max-height:var(--btn-h);padding-block:0;white-space:nowrap}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding-inline:17px;border:1px solid var(--lacivert);border-radius:var(--radius-sm);background:var(--lacivert);color:#fff;text-decoration:none;font:700 14px/1.2 inherit;cursor:pointer;transition:background .18s,border-color .18s,box-shadow .18s}.btn:hover{background:#0b2746;border-color:#0b2746;color:#fff}.btn:active{filter:brightness(.9)}.btn-cizgi{background:#fff;color:var(--lacivert);border-color:#b9c8d4}.btn-cizgi:hover{background:#eaf1f7;color:var(--lacivert)}.btn-wa{background:#16784f;border-color:#16784f;color:#fff}.btn-wa:hover{background:#105e3e;border-color:#105e3e;color:#fff}.btn-kucuk{padding-inline:12px;font-size:13px}.btn:disabled,.btn[aria-disabled="true"],button:disabled{opacity:.52;cursor:not-allowed;box-shadow:none}.etiket-kutu{display:flex;align-items:center;flex-wrap:wrap;gap:5px;min-height:var(--etiket-bant);padding:4px 8px;background:#f8fafb}.etiket,.cip,.rozet{display:inline-flex;align-items:center;justify-content:center;border-radius:99px;font-size:11px;font-weight:600;line-height:1.2}.etiket{padding:4px 8px;background:#eaf1f7;color:var(--lacivert);border:1px solid #d3e0ec}.etiket.yenilenmis{background:#fff4e8;border-color:#f1d4b7;color:#85470e}.etiket.tek,.etiket.kondisyon{background:#edf1f4;color:#465461}.cip{padding:4px 7px;border:1px solid var(--cizgi);background:#f7f9fa;color:#465461}.fiyat{font-size:clamp(17px,1.8vw,23px);font-weight:600;line-height:1.2;letter-spacing:-.025em;font-variant-numeric:tabular-nums}.fiyat-sor{color:var(--lacivert);font-weight:600;font-size:15px}.kdv,.model,.marka-not{color:var(--soluk);font-size:12px}.tco{padding:16px;border:1px solid var(--cizgi);border-radius:var(--radius-md);background:#f8fafb}.tco-sayi{font-size:19px;font-weight:600;font-variant-numeric:tabular-nums}
/* 4. HERO / BÖLÜMLER */
.hero{background:linear-gradient(135deg,#fff,#edf3f8);border-bottom:1px solid var(--cizgi)}.hero-izgara{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);align-items:center;gap:48px;min-height:370px;padding-block:56px}.hero-izgara--tek{grid-template-columns:minmax(0,820px);min-height:290px}.hero h1{margin:0 0 18px;max-width:800px}.hero p{max-width:680px;color:#6F6A63;font-size:var(--fs-lg)}.hero-dugme{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}.marka-serit{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.marka-btn{display:flex;align-items:center;justify-content:center;padding-inline:12px;border:1px solid var(--cizgi);border-radius:var(--radius-sm);background:#fff;text-decoration:none;box-shadow:var(--golge-xs)}.marka-btn:hover{border-color:#aebdca;background:#f9fbfd}.marka-logo{display:block;max-width:150px;max-height:36px;object-fit:contain}.marka-logo--buyuk{max-width:230px;max-height:85px}.kutular{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.kutu{min-width:0;padding:24px;border:1px solid var(--cizgi);border-radius:var(--radius-md);background:#fff;box-shadow:var(--golge-xs)}.kutu>:last-child{margin-bottom:0}.kutu.uygun{border-left:4px solid #16815c}.kutu.uygun-degil{border-left:4px solid #927157}.serit{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.adim{min-width:0;padding:18px;border:1px solid var(--cizgi);border-radius:var(--radius-md);background:#fff}.firsat{background:#f8fafb}
/* 5. KATALOG / LİSTE / KART */
.ic-izgara{display:grid;grid-template-columns:240px minmax(0,1fr);gap:24px;align-items:start}.filtre{min-width:0;padding:18px;border:1px solid var(--cizgi);border-radius:var(--radius-md);background:#fff}.filtre input,.filtre select,.f-siralama{max-width:100%}.liste-kontrol{display:none}.sonuc-ust{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}.sonuc-sayi{font-size:14px;color:var(--soluk)}.izgara{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;min-width:0}.kart{display:flex;flex-direction:column;min-width:0;height:100%;overflow:hidden;border:1px solid var(--cizgi);border-radius:var(--radius-md);background:#fff;box-shadow:var(--golge-xs)}.kart:hover{border-color:#b8c9d7;box-shadow:var(--golge)}.kart-gorsel{display:flex;flex-direction:column;min-width:0;background:#f8fafb}.kart-gorsel .etiket-kutu{position:static;flex:none;height:var(--etiket-bant);min-height:var(--etiket-bant);overflow:hidden}.kart-gorsel-link{display:grid;place-items:center;min-width:0;height:var(--gorsel-h);overflow:hidden;text-decoration:none}.kart-gorsel-link img,.kart-gorsel img{display:block;width:100%;height:100%;max-height:var(--gorsel-h);aspect-ratio:4/3;object-fit:contain;object-position:center;padding:8px}.kart-govde{display:flex;flex:1;flex-direction:column;min-width:0;padding:13px}.kart-govde>small{color:var(--soluk);font-size:11px;font-weight:600}.kart-govde h3{margin:5px 0 8px;font-size:15px;line-height:1.35}.kart-govde h3 a{text-decoration:none;color:#221F1A}.kart-govde p{font-size:13px;color:#53616e}.kart-ozellik{display:flex;flex-wrap:wrap;gap:5px;margin-top:auto}.kart-alt{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 13px;border-top:1px solid var(--cizgi);background:#fcfdfd}.kart-alt .btn{flex:none}.sayfalama{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:26px}.sayfalama a,.sayfalama span{display:grid;place-items:center;min-width:var(--btn-h);height:var(--btn-h);padding-inline:10px;border:1px solid var(--cizgi);border-radius:var(--radius-sm);background:#fff;text-decoration:none}.sayfalama .aktif{background:var(--lacivert);color:#fff}.gizli-etiket{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
/* 6. ÜRÜN DETAY / TABLO / SSS */
.detay{display:grid;grid-template-columns:minmax(0,1.03fr) minmax(0,.97fr);align-items:start;gap:32px}.detay-galeri,.detay-bilgi{min-width:0}.detay-galeri>img{display:block;width:100%;height:auto;max-height:none;aspect-ratio:4/3;object-fit:contain;background:#fff;border:1px solid var(--cizgi);border-radius:var(--radius-md)}.detay-galeri .minikler{display:flex;gap:8px;margin-top:10px}.detay-galeri .minikler button{width:70px;height:58px;padding:3px;border:1px solid var(--cizgi);border-radius:var(--radius-sm);background:#fff;cursor:pointer}.detay-galeri .minikler button.secili{border-color:var(--mavi);box-shadow:0 0 0 2px rgba(23,105,170,.15)}.detay-galeri .minikler img{width:100%;height:100%;object-fit:contain}.detay-bilgi{padding:24px;border:1px solid var(--cizgi);border-radius:var(--radius-md);background:#fff}.detay-bilgi h1{font-size:clamp(24px,2.5vw,36px);margin:10px 0 16px}.detay-fiyat{padding:16px 0;border-block:1px solid var(--cizgi)}.detay-dugme{display:flex;flex-wrap:wrap;gap:10px;margin-block:16px}.tablo{width:100%;border-collapse:collapse;background:#fff;font-size:14px}.tablo caption{text-align:left;font-weight:600;padding:12px}.tablo th,.tablo td{padding:12px;border-bottom:1px solid var(--cizgi);text-align:left;vertical-align:top;overflow-wrap:anywhere}.tablo th{background:#f4f7f9;font-weight:600}.katlanir{border:1px solid var(--cizgi);border-radius:var(--radius-md);background:#fff;margin-block:12px;overflow:hidden}.katlanir summary{min-height:44px;padding:12px 16px;font-weight:600;cursor:pointer}.katlanir[open] summary{border-bottom:1px solid var(--cizgi)}.katlanir>:not(summary){margin:16px}.sss details{margin-bottom:8px;border:1px solid var(--cizgi);border-radius:var(--radius-sm);background:#fff}.sss summary{padding:13px 16px;min-height:44px;cursor:pointer;font-weight:600}.sss details>:not(summary){padding-inline:16px}
/* 7. SEPET / BOŞ / HATA */
.sepet-bos{display:block;width:100%;grid-column:1/-1}.sepet-bos .bos-kutu{width:min(100%,560px);margin:30px auto}.bos-kutu{padding:36px 28px;border:1px dashed #b9c8d4;border-radius:var(--radius-md);background:#fff;text-align:center}.bos-kutu p{max-width:520px;margin-inline:auto;color:var(--soluk)}.bos-simge{display:grid;place-items:center;width:60px;height:60px;margin:0 auto 14px;border-radius:50%;background:#eaf1f7;color:var(--lacivert)}.arama-bos{grid-column:1/-1;width:100%}.hata-sayfasi{min-height:55vh;display:grid;place-items:center;padding-block:60px}.hata-icerik{max-width:680px;margin-inline:auto;text-align:center}.hata-kod{display:block;color:#d4e0eb;font-size:clamp(80px,13vw,160px);font-weight:600;line-height:1}.hata-eylemler{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:24px}.yasal{max-width:900px;margin:0 auto;padding-block:30px 64px;overflow-wrap:anywhere}.yasal h1,.yasal h2{margin-top:24px}.yasal p,.yasal li{line-height:1.75}
/* 8. FOOTER / ASİSTAN */
.altbilgi{margin-top:40px;background:#102c4a;color:#e6edf4}.altbilgi a{color:#e6edf4}.altbilgi-izgara{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px;padding-block:46px}.altbilgi-alt{padding:16px 0;border-top:1px solid rgba(255,255,255,.18);font-size:12px;color:#c7d3df}.asistan{position:fixed;right:20px;bottom:20px;z-index:90}.asistan-dugme{display:grid;place-items:center;width:64px;height:64px;border:1px solid #b8cbdc;border-radius:50%;background:#fff;box-shadow:var(--golge);cursor:pointer}.asistan-dugme img,.asistan-robot img{display:block;width:100%;height:100%;object-fit:contain}.asistan-dugme-balon{position:absolute;right:72px;bottom:12px;max-width:210px;padding:9px 12px;border:1px solid var(--cizgi);border-radius:99px;background:#fff;box-shadow:var(--golge-xs);font-size:12px}.asistan-panel{position:absolute;right:0;bottom:76px;display:flex;flex-direction:column;width:min(380px,calc(100vw - 32px));height:min(590px,calc(100dvh - 112px));overflow:hidden;border:1px solid var(--cizgi);border-radius:16px;background:#fff;box-shadow:0 18px 48px rgba(18,52,91,.2)}.asistan-panel[hidden]{display:none!important}.asistan-ust{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:13px 16px;background:var(--lacivert);color:#fff}.asistan-kapat{display:grid;place-items:center;min-width:var(--btn-h);height:var(--btn-h);border:0;border-radius:var(--radius-sm);background:rgba(255,255,255,.13);color:#fff;cursor:pointer}.asistan-govde{flex:1;min-height:0;overflow:auto;padding:16px}.asistan-metin{max-width:90%;margin-bottom:10px;padding:10px 12px;border-radius:14px;background:#f1f5f8;overflow-wrap:anywhere}.asistan-form{display:flex;gap:8px;padding:12px;border-top:1px solid var(--cizgi)}.asistan-form input{flex:1;min-width:0;height:var(--btn-h);padding:0 10px;border:1px solid var(--cizgi);border-radius:var(--radius-sm)}.asistan-not{font-size:11px;color:var(--soluk);padding:0 12px 10px}.robot{display:block;max-width:100%;height:auto}
/* 9. AÇILIŞ SAHNESİ */
.acilis-sahnesi{position:fixed;inset:0;z-index:999;display:grid;place-items:center;background:#fff}.acilis-icerik{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;width:min(calc(100% - 32px),680px);text-align:center}.acilis-gorsel{display:grid;place-items:center;height:380px}.acilis-gorsel img{display:block;width:auto;max-width:100%;height:360px;object-fit:contain;filter:drop-shadow(0 16px 26px rgba(18,52,91,.16))}.acilis-metin h2{font-size:36px;margin:0 0 8px}.acilis-metin p{font-size:16px;color:var(--soluk);margin:0}.acilis-atla{min-width:120px}
/* 10. 1280 / 1100 / 1024 */
@media(max-width:1280px){.izgara{grid-template-columns:repeat(3,minmax(0,1fr))}.hero-izgara{gap:32px}.altbilgi-izgara{gap:22px}}
@media(max-width:1100px){.kap{width:min(calc(100% - 40px),var(--olcu))}.ic-izgara{grid-template-columns:210px minmax(0,1fr);gap:16px}.kart-alt{flex-wrap:wrap}.serit{grid-template-columns:repeat(2,minmax(0,1fr))}.ustbilgi>.kap{gap:14px}}
@media(min-width:768px) and (max-width:1023px){.izgara{grid-template-columns:repeat(3,minmax(0,1fr))}.ic-izgara{grid-template-columns:200px minmax(0,1fr)}.ic-izgara .izgara{grid-template-columns:repeat(2,minmax(0,1fr))}.detay{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px}.detay-bilgi{padding:16px}.kutular{grid-template-columns:repeat(2,minmax(0,1fr))}.altbilgi-izgara{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* 11. 860 / 767 */
@media(max-width:860px){.ustbilgi>.kap{flex-wrap:wrap;padding-block:10px}.ara{order:3;max-width:none;flex-basis:100%}.hero-izgara,.hero-izgara--tek{grid-template-columns:minmax(0,1fr);min-height:0;padding-block:42px}.marka-serit{grid-template-columns:repeat(2,minmax(0,1fr))}.izgara{grid-template-columns:repeat(2,minmax(0,1fr))}.ic-izgara{grid-template-columns:190px minmax(0,1fr)}.ic-izgara .izgara{grid-template-columns:repeat(2,minmax(0,1fr))}.detay{gap:16px}.detay-bilgi{padding:16px}.bolum{padding-block:46px}}
@media(max-width:767px){.kap{width:calc(100% - 32px)}.ic-izgara{grid-template-columns:minmax(0,1fr)}.filtre{width:100%}.detay{grid-template-columns:minmax(0,1fr)}.detay-galeri{max-width:620px;width:100%;margin-inline:auto}.altbilgi-izgara{grid-template-columns:repeat(2,minmax(0,1fr))}.ustserit .kap{flex-wrap:wrap}.menu{gap:4px 16px}.menu a{font-size:13px}.kutular{grid-template-columns:minmax(0,1fr)}}
/* 12. 620 — ANA MOBİL EŞİĞİ */
@media(max-width:620px){:root{--btn-h:44px;--gorsel-h:148px}.kap{width:calc(100% - 28px)}.bolum{padding-block:32px}.bolum-baslik{margin-bottom:18px}.ustbilgi>.kap{gap:10px}.logo-yazi{font-size:17px}.logo-isaret{min-width:40px;min-height:40px}.menu{overflow-x:auto;flex-wrap:nowrap;scrollbar-width:thin}.menu a{white-space:nowrap}.hero-izgara,.hero-izgara--tek{padding-block:32px;gap:18px}.hero p{font-size:15px}.hero-dugme{gap:8px}.hero-dugme .btn{flex:1}.marka-btn{min-width:0}.marka-logo{max-width:100%;max-height:30px}.serit{grid-template-columns:1fr}.kutu{padding:17px}.liste-kontrol{position:sticky;top:0;z-index:40;display:block;padding:8px 0 10px;background:#f5f7f9;border-bottom:1px solid var(--cizgi)}.liste-arama{display:flex;min-width:0;gap:6px}.liste-arama input{min-width:0;flex:1;height:var(--btn-h);padding:0 10px;border:1px solid var(--cizgi);border-radius:var(--radius-sm)}.liste-araclar{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px}.liste-araclar .btn,.liste-siralama select{width:100%}.liste-siralama select{height:var(--btn-h);min-height:var(--btn-h);max-height:var(--btn-h);border:1px solid var(--cizgi);border-radius:var(--radius-sm);background:#fff;padding-inline:8px}.liste-arama label,.liste-siralama label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.filtre{padding:12px}.filtre[hidden]{display:none!important}.izgara,.ic-izgara .izgara{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.kart-govde{padding:10px}.kart-govde h3{font-size:13px;line-height:1.3;margin:4px 0 7px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.kart-govde p{display:none}.kart-ozellik{gap:4px}.kart-ozellik .cip:nth-child(n+3){display:none}.kart-ozellik .cip{font-size:10px;padding:3px 6px}.kart-alt{display:flex;flex-direction:column;align-items:stretch;gap:8px;padding:9px 10px}.kart-alt .btn{width:100%}.kart-alt .fiyat{font-size:15px}.kart-alt .fiyat-sor{font-size:13px}.etiket-kutu{gap:3px;padding-inline:5px}.etiket{font-size:10px;padding:3px 5px}.detay{gap:16px}.detay-bilgi{padding:14px}.detay-bilgi h1{font-size:23px}.detay-dugme .btn{flex:1}.tablo{font-size:12px}.tablo th,.tablo td{padding:9px}.sepet-bos .bos-kutu{margin:12px auto}.bos-kutu{padding:25px 16px}.altbilgi-izgara{grid-template-columns:1fr;gap:18px;padding-block:30px}.asistan{right:12px;bottom:12px}.asistan-dugme{width:56px;height:56px}.asistan-panel{bottom:68px;width:min(380px,calc(100vw - 24px));height:min(590px,calc(100dvh - 90px))}.acilis-icerik{gap:12px}.acilis-gorsel{height:270px}.acilis-gorsel img{height:260px}.acilis-metin h2{font-size:25px}.acilis-metin p{font-size:14px}}
/* 13. 520 / 430 / 390 / 359 */
@media(max-width:520px){.ustserit{font-size:11px}.ust-eylem{gap:5px}.sepet-dugme{padding-inline:8px}.kart-gorsel-link img{padding:5px}.kart-govde h3{min-height:34px}.hata-eylemler{flex-direction:column;align-items:stretch}.hata-eylemler .btn{width:100%}.asistan-dugme-balon{max-width:170px}}
@media(max-width:430px){.kap{width:calc(100% - 24px)}.izgara,.ic-izgara .izgara{gap:8px}.kart-govde{padding:9px}.kart-alt{padding:9px}.etiket{font-size:9px}.hero-dugme{flex-direction:column}.hero-dugme .btn{width:100%}.ustserit-sag{gap:7px}.logo-yazi{font-size:16px}}
@media(max-width:390px){.kart-govde h3{font-size:12.5px}.kart-ozellik .cip{font-size:9.5px}.asistan-dugme-balon{display:none}}
@media(max-width:359px){.izgara,.ic-izgara .izgara{grid-template-columns:minmax(0,1fr)}.kart-govde h3{font-size:15px}.marka-serit{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* 14. GENİŞ EKRAN / HAREKET */
@media(min-width:1500px){.kap{width:min(calc(100% - 64px),var(--olcu))}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

/* ==========================================================================
   PARÇA 2.1 — ChatGPT düzeltmesi (24 Eyl 2026, ölçüm sonrası 3 karar)
   Kaynak: aynı tasarım sohbeti. Tasarım katmanının sonuna eklendi (aynı dosya
   içindeki <=620px kurallarını ezebilmesi için). duzeltme.css yine en son
   yüklenir; teknik yamalar oradadır.
   1) Footer: <=620px tek kolon her mobil sayfaya ~298px ekliyordu → 2 kolon.
      <=359px: yine 2 kolon, yalnız boşluk daralır. Dokunma alanı >=44px korunur.
   2) Katlanır başlık: 44px dokunma hedefi KORUNUR, yalnız dikey dolgu sıkışır
      (ürün detayı mobil yüksekliği). Kapalı details içeriği yer kaplamaz.
   ========================================================================== */
@media(max-width:620px){
  .altbilgi-izgara{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 16px}
  .altbilgi-izgara>:first-child{grid-column:1/-1}
  /* ChatGPT karari C (24 Eyl 2026): liste baglantilari 36px, eylem baglantilari
     (tel / e-posta / dugme) 44px. Yazı boyutu 13px altina inmez (olculdu: 13,5px). */
  .altbilgi-izgara a{display:flex;align-items:center;min-height:36px}
  .altbilgi-izgara a[href^="tel:"],.altbilgi-izgara a[href^="mailto:"],.altbilgi-izgara .btn,.altbilgi-izgara .btn-wa{min-height:44px}
  /* ChatGPT notu: "Markalar baglantilari iki kolona bolunebilir". 44px dokunma
     alani korunurken liste de iki kolona bolunmezse footer 1005 -> 1241px'e
     cikiyordu (11 marka baglantisi alt alta). Bu yuzden liste iceride 2 kolon. */
  .altbilgi-izgara ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 12px}
  .altbilgi-izgara li{min-width:0}
  .katlanir>summary{box-sizing:border-box;min-height:44px;padding:8px 14px;display:flex;align-items:center}
  .katlanir:not([open])>:not(summary){display:none}
}
@media(max-width:359px){
  .altbilgi-izgara{gap:20px 12px}
}

/* ==========================================================================
   PARÇA 3 — MOBİL İÇERİK HİYERARŞİSİ (ChatGPT, 24 Eyl 2026)
   Kaynak: aynı tasarım sohbeti (blok blok ölçüm sonrası). Yeni görsel dil yok;
   yalnız sıra / katlama / yoğunluk. Katlanırlar HTML'de `open` gelir, JS yalnız
   <=620px'te kapatır (JS yoksa içerik tamamen erişilebilir).
   ========================================================================== */
@media(max-width:620px){

  /* Katlanırların ortak ölçüsü */
  .katlanir{min-width:0;margin-block:12px}
  .katlanir>summary{box-sizing:border-box;display:flex;align-items:center;min-height:44px;padding:8px 14px;cursor:pointer}
  .katlanir:not([open])>:not(summary){display:none}
  .katlanir>.kutular,.katlanir>.izgara,.katlanir>.sss{margin-top:12px}

  /* Güven şeridi: mobilde 2x2 (fiyat/CTA'nın hemen altında) */
  .serit{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .serit>.adim{min-width:0;padding:12px}

  /* Kart yoğunluğu */
  .izgara{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .katlanir>.izgara{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}

  /* Marka filtreleri */
  .marka-serit{overflow-x:auto;overscroll-behavior-inline:contain;-webkit-overflow-scrolling:touch}

  /* Robot: mevcut atölye sahnesi (mobilde 120px) */
  .robot--atolye{width:120px;max-width:100%;height:auto}

  /* --- ÜRÜN DETAYI mobil sıra (ChatGPT PARÇA 3) ---
     Güven şeridi → "Neden bu cihaz?" → katlanırlar → SSS → benzerler.
     Yalnız <=620px ve yalnız ürün detayı (kap içinde article.detay varsa) uygulanır;
     masaüstü DOM sırası DEĞİŞMEZ. */
  #icerik .kap:has(>article.detay){display:flex;flex-direction:column}
  #icerik .kap:has(>article.detay)>*{order:5}
  #icerik .kap:has(>article.detay)>.kirinti{order:0}
  #icerik .kap:has(>article.detay)>article.detay{order:1}
  #icerik .kap:has(>article.detay)>.serit{order:2}
  #icerik .kap:has(>article.detay)>.kutular{order:3}
  #icerik .kap:has(>article.detay)>details.katlanir{order:4}

  /* --- FIRSAT ÜRÜNLERİ mobil sıra (ChatGPT PARÇA 3) ---
     Hero → marka çipleri → stoktaki cihazlar → "Yenilenmiş nedir?" anlatımı → kapanış.
     Anlatım bölümü DOM'dan taşınmadı; #icerik yalnız bu sayfada flex kolon olup order verilir
     (masaüstü sırası DEĞİŞMEZ). */
  #icerik:has(>section#cihazlar){display:flex;flex-direction:column}
  #icerik:has(>section#cihazlar)>section.hero{order:1}
  #icerik:has(>section#cihazlar)>section#cihazlar{order:2}
  #icerik:has(>section#cihazlar)>section.bolum:not(#cihazlar){order:3}

  /* Liste katlanırları (TEK ızgara + eşik): kapalıyken fazla kartlar gizlenir.
     Eşik attribute değerinde: "2" = benzer cihazlar, "8" = fırsat listesi.
     Böylece kartlar TEK ızgarada kalır; iki ayrı ızgara masaüstünde fazladan
     satır üretiyordu. Tüm kartlar DOM'da kalır (SEO + JS kapalı senaryosu).
     NOT: fırsat bölümü ek bir .kap sarmalayıcısı kullanır → torun seçici şart. */
  .bolum:has(details.katlanir[data-katlanir-mobil="2"]:not([open])) .izgara>.kart:nth-child(n+3){display:none}
  .bolum:has(details.katlanir[data-katlanir-mobil="8"]:not([open])) .izgara>.kart:nth-child(n+9){display:none}
}

/* Masaüstü/tablet (>=621px): mobil katlanırlar GÖRÜNMEZ olur (çerçeve + başlık kalkar),
   içerik normal akışa döner. Mobilde katlanmayan hiçbir içerik masaüstünde eksilmez. */
@media(min-width:621px){
  details.katlanir[data-katlanir-mobil]{display:contents}
  details.katlanir[data-katlanir-mobil]>summary{display:none}
}

@media(prefers-reduced-motion:reduce){
  .katlanir,.katlanir>summary{scroll-behavior:auto;transition:none}
}


/* ==========================================================================
   SICAKLIK KATMANI — ChatGPT karari 24.09.2026 ("kontrollu C + Source Sans 3")
   Kullanici: "sitede soguk bir hava var". Olculen nedenler: notrlerin tamami
   mavi-gri (zemin #f5f7f9 · cizgi #dce3e9 · soluk #667481 · golge rgba(18,52,91))
   + sistem fontu + metinlerin ~%46'si kalin + basliklarda negatif harf araligi.
   MARKA RENKLERI DEGISMEDI: lacivert #12345b · mavi #1769aa (eylem rengi).
   Geri alma: bu blogu silmek yeterli (font dosyalari assets/fontlar/).
   ========================================================================== */

/* --- 1) Yazi tipi: Source Sans 3, self-host. Yalniz 400 + 600 yuklenir;
         700 VE UZERI AGIRLIK KULLANILMAZ (sentetik kalinlasma olmasin). --- */
/* DUZELTME 24.09.2026 (Copilot): Source Sans 3 DEGISKEN (variable) bir fonttur;
   Google ayni dosyayi tum agirliklar icin verir. Onceki halde ayni degisken dosya
   "400" ve "600" diye IKI AYRI @font-face'e baglanmisti → "600" yazilar font'un
   varsayilan (400) orneginden ciziliyor, sayfa solgun/flu gorunuyordu. Dogru tanim:
   TEK dosya + `font-weight: 200 900` araligi. (?v=3 = onbellek tazeleme) */
@font-face{font-family:'Source Sans 3';font-style:normal;font-weight:200 900;font-display:swap;src:url(fontlar/source-sans-3-vf-latin-ext.woff2?v=3) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Source Sans 3';font-style:normal;font-weight:200 900;font-display:swap;src:url(fontlar/source-sans-3-vf-latin.woff2?v=3) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Source Sans 3';font-style:normal;font-weight:200 900;font-display:swap;src:url(fontlar/source-sans-3-vf-latin-ext.woff2?v=3) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Source Sans 3';font-style:normal;font-weight:200 900;font-display:swap;src:url(fontlar/source-sans-3-vf-latin.woff2?v=3) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* --- 2) Sicak notrler (ChatGPT tam degerleri) --- */
:root{
  --sicak-zemin:#FAF8F4;
  --sicak-yuzey:#FBF9F5;
  --sicak-cizgi:#E9E2D8;
  --sicak-soluk:#6F6A63;
  --zemin:#FAF8F4;
  --cizgi:#E9E2D8;
  --soluk:#6F6A63;
  --golge:0 10px 30px rgba(58,44,33,.08);
  --golge-xs:0 1px 3px rgba(58,44,33,.07);
  --radius-sm:10px;
  --radius-md:14px;
}

body{
  background:var(--sicak-zemin);
  color:#221F1A;
  font-family:'Source Sans 3',system-ui,-apple-system,'Segoe UI',Arial,sans-serif;
  line-height:1.70;
}

/* Soguk yuzeyler -> sicak yuzey (gorsel alani, etiket bandi, maliyet/firsat kutulari, mobil serit) */
.kart-gorsel,.etiket-kutu,.tco,.firsat,.liste-kontrol{background:var(--sicak-yuzey)}

/* Soluk metin: yalnizca tasarim katmaninda SABIT mavi-gri yazan iki yer */
.hero p,.kart-govde p{color:var(--sicak-soluk)}

/* Acilis sahnesi robot golgesi de sicak tonlu olsun */
.acilis-gorsel img{filter:drop-shadow(0 16px 26px rgba(58,44,33,.16))}

/* --- 3) Tipografi yumusatma: harf araligi + agirlik (700+ kullanilmaz) --- */
h1,h2,h3,h4,h5,h6,
strong,b,
.btn,.btn-cizgi,.btn-wa,.btn-kucuk,.sepet-dugme,.marka-btn,
.fiyat,.fiyat-sor,.kart-alt .fiyat,
header nav a,
#icerik .bolum-baslik > div > span{font-weight:600}

h1,h2,h3,h4{letter-spacing:-.15px}
h3,h4,header nav a,.etiket{letter-spacing:0}
p{line-height:1.70}

/* --- 4) Kontrollu sicak aksan: bolum ust etiketi + kucuk vurgu cizgisi.
         FIYAT BOLGESINE DOKUNULMAZ (kampanya/indirim cagrisimi yaratmasin). --- */
#icerik .bolum-baslik > div > span{color:var(--turuncu)}
#icerik .bolum-baslik > div > span::after{content:'';display:block;width:26px;height:2px;margin-top:6px;background:var(--turuncu);opacity:.45}

/* Ikincil metin baglantilarinin hover'i (yalnizca acik zeminli icerik alani) */
#icerik p a:hover,#icerik li a:hover,#icerik .kart-govde a:hover{color:var(--turuncu)}

