/* ============================================================
   Reswons Emlak — vitrin teması
   Kaynak: theme/emlak-premium.html (görsel dil birebir korunur)
   :root renkleri tenant ayarlarından inline <style> ile override edilir.
   ============================================================ */
:root{
  /* Kapsayici genisligi: genis ekranda icerik ortada dar serit gibi kalmasin.
     max(...) sayesinde dizustu genisliklerinde eskisinden dar olmaz. */
  --kap-genis:min(1800px, max(1280px, 88vw));
  --kap-orta:min(1680px, max(1200px, 84vw));
  --ivory:#EFE9DD;
  --ivory-soft:#E6DFCF;
  --forest:#17332A;
  --forest-deep:#0F241D;
  --brass:#A87C3F;
  --brass-soft:#C39A5E;
  --sage:#8FA396;
  --line-light:rgba(23,51,42,.16);
  --line-dark:rgba(239,233,221,.18);
  --ortu-alt:rgba(15,36,29,.58);   /* slayt görsel kontrast overlay — alt (güçlü) */
  --ortu-ust:rgba(15,36,29,.35);   /* üst (zayıf) — _renkler tenant renginden override eder */
  --ease:cubic-bezier(.76,0,.24,1);
  --dur:1.05s;

  /* ---- TEMA TOKEN'LARI ----
     Sayfa artık TEK zemin kullanır: bölüm başına ayrı arka plan yok (koyu/krem/krem
     dalgalanması buradan geliyordu). Ayrım ince çizgi, boşluk ve kart yüzeyiyle verilir.
     Kiracı panelden renk değiştirirse AÇIK tema token'ları _renkler.php'de yeniden
     türetilir. Koyu tema sabit paleti kullanır: kiracının açık renklerini karartmak
     okunabilirliği garanti etmiyor, tek tek kontrast doğrulamak gerekirdi. */
  --zemin:var(--ivory);          /* sayfanın tek arka planı */
  --yuzey:#FFFFFF;               /* kart/form yüzeyi */
  --yuzey-2:var(--ivory-soft);   /* daha sakin ikinci yüzey */
  --metin:var(--forest);
  /* Sage (#8FA396) krem zeminde ~2:1 kalıyordu — okunmuyor. Koyu temadaki ile aynı
     .74 saydamlık, ama ana metin renginden türetilmiş: her iki temada da ~5.3:1. */
  --metin-soluk:rgba(23,51,42,.74);
  --cizgi:var(--line-light);
  --ust-cam:rgba(239,233,221,.88); /* yapışkan başlığın yarı saydam zemini */

  /* ---- TİPOGRAFİ ÖLÇEĞİ ----
     Gövde metni tek ölçekte toplandı: 13.5/14/14.5/15px ve 1.6–1.85 satır aralığı
     karışıklığı, bölümler arası görünmez bir tutarsızlık yaratıyordu. Üç basamak yeter. */
  --y-kucuk:13.5px;   /* meta, footer, dipnot */
  --y-orta:15px;      /* gövde paragrafı */
  --y-buyuk:16.5px;   /* öne çıkan giriş paragrafı */
  --sat-sik:1.55;     /* kısa, 1-2 satırlık metin */
  --sat-normal:1.72;  /* akan paragraf */
}

/* Koyu tema. Kullanıcı seçimi (data-tema) sistem tercihini EZER. */
html[data-tema="koyu"]{
  --zemin:#101E18;
  --yuzey:#182C24;
  --yuzey-2:#14251E;
  --metin:#EFE9DD;
  --metin-soluk:rgba(239,233,221,.74);
  --cizgi:rgba(239,233,221,.16);
  --ust-cam:rgba(16,30,24,.90);
}
@media(prefers-color-scheme:dark){
  html:not([data-tema="acik"]){
    --zemin:#101E18;
    --yuzey:#182C24;
    --yuzey-2:#14251E;
    --metin:#EFE9DD;
    --metin-soluk:rgba(239,233,221,.74);
    --cizgi:rgba(239,233,221,.16);
    --ust-cam:rgba(16,30,24,.90);
  }
}

/* Koyu zeminde optik düzeltme.
   Açık metin koyu zeminde daha kalın/şişkin görünür (halation). Harf aralığını ya da
   ağırlığı temaya göre oynatmıyoruz — iki tema arasında ölçü kaymasın diye; gri tonlamalı
   yumuşatma tek başına şişkinliği alıyor. */
html[data-tema="koyu"] body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
@media(prefers-color-scheme:dark){
  html:not([data-tema="acik"]) body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
}

/* Tema düğmesi (üst menü) */
.tema-dugme{width:40px;height:40px;flex:0 0 auto;display:inline-flex;align-items:center;
  justify-content:center;background:transparent;border:1px solid var(--cizgi);border-radius:999px;
  color:inherit;cursor:pointer;padding:0;
  transition:border-color .3s,background .3s,color .3s}
.tema-dugme:hover{border-color:var(--brass);color:var(--brass)}
.tema-dugme svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;
  stroke-linecap:round;stroke-linejoin:round}
.tema-gunes{display:none}
html[data-tema="koyu"] .tema-ay{display:none}
html[data-tema="koyu"] .tema-gunes{display:block}
@media(prefers-color-scheme:dark){
  html:not([data-tema="acik"]) .tema-ay{display:none}
  html:not([data-tema="acik"]) .tema-gunes{display:block}
}
*{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%;overflow:hidden}
body{
  font-family:'Onest',sans-serif;
  background:var(--ivory);
  color:var(--forest);
  -webkit-font-smoothing:antialiased;
}
::selection{background:var(--brass);color:var(--ivory)}
button{font-family:inherit;background:none;border:none;cursor:pointer;color:inherit}
a{color:inherit;text-decoration:none}

/* ============ PRELOADER ============ */
#preloader{
  position:fixed;inset:0;z-index:100;
  background:var(--forest-deep);color:var(--ivory);
  display:flex;flex-direction:column;justify-content:space-between;
  padding:clamp(24px,4vw,56px);
  transition:transform 1.1s var(--ease);
}
#preloader.done{transform:translateY(-100%)}
.pre-top{display:flex;justify-content:space-between;align-items:flex-start;font-size:12px;letter-spacing:.18em;text-transform:uppercase;opacity:.7}
/* ===== PRELOADER V2 — AÇILIŞ SAHNESİ ===== */
.pre-koordinat{font-family:ui-monospace,'SFMono-Regular',Menlo,Consolas,monospace;
  letter-spacing:.14em;text-transform:none;opacity:.6;font-variant-numeric:tabular-nums}
.pre-sahne{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:clamp(12px,2.2vh,24px);position:relative;min-height:0}
/* Motif: tenant koordinatından üretilen desen KENDİNİ ÇİZER (pathLength=1 → tek kural) */
.pre-motif{position:relative;width:min(58vw,470px);aspect-ratio:620/520;color:var(--brass);opacity:.92}
.pre-motif svg{position:absolute;inset:0;width:100%;height:100%}
/* viewBox 620 birim → ~470px'e küçülüyor; SVG'nin kendi 0.8–2.2 birimlik çizgileri
   0.6–1.7px'e inip görünmez oluyordu. Preloader'da çizgi kalınlığını CSS'ten sabitliyoruz
   (CSS, sunum niteliğini ezer) — çizim okunur olsun. */
.pre-motif svg path{stroke-width:3.4;stroke-dasharray:1;stroke-dashoffset:1;
  animation:motifCiz 1.6s var(--ease) .25s forwards}
.pre-motif svg circle{stroke-width:3.2;opacity:0;transform-box:fill-box;transform-origin:center;
  animation:halkaBelir .55s var(--ease) 1.85s forwards}
@keyframes motifCiz{to{stroke-dashoffset:0}}
@keyframes halkaBelir{0%{opacity:0;transform:scale(.9)}62%{opacity:1;transform:scale(1.06)}100%{opacity:1;transform:scale(1)}}
/* Wordmark — harf-stagger (gecikmeler JS'ten: CSP'de inline style attribute yok) */
.pre-marka{display:flex;flex-wrap:wrap;justify-content:center;gap:.04em;
  font-family:'Newsreader',serif;font-weight:400;font-size:clamp(19px,3vw,32px);
  letter-spacing:.18em;text-transform:uppercase;color:var(--ivory)}
.pre-marka span{opacity:0;transform:translateY(14px);animation:markaGir .5s var(--ease) forwards}
.pre-logo{max-height:clamp(28px,5vh,50px);width:auto;opacity:0;animation:markaGir .6s var(--ease) .15s forwards}
@keyframes markaGir{to{opacity:1;transform:translateY(0)}}
/* İstatistikler artık merkez sahnenin akışında (mutlak katman değil) */
/* Tüm istatistikler AYNI grid hücresinde üst üste → çapraz geçiş temiz görünür
   (mutlak konumda dikeyde ortalanmıyor, satırlar birbirinin üstüne biniyordu) */
.pre-stats{display:grid;place-items:center;pointer-events:none;width:100%;min-height:clamp(64px,10vh,96px)}
.pre-stat{
  grid-area:1/1;position:static;text-align:center;opacity:0;transform:translateY(14px);
  transition:opacity .5s ease,transform .5s ease;
}
.pre-stat.show{opacity:1;transform:translateY(0)}
.pre-stat .num{font-family:'Newsreader',serif;font-weight:400;font-size:clamp(30px,4.6vw,58px);line-height:1;color:var(--brass-soft)}
.pre-stat .lbl{margin-top:6px;font-size:11px;letter-spacing:.3em;text-transform:uppercase;opacity:.75}
/* KISA SÜRÜM (24 saat içinde tekrar ziyaret): çizim atlanır, motif hazır gelir, dikiş AYNI */
#preloader.pre-kisa .pre-motif svg path{animation:none;stroke-dashoffset:0}
#preloader.pre-kisa .pre-motif svg circle{animation:none;opacity:1}
#preloader.pre-kisa .pre-marka span,#preloader.pre-kisa .pre-logo{animation-duration:.26s}
@media(prefers-reduced-motion:reduce){
  .pre-motif svg path{stroke-dashoffset:0}
  .pre-motif svg circle{opacity:1}
}
/* BİNA CEPHESİ (preloader): yapı hatları yukarıdaki motifCiz kuralıyla kendini çizer;
   pencereler soldan sağa (sütun sütun) "yanar". Kalınlıklar sınıf bazlı ayrışır. */
.pre-bina svg path.bina-hat{stroke-width:3.2}
.pre-bina svg path.bina-ince{stroke-width:1.7}
/* Yapı çizimi hızlandı (preloader 2.4s'e sığsın, bitmiş bina bir an görünsün) */
.pre-bina svg path{animation-duration:1.05s;animation-delay:.15s}
.pre-bina .bina-pencere{stroke:currentColor;stroke-width:1.5;opacity:0;
  animation:pencereYan .45s var(--ease) forwards}
.pre-bina .bina-dolu{fill:currentColor;fill-opacity:.15}
.pre-bina .bina-pencereler>g:nth-child(1) .bina-pencere{animation-delay:.72s}
.pre-bina .bina-pencereler>g:nth-child(2) .bina-pencere{animation-delay:.90s}
.pre-bina .bina-pencereler>g:nth-child(3) .bina-pencere{animation-delay:1.08s}
.pre-bina .bina-pencereler>g:nth-child(4) .bina-pencere{animation-delay:1.26s}
.pre-bina .bina-pencereler>g:nth-child(5) .bina-pencere{animation-delay:1.44s}
@keyframes pencereYan{from{opacity:0}to{opacity:1}}
#preloader.pre-kisa .pre-bina .bina-pencere{animation:none;opacity:1}
@media(prefers-reduced-motion:reduce){.pre-bina .bina-pencere{animation:none;opacity:1}}
.pre-bottom{display:flex;justify-content:space-between;align-items:flex-end}
#pre-count{font-family:'Newsreader',serif;font-weight:400;font-size:clamp(40px,6vw,84px);line-height:1;font-variant-numeric:tabular-nums}
#pre-status{font-size:12px;letter-spacing:.18em;text-transform:uppercase;opacity:.7}
.pre-bar{position:absolute;left:0;bottom:0;height:2px;background:var(--brass);width:0%;transition:width .25s ease}
/* ===== MADDE 1: PRELOADER → HERO DİKİŞİ ===== */
/* İki katman perde: koyu (#preloader z:100) + marka altlığı (#preloader-alt z:99) 80ms arkadan */
#preloader-alt{position:fixed;inset:0;z-index:99;background:var(--brass);pointer-events:none;
  transform:translateY(0);transition:transform 1.1s var(--ease) .08s}
#preloader-alt.done{transform:translateY(-100%)}
/* Sayaç %100'de ölçeklenip solar — yerini başlık reveal'ına bırakır */
#preloader.done #pre-count{transform:scale(1.15);opacity:0;transition:transform .5s var(--ease),opacity .5s var(--ease)}
/* İlk slayt görseli tek seferlik "nefes" (1.15→1.02, sonra kenburns'e devreder) */
.slide.hero-nefes .slide-gorsel img{animation:heroNefes 1.35s var(--ease) both!important}
@keyframes heroNefes{from{transform:scale(1.15)}to{transform:scale(1.02)}}
/* Preloader aktifken hero (slayt 0) reveal'ı BEKLER; .on-preloader kalkınca dikişle başlar */
/* Not: transition:none KOYMUYORUZ — koyarsak .on-preloader kalkınca reveal transition'ı
   tetiklenmiyor (none→timed tuzağı). Sadece transform/opacity'yi !important ile tutuyoruz;
   sınıf kalkınca temel transition'lar (gecikmeleriyle) devreye girer. */
body.on-preloader .slide.active .kicker,
body.on-preloader .slide.active .slide-body,
body.on-preloader .slide.active .cta{opacity:0!important;transform:translateY(12px)!important}
body.on-preloader .slide.active .headline .line span{transform:translateY(112%) rotate(2.5deg) skewY(2.5deg)!important}
body.on-preloader .slide.active .headline em{opacity:0!important;transform:translateY(50%)!important}
body.on-preloader .slide.has-gorsel.active .slide-gorsel{-webkit-clip-path:inset(100% 0 0 0)!important;clip-path:inset(100% 0 0 0)!important}

/* ============ HEADER ============ */
header{
  position:fixed;top:0;left:0;right:0;z-index:60;
  display:flex;align-items:center;justify-content:space-between;
  padding:clamp(18px,3vw,32px) clamp(24px,4vw,56px);
  transition:color .6s ease;
}
.logo{font-family:'Newsreader',serif;font-size:22px;letter-spacing:.02em;font-weight:500}
.logo em{font-style:italic;color:var(--brass)}
/* Yüklenen (koyu-zemin) logo görseli — tipografik logotype yerine */
/* Logo + ofis adı yan yana. line-height:0 YALNIZ görsele uygulanır —
   eskiden .logo-img üzerindeydi ve yanına metin eklenince yazı eziliyordu. */
