/* =========================================================================
   Resimler KIRPILMADAN gösterilir (2026-10-29)
   Her resim alanı sabit bir orandadır; önerilen ölçüde yüklenen resim alanı
   birebir doldurur. Oranı farklı bir resim kesilmez: tamamı görünür, kalan
   boşluğu aynı resmin bulanık hâli doldurur.
     Ana sayfa slider masaüstü .... 1920 × 800  (12:5)
     Ana sayfa slider mobil ....... 1080 × 1920 (9:16)
     Proje / haber / kategori ..... 1600 × 1000 (16:10)
   Kullanım: <div class="img-fit" style="aspect-ratio:16/10">
               <img class="img-fit-bg" src="…" alt="" aria-hidden="true">
               <img class="img-fit-main" src="…" alt="…">
             </div>
   (app.min.css derlemesine dokunmamak için ayrı dosya.)
   ========================================================================= */
.img-fit { position: relative; overflow: hidden; background: #dfe8e2; isolation: isolate; }
.img-fit > .img-fit-bg { position: absolute; inset: -8%; width: 116%; height: 116%; max-width: none; object-fit: cover; filter: blur(22px) saturate(1.1) brightness(.9); transform: none !important; pointer-events: none; }
.img-fit > .img-fit-main { position: relative; display: block; width: 100%; height: 100%; object-fit: contain; }

/* Ana sayfa slider: masaüstünde alan resim oranında (12:5), resim hiç kesilmez */
#heroSlider .hero-img { object-fit: contain !important; object-position: center !important; }
#heroSlider .hero-img-bg { position: absolute; inset: -4%; width: 108%; height: 108%; max-width: none; object-fit: cover; filter: blur(26px) saturate(1.1) brightness(.85); pointer-events: none; }
@media (min-width: 768px) {
  #heroSlider { height: auto !important; aspect-ratio: 12 / 5; min-height: 380px !important; max-height: none !important; }
}