/* ==========================================================================
   bertekelektrik.com.tr — tek stil dosyası
   2026-10-20: TASARIM YENİDEN KURULDU. Eski sürümün ölçüleri geçiyordu ama
   kullanıcı reddetti (*"tasarım epey kötü olmuş"*). Değişen şey renk değil
   KURGU ve biçim dili:

     · iki katlı künye bandı (BERTEK | ARKEN "Bölge Bayi") — eski kimlik
     · yapışan tek şey lacivert gezinti şeridi (53 px), başlığın tamamı değil
     · ŞERİT vitrin: fotoğraflar 923x296, yani oran 3.12 — kurgu buna uydu
     · eşit gözlü foto ızgarası KALDIRILDI
     · köşe yarıçapı 14 px → 4 px (sanayi işi, pastel SaaS kartı değil)
     · eğik kırmızı etiket (`.tab`) — ARKEN işaretinin kendi eğimi
     · yeşil WhatsApp hapı şeritten çıktı, dış çizgili hâle geldi

   🔴 PALET UYDURULMADI: #0775d6 ve #ed1b24 hem eski CSS'te hem logonun
      pikselinde ölçüldü. Kontrast ölçümleri site.php defterinde.
   🔴 SABİT GENİŞLİK YOK, YAZI AKIŞKAN, IZGARA KENDİ SARAR (AGENTS.md).
   ========================================================================== */

:root{
  --mavi:#0775d6;          /* marka mavisi · beyaz üzerinde 4.64 (AA) */
  --mavi-koyu:#06396b;     /* koyu bant · beyaz üzerinde 11.63 */
  --mavi-gece:#062b52;     /* altbilgi · beyaz üzerinde 14.24 */
  --mavi-acik:#e8f2fc;
  --kirmizi:#ed1b24;       /* 🔴 4.39 — YAZI RENGİ DEĞİL, çizgi ve işaret */
  --kirmizi-koyu:#cf121d;  /* zemin olunca beyaz yazıyla 5.59 (AA) */
  --murekkep:#11161d;      /* gövde yazısı · 15.63 */
  --gri:#5b6675;           /* ikincil yazı · beyaz üzerinde 5.83 */
  --cizgi:#dde3ea;
  --kagit:#f4f6f9;
  --beyaz:#fff;
  --olcu:1180px;
  /* 🔴 VİTRİN KABI BAŞLIKLA AYNI OLMAK ZORUNDA. İlk denemede vitrin
     1500 px, başlık 1180 px idi: logo ile fotoğraf sütununun sol kenarı
     128 px kaymıştı. Hiza iki kenardan ölçülür (AGENTS.md, 41klima). */
  --yuvarlak:4px;
  --golge:0 1px 2px rgba(17,22,29,.06), 0 10px 26px rgba(17,22,29,.08);
  --serit-h:53px;          /* yapışan gezinti şeridi + kırmızı çizgi */
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--serit-h) + 16px)}
body{
  margin:0;background:var(--beyaz);color:var(--murekkep);
  font:400 16.5px/1.68 system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  overflow-wrap:break-word;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--mavi)}
h1,h2,h3,h4{line-height:1.16;margin:0 0 .5em;letter-spacing:-.018em}
h1{font-size:clamp(26px,3.1vw,40px);font-weight:800}
h2{font-size:clamp(21px,2.2vw,29px);font-weight:780}
h3{font-size:clamp(17px,1.5vw,20px);font-weight:700}
p{margin:0 0 1em}
:focus-visible{outline:3px solid var(--kirmizi);outline-offset:2px;border-radius:3px}

/* 🔴 SABİT GENİŞLİK YOK; yan boşluk 16 px'in altına düşmüyor. */
.kapsa{width:min(100% - 32px,var(--olcu));margin-inline:auto}
.kapsa.dar{width:min(100% - 32px,760px)}

.atla{position:absolute;left:-9999px;top:0;background:var(--kirmizi-koyu);color:#fff;
  padding:12px 18px;z-index:60}
.atla:focus{left:0}

/* ====================================================== eğik kırmızı etiket
   🔴 BİÇİM DİLİ: ARKEN işareti eğik kesimlerden kuruludur ve eski sitenin
      manşetinde kırmızı eğik bir şerit vardı. Bölüm başlıkları aynı eğimi
      taşıyor — kitin başka hiçbir sitesinde bu yok.
   🔴 YAZI EĞİLMİYOR, yalnız arka plan. Kutunun kendisi `skewX` alsaydı
      harfler de yatardı ve okunurluk düşerdi. */
.tab{
  position:relative;z-index:0;display:inline-block;margin:0 0 14px;padding:6px 16px;
  color:#fff;font-size:12px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;
  line-height:1.35;
}
.tab::before{content:"";position:absolute;inset:0;z-index:-1;
  background:var(--kirmizi-koyu);transform:skewX(-12deg)}