.logo-img{display:inline-flex;align-items:center;gap:10px}
.logo-img img{line-height:0}
.logo-ad{line-height:1.1;white-space:nowrap}
@media (max-width:520px){.logo-ad{display:none}}   /* dar ekranda simge yeter */
.logo-img img{height:clamp(26px,3.2vw,38px);width:auto;max-width:min(46vw,240px);display:block;object-fit:contain}
.kw-nav{display:flex;gap:clamp(14px,2vw,30px)}
.kw-nav button{
  font-size:11px;letter-spacing:.22em;text-transform:uppercase;opacity:.45;
  padding:6px 0;position:relative;transition:opacity .4s ease;
}
.kw-nav button::after{
  content:"";position:absolute;left:0;right:100%;bottom:0;height:1px;
  background:currentColor;transition:right .5s var(--ease);
}
.kw-nav button.active{opacity:1}
.kw-nav button.active::after{right:0}
.kw-nav button:hover{opacity:.85}
.menu-btn{font-size:11px;letter-spacing:.24em;text-transform:uppercase;display:flex;align-items:center;gap:10px}
.menu-btn .dot{width:6px;height:6px;border-radius:50%;background:var(--brass);transition:transform .4s ease}
.menu-btn:hover .dot{transform:scale(1.6)}
body.on-dark header{color:var(--ivory)}

/* ============ SLIDES ============ */
main{position:fixed;inset:0}
.slide{
  position:absolute;inset:0;
  display:flex;flex-direction:column;justify-content:center;
  padding:clamp(90px,12vh,140px) clamp(24px,4vw,56px) clamp(110px,14vh,150px);
  opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity var(--dur) var(--ease),visibility 0s linear var(--dur);
}
.slide.active{opacity:1;visibility:visible;pointer-events:auto;z-index:2;transition:opacity .6s var(--ease)}
.slide.dark{background:var(--forest);color:var(--ivory)}
.slide.light{background:var(--ivory);color:var(--forest)}
.slide.deep{background:var(--forest-deep);color:var(--ivory)}
/* ===== MADDE 2: DEVRALMA GEÇİŞİ (crossfade değil) =====
   Giden slayt sahnede ~450ms kalır: yön-duyarlı parallax + kararma + solma; görseli açık kalır. */
.slide.leaving{
  visibility:visible;pointer-events:none;opacity:0;z-index:1;filter:brightness(.5);
  transition:opacity .45s var(--ease),transform .55s var(--ease),filter .45s var(--ease);
}
main.yon-asagi .slide.leaving{transform:translateY(-6%)}   /* sonrakine geçerken yukarı kayar */
main.yon-yukari .slide.leaving{transform:translateY(6%)}   /* öncekine dönerken aşağı kayar */
.slide.leaving .slide-gorsel{-webkit-clip-path:inset(0)!important;clip-path:inset(0)!important;transition:none}

.kicker{
  font-size:12px;letter-spacing:.32em;text-transform:uppercase;color:var(--brass);
  margin-bottom:clamp(18px,3vh,32px);display:flex;align-items:center;gap:14px;
  opacity:0;transform:translateY(12px);transition:opacity .8s ease .3s,transform .8s ease .3s;
}
.slide.active .kicker{opacity:1;transform:translateY(0)}
.kicker::before{content:"";width:34px;height:1px;background:var(--brass)}

h1,h2{font-family:'Newsreader',serif;font-weight:400;line-height:1.02;letter-spacing:-.015em}
.headline{font-size:clamp(44px,8.6vw,124px)}
.headline.kucuk{font-size:clamp(34px,5vw,72px)}      /* portföy + kvkk başlıkları */
.headline .line span.acik{transform:none}            /* önizlemede reveal'ı atla */
.headline .line{display:block;overflow:hidden}
/* MADDE 3: satır düz yukarı çıkmaz — sol-alt eksenden hafif rotate+skew ile çıkıp yerine oturur */
.headline .line span{
  display:block;transform-origin:left bottom;
  transform:translateY(112%) rotate(2.5deg) skewY(2.5deg);
  transition:transform 1s var(--ease);
}
.slide.active .headline .line:nth-child(1) span{transition-delay:.25s}
.slide.active .headline .line:nth-child(2) span{transition-delay:.37s}
.slide.active .headline .line:nth-child(3) span{transition-delay:.49s}
.slide.active .headline .line span{transform:translateY(0) rotate(0deg) skewY(0deg)}
.headline em{font-style:italic;color:var(--brass);font-weight:400}
/* MADDE 3: <em> vurgu satırın gerisinden ~80ms gecikmeli girer ("sahneye sonradan giren oyuncu").
   Yalnız slaytlarda; alt sayfa başlıklarındaki em (portföy/kvkk) normal görünür kalır. */
.slide .headline em{
  display:inline-block;transform:translateY(50%);opacity:0;
  transition:transform .8s var(--ease),opacity .6s var(--ease);
}
.slide.active .headline .line:nth-child(1) em{transition-delay:.33s}
.slide.active .headline .line:nth-child(2) em{transition-delay:.45s}
.slide.active .headline .line:nth-child(3) em{transition-delay:.57s}
.slide.active .headline em{transform:translateY(0);opacity:1}
.headline .line span.acik em{transform:none;opacity:1;transition:none}  /* önizleme: vurgu direkt görünür */

.slide-body{
  margin-top:clamp(24px,4vh,44px);max-width:520px;
  font-size:clamp(14px,1.3vw,17px);line-height:1.75;opacity:0;transform:translateY(14px);
  transition:opacity .9s ease .65s,transform .9s ease .65s;
}
.slide.dark .slide-body,.slide.deep .slide-body{opacity:0;color:rgba(239,233,221,.82)}
.slide.light .slide-body{color:rgba(23,51,42,.78)}
.slide.active .slide-body{opacity:1;transform:translateY(0)}

/* ============ SLAYT ARKA PLAN GÖRSELİ (FAZ 9) ============ */
.slide.has-gorsel{background:var(--forest-deep)}          /* görsel yüklenene kadar koyu zemin */
.slide-gorsel{position:absolute;inset:0;z-index:0;overflow:hidden}
.slide-gorsel img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
/* ===== SEKANS ZEMİNİ (MOD B: tek sürekli video, slaytların ARKASINDA tek eleman) ===== */
#sekansKatman{position:fixed;inset:0;z-index:0;overflow:hidden;background:var(--forest-deep)}
#sekansKatman img,#sekansVideo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
#sekansVideo{opacity:0;transition:opacity .8s var(--ease)}   /* hazır olunca posterin üstüne geçer */
#sekansVideo.hazir{opacity:1}
/* Sekans aktifken slaytlar ŞEFFAF olmalı; yoksa opak zemin ortak videoyu kapatır.
   Slayt başına yalnız kontrast örtüsü + grain kalır (her slaydın metni farklı). */
body.sekans-aktif .slide,
body.sekans-aktif .slide.dark,
body.sekans-aktif .slide.light,
body.sekans-aktif .slide.deep,
body.sekans-aktif .slide.has-gorsel{background:transparent}
/* Yedek katman DOM'da durur ama sekans çalışırken görünmez; sekans düşerse
   (reduced-motion / seek yok) body'den .sekans-aktif kalkar ve bunlar devreye girer. */
body.sekans-aktif .slide-gorsel img{display:none}
body.sekans-aktif .slide-motif{display:none}

/* Slayt zemin VİDEOSU (MOD A: slayt-başı döngü). Poster <img> ALTTA kalır: video
   yüklenemez/oynatılamazsa opacity 0'da kalır ve poster kalıcı fallback olur. */
.slide-video{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:0;transition:opacity .7s var(--ease);pointer-events:none;
}
.slide-video.hazir{opacity:1}
.slide-ortu{position:absolute;inset:0;background:
  linear-gradient(to top, var(--ortu-alt), var(--ortu-ust) 58%, transparent),
  linear-gradient(115deg, rgba(0,0,0,.30), transparent 55%);}
.slide-grain{position:absolute;inset:0;background:url(/assets/img/grain.png) repeat;opacity:.05;pointer-events:none;mix-blend-mode:overlay}
/* içerik daima görselin ÜSTÜNDE */
.slide.has-gorsel>.kicker,.slide.has-gorsel>.headline,.slide.has-gorsel>.slide-body,
.slide.has-gorsel>.cta,.slide.has-gorsel>.cta-grup,.slide.has-gorsel>.contact-grid,
.slide.has-gorsel>.ghost{position:relative;z-index:2}
/* reveal: aktif slaytta perde (clip-path) açılışı — MADDE 2 yön-duyarlı (varsayılan alttan) */
/* :not(.active) ZORUNLU — aksi hâlde "main.yon-yukari ..." (0,4,1) özgüllükte
   ".slide.has-gorsel.active ..." (0,4,0) kuralını yener ve ÖNCEKİ slayda dönerken
   aktif slaytın görseli kırpılı (görünmez) kalırdı. */
.slide.has-gorsel:not(.active) .slide-gorsel{-webkit-clip-path:inset(100% 0 0 0);clip-path:inset(100% 0 0 0)}
main.yon-yukari .slide.has-gorsel:not(.active) .slide-gorsel{-webkit-clip-path:inset(0 0 100% 0);clip-path:inset(0 0 100% 0)} /* öncekine dönerken üstten */
.slide.has-gorsel.active .slide-gorsel{-webkit-clip-path:inset(0 0 0 0);clip-path:inset(0 0 0 0);transition:-webkit-clip-path 1.1s var(--ease),clip-path 1.1s var(--ease)}
/* Ken Burns: yalnız aktif görselde, transform-only (GPU-dostu) */
.slide.has-gorsel.active .slide-gorsel img{animation:kenburns 32s ease-in-out infinite alternate}
@keyframes kenburns{from{transform:scale(1.02) translate(0,0)}to{transform:scale(1.09) translate(-1.5%,-1%)}}

/* ============ FAZ 11 ZEMİN — GÖRSELSİZ SLAYT KATMAN PAKETİ ============ */
/* Görselsiz metin slaytları sola sıkışmasın: içerik kolonu genişler + sağ boşluğa
   deterministik harita motifi gelir. Görsel varsa .has-gorsel kazanır (motif gizli). */
