/* ============================================================
   escEmlak — "Modern Portal" temasi
   Renkler layout'ta :root uzerine basilir (bkz. TemaPalet).
   --p  ana renk      --p2 ana renk acik
   --a  aksan         --a2 aksan koyu
   --ink metin        --soft yumusak zemin
   ============================================================ */

:root{
  --line:#e6ecf2; --muted:#64748b; --bg:#fff;
  --r:14px;
  --sh:0 1px 3px rgba(15,23,42,.06),0 8px 24px rgba(15,23,42,.06);
  --sh2:0 8px 30px rgba(15,23,42,.14);
  /* Navbar yuksekligi ve logo boyu birbirine bagli: logo bardan buyuk
     olamaz. Sticky yan sutunlar da bara yapismasin diye --yapisik'i
     buradan turetiyor - bar degisince elle guncellenecek sayi kalmasin. */
  --nav-h:86px; --logo-h:65px;
  --yapisik:calc(var(--nav-h) + 20px);
}

*{box-sizing:border-box;margin:0;padding:0}
body{
  font:16px/1.6 system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",sans-serif;
  color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
.wrap{max-width:1200px;margin:0 auto;padding:0 20px}

/* --- butonlar --- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;cursor:pointer;
  font:600 15px/1 inherit;padding:14px 22px;border-radius:10px;background:var(--a);color:#fff;transition:.2s}
.btn:hover{background:var(--a2);transform:translateY(-1px);color:#fff}
.btn-o{background:transparent;border:1.5px solid var(--line);color:var(--ink)}
.btn-o:hover{background:var(--soft);border-color:var(--a);color:var(--a);transform:none}
.btn-p{background:var(--p)}
.btn-p:hover{background:var(--p2)}
.btn-sm{padding:10px 16px;font-size:14px}

/* --- bolum --- */
.sec{padding:76px 0}
.sec.soft{background:var(--soft)}
.eyebrow{display:inline-block;font:700 12px/1 inherit;letter-spacing:.12em;text-transform:uppercase;color:var(--a);margin-bottom:12px}
.h2{font-size:clamp(26px,3.4vw,38px);font-weight:700;letter-spacing:-.02em;line-height:1.2}
.lead{color:var(--muted);margin-top:10px;max-width:620px}
/* Cok paragrafli tanitim yazisi tek satir gibi sikismasin. */
.hakkimizda-metin{line-height:1.75;max-width:720px}
.head-row{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:36px;flex-wrap:wrap}
.bos{text-align:center;padding:56px 20px;color:var(--muted);background:var(--soft);border-radius:var(--r)}

/* --- topbar / nav --- */
.topbar{background:var(--p);color:rgba(255,255,255,.78);font-size:13.5px}
.topbar .wrap{display:flex;justify-content:space-between;align-items:center;min-height:42px;gap:16px;flex-wrap:wrap}
.topbar b,.topbar a:hover{color:#fff}
.topbar .tb-r{display:flex;gap:18px;align-items:center}
/* Sosyal simgeler. Sabit 16px kutu: metin ("Instagram", "Facebook")
   ust barin yarisini yiyor ve dar ekranda satiri tasiriyordu. */
.tb-sim{display:grid;place-items:center;width:16px;height:16px;flex:none}
.tb-sim svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.7}
/* "Ilan Gonder" — ust barda ayirt edilsin ama gurultu yapmasin.
   Sabit dolgu ve cerceve: modul acilip kapandiginda bar yuksekligi
   degismiyor, menude kayma olmuyor. */
.tb-vurgu{border:1px solid rgba(255,255,255,.34);border-radius:999px;
  padding:4px 12px;line-height:1.4;white-space:nowrap;transition:.16s}
.tb-vurgu:hover{background:rgba(255,255,255,.14);border-color:#fff;color:#fff}
/* Cekmecede tam genislikte dugme. */
.menu-gonder .btn{width:100%;justify-content:center}
nav.ust{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.93);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
nav.ust .wrap{display:flex;align-items:center;gap:28px;min-height:var(--nav-h)}
.logo{display:flex;align-items:center;gap:10px;font-weight:800;font-size:20px;letter-spacing:-.02em}
.logo .mark{width:34px;height:34px;border-radius:9px;background:linear-gradient(135deg,var(--p),var(--a));
  display:grid;place-items:center;color:#fff;font-size:16px;flex:none}
/* Genis logolarda width:auto tek basina tasmayi engellemiyor; max-width +
   object-fit ile dar ekranda oran bozulmadan kuculsun. */
.logo img{height:var(--logo-h);width:auto;max-width:100%;object-fit:contain}
.menu{display:flex;gap:26px;margin-left:auto;font-weight:500;font-size:15px;list-style:none;align-items:center}
.menu > li{position:relative}
.menu a{display:block;padding:26px 0;border-bottom:2px solid transparent;transition:.2s}
.menu a:hover,.menu a.on{color:var(--a);border-color:var(--a)}
.menu .alt{position:absolute;top:100%;left:0;min-width:200px;background:#fff;border:1px solid var(--line);
  border-radius:10px;box-shadow:var(--sh);padding:8px;display:none;list-style:none;z-index:60}
.menu > li:hover .alt{display:block}
.menu .alt a{padding:9px 12px;border:0;border-radius:7px;font-size:14.5px}
.menu .alt a:hover{background:var(--soft)}
.nav-tel{margin-left:auto}

/* Hamburger: uc cizgi, acilinca X'e doner. Metin karakteri (☰) yerine
   span'ler — donusum animasyonu ancak boyle yapilabiliyor. */
.nav-ac{display:none;background:none;border:0;cursor:pointer;margin-left:auto;
  width:44px;height:44px;padding:10px;position:relative;z-index:70}
.nav-ac span{display:block;height:2px;width:100%;background:var(--ink);border-radius:2px;
  transition:transform .28s,opacity .18s}
.nav-ac span + span{margin-top:5px}
.nav-ac.acik span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-ac.acik span:nth-child(2){opacity:0}
.nav-ac.acik span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* Cekmece basligi ve alt iletisim bloğu yalnizca mobilde gorunur. */
.menu-bas,.menu-alt{display:none}

.menu-perde{position:fixed;inset:0;z-index:55;background:rgba(8,15,26,.5);
  opacity:0;transition:opacity .3s;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);
  /* Kapanis animasyonu suresince perde gorunmez ama hala ekranda; pointer-events
     olmadan o ~300 ms boyunca altindaki butonlarin tiklamalarini yutuyor. */
  pointer-events:none}
.menu-perde.acik{opacity:1;pointer-events:auto}

/* --- hero / slider --- */
.hero{position:relative;color:#fff;overflow:hidden}
.hero .slayt{position:relative;padding:96px 0 130px;background-size:cover;background-position:center}
.hero .slayt.varsayilan{background:linear-gradient(120deg,var(--p) 0%,var(--p2) 55%,var(--a2) 130%)}
.hero .slayt::before{content:"";position:absolute;inset:0;background:rgba(8,20,32,var(--karartma,.45))}
.hero .slayt.varsayilan::before{background:none}
.hero .slayt::after{content:"";position:absolute;inset:0;opacity:.14;
  background-image:radial-gradient(circle at 18% 22%,#fff 1.4px,transparent 1.4px),radial-gradient(circle at 78% 68%,#fff 1.4px,transparent 1.4px);
  background-size:44px 44px,64px 64px}
.hero .wrap{position:relative;z-index:2}
.hero.orta{text-align:center}
.hero.orta .hero-ic{margin:0 auto}
.hero.sag{text-align:right}
.hero h1{font-size:clamp(32px,5vw,54px);font-weight:800;letter-spacing:-.03em;line-height:1.1;max-width:17ch}
.hero.orta h1,.hero.orta p{max-width:none}
.hero p{margin-top:16px;font-size:18px;color:rgba(255,255,255,.86);max-width:52ch}
.hero-btn{margin-top:26px;display:flex;gap:12px;flex-wrap:wrap}
.hero.orta .hero-btn{justify-content:center}

/* --- arama --------------------------------------------------
   Birlesik arama cubugu: alanlarin kendi kutusu YOK, tek govde
   icinde dikey ayraclarla bolunur. Kutucuk yigini yerine tek
   parca gorunur — hover/odak alani yumusak zeminle vurgular.
   ------------------------------------------------------------ */
.arama{margin-top:38px;background:#fff;border-radius:22px;box-shadow:var(--sh2);
  padding:8px;text-align:left;color:var(--ink)}

/* Sekmeler: segment kontrolu (kaydirmali hap) */
.arama .tabs{display:inline-flex;gap:3px;margin:6px 6px 10px;padding:4px;
  background:var(--soft);border-radius:999px}
.arama .tab{padding:9px 20px;border-radius:999px;font:600 14px/1 inherit;color:var(--muted);
  cursor:pointer;border:0;background:transparent;transition:.2s;white-space:nowrap}
.arama .tab.on{background:var(--a);color:#fff;box-shadow:0 2px 8px rgba(0,0,0,.14)}
.arama .tab:not(.on):hover{color:var(--ink)}

.alanlar{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr auto;gap:2px;
  padding:0 2px 2px;align-items:stretch}

.alan{position:relative;min-width:0;display:flex;align-items:center;gap:11px;
  padding:11px 15px;border-radius:16px;transition:background .18s,box-shadow .18s}
.alan:hover{background:var(--soft)}
.alan:focus-within{background:var(--soft);box-shadow:inset 0 0 0 1.5px var(--a)}

/* Ayrac: her alanin soluna. Komsu alan vurgulaninca gizlenir ki
   yuvarlak zeminin kenarina cizgi yapismasin. */
.alan + .alan::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);
  width:1px;height:30px;background:var(--line);transition:opacity .18s}
.alan:hover::before,.alan:focus-within::before,
.alan:hover + .alan::before,.alan:focus-within + .alan::before{opacity:0}

.alan-ikon{width:19px;height:19px;flex:none;color:var(--a);stroke:currentColor;
  fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.alan-govde{min-width:0;flex:1}

.alan label{display:block;font:600 10.5px/1 inherit;letter-spacing:.09em;
  text-transform:uppercase;color:var(--muted);margin-bottom:5px;cursor:pointer}
/* display:block şart — inline-block bırakılırsa alanlar satır kutusunda
   taban çizgisine hizalanıp aşağı kayıyor ve satır gereksiz uzuyor. */
.alan input,.alan select{display:block;width:100%;border:0;background:transparent;
  padding:0;font:15px/1.25 inherit;color:var(--ink);appearance:none;
  text-overflow:ellipsis;white-space:nowrap;overflow:hidden}
/* Dokunma hedefi. Select yalnizca 19px'lik yazi satiri kadardi; kutunun
   bos kalan yerine basinca hicbir sey olmuyordu, ozellikle mobilde secim
   yapmak zordu. Negatif margin ile yerlesimi bozmadan tiklanabilir alani
   buyutuyoruz — etiketin "for" bagi zaten var, o da aciyor. */
.alan select{cursor:pointer;padding:7px 18px 7px 0;margin:-7px 0}
/* 16px alti yazi iOS'ta odaklaninca sayfayi zorla yakinlastiriyor. */
@media(max-width:900px){
  .alan select,.alan input{font-size:16px}
  .alan select{padding:11px 18px 11px 0;margin:-11px 0}
}
.alan input:focus,.alan select:focus{outline:0}
.alan input::placeholder{color:#9aa8b8}
/* NOT: bu sınıfın adı ".sec" OLMAMALI — ".sec" temada bölüm (section)
   anlamında kullanılıyor ve padding:76px 0 taşıyor. */
.alan.acilir::after{content:"";position:absolute;right:15px;bottom:17px;width:6px;height:6px;
  border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);
  transform:rotate(45deg);pointer-events:none}

.arama .btn{border-radius:16px;padding:0 28px;font-size:15.5px;gap:9px;align-self:stretch}
.arama .btn svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2;
  stroke-linecap:round;stroke-linejoin:round}

/* --- sayaclar --- */
.sayac{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border-radius:var(--r);
  overflow:hidden;margin-top:-52px;position:relative;z-index:5;box-shadow:var(--sh)}
.sayac > div{background:#fff;padding:26px 22px;text-align:center}
.sayac b{display:block;font-size:30px;font-weight:800;color:var(--p);letter-spacing:-.02em}
.sayac span{font-size:13.5px;color:var(--muted)}

/* --- kategori --- */
.kats{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.kat{background:#fff;border:1.5px solid var(--line);border-radius:var(--r);padding:24px 14px;text-align:center;transition:.22s;display:block}
.kat:hover{border-color:var(--a);transform:translateY(-4px);box-shadow:var(--sh)}
.kat .ic{width:52px;height:52px;margin:0 auto 12px;border-radius:14px;background:var(--soft);
  display:grid;place-items:center;font-size:22px;transition:.22s;color:var(--p)}
.kat:hover .ic{background:var(--a);color:#fff}
.kat b{display:block;font-size:14.5px;font-weight:650}
.kat span{font-size:12.5px;color:var(--muted)}

/* --- ilan kartlari --- */
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.grid.g2{grid-template-columns:repeat(2,1fr)}
.grid.g3{grid-template-columns:repeat(3,1fr)}

/* --- sonuç çubuğu ve görünüm seçici --- */
.sonuc-bar{display:flex;align-items:center;justify-content:space-between;gap:14px;
  margin-bottom:18px;flex-wrap:wrap}
.sonuc-adet{font-size:14.5px;color:var(--muted)}
.sonuc-adet b{color:var(--ink);font-size:16px;font-weight:700}
.gorunum{display:flex;gap:2px;background:var(--soft);border:1px solid var(--line);
  border-radius:10px;padding:3px}
.gorunum button{width:36px;height:32px;border:0;background:transparent;cursor:pointer;
  border-radius:7px;display:grid;place-items:center;color:var(--muted);transition:.16s}
.gorunum button:hover{color:var(--ink);background:#fff}
.gorunum button.on{background:var(--a);color:#fff}
.gorunum svg{width:14px;height:14px;fill:currentColor}

/* --- liste görünümü ---
   Kart normalde dikey (foto üstte). Listede yatayda: foto solda sabit
   genişlikte, içerik sağda. Kartın kendi işaretlemesi değişmiyor,
   yalnızca yerleşim. */
.grid.liste{grid-template-columns:1fr;gap:14px}
.grid.liste .kart{flex-direction:row}
.grid.liste .kart:hover{transform:none;box-shadow:var(--sh)}
.grid.liste .kart .foto{width:280px;height:auto;min-height:190px;flex:none}
.grid.liste .kart .govde{display:flex;flex-direction:column;justify-content:center}
.grid.liste .kart .alt{border-top:0;border-left:1px solid var(--line);background:transparent;
  flex-direction:column;align-items:flex-start;justify-content:center;min-width:190px}

@media(max-width:900px){
  /* Dar ekranda üç sütun okunmuyor; iki sütuna, listede tekrar dikey karta. */
  .grid.g3{grid-template-columns:repeat(2,1fr)}
  .grid.liste .kart .foto{width:190px;min-height:150px}
  .grid.liste .kart .alt{display:none}
}
@media(max-width:560px){
  .grid.g3,.grid.g2{grid-template-columns:1fr}
  .grid.liste .kart{flex-direction:column}
  .grid.liste .kart .foto{width:100%;height:210px;min-height:0}
}
.kart{background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;transition:.25s;display:flex;flex-direction:column}
.kart:hover{transform:translateY(-6px);box-shadow:var(--sh2);border-color:transparent}
.kart .foto{position:relative;height:210px;background:var(--soft);overflow:hidden}
.kart .foto img{width:100%;height:100%;object-fit:cover;transition:.4s}
.kart:hover .foto img{transform:scale(1.05)}
.kart .foto .yok{position:absolute;inset:0;display:grid;place-items:center;color:var(--muted);font-size:13px}
.rozetler{position:absolute;top:12px;left:12px;display:flex;gap:6px;z-index:2;flex-wrap:wrap}
.rozet{background:var(--a);color:#fff;font:700 11px/1 inherit;padding:7px 10px;border-radius:6px;letter-spacing:.03em}
.rozet.koyu{background:var(--p)}
.rozet.one{background:#f59e0b}
.kart .govde{padding:20px;flex:1}
.fiyat{font-size:22px;font-weight:800;color:var(--p);letter-spacing:-.02em}
.fiyat small{font-size:14px;color:var(--muted);font-weight:500}
/* Baslik en fazla iki satir. Emlak ilanlarinin basliklari cok uzun
   yaziliyor ("BAGLUM EMLAKTAN LUX YAPILI GENIS KAT SECENEKLERI MEVCUT
   OLAN EMSALI OLMAYAN DAIRE"); kirpmayinca kartlar farkli boylarda
   oluyor ve izgara dagiliyor. Tam basligi detay sayfasi gosteriyor,
   ayrica title ile uzerine gelince baloncukta cikiyor. */
.kart h3{font-size:16px;font-weight:650;margin:8px 0 6px;line-height:1.35;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
  overflow:hidden;min-height:calc(2 * 1.35em)}
.kart h3 a:hover{color:var(--a)}
.konum{font-size:13.5px;color:var(--muted)}
.ozellikler{display:flex;margin-top:16px;padding-top:16px;border-top:1px solid var(--line)}
.ozellikler > div{flex:1;text-align:center;border-right:1px solid var(--line);padding:0 4px;min-width:0}
.ozellikler > div:last-child{border-right:0}
.ozellikler b{display:block;font-size:14.5px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ozellikler span{font-size:11.5px;color:var(--muted);letter-spacing:.02em}
.kart .alt{display:flex;align-items:center;gap:10px;padding:14px 20px;background:var(--soft);border-top:1px solid var(--line)}
.avatar{width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,var(--p),var(--a));
  display:grid;place-items:center;color:#fff;font:700 12px/1 inherit;flex:none;overflow:hidden}
/* object-position ust tarafa kaydirilir: portre fotograflarinda yuz genelde
   karenin ust ucte birindedir, "center" birakilirsa daire maskesi cenenin
   altini gosterip alni kirpar. */
.avatar img{width:100%;height:100%;object-fit:cover;object-position:center 28%}
.kart .alt b{font-size:13.5px;font-weight:600;display:block}
.kart .alt small{color:var(--muted);font-size:12.5px}

/* --- projeler --- */
.projeler{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.proje{position:relative;border-radius:var(--r);overflow:hidden;min-height:260px;display:flex;align-items:flex-end;
  padding:26px;color:#fff;background:linear-gradient(135deg,var(--p2),var(--a2));background-size:cover;background-position:center}
.proje::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(8,24,38,.85),rgba(8,24,38,.05) 65%)}
.proje > div{position:relative;z-index:2}
.proje .durum{display:inline-block;background:var(--a);font:700 11px/1 inherit;padding:6px 10px;border-radius:6px;margin-bottom:10px}
.proje h3{font-size:21px;font-weight:700}
.proje p{font-size:13.5px;color:rgba(255,255,255,.82);margin-top:4px}

/* --- danismanlar --- */
.ekip{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.uye{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:26px 20px;text-align:center;transition:.22s}
.uye:hover{border-color:var(--a);box-shadow:var(--sh);transform:translateY(-4px)}
.uye .pp{width:88px;height:88px;border-radius:50%;margin:0 auto 14px;overflow:hidden;
  background:linear-gradient(135deg,var(--p),var(--a));display:grid;place-items:center;color:#fff;font:700 26px/1 inherit}
.uye .pp img{width:100%;height:100%;object-fit:cover;object-position:center 28%}
.uye b{font-size:16px;font-weight:650}
.uye .unvan{display:block;font-size:13px;color:var(--a);font-weight:600;margin-top:2px}
.uye small{display:block;font-size:12.5px;color:var(--muted);margin-top:8px}
.uye .sosyal{display:flex;justify-content:center;gap:8px;margin-top:14px}
.uye .sosyal a{width:32px;height:32px;border-radius:8px;background:var(--soft);display:grid;place-items:center;font-size:13px;transition:.2s}
.uye .sosyal a:hover{background:var(--a);color:#fff}

/* --- harita bandi --- */
.harita-band{position:relative;border-radius:18px;overflow:hidden;background:linear-gradient(135deg,var(--p),var(--p2));
  padding:52px;color:#fff;display:flex;justify-content:space-between;align-items:center;gap:36px;flex-wrap:wrap}
.harita-band::after{content:"";position:absolute;inset:0;opacity:.13;
  background-image:linear-gradient(#fff 1px,transparent 1px),linear-gradient(90deg,#fff 1px,transparent 1px);background-size:48px 48px}
.harita-band > *{position:relative;z-index:2}
.harita-band h3{font-size:29px;font-weight:750;letter-spacing:-.02em}
.harita-band p{color:rgba(255,255,255,.82);margin-top:8px;max-width:46ch}
.harita-band .btn{background:#fff;color:var(--p)}
.harita-band .btn:hover{background:var(--soft)}

/* --- footer --- */
footer.alt{background:#0b1f2e;color:#93a9b8;padding:64px 0 26px;margin-top:76px;font-size:14.5px}
.fgrid{display:grid;grid-template-columns:1.7fr 1fr 1fr 1.3fr;gap:40px}
footer.alt h4{color:#fff;font-size:15.5px;font-weight:650;margin-bottom:16px}
footer.alt ul{list-style:none;display:grid;gap:9px}
footer.alt a:hover{color:var(--a)}
footer.alt .logo{color:#fff;margin-bottom:14px}
.fbot{border-top:1px solid rgba(255,255,255,.09);margin-top:44px;padding-top:22px;
  display:flex;justify-content:space-between;font-size:13px;flex-wrap:wrap;gap:10px}

/* --- sayfa basligi --- */
.sayfa-bas{background:linear-gradient(120deg,var(--p),var(--p2));color:#fff;padding:46px 0}
.sayfa-bas h1{font-size:clamp(24px,3.2vw,34px);font-weight:750;letter-spacing:-.02em}
.sayfa-bas p{color:rgba(255,255,255,.78);margin-top:6px;font-size:15px}
.sayfa-bas .yol{font-size:13.5px;color:rgba(255,255,255,.66);margin-bottom:8px}
.sayfa-bas .yol a:hover{color:#fff}

/* --- liste duzeni: sol filtre + sag sonuclar --- */
.liste-duzen{display:grid;grid-template-columns:290px 1fr;gap:28px;align-items:start}
.filtre-ac{display:none;width:100%;margin-bottom:12px}
.filtre-govde{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:20px;position:sticky;top:var(--yapisik)}
.fgrup{margin-bottom:18px}
.fgrup h4{font:700 11.5px/1 inherit;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);margin-bottom:9px}
.fgrup input[type=text],.fgrup input[type=number],.fgrup select{
  display:block;width:100%;border:1.5px solid var(--line);border-radius:9px;padding:10px 12px;
  font:14.5px/1.3 inherit;color:var(--ink);background:#fff}
.fgrup select{appearance:none;cursor:pointer;
  background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);
  background-position:calc(100% - 16px) 18px,calc(100% - 11px) 18px;background-size:5px 5px,5px 5px;background-repeat:no-repeat;padding-right:32px}
.fgrup input:focus,.fgrup select:focus{outline:0;border-color:var(--a)}
.fgrup .ikili{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.fgrup .ipucu{display:block;margin-top:7px;font-size:12px;color:var(--muted);line-height:1.45}
.secenekler{max-height:190px;overflow-y:auto;display:grid;gap:2px;padding-right:4px}
.secenekler::-webkit-scrollbar{width:6px}
.secenekler::-webkit-scrollbar-thumb{background:var(--line);border-radius:3px}
.onay{display:flex;align-items:center;gap:9px;padding:6px 4px;border-radius:7px;cursor:pointer;font-size:14px;transition:.15s}
.onay:hover{background:var(--soft)}
.onay input{width:16px;height:16px;accent-color:var(--a);cursor:pointer;flex:none}
.temizle{display:block;text-align:center;margin-top:10px;font-size:13.5px;color:var(--muted)}
.temizle:hover{color:var(--a)}

/* --- ilan detay --- */
.detay-duzen{display:grid;grid-template-columns:1fr 350px;gap:32px;align-items:start}
.galeri{margin-bottom:28px}
.galeri-buyuk{position:relative;border-radius:var(--r);overflow:hidden;background:var(--soft);aspect-ratio:16/10}
.galeri-buyuk img{width:100%;height:100%;object-fit:cover}
.galeri-buyuk.bos-foto{display:grid;place-items:center;color:var(--muted);font-size:14.5px}
.galeri-kucuk{display:flex;gap:10px;margin-top:10px;overflow-x:auto;padding-bottom:4px;scroll-behavior:smooth}
.galeri-kucuk img{width:104px;height:74px;object-fit:cover;border-radius:9px;cursor:pointer;
  border:2px solid transparent;transition:.18s;flex:none;opacity:.62}
.galeri-kucuk img:hover{border-color:var(--a);opacity:1}
.galeri-kucuk img.on{border-color:var(--a);opacity:1}

/* --- galeri gezinme --- */
.galeri-buyuk img{cursor:zoom-in}
.g-ok{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border:0;cursor:pointer;
  border-radius:50%;background:rgba(255,255,255,.92);color:var(--ink);display:grid;place-items:center;
  box-shadow:0 2px 12px rgba(0,0,0,.22);transition:.18s;z-index:3;opacity:0}
.galeri-buyuk:hover .g-ok,.g-ok:focus-visible{opacity:1}
.g-ok:hover{background:#fff;transform:translateY(-50%) scale(1.07)}
.g-ok.onceki{left:12px}
.g-ok.sonraki{right:12px}
.g-ok svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.g-sayac{position:absolute;right:12px;bottom:12px;z-index:3;background:rgba(15,23,42,.72);color:#fff;
  font:600 12.5px/1 inherit;padding:7px 11px;border-radius:999px;letter-spacing:.02em}

/* Dokunmatikte hover yok - oklar hep gorunur.
   Genislik sorgusu da var: hover:none her ortamda guvenilir raporlanmiyor,
   dar ekranda okun gizli kalmasi kabul edilemez. */
@media(hover:none),(max-width:860px){ .g-ok{opacity:1} }

/* Mobilde galeri. Ana gorsel .wrap'in 20px'lik yan boslugu yuzunden dar
   kaliyor ve ilan vitrini zayif duruyordu; kenardan kenara aliniyor ve
   4/3'e cekiliyor - dikey alanin daha cogunu gorsel kapliyor.
   Kucuk onizlemeler 104px'te ekranin ucte birini yiyordu, 64px'e indi.
   Bu blok galeri kurallarinin SONUNDA durmali: ustte olsaydi asagidaki
   temel kurallar ezer, ozellikle .g-ok'un display'i geri gelirdi. */
@media(max-width:700px){
  /* Kenardan kenara. 100vw + translateX yerine negatif margin: vw kaydirma
     cubugunu sayip saymadigina gore degisiyor ve bazi tarayicilarda yatay
     tasma yapiyor. .wrap yan boslugu 20px, birebir onu geri aliyoruz. */
  .galeri-buyuk{margin-left:-20px;margin-right:-20px;
    border-radius:0;aspect-ratio:4/3}
  .galeri-kucuk{gap:6px;margin-top:8px;
    scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch}
  .galeri-kucuk img{width:64px;height:48px;border-radius:6px;border-width:1.5px;
    scroll-snap-align:start;opacity:.75}
  /* Oklar bilerek gizlenmiyor: ustteki kural dokunmatikte gorunur
     yapiyor, parmakla kaydirma tek basina kesfedilebilir degil. */
  .g-ok{width:38px;height:38px}
  .g-ok.onceki{left:8px}
  .g-ok.sonraki{right:8px}
}

/* --- tam ekran gorunum --- */
.g-tam{position:fixed;inset:0;z-index:9500;background:rgba(8,12,20,.94);display:none;
  align-items:center;justify-content:center;padding:28px}
.g-tam.acik{display:flex}
.g-tam img{max-width:100%;max-height:100%;object-fit:contain;border-radius:6px}
.g-tam .g-kapat{position:absolute;top:18px;right:20px;width:42px;height:42px;border:0;cursor:pointer;
  border-radius:50%;background:rgba(255,255,255,.14);color:#fff;font-size:26px;line-height:1}
.g-tam .g-kapat:hover{background:rgba(255,255,255,.26)}
.g-tam .g-ok{opacity:1;background:rgba(255,255,255,.16);color:#fff}
.g-tam .g-ok:hover{background:rgba(255,255,255,.3)}
.g-tam .g-sayac{left:50%;right:auto;transform:translateX(-50%);bottom:20px}

/* --- paylas --- */
.paylas{display:flex;gap:8px;align-items:center;margin-top:12px;flex-wrap:wrap}
.paylas .etiket-yazi{font-size:13px;color:var(--muted);margin-right:2px}
.paylas a,.paylas button{display:inline-flex;align-items:center;gap:7px;border:1.5px solid var(--line);
  background:#fff;color:var(--ink);border-radius:9px;padding:8px 13px;font:600 13.5px/1 inherit;
  cursor:pointer;transition:.16s}
.paylas a:hover,.paylas button:hover{border-color:var(--a);color:var(--a)}
.paylas svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ilan-no{font-size:13px;color:var(--muted);margin-top:10px}
.ilan-no b{color:var(--ink);font-weight:650;letter-spacing:.02em}

.blok{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:26px;margin-bottom:22px}
.blok h2{font-size:19px;font-weight:700;letter-spacing:-.01em;margin-bottom:16px}
.blok .metin{color:#334155;line-height:1.75;font-size:15.5px}

.oz-tablo{display:grid;grid-template-columns:repeat(2,1fr);gap:0 28px}
.oz-satir{display:flex;justify-content:space-between;gap:14px;padding:11px 0;border-bottom:1px solid var(--line);font-size:14.5px}
.oz-satir span{color:var(--muted)}
.oz-satir b{font-weight:650;text-align:right}

.oz-etiketler{display:flex;flex-wrap:wrap;gap:8px}
.oz-etiket{background:var(--soft);border:1px solid var(--line);border-radius:8px;padding:8px 13px;font-size:13.5px;font-weight:500}

.detay-harita{height:380px;border-radius:10px;overflow:hidden;z-index:1}

/* --- "Yakında ne var?" — harita altındaki çevre bilgisi --- */
.cevre{margin-top:18px}
.cevre h3{font-size:16px;font-weight:700;margin-bottom:4px}
.cevre-not{font-size:13px;color:var(--muted);margin-bottom:12px}
.cevre-sekme{display:flex;flex-wrap:wrap;gap:8px}
.cevre-dugme{display:inline-flex;align-items:center;gap:6px;cursor:pointer;
  border:1.5px solid var(--line);background:var(--bg);color:inherit;
  border-radius:20px;padding:8px 14px;font:600 13.5px/1 inherit;transition:.16s}
.cevre-dugme:hover{border-color:var(--a)}
.cevre-dugme.on{background:var(--a);border-color:var(--a);color:#fff}
.cevre-liste{margin-top:12px;display:grid;gap:2px}
.cevre-liste:empty{margin-top:0}
.cevre-satir{display:flex;justify-content:space-between;gap:12px;align-items:center;
  padding:9px 12px;border-radius:8px;cursor:pointer;font-size:14px;transition:.14s}
.cevre-satir:nth-child(odd){background:var(--soft)}
.cevre-satir:hover{background:var(--a);color:#fff}
.cevre-satir b{flex:none;font-size:13px;opacity:.85}
.cevre-bos{font-size:13.5px;color:var(--muted);padding:8px 0}

/* yan sutun */
.detay-yan{position:sticky;top:var(--yapisik);display:grid;gap:18px}
.fiyat-kart{background:linear-gradient(135deg,var(--p),var(--p2));color:#fff;border-radius:var(--r);padding:24px}
.fiyat-kart .fiyat{font-size:29px;font-weight:800;color:#fff;letter-spacing:-.02em}
.fiyat-kart .fiyat small{color:rgba(255,255,255,.75)}
.kat-etiket{display:inline-block;margin-top:10px;background:rgba(255,255,255,.18);padding:5px 11px;border-radius:6px;font-size:12.5px;font-weight:600}

.danisman-kart,.talep-kart{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:22px}
.danisman-kart .ust{display:flex;align-items:center;gap:13px;margin-bottom:16px}
.avatar.buyuk{width:52px;height:52px;font-size:18px}
.danisman-kart .ust b{display:block;font-size:15.5px;font-weight:650}
.danisman-kart .ust small{color:var(--muted);font-size:13px}
.danisman-kart .butonlar{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.danisman-kart .butonlar .btn{padding:12px;font-size:14px}
.profil-link{display:block;text-align:center;margin-top:13px;font-size:13.5px;color:var(--a);font-weight:600}
.talep-kart h3{font-size:17px;font-weight:700;margin-bottom:14px}
.talep-kart input,.talep-kart textarea{width:100%;border:1.5px solid var(--line);border-radius:9px;
  padding:11px 13px;font:14.5px inherit;color:var(--ink);margin-bottom:9px;font-family:inherit}
.talep-kart input:focus,.talep-kart textarea:focus{outline:0;border-color:var(--a)}
.uyari{padding:13px 15px;border-radius:9px;font-size:14px;line-height:1.5}
.uyari.basarili{background:#ecfdf5;color:#065f46;border:1px solid #6ee7b7}
.uyari.hata{background:#fef2f2;color:#991b1b;border:1px solid #fca5a5;margin-bottom:12px}

/* --- sekmeler (proje filtreleri) --- */
.sekmeler{display:flex;gap:8px;margin-bottom:30px;flex-wrap:wrap}
.sekmeler a{padding:10px 18px;border-radius:9px;border:1.5px solid var(--line);font-weight:600;font-size:14.5px;transition:.18s;background:#fff}
.sekmeler a:hover{border-color:var(--a);color:var(--a)}
.sekmeler a.on{background:var(--a);border-color:var(--a);color:#fff}

/* --- bilgi kartlari (hakkimizda) --- */
.kartlar-3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.bilgi-kart{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:30px 26px;transition:.22s}
.bilgi-kart:hover{border-color:var(--a);box-shadow:var(--sh);transform:translateY(-4px)}
.bilgi-kart .ic{width:54px;height:54px;border-radius:14px;background:var(--soft);display:grid;place-items:center;font-size:24px;margin-bottom:14px}
.bilgi-kart b{display:block;font-size:17px;font-weight:700;margin-bottom:6px}
.bilgi-kart p{color:var(--muted);font-size:14.5px}

/* --- iletisim --- */
.iletisim-duzen{display:grid;grid-template-columns:1fr 380px;gap:28px;align-items:start}
.iletisim-form input,.iletisim-form textarea{width:100%;border:1.5px solid var(--line);border-radius:9px;
  padding:12px 14px;font:15px inherit;font-family:inherit;color:var(--ink);margin-bottom:11px}
.iletisim-form input:focus,.iletisim-form textarea:focus{outline:0;border-color:var(--a)}
.iletisim-liste{list-style:none;display:grid;gap:0}
.iletisim-liste li{display:flex;justify-content:space-between;gap:14px;padding:12px 0;border-bottom:1px solid var(--line);font-size:14.5px}
.iletisim-liste li:last-child{border-bottom:0}
.iletisim-liste span{color:var(--muted);flex:none}
.iletisim-liste b{font-weight:650;text-align:right}
.iletisim-liste a:hover{color:var(--a)}
.iletisim-butonlar{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:16px}
.yol-tarifi{display:flex;width:100%;margin-top:9px;gap:8px}
.yol-tarifi svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.8;
  stroke-linecap:round;stroke-linejoin:round}
.ofis-harita{height:380px;border-radius:var(--r);overflow:hidden;z-index:1;border:1px solid var(--line)}

/* --- Ziyaretçi ilan gönderme formu ---
   Kendi sınıf öneki (ig-) var: public temada .alan zaten arama çubuğunun
   alanı, onu kullansaydık form paramparça görünürdü. */
.ig-form{max-width:820px;margin:0 auto}
.ig-baslik{font-size:19px;font-weight:700;margin:26px 0 14px;padding-bottom:9px;border-bottom:1px solid var(--line)}
.ig-baslik:first-child{margin-top:0}
.ig-satir{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px}
.ig-alan{margin-bottom:15px;min-width:0}
.ig-alan label{display:block;font:600 13px/1.3 inherit;margin-bottom:6px;color:var(--ink)}
.ig-alan input,.ig-alan select,.ig-alan textarea{width:100%;border:1.5px solid var(--line);border-radius:9px;
  padding:12px 14px;font:15px inherit;font-family:inherit;color:var(--ink);background:var(--bg)}
.ig-alan input:focus,.ig-alan select:focus,.ig-alan textarea:focus{outline:0;border-color:var(--a)}
.ig-alan input[type=file]{padding:10px 12px;background:var(--soft);cursor:pointer}
.ig-ipucu{display:block;font-size:12.5px;color:var(--muted);margin-top:6px;line-height:1.5}
.ig-zorunlu{color:#dc2626}
.ig-onay{display:flex;gap:10px;align-items:flex-start;font-size:14px;line-height:1.55;cursor:pointer}
.ig-onay input{width:auto;flex:none;margin-top:3px}
.ig-harita{height:300px;border-radius:10px;overflow:hidden;z-index:1;border:1.5px solid var(--line)}
.ig-gonder{width:100%;justify-content:center;padding:15px;font-size:16px}
.ig-basari{max-width:600px;margin:0 auto;text-align:center;background:var(--soft);
  border:1px solid var(--line);border-radius:var(--r);padding:44px 30px}
.ig-basari h2{font-size:23px;margin-bottom:12px}
.ig-basari p{color:var(--muted);line-height:1.65;margin-bottom:22px}

/* --- veri tablosu --- */
.tablo-sar{overflow-x:auto}
.veri-tablo{width:100%;border-collapse:collapse;font-size:14.5px;min-width:380px}
.veri-tablo th{text-align:left;padding:11px 12px;background:var(--soft);font:700 11.5px/1 inherit;
  letter-spacing:.08em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.veri-tablo td{padding:13px 12px;border-bottom:1px solid var(--line)}
.veri-tablo tr:last-child td{border-bottom:0}

/* --- harita sayfasi (sol liste + sag harita) --- */
.harita-sayfa{display:grid;grid-template-columns:380px 1fr;height:calc(100dvh - 116px);min-height:520px}
.harita-liste{display:flex;flex-direction:column;border-right:1px solid var(--line);background:#fff;min-height:0}
.harita-liste-bas{padding:16px 18px;border-bottom:1px solid var(--line);font-size:14.5px}
.harita-liste-bas b{color:var(--p)}
.harita-liste-bas small{display:block;color:var(--muted);font-size:12.5px;margin-top:3px}
.harita-liste-govde{overflow-y:auto;flex:1;min-height:0}
.mini-kart{border-bottom:1px solid var(--line);transition:.15s}
.mini-kart:hover{background:var(--soft)}
.mini-kart a{display:flex;gap:12px;padding:12px 14px}
.mini-foto{width:92px;height:70px;border-radius:8px;overflow:hidden;background:var(--soft);flex:none}
.mini-foto img{width:100%;height:100%;object-fit:cover}
.mini-govde{min-width:0}
.mini-fiyat{font-weight:800;color:var(--p);font-size:15px}
.mini-baslik{font-size:13.5px;font-weight:600;margin:2px 0;line-height:1.35;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.mini-konum{font-size:12.5px;color:var(--muted)}
.harita-alan{z-index:1}

/* Harita/liste sekmesi — yalnizca dar ekranda. Masaustunde ikisi zaten
   yan yana duruyor, sekmeye gerek yok. */
.harita-sekme{display:none;gap:2px;padding:8px 12px;background:var(--soft);
  border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}
.harita-sekme button{flex:1;border:0;cursor:pointer;background:transparent;color:var(--muted);
  font:600 14.5px/1 inherit;padding:11px;border-radius:9px;transition:.16s}
.harita-sekme button.on{background:var(--a);color:#fff}

/* --- sayfalama --- */
.sayfalama{display:flex;justify-content:center;gap:6px;margin-top:34px;flex-wrap:wrap}
.sayfalama a{min-width:40px;height:40px;padding:0 12px;display:grid;place-items:center;border:1px solid var(--line);
  border-radius:9px;font-weight:600;font-size:14.5px;background:#fff;transition:.18s}
.sayfalama a:hover{border-color:var(--a);color:var(--a)}
.sayfalama a.on{background:var(--a);border-color:var(--a);color:#fff}

/* --- sabit iletisim butonu ------------------------------------
   Her sayfada durur, site ayarindan kapatilabilir.
   Masaustu: sag altta yuvarlak butonlar.
   Mobil: ekranin altina yapisan tam genislikte cubuk.
   -------------------------------------------------------------- */
.sabit-iletisim{position:fixed;right:18px;bottom:18px;z-index:8500;display:flex;
  flex-direction:column;gap:10px;align-items:flex-end}
.si-btn{display:inline-flex;align-items:center;gap:9px;height:52px;padding:0 17px;border-radius:999px;
  color:#fff;font:650 14.5px/1 inherit;box-shadow:0 4px 18px rgba(0,0,0,.26);transition:.18s;white-space:nowrap}
.si-btn:hover{color:#fff;transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,.32)}
.si-btn svg{width:23px;height:23px;fill:currentColor;flex:none}
.si-wa{background:#25d366}
.si-wa:hover{background:#1fb457}
.si-tel{background:var(--p)}
.si-tel:hover{background:var(--p2)}

/* Masaustunde yalnizca ikon; uzerine gelince yazi acilir - koseyi mesgul etmesin. */
@media(min-width:861px){
  .si-metin{max-width:0;overflow:hidden;opacity:0;transition:max-width .22s,opacity .18s}
  .si-btn:hover .si-metin,.si-btn:focus-visible .si-metin{max-width:120px;opacity:1}
}

@media(max-width:860px){
  .sabit-iletisim{left:0;right:0;bottom:0;flex-direction:row;gap:0;align-items:stretch}
  .si-btn{flex:1;justify-content:center;height:56px;border-radius:0;box-shadow:none;font-size:15px}
  .si-btn:hover{transform:none}
  /* Cubuk icerigin uzerine binmesin. */
  body{padding-bottom:56px}
  footer.alt{margin-bottom:0}
}

/* --- responsive --- */
@media(max-width:1100px){
  .kats{grid-template-columns:repeat(3,1fr)}
  .ekip{grid-template-columns:repeat(2,1fr)}
  .harita-sayfa{grid-template-columns:320px 1fr}
}
@media(max-width:980px){
  .detay-duzen{grid-template-columns:1fr}
  .detay-yan{position:static}
  .oz-tablo{grid-template-columns:1fr}
  .iletisim-duzen,.kartlar-3{grid-template-columns:1fr}
  /* Sekmeli mod: harita ve liste ust uste degil, biri ekranin tamami.
     Eskiden liste ustte 44vh + harita altta 60vh vardi; toplam ekrani
     asiyordu ve harita sayfasina girip haritayi gormek icin kaydirmak
     gerekiyordu. */
  .harita-sekme{display:flex}
  .harita-sayfa{grid-template-columns:1fr;grid-template-rows:1fr;
    height:calc(100dvh - 164px);min-height:420px}
  .harita-liste{display:none;border-right:0;max-height:none}
  .harita-sayfa.liste-acik .harita-liste{display:flex}
  .harita-sayfa.liste-acik .harita-alan{display:none}
  .liste-duzen{grid-template-columns:1fr}
  .filtre-ac{display:block}
  .filtre-govde{display:none;position:static}
  .filtre-govde.acik{display:block}
  .topbar{display:none}
  .nav-ac{display:block}
  .nav-tel{display:none}

  /* KRITIK: backdrop-filter, icindeki position:fixed elemanlar icin KAPSAYICI
     BLOK olusturur. Blur acik kalirsa cekmece viewport'a degil navbar'a gore
     konumlanir ve yuksekligi navbar kadar (--nav-h) kalir. Mobilde blur'u
     kaldiriyoruz; zaten gorsel bir sustan ibaret, islevsel karsiligi yok. */
  /* z-index: cekmece ve perde nav'in yigilma baglami icinde kaldigi icin
     disariya karsi TEK seviye olarak davraniyorlar. Sabit iletisim butonu
     (8500) ve demo paneli (9000) acik cekmecenin uzerine binmesin diye
     nav mobilde bunlarin ustune cikariliyor. */
  nav.ust{-webkit-backdrop-filter:none;backdrop-filter:none;background:#fff;z-index:9500}

  /* --- yandan kayan menu cekmecesi ---
     Ekranin sagindan girer. display:none yerine transform kullaniliyor ki
     acilip kapanma animasyonlu olsun; kapaliyken visibility ile klavye
     odagindan da cikarilir. */
  .menu{
    position:fixed;top:0;right:0;bottom:0;left:auto;
    width:min(86vw,340px);max-width:none;
    display:flex;flex-direction:column;align-items:stretch;gap:0;
    background:#fff;box-shadow:-8px 0 40px rgba(8,15,26,.22);
    padding:0 0 24px;margin:0;z-index:60;
    overflow-y:auto;overscroll-behavior:contain;
    transform:translateX(100%);visibility:hidden;
    transition:transform .3s cubic-bezier(.4,0,.2,1),visibility .3s;
  }
  .menu.acik{transform:translateX(0);visibility:visible}

  .menu-bas{display:flex;align-items:center;justify-content:space-between;gap:12px;
    padding:18px 20px;border-bottom:1px solid var(--line);position:sticky;top:0;background:#fff;z-index:2}
  .menu-bas span{font-weight:750;font-size:16px;letter-spacing:-.01em;
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .menu-bas button{background:none;border:0;font-size:30px;line-height:1;cursor:pointer;
    color:var(--muted);padding:0 4px}
  .menu-bas button:hover{color:var(--ink)}

  .menu > li{border-bottom:1px solid var(--line)}
  .menu > li:last-child{border-bottom:0}
  .menu a{padding:15px 20px;border:0;font-size:15.5px}
  .menu a:hover,.menu a.on{background:var(--soft);border:0;color:var(--a)}

  /* Alt menuler acik listelenir - cekmecede ayrica acilir menu istenmiyor. */
  .menu .alt{position:static;display:block;border:0;box-shadow:none;
    padding:0 0 8px;background:var(--soft);border-radius:0;min-width:0}
  .menu .alt a{padding:11px 20px 11px 34px;font-size:14.5px;border-radius:0}

  .menu-alt{display:grid;gap:8px;padding:18px 20px 0;border-bottom:0 !important;margin-top:auto}
  .menu-alt .btn{width:100%}
  .alanlar{grid-template-columns:1fr 1fr}
  /* Dar ekranda ayrac dikey degil yatay olmali. */
  .alan + .alan::before{left:15px;right:15px;top:0;bottom:auto;transform:none;
    width:auto;height:1px}
  .alan:nth-child(2)::before{display:none}
  .arama .btn{grid-column:span 2;padding:15px;margin-top:4px}
  .sayac{grid-template-columns:repeat(2,1fr);margin-top:-30px}
  .grid,.grid.g2,.projeler,.fgrid{grid-template-columns:1fr}
  .sec{padding:52px 0}
  .harita-band{padding:34px}
}
@media(max-width:560px){
  .kats{grid-template-columns:repeat(2,1fr)}
  .ekip{grid-template-columns:1fr}
  .alanlar{grid-template-columns:1fr}
  .alan:nth-child(2)::before{display:block}
  .arama .btn{grid-column:span 1}
}
