/* =========================================================
   PRESTİJ GAYRİMENKUL — Ana Sayfa Stil Dosyası
   ========================================================= */

/* ---------- 1. Değişkenler ---------- */
:root{
  --altin:        #C4A272;
  --altin-acik:   #D9BE96;
  --altin-koyu:   #8A6A3F;   /* metin olarak kullanılır: beyaz üzerinde 4.5:1+ (erişilebilirlik) */

  --lacivert:     #0F1721;   /* kahraman maskesi */
  --lacivert-koy: #0B121A;   /* proje paneli */
  --lacivert-krt: #192028;   /* proje kartı */
  --dip-zemin:    #151D24;   /* alt bilgi */
  --ust-zemin:    #121A20;   /* üst bar */

  --metin:        #12181F;
  --metin-orta:   #4E555C;
  --metin-soluk:  #6B7278;   /* beyaz üzerinde 4.5:1+ (erişilebilirlik); eski #838A91 */
  --cizgi:        #E9E9E7;
  --cizgi-koyu:   rgba(255,255,255,.12);
  --gri:          #F7F7F5;
  --beyaz:        #FFFFFF;

  --yazi:   'Poppins','Poppins Yedek','Segoe UI',system-ui,-apple-system,sans-serif;
  --serif:  'Playfair Display','Playfair Yedek',Georgia,'Times New Roman',serif;

  --kap-en:  1300px;
  --gecis:   .28s cubic-bezier(.4,0,.2,1);
}

/* ---------- 2. Sıfırlama ---------- */
*,*::before,*::after{ box-sizing:border-box; }
/* Kapalı off-canvas menü `position:fixed` + `translateX(100%)` ile viewport'un
   sağında duruyor. Masaüstü Chrome fixed elemanları belge kaydırma genişliğine
   katmadığı için orada sorun çıkmaz; iOS Safari ve bazı Android tarayıcıları
   katar ve sayfa yatay kayar. Kırpma HEM html HEM body'de olmalı — yalnızca
   body'de olması bu durumda yetmiyor.
   `clip` tercih edilir: `hidden`ın aksine kaydırma kapsayıcısı yaratmaz, bu
   yüzden yapışkan başlığı bozmaz. `hidden` eski tarayıcılar için yedek. */
html{
  scroll-behavior:smooth;
  -webkit-text-size-adjust:100%;
  overflow-x:hidden;
  overflow-x:clip;
}
body{
  margin:0;
  font-family:var(--yazi);
  font-size:15px;
  font-weight:400;
  line-height:1.75;
  color:var(--metin);
  background:var(--beyaz);
  overflow-x:hidden;
  overflow-x:clip;
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4{ margin:0; font-weight:600; line-height:1.25; }
p{ margin:0; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
select{ font:inherit; color:inherit; }
:focus-visible{ outline:2px solid var(--altin); outline-offset:3px; }

/* ---------- 3. Ortak parçalar ---------- */
.kap{
  width:100%;
  max-width:var(--kap-en);
  margin-inline:auto;
  padding-inline:24px;
}
.ikon{
  width:18px; height:18px;
  flex:0 0 auto;
  fill:none;
  stroke:currentColor;
  stroke-width:1.6;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.altin{ color:var(--altin-koyu); }   /* açık zeminde okunur altın; koyu zeminde aşağıdaki kural */
.acik .altin,.serif-baslik.acik .altin,.degerleme .altin,.vitrin .altin{ color:var(--altin-acik); }

/* Bölüm boşlukları — mockup ile aynı sıkı ritim */
.bolum{ padding:24px 0; }
.bolum-son{ padding-bottom:0; }

/* Bölüm başlığı satırı */
.bolum-basi{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:24px;
  margin-bottom:30px;
}
.bolum-baslik{
  font-size:clamp(22px,2.4vw,28px);
  font-weight:600;
  letter-spacing:-.01em;
}
.bolum-baslik.cizgili{ display:flex; align-items:center; gap:14px; }
.bolum-baslik.cizgili::before{
  content:'';
  width:38px; height:1px;
  background:var(--altin);
}

/* Küçük altın üst yazı */
.tepe-yazi{
  display:block;
  font-size:12px;
  font-weight:600;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--altin-koyu);
  margin-bottom:14px;
}

/* Serif başlıklar */
.serif-baslik{
  font-family:var(--serif);
  font-size:clamp(28px,3.4vw,40px);
  font-weight:500;
  line-height:1.28;
  letter-spacing:-.005em;
}
.serif-baslik.acik{ color:#fff; }

/* "Tümünü gör" bağlantısı */
.bag-ok{
  display:inline-flex; align-items:center; gap:12px;
  font-size:12px; font-weight:500;
  letter-spacing:.12em; text-transform:uppercase;
  color:var(--metin);
  white-space:nowrap;
  padding-bottom:4px;
}
.bag-ok .ikon{ width:26px; height:16px; color:var(--altin); transition:transform var(--gecis); }
.bag-ok:hover .ikon{ transform:translateX(6px); }

/* Düğmeler */
.dug{
  display:inline-flex; align-items:center; gap:14px;
  padding:15px 28px;
  font-size:12px; font-weight:500;
  letter-spacing:.12em; text-transform:uppercase;
  border:1px solid transparent;
  transition:background var(--gecis),color var(--gecis),border-color var(--gecis);
}
.dug .ikon{ width:20px; height:16px; transition:transform var(--gecis); }
.dug:hover .ikon{ transform:translateX(5px); }

.dug-koyu{ background:var(--metin); color:#fff; }
.dug-koyu:hover{ background:var(--altin); }

.dug-cerceve-acik{ border-color:rgba(255,255,255,.45); color:#fff; }
.dug-cerceve-acik:hover{ background:#fff; color:var(--metin); border-color:#fff; }

.dug-cerceve-altin{ border-color:var(--altin); color:#fff; }
.dug-cerceve-altin:hover{ background:var(--altin); color:var(--metin); }

/* Ok düğmeleri (slider) */
.oklar{ display:flex; gap:10px; }
.ok-dug{
  width:44px; height:44px;
  display:grid; place-items:center;
  border:1px solid rgba(255,255,255,.28);
  color:#fff;
  transition:background var(--gecis),border-color var(--gecis),color var(--gecis);
}
.ok-dug:hover{ background:var(--altin); border-color:var(--altin); color:var(--metin); }
.ok-dug:disabled{ opacity:.3; cursor:default; }
.ok-dug:disabled:hover{ background:none; border-color:rgba(255,255,255,.28); color:#fff; }
.ok-sade{ border-color:var(--cizgi); color:var(--metin-soluk); }
.ok-sade:hover{ background:var(--metin); border-color:var(--metin); color:#fff; }
.ok-sade:disabled:hover{ background:none; border-color:var(--cizgi); color:var(--metin-soluk); }

/* Slider noktaları */
.noktalar{ display:flex; gap:7px; align-items:center; }
.noktalar button{
  width:16px; height:3px;
  background:rgba(255,255,255,.25);
  transition:background var(--gecis),width var(--gecis);
}
.noktalar button.etkin{ width:22px; background:var(--altin); }

/* =========================================================
   4. ÜST BAR
   ========================================================= */
.ust-bar{
  background:var(--ust-zemin);
  color:rgba(255,255,255,.78);
  font-size:13px;
}
.ust-bar-ic{ display:flex; align-items:center; justify-content:space-between; gap:20px; padding-block:14px; }
.ust-bilgi{ display:flex; align-items:center; gap:34px; flex-wrap:wrap; }
.ust-bilgi span,.ust-bilgi a{ display:inline-flex; align-items:center; gap:10px; }
.ust-bilgi .ikon{ width:15px; height:15px; color:var(--altin); }
.ust-bilgi a:hover{ color:#fff; }
.ust-sosyal{ display:flex; align-items:center; gap:22px; }
.ust-sosyal a{ color:rgba(255,255,255,.8); transition:color var(--gecis); }
.ust-sosyal a:hover{ color:var(--altin); }
.ust-sosyal .ikon{ width:16px; height:16px; }

/* =========================================================
   5. ÜST MENÜ
   ========================================================= */
.baslik{
  position:sticky; top:0; z-index:60;
  background:#fff;
  transition:box-shadow var(--gecis),padding var(--gecis);
}
.baslik.kaydi{ box-shadow:0 6px 26px rgba(15,23,33,.09); }
.baslik-ic{
  display:flex; align-items:center; justify-content:space-between; gap:28px;
  min-height:104px;
  transition:min-height var(--gecis);
}
.baslik.kaydi .baslik-ic{ min-height:82px; }

/* Logo */
.logo{ display:inline-flex; align-items:center; gap:14px; flex:0 0 auto; }
.logo-ikon{
  width:40px; height:44px;
  fill:var(--altin); stroke:none;
}
.logo-yazi{ display:flex; flex-direction:column; line-height:1; }
.logo-yazi strong{ font-size:25px; font-weight:600; letter-spacing:.055em; color:var(--metin); }
.logo-yazi em{
  font-style:normal; font-size:9px; font-weight:400;
  letter-spacing:.34em; color:var(--metin-soluk); margin-top:6px;
}
.logo-acik .logo-yazi strong{ color:#fff; }
.logo-acik .logo-yazi em{ color:rgba(255,255,255,.55); }

/* Görsel logo (müşteri amblemi + tam logo) */
.logo-amblem{ height:60px; width:auto; display:block; transition:height var(--gecis); }
.baslik.kaydi .logo-amblem{ height:50px; }
.dip-logo{ display:inline-block; }
.dip-logo img{ width:220px; max-width:100%; height:auto; display:block; }

/* EİDS "onaylı ilan" rozeti (kart + detay) */
.rozet-eids{
  display:inline-flex; align-items:center; gap:6px;
  margin-top:10px; padding:5px 9px;
  border:1px solid var(--altin); background:#fff; color:var(--altin-koyu);
  font-size:10.5px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; line-height:1;
}
.rozet-eids .ikon{ width:14px; height:14px; color:var(--altin); }
.rozet-eids img{ height:18px; width:auto; display:block; }

/* Menü */
.menu-liste{ display:flex; align-items:center; gap:26px; }
.menu-liste > li{ position:relative; }
.menu-liste > li > a{
  display:inline-flex; align-items:center; gap:6px;
  font-size:12.5px; font-weight:500;
  letter-spacing:.07em; text-transform:uppercase;
  color:var(--metin);
  padding:12px 0;
  transition:color var(--gecis);
}
.menu-liste > li > a:hover{ color:var(--altin); }
.menu-liste > li > a.etkin{ font-weight:600; }
.menu-liste .ok{ width:14px; height:14px; stroke-width:2; }

.alt-menu{
  position:absolute; top:100%; left:-18px;
  min-width:216px;
  background:#fff;
  border-top:2px solid var(--altin);
  box-shadow:0 18px 40px rgba(15,23,33,.13);
  padding:8px 0;
  opacity:0; visibility:hidden;
  transform:translateY(10px);
  transition:opacity var(--gecis),transform var(--gecis),visibility var(--gecis);
}
.alt-var:hover > .alt-menu,.alt-var:focus-within > .alt-menu{
  opacity:1; visibility:visible; transform:translateY(0);
}
.alt-menu a{
  display:block; padding:10px 22px;
  font-size:14px; color:var(--metin-orta);
  transition:color var(--gecis),background var(--gecis),padding var(--gecis);
}
.alt-menu a:hover{ color:var(--altin); background:var(--gri); padding-left:28px; }

/* Sağ blok */
.baslik-sag{ display:flex; align-items:center; gap:24px; flex:0 0 auto; }
.tel{ display:inline-flex; align-items:center; gap:12px; }
.tel .ikon{ width:21px; height:21px; color:var(--metin); stroke-width:1.5; }
.tel span{ display:flex; flex-direction:column; line-height:1.2; }
.tel strong{ font-size:16px; font-weight:600; letter-spacing:.005em; }
.tel em{
  font-style:normal; font-size:10px; font-weight:400;
  letter-spacing:.13em; text-transform:uppercase; color:var(--metin-soluk); margin-top:3px;
}
.menu-ac,.menu-kapat,.menu-alt{ display:none; }
.menu-ac .ikon,.menu-kapat .ikon{ width:26px; height:26px; }
.menu-perde{
  position:fixed; inset:0; z-index:70;
  background:rgba(11,18,26,.5);
  opacity:0; visibility:hidden;
  transition:opacity var(--gecis),visibility var(--gecis);
}
body.menu-acik .menu-perde{ opacity:1; visibility:visible; }

/* =========================================================
   6. KAHRAMAN ALANI
   ========================================================= */
/* Yükseklik viewport genişliğine bağlı: mockup'taki 1440×490 oranı (~34vw)
   her ekranda korunsun. Sabit yükseklikte geniş ekranlarda bant basıklaşıyor
   ve arka plan fotoğrafı `cover` ile aşırı kırpılıyordu. */
.kahraman{
  position:relative;
  min-height:clamp(470px, 34vw, 700px);
  display:flex; align-items:center;
  overflow:hidden;
  background:var(--lacivert-koy);
}
.kahraman-gorsel{
  position:absolute; inset:0;
  background:url('../img/hero.jpg') no-repeat right center/cover;
}
/* Diyagonalin sağına taşan yazı için güvence perdesi. Maske yüzdeli, kapsayıcı
   ise ortalanmış ve 1300px'te sabit; geniş ekranda güvenli alan daralıyor. */
.kahraman-gorsel::after{
  content:'';
  position:absolute; inset:0;
  background:linear-gradient(100deg,
    rgba(9,15,23,.80) 0%, rgba(9,15,23,.42) 36%, rgba(9,15,23,0) 58%);
}
.kahraman-maske{
  position:absolute; inset:0;
  background:linear-gradient(118deg,#0B121A 0%,#141D28 100%);
  clip-path:polygon(0 0, 47% 0, 33% 100%, 0 100%);
}
.kahraman-ic{ position:relative; z-index:2; padding-block:108px 96px; }
/* Genişlik sınırı, başlığın diyagonalin ötesine taşmasını engeller ve
   mockup'taki iki satırlık kırılımı metinden bağımsız olarak korur. */
.kahraman-baslik{
  max-width:505px;
  font-size:clamp(32px,4.1vw,54px);
  font-weight:500;
  line-height:1.24;
  letter-spacing:-.015em;
  color:#fff;
}
.kahraman-metin{
  max-width:430px;
  margin-top:22px;
  font-size:16px;
  line-height:1.95;
  color:rgba(255,255,255,.82);
}
.kahraman .dug{ margin-top:34px; }

/* =========================================================
   7. ARAMA KUTUSU
   ========================================================= */
.arama{
  position:relative; z-index:10;
  max-width:1140px;
  margin:-53px auto 38px;
  display:grid;
  grid-template-columns:repeat(5,1fr) 165px;
  background:#fff;
  box-shadow:0 20px 46px rgba(15,23,33,.11);
}
.arama-alan{
  position:relative;
  padding:19px 24px;
  border-right:1px solid var(--cizgi);
  min-width:0;
  transition:background var(--gecis);
}
.arama-alan.acik-alan{ z-index:40; background:#fff; }
.arama-alan label{
  display:block;
  font-size:13px; font-weight:500;
  color:var(--metin);
  margin-bottom:6px;
  cursor:pointer;
}
.arama-dug{
  display:flex; align-items:center; justify-content:center; gap:12px;
  background:var(--metin); color:#fff;
  font-size:13px; font-weight:500; letter-spacing:.14em;
  transition:background var(--gecis);
}
.arama-dug .ikon{ width:19px; height:19px; }
.arama-dug:hover{ background:var(--altin); }

/* --- Özel açılır liste (native select üzerine bindirilir) --- */
.gorsel-gizli{
  position:absolute; width:1px; height:1px;
  margin:-1px; padding:0; overflow:hidden;
  clip-path:inset(50%); white-space:nowrap; border:0;
}
.secim-dug{
  display:flex; width:100%;
  align-items:center; justify-content:space-between; gap:12px;
  padding:0; text-align:left;
  font-size:14.5px; line-height:1.6;
  color:var(--metin-soluk);
  transition:color var(--gecis);
}
.secim-deger{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.secim.dolu .secim-dug{ color:var(--metin); font-weight:500; }
.secim-ok{
  width:15px; height:15px; flex:0 0 15px;
  fill:none; stroke:currentColor; stroke-width:1.9;
  stroke-linecap:round; stroke-linejoin:round;
  transition:transform var(--gecis),color var(--gecis);
}
.secim[data-acik="true"] .secim-dug{ color:var(--metin); }
.secim[data-acik="true"] .secim-ok{ transform:rotate(180deg); color:var(--altin); }

.secim-panel{
  position:absolute; left:0; right:0; top:100%;
  background:#fff;
  border:1px solid var(--cizgi);
  border-top:2px solid var(--altin);
  box-shadow:0 24px 48px -12px rgba(15,23,33,.22);
  max-height:264px; overflow-y:auto; overscroll-behavior:contain;
  padding:7px 0;
  opacity:0; visibility:hidden;
  transform:translateY(-8px);
  transition:opacity .2s ease,transform .2s ease,visibility .2s;
  scrollbar-width:thin;
  scrollbar-color:var(--altin-acik) transparent;
}
.secim-panel.yukari{ top:auto; bottom:100%; transform:translateY(8px); border-top:1px solid var(--cizgi); border-bottom:2px solid var(--altin); }
.secim[data-acik="true"] .secim-panel{ opacity:1; visibility:visible; transform:none; }
.secim-panel::-webkit-scrollbar{ width:5px; }
.secim-panel::-webkit-scrollbar-thumb{ background:var(--altin-acik); }

.secim-ogesi{
  display:flex; align-items:center; justify-content:space-between; gap:14px;
  padding:11px 24px;
  font-size:14.5px; line-height:1.5;
  color:var(--metin-orta);
  cursor:pointer;
  transition:background .18s ease,color .18s ease,padding-left .18s ease;
}
.secim-ogesi:hover,.secim-ogesi.vurgu{
  background:rgba(196,162,114,.11);
  color:var(--metin);
  padding-left:29px;
}
.secim-ogesi[aria-selected="true"]{ color:var(--altin-koyu); font-weight:500; }
.secim-ogesi .tik{
  width:15px; height:15px; flex:0 0 15px;
  fill:none; stroke:var(--altin); stroke-width:2.1;
  stroke-linecap:round; stroke-linejoin:round;
  opacity:0; transform:scale(.6);
  transition:opacity .18s ease,transform .18s ease;
}
.secim-ogesi[aria-selected="true"] .tik{ opacity:1; transform:none; }
.secim-ogesi.yer-tutucu{ color:var(--metin-soluk); }
.secim-ogesi.yer-tutucu .tik{ display:none; }   /* "Seçiniz" satırında tik gereksiz */

.secim-bos{
  padding:15px 24px;
  font-size:13.5px; color:var(--metin-soluk);
  cursor:default;
}
.secim-bos::before{
  content:''; display:inline-block;
  width:14px; height:1px; margin-right:10px;
  vertical-align:middle; background:var(--altin);
}

/* =========================================================
   8. İLAN KARTLARI
   ========================================================= */
.ilan-izgara{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:26px;
}
.ilan-kart{
  position:relative;              /* .favori bu kutuya göre konumlanır */
  background:#fff;
  border:1px solid var(--cizgi);
  transition:box-shadow var(--gecis),transform var(--gecis);
}
.ilan-kart:hover{ box-shadow:0 18px 40px rgba(15,23,33,.11); transform:translateY(-4px); }

/* Görsel bir <a>; kalp düğmesi bağlantının içinde olamayacağı için kart
   düzeyinde duruyor — bu yüzden .ilan-kart konumlandırılmış. */
.ilan-gorsel{
  position:relative; display:block;
  aspect-ratio:27/20;
  background-size:cover; background-position:center;
}
.rozet{
  position:absolute; top:14px; left:14px;
  background:var(--metin); color:#fff;
  font-size:10.5px; font-weight:500;
  letter-spacing:.12em;
  padding:6px 13px;
}
.favori{
  position:absolute; top:12px; right:12px;
  width:34px; height:34px;
  display:grid; place-items:center;
  background:rgba(255,255,255,.94);
  border-radius:3px;
  color:var(--metin);
  transition:background var(--gecis),color var(--gecis);
}
.favori .ikon{ width:18px; height:18px; }
.favori:hover{ background:#fff; color:var(--altin); }
.favori.etkin .ikon{ fill:currentColor; color:#fff; }
.favori.etkin{ background:transparent; }
.fiyat{
  position:absolute; left:0; bottom:0;
  background:rgba(18,24,31,.92);
  color:#fff;
  font-size:16px; font-weight:600;
  padding:8px 16px;
}
.fiyat small{ font-size:13px; font-weight:500; }

.ilan-govde{ padding:20px 22px 22px; }
.ilan-govde h3{ font-size:17px; font-weight:600; }
.ilan-govde h3 a{ transition:color var(--gecis); }
.ilan-govde h3 a:hover{ color:var(--altin); }
.ilan-yer{
  display:flex; align-items:center; gap:8px;
  margin-top:10px;
  font-size:13.5px; color:var(--metin-soluk);
}
.ilan-yer .ikon{ width:15px; height:15px; color:var(--altin); }
.ilan-ozet{
  display:flex; flex-wrap:wrap;
  margin-top:16px; padding-top:15px;
  border-top:1px solid var(--cizgi);
  font-size:13.5px; color:var(--metin-orta);
}
.ilan-ozet li{ padding-right:16px; margin-right:16px; border-right:1px solid var(--cizgi); }
.ilan-ozet li:last-child{ padding-right:0; margin-right:0; border-right:0; }

/* =========================================================
   9. NEDEN PRESTİJ
   ========================================================= */
.bolum-sik .kap > *{ /* kutulu bölümler */ }
.neden{
  display:grid;
  grid-template-columns:35% 1fr;
  background:var(--gri);
  padding:68px 56px 60px;
}
.neden-sol{ padding-right:48px; }
.neden-sol p{ margin-top:22px; font-size:15px; color:var(--metin-orta); max-width:340px; }
.neden-sol .dug{ margin-top:32px; }

.neden-sag{
  display:grid;
  grid-template-columns:1fr 1fr;
  border-left:1px solid var(--cizgi);
}
.ozellik{
  display:flex; gap:22px;
  padding:26px 30px 30px;
}
.ozellik:nth-child(1),.ozellik:nth-child(2){ padding-top:6px; }
.ozellik:nth-child(2),.ozellik:nth-child(4){ border-left:1px solid var(--cizgi); }
.ozellik:nth-child(3),.ozellik:nth-child(4){ border-top:1px solid var(--cizgi); padding-top:34px; }
.ozellik-ikon{
  width:52px; height:52px; flex:0 0 52px;
  fill:none; stroke:var(--altin);
  stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round;
}
.ozellik h3{ font-size:16px; font-weight:600; margin-bottom:9px; }
.ozellik p{ font-size:14px; line-height:1.75; color:var(--metin-soluk); }

/* =========================================================
   10. PROJELER
   ========================================================= */
.projeler{
  display:grid;
  grid-template-columns:32% 1fr;
  background:var(--lacivert-koy);
  padding:52px 0 40px 52px;
  overflow:hidden;
}
/* Kartlar bilerek panelin sağ kenarına kadar taşar (kaydırıcı hissi) */
.projeler-sol{ padding-right:40px; }
.projeler-sol .dug{ margin-top:38px; }

.projeler-sag{ min-width:0; }
.proje-serit{
  display:flex; gap:24px;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  scrollbar-width:none;
}
.proje-serit::-webkit-scrollbar{ display:none; }
.proje-kart{
  flex:0 0 calc((100% - 48px)/3);
  scroll-snap-align:start;
  background:var(--lacivert-krt);
}
.proje-gorsel{
  display:block;
  aspect-ratio:5/4;
  background-size:cover; background-position:center;
}
.proje-govde h3 a{ transition:color var(--gecis); }
.proje-govde h3 a:hover{ color:var(--altin); }
.proje-govde{ padding:20px 22px 24px; }
.proje-govde h3{ font-size:16.5px; font-weight:600; color:#fff; }
.proje-govde p{ font-size:14px; color:rgba(255,255,255,.55); margin-top:7px; }

.proje-kontrol{
  display:flex; align-items:center; justify-content:space-between;
  gap:20px;
  margin-top:26px;
}

/* =========================================================
   11. İSTATİSTİK
   ========================================================= */
.istatistik{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  background:var(--gri);
  padding:38px 52px;
}
.ist{
  display:flex; align-items:center; gap:20px;
  padding-inline:26px;
  border-left:1px solid var(--cizgi);
}
.ist:first-child{ border-left:0; padding-left:0; }
.ist-ikon{
  width:54px; height:54px; flex:0 0 54px;
  fill:none; stroke:var(--altin);
  stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round;
}
.ist strong{ display:block; font-size:clamp(26px,2.8vw,34px); font-weight:600; line-height:1.1; letter-spacing:-.015em; }
.ist span{ display:block; font-size:14px; color:var(--metin-orta); margin-top:5px; }

/* =========================================================
   12. MÜŞTERİ YORUMLARI
   ========================================================= */
.yorumlar{
  display:grid;
  grid-template-columns:33% 1fr;
  gap:40px;
  align-items:start;
  padding-top:14px;
}
.yorumlar-sol .oklar{ margin-top:36px; }
.yorumlar-sag{ min-width:0; overflow:hidden; }
.yorum-serit{
  display:flex; gap:26px;
  transition:transform .45s cubic-bezier(.4,0,.2,1);
}
.yorum-kart{
  flex:0 0 calc((100% - 26px)/2);
  margin:0;
  background:var(--gri);
  padding:30px 32px 32px;
}
.yorum-tirnak{ width:26px; height:26px; fill:var(--metin-soluk); stroke:none; opacity:.45; }
.yorum-kart blockquote{
  margin:16px 0 0;
  font-size:14.5px; line-height:1.85; color:var(--metin-orta);
}
.yorum-kart figcaption{ display:flex; align-items:center; gap:16px; margin-top:28px; }
.yorum-kart img{ width:52px; height:52px; border-radius:50%; object-fit:cover; }
.yorum-kart figcaption span{ display:flex; flex-direction:column; }
.yorum-kart strong{ font-size:15px; font-weight:600; }
.yorum-kart em{ font-style:normal; font-size:13px; color:var(--metin-soluk); margin-top:2px; }

/* =========================================================
   13. BLOG
   ========================================================= */
.blog-izgara{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:26px;
}
.blog-kart{
  background:#fff;
  border:1px solid var(--cizgi);
  transition:box-shadow var(--gecis),transform var(--gecis);
}
.blog-kart:hover{ box-shadow:0 18px 40px rgba(15,23,33,.11); transform:translateY(-4px); }
.blog-gorsel{
  position:relative; display:block;
  aspect-ratio:2/1;
  background-size:cover; background-position:center;
}
.etiket{
  position:absolute; left:14px; bottom:0;
  background:#fff; color:var(--metin);
  font-size:10.5px; font-weight:600;
  letter-spacing:.12em;
  padding:7px 14px;
}
.blog-govde{ padding:26px 22px 24px; }
.blog-govde h2,.blog-govde h3{ font-size:17px; font-weight:600; line-height:1.45; min-height:2.9em; }
.blog-govde h2 a,.blog-govde h3 a{ transition:color var(--gecis); }
.blog-govde h2 a:hover,.blog-govde h3 a:hover{ color:var(--altin-koyu); }
.blog-govde time{ display:block; margin-top:16px; font-size:13px; color:var(--metin-soluk); }

/* =========================================================
   14. İLETİŞİM ŞERİDİ
   ========================================================= */
.cagri{
  position:relative;
  display:flex; align-items:center; justify-content:space-between;
  gap:36px; flex-wrap:wrap;
  padding:46px 52px;
  background:linear-gradient(90deg,rgba(8,13,20,.94) 0%,rgba(8,13,20,.72) 45%,rgba(8,13,20,.9) 100%),
             url('../img/cta.jpg') no-repeat center/cover;
}
.cagri p{
  font-size:clamp(20px,2.3vw,27px);
  font-weight:400;
  line-height:1.45;
  color:#fff;
}
.cagri .dug{ flex:0 0 auto; }

/* =========================================================
   15. ALT BİLGİ
   ========================================================= */
.dip{
  background:var(--dip-zemin);
  color:rgba(255,255,255,.62);
  font-size:14px;
  margin-top:6px;
}
.dip-ust{
  display:grid;
  grid-template-columns:1.5fr 1fr 1.25fr 1.3fr;
  gap:40px;
  padding:64px 0 52px;
}
.dip-marka p{ margin-top:24px; line-height:1.9; max-width:330px; }
.dip-sosyal{ display:flex; gap:22px; margin-top:30px; }
.dip-sosyal a{ color:rgba(255,255,255,.72); transition:color var(--gecis); }
.dip-sosyal a:hover{ color:var(--altin); }
.dip-sosyal .ikon{ width:18px; height:18px; }

.dip-sutun h4,.dip-baslik{
  font-size:13px; font-weight:600;
  letter-spacing:.1em; color:#fff;
  margin-bottom:26px;
}
.dip-sutun li + li{ margin-top:13px; }
.dip-sutun a{ transition:color var(--gecis),padding-left var(--gecis); }
.dip-sutun a:hover{ color:var(--altin); }
.dip-iletisim li{ display:flex; gap:14px; align-items:flex-start; }
.dip-iletisim li + li{ margin-top:20px; }
.dip-iletisim .ikon{ width:17px; height:17px; color:var(--altin); margin-top:5px; }
.dip-iletisim span{ line-height:1.75; }

.dip-alt{
  display:flex; align-items:center; justify-content:space-between;
  gap:18px; flex-wrap:wrap;
  padding:24px 0 28px;
  border-top:1px solid var(--cizgi-koyu);
  font-size:13.5px;
}
.dip-yasal{ display:flex; align-items:center; gap:18px; }
.dip-yasal span{ opacity:.35; }
.dip-yasal a:hover{ color:var(--altin); }

/* Ajans imzası — alt şeridin ortasında */
.dip-imza{
  display:flex; align-items:center; gap:10px;
  color:rgba(255,255,255,.68);   /* .42 kontrastı geçmiyordu (erişilebilirlik) */
}
.dip-imza::before{
  content:''; flex:0 0 18px; height:1px;
  background:var(--altin); opacity:.5;
}
.dip-imza a{
  display:inline-flex; align-items:center; gap:7px;
  color:var(--altin); font-weight:500;
  border-bottom:1px solid transparent;
  padding-bottom:2px;
  transition:color var(--gecis),border-color var(--gecis);
}
.dip-imza a:hover{ color:var(--altin-acik); border-color:var(--altin-acik); }
.dip-imza .ikon{ width:13px; height:13px; stroke-width:1.9; transition:transform var(--gecis); }
.dip-imza a:hover .ikon{ transform:translate(2px,-2px); }

/* =========================================================
   16. GÖRÜNÜME GİRİŞ ANİMASYONU
   ========================================================= */
/* transform yerine `translate` kullanılıyor; kartların :hover transform'u bozulmasın */
.beliren{ opacity:0; translate:0 22px; transition:opacity .7s ease,translate .7s ease; }
.beliren.gorundu{ opacity:1; translate:none; }
@media (prefers-reduced-motion:reduce){
  *{ animation:none!important; transition:none!important; }
  .beliren{ opacity:1; translate:none; }
  html{ scroll-behavior:auto; }
}

/* =========================================================
   17. DUYARLI (RESPONSIVE)
   ========================================================= */
@media (max-width:1220px){
  .menu-liste{ gap:20px; }
  .menu-liste > li > a{ font-size:12px; }
  .tel em{ display:none; }
}

@media (max-width:1100px){
  /* Mobil menü */
  .menu-ac{ display:grid; place-items:center; }
  .menu-kapat{ display:grid; place-items:center; position:absolute; top:20px; right:20px; }
  .menu{
    position:fixed; top:0; right:0; bottom:0; z-index:80;
    width:min(330px,86vw);
    background:#fff;
    padding:78px 30px 30px;
    overflow-y:auto;
    transform:translateX(100%);   /* 105% gereksizdi; taşmayı büyütüyordu */
    transition:transform var(--gecis);
    box-shadow:-12px 0 40px rgba(15,23,33,.16);
  }
  body.menu-acik .menu{ transform:none; }
  .menu-liste{ flex-direction:column; align-items:stretch; gap:0; }
  .menu-liste > li{ border-bottom:1px solid var(--cizgi); }
  .menu-liste > li > a{ justify-content:space-between; padding:15px 0; font-size:13.5px; }
  .alt-menu{
    position:static; opacity:1; visibility:visible; transform:none;
    box-shadow:none; border-top:0; padding:0 0 12px 14px;
    display:none;
  }
  .alt-var.acildi > .alt-menu{ display:block; }
  .alt-var.acildi > a .ok{ transform:rotate(180deg); }
  .alt-menu a{ padding:8px 0; }
  .alt-menu a:hover{ background:none; padding-left:6px; }
  .menu-alt{ margin-top:32px; display:flex; flex-direction:column; gap:20px; align-items:flex-start; }
  .menu-alt .tel em{ display:block; }
  .baslik-sag .tel,.baslik-sag .dug{ display:none; }
  .baslik-ic{ min-height:82px; }

  /* Yerleşim */
  .ilan-izgara{ grid-template-columns:repeat(2,1fr); }
  .neden{ grid-template-columns:1fr; padding:48px 40px; }
  .neden-sol{ padding-right:0; padding-bottom:38px; }
  .neden-sag{ border-left:0; border-top:1px solid var(--cizgi); }
  .ozellik{ padding:30px 26px; }
  .ozellik:nth-child(1),.ozellik:nth-child(2){ padding-top:30px; }
  .projeler{ grid-template-columns:1fr; padding:44px 0 36px 40px; }
  .projeler-sol{ padding-right:40px; padding-bottom:34px; }
  .proje-kart{ flex:0 0 calc((100% - 24px)/2); }
  .yorumlar{ grid-template-columns:1fr; gap:32px; }
  .yorumlar-sol .oklar{ margin-top:26px; }
}

@media (max-width:900px){
  .ust-bar{ font-size:12px; }
  .ust-bilgi{ gap:20px; }
  .blog-izgara{ grid-template-columns:repeat(2,1fr); }
  .blog-govde h2,.blog-govde h3{ min-height:0; }
  .dip-ust{ grid-template-columns:1fr 1fr; gap:44px 30px; }
  /* Üç parça tek satıra sığmayınca space-between dağıtmasın, soldan aksın */
  .dip-alt{ justify-content:flex-start; gap:10px 30px; }
  .kahraman-maske{
    clip-path:none;
    background:linear-gradient(90deg,rgba(9,15,23,.95) 0%,rgba(9,15,23,.82) 55%,rgba(9,15,23,.55) 100%);
  }
  .kahraman{ min-height:440px; }
  .arama{ grid-template-columns:repeat(3,1fr); margin-top:-40px; }
  .arama-alan{ border-bottom:1px solid var(--cizgi); }
  .arama-alan:nth-child(3),.arama-alan:nth-child(5){ border-right:0; }
  .arama-dug{ grid-column:1/-1; padding:17px; }
}

@media (max-width:760px){
  .ust-bar-ic{ justify-content:center; }
  .ust-sosyal{ display:none; }
  .istatistik{ grid-template-columns:1fr 1fr; gap:30px 0; padding:34px 30px; }
  .ist:nth-child(odd){ border-left:0; padding-left:0; }
  .ist{ padding-inline:20px; }
  .yorum-kart{ flex:0 0 100%; }
  .cagri{ padding:38px 32px; }
  .neden-sag{ grid-template-columns:1fr; }
  .ozellik:nth-child(2),.ozellik:nth-child(4){ border-left:0; }
  .ozellik:nth-child(2){ border-top:1px solid var(--cizgi); padding-top:30px; }
  .neden{ padding:40px 28px; }
  .projeler{ padding:38px 0 30px 28px; }
  .projeler-sol{ padding-right:28px; }
  .proje-kart{ flex:0 0 78%; }
}

@media (max-width:620px){
  .kap{ padding-inline:18px; }
  .ilan-izgara,.blog-izgara{ grid-template-columns:1fr; }
  .arama{ grid-template-columns:1fr 1fr; }
  .arama-alan{ border-right:1px solid var(--cizgi); border-bottom:1px solid var(--cizgi); }
  .arama-alan:nth-child(2n){ border-right:0; }
  .arama-alan:nth-child(5){ grid-column:1/-1; border-right:0; }
  .bolum-basi{ flex-direction:column; align-items:flex-start; gap:14px; }
  .dip-ust{ grid-template-columns:1fr; gap:38px; padding:48px 0 40px; }
  .dip-alt{ flex-direction:column; align-items:flex-start; gap:12px; }
  .cagri{ padding:32px 24px; }
  .kahraman-ic{ padding-block:48px 70px; }
  .ust-bilgi span{ display:none; }

  /* İstatistik: yan yana ikon + sayı 2 sütunlu ızgarada sığmıyor.
     390px'te hücre 147px, gereken 169px → sağdaki sütun kesiliyordu.
     Hücre içeriği dikey dizilince genişlik baskısı tamamen kalkıyor.
     (Sayaçlar 0'dan sayarak büyüdüğü için bu taşma ancak animasyon
     bittikten sonra görünür — ölçerken sayaçları kesinleştirin.) */
  .istatistik{ padding:28px 22px; gap:26px 14px; }
  .ist{
    flex-direction:column; align-items:flex-start;
    gap:11px; padding-inline:0; border-left:0; min-width:0;
  }
  .ist-ikon{ width:42px; height:42px; flex:0 0 42px; }
  .ist strong{ font-size:25px; }
  .ist span{ font-size:13px; }
}

@media (max-width:420px){
  .arama{ grid-template-columns:1fr; }
  .arama-alan{ border-right:0; }
  .logo-yazi strong{ font-size:21px; }
  .logo-ikon{ width:36px; height:36px; }
}

/* =========================================================
   ARSLAN EMLAK EKLERİ — WhatsApp düğmesi, kart fotoğrafı, rozetler, yetki
   ========================================================= */
.wa-dug{
  position:fixed; right:20px; bottom:20px; z-index:55;
  display:inline-flex; align-items:center; gap:9px;
  padding:12px 16px 12px 13px; background:#25D366; color:#fff;
  font-size:14px; font-weight:600; letter-spacing:.02em;
  box-shadow:0 8px 24px rgba(0,0,0,.22);
  transition:transform var(--gecis),box-shadow var(--gecis),background var(--gecis);
}
.wa-dug:hover{ transform:translateY(-2px); background:#1ebe5a; box-shadow:0 12px 28px rgba(0,0,0,.28); }
.wa-dug .ikon{ width:22px; height:22px; stroke-width:1.8; }
@media (max-width:620px){
  .wa-dug{ right:14px; bottom:14px; padding:12px; }
  .wa-dug span{ display:none; }
  .wa-dug .ikon{ width:26px; height:26px; }
}

/* Kart fotoğrafı <img> ile (lazy loading) — arka plan görseli yerine */
.ilan-gorsel{ overflow:hidden; background:var(--gri); }
.ilan-foto{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }

/* Yeni / Fiyat düştü rozetleri (ilan tipi rozetinin altında) */
.rozet-yeni{ background:var(--altin); color:var(--metin); }
.rozet-dustu{ background:#1F7A4D; color:#fff; }
.ilan-kart .rozet-yeni,.ilan-kart .rozet-dustu{ top:46px; }

/* Ana sayfa: özellik ikonları daha sakin */
.ozellik-ikon{ width:40px; height:40px; flex:0 0 40px; }

.dip-yetki{ font-size:12.5px; color:rgba(255,255,255,.45); }

/* Dar ekranda (≤340px) başlık taşmasın: amblem ve logo yazısı küçülür (mobil denetimde 320px'te 16px taşma ölçüldü) */
@media (max-width:340px){
  .logo{ gap:9px; }
  .logo-amblem,.baslik.kaydi .logo-amblem{ height:42px; }
  .logo-yazi strong{ font-size:19px; letter-spacing:.04em; }
  .logo-yazi em{ font-size:8px; letter-spacing:.26em; }
  .menu-ac .ikon{ width:24px; height:24px; }
}

/* =========================================================
   VİTRİN — açık, minimal üst alan: başlık + sekmeli arama çubuğu + hızlı bağlantılar;
   sağda tek blog kartı (ilerleme çizgisiyle döner) ve kompakt ofis haritası.
   Bu bölümde 4px köşe yumuşatması bilinçli (modern his); sitenin kalanı keskin.
   ========================================================= */
.vitrin{ background:#fff; color:var(--metin); padding:52px 0 36px; border-bottom:1px solid var(--cizgi); }
.vitrin-ic{ display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:48px; align-items:start; }
.vitrin-sol,.vitrin-sag{ min-width:0; }
.vitrin-sol{ display:flex; flex-direction:column; }
.vitrin-baslik{ font-size:clamp(30px,3.3vw,44px); font-weight:600; line-height:1.12; letter-spacing:-.022em; margin-bottom:12px; max-width:620px; }
.vitrin-metin{ color:var(--metin-orta); font-size:16px; line-height:1.7; margin-bottom:26px; max-width:560px; }

/* Arama çubuğu */
.arama.arama-vitrin{
  display:flex; flex-direction:column; flex:0 0 auto;
  margin:0; max-width:none; box-shadow:none; background:transparent;
}
.arama-sekmeler{ display:flex; gap:4px; }
.arama-sekme input{ position:absolute; opacity:0; pointer-events:none; }
.arama-sekme span{
  display:inline-block; padding:10px 18px;
  font-size:13.5px; font-weight:500; color:var(--metin-orta);
  background:var(--gri); border:1px solid var(--cizgi); border-bottom:0;
  border-radius:4px 4px 0 0; cursor:pointer; transition:background var(--gecis),color var(--gecis);
}
.arama-sekme:hover span{ color:var(--metin); }
.arama-sekme input:checked + span{ background:var(--metin); color:#fff; border-color:var(--metin); }
.arama-sekme input:focus-visible + span{ outline:2px solid var(--altin); outline-offset:2px; }
.arama-kart{
  display:flex; flex-direction:column;
  background:#fff; border:1px solid var(--cizgi); border-radius:0 4px 4px 4px;
  box-shadow:0 14px 34px rgba(15,23,33,.08);
}
.arama-satir{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); grid-auto-rows:66px; }
.arama-vitrin .arama-alan{
  display:flex; flex-direction:column; justify-content:center;
  padding:12px 18px; border-right:1px solid var(--cizgi); border-bottom:1px solid var(--cizgi); min-width:0;
}
.arama-vitrin .arama-alan:nth-child(2n){ border-right:0; }
.arama-vitrin .arama-girdi{ width:100%; border:0; padding:0; background:transparent; font:inherit; font-size:14.5px; line-height:1.6; color:var(--metin); outline:none; }
.arama-vitrin .arama-girdi::placeholder{ color:var(--metin-soluk); }
.arama-vitrin .arama-girdi::-webkit-outer-spin-button,.arama-vitrin .arama-girdi::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
.arama-vitrin .arama-girdi{ -moz-appearance:textfield; appearance:textfield; }
.arama-vitrin .arama-alan label{ font-size:12px; font-weight:500; color:var(--metin-soluk); margin-bottom:4px; letter-spacing:.01em; }
.arama-vitrin .secim-dug{ font-size:14.5px; }
.arama-alt{ margin-top:auto; display:flex; justify-content:flex-end; align-items:center; padding:12px 16px; }
.arama-vitrin .arama-dug{
  min-height:0; padding:12px 22px; gap:9px;
  letter-spacing:.02em; font-size:13.5px; font-weight:600; text-transform:none;
  border-radius:4px;
}
.arama-vitrin .arama-dug .ikon{ width:18px; height:18px; }

/* Hızlı bağlantılar */
.hizli-bag{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-top:16px; font-size:13px; }
.hizli-bag span{ color:var(--metin-soluk); margin-right:2px; }
.hizli-bag a{
  padding:6px 12px; border:1px solid var(--cizgi); border-radius:4px; color:var(--metin);
  transition:border-color var(--gecis),color var(--gecis),background var(--gecis);
}
.hizli-bag a:hover{ border-color:var(--metin); background:var(--gri); }

/* Blog kartı */
.yazi-vitrin{ border:1px solid var(--cizgi); border-radius:4px; background:#fff; overflow:hidden; }
.yazi-vitrin-basi{
  display:flex; justify-content:space-between; align-items:center;
  padding:12px 18px; border-bottom:1px solid var(--cizgi); font-size:13px;
}
.yazi-vitrin-basi span{ font-weight:600; letter-spacing:.01em; }
.yazi-vitrin-basi a{ display:inline-flex; align-items:center; gap:6px; color:var(--metin-orta); }
.yazi-vitrin-basi a:hover{ color:var(--metin); }
.yazi-vitrin-basi .ikon{ width:14px; height:14px; }
.yazi-kartlar{ position:relative; }
.yazi-kart{ display:block; color:inherit; opacity:0; visibility:hidden; position:absolute; inset:0; pointer-events:none; transition:opacity .5s ease,visibility 0s .5s; }
.yazi-kart.etkin{ position:relative; opacity:1; visibility:visible; pointer-events:auto; transition:opacity .5s ease; }
.yazi-kart img{ display:block; width:100%; height:auto; aspect-ratio:2/1; object-fit:cover; background:var(--gri); }   /* height:auto şart: HTML height özniteliği sabit yükseklik olmasın */
.yazi-kart-ic{ display:flex; flex-direction:column; gap:6px; padding:16px 18px 18px; }
.yazi-kart small{ font-size:12px; color:var(--metin-soluk); }
.yazi-kart strong{ font-size:17px; font-weight:600; line-height:1.35; transition:color var(--gecis); }
.yazi-kart:hover strong{ color:var(--altin-koyu); }
.yazi-kart em{ font-style:normal; font-size:13.5px; line-height:1.6; color:var(--metin-orta); }
.yazi-vitrin-alt{ display:flex; align-items:center; gap:14px; padding:0 18px 14px; }
.yazi-ilerleme{ flex:1; height:2px; background:var(--cizgi); overflow:hidden; }
.yazi-ilerleme i{ display:block; height:100%; width:0; background:var(--metin); }
.yazi-noktalar{ display:flex; gap:6px; }
.yazi-noktalar button{ width:7px; height:7px; border-radius:50%; background:var(--cizgi); transition:background var(--gecis),transform var(--gecis); }
.yazi-noktalar button.etkin{ background:var(--metin); transform:scale(1.15); }

/* Kompakt ofis haritası */
.mini-harita{ margin-top:16px; border:1px solid var(--cizgi); border-radius:4px; overflow:hidden; background:#fff; }
.mini-harita iframe{ display:block; width:100%; height:170px; border:0; filter:grayscale(1) contrast(1.04); }
/* Ofis kartı: fotoğraf 240px sütunda orijinal 3:4 oranında, kaynaktan küçük gösterilir (büyütme yok → net) */
.ofis-kart{ margin-top:16px; display:grid; grid-template-columns:240px minmax(0,1fr); border:1px solid var(--cizgi); border-radius:4px; overflow:hidden; background:#fff; }
.ofis-kart img{ display:block; width:100%; height:100%; aspect-ratio:3/4; object-fit:cover; object-position:50% 20%; background:var(--gri); }
.ofis-bilgi{ display:flex; flex-direction:column; gap:6px; padding:18px 20px; align-self:center; }
.ofis-bilgi strong{ font-size:15px; font-weight:600; }
.ofis-bilgi p{ font-size:13.5px; color:var(--metin-orta); line-height:1.55; }
.ofis-tel{ font-size:15px; font-weight:600; color:var(--metin); }
.ofis-saat{ font-size:12.5px; color:var(--metin-soluk); }
.ofis-bilgi .mini-harita-dug{ align-self:flex-start; margin-top:8px; }
@media (max-width:520px){
  .ofis-kart{ grid-template-columns:1fr; }
  .ofis-kart img{ aspect-ratio:4/3; object-position:50% 35%; }
}
.mini-harita-alt{ display:flex; justify-content:space-between; align-items:center; gap:14px; padding:12px 16px; border-top:1px solid var(--cizgi); }
.mini-harita-alt strong{ display:block; font-size:13.5px; font-weight:600; }
.mini-harita-alt span{ display:block; font-size:12.5px; color:var(--metin-soluk); line-height:1.45; }
.mini-harita-dug{
  flex:0 0 auto; padding:8px 14px; border:1px solid var(--metin); border-radius:4px;
  font-size:12.5px; font-weight:600; color:var(--metin); transition:background var(--gecis),color var(--gecis);
}
.mini-harita-dug:hover{ background:var(--metin); color:#fff; }

@media (max-width:980px){
  .vitrin{ padding:36px 0 30px; }
  .vitrin-ic{ grid-template-columns:1fr; gap:28px; }
}
@media (max-width:520px){
  .arama-satir{ grid-template-columns:1fr; }
  .arama-vitrin .arama-alan,.arama-vitrin .arama-alan:nth-child(2n){ border-right:0; }
  .arama-sekme span{ padding:9px 13px; font-size:13px; }
  .mini-harita-alt{ flex-direction:column; align-items:flex-start; }
}
.vitrin-not{ margin-top:18px; font-size:13.5px; color:var(--metin-soluk); }
.vitrin-not strong{ color:var(--metin); font-weight:600; }

/* =========================================================
   ÜCRETSİZ DEĞERLEME — projeler bandının yerine; koyu bant, solda maddeler, sağda kısa form
   ========================================================= */
.degerleme{
  display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); gap:48px; align-items:center;
  background:var(--lacivert-koy); color:#fff; padding:52px 56px;
}
.degerleme-sol p{ color:rgba(255,255,255,.72); font-size:15.5px; line-height:1.7; margin:14px 0 26px; max-width:520px; }
.degerleme-liste li{ padding:14px 0; border-top:1px solid rgba(255,255,255,.12); }
.degerleme-liste li:last-child{ border-bottom:1px solid rgba(255,255,255,.12); }
.degerleme-liste strong{ display:block; font-size:15px; font-weight:600; margin-bottom:3px; }
.degerleme-liste span{ display:block; font-size:13.5px; line-height:1.6; color:rgba(255,255,255,.62); }

.degerleme-kart{ background:#fff; color:var(--metin); padding:26px 26px 24px; border-radius:4px; }
.degerleme-kart h3{ font-size:17px; font-weight:600; margin-bottom:14px; }
.degerleme-hata{ background:#fdf1f0; border-left:3px solid #c0392b; color:#8e2a1f; font-size:13.5px; padding:10px 12px; margin-bottom:14px; }
.degerleme-amac{ display:flex; gap:6px; margin-bottom:14px; }
.degerleme-amac label{ flex:1; }
.degerleme-amac input{ position:absolute; opacity:0; pointer-events:none; }
.degerleme-amac span{
  display:block; text-align:center; padding:10px 8px; font-size:13px; font-weight:500;
  border:1px solid var(--cizgi); border-radius:4px; color:var(--metin-orta); cursor:pointer;
  transition:background var(--gecis),color var(--gecis),border-color var(--gecis);
}
.degerleme-amac input:checked + span{ background:var(--metin); border-color:var(--metin); color:#fff; }
.degerleme-kart .alan{ margin-bottom:12px; }
.degerleme-kart .alan label{ display:block; font-size:13px; font-weight:500; margin-bottom:6px; }
.degerleme-kart .alan label span{ color:var(--altin); }
.degerleme-kart .alan input,.degerleme-kart .alan textarea{
  width:100%; padding:12px 13px; border:1px solid #D9D9D6; border-radius:4px; background:#fff;
  font:inherit; font-size:14.5px; color:var(--metin); transition:border-color var(--gecis);
}
.degerleme-kart .alan textarea{ resize:vertical; min-height:84px; }
.degerleme-kart .alan input:focus,.degerleme-kart .alan textarea:focus{ outline:none; border-color:var(--metin); }
.degerleme-kart .dug{ width:100%; justify-content:center; margin-top:4px; border-radius:4px; }
.degerleme-kart .form-not{ font-size:12px; color:var(--metin-soluk); margin-top:12px; line-height:1.6; }
.degerleme-kart .form-not a{ color:var(--altin-koyu); text-decoration:underline; text-underline-offset:2px; }
.degerleme-tesekkur strong{ display:block; font-size:18px; margin-bottom:6px; }
.degerleme-tesekkur p{ color:var(--metin-orta); line-height:1.65; }
.bal-kupu{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

@media (max-width:980px){
  .degerleme{ grid-template-columns:1fr; gap:30px; padding:40px 32px; }
}
@media (max-width:620px){
  .degerleme{ padding:30px 20px; }
  .degerleme-amac{ flex-direction:column; }
}

/* Tıklayınca yüklenen harita / video kutuları (facade) */
.harita-yukle{
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px;
  text-align:center; padding:24px; background:var(--gri); color:var(--metin-orta);
}
.harita-yukle p{ font-size:14px; max-width:340px; }
.harita-yukle small{ font-size:12px; color:var(--metin-soluk); }
.harita-yukle .dug{ padding:12px 20px; }
.mini-harita .harita-yukle{ height:170px; }
.harita-kutu .harita-yukle{ position:absolute; inset:0; }
.harita .harita-yukle{ min-height:440px; }
.video-yukle{
  position:absolute; inset:0; display:grid; place-items:center;
  background:#0B121A center/cover no-repeat; cursor:pointer;
}
.video-yukle button{
  width:72px; height:72px; border-radius:50%; background:rgba(255,255,255,.94);
  display:grid; place-items:center; box-shadow:0 10px 30px rgba(0,0,0,.35); transition:transform var(--gecis);
}
.video-yukle button span{ width:0; height:0; border-style:solid; border-width:12px 0 12px 20px; border-color:transparent transparent transparent var(--metin); margin-left:4px; }
.video-yukle:hover button{ transform:scale(1.06); }