/* ---------------------------------------------------------------- düğme */
.dugme{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  min-height:48px;padding:0 20px;border-radius:var(--yuvarlak);border:1.5px solid transparent;
  font-weight:700;font-size:15.5px;text-decoration:none;cursor:pointer;
  transition:transform .15s ease,background .15s ease,border-color .15s ease;
}
.dugme:hover{transform:translateY(-2px)}
.dugme-birincil{background:var(--kirmizi-koyu);color:#fff}
.dugme-birincil:hover{background:#b00e17}
.dugme-ikincil{background:#fff;color:var(--mavi-koyu);border-color:var(--cizgi)}
.dugme-ikincil:hover{border-color:var(--mavi)}
.dugme-wa{background:#1fa855;color:#fff}
.dugme-wa:hover{background:#19904a}
/* 🔴 ÖLÇÜSÜ VERİLMEMİŞ SVG KABINI DOLDURUR — AGENTS.md. */
.dugme svg,.ust-wa svg,.y-wa svg,.yuzen a svg,.ust-cta svg{
  width:20px;height:20px;flex:none;fill:currentColor}
.yuzen a svg{width:24px;height:24px}

/* 🔴 WhatsApp: yardımcı İKİ bağlantı birden basıyor; hangisinin görüneceğine
   bu blok karar veriyor. Yazılmazsa ikon İKİ KEZ çıkar.
   🔴 ÇİFT SINIF ZORUNLU: tek sınıf (0,1,0) kalır ve `.ust-wa` / `.yuzen a`
      gibi sonradan gelen kurallar onu yener (feedback-wa-iki-mod-secici-savasi).
   🔴 GÖRÜNEN TARAFA `display` YAZILMAZ: yazılsaydı `.yuzen a`nın
      `display:grid`i ezilir, yüzen düğme yuvarlak olmaktan çıkardı. */
@media (max-width:600px){ .wa-masaustu.wa-masaustu{display:none} }
@media (min-width:601px){ .wa-mobil.wa-mobil{display:none} }

/* ======================================================== ÜST — KÜNYE BANDI
   🔴 ESKİ SİTENİN KİMLİĞİ: solda BERTEK kilidi, sağda ARKEN "Bölge Bayi".
      İlk sürümde ARKEN hiç yoktu; kullanıcı kusur olarak bildirdi.
   🔴 BU BANT YAPIŞMIYOR — kayıp gidiyor. Yapışan yalnız gezinti şeridi.
      Önceki sürümde 110 px'lik iki satırlık blok ekranın üstünde sürekli
      duruyordu ve en gürültülü şey oydu. */
.kunye-bandi{background:#fff;border-bottom:1px solid var(--cizgi)}
/* 🔴 BANT İNCE TUTULDU. 93 px'ken başlığın tamamı 146 px oluyordu, yani
   820 px'lik bir ekranın %17,8'i; ilk ekranın görsel oranı bu yüzden
   eşiğin altına sarkıyordu. Şimdi 73 + 53 = 126 px. */
.kunye-bandi-ic{display:flex;align-items:center;justify-content:space-between;
  gap:14px;min-height:72px;padding:5px 0}
.marka{display:flex;align-items:center;flex:none;min-height:44px;
  text-decoration:none;color:var(--mavi-koyu)}
/* 🔴 Logo 548x130 kaynaktan 258x61'e KÜÇÜLÜYOR (2x DPR'de bire bir). */
.marka img{width:240px;height:57px;object-fit:contain}
.marka strong{font-size:20px;letter-spacing:-.02em}

/* ARKEN rozeti: kaynak 190x74, ekranda 164x64 — oran 0.86, büyütme yok. */
.bayi{display:flex;align-items:center;flex:none;text-decoration:none;
  padding:4px 2px 4px 16px;border-left:3px solid var(--cizgi)}
/* 🔴 ROZET, KİLİTTEN KÜÇÜK. Eski sitede de BERTEK kilidi (548 px) ARKEN
   rozetinden (190 px) çok daha büyüktü; eşit basınca sayfa "Arken sitesi"
   gibi okunuyor. Kaynak 190x74, ekranda 142x55 — oran 0.75. */
.bayi img{width:142px;height:55px;object-fit:contain}
.bayi:hover{border-left-color:var(--kirmizi)}

/* --------------------------------------------------- gezinti şeridi */
.gez-serit{position:sticky;top:0;z-index:40;background:var(--mavi-koyu);
  border-bottom:3px solid var(--kirmizi)}
.gez-ic{display:flex;align-items:center;gap:6px;min-height:50px}

.gezinti{display:flex;gap:1px;flex-wrap:wrap}
.gezinti a{
  display:inline-flex;align-items:center;min-height:46px;padding:0 12px;
  text-decoration:none;color:#d6e6f7;font-size:14.6px;font-weight:650;white-space:nowrap;
}
.gezinti a:hover{background:rgba(255,255,255,.1);color:#fff}
.gezinti a[aria-current]{color:#fff;background:rgba(255,255,255,.08);
  box-shadow:inset 0 -3px 0 var(--kirmizi)}

.ust-eylem{display:flex;align-items:center;gap:8px;margin-left:auto}
/* 🔴 YEŞİL HAP ŞERİTTEN ÇIKTI. Önceki sürümde başlığın en parlak ögesi
      WhatsApp'ın yeşiliydi ve marka mavisi/kırmızısını eziyordu. Şeritte
      dış çizgili duruyor; yüzen düğme hâlâ tanıdık yeşil. */
.ust-wa{display:inline-flex;align-items:center;gap:7px;min-height:44px;padding:0 13px;
  border:1.5px solid rgba(255,255,255,.34);color:#fff;text-decoration:none;
  font-weight:650;font-size:14.2px}
.ust-wa svg{fill:#4ad07a}
.ust-wa:hover{border-color:#4ad07a;background:rgba(74,208,122,.14)}
.ust-cta{display:inline-flex;align-items:center;gap:7px;min-height:44px;min-width:48px;
  padding:0 15px;background:var(--kirmizi-koyu);color:#fff;text-decoration:none;
  font-weight:800;font-size:15px;white-space:nowrap}
.ust-cta:hover{background:#b00e17}

.menu-dugme{display:none;width:48px;height:48px;border:1px solid rgba(255,255,255,.3);
  background:transparent;cursor:pointer;padding:0;
  flex-direction:column;justify-content:center;align-items:center;gap:5px}
.menu-dugme span{display:block;width:21px;height:2px;background:#fff;
  transition:transform .2s ease,opacity .2s ease}
.menu-dugme[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.menu-dugme[aria-expanded="true"] span:nth-child(2){opacity:0}
.menu-dugme[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

@media (max-width:1099px){
  /* Menü solda, eylemler sağda: aksi hâlde şeridin sol yarısı bomboş
     kalıyor ve üç düğme sağ kenara yığılıyor (375 px'te görüldü). */
  .menu-dugme{display:flex;order:1;margin-right:auto}
  .ust-eylem{order:2;margin-left:0}
  /* 🔴 PANEL `.gez-serit`E TUTUNUYOR (sticky öge konumlandırma bağlamı
     kurar), `.kapsa`ya değil — yoksa panel içerik sütununa hapsolur ve
     şeridin altında yarım genişlikte bir kutu olarak çıkar. */
  .gezinti{display:none;position:absolute;left:0;right:0;top:100%;
    flex-direction:column;gap:0;background:var(--mavi-koyu);
    padding:4px max(16px,calc((100% - var(--olcu))/2)) 14px;
    border-bottom:3px solid var(--kirmizi);box-shadow:0 18px 30px rgba(6,20,36,.34)}
  .gezinti.acik{display:flex}
  .gezinti a{min-height:50px;padding:0 4px;border-bottom:1px solid rgba(255,255,255,.14)}
}
@media (max-width:879px){
  .kunye-bandi-ic{min-height:72px}
  .marka img{width:214px;height:51px}
  .bayi img{width:132px;height:51px}
  .bayi{padding-left:12px}
}
@media (max-width:519px){
  .kunye-bandi-ic{gap:8px;min-height:64px}
  .marka img{width:168px;height:40px}
  .bayi img{width:104px;height:40px}
  .bayi{padding-left:9px}
  .ust-cta span{display:none}
  .ust-cta{padding:0 13px}
}

/* ============================================================ VİTRİN
   🔴 KURGUYU MALZEME SEÇTİ. Fotoğraflar 923x296 (oran 3.12) ve 444x296.
      Kare/4:3 kart ızgarası bu kaynağa yabancı; sayfa ŞERİT üzerine
      kuruldu: solda lacivert künye slabı, sağda üç fotoğraf şeridi.

   🔴 BÜYÜTME ORANI HESABI (eşik 1.15, AGENTS.md):
        kap 1500 px tavanlı · sütunlar 0.42fr / 1fr · boşluk 12 px
        1280 ekran → sağ sütun 869 px  → 869/923 = 0.94
                     ikili göz 428 px  → 428/444 = 0.96
        1920 ekran → sağ sütun 1024 px → 1024/923 = 1.11
                     ikili göz 506 px  → 506/444 = 1.14
      Tavan 1500'ün üstüne çıkılırsa 1.15 aşılır; sayı buradan geliyor.

   🔴 `object-fit:cover` KULLANILMIYOR. Şeritler kendi doğal oranlarında
      basılıyor (`width:100%;height:auto`), yani büyütme oranı
      genişlikten doğru okunuyor — cover'da dikey oran daha büyük
      çıkabiliyor ve ölçüm yanıltıyor (41klima dersi). */
.vitrin{background:linear-gradient(180deg,var(--kagit) 0,#fff 62%);padding:6px 0 0}
.vitrin-ic{
  width:min(100% - 32px,var(--olcu));margin-inline:auto;
  display:grid;gap:12px;grid-template-columns:minmax(290px,.36fr) minmax(0,1fr);
  align-items:stretch;
}
.vitrin-slab{
  background:var(--mavi-koyu);color:#fff;padding:28px 22px 24px;
  display:flex;flex-direction:column;justify-content:flex-start;gap:30px;
  background-image:linear-gradient(190deg,rgba(7,117,214,.26) 0,rgba(7,117,214,0) 48%);
}
.vitrin-slab h1{margin:0 0 14px;color:#fff}
.vitrin-slab h1 span{color:#fff;display:inline-block;
  box-shadow:inset 0 -.16em 0 var(--kirmizi)}
.vitrin-ozet{margin:0 0 20px;color:#bcd6f0;font-size:15.8px;max-width:44ch}
.vitrin-eylem{display:flex;flex-wrap:wrap;gap:10px}
.vitrin-eylem .dugme-ikincil{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}

/* Künye sayıları: hepsi SAYFANIN KENDİ içeriğinin sayımı. */
.vitrin-sayi{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:0}
.vitrin-sayi > div{border-top:3px solid var(--kirmizi);padding-top:9px}
.vitrin-sayi dt{font-size:clamp(22px,2.4vw,30px);font-weight:800;line-height:1;color:#fff}
.vitrin-sayi dd{margin:5px 0 0;font-size:12.6px;line-height:1.35;color:#a9c6e2}
/* Slabın dibi: fotoğraf yığını künyeden uzun olduğu için altta boş lacivert
   kalıyordu; adres oraya oturdu — uydurma bir rakam değil, gerçek bilgi. */
.vitrin-adres{margin:auto 0 0;padding-top:22px;border-top:1px solid rgba(255,255,255,.18);
  font-size:13.6px;line-height:1.5;color:#a9c6e2}
.vitrin-adres strong{display:block;color:#fff;font-size:14px;margin-bottom:3px}

.vitrin-yigin{display:grid;gap:12px;align-content:start}
.vitrin-ikili{display:grid;gap:12px;grid-template-columns:repeat(2,minmax(0,1fr))}

.serit-kare{margin:0;position:relative;overflow:hidden;background:#0b2440}
.serit-kare img{width:100%;height:auto}
.serit-kare figcaption{
  position:absolute;inset:auto 0 0 0;padding:30px 14px 10px;color:#fff;font-size:12.4px;
  font-weight:650;letter-spacing:.02em;
  background:linear-gradient(180deg,rgba(6,20,36,0) 0,rgba(6,20,36,.8) 64%);
}
/* 🔴 KARARTMA TEK KATMAN: görselin opaklığına dokunulmuyor, yalnız alt
   gradyan var. İkisi birden olursa fotoğraf kayboluyordu (Özyıldırım). */

@media (max-width:959px){
  .vitrin-ic{grid-template-columns:1fr}
  .vitrin-slab{padding:24px 20px 22px;gap:20px}
  .vitrin-ozet{max-width:none}
}
/* 🔴 ÇOK GENİŞ EKRANDA KAP BÜYÜYOR — 1180'de kalınca 1920'de ilk ekranın
   yalnız %36,9'u görseldi (ölçüldü). 1360 tavanı: ikili göz en çok 489 px
   basılıyor, kaynak 444 → oran 1.10, eşik 1.15. Kural `--olcu`ya yazıldı,
   yani başlık/altbilgi/iç sayfalar da birlikte genişliyor ve hiza bozulmuyor. */
@media (min-width:1600px){ :root{--olcu:1360px} }

/* 🔴 TEK SÜTUNA DÜŞÜNCE KÜNYE FOTOĞRAFI AŞAĞI İTİYOR. 768x1024'te ilk ekranın
   yalnız %39,1'i görseldi: slab tam genişlik olunca sayı bloğu ve adres
   fotoğraf yığınının üstünde yer kaplıyordu. Adres gizlendi (altbilgide ve
   İletişim sayfasında aynen var), dolgular daraltıldı. */
@media (max-width:959px){
  .vitrin-slab{padding:16px 18px 18px;gap:12px}
  .vitrin-ozet{margin-bottom:14px}
  .vitrin-adres{display:none}
  .vitrin-sayi{gap:12px}
  .vitrin-sayi > div{padding-top:7px}
  .vitrin-sayi dd{font-size:12px}
  .vitrin-slab h1{margin-bottom:10px}
}

@media (max-width:639px){
  /* 🔴 İKİLİ GÖZ TEK SÜTUNA İNİYOR. İki sütunda kare 166 px'e düşüyor ve
     ilk ekranın görsel oranı eşiğin altına sarkıyordu; tek sütunda aynı
     kare BÜYÜMEDEN (343/444 = 0.77) iki katı yer kaplıyor. */
  .vitrin-ikili{grid-template-columns:1fr}
  /* 🔴 İLK EKRAN METİN ORANI İÇİN GİZLENİYOR, SİLİNMİYOR: özetin karşılığı
     sayfanın altındaki bölümlerde, adres altbilgide ve İletişim sayfasında
     aynen duruyor — bilgi kaybı yok. */
  .vitrin-ozet,.vitrin-sayi,.vitrin-adres{display:none}
  .serit-kare figcaption{font-size:11.5px;padding:24px 11px 8px}
}
@media (max-width:519px){
  /* 🔴 TELEFONDA KÜNYE SLABI İNCELTİLDİ. 320x640'ta slab 333 px yer kaplıyor
     ve fotoğrafa 190 px kalıyordu. Başlık küçüldü, hap düğme tek satıra
     indi: vitrinin WhatsApp'ı gizli — hem şeritte hem yüzen düğmede var,
     üç kez göstermenin anlamı yok. */
  .vitrin-slab{padding:18px 16px 20px;gap:14px}
  .vitrin-slab h1{font-size:23px;margin-bottom:10px}
  .vitrin-slab .tab{margin-bottom:11px;padding:5px 13px;font-size:11.4px}
  .vitrin-eylem .dugme-wa{display:none}
  .vitrin-yigin{gap:8px}
  .vitrin-ikili{gap:8px}
}
/* 🔴 ÇOK DAR TELEFONDA (≤359 px) ÜST ETİKET GİZLİ. 320x640'ta künye slabı
   ekranın yarısını yiyordu; "ERENLER · SAKARYA" ibaresi altbilgide,
   İletişim sayfasında ve sayfa başlığında aynen duruyor. */
@media (max-width:359px){
  .vitrin-slab .tab{display:none}
  .vitrin-slab h1{font-size:21px}
  .vitrin-slab{padding:16px 14px 18px;gap:12px}
}

/* ====================================================== KIRMIZI SLOGAN
   🔴 ESKİ SİTENİN İŞARETİ. Eski manşetin içine GÖMÜLÜ olan kırmızı
      "ELEKTRİK - PROJE - TAAHHÜT VE PANO İMALATI" şeridi, gerçek bir
      HTML bandı olarak geri geldi: aranabilir ve ekran okuyucuya görünür.
   🔴 ZEMİN #cf121d — marka kırmızısı #ed1b24 beyaz yazıyla 4.39 veriyor,
      eşik 4.5; koyu sürüm 5.59. */
.slogan{background:var(--kirmizi-koyu);color:#fff;margin-top:26px}
.slogan-ic{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;
  gap:10px 26px;min-height:54px;padding:12px 0}
.slogan-ic span{display:inline-flex;align-items:center;gap:26px;
  font-size:13.6px;font-weight:800;letter-spacing:.2em;text-transform:uppercase}
/* 🔴 ELMAS AYIRICI SPAN'IN İÇİNDE: kapsayıcı boşluğu 26 px, span'in kendi
   boşluğu da 26 px → KELİME | 26 | elmas | 26 | KELİME. Negatif kenar
   boşluğuyla sola çekilince elmas önceki kelimeye yapışıp "ELEKTRİK♦"
   gibi okunuyordu (ekranda görüldü). */
.slogan-ic span + span::before{content:"";width:7px;height:7px;flex:none;
  background:#fff;transform:rotate(45deg);opacity:.7}

/* ======================================================== REFERANS BANDI
   🔴 SİTENİN EN GÜÇLÜ MALZEMESİ FOTOĞRAF DEĞİL, DOKUZ SANAYİ REFERANSI.
      İlk sürümde soluk bir logo şeridiydi; kendi lacivert bandına çıktı. */
.referans-bant{background:var(--mavi-koyu);color:#fff;padding:38px 0 42px}
.referans-bant h2{margin:0;color:#fff;max-width:30ch}
.bant-basi{display:flex;flex-wrap:wrap;gap:16px 24px;align-items:flex-end;
  justify-content:space-between;margin-bottom:22px}
.bant-bag{display:inline-flex;align-items:center;min-height:46px;padding:0 18px;
  border:1.5px solid rgba(255,255,255,.4);color:#fff;text-decoration:none;
  font-weight:700;font-size:14.6px;white-space:nowrap}
.bant-bag:hover{border-color:#fff;background:rgba(255,255,255,.1)}
.bant-bag-koyu{border-color:var(--cizgi);color:var(--mavi-koyu)}
.bant-bag-koyu:hover{border-color:var(--kirmizi);background:var(--kagit)}

/* ---------------------------------------------------------------- logolar
   🔴 PLAKA YÜKSEKLİĞİ PİKSEL. Yüzde `max-height` görseli KIRPMIYOR —
      sakaryamadeniyaglar'da kutu 84 px iken görsel 174.9 px çıkmıştı. */
.logo-duvar{list-style:none;margin:0;padding:0;display:grid;gap:10px;
  grid-template-columns:repeat(auto-fill,minmax(130px,1fr))}
.logo-duvar-sik{grid-template-columns:repeat(auto-fill,minmax(118px,1fr))}
.logo-plaka{
  display:grid;place-items:center;background:#fff;border:1px solid var(--cizgi);
  border-radius:var(--yuvarlak);padding:10px;
  transition:border-color .15s ease,transform .15s ease;
}
.logo-plaka:hover{border-color:var(--kirmizi);transform:translateY(-2px)}
/* 🔴 `width:100%` DEĞİL `width:auto`. `contain` ile görsel kutunun içinde
   mektup kutusu gibi duruyor; kutuyu %100 yapınca <img> KUTUSU plaka kadar
   genişliyor ve büyütme ölçümü yanlış okuyor — 375 px'te neutec logosu
   2.13 çıktı, gerçek oran 0.61'di. Genişlik oranla üretiliyor, yükseklik
   PİKSEL (yüzde `max-height` kırpmıyor — AGENTS.md). */
.logo-plaka img{width:auto;max-width:100%;height:56px;object-fit:contain}
.logo-plaka-buyuk img{height:76px}

/* 🔴 DOKUZ LOGO, SEKİZ SÜTUN = ÖKSÜZ SATIR. `auto-fill` 1180 px'te sekiz
   sütun üretiyordu ve dokuzuncu logo tek başına alta düşüyordu. Izgara
   yerine esnek sıra: son satır boş kalmıyor. */
.logo-duvar-genis{display:flex;flex-wrap:wrap;gap:10px}
.logo-duvar-genis .logo-plaka{flex:1 1 118px;min-width:118px;padding:12px 10px;border:0}
.logo-duvar-genis .logo-plaka img{height:70px}

/* ARKEN rozetinin iç sayfadaki plakası (kaynak 190x74, ekranda da aynı). */
.bayi-plaka{display:inline-block;margin:0 0 1em;padding:10px 16px;background:#fff;
  border:1px solid var(--cizgi);border-left:3px solid var(--kirmizi)}
.bayi-plaka img{width:190px;height:74px;object-fit:contain}

/* ========================================================== ALAN DİZİNİ
   🔴 DÖRT KART YERİNE NUMARALI DİZİN. Kart ızgarası kitin her sitesinde
      var; alanlar burada bir künye tablosu gibi, 01-04 numaralı satırlar
      hâlinde duruyor.
   🔴 Kare sütunu 300 px, kaynak 444x296 → cover oranı
      max(300/444, 200/296) = 0.68. Büyütme yok. */
.dizin-bolum{padding:44px 0 10px}
.dizin{display:grid}
.dizin-satir{
  display:grid;gap:4px 22px;grid-template-columns:66px minmax(0,1fr) 300px;
  align-items:center;padding:20px 14px 20px 0;text-decoration:none;color:inherit;
  border-top:1px solid var(--cizgi);position:relative;
  transition:background .16s ease;
}
.dizin-satir:last-child{border-bottom:1px solid var(--cizgi)}
.dizin-satir::before{content:"";position:absolute;left:0;top:-1px;bottom:0;width:0;
  background:var(--kirmizi);transition:width .18s ease}
.dizin-satir:hover{background:var(--kagit)}
.dizin-satir:hover::before{width:4px}
.dizin-no{display:block;font-size:30px;font-weight:800;line-height:1;color:#bcc8d6;
  letter-spacing:-.03em;padding-left:14px;transition:color .16s ease}
.dizin-satir:hover .dizin-no{color:var(--kirmizi)}
.dizin-govde{display:block}
.dizin-govde strong{display:block;font-size:clamp(17px,1.7vw,21px);font-weight:780;
  color:var(--mavi-koyu);margin-bottom:4px;letter-spacing:-.015em}
.dizin-govde em{display:block;font-style:normal;color:var(--gri);font-size:15px;line-height:1.5}
.dizin-etiket{display:flex;flex-wrap:wrap;gap:5px;margin-top:11px}
.dizin-etiket span{display:inline-block;padding:3px 9px;background:var(--mavi-acik);
  color:var(--mavi-koyu);font-size:12px;font-weight:650}
.dizin-kare{display:block;overflow:hidden;background:var(--cizgi)}
.dizin-kare img{width:100%;height:100%;aspect-ratio:3/2;object-fit:cover;
  transition:transform .4s ease}
.dizin-satir:hover .dizin-kare img{transform:scale(1.04)}

@media (max-width:959px){
  .dizin-satir{grid-template-columns:56px minmax(0,1fr);padding:18px 0}
  .dizin-no{font-size:25px;padding-left:10px}
  /* 🔴 Kare tam satıra iniyor ama TAVANI VAR: 444 px kaynak, kutu 470 px'i
     geçerse büyütme eşiği aşılır. */
  .dizin-kare{grid-column:1/-1;max-width:470px;margin-top:14px;margin-left:56px}
}
@media (max-width:519px){
  .dizin-kare{margin-left:0}
}

/* ============================================================= UYGULAMA RAYI
   🔴 YATAY RAY, IZGARA DEĞİL. Jeneratör/UPS kareleri 600x450; ızgaraya
      konsa sayfada dördüncü bir kart duvarı olurdu.
      Göz 300 px → 300/600 = 0.50, hiçbir kare büyümüyor. */
.ray-bolum{padding:40px 0 6px}
.ray{list-style:none;margin:16px 0 0;padding:2px 0 18px;display:flex;gap:12px;
  overflow-x:auto;scroll-snap-type:x proximity;
  padding-inline:max(16px,calc((100% - var(--olcu))/2));
  scrollbar-width:thin}
.ray li{flex:0 0 300px;scroll-snap-align:start}
.ray figure{margin:0;background:#fff;border:1px solid var(--cizgi);overflow:hidden}
.ray img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}
.ray figcaption{padding:10px 12px;font-size:13.4px;color:var(--gri);line-height:1.45}
@media (max-width:519px){ .ray li{flex:0 0 240px} }

/* ------------------------------------------------------------ bölümler */
.ic{padding:44px 0}
.ic-gri{background:var(--kagit);border-block:1px solid var(--cizgi)}
.bolum-basi{margin:0 0 6px;color:var(--mavi-koyu)}
.bolum-girise{margin:0 0 20px;color:var(--gri);max-width:72ch}
.bolum-basi + .alan-izgara,.bolum-basi + .logo-duvar,
.bolum-basi + .galeri-mozaik,.bolum-basi + .galeri-izgara,
.bolum-basi + .hizmet-dizin,.bolum-basi + .referans-izgara,
.bolum-basi + .dizin{margin-top:20px}
.kucuk-not{margin:18px 0 0;font-size:13.5px;color:var(--gri);max-width:80ch}

/* ====================================================== KAYAN MARKA ŞERİDİ
   🔴 LİSTE İKİ KEZ BASILIYOR. Sonsuz kayma `translateX(-50%)` ile oluyor ve
      bu yalnız raydaki içerik tam olarak İKİ ÖZDEŞ KOPYAYSA dikişsiz
      kapanır; tek kopyayla şerit her turun sonunda görünür biçimde zıplar
      (AGENTS.md, 41klima). İkinci kopya `aria-hidden`, `alt=""`.
   🔴 `prefers-reduced-motion`DA ŞERİT SARAR, KESİLMEZ: animasyon kapanır,
      ikinci kopya gizlenir, ray `flex-wrap` ile sarar. Animasyonu kapatıp
      rayı olduğu gibi bırakmak içeriğin yarısını ekran dışında bırakırdı. */
.ortak-bolum{padding:42px 0 10px}
.kayan{overflow:hidden;margin-top:18px;padding:14px 0;
  border-block:1px solid var(--cizgi);background:var(--kagit)}
.kayan-ray{display:flex;width:max-content}
.kayan-liste{display:flex;gap:10px;list-style:none;margin:0;padding:0 5px}
.kayan-liste li{flex:0 0 134px;height:74px;display:grid;place-items:center;
  background:#fff;border:1px solid var(--cizgi)}
.kayan-liste img{width:auto;max-width:100%;height:52px;object-fit:contain}
@keyframes kay{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:no-preference){
  .kayan-ray{animation:kay 52s linear infinite}
  .kayan:hover .kayan-ray{animation-play-state:paused}
}
@media (prefers-reduced-motion:reduce){
  .kayan-ray{width:auto;flex-wrap:wrap}
  .kayan-liste{flex-wrap:wrap;justify-content:center}
  .kayan-liste[aria-hidden]{display:none}
}

/* ------------------------------------------------------------ alan kartı
   (hizmetler.php ve alan.php kullanıyor — ana sayfada artık dizin var)
   🔴 KART `<a>` OLDUĞU İÇİN İÇİNE `<div>` KONAMIYOR, `<span>` konuyor ve
      span varsayılanı `inline`. Dolgu ve üst çizgi bozulmasın diye
      `display:block` ZORUNLU (AGENTS.md, üç ayrı sitede düştü).
   🔴 EN KÜÇÜK SÜTUN 240 px: kaynak kare 444 px, eşik 1.15 → sütun 510 px'i
      geçemez. */
.alan-izgara{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}
.alan-izgara-genis{grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}
.alan-kart{
  display:flex;flex-direction:column;background:#fff;border:1px solid var(--cizgi);
  border-radius:var(--yuvarlak);overflow:hidden;text-decoration:none;color:inherit;
  transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease;
}
.alan-kart:hover{transform:translateY(-3px);box-shadow:var(--golge);border-color:var(--kirmizi)}
/* 🔴 `flex:none` — sütun flex'te görsel kutusu ezilip `<img>` taşıyordu
   (sakaryaklima'da 246.5 → 197.5 ölçüldü). */
.alan-kare{display:block;flex:none;overflow:hidden;background:var(--cizgi)}
.alan-kare img{width:100%;height:auto;aspect-ratio:444/296;object-fit:cover;
  transition:transform .4s ease}
.alan-kart:hover .alan-kare img{transform:scale(1.04)}
.alan-govde{display:block;padding:16px 17px 18px}
.alan-govde strong{display:block;font-size:17.5px;font-weight:750;color:var(--mavi-koyu);
  margin-bottom:5px}
.alan-govde em{display:block;font-style:normal;color:var(--gri);font-size:14.5px;line-height:1.55}
.alan-liste{display:flex;flex-wrap:wrap;gap:5px;margin-top:12px}
.alan-liste span{display:inline-block;padding:3px 9px;
  background:var(--mavi-acik);color:var(--mavi-koyu);font-size:12px;font-weight:650}

/* --------------------------------------------------------------- bant
   🔴 Arka plan karesi BİLEREK bulanık: kaynak 923 px, bant tam genişlik.
      Keskinlik gerekmiyor; yazı okunurluğu için zaten örtü var.
      Karede GÖMÜLÜ YAZI YOK — kırpılarak atıldı (AGENTS.md madde 5). */
.bant{
  margin:40px 0 0;padding:58px 0;position:relative;isolation:isolate;color:#fff;
  background-image:linear-gradient(rgba(6,36,70,.84),rgba(6,36,70,.9)),var(--bant);
  background-size:cover;background-position:center;background-attachment:fixed;
  border-top:3px solid var(--kirmizi);
}
.bant-ic blockquote{margin:0;max-width:62ch}
.bant-ic p{font-size:clamp(17px,2vw,22px);line-height:1.55;font-weight:500;margin:0 0 14px}
.bant-ic cite{font-style:normal;font-size:14px;font-weight:700;letter-spacing:.04em;
  color:#bcd9f5}
@media (max-width:899px){.bant{background-attachment:scroll}}

/* ------------------------------------------------------------- iç sayfalar */
.sayfa-basi{padding:28px 0 24px;background:var(--kagit);
  border-bottom:1px solid var(--cizgi)}
.sayfa-basi h1{margin:0;color:var(--mavi-koyu)}
.kirinti{font-size:13.5px;color:var(--gri);margin-bottom:10px;display:flex;flex-wrap:wrap;gap:6px}
.kirinti a{color:var(--gri);text-decoration:none}
.kirinti a:hover{text-decoration:underline;color:var(--mavi)}
/* `.ustu` = `sayfa_basi()`in üst etiketi; `.tab` ile aynı eğik dil. */
.ustu{position:relative;z-index:0;display:inline-block;margin:0 0 12px;padding:6px 16px;
  color:#fff;font-size:12px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;
  line-height:1.35}
.ustu::before{content:"";position:absolute;inset:0;z-index:-1;
  background:var(--kirmizi-koyu);transform:skewX(-12deg)}
.girise{margin:12px 0 0;color:var(--gri);max-width:74ch;font-size:16.5px}

.alan-cipalar{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:26px}
.alan-cipalar a{display:inline-flex;align-items:center;min-height:44px;padding:0 13px;
  border:1px solid var(--cizgi);background:#fff;font-size:14px;
  font-weight:650;text-decoration:none;color:var(--mavi-koyu)}
.alan-cipalar a:hover{border-color:var(--kirmizi);background:var(--kagit)}

.hizmet-yigin{display:grid;gap:14px}
.hizmet{display:grid;gap:18px;grid-template-columns:160px minmax(0,1fr);
  background:#fff;border:1px solid var(--cizgi);border-left:3px solid var(--kirmizi);
  border-radius:var(--yuvarlak);
  padding:18px;scroll-margin-top:calc(var(--serit-h) + 16px)}
/* 🔴 Kaynak 160x120; ekranda da 160x120, büyütme YOK. */
.hizmet-kare{display:block;flex:none}
.hizmet-kare img{width:160px;height:120px;object-fit:cover}
.hizmet-metin h2{font-size:clamp(18px,1.9vw,22px);margin-bottom:9px;color:var(--mavi-koyu)}
.hizmet-metin p{margin:0 0 .8em;color:#2c3744;font-size:15.8px}
.hizmet-metin p:last-child{margin-bottom:0}
.rozet{display:inline-block;margin-top:4px !important;padding:6px 12px;
  background:var(--mavi-acik);color:var(--mavi-koyu);font-size:13.5px;font-weight:700}
/* 🔴 DAR EKRANDA KARE GERİLMİYOR: 160 px kaynak 343 px'e çıkarsa 375'te
   1.91 büyütme olur (ölçüldü). Kare her ekranda 160x120 kalıyor. */
@media (max-width:659px){
  .hizmet{grid-template-columns:1fr}
  .hizmet-kare img{width:160px;height:120px}
}

.hizmet-dizin{list-style:none;margin:0;padding:0;display:grid;gap:10px;
  grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.hizmet-dizin a{display:block;padding:14px 16px;background:#fff;border:1px solid var(--cizgi);
  border-radius:var(--yuvarlak);text-decoration:none;color:inherit;
  transition:border-color .15s ease}
.hizmet-dizin a:hover{border-color:var(--kirmizi)}
.hizmet-dizin strong{display:block;color:var(--mavi-koyu);font-size:15.5px;margin-bottom:3px}
.hizmet-dizin em{display:block;font-style:normal;color:var(--gri);font-size:13.8px}

/* ------------------------------------------------------------- referans */
.referans-izgara{list-style:none;margin:0;padding:0;display:grid;gap:14px;
  grid-template-columns:repeat(auto-fill,minmax(190px,1fr))}
.referans-kart{display:grid;gap:10px;justify-items:center;text-align:center;
  background:#fff;border:1px solid var(--cizgi);border-radius:var(--yuvarlak);padding:16px}
.referans-kart .logo-plaka{border:0;padding:0;width:100%}
.referans-kart strong{font-size:15px;color:var(--mavi-koyu)}

/* --------------------------------------------------------------- galeri */
.galeri-mozaik{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}
.galeri-mozaik figure{margin:0;overflow:hidden;background:var(--cizgi)}
.galeri-mozaik img{width:100%;height:100%;aspect-ratio:444/296;object-fit:cover;
  transition:transform .4s ease}
.galeri-mozaik figure:hover img{transform:scale(1.04)}
/* 🔴 GENİŞ GÖZE KAYNAĞI 923 px OLAN KARE KONUYOR; `:nth-child` ile
   seçilseydi oraya 444 px'lik bir kare düşebilir ve 1280'de 1.32 büyütme
   olurdu (ölçüldü). Seçim PHP tarafında, sınıf `.genis`. */
@media (min-width:760px){
  .galeri-mozaik figure.genis{grid-column:span 2}
}

.galeri-izgara{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.galeri-izgara figure{margin:0;background:#fff;border:1px solid var(--cizgi);
  border-radius:var(--yuvarlak);overflow:hidden}
.galeri-izgara img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}
.galeri-izgara figcaption{padding:11px 13px;font-size:14px;color:var(--gri)}

/* --------------------------------------------------------------- yazı */
.yazi-duzen{display:grid;gap:30px;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);
  align-items:start}
.yazi h2{margin-top:28px;color:var(--mavi-koyu)}
.yazi h2:first-child{margin-top:0}
.yazi p{color:#2c3744;max-width:72ch}
.isaretli{margin:0;padding-left:1.1em;color:#2c3744}
.isaretli li{margin-bottom:.5em}
.isaretli li::marker{color:var(--kirmizi)}
.adim-liste{margin:0;padding-left:1.2em;color:#2c3744;font-size:15px}
.adim-liste li{margin-bottom:.45em}

.yan{display:grid;gap:16px}
.yan-kare{margin:0;overflow:hidden;background:var(--cizgi);max-width:470px}
.yan-kare img{width:100%;height:auto;aspect-ratio:444/296;object-fit:cover}
.yan-kare figcaption{padding:10px 13px;font-size:13.5px;color:var(--gri);background:#fff}
.yan-kutu{background:#fff;border:1px solid var(--cizgi);border-left:3px solid var(--kirmizi);
  border-radius:var(--yuvarlak);padding:18px}
.yan-kutu h3{margin-top:0;color:var(--mavi-koyu)}
.yan-kutu p:last-child{margin-bottom:0}
.kunye-liste{margin:0;display:grid;grid-template-columns:auto minmax(0,1fr);gap:6px 14px;
  font-size:14.8px}
.kunye-liste dt{font-weight:750;color:var(--gri)}
.kunye-liste dd{margin:0;color:#2c3744}
@media (max-width:899px){.yazi-duzen{grid-template-columns:1fr}}

/* -------------------------------------------------------------- iletişim */
.iletisim-duzen{display:grid;gap:28px;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);
  align-items:start}
.iletisim-bilgi{display:grid;gap:16px}
.iletisim-liste{list-style:none;margin:0 0 18px;padding:0;display:grid;gap:9px;font-size:15.2px}
.iletisim-liste li{display:grid;grid-template-columns:78px minmax(0,1fr);gap:8px}
.sol{color:var(--gri);font-size:13.5px;font-weight:700}
.kunye-eylem{display:flex;flex-wrap:wrap;gap:10px}
@media (max-width:899px){.iletisim-duzen{grid-template-columns:1fr}}

/* ----------------------------------------------------------------- form */
.form-izgara{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}
.alan-genis{grid-column:1/-1}
.alan label{display:block;font-size:14px;font-weight:700;margin-bottom:5px;color:var(--mavi-koyu)}
.alan label em{display:block;font-style:normal;font-weight:400;font-size:12.8px;color:var(--gri);
  margin-top:2px}
.zorunlu{color:var(--kirmizi)}
.alan input,.alan select,.alan textarea{
  width:100%;min-height:48px;padding:11px 13px;border:1.5px solid var(--cizgi);
  border-radius:var(--yuvarlak);background:#fff;color:var(--murekkep);font:inherit;font-size:16px;
}
.alan textarea{min-height:130px;resize:vertical}
.alan input:focus,.alan select:focus,.alan textarea:focus{border-color:var(--mavi);outline:none;
  box-shadow:0 0 0 3px rgba(7,117,214,.18)}
.form button{margin-top:18px}
.form-not{margin:12px 0 0;font-size:13px;color:var(--gri)}
.balkabi{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-hata{background:#fdeaea;border:1px solid #f3b9bb;border-radius:var(--yuvarlak);
  padding:13px 16px;margin-bottom:18px;color:#8a1118;font-size:14.5px}
.form-hata ul{margin:6px 0 0;padding-left:1.1em}
.form-tamam{background:#e8f6ed;border:1px solid #aadcbd;border-radius:var(--yuvarlak);
  padding:18px 20px;font-size:16px}

/* ----------------------------------------------------------------- çağrı */
.cagri{background:var(--mavi-koyu);color:#fff;padding:40px 0;margin-top:44px;
  border-top:3px solid var(--kirmizi)}
.cagri-ic{display:flex;flex-wrap:wrap;gap:22px;align-items:center;justify-content:space-between}
.cagri h2{margin:0 0 6px;color:#fff}
.cagri p{margin:0;color:#c6ddf3;max-width:56ch}
.cagri-dugmeler{display:flex;flex-wrap:wrap;gap:10px}
.cagri .dugme-ikincil{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}
.cagri .dugme-ikincil:hover{border-color:#fff;background:rgba(255,255,255,.08)}

/* ------------------------------------------------------------------- alt */
.alt{background:var(--mavi-gece);color:#d4e4f4;padding:40px 0 14px;font-size:15px}
.alt a{color:#d4e4f4;text-decoration:none}
.alt a:hover{color:#fff;text-decoration:underline}
.alt h4{color:#fff;font-size:13px;letter-spacing:.12em;text-transform:uppercase;
  margin-bottom:12px;padding-bottom:7px;border-bottom:2px solid var(--kirmizi);
  display:inline-block}
.alt-duzen{display:grid;gap:26px;grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
.alt-liste{list-style:none;margin:0;padding:0;display:grid;gap:7px;font-size:14.5px;line-height:1.5}
.alt-kimlik p{color:#a9c6e2;font-size:14.5px;margin:0}
/* Logolar beyaz zeminli; koyu altbilgide plakaya oturuyorlar — yoksa
   kenarları beyaz kutu gibi çıkar (AGENTS.md: "logo koyu zeminde kaybolur"). */
.alt-marka{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:14px}
.alt-logo{display:inline-block;background:#fff;border-radius:var(--yuvarlak);padding:8px 10px}
.alt-logo img{width:208px;height:49px;object-fit:contain}
.alt-bayi{display:inline-block;background:#fff;border-radius:var(--yuvarlak);padding:6px 9px}
.alt-bayi img{width:118px;height:46px;object-fit:contain}
.alt-son{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;
  margin-top:28px;padding-top:12px;border-top:1px solid rgba(255,255,255,.14);
  font-size:13.5px;color:#9fbcd9}
@media (max-width:519px){.alt-logo img{width:176px;height:42px}}

/* ----------------------------------------------------------------- yüzen */
.yuzen{position:fixed;right:14px;bottom:14px;z-index:35;display:flex;flex-direction:column;gap:10px}
.yuzen a{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;
  color:#fff;box-shadow:0 6px 18px rgba(17,22,29,.26);text-decoration:none}
.yuzen .ara{background:var(--kirmizi-koyu)}
.yuzen .y-wa{background:#1fa855}
@media (min-width:900px){.yuzen .ara{display:none}}

/* ------------------------------------------------------------- hareket
   🔴 BELİRME JAVASCRIPT'E BAĞLANMAZ. `opacity:0` + JS deseni dört kez
      bozuldu ve sayfa bembeyaz kaldı (feedback-gorunurluk-betige-baglanmaz).
      Burada CSS `animation-timeline: view()`; desteklemeyen tarayıcıda
      @supports bloğuna hiç girilmiyor, içerik normal görünüyor. */
@supports (animation-timeline: view()){
  @media (prefers-reduced-motion: no-preference){
    @keyframes bel-gir{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
    .bel{animation:bel-gir linear both;animation-timeline:view();
      animation-range:entry 0% entry 42%}
  }
}
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;
    transition-duration:.001ms !important;scroll-behavior:auto !important}
  .dugme:hover,.alan-kart:hover{transform:none}
  .bant{background-attachment:scroll}
}

/* ------------------------------------------------------------- büyüteç */
.buyutec figure{cursor:zoom-in}
.kutu{position:fixed;inset:0;z-index:80;background:rgba(6,20,36,.94);display:none;
  align-items:center;justify-content:center;padding:20px}
.kutu.acik{display:flex}
.kutu img{max-width:min(100%,1100px);max-height:82vh;width:auto;height:auto}
.kutu-kapat,.kutu-ok{position:absolute;display:grid;place-items:center;width:48px;height:48px;
  border:0;border-radius:50%;background:rgba(255,255,255,.14);color:#fff;font-size:24px;
  cursor:pointer;line-height:1}
.kutu-kapat{top:16px;right:16px}
.kutu-ok.onceki{left:16px;top:50%;transform:translateY(-50%)}
.kutu-ok.sonraki{right:16px;top:50%;transform:translateY(-50%)}
.kutu-sayac{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);color:#cfe1f3;
  font-size:14px;font-weight:600}

/* ======================================================================
   DOKUNMA HEDEFİ — 375 px'te ölçülerek eklendi (eşik 44x44, AGENTS.md).
   Altbilgi "sadece bir liste" değil: içinde telefon ve e-posta var.
   ====================================================================== */
.alt-liste{gap:0}
.alt-liste a{display:inline-flex;align-items:center;min-height:44px}
.alt-liste li{display:flex;align-items:center;gap:7px;min-height:44px}
.kirinti{align-items:center}
.kirinti a{display:inline-flex;align-items:center;min-height:44px}
.iletisim-liste a,.kunye-liste dd a{display:inline-flex;align-items:center;min-height:44px}
.iletisim-liste li{align-items:center;min-height:44px}
.kunye-liste{align-items:center}
.isaretli a,.kucuk-not a{display:inline-flex;align-items:center;min-height:44px}
.isaretli li{margin-bottom:0}
/* 🔴 Bal kabı alanı (`.balkabi input`) ölçüme takılır ama GERÇEK HEDEF
   DEĞİL: `left:-9999px` ile ekran dışında, `tabindex="-1"`, `aria-hidden`. */