.slide-motif{
  position:absolute;top:0;right:0;bottom:0;width:58%;z-index:0;
  color:var(--brass);opacity:.08;pointer-events:none;overflow:hidden;will-change:transform;
  -webkit-mask-image:linear-gradient(to left,#000 52%,transparent);
          mask-image:linear-gradient(to left,#000 52%,transparent);
}
.slide-motif .motif-svg{position:absolute;inset:-4% -4% -4% -4%;width:108%;height:108%}
.slide.has-gorsel .slide-motif{display:none}
/* içerik motifin ÜSTÜNDE (has-gorsel için zaten z:2; görselsizde z:1) */
.slide>.kicker,.slide>.headline,.slide>.slide-body,.slide>.cta,.slide>.cta-grup,
.slide>.cards,.slide>.contact-grid{position:relative;z-index:1}
/* içerik kolonu genişler — satır uzunluğu ekranın ~%56'sına ulaşır + ritim sıkışır */
.headline{max-width:min(58vw,940px)}
.slide-body{max-width:min(54vw,600px);margin-top:clamp(18px,2.6vh,32px)}
.cta,.cta-grup{margin-top:clamp(18px,2.6vh,30px)}

/* Köşe koordinat imzası (sağ-üst, utility mono) — slayt rengine uyar (currentColor) */
.slayt-koordinat{
  position:absolute;top:clamp(78px,11vh,120px);right:clamp(20px,4vw,56px);z-index:1;
  font-family:ui-monospace,'SFMono-Regular',Menlo,Consolas,monospace;
  font-size:11px;letter-spacing:.14em;opacity:.42;pointer-events:none;font-variant-numeric:tabular-nums;
}
/* Ghost rakamı sağ-alt köşeye tam otursun (metinle örtüşmesin) */
.ghost{right:clamp(12px,2.5vw,36px);bottom:clamp(20px,5vh,60px);font-size:clamp(96px,17vw,240px)}
/* Görselli slaytta ghost akışta (sol) kalıp içeriği yukarı itiyordu → absolute'a geri al
   (z-index:2 has-gorsel kuralından gelir; görselin üstünde sağ-altta durur) */
.slide.has-gorsel>.ghost{position:absolute}

@media(max-width:900px){
  .slide-motif{width:100%;opacity:.055;
    -webkit-mask-image:linear-gradient(to top,#000 38%,transparent);mask-image:linear-gradient(to top,#000 38%,transparent)}
  .headline{max-width:none}
  .slide-body{max-width:none}
  .slayt-koordinat{top:auto;bottom:clamp(74px,12vh,108px);font-size:10px}
}

/* ============ FAZ 11 SAHNELER — her slayt kendi kurulumu ============ */

/* --- S2 GÜVEN: 55/45 bölünmüş sahne; medya SAĞ PANEL, metin solda --- */
@media(min-width:901px){
  .sahne-2 .slide-gorsel{left:auto;right:0;width:45%}      /* tam ekran değil, dikey panel */
  .sahne-2 .slide-motif{width:45%;opacity:.09;
    -webkit-mask-image:linear-gradient(to left,#000 80%,transparent);
            mask-image:linear-gradient(to left,#000 80%,transparent)}
  /* Metin panelin ÜSTÜNDE değil SOLUNDA → ağır kontrast örtüsü gereksiz; fotoğrafı
     boğmasın, yalnız sol kenarı zemine doğru eritsin. */
  .sahne-2 .slide-ortu{background:linear-gradient(to right,
    rgba(15,36,29,.96) 0%, rgba(15,36,29,.22) 26%, rgba(15,36,29,.06) 100%)}
  .sahne-2 .headline{max-width:min(46vw,620px);font-size:clamp(36px,5.4vw,80px)}
  .sahne-2 .slide-body{max-width:min(42vw,520px)}
  .sahne-2 > .ghost{display:none}      /* sahnenin rakamı ghost YIL; iki dev rakam kalabalık yapıyordu */
}
/* Ghost yıl — panelin sol kenarına biner (Newsreader italik, çok silik) */
.sahne-yil{
  position:absolute;right:38%;bottom:14%;z-index:1;
  font-family:'Newsreader',serif;font-style:italic;font-weight:400;
  font-size:clamp(90px,15vw,220px);line-height:1;opacity:.08;
  pointer-events:none;user-select:none;
}

/* --- S3 PORTFÖY: editoryal kolaj (1 büyük + 2 küçük, asimetrik) --- */
@media(min-width:901px){
  /* Yükseklik SINIRLI olmalı: satırlar içeriğe göre büyüyünce kolaj ekranı taşırıyordu. */
  .sahne-3 .cards{
    grid-template-columns:1.55fr 1fr;grid-template-rows:repeat(2,minmax(0,1fr));
    max-width:1040px;height:min(45vh,404px);           /* içerik dikeyde header'a taşmasın */
  }
  .sahne-3 .cards .card:first-child{grid-row:1 / span 2}   /* büyük kart iki satırı kaplar */
  .sahne-3 .cards .card{min-height:0;display:flex;flex-direction:column;overflow:hidden}
  .sahne-3 .card-visual{min-height:0}
  .sahne-3 .cards .card:first-child .card-visual{flex:1}
  /* Küçük kartlarda görsel oransal pay alsın (yoksa ince şeride iniyordu) */
  .sahne-3 .cards .card:not(:first-child) .card-visual{flex:0 0 38%}  /* fiyat satırı kırpılmasın */
  .sahne-3 .card-visual img,.sahne-3 .card-visual svg{width:100%;height:100%;object-fit:cover}
}
/* Küratör notu — el yazısı hissi (mevcut tema serifi, italik) */
.sahne-not{
  margin-top:8px;font-family:'Newsreader',serif;font-style:italic;font-weight:400;
  font-size:clamp(15px,1.5vw,20px);color:var(--brass);letter-spacing:.01em;
  opacity:0;transform:translateY(10px);transition:opacity .8s var(--ease) .5s,transform .8s var(--ease) .5s;
}
.slide.active .sahne-not{opacity:.95;transform:translateY(0)}

/* --- S4 UZMANLIK: rakamlarla konuşan sahne (3 blok, count-up) --- */
.headline.headline-kisa{font-size:clamp(30px,4.6vw,64px);max-width:min(52vw,760px)}
.sayilar{display:flex;flex-wrap:wrap;gap:clamp(28px,5vw,72px);margin-top:clamp(28px,5vh,56px)}
.sayi-blok{opacity:0;transform:translateY(18px);
  transition:opacity .7s var(--ease),transform .7s var(--ease)}
.slide.active .sayi-blok{opacity:1;transform:translateY(0)}
.slide.active .sayi-blok:nth-child(2){transition-delay:.12s}
.slide.active .sayi-blok:nth-child(3){transition-delay:.24s}
.sayi-deger{font-family:'Newsreader',serif;font-weight:400;line-height:.95;
  font-size:clamp(52px,8vw,116px);color:var(--brass-soft);font-variant-numeric:tabular-nums}
.sayi-etiket{margin-top:10px;font-size:12px;letter-spacing:.22em;text-transform:uppercase;opacity:.72;max-width:16ch}

/* --- Büyük CTA (S5 harita daveti, S6 WhatsApp) --- */
.cta-buyuk{font-size:13px;padding:14px 26px 14px 14px;border:1px solid currentColor;border-radius:999px;
  background:rgba(20,40,33,.4);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transition:background .4s ease,color .4s ease}
.cta-buyuk .arrow{width:48px;height:48px}
.cta-buyuk:hover{background:var(--brass);border-color:var(--brass);color:var(--ivory)}
.cta-buyuk:hover .arrow{background:transparent;border-color:currentColor}
.cta-whatsapp{border-color:#25d366}
.cta-whatsapp .arrow{border-color:#25d366;color:#25d366}
.cta-whatsapp:hover{background:#25d366;border-color:#25d366;color:#0b1b12}
.cta-whatsapp:hover .arrow{color:#0b1b12}

/* --- S5 YATIRIM: sağ stilize harita paneli (markadan üretilir; parallax) --- */
@media(min-width:901px){
  .sahne-5 .headline{max-width:min(48vw,640px)}
  .sahne-5 .slide-body{max-width:min(42vw,500px)}
}
.sahne-harita-panel{position:absolute;top:0;right:0;bottom:0;width:46%;z-index:0;overflow:hidden;
  background:linear-gradient(160deg,rgba(23,51,42,.55),rgba(11,27,21,.75));
  -webkit-mask-image:linear-gradient(to left,#000 68%,transparent);mask-image:linear-gradient(to left,#000 68%,transparent);
  will-change:transform}
.harita-panel-motif{position:absolute;inset:-6%;color:var(--brass);opacity:.34}
.harita-panel-motif .motif-svg{position:absolute;inset:0;width:100%;height:100%}
.harita-panel-pin{position:absolute;top:44%;left:52%;width:16px;height:16px;border-radius:50%;
  background:var(--brass);box-shadow:0 0 0 6px rgba(168,124,63,.25);animation:pinNabiz 2.4s var(--ease) infinite}
@keyframes pinNabiz{0%,100%{box-shadow:0 0 0 6px rgba(168,124,63,.25)}50%{box-shadow:0 0 0 14px rgba(168,124,63,.05)}}
.sahne-5>.kicker,.sahne-5>.headline,.sahne-5>.slide-body,.sahne-5>.cta,.sahne-5>.cta-buyuk{position:relative;z-index:1}

/* --- S6 İLETİŞİM: silik dev harita deseni (watermark) --- */
.sahne-iletisim-desen{position:absolute;inset:0;z-index:0;color:var(--ivory);opacity:.045;pointer-events:none;overflow:hidden}
.sahne-iletisim-desen .motif-svg{position:absolute;inset:-4%;width:108%;height:108%}
.sahne-6>.headline,.sahne-6>.contact-grid,.sahne-6>.cta-whatsapp{position:relative;z-index:1}
.sahne-6 .cta-whatsapp{margin-top:clamp(22px,4vh,40px)}

/* --- Mobil: bölünmüş sahne alt alta (medya üstte bant, metin altında) --- */
@media(max-width:900px){
  .sahne-2 .slide-gorsel{inset:0 0 auto 0;height:42%;width:100%}
  .sahne-2{justify-content:flex-end;padding-bottom:clamp(120px,18vh,170px)}
  .sahne-yil{top:5%;right:6%;bottom:auto;font-size:clamp(64px,18vw,120px)}
  .sayilar{gap:20px}.sayi-blok{flex:0 0 auto}
  .headline.headline-kisa{max-width:none}
  .sahne-harita-panel{inset:0 0 auto 0;width:100%;height:40%;
    -webkit-mask-image:linear-gradient(to top,#000 55%,transparent);mask-image:linear-gradient(to top,#000 55%,transparent)}
  .sahne-5{justify-content:flex-end;padding-bottom:clamp(110px,16vh,160px)}
  .sahne-5 .headline{max-width:none}
}

.cta{
  margin-top:clamp(24px,4vh,40px);display:inline-flex;align-items:center;gap:14px;
  font-size:12px;letter-spacing:.24em;text-transform:uppercase;font-weight:600;
  opacity:0;transform:translateY(14px);
  transition:opacity .9s ease .8s,transform .9s ease .8s;
}
.slide.active .cta{opacity:1;transform:translateY(0)}
.cta .arrow{
  width:44px;height:44px;border:1px solid currentColor;border-radius:50%;
  display:flex;align-items:center;justify-content:center;transition:background .4s ease,color .4s ease;
}
.cta:hover .arrow{background:var(--brass);border-color:var(--brass);color:var(--ivory)}
/* İki CTA yan yana (portföy slaytı: "Tüm portföyü gör" + "Haritada Keşfet") */
.cta-grup{display:flex;flex-wrap:wrap;gap:18px;align-items:center;margin-top:clamp(24px,4vh,40px)}
.cta-grup .cta{margin-top:0}

/* Slide ghost index */
.ghost{
  position:absolute;right:clamp(20px,4vw,56px);bottom:clamp(80px,10vh,120px);
  font-family:'Newsreader',serif;font-weight:400;font-style:italic;
  font-size:clamp(120px,22vw,320px);line-height:1;opacity:.05;pointer-events:none;user-select:none;
}

/* ============ PORTFOLIO SLIDE ============ */
.cards{
  display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,2vw,28px);
  margin-top:clamp(24px,4vh,40px);max-width:var(--kap-orta);
}
.card{
  border:1px solid var(--line-dark);padding:0;overflow:hidden;
  opacity:0;transform:translateY(24px);
  transition:opacity .8s ease,transform .8s ease,border-color .4s ease;
  background:rgba(239,233,221,.03);
  display:block;
}
.slide.active .card:nth-child(1){transition-delay:.5s}
.slide.active .card:nth-child(2){transition-delay:.62s}
.slide.active .card:nth-child(3){transition-delay:.74s}
.slide.active .card{opacity:1;transform:translateY(0)}
.card:hover{border-color:var(--brass)}

/* ===== FAZ 10.4 — SAYFA PERDESİ (vitrin içi geçiş) ===== */
/* İnaktifken ekran dışında + pointer-events:none. Marka renginde, üst kenarda ince brass şerit. */
.sayfa-perde{position:fixed;inset:0;z-index:200;background:var(--forest-deep);
  transform:translateY(100%);pointer-events:none;will-change:transform}
.sayfa-perde::after{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--brass)}
.sayfa-perde.kapat{transform:translateY(0);transition:transform .47s var(--ease);pointer-events:auto}
.sayfa-perde.tut{transform:translateY(0);transition:none;pointer-events:auto}
.sayfa-perde.ac{transform:translateY(-100%);transition:transform .55s var(--ease);pointer-events:auto}

/* ===== FAZ 10.6 — DOKUNSAL DETAYLAR (mikro-etkileşim) ===== */
/* Kart hover: görsel hafif zoom + kart 3px yükselir (gölge şişirme yok) + fiyat markaya akar */
.card{transition:opacity .8s ease,transform .8s ease,border-color .4s ease,box-shadow .45s var(--ease)}
.slide.active .card:hover{transform:translateY(-3px);box-shadow:0 20px 44px -30px rgba(0,0,0,.72)}
.card-visual img{transition:transform .6s var(--ease)}
.card:hover .card-visual img{transform:scale(1.06)}
.card-price{transition:color .4s ease}
.card:hover .card-price{color:var(--brass)}
/* Klavye odak halkası — marka renginde, estetik (yalnız klavye; fare tıklamasında çıkmaz) */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{
  outline:2px solid var(--brass);outline-offset:3px;border-radius:4px;
}
/* Tıklama geri bildirimi — reveal transition'lı .cta hariç (onun kendi ok animasyonu var) */
.btn,.menu-btn,.nav-btn,.btn-buyuk,.h-boyut-btn{transition:transform .12s ease,background .4s ease,color .4s ease,border-color .4s ease}
.btn:active,.menu-btn:active,.nav-btn:active,.btn-buyuk:active,.h-boyut-btn:active{transform:scale(.95)}
.cta .arrow{transition:background .4s ease,color .4s ease,transform .18s ease}
.cta:active .arrow{transform:scale(.9)}
.card-visual{
  aspect-ratio:4/3;position:relative;overflow:hidden;
  display:flex;align-items:flex-end;
}
.card:nth-child(1) .card-visual{background:linear-gradient(160deg,#26493D 0%,#0F241D 70%)}
.card:nth-child(2) .card-visual{background:linear-gradient(160deg,#3A5A4C 0%,#17332A 70%)}
.card:nth-child(3) .card-visual{background:linear-gradient(160deg,#4E4230 0%,#1E1912 70%)}
.card-visual svg{position:absolute;inset:auto 0 0 0;width:100%;opacity:.35}
.card-visual img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.card-tag{
  position:absolute;top:14px;left:14px;font-size:10px;letter-spacing:.2em;text-transform:uppercase;
  border:1px solid rgba(239,233,221,.35);padding:6px 12px;border-radius:999px;color:var(--ivory);
  background:rgba(15,36,29,.45);z-index:2;
}
.card-info{padding:clamp(16px,1.6vw,24px)}
.card-info h3{font-family:'Newsreader',serif;font-weight:400;font-size:clamp(18px,1.6vw,24px);margin-bottom:6px}
.card-meta{font-size:12px;letter-spacing:.06em;color:var(--metin-soluk);display:flex;gap:14px;flex-wrap:wrap}
.card-price{margin-top:14px;font-family:'Newsreader',serif;font-size:clamp(18px,1.7vw,26px);color:var(--brass-soft)}
.card-price .birim{font-size:13px;color:var(--metin-soluk)}

/* ============ CONTACT SLIDE ============ */
.contact-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,64px);
  margin-top:clamp(28px,5vh,52px);max-width:980px;
}
.c-block{opacity:0;transform:translateY(16px);transition:opacity .9s ease,transform .9s ease}
.slide.active .c-block:nth-child(1){transition-delay:.55s}
.slide.active .c-block:nth-child(2){transition-delay:.7s}
.slide.active .c-block{opacity:1;transform:translateY(0)}
.c-block .c-label{font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--brass);margin-bottom:14px}
.c-block .c-big{font-family:'Newsreader',serif;font-weight:400;font-size:clamp(20px,2.4vw,32px);line-height:1.35}
.c-block .c-big a{border-bottom:1px solid rgba(239,233,221,.25);transition:border-color .3s ease,color .3s ease}
.c-block .c-big a:hover{color:var(--brass-soft);border-color:var(--brass-soft)}
.c-small{margin-top:12px;font-size:13px;line-height:1.7;color:rgba(239,233,221,.6)}
.c-small a.cizgi{border-bottom:1px solid rgba(239,233,221,.25)}

/* ============ FOOTER UI ============ */
.ui-bottom{
  position:fixed;left:0;right:0;bottom:0;z-index:60;
  display:flex;align-items:flex-end;justify-content:space-between;
  padding:clamp(18px,3vw,32px) clamp(24px,4vw,56px);
  pointer-events:none;transition:color .6s ease;
}
body.on-dark .ui-bottom{color:var(--ivory)}
.counter{font-size:12px;letter-spacing:.2em;font-variant-numeric:tabular-nums}
.counter .cur{font-family:'Newsreader',serif;font-size:24px;font-weight:400}
.counter .tot{opacity:.5}
.slide-nav{display:flex;gap:12px;pointer-events:auto}
.nav-btn{
  width:52px;height:52px;border:1px solid currentColor;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  transition:background .4s ease,color .4s ease,border-color .4s ease,opacity .4s ease;
}
.nav-btn:hover:not(:disabled){background:var(--brass);border-color:var(--brass);color:var(--ivory)}
.nav-btn:disabled{opacity:.25;cursor:default}
.nav-btn svg{width:18px;height:18px}
.progress{
  position:fixed;left:0;bottom:0;height:2px;background:var(--brass);z-index:61;
  transition:width .8s cubic-bezier(.34,1.56,.64,1);   /* yayvan (spring) geçiş */
}

/* ============ WHATSAPP ============ */
/* ============ YÜZEN İLETİŞİM TUŞLARI ============
   SOL ALT telefon, SAĞ ALT WhatsApp. İkisi de YALNIZ SİMGE (metin yok; erişilebilirlik
   aria-label/title ile taşınır). Dikey konum tek değişkenden yönetilir → çerez banner'ı
   veya favori çubuğu açıldığında ikisi BİRLİKTE kalkar, ayrı hesap tutulmaz. */
:root{--float-taban:clamp(18px,3vh,30px)}
body{--float-alt:var(--float-taban)}
body.cerez-acik{--float-alt:calc(var(--float-taban) + var(--cerez-h,0px) + 10px)}
body.favori-acik{--float-alt:calc(var(--float-taban) + 76px)}
body.cerez-acik.favori-acik{--float-alt:calc(var(--float-taban) + var(--cerez-h,0px) + 86px)}

.wa-float,.tel-float{
  position:fixed;bottom:var(--float-alt);z-index:59;
  width:52px;height:52px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:var(--brass);color:var(--ivory);
  box-shadow:0 6px 20px rgba(0,0,0,.24);
  pointer-events:auto;
  transition:bottom .38s var(--ease),opacity .5s var(--ease),transform .35s var(--ease);
}
.wa-float{right:clamp(16px,3.4vw,40px)}
.tel-float{left:clamp(16px,3.4vw,40px)}
.wa-float:hover,.tel-float:hover{transform:scale(1.09)}
.wa-float:active,.tel-float:active{transform:scale(.96)}
.wa-float .wa-icon{display:flex;align-items:center;justify-content:center}

/* S6 (İletişim) aktifken ikisi de gizlenir — sahnenin kendi birincil CTA'ları var */
body.s6-aktif .wa-float,body.s6-aktif .tel-float{opacity:0;transform:scale(.7) translateY(12px);pointer-events:none}
/* İlan detayda sayfanın kendi WhatsApp butonu ekrandayken yalnız WhatsApp float'ı gizlenir
   (çift CTA olmasın). Telefon farklı bir kanal → yerinde kalır. */
body.wa-buton-gorunur .wa-float{opacity:0;transform:scale(.7) translateY(12px);pointer-events:none}
@media(prefers-reduced-motion:reduce){
  .wa-float,.tel-float{transition:none}
}

/* ============ MENU OVERLAY ============ */
#menu{
  position:fixed;inset:0;z-index:80;background:var(--forest-deep);color:var(--ivory);
  display:flex;flex-direction:column;justify-content:space-between;
  padding:clamp(24px,4vw,56px);
  clip-path:inset(0 0 100% 0);transition:clip-path .9s var(--ease);
}
#menu.open{clip-path:inset(0 0 0 0)}
.menu-top{display:flex;justify-content:space-between;align-items:center}
.menu-links{display:flex;flex-direction:column;gap:clamp(6px,1.4vh,14px)}
.menu-links button,.menu-links a.menu-link{
  font-family:'Newsreader',serif;font-weight:400;text-align:left;
  font-size:clamp(34px,6vw,72px);line-height:1.1;color:var(--ivory);
  display:flex;align-items:baseline;gap:18px;opacity:0;transform:translateY(20px);
  transition:opacity .6s ease,transform .6s ease,color .3s ease;
}
#menu.open .menu-links button,#menu.open .menu-links a.menu-link{opacity:1;transform:translateY(0)}
#menu.open .menu-links :nth-child(1){transition-delay:.25s}
#menu.open .menu-links :nth-child(2){transition-delay:.32s}
#menu.open .menu-links :nth-child(3){transition-delay:.39s}
#menu.open .menu-links :nth-child(4){transition-delay:.46s}
#menu.open .menu-links :nth-child(5){transition-delay:.53s}
#menu.open .menu-links :nth-child(6){transition-delay:.6s}
#menu.open .menu-links :nth-child(7){transition-delay:.67s}
#menu.open .menu-links :nth-child(8){transition-delay:.74s}
.menu-links button:hover,.menu-links a.menu-link:hover{color:var(--brass-soft)}
.menu-links .idx{font-size:13px;font-family:'Onest',sans-serif;letter-spacing:.2em;color:var(--brass);font-style:normal}
.menu-foot{display:flex;justify-content:space-between;align-items:center;font-size:12px;letter-spacing:.14em;opacity:.6;flex-wrap:wrap;gap:12px}
.menu-foot a:hover{color:var(--brass-soft)}

/* Sosyal medya ikonları */
.sosyal-ikonlar{display:flex;gap:14px;align-items:center}
.sosyal-ikonlar a{color:currentColor;opacity:.7;transition:opacity .3s ease,color .3s ease;display:inline-flex}
.sosyal-ikonlar a:hover{opacity:1;color:var(--brass)}
.c-sosyal{margin-top:18px;color:var(--ivory)}
/* .c-sosyal ivory: ESKI koyu slayt icin dogru. Yeni vitrinin iletisim bolumu
   krem zeminli oldugu icin ikonlar orada beyaz-uzeri-krem kaliyor (kontrast 1.2,
   pratikte gorunmez). Acik zeminde koyu renge cevriliyor. */
.v-iletisim .c-sosyal{color:var(--metin)}
.v-iletisim .c-sosyal a{opacity:.78}
.v-iletisim .c-sosyal a:hover{opacity:1;color:var(--brass)}
.menu-sosyal{opacity:1}

/* ============ RESPONSIVE ============ */
@media(max-width:900px){
  .kw-nav{display:none}
  .cards{grid-template-columns:1fr;gap:12px;max-height:52vh;overflow-y:auto;padding-right:4px}
  /* 16/7 YALNIZ eski slayt destesine ait: orada 3 kart tek slaytın yarısına (52vh)
     sığmak zorunda. Kural global bırakılırsa yeni ana sayfada ve /portfoy'da da
     uygulanıp ev fotoğraflarını ince şeride kırpıyordu (kaynak foto 3:2). */
  .sahne-3 .card-visual{aspect-ratio:16/7}
  .contact-grid{grid-template-columns:1fr;gap:24px}
  .ghost{display:none}
  .headline{font-size:clamp(40px,11vw,64px)}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}
}

/* ============================================================
   ALT SAYFALAR (portföy / ilan detay / kvkk) — tema diliyle,
   normal akışta kayan sayfalar. html'e .sayfa-modu sınıfı verilir.
   ============================================================ */
html.sayfa-modu,html.sayfa-modu body{height:auto;overflow:auto;overflow-x:hidden}
html.sayfa-modu body{background:var(--zemin);color:var(--metin)}

.s-header{
  position:sticky;top:0;z-index:60;
  display:flex;align-items:center;justify-content:space-between;
  padding:clamp(16px,2.5vw,26px) clamp(24px,4vw,56px);
  background:var(--ust-cam);border-bottom:1px solid var(--cizgi);
  -webkit-backdrop-filter:saturate(140%) blur(10px);backdrop-filter:saturate(140%) blur(10px);
}
.s-nav{display:flex;gap:clamp(16px,2.5vw,32px);align-items:center}
.s-nav a{
  font-size:11px;letter-spacing:.22em;text-transform:uppercase;opacity:.55;
  padding:6px 0;position:relative;transition:opacity .4s ease;
}
.s-nav a:hover{opacity:1}
.s-nav a.aktif{opacity:1}
.s-nav a.aktif::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:currentColor}

.s-icerik{max-width:var(--kap-orta);margin:0 auto;padding:clamp(32px,6vh,72px) clamp(24px,4vw,56px) clamp(64px,10vh,120px)}
.s-hero{margin-bottom:clamp(28px,5vh,56px)}
.s-hero .headline{font-size:clamp(40px,6.5vw,92px)}
.s-hero .kicker,.s-icerik .kicker{opacity:1;transform:none}

/* Portföy filtreleri */
.filtreler{
  display:flex;gap:clamp(14px,2vw,28px);flex-wrap:wrap;align-items:flex-end;
  padding:18px 0;border-top:1px solid var(--line-light);border-bottom:1px solid var(--line-light);
  margin-bottom:clamp(24px,4vh,44px);
}
.filtre-grup{display:flex;flex-direction:column;gap:8px}
.filtre-grup label{font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--brass)}
.filtre-grup select,.filtre-grup input{
  font-family:inherit;font-size:14px;color:var(--metin);
  background:transparent;border:none;border-bottom:1px solid var(--cizgi);
  padding:6px 2px;min-width:130px;outline:none;
}
.filtre-grup select:focus,.filtre-grup input:focus{border-bottom-color:var(--brass)}
.filtre-sonuc{margin-left:auto;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--metin-soluk)}

/* Portföy kart ızgarası (açık zemin varyantı) */
.p-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.4vw,32px)}
.p-grid .card{border-color:var(--cizgi);background:var(--yuzey);opacity:1;transform:none}
.p-grid .card-meta{color:var(--metin-soluk)}
.p-grid .card:hover{border-color:var(--brass)}
.bos-mesaj{padding:56px 0;text-align:center;color:var(--metin-soluk);font-size:15px}
.durum-rozet{
  position:absolute;top:14px;right:14px;z-index:2;
  font-size:10px;letter-spacing:.2em;text-transform:uppercase;
  background:var(--brass);color:var(--ivory);padding:6px 12px;border-radius:999px;
}

/* İlan detay */
.d-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(28px,4vw,64px);align-items:start}
.galeri-ana{
  aspect-ratio:4/3;overflow:hidden;border:1px solid var(--line-light);
  background:linear-gradient(160deg,#26493D 0%,#0F241D 70%);position:relative;
  display:flex;align-items:flex-end;
}
.galeri-ana img{width:100%;height:100%;object-fit:cover;display:block}
.galeri-ana svg{position:absolute;inset:auto 0 0 0;width:100%;opacity:.35}
.galeri-serit{display:flex;gap:10px;margin-top:12px;overflow-x:auto;padding-bottom:6px}
.galeri-serit button{
  flex:0 0 92px;aspect-ratio:4/3;overflow:hidden;border:1px solid var(--line-light);
  opacity:.65;transition:opacity .3s ease,border-color .3s ease;padding:0;
}
.galeri-serit button.aktif{opacity:1;border-color:var(--brass)}
.galeri-serit button:hover{opacity:1}
.galeri-serit img{width:100%;height:100%;object-fit:cover;display:block}

.d-baslik{font-size:clamp(30px,3.6vw,52px);line-height:1.08}
.d-fiyat{font-family:'Newsreader',serif;font-weight:400;font-size:clamp(30px,3.4vw,48px);color:var(--brass);margin:clamp(14px,2vh,24px) 0}
.d-fiyat .birim{font-size:16px;color:var(--metin-soluk)}
.d-meta{border-top:1px solid var(--cizgi);margin-top:8px}
.d-meta .satir{
  display:flex;justify-content:space-between;gap:16px;
  padding:12px 2px;border-bottom:1px solid var(--cizgi);font-size:14px;
}
.d-meta .satir .ad{color:var(--metin-soluk);letter-spacing:.06em;font-size:12px;text-transform:uppercase}
.ozellik-cipler{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.ozellik-cip{
  font-size:12px;letter-spacing:.08em;border:1px solid var(--cizgi);
  padding:8px 16px;border-radius:999px;color:var(--metin);
}
.ozellik-cip b{font-weight:600}
.d-aciklama{margin-top:clamp(24px,4vh,40px);max-width:640px;font-size:var(--y-orta);line-height:var(--sat-normal);color:var(--metin-soluk)}
.d-aciklama p{margin-bottom:1em}

.d-bolum-baslik{
  font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--brass);
  margin:clamp(26px,4vh,40px) 0 14px;display:flex;align-items:center;gap:14px;
}
.d-bolum-baslik::after{content:"";flex:1;height:1px;background:var(--cizgi)}

.harita-ph{
  margin-top:10px;aspect-ratio:21/9;border:1px dashed var(--cizgi);
  display:flex;align-items:center;justify-content:center;gap:10px;
  color:var(--metin-soluk);font-size:13px;letter-spacing:.1em;
}

/* İlan detay mini harita (tıkla → /harita?ilan=) */
.mini-harita{
  /* max-width sart: min-height yuksekligi kesinlestirince aspect-ratio genisligi
     ondan turetiyor (180 x 21/9 = 420px) ve dar telefonda kutudan tasiyordu.
     Kenetlenince dar ekranda oran bozulur, yukseklik 180px'te kalir — istenen. */
  margin-top:10px;min-height:180px;aspect-ratio:21/9;max-width:100%;
  border-radius:4px;overflow:hidden;
  border:1px solid var(--cizgi);background:var(--forest-deep);
}
.mini-harita .maplibregl-canvas{cursor:pointer}
.mini-harita-alt{
  display:flex;align-items:center;gap:12px;margin-top:8px;
  font-size:13px;letter-spacing:.06em;color:var(--metin-soluk);
}
.mini-gizli{
  font-size:11px;letter-spacing:.04em;color:var(--forest);
  background:var(--brass-soft);padding:3px 10px;border-radius:999px;
}

/* WhatsApp CTA (detay) */
.wa-buton{
  display:inline-flex;align-items:center;gap:12px;margin-top:18px;
  font-size:12px;letter-spacing:.2em;text-transform:uppercase;font-weight:600;
  border:1px solid var(--metin);border-radius:999px;padding:14px 26px;
  transition:background .35s ease,color .35s ease,border-color .35s ease;
}
.wa-buton:hover{background:var(--brass);border-color:var(--brass);color:var(--ivory)}
.wa-buton svg{width:18px;height:18px}

/* Talep formu */
.t-form{margin-top:14px;max-width:520px}
.t-form .f-grup{margin-bottom:16px}
.t-form label{display:block;font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--brass);margin-bottom:8px}
.t-form input,.t-form textarea{
  width:100%;font-family:inherit;font-size:15px;color:var(--metin);
  background:transparent;border:none;border-bottom:1px solid var(--cizgi);
  padding:10px 2px;outline:none;resize:vertical;
}
.t-form input:focus,.t-form textarea:focus{border-bottom-color:var(--brass)}
.t-gonder{
  display:inline-flex;align-items:center;gap:14px;margin-top:8px;
  font-size:12px;letter-spacing:.24em;text-transform:uppercase;font-weight:600;
}
.t-gonder .arrow{
  width:44px;height:44px;border:1px solid currentColor;border-radius:50%;
  display:flex;align-items:center;justify-content:center;transition:background .4s ease,color .4s ease;
}
.t-gonder:hover .arrow{background:var(--brass);border-color:var(--brass);color:var(--ivory)}
.form-mesaj{padding:14px 18px;border:1px solid var(--brass);color:var(--metin);font-size:14px;margin-bottom:18px}
.form-mesaj.hata{border-color:#8a1f1f;color:#8a1f1f}
.hp{position:absolute;left:-9999px;top:-9999px;height:0;overflow:hidden}
/* KVKK açık rıza kutusu — .t-form label'ın uppercase/kicker stilini normale döndürür */
.t-form .f-onay{
  display:flex;align-items:flex-start;gap:10px;margin:4px 0 16px;
  font-size:13px;letter-spacing:0;text-transform:none;color:var(--metin);line-height:1.55;
}
.t-form .f-onay input[type="checkbox"]{
  width:16px;height:16px;flex:0 0 auto;margin-top:2px;accent-color:var(--brass);
}
.t-form .f-onay a{color:var(--brass);text-decoration:underline;text-underline-offset:3px}

/* KVKK */
.kvkk-metin{max-width:720px;font-size:15px;line-height:1.9;color:var(--metin)}
.kvkk-metin p{margin-bottom:1.1em}

/* Sayfalama */
.filtre-sonuc-ust{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--metin-soluk);margin-bottom:18px}
.sayfalar{display:flex;gap:10px;justify-content:center;margin-top:clamp(28px,5vh,48px);flex-wrap:wrap}
.sayfa-no{
  min-width:44px;height:44px;border:1px solid var(--cizgi);border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  font-size:13px;letter-spacing:.06em;transition:background .3s ease,color .3s ease,border-color .3s ease;
}
a.sayfa-no:hover{border-color:var(--brass);color:var(--brass)}
.sayfa-no.aktif{background:var(--forest);border-color:var(--forest);color:var(--ivory)}

/* Lightbox */
.lb-overlay{
  position:fixed;inset:0;z-index:90;background:rgba(15,36,29,.96);
  display:none;align-items:center;justify-content:center;
}
.lb-overlay.acik{display:flex}
.lb-overlay img{max-width:88vw;max-height:84vh;object-fit:contain;display:block}
.lb-kapat{
  position:absolute;top:20px;right:24px;color:var(--ivory);font-size:22px;
  width:48px;height:48px;border:1px solid var(--line-dark);border-radius:50%;
  transition:background .3s ease;
}
.lb-kapat:hover{background:var(--brass)}
.lb-ok{
  position:absolute;top:50%;transform:translateY(-50%);color:var(--ivory);
  font-size:38px;line-height:1;width:56px;height:56px;
  border:1px solid var(--line-dark);border-radius:50%;
  display:flex;align-items:center;justify-content:center;transition:background .3s ease;
}
.lb-ok:hover{background:var(--brass)}
.lb-onceki{left:clamp(12px,3vw,40px)}
.lb-sonraki{right:clamp(12px,3vw,40px)}
.lb-sayac{
  position:absolute;bottom:22px;left:50%;transform:translateX(-50%);
  color:var(--ivory);font-size:12px;letter-spacing:.2em;opacity:.7;
}
.galeri-ana{cursor:zoom-in}

/* ============ PLATFORM (apex: pazarlama + kayıt) ============ */
.pf-nav-cta{color:var(--brass)!important;opacity:1!important}
.btn-buyuk{
  display:inline-block;background:var(--forest);color:var(--ivory);
  font-family:'Onest',sans-serif;font-size:13px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;
  padding:16px 34px;border-radius:999px;transition:background .35s ease;
}
.btn-buyuk:hover{background:var(--forest-deep)}
.btn-baglanti{color:var(--metin-soluk);font-size:14px;letter-spacing:.04em}
.btn-baglanti:hover{color:var(--brass)}

.pf-hero{padding:clamp(24px,6vh,64px) 0 clamp(32px,6vh,72px);max-width:760px}
.pf-hero .headline{font-size:clamp(38px,6vw,84px);margin-top:8px}
.pf-hero-metin{margin-top:clamp(20px,3vh,32px);font-size:clamp(15px,1.4vw,18px);line-height:var(--sat-normal);color:var(--metin-soluk);max-width:560px}
.pf-hero-cta{margin-top:clamp(24px,4vh,40px);display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.pf-hero-not{font-size:13px;color:var(--metin-soluk)}

.pf-bolum{padding:clamp(32px,6vh,64px) 0;border-top:1px solid var(--cizgi)}
.pf-ozellikler{
  display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2.5vw,32px);margin-top:8px;
}
.pf-ozellik h3{font-family:'Newsreader',serif;font-weight:400;font-size:clamp(18px,1.7vw,24px);margin-bottom:8px}
.pf-ozellik p{font-size:var(--y-orta);line-height:var(--sat-normal);color:var(--metin-soluk)}

.pf-fiyat-kart{
  border:1px solid var(--cizgi);border-radius:14px;padding:clamp(24px,4vw,44px);
  max-width:440px;background:var(--yuzey);
}
.pf-fiyat-plan{font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:var(--brass)}
.pf-fiyat-tutar{font-family:'Newsreader',serif;font-weight:400;font-size:clamp(44px,6vw,72px);line-height:1;margin:14px 0}
.pf-fiyat-donem{font-size:18px;color:var(--metin-soluk)}
.pf-fiyat-liste{list-style:none;margin:18px 0 26px}
.pf-fiyat-liste li{padding:8px 0 8px 26px;position:relative;font-size:15px;border-bottom:1px solid var(--cizgi)}
.pf-fiyat-liste li::before{content:"✓";position:absolute;left:0;color:var(--brass);font-weight:700}

.pf-kayit{max-width:520px;padding:clamp(16px,3vh,32px) 0}
.pf-form{margin-top:clamp(20px,3vh,32px)}
.pf-slug-satir{display:flex;align-items:center;gap:0}
.pf-slug-satir input{flex:1}
.pf-slug-son{
  font-size:14px;color:var(--metin-soluk);white-space:nowrap;padding-left:10px;
  border-bottom:1px solid var(--cizgi);padding-bottom:10px;
}
.pf-slug-durum{display:block;margin-top:8px;font-size:13px;min-height:18px;color:var(--metin-soluk)}
.pf-slug-durum.musait{color:#1c6b3a}
.pf-slug-durum.dolu{color:#8a1f1f}
.pf-form .btn-buyuk{margin-top:12px;border:0;cursor:pointer}
.pf-basari-linkler{margin-top:clamp(20px,3vh,32px);display:flex;align-items:center;gap:22px;flex-wrap:wrap}

@media(max-width:900px){
  .pf-ozellikler{grid-template-columns:1fr}
}

/* Alt sayfa footer */
.s-footer{
  border-top:1px solid var(--cizgi);
  padding:clamp(20px,3vh,32px) clamp(24px,4vw,56px);
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;
  font-size:12px;letter-spacing:.14em;color:var(--metin-soluk);
}
.s-footer a:hover{color:var(--brass)}

@media(max-width:900px){
  /* minmax(0,1fr) — ciplak 1fr degil. Grid ogesinin varsayilan min-width:auto'su
     onu icerigin min-content genisliginin altina indirmez; mini haritanin
     min-height:180px + aspect-ratio:21/9 kombinasyonu 420px dayatiyordu ve
     390px telefonda tum detay sutunu sagdan kesiliyordu. */
  .p-grid{grid-template-columns:minmax(0,1fr)}
  .d-grid{grid-template-columns:minmax(0,1fr)}
  .filtre-sonuc{margin-left:0;width:100%}
  .s-nav a{letter-spacing:.14em}
}

/* ÇEREZ / KVKK ONAY BANNERI (L3) */
.cerez-banner{position:fixed;left:0;right:0;bottom:0;z-index:180;display:flex;gap:16px;align-items:center;
  justify-content:center;flex-wrap:wrap;padding:14px 22px;background:var(--forest-deep);color:var(--ivory);
  box-shadow:0 -6px 24px rgba(0,0,0,.28);transform:translateY(110%);transition:transform .35s var(--ease)}
.cerez-banner.gir{transform:translateY(0)}
.cerez-banner.gizle{transform:translateY(110%)}
.cerez-metin{margin:0;font-size:14px;max-width:640px;line-height:1.5}
.cerez-metin a{color:var(--brass);text-decoration:underline}
.cerez-kabul{flex:0 0 auto;padding:9px 22px;background:var(--brass);color:var(--forest-deep);border:0;
  border-radius:4px;font-weight:600;cursor:pointer;font-size:14px;transition:filter .16s var(--ease)}
.cerez-kabul:hover{filter:brightness(1.08)}
@media(prefers-reduced-motion:reduce){.cerez-banner{transition:none}}

/* Boş portföy (yeni site, 0 yayın) — tema diliyle zarif hazırlanıyor sahnesi */
.bos-portfoy{padding:64px 0 40px;text-align:center}
.bos-portfoy .kicker{justify-content:center}
.bos-portfoy .headline{margin:14px auto 0}
.bos-portfoy p{max-width:52ch;margin:18px auto 0;color:var(--metin-soluk);font-size:var(--y-orta);line-height:var(--sat-normal)}
/* .cta normalde slayt animasyonuyla görünür olur (opacity:0 başlar) — slayt dışında zorla görünür */
.bos-portfoy .cta{margin-top:26px;opacity:1;transform:none}

/* ========================================================================
   YENİ VİTRİN (body.v2) — bölümlü, normal kayan ana sayfa.
   Slayt destesinden farkı: içerik kaydırınca açılır (slayt aktivasyonu yok).
   Tüm kurallar body.v2 altında; eski ana sayfa ve alt sayfalar ETKİLENMEZ.
   ====================================================================== */
body.v2{background:var(--zemin);color:var(--metin);overflow-x:hidden}
body.v2.menu-acik{overflow:hidden}

/* Slayt aktivasyonuna bağlı gizlilikleri nötrle (v2'de içerik hep var) */
body.v2 .kicker{opacity:1;transform:none;transition:none}
body.v2 .card{opacity:1;transform:none}
body.v2 .headline .line span{transform:none;transition:none}

/* Klavye kullanıcısı için içeriğe atla */
.atla{position:absolute;left:-9999px;top:0;z-index:300;background:var(--forest-deep);
  color:var(--ivory);padding:12px 20px;font-size:14px}
.atla:focus{left:8px;top:8px}

/* ---------------- HEADER ---------------- */
.v-header{position:fixed;top:0;left:0;right:0;z-index:100;
  transition:background .4s var(--ease),border-color .4s var(--ease)}
.v-header.zeminli{background:var(--ust-cam);border-bottom:1px solid var(--cizgi);
  -webkit-backdrop-filter:saturate(140%) blur(10px);backdrop-filter:saturate(140%) blur(10px)}
/* Hero'nun üstündeyken başlık saydam ve yazılar AÇIK (koyu görsel üzerinde);
   sayfa kayınca tek zeminin üstüne gelir, yazılar tema metnine döner. */
.v-header.zeminli .logo,.v-header.zeminli .v-nav a,.v-header.zeminli .v-tel,
.v-header.zeminli .tema-dugme{color:var(--metin)}
.v-header.zeminli .v-tel,.v-header.zeminli .tema-dugme{border-color:var(--cizgi)}
.v-header.zeminli .v-menu-ac span{background:var(--metin)}
.v-header .tema-dugme{border-color:rgba(255,255,255,.32);color:var(--ivory)}
.v-header-ic{max-width:var(--kap-genis);margin:0 auto;padding:14px clamp(18px,4vw,44px);
  display:flex;align-items:center;gap:20px}
.v-header .logo{color:var(--ivory);font-family:'Newsreader',serif;font-size:clamp(19px,2.4vw,26px);
  font-weight:400;letter-spacing:.01em;white-space:nowrap}
.v-header .logo em{color:var(--brass);font-style:normal}
.v-header .logo-img img{height:34px;width:auto;display:block}

.v-nav{display:none;margin-left:auto;gap:clamp(18px,2.6vw,38px)}
.v-nav a{color:var(--ivory);font-size:13px;letter-spacing:.14em;text-transform:uppercase;
  font-weight:500;opacity:.86;transition:opacity .3s,color .3s}
.v-nav a:hover{opacity:1;color:var(--brass-soft)}

.v-header-eylem{margin-left:auto;display:flex;align-items:center;gap:14px}
.v-tel{display:none;color:var(--ivory);font-size:14px;font-weight:600;letter-spacing:.04em;
  border:1px solid rgba(255,255,255,.28);padding:9px 18px;border-radius:999px;
  transition:background .3s,border-color .3s,color .3s}
.v-tel:hover{background:var(--brass);border-color:var(--brass);color:var(--forest-deep)}

.v-menu-ac{width:42px;height:42px;display:flex;flex-direction:column;justify-content:center;
  align-items:center;gap:5px;background:none;border:0;cursor:pointer;padding:0}
.v-menu-ac span{display:block;width:22px;height:1.5px;background:var(--ivory);
  transition:transform .3s,opacity .3s}
.v-menu-ac[aria-expanded="true"] span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.v-menu-ac[aria-expanded="true"] span:nth-child(2){opacity:0}
.v-menu-ac[aria-expanded="true"] span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}

.v-mobil-menu{background:var(--forest-deep);border-top:1px solid var(--line-dark);
  padding:8px clamp(18px,4vw,44px) 22px;display:flex;flex-direction:column}
/* display:flex, tarayıcının [hidden]{display:none} varsayılanını EZER —
   bu kural olmadan mobil menü kapalıyken de görünür ve sayfayı yana taşırır. */
.v-mobil-menu[hidden]{display:none}
.v-mobil-menu a{color:var(--ivory);padding:15px 0;font-size:16px;
  border-bottom:1px solid rgba(255,255,255,.08)}
.v-mobil-menu a:last-child{border-bottom:0}

@media(min-width:900px){
  .v-nav{display:flex}
  .v-tel{display:inline-block}
  .v-menu-ac{display:none}
  .v-mobil-menu{display:none!important}
}

/* ---------------- HERO ---------------- */
.v-hero{position:relative;min-height:100vh;min-height:100svh;display:flex;flex-direction:column;
  justify-content:center;overflow:hidden;isolation:isolate;
  padding:104px clamp(20px,5vw,56px) calc(var(--float-alt, 24px) + 52px + 84px)}
.v-hero-zemin{position:absolute;inset:0;z-index:-1;background:var(--forest-deep)}
.v-hero-zemin img,.v-hero-zemin video{position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;display:block}
.v-hero-zemin video{opacity:0;transition:opacity 1.1s var(--ease)}
.v-hero-zemin video.hazir{opacity:1}
/* Hero yüksekliği panelden seçilir (tenant_settings.hero_boyut).
   TAM (varsayılan): 100svh — mobilde adres çubuğu açılıp kapanırken zıplamaz;
   üstteki 100vh satırı svh bilmeyen eski tarayıcıların yedeği.
   BANT: ekranın üst kısmı, ilanlar ilk ekranda görünmeye başlar. İçerik uzunsa (mobil)
   min-height aşılır, kesilmez. Alt şerit absolute olduğundan alt boşluk büyütüldü. */
.v-hero.bant{min-height:min(66svh,640px)}
.v-hero.bant .v-kaydir{display:none}
.v-hero-ortu{position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(10,26,21,.62) 0%,rgba(10,26,21,.38) 42%,rgba(10,26,21,.82) 100%)}

.v-hero-ic{max-width:var(--kap-genis);width:100%;margin:0 auto;color:var(--ivory)}
.v-hero-baslik{color:var(--ivory);font-size:clamp(34px,6.4vw,78px);max-width:16ch;
  margin-bottom:clamp(22px,3.4vh,38px)}
.v-hero-baslik em{color:var(--brass-soft)}

/* Arama: hero'nun tek kararı */
.v-ara{display:flex;flex-direction:column;gap:10px;max-width:660px;
  background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.22);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:14px;border-radius:4px}
.v-ara-alan{display:flex;flex-direction:column;gap:5px;flex:1 1 0}
.v-ara-alan label{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--brass-soft)}
.v-ara select{width:100%;font-family:inherit;font-size:15px;color:var(--metin);
  background-color:var(--ivory);border:1px solid transparent;border-radius:2px;padding:12px 34px 12px 12px;
  -webkit-appearance:none;appearance:none;cursor:pointer;
  background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2317332A' stroke-width='1.6'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 10px center;background-size:17px}
.v-ara select:focus{outline:2px solid var(--brass);outline-offset:1px}
.v-ara-btn{display:flex;align-items:center;justify-content:center;gap:9px;
  background:var(--brass);color:var(--forest-deep);border:0;border-radius:2px;
  padding:14px 26px;font-family:inherit;font-size:13px;font-weight:700;
  letter-spacing:.18em;text-transform:uppercase;cursor:pointer;transition:filter .3s}
.v-ara-btn:hover{filter:brightness(1.09)}

.v-hero-alt{margin-top:16px;font-size:14px;color:rgba(255,255,255,.82);letter-spacing:.04em}
.v-hero-alt strong{color:var(--brass-soft);font-size:17px;font-weight:700}
.v-hero-alt span{opacity:.8}

.v-kaydir{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);
  color:rgba(255,255,255,.6);transition:color .3s}
.v-kaydir:hover{color:var(--brass-soft)}
@media(prefers-reduced-motion:no-preference){
  .v-kaydir svg{animation:vZipla 2.4s ease-in-out infinite}
  @keyframes vZipla{0%,100%{transform:translateY(0)}50%{transform:translateY(6px)}}
}

@media(min-width:760px){
  .v-ara{flex-direction:row;align-items:flex-end;gap:14px;padding:16px}
  .v-ara-btn{flex:0 0 auto;align-self:stretch}
}

/* ---------------- ORTAK BÖLÜM ---------------- */
.v-bolum{padding:clamp(56px,9vh,104px) clamp(20px,5vw,56px)}
.v-bolum-ic{max-width:var(--kap-genis);margin:0 auto}
.v-bolum .headline.kucuk{font-size:clamp(28px,4.2vw,54px);margin-bottom:clamp(26px,4vh,44px)}
.v-bolum-ust{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px}
.v-bolum-ust .headline.kucuk{margin-bottom:0}
.v-link{display:inline-flex;align-items:center;gap:8px;color:var(--brass);
  font-size:12px;letter-spacing:.2em;text-transform:uppercase;font-weight:600;white-space:nowrap}
.v-link:hover{text-decoration:underline;text-underline-offset:4px}

/* Kaydırınca açılış */
.v2 .acilir{opacity:0;transform:translateY(22px);
  transition:opacity .75s var(--ease),transform .75s var(--ease)}
.v2 .acilir.gorunur{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.v2 .acilir{opacity:1;transform:none;transition:none}}

/* ---------------- İLANLAR ---------------- */
.v-ilanlar .v-bolum-ust{margin-bottom:clamp(26px,4vh,44px)}
.v-ilanlar .p-grid{grid-template-columns:1fr}
@media(min-width:620px){.v-ilanlar .p-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1000px){.v-ilanlar .p-grid{grid-template-columns:repeat(3,1fr)}}
.v-ilanlar .card{background:var(--yuzey);border-color:var(--cizgi)}
.v-ilanlar .bos-portfoy{padding:40px 0 8px}

/* ---------------- HİZMETLER ---------------- */
.v-hizmetler{border-top:1px solid var(--cizgi);border-bottom:1px solid var(--cizgi)}
.v-hizmet-grid{display:grid;grid-template-columns:1fr;gap:clamp(14px,2vw,24px)}
@media(min-width:760px){.v-hizmet-grid{grid-template-columns:repeat(3,1fr)}}
.v-hizmet{border:1px solid var(--cizgi);background:var(--yuzey);padding:clamp(22px,3vw,32px);
  display:flex;flex-direction:column;gap:10px;transition:border-color .35s,transform .35s}
.v-hizmet:hover{border-color:var(--brass);transform:translateY(-3px)}
.v-hizmet h3{font-family:'Newsreader',serif;font-weight:400;font-size:clamp(20px,2.4vw,26px);
  color:var(--metin)}
.v-hizmet p{color:var(--metin-soluk);font-size:var(--y-orta);line-height:var(--sat-normal);flex:1}
.v-hizmet-git{display:inline-flex;align-items:center;gap:7px;color:var(--brass);
  font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;font-weight:600}

/* ---------------- NEDEN BİZ ---------------- */
.v-neden{border-top:1px solid var(--cizgi)}
.v-neden .headline{color:var(--metin)}
.v-neden .headline em{color:var(--brass-soft)}
.v-neden-grid{display:grid;grid-template-columns:1fr;gap:clamp(24px,3vw,44px)}
@media(min-width:760px){.v-neden-grid{grid-template-columns:repeat(3,1fr)}}
.v-neden-blok{border-top:1px solid var(--cizgi);padding-top:20px}
.v-neden-blok h3{font-size:12px;letter-spacing:.28em;text-transform:uppercase;
  color:var(--brass-soft);margin-bottom:12px;font-weight:600}
.v-neden-blok p{color:var(--metin-soluk);font-size:var(--y-orta);line-height:var(--sat-normal)}

/* Rakam şeridi — bloklarin altinda, ayni koyu zeminde. Bos ise hic basilmaz. */
.v-rakam-serit{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(12px,2vw,32px);
  margin-top:clamp(36px,5vw,64px);padding-top:clamp(24px,3vw,36px);
  border-top:1px solid var(--cizgi)}
.v-rakam{text-align:center;min-width:0}
.v-rakam-deger{display:block;font-family:'Newsreader',serif;font-size:clamp(30px,5.5vw,52px);
  line-height:1;color:var(--brass-soft);font-weight:400;letter-spacing:-.01em}
.v-rakam-etiket{display:block;margin-top:10px;font-size:11px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--metin-soluk);
  overflow-wrap:anywhere;hyphens:auto}
@media(max-width:479px){
  .v-rakam-serit{gap:8px}
  .v-rakam-etiket{letter-spacing:.1em;font-size:10px}
}

/* ---------------- HARİTA DAVETİ ---------------- */
.v-harita-kart{border:1px solid var(--cizgi);background:var(--yuzey-2);
  padding:clamp(28px,4vw,52px);display:flex;flex-direction:column;gap:22px}
.v-harita-kart p{color:var(--metin-soluk);font-size:var(--y-orta);line-height:var(--sat-normal);max-width:52ch;margin-top:12px}
.v-harita-kart .cta{opacity:1;transform:none;margin-top:0;color:var(--metin);align-self:flex-start}
@media(min-width:860px){
  .v-harita-kart{flex-direction:row;align-items:center;justify-content:space-between;gap:40px}
  .v-harita-kart .cta{flex:0 0 auto}
}

/* ---------------- İLETİŞİM ---------------- */
.v-iletisim{border-top:1px solid var(--cizgi)}
.v-iletisim-grid{display:grid;grid-template-columns:1fr;gap:clamp(32px,5vw,64px)}
@media(min-width:900px){.v-iletisim-grid{grid-template-columns:1fr 1fr}}
.v-iletisim-bilgi{display:flex;flex-direction:column;gap:clamp(22px,3vh,34px)}
/* .c-block varsayilani opacity:0 + translateY(16px); onu GORUNUR yapan tek kural
   ".slide.active .c-block" — yani ESKI tam ekran slayt destesine ait. Yeni vitrinde
   oyle bir ata olmadigi icin ofis telefonu/adresi/e-postasi hic cizilmiyordu.
   Burada acikca geri aciliyor (eski gorunum .v-iletisim kullanmadigi icin etkilenmez). */
.v-iletisim .c-block{
  border-top:1px solid var(--cizgi);padding-top:16px;
  opacity:1;transform:none;
}
.v-iletisim .c-label{font-size:11px;letter-spacing:.24em;text-transform:uppercase;
  color:var(--brass);margin-bottom:9px}
.v-iletisim .c-big{font-family:'Newsreader',serif;font-size:clamp(20px,2.6vw,28px);
  font-weight:400;line-height:1.4;color:var(--metin)}
.v-iletisim .c-small{margin-top:9px;font-size:var(--y-orta);color:var(--metin-soluk);line-height:var(--sat-sik)}
.v-iletisim .cta-whatsapp{opacity:1;transform:none;margin-top:0;color:var(--metin);
  align-self:flex-start}
.v-iletisim-form{background:var(--yuzey);border:1px solid var(--cizgi);padding:clamp(22px,3vw,36px)}
.v-iletisim-form .t-form{margin-top:0;max-width:none}

/* ---------------- FOOTER ---------------- */
.v-footer{border-top:1px solid var(--cizgi);color:var(--metin-soluk);
  /* Alt bosluk, sabit yuzen butonlarin (52px + --float-alt) altina denk gelir.
     Olmazsa sayfanin dibine inildiginde telefon butonu telif satirinin ve
     ofis adinin uzerine biniyordu (mobilde 864px ortusme olculdu). */
  padding:clamp(40px,6vh,64px) clamp(20px,5vw,56px) calc(clamp(28px,4vh,40px) + var(--float-alt, 24px) + 52px)}
.v-footer-ic{display:flex;flex-direction:column;gap:26px}
.v-footer .logo{color:var(--metin);font-family:'Newsreader',serif;font-size:24px;font-weight:400}
.v-footer .logo em{color:var(--brass);font-style:normal}
.v-footer .c-small{margin-top:12px;font-size:var(--y-kucuk);line-height:var(--sat-normal);color:var(--metin-soluk)}
.v-footer-nav{display:flex;flex-wrap:wrap;gap:14px 26px}
.v-footer-nav a{color:var(--metin-soluk);font-size:13px;letter-spacing:.14em;
  text-transform:uppercase;transition:color .3s}
.v-footer-nav a:hover{color:var(--brass-soft)}
.v-footer-alt{border-top:1px solid var(--cizgi);padding-top:20px;font-size:13px;
  color:var(--metin-soluk)}
@media(min-width:860px){
  .v-footer-ic{display:grid;grid-template-columns:1fr auto;gap:34px 60px;align-items:start}
  .v-footer-alt{grid-column:1/-1}
}

/* v2'de WhatsApp float koyu zemin yerine açık zemin üstünde durur */
/* (eski) body.v2 .wa-float renk kuralı kaldırıldı: float artık metinsiz, simge rengi
   .wa-float/.tel-float ortak tanımından gelir — v2'de de aynı görünsün. */

/* ========================================================================
   v2 REVİZYON — hero kimlik odaklı, arama ilanlar bölümünde, telefon simge tuşu
   ====================================================================== */

/* Telefon tuşu başlıktan alındı → sol altta sabit yüzen simge (.tel-float, yukarıda) */

/* ---- HERO: kimlik şeridi ---- */
.v-hero-kimlik{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin-bottom:16px}

/* Hero'daki ofis logosu — ofis adı yazısının yerine geçer.
   Yükseklikle sınırlanır (genişlikle değil): logo ister yatay ister kare olsun
   satırda aynı görsel ağırlıkta durur ve yanındaki bölge yazısıyla hizalı kalır. */
.v-hero-logo{
  height:clamp(26px,3.2vw,38px);width:auto;max-width:min(40vw,200px);
  object-fit:contain;display:block;
}
.v-hero-ofis{
  font-size:11.5px;letter-spacing:.3em;text-transform:uppercase;font-weight:700;
  color:var(--brass-soft);
}
.v-hero-yer{
  font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;
  color:rgba(255,255,255,.72);padding-left:14px;border-left:1px solid rgba(255,255,255,.3);
}
.v-hero-metin{
  margin-top:18px;max-width:56ch;color:rgba(255,255,255,.86);
  font-size:15.5px;line-height:1.75;
}

/* ---- HERO: eylem düğmeleri ---- */
.v-hero-eylem{display:flex;flex-wrap:wrap;gap:12px;margin-top:clamp(24px,3.4vh,36px)}
.v-hero-btn{
  display:inline-flex;align-items:center;gap:10px;
  background:var(--brass);color:var(--forest-deep);
  padding:14px 26px;border-radius:999px;
  font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;
  transition:filter .3s,transform .3s var(--ease);
}
.v-hero-btn:hover{filter:brightness(1.08);transform:translateY(-2px)}
.v-hero-btn.ikincil{
  background:transparent;color:var(--ivory);border:1px solid rgba(255,255,255,.4);
}
.v-hero-btn.ikincil:hover{background:rgba(255,255,255,.12);border-color:var(--ivory)}

/* ---- HERO: alt şerit (ilan sayısı + sosyal medya) ---- */
.v-hero-serit{
  position:absolute;left:0;right:0;bottom:0;z-index:2;
  /* Alt boşluk sabit yüzen butonların (52px + --float-alt) üstüne denk gelir. Hero tam
     ekranken şerit ekranın dibine iner; eskisi (60px) "10 yayında ilan" yazısını telefon
     butonunun altında bırakıyordu (1440×900 ve 390×844'te ölçüldü). */
  padding:16px clamp(20px,5vw,56px) calc(var(--float-alt, 24px) + 52px + 14px);
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;
  background:linear-gradient(180deg,transparent,rgba(10,26,21,.55))
}
.v-hero-serit .v-hero-alt{margin:0}
.v-hero-sosyal{color:rgba(255,255,255,.86)}
.v-hero-sosyal a{opacity:.82}
.v-hero-sosyal a:hover{opacity:1;color:var(--brass-soft)}
@media(max-width:620px){
  .v-hero-serit{justify-content:center;text-align:center}
  /* Dar ekranda şerit İKİ satıra kırılır (sayı + sosyal ikonlar) ve ~168px'e çıkar;
     hero'nun alt boşluğu bunu karşılamazsa şerit butonların üstüne biner. Tam ekranda
     boş alan bol olduğu için görünmez, bant modunda "Hemen ara" butonuna değiyordu. */
  .v-hero{padding-bottom:calc(var(--float-alt, 24px) + 52px + 136px)}
}

/* ---- ARAMA: artık ilanlar bölümünde, AÇIK zeminde ---- */
.v-ilanlar .v-ara{
  max-width:none;margin-bottom:clamp(24px,3.4vh,38px);
  background:var(--yuzey);border:1px solid var(--cizgi);
  -webkit-backdrop-filter:none;backdrop-filter:none;
}
.v-ilanlar .v-ara-alan label{color:var(--brass)}
.v-ilanlar .v-ara select{background-color:var(--yuzey-2);border-color:var(--cizgi)}

/* ---- HARİTA: hangi semtlerde ilan var (konum netliği) ---- */
.v-harita-metin{flex:1}
.v-bolge-liste{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin-top:20px;padding:0}
.v-bolge-liste a{
  display:inline-flex;align-items:center;gap:8px;
  border:1px solid var(--cizgi);background:var(--yuzey);
  padding:8px 14px;border-radius:999px;
  font-size:13.5px;color:var(--metin);
  transition:border-color .3s,background .3s,transform .3s;
}
.v-bolge-liste a:hover{border-color:var(--brass);background:var(--yuzey-2);transform:translateY(-2px)}
.v-bolge-ad{font-weight:600}
.v-bolge-adet{
  min-width:20px;height:20px;padding:0 6px;border-radius:999px;
  background:var(--brass);color:var(--forest-deep);
  font-size:11px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;
}

/* Benzer ilanlar — ilan detay altı */
.benzer-bolum{max-width:var(--kap-orta);margin:0 auto;padding:0 clamp(24px,4vw,56px) clamp(56px,9vh,96px)}
.benzer-bolum .d-bolum-baslik{margin-bottom:22px}
.benzer-grid{grid-template-columns:1fr}
@media(min-width:620px){.benzer-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1000px){.benzer-grid{grid-template-columns:repeat(3,1fr)}}
.benzer-grid .card{opacity:1;transform:none;background:var(--yuzey);border-color:var(--cizgi)}

/* ========================================================================
   S3.3 — favoriler (kalp + çubuk) ve döviz karşılığı
   ====================================================================== */

/* ---- Kart sarmalayıcı: kalp linkin KARDEŞİ (iç içe etkileşimli öğe olmasın) ---- */
.kart-sar{position:relative;display:flex}
.kart-sar>.card{flex:1;min-width:0}

/* Sarmalayıcı gelince nth-child hedefi kaydı: .card artık .kart-sar'ın TEK çocuğu,
   yani ham .card:nth-child(1) kuralı fotoğrafsız TÜM kartlara aynı gradyanı veriyordu.
   Sıra sarmalayıcıdan okunur — ana sayfa/eski slayt kartları sarmalayıcısız olduğu için
   yukarıdaki .card:nth-child kuralları oralarda aynen çalışmaya devam eder. */
.kart-sar:nth-child(1) .card-visual{background:linear-gradient(160deg,#26493D 0%,#0F241D 70%)}
.kart-sar:nth-child(2) .card-visual{background:linear-gradient(160deg,#3A5A4C 0%,#17332A 70%)}
.kart-sar:nth-child(3) .card-visual{background:linear-gradient(160deg,#4E4230 0%,#1E1912 70%)}

/* Satıldı/kiralandı rozeti ile kalp aynı köşeye biniyordu → rozet görselin altına iner */
.kart-sar .durum-rozet{top:auto;bottom:14px;right:14px}

.kalp{
  position:absolute;top:12px;right:12px;z-index:3;
  width:38px;height:38px;border:0;border-radius:50%;padding:0;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  background:rgba(255,255,255,.86);color:var(--forest);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  box-shadow:0 2px 10px rgba(0,0,0,.16);
  transition:transform .25s var(--ease),background .25s,color .25s;
}
.kalp:hover{transform:scale(1.09);background:#fff}
.kalp:focus-visible{outline:2px solid var(--brass);outline-offset:2px}
.kalp.secili{background:var(--brass);color:#fff}
.kalp.secili svg{fill:currentColor}
@keyframes kalpAt{0%{transform:scale(1)}40%{transform:scale(1.32)}100%{transform:scale(1)}}
.kalp.atti{animation:kalpAt .42s var(--ease)}
@media(prefers-reduced-motion:reduce){
  .kalp,.kalp.atti{transition:none;animation:none}
}

/* ---- Kartta TL karşılığı ---- */
.card-tl{margin-top:4px;font-size:13px;color:var(--metin-soluk);letter-spacing:.02em}

/* ---- İlan detayda TL karşılığı ---- */
.d-fiyat-tl{
  margin-top:6px;display:flex;flex-wrap:wrap;align-items:baseline;gap:10px;
  font-size:17px;color:var(--metin-soluk);
}
.d-fiyat-kaynak{font-size:12px;letter-spacing:.12em;text-transform:uppercase;opacity:.75}

/* ---- İlan (portföy) numarası ----
   Emlakçının tabelada/telefonda kullandığı kısa kimlik. Fiyatla yarışmasın diye
   soluk ve küçük; ama seçilebilir olmalı (müşteri okuyup not alıyor). */
.d-ref{
  margin-left:10px;padding-left:10px;border-left:1px solid currentColor;
  opacity:.7;white-space:nowrap;
}
.card-ref{margin-top:4px;font-size:12px;letter-spacing:.06em;opacity:.6}

/* ---- DIŞ PORTFÖY ŞERİDİ (Sahibinden vb.) ----
   İlan ızgarasının hemen üstünde. Kartlarla yarışmasın diye zemini marka yeşilinin
   çok açık tonu; ama tıklanabilir olduğu belli olsun diye tam genişlikte blok ve
   sağda ok'lu buton. */
/* Renkler MEVCUT değişkenlerden kurulur; color-mix() KULLANILMAZ.
   Bu proje renk türevlerini sunucuda hesaplıyor (_renkler.php → hex_ton/hex_karisim/
   hex_rgba) ve CSS'in geri kalanında color-mix hiç geçmiyor. Desteklemeyen tarayıcıda
   (Chrome 111 / Safari 16.2 öncesi) bildirim tamamen düşer ve şerit zeminsiz kalırdı —
   oysa burası sayfanın ana çağrısı. --ivory-soft + --line-light her yerde çalışır. */
.portfoy-serit{
  display:flex;align-items:center;gap:16px;flex-wrap:wrap;
  margin:0 0 28px;padding:18px 22px;
  background:var(--ivory-soft);
  border:1px solid var(--line-light);
  border-radius:14px;
  text-decoration:none;color:inherit;
  transition:border-color .25s ease, background .25s ease, transform .25s ease;
}
.portfoy-serit:hover{
  border-color:var(--brass);
  background:var(--ivory);
}
@media (prefers-reduced-motion: no-preference){
  .portfoy-serit:hover{transform:translateY(-2px)}
}
.ps-ikon{
  flex:0 0 auto;display:grid;place-items:center;
  width:46px;height:46px;border-radius:11px;
  background:var(--forest);color:var(--ivory);
}
.ps-metin{flex:1 1 240px;min-width:0;display:flex;flex-direction:column;gap:3px}
.ps-metin strong{font-size:17px;font-weight:500;letter-spacing:.01em}
.ps-metin small{font-size:13px;opacity:.72}
.ps-buton{
  flex:0 0 auto;display:inline-flex;align-items:center;gap:8px;
  padding:11px 20px;border-radius:999px;
  background:var(--forest);color:var(--ivory);
  font-size:13px;letter-spacing:.09em;text-transform:uppercase;
}
.portfoy-serit:hover .ps-buton{background:var(--brass)}
@media (max-width:560px){
  .portfoy-serit{padding:16px}
  .ps-buton{width:100%;justify-content:center}
}

/* ---- Sahibinden'e giden ilan kartı ----
   Ziyaretçi siteden çıkacağını tıklamadan ÖNCE bilmeli. */
.card-dis-etiket{
  margin-top:6px;display:inline-flex;align-items:center;gap:5px;
  font-size:12px;letter-spacing:.05em;opacity:.75;
}
.card-dis-etiket svg{flex:0 0 auto}

/* Telefon etiketi (Ofis / Cep) — numaranın yanında, ondan sönük */
.c-etiket{
  margin-left:9px;font-size:12px;letter-spacing:.1em;text-transform:uppercase;
  opacity:.6;vertical-align:middle;
}

/* ---- m² birim fiyatı ----
   Yatırımcının ilk baktığı sayı. Ana fiyatın hemen altında, ondan belirgin
   biçimde küçük — asıl fiyatla karıştırılmamalı. */
.d-m2birim{
  margin-top:2px;font-size:15px;color:var(--metin-soluk);letter-spacing:.02em;
}
.d-m2birim .birim{opacity:.7}

/* ---- Favori çubuğu (sayfa altı) ---- */
.favori-cubuk{
  position:fixed;left:0;right:0;bottom:0;z-index:170;
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;
  padding:14px clamp(16px,4vw,40px);
  background:var(--forest-deep);color:var(--ivory);
  border-top:1px solid rgba(255,255,255,.14);
  transform:translateY(110%);transition:transform .42s var(--ease);
}
.favori-cubuk.gorunur{transform:translateY(0)}
.favori-bilgi{font-size:14.5px;letter-spacing:.02em}
.favori-bilgi strong{color:var(--brass-soft);font-size:19px;font-weight:700;margin-right:4px}
.favori-eylem{display:flex;gap:10px;flex-wrap:wrap}
.favori-gonder,.favori-temizle{
  font-family:inherit;font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;
  padding:11px 20px;border-radius:999px;cursor:pointer;border:1px solid transparent;
  transition:filter .25s,background .25s,border-color .25s;
}
.favori-gonder{background:var(--brass);color:var(--forest-deep)}
.favori-gonder:hover{filter:brightness(1.09)}
.favori-temizle{background:transparent;color:rgba(255,255,255,.8);border-color:rgba(255,255,255,.28)}
.favori-temizle:hover{background:rgba(255,255,255,.1);color:var(--ivory)}
/* "Listeyi gör" — buton kardeşleriyle aynı ölçü, <a> olduğu için ayrı yazılır */
.favori-liste-link{
  font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;
  padding:11px 20px;border-radius:999px;border:1px solid rgba(255,255,255,.28);
  color:rgba(255,255,255,.8);text-decoration:none;
  display:inline-flex;align-items:center;
  transition:background .25s,color .25s;
}
.favori-liste-link:hover{background:rgba(255,255,255,.1);color:var(--ivory)}
@media(prefers-reduced-motion:reduce){.favori-cubuk{transition:none}}

/* Çubuk açıkken float'lar yukarı çıkar — konum artık --float-alt ile ortak yönetiliyor
   (yukarıdaki "YÜZEN İLETİŞİM TUŞLARI" bölümü). Buradaki eski bottom override'ı, daha
   yüksek özgüllükte olduğu için WhatsApp'ı eski konuma çekiyordu → kaldırıldı. */
@media(max-width:620px){
  .favori-cubuk{justify-content:center;text-align:center}
  .favori-eylem{width:100%;justify-content:center}
}

/* Ilan detayi mini harita altindaki Google Maps baglantilari.
   Acik zemin: forest tonunda, footer'daki sessiz sage'den ayrilsin diye okunur. */
.mini-gmap {
    display: inline-flex; align-items: center; gap: 6px;
    color: var(--metin); border-bottom: 1px solid var(--cizgi);
    font-size: 12.5px; letter-spacing: .04em; white-space: nowrap;
    transition: color .25s ease, border-color .25s ease;
}
.mini-gmap:hover { color: var(--brass); border-color: var(--brass); }
.mini-gmap svg { flex: 0 0 auto; }
@media (max-width: 520px) {
    /* Dar ekranda konum metni + iki baglanti tek satira sigmaz; sarilsin. */
    .mini-harita-alt { flex-wrap: wrap; gap: 8px 14px; }
}

/* Ilan detayinda Sokak Gorunumu one cikar (brass), digerleri notr kalir */
.mini-gmap.mini-gmap-one { color: var(--brass); border-bottom-color: rgba(168, 124, 63, .5); font-weight: 600; }
.mini-gmap.mini-gmap-one:hover { color: var(--metin); border-bottom-color: var(--metin); }

/* ================= ÖRNEK SİTE ŞERİDİ (.env DEMO_SLUG) =================
   Tanıtım amaçlı örnek sitede ekranın en üstünde sabit durur. Sabit/yapışkan başlıklar
   --demo-h kadar aşağı iner ki şerit içeriğin ÜSTÜNE binmesin (ui-ux: sticky nav kuralı).
   Normal ofiste body'de .demo-serit yok → --demo-h 0, hiçbir şey değişmez. */
:root{--demo-h:0px}
body.demo-serit{--demo-h:40px}
body.demo-serit:not(.harita-govde){padding-top:var(--demo-h)}
.demo-serit-bant{position:fixed;top:0;left:0;right:0;z-index:190;height:var(--demo-h);
  display:flex;align-items:center;justify-content:center;gap:12px;
  padding:0 clamp(12px,3vw,28px);background:var(--forest-deep,#0F241D);color:var(--ivory,#EFE9DD);
  border-bottom:1px solid rgba(239,233,221,.14);font-family:'Onest',sans-serif;font-size:13px;line-height:1.2;white-space:nowrap}
.demo-serit-bant strong{flex:0 0 auto;color:var(--brass-soft,#D8B878);font-size:11px;font-weight:700;
  letter-spacing:.16em;text-transform:uppercase}
.demo-serit-bant .ds-uzun{min-width:0;overflow:hidden;text-overflow:ellipsis;opacity:.88}
.demo-serit-bant .ds-kisa{display:none;opacity:.88}
.demo-serit-bant a{flex:0 0 auto;display:inline-flex;align-items:center;height:100%;
  color:var(--brass-soft,#D8B878);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.demo-serit-bant a:hover{color:var(--ivory,#EFE9DD)}
.demo-serit-bant a:focus-visible{outline:2px solid var(--brass,#B08D57);outline-offset:-4px}
@media(max-width:760px){
  .demo-serit-bant{gap:10px;font-size:12px}
  .demo-serit-bant .ds-uzun{display:none}
  .demo-serit-bant .ds-kisa{display:inline}
}
body.demo-serit .v-header,body.demo-serit .s-header,body.demo-serit .h-header{top:var(--demo-h)}
body.demo-serit .v-hero:not(.bant){min-height:calc(100vh - var(--demo-h));min-height:calc(100svh - var(--demo-h))}
body.demo-serit .atla:focus{top:calc(var(--demo-h) + 8px)}
@media(min-width:721px){body.demo-serit .h-panel{top:calc(64px + var(--demo-h))}}
.f-demo-not{margin:2px 0 16px;font-size:13px;line-height:1.55;opacity:.78}

/* ========================================================================
   Ö4 — SADELEŞME + YENİ VİTRİN PARÇALARI
   Mevcut token'lar (--zemin, --yuzey, --metin, --cizgi, --brass) kullanılır →
   açık/koyu tema ve kiracı renkleri kendiliğinden uyar.
   ====================================================================== */
.gorsel-gizli{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Ana sayfa arama: metin alanı */
.v-ara input[type="search"]{width:100%;font-family:inherit;font-size:15px;color:var(--metin);
  background:var(--ivory);border:1px solid transparent;border-radius:2px;padding:12px;outline:none}
.v-ilanlar .v-ara input[type="search"]{background:var(--yuzey-2);border-color:var(--cizgi)}
.v-ara input[type="search"]:focus{outline:2px solid var(--brass);outline-offset:1px}
@media(min-width:720px){.v-ara-metin{flex:2 1 0}}
.v-hizmet-satici{border-style:dashed}
.v-hizmet-satici h3{color:var(--brass)}

/* ---- Portföy: sade filtre (arama + tür + sırala; geri kalanı panelde) ---- */
.filtreler-yeni{display:block;padding:14px 0}
.filtre-ana{display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px 18px}
.filtre-ara{position:relative;flex:1 1 260px;display:flex;align-items:center}
.filtre-ara svg{position:absolute;left:12px;color:var(--metin-soluk);pointer-events:none}
.filtre-ara input{width:100%;font:inherit;font-size:15px;color:var(--metin);background:var(--yuzey);
  border:1px solid var(--cizgi);border-radius:999px;padding:11px 16px 11px 40px;outline:none}
.filtre-ara input:focus{border-color:var(--brass)}
.tur-segment{display:inline-flex;border:1px solid var(--cizgi);border-radius:999px;padding:3px;background:var(--yuzey)}
.tur-segment label{position:relative;cursor:pointer}
.tur-segment input{position:absolute;opacity:0;pointer-events:none}
.tur-segment span{display:block;padding:8px 14px;border-radius:999px;font-size:13px;letter-spacing:.04em;color:var(--metin-soluk);transition:background .25s,color .25s}
.tur-segment input:checked+span{background:var(--metin);color:var(--zemin)}
.tur-segment input:focus-visible+span{outline:2px solid var(--brass);outline-offset:1px}
.filtre-sirala select{min-width:150px}
.filtre-ac{display:inline-flex;align-items:center;gap:8px;font:inherit;font-size:13px;letter-spacing:.06em;
  color:var(--metin);background:var(--yuzey);border:1px solid var(--cizgi);border-radius:999px;padding:10px 16px;cursor:pointer}
.filtre-ac:hover,.filtre-ac[aria-expanded="true"]{border-color:var(--brass)}
.filtre-sayac{display:inline-grid;place-items:center;min-width:20px;height:20px;border-radius:999px;background:var(--brass);color:#fff;font-size:11px}
.filtre-detay{display:none}
.filtre-detay.acik{display:block;margin-top:16px;padding-top:16px;border-top:1px dashed var(--cizgi)}
.filtre-detay-ust,.filtre-detay-alt{display:none}
.filtre-detay-izgara{display:flex;flex-wrap:wrap;gap:16px 28px;align-items:flex-end}
.filtre-aralik>div{display:flex;gap:10px}
.filtre-aralik input{min-width:0;width:110px}
@media(max-width:899px){
  /* Telefonda: alttan açılan panel — filtreler sayfayı kaplamaz */
  .filtre-detay.acik{position:fixed;left:0;right:0;bottom:0;z-index:300;margin:0;max-height:82vh;overflow:auto;
    background:var(--zemin);border-top:1px solid var(--cizgi);border-radius:18px 18px 0 0;padding:18px 20px calc(18px + env(safe-area-inset-bottom));
    box-shadow:0 -20px 60px rgba(0,0,0,.25);animation:altPanel .32s var(--ease, ease) both}
  html.filtre-panel-acik body::after{content:"";position:fixed;inset:0;z-index:299;background:rgba(10,20,16,.45)}
  .filtre-detay-ust{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;font-size:16px}
  .filtre-kapat{font-size:28px;line-height:1;background:none;border:0;color:var(--metin);cursor:pointer;padding:0 4px}
  .filtre-detay-izgara{display:grid;grid-template-columns:1fr;gap:18px}
  .filtre-detay-izgara select,.filtre-aralik input{width:100%}
  .filtre-detay-alt{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:20px}
  .filtre-temizle{color:var(--metin-soluk);text-decoration:underline;text-underline-offset:3px;font-size:14px}
  .filtre-goster{flex:1;max-width:240px;font:inherit;font-weight:700;font-size:13px;letter-spacing:.14em;text-transform:uppercase;
    background:var(--brass);color:var(--forest-deep);border:0;border-radius:999px;padding:14px 18px;cursor:pointer}
  .filtre-sirala{flex:1 1 140px}
  .filtre-sirala select{min-width:0;width:100%}
}
@keyframes altPanel{from{transform:translateY(100%)}to{transform:none}}
@media(prefers-reduced-motion:reduce){.filtre-detay.acik{animation:none}}

/* ---- İlan detay: video + paylaş ---- */
.d-eylem-ikincil{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}
.d-ikincil-btn{display:inline-flex;align-items:center;gap:8px;font:inherit;font-size:13px;letter-spacing:.06em;color:var(--metin);
  background:transparent;border:1px solid var(--cizgi);border-radius:999px;padding:10px 16px;cursor:pointer;transition:border-color .25s,color .25s}
.d-ikincil-btn:hover{border-color:var(--brass);color:var(--brass)}
.d-ikincil-btn small{opacity:.65;font-size:11px}

/* ---- Hesaplayıcılar ---- */
.d-hesap{margin-top:8px}
.d-hesap>summary{cursor:pointer;list-style:none}
.d-hesap>summary::-webkit-details-marker{display:none}
.d-hesap>summary::before{content:"+";margin-right:10px;color:var(--brass);font-size:18px;transition:transform .25s}
.d-hesap[open]>summary::before{transform:rotate(45deg)}
.hesap-izgara{display:grid;gap:16px;margin:6px 0 10px}
.hesap-kutu{background:var(--yuzey);border:1px solid var(--cizgi);padding:18px 18px 14px}
.hesap-kutu h3{font-size:15px;font-weight:600;margin:0 0 12px}
.hesap-kutu h3 small{font-weight:400;color:var(--metin-soluk)}
.hesap-kutu .f-grup{margin-bottom:12px;display:flex;flex-direction:column;gap:6px}
.hesap-kutu label{font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--brass)}
.hesap-kutu input,.hesap-kutu select{font:inherit;font-size:15px;color:var(--metin);background:transparent;border:0;border-bottom:1px solid var(--cizgi);padding:6px 2px;outline:none;width:100%}
.hesap-kutu input:focus,.hesap-kutu select:focus{border-bottom-color:var(--brass)}
.f-ikili{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.hesap-sonuc{display:flex;justify-content:space-between;align-items:baseline;margin:6px 0;padding-top:10px;border-top:1px solid var(--cizgi)}
.hesap-sonuc b{font-size:24px;color:var(--brass)}
.hesap-not{font-size:12px;line-height:1.6;color:var(--metin-soluk);margin:8px 0 0}
.hesap-liste{list-style:none;margin:0;padding:0}
.hesap-liste li{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid var(--cizgi);font-size:14px}
.hesap-liste .hesap-toplam{border-bottom:0;font-weight:700}
.hesap-liste .hesap-toplam b{color:var(--brass);font-size:18px}

/* ---- Satıcı sayfası ---- */
.satici-duzen{display:grid;gap:clamp(28px,5vw,72px);align-items:start}
@media(min-width:900px){.satici-duzen{grid-template-columns:minmax(0,5fr) minmax(0,6fr)}}
.satici-giris{font-size:var(--y-buyuk);line-height:var(--sat-normal);color:var(--metin);max-width:52ch;margin:0 0 26px}
.satici-adim{list-style:none;margin:0;padding:0;counter-reset:adim;display:grid;gap:18px}
.satici-adim li{counter-increment:adim;display:grid;grid-template-columns:44px 1fr;gap:2px 14px;align-items:start}
.satici-adim li::before{content:counter(adim,decimal-leading-zero);grid-row:span 2;font-family:'Newsreader',serif;font-size:28px;line-height:1;color:var(--brass)}
.satici-adim b{font-size:15px}
.satici-adim span{font-size:14px;color:var(--metin-soluk)}
.satici-form{background:var(--yuzey);border:1px solid var(--cizgi);padding:clamp(20px,3vw,36px)}
.satici-form .t-form{max-width:none;margin-top:0}
.t-form select{width:100%;font:inherit;font-size:15px;color:var(--metin);background:transparent;border:0;border-bottom:1px solid var(--cizgi);padding:8px 2px;outline:none}
.secenek-grup{border:0;padding:0;margin:0 0 18px;display:flex;flex-wrap:wrap;gap:8px}
.secenek-grup legend{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--brass);margin-bottom:10px;padding:0}
.secenek{position:relative;cursor:pointer}
.secenek input{position:absolute;opacity:0;pointer-events:none}
.secenek span{display:block;padding:9px 14px;border:1px solid var(--cizgi);border-radius:999px;font-size:13.5px;transition:all .2s}
.secenek input:checked+span{border-color:var(--brass);background:var(--brass);color:#fff}
.secenek input:focus-visible+span{outline:2px solid var(--brass);outline-offset:2px}
@media(max-width:520px){.f-ikili{grid-template-columns:1fr;gap:0}}

/* ---- Seçki ---- */
.secki-not{margin-top:14px;max-width:60ch;color:var(--metin-soluk);font-size:var(--y-orta)}
.secki-oge{display:flex;flex-direction:column;gap:8px}
.secki-begen{margin:0}
.secki-begen button{width:100%;font:inherit;font-size:13px;letter-spacing:.06em;padding:11px 14px;cursor:pointer;
  background:transparent;color:var(--metin);border:1px solid var(--cizgi);border-radius:999px;transition:all .2s}
.secki-begen button:hover{border-color:var(--brass);color:var(--brass)}
.secki-begen button.secili{background:var(--brass);border-color:var(--brass);color:#fff}
.secki-alt{display:flex;justify-content:center;margin:clamp(32px,6vh,64px) 0}
@media(max-width:899px){.p-grid.secki-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.p-grid.secki-grid{grid-template-columns:1fr}}
.t-form .secenek{margin:0;text-transform:none;letter-spacing:normal;color:var(--metin)}
.t-form .secenek span{font-size:13.5px}
@media(max-width:640px){.s-nav .nav-ikincil{display:none}}
/* B7.1 Fiyat düştü */
.durum-rozet.fiyat-dustu{background:#B3121C;color:#fff}
.d-fiyat-eski{display:flex;align-items:center;gap:10px;margin-bottom:4px;font-size:15px;color:var(--metin-soluk)}
.fiyat-dustu-etiket{background:#B3121C;color:#fff;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;padding:4px 10px;border-radius:999px}
/* B7.3 İlan alarmı */
.alarm-kriter-baslik{font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--brass);font-weight:500;margin:0 0 12px}
.alarm-cipler{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}
.alarm-cipler span{padding:8px 14px;border:1px solid var(--cizgi);border-radius:999px;background:var(--yuzey);font-size:14px}
.alarm-davet{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px;margin-top:clamp(28px,5vh,48px);
  padding:20px clamp(18px,3vw,28px);border:1px dashed var(--brass);background:var(--yuzey)}
.alarm-davet p{margin:0;font-size:var(--y-orta);color:var(--metin)}
.alarm-davet a{white-space:nowrap}
/* B7.5 Ekibimiz + danışman kartı */
.ekip-izgara{display:grid;gap:clamp(18px,2.4vw,32px);grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.danisman-kart{display:flex;flex-direction:column;background:var(--yuzey);border:1px solid var(--cizgi)}
.danisman-kart img{width:100%;aspect-ratio:1;object-fit:cover;display:block}
.danisman-bas{display:grid;place-items:center;aspect-ratio:1;background:var(--yuzey-2);font-family:'Newsreader',serif;font-size:72px;color:var(--brass)}
.danisman-bilgi{padding:18px 20px 20px}
.danisman-bilgi h3{font-family:'Newsreader',serif;font-weight:400;font-size:24px;margin:0}
.danisman-unvan{margin:4px 0 0;font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--brass)}
.danisman-bio{margin:12px 0 0;font-size:var(--y-orta);line-height:var(--sat-normal);color:var(--metin-soluk)}
.danisman-eylem{display:flex;flex-wrap:wrap;gap:8px 16px;margin-top:14px;font-size:14px}
.danisman-eylem a{color:var(--metin);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--brass)}
.danisman-kart.kisa{flex-direction:row;align-items:center;margin-top:18px}
.danisman-kart.kisa img,.danisman-kart.kisa .danisman-bas{width:84px;height:84px;aspect-ratio:auto;flex:0 0 auto;font-size:34px}
.danisman-kart.kisa .danisman-bilgi{padding:12px 16px}
.danisman-kart.kisa h3{font-size:19px}
.danisman-kart.kisa .danisman-eylem{margin-top:6px}
.danisman-filtre{margin:0 0 12px;font-size:14px;color:var(--metin-soluk)}
.danisman-filtre a{color:var(--brass)}
/* B4 dil geçişi */
.dil-gec{display:inline-grid;place-items:center;min-width:38px;height:38px;border:1px solid var(--cizgi);border-radius:999px;
  font-size:12px;letter-spacing:.14em;font-weight:600;color:inherit;margin-right:8px;transition:border-color .25s,color .25s}
.dil-gec:hover{border-color:var(--brass);color:var(--brass)}
.v-header .dil-gec{border-color:rgba(255,255,255,.35)}