/* =========================================================
   Ordu Emlak Ofisi - style.css
   Referans tasarım: hepsiemlak.com
   ========================================================= */

:root{
    --kirmizi:      #e1121e;
    --kirmizi-koyu: #b60d17;
    --yesil:        #25d366;
    --yesil-koyu:   #1aad52;
    --lacivert:     #1b2a4a;
    --metin:        #2b2f36;
    --metin-acik:   #6b7280;
    --cizgi:        #e6e8ec;
    --gri-bg:       #f4f5f7;
    --beyaz:        #fff;
    --golge:        0 2px 12px rgba(20,25,40,.08);
    --golge-hover:  0 8px 26px rgba(20,25,40,.16);
    --radius:       12px;
    --font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
body{
    font-family:var(--font);
    color:var(--metin);
    background:var(--beyaz);
    line-height:1.5;
    font-size:15px;
}
a{ color:inherit; text-decoration:none; }
img{ display:block; max-width:100%; }
h1,h2,h3,h4{ margin:0 0 .4em; line-height:1.25; }
ul{ margin:0; padding:0; list-style:none; }

.container{ width:100%; max-width:1200px; margin:0 auto; padding:0 16px; }

/* ---------- Butonlar ---------- */
.btn{
    display:inline-flex; align-items:center; justify-content:center; gap:8px;
    padding:11px 22px; border:none; border-radius:8px; cursor:pointer;
    font-size:15px; font-weight:600; font-family:inherit; transition:.18s;
    white-space:nowrap;
}
.btn--ara{ background:var(--kirmizi); color:#fff; }
.btn--ara:hover{ background:var(--kirmizi-koyu); }
.btn--yesil{ background:var(--yesil); color:#fff; }
.btn--yesil:hover{ background:var(--yesil-koyu); }
.btn--beyaz{ background:#fff; color:var(--kirmizi); }
.btn--beyaz:hover{ background:#f0f0f0; }
.btn--blok{ width:100%; }

/* ---------- Header ---------- */
.site-header{
    position:sticky; top:0; z-index:100;
    background:#fff; border-bottom:1px solid var(--cizgi);
    box-shadow:0 1px 6px rgba(0,0,0,.04);
}
.header-inner{ display:flex; align-items:center; gap:24px; height:64px; }
.logo{ display:flex; align-items:center; gap:9px; font-size:21px; }
.logo-mark{
    width:34px; height:34px; border-radius:8px;
    background:var(--kirmizi); color:#fff;
    display:grid; place-items:center; font-weight:800; font-size:20px;
}
.logo-text{ font-weight:400; color:var(--metin); letter-spacing:-.3px; }
.logo-text strong{ font-weight:800; color:var(--kirmizi); }
.logo-text em{ font-style:normal; color:var(--metin-acik); font-size:.8em; }
.logo--light .logo-text{ color:#fff; }
.logo--light .logo-text em{ color:#c7cdd8; }

.main-nav{ display:flex; gap:6px; margin-left:8px; }
.main-nav a{
    padding:9px 14px; border-radius:8px; font-weight:600; color:var(--metin);
    transition:.15s;
}
.main-nav a:hover{ background:var(--gri-bg); color:var(--kirmizi); }
.main-nav a.active{ color:var(--kirmizi); }

.header-actions{ margin-left:auto; display:flex; align-items:center; gap:12px; }
.btn-phone{
    display:inline-flex; align-items:center; gap:7px;
    padding:9px 16px; border:1px solid var(--kirmizi); border-radius:8px;
    color:var(--kirmizi); font-weight:700; font-size:14px;
}
.btn-phone:hover{ background:var(--kirmizi); color:#fff; }

.nav-toggle{ display:none; flex-direction:column; gap:4px; background:none; border:none; cursor:pointer; padding:6px; }
.nav-toggle span{ width:24px; height:2px; background:var(--metin); border-radius:2px; transition:.2s; }

/* ---------- Hero ---------- */
.hero{
    position:relative; color:#fff; padding:70px 0 64px; overflow:hidden;
    background:var(--hero-arkaplan, linear-gradient(135deg,#8b0d16 0%, #c11019 55%, #7a0b13 100%));
    background-size:cover; background-position:center;
}
/* Overlay (saydam renk katmanı) + pattern */
.hero::after{
    content:""; position:absolute; inset:0; pointer-events:none;
    background-color:var(--hero-overlay, rgba(90,8,15,.6));
    background-image:var(--hero-desen, none);
    background-size:var(--hero-desen-boyut, auto);
}
.hero-ic{ position:relative; z-index:1; text-align:center; }
.hero-baslik{
    font-size:34px; font-weight:800; margin-bottom:26px; line-height:1.3;
    text-shadow:0 2px 14px rgba(0,0,0,.25);
}
.hero-donen{
    display:inline-block; color:#ffd24a; min-width:20px;
    transition:opacity .3s, transform .3s;
}
.hero-donen.gecis{ opacity:0; transform:translateY(-8px); }

.hero-arama{ max-width:760px; margin:0 auto; }
.hero-arama-ic{
    display:flex; align-items:center; gap:8px; background:#fff;
    border-radius:12px; padding:8px 8px 8px 16px; box-shadow:0 12px 34px rgba(0,0,0,.25);
}
.hero-arama-ikon{ color:var(--metin-acik); flex:0 0 auto; }
.hero-arama-ic input{
    flex:1; border:none; outline:none; font-size:15px; font-family:inherit;
    color:var(--metin); padding:10px 6px; min-width:0; background:transparent;
}
.hero-arama-ic .btn{ padding:12px 30px; }

.hero-chipler{ margin-top:22px; display:flex; flex-wrap:wrap; gap:10px; justify-content:center; }
.hero-chipler a{
    padding:8px 18px; border:1px solid rgba(255,255,255,.5); border-radius:24px;
    font-weight:600; font-size:14px; color:#fff; transition:.15s; backdrop-filter:blur(3px);
}
.hero-chipler a:hover{ background:#fff; color:var(--kirmizi); border-color:#fff; }

/* ---------- Section ---------- */
.section{ padding:44px 0; }
.section--gri{ background:var(--gri-bg); }
.section-baslik{ display:flex; align-items:center; justify-content:space-between; margin-bottom:22px; }
.section-baslik h2{ font-size:23px; font-weight:800; }
.section-tumu{ color:var(--kirmizi); font-weight:700; font-size:14px; }
.section-tumu:hover{ text-decoration:underline; }

/* ---------- Kategori kutucuklar ---------- */
.kategori-kutucuklar{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.kat-kutu{
    display:flex; align-items:center; gap:14px; padding:18px 20px;
    background:#fff; border:1px solid var(--cizgi); border-radius:var(--radius);
    box-shadow:var(--golge); transition:.18s;
}
/* Hover: kutu yerinde kalır; kenar çizgisi soldan başlayıp çerçeveyi sarar */
@property --kat-draw{ syntax:'<angle>'; inherits:false; initial-value:0deg; }
.kat-kutu{ position:relative; }
.kat-kutu::after{
    content:""; position:absolute; inset:0; border-radius:var(--radius);
    padding:2px; /* çerçeve kalınlığı */
    background:conic-gradient(from 180deg, var(--kirmizi) 0deg var(--kat-draw), transparent var(--kat-draw) 360deg);
    -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite:xor; mask-composite:exclude;
    opacity:0; pointer-events:none;
    transition:--kat-draw .6s ease, opacity .15s ease;
}
.kat-kutu:hover{ box-shadow:var(--golge-hover); }
.kat-kutu:hover::after{ --kat-draw:360deg; opacity:1; }
@media(prefers-reduced-motion:reduce){
    .kat-kutu::after{ transition:opacity .15s ease; }
}
.kat-ikon{ display:flex; align-items:center; justify-content:center; width:44px; height:44px; border-radius:10px; background:var(--gri-bg); color:var(--lacivert); flex-shrink:0; transition:.16s; }
.kat-ikon svg{ width:26px; height:26px; }
.kat-kutu:hover .kat-ikon{ background:var(--lacivert); color:#fff; }
.kat-kutu strong{ display:block; font-size:16px; }
.kat-kutu small{ color:var(--metin-acik); }

/* ---------- İlan grid & kart ---------- */
.ilan-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.ilan-grid--liste{ grid-template-columns:repeat(3,1fr); }

.ilan-karti{
    background:#fff; border:1px solid var(--cizgi); border-radius:var(--radius);
    overflow:hidden; box-shadow:var(--golge); transition:.18s;
    display:flex; flex-direction:column;
}
.ilan-karti:hover{ transform:translateY(-4px); box-shadow:var(--golge-hover); }
.ilan-karti-foto{ position:relative; display:block; aspect-ratio:4/3; overflow:hidden; background:var(--gri-bg); }
.ilan-karti-foto img{ width:100%; height:100%; object-fit:cover; transition:.4s; }
.ilan-karti:hover .ilan-karti-foto img{ transform:scale(1.06); }

.etiket{
    position:absolute; top:10px; left:10px;
    padding:4px 10px; border-radius:6px; font-size:12px; font-weight:700; color:#fff;
}
.etiket--satilik{ background:var(--kirmizi); }
.etiket--kiralik{ background:#1f7a4d; }
.etiket--vip{ left:auto; right:10px; background:#f0a500; }
.foto-sayi{
    position:absolute; bottom:10px; right:10px;
    background:rgba(0,0,0,.6); color:#fff; padding:3px 9px; border-radius:6px; font-size:12px;
}

.ilan-karti-govde{ padding:14px; flex:1; }
.ilan-karti-fiyat{ font-size:19px; font-weight:800; color:var(--kirmizi); margin-bottom:6px; }
.ilan-karti-fiyat small{ font-size:12px; color:var(--metin-acik); font-weight:600; }
.ilan-karti-baslik{ font-size:14.5px; font-weight:600; line-height:1.35; margin-bottom:8px; }
.ilan-karti-baslik a{ display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.ilan-karti-baslik a:hover{ color:var(--kirmizi); }
.ilan-karti-konum{
    display:flex; align-items:center; gap:5px; color:var(--metin-acik); font-size:13px; margin-bottom:12px;
}
.ilan-karti-konum svg{ flex:0 0 auto; fill:var(--kirmizi); }
.ilan-karti-ozet{ display:flex; gap:8px; }
.ilan-karti-ozet li{
    flex:1; text-align:center; background:var(--gri-bg); border-radius:8px; padding:7px 4px;
    font-size:12px; color:var(--metin-acik);
}
.ilan-karti-ozet li span{ display:block; font-weight:800; font-size:14px; color:var(--metin); }
.ilan-karti-alt{
    display:flex; align-items:center; justify-content:space-between;
    padding:10px 14px; border-top:1px solid var(--cizgi); font-size:12px; color:var(--metin-acik);
}
.ofis-adi{ font-weight:700; color:var(--metin); }

/* ---------- Öne çıkan slider ---------- */
.oc-slider{ position:relative; }
.oc-track{
    display:flex; gap:18px; overflow-x:auto; scroll-snap-type:x mandatory; scroll-behavior:smooth;
    padding:4px 2px 8px; -ms-overflow-style:none; scrollbar-width:none;
}
.oc-track::-webkit-scrollbar{ display:none; }
.oc-track > .ilan-karti{ flex:0 0 calc((100% - 3 * 18px) / 4); scroll-snap-align:start; }
/* Slider kartlarında hover'da yukarı hareket ve gölge büyümesi olmasın */
.oc-track > .ilan-karti:hover{ transform:none; box-shadow:var(--golge); }
.oc-ok{
    position:absolute; top:calc(50% - 20px); transform:translateY(-50%); z-index:6;
    width:32px; height:32px; border-radius:50%; border:1px solid var(--cizgi); background:rgba(255,255,255,.95);
    color:var(--metin); font-size:18px; line-height:1; cursor:pointer; box-shadow:0 2px 7px rgba(20,25,40,.14);
    display:grid; place-items:center; transition:.15s; opacity:.85;
}
.oc-ok:hover{ background:var(--kirmizi); color:#fff; border-color:var(--kirmizi); opacity:1; }
.oc-onceki{ left:-30px; }
.oc-sonraki{ right:-30px; }
/* Dar masaüstünde okları içeri al (taşma/yatay kaydırma olmasın) */
@media (max-width:1260px){ .oc-onceki{ left:-4px; } .oc-sonraki{ right:-4px; } }
@media (max-width:1024px){ .oc-track > .ilan-karti{ flex-basis:calc((100% - 2 * 18px) / 3); } }
@media (max-width:768px){
    .oc-track{ gap:12px; }
    .oc-track > .ilan-karti{ flex-basis:calc((100% - 12px) / 2); }
    .oc-ok{ display:none; }
}
@media (max-width:480px){ .oc-track > .ilan-karti{ flex-basis:82%; } }

/* ---------- İlçe kutucuklar ---------- */
.ilce-kutucuklar{ display:grid; grid-template-columns:repeat(5,1fr); gap:14px; }
.ilce-kutu{
    position:relative; height:120px; border-radius:var(--radius); overflow:hidden;
    background:var(--ilce-renk,#345995); color:#fff;
    background-size:cover; background-position:center;
    display:flex; flex-direction:column; justify-content:flex-end; padding:16px;
    box-shadow:var(--golge); transition:.18s;
}
.ilce-kutu::before{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent,rgba(0,0,0,.4)); }
/* Görselli ilçe kutusu: saydam renk katmanı + alt karartma (yazı okunsun) */
.ilce-kutu--foto::before{ background:var(--ilce-overlay, rgba(14,42,74,.45)), linear-gradient(180deg, transparent 45%, rgba(0,0,0,.45)); }
.ilce-kutu--foto .ilce-ad{ text-shadow:0 1px 6px rgba(0,0,0,.5); }
.ilce-kutu:hover{ transform:translateY(-3px); box-shadow:var(--golge-hover); }
.ilce-ad,.ilce-adet{ position:relative; z-index:1; }
.ilce-ad{ font-size:18px; font-weight:800; }
.ilce-adet{ font-size:13px; opacity:.9; }

/* ---------- Neden biz ---------- */
.neden-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.neden-kart{ text-align:center; padding:26px 18px; border:1px solid var(--cizgi); border-radius:var(--radius); }
.neden-ikon{
    width:56px; height:56px; margin:0 auto 14px; border-radius:50%;
    background:#fdeaea; color:var(--kirmizi); display:grid; place-items:center; font-size:24px;
}
.neden-kart h3{ font-size:16px; }
.neden-kart p{ color:var(--metin-acik); font-size:14px; margin:0; }

/* ---------- İletişim şerit ---------- */
.iletisim-serit{
    background:var(--lacivert); color:#fff; padding:34px 0;
}
.iletisim-serit .container{ display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap; }
.iletisim-serit h2{ font-size:22px; margin:0; }
.iletisim-serit p{ margin:4px 0 0; opacity:.85; }
.iletisim-serit-btn{ display:flex; gap:12px; }

/* ---------- Breadcrumb ---------- */
.breadcrumb{ background:var(--gri-bg); border-bottom:1px solid var(--cizgi); font-size:13px; }
.breadcrumb .container{ padding:12px 16px; color:var(--metin-acik); }
.breadcrumb a:hover{ color:var(--kirmizi); }
.breadcrumb span{ margin:0 6px; opacity:.5; }
.breadcrumb strong{ color:var(--metin); }

/* ---------- Liste sayfası ---------- */
.liste-sayfa{ display:grid; grid-template-columns:280px 1fr; gap:24px; padding-top:24px; padding-bottom:48px; align-items:start; }
.filtre-ac{ display:none; }

.filtre-panel{
    background:#fff; border:1px solid var(--cizgi); border-radius:var(--radius);
    padding:18px; position:sticky; top:80px;
}
.filtre-baslik{ display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.filtre-baslik h3{ margin:0; font-size:17px; }
.filtre-temizle{ font-size:13px; color:var(--kirmizi); font-weight:600; }
.filtre-grup{ margin-bottom:16px; }
.filtre-grup > label{ display:block; font-weight:700; font-size:13px; margin-bottom:7px; }
.filtre-grup input,.filtre-grup select{
    width:100%; border:1px solid var(--cizgi); border-radius:8px; padding:10px 12px;
    font-size:14px; font-family:inherit; color:var(--metin);
}
.filtre-grup input:focus,.filtre-grup select:focus{ outline:none; border-color:var(--kirmizi); }
.radyo-satir{ display:flex; flex-direction:column; gap:7px; }
.radyo-satir label{ display:flex; align-items:center; gap:7px; font-weight:500; font-size:14px; cursor:pointer; }
.fiyat-ikili{ display:flex; gap:8px; }

/* Sonuçlar */
.liste-ust{
    display:flex; align-items:center; justify-content:space-between; gap:16px;
    margin-bottom:18px; flex-wrap:wrap;
}
.liste-ust-bilgi h1{ font-size:22px; margin:0; }
.liste-ust-bilgi span{ color:var(--metin-acik); font-size:14px; }
.liste-siralama{ display:flex; align-items:center; gap:8px; }
.liste-siralama label{ font-size:14px; color:var(--metin-acik); }
.liste-siralama select{ border:1px solid var(--cizgi); border-radius:8px; padding:9px 12px; font-family:inherit; font-size:14px; }

.bos-sonuc{ text-align:center; padding:60px 20px; background:#fff; border:1px dashed var(--cizgi); border-radius:var(--radius); }
.bos-ikon{ font-size:46px; margin-bottom:12px; }
.bos-sonuc h3{ font-size:18px; }
.bos-sonuc p{ color:var(--metin-acik); margin-bottom:18px; }

/* ---------- Detay sayfası ---------- */
.detay-sayfa{ display:grid; grid-template-columns:1fr 350px; gap:26px; padding-top:22px; padding-bottom:48px; align-items:start; }

.galeri-buyuk{ position:relative; border-radius:var(--radius); overflow:hidden; background:var(--gri-bg); }
.galeri-buyuk img{ width:100%; aspect-ratio:16/10; object-fit:cover; }
.galeri-kucukler{ display:flex; gap:10px; margin-top:10px; flex-wrap:wrap; }
.galeri-kucuk{
    width:88px; height:66px; object-fit:cover; border-radius:8px; cursor:pointer;
    border:2px solid transparent; transition:.15s;
}
.galeri-kucuk:hover{ opacity:.85; }
.galeri-kucuk.aktif{ border-color:var(--kirmizi); }

.detay-ozet-mobil{ display:none; }

.hizli-ozellik{
    display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin:22px 0;
}
.hizli-ozellik > div{
    background:var(--gri-bg); border-radius:var(--radius); padding:14px; text-align:center;
}
.hizli-ozellik span{ display:block; font-size:12px; color:var(--metin-acik); margin-bottom:4px; }
.hizli-ozellik strong{ font-size:18px; }

.detay-blok{ margin-bottom:26px; }
.detay-blok h2{ font-size:19px; padding-bottom:10px; border-bottom:2px solid var(--gri-bg); margin-bottom:16px; }
.detay-tablo{ display:grid; grid-template-columns:1fr 1fr; gap:0 30px; }
.detay-satir{
    display:flex; justify-content:space-between; gap:12px;
    padding:11px 0; border-bottom:1px solid var(--cizgi); font-size:14px;
}
.detay-etiket{ color:var(--metin-acik); }
.detay-deger{ font-weight:700; text-align:right; }
.detay-aciklama{ color:#3a3f47; font-size:15px; line-height:1.7; }
.detay-aciklama p{ margin:0 0 12px; }
.detay-aciklama .ac-h2{ font-size:21px; font-weight:800; color:var(--metin); margin:18px 0 10px; letter-spacing:.3px; }
.detay-aciklama .ac-h3{ font-size:17px; font-weight:700; color:var(--metin); margin:16px 0 8px; }
.detay-aciklama .ac-h4{ font-size:15px; font-weight:700; color:var(--metin-acik); margin:14px 0 6px; }
.detay-aciklama .ac-liste{ margin:0 0 14px; padding-left:4px; }
.detay-aciklama .ac-liste li{ position:relative; padding-left:22px; margin-bottom:7px; }
.detay-aciklama .ac-liste li::before{ content:"✓"; position:absolute; left:0; top:0; color:var(--kirmizi); font-weight:800; }
.detay-aciklama .ac-liste-num{ margin:0 0 14px; padding-left:22px; list-style:decimal; }
.detay-aciklama .ac-liste-num li{ margin-bottom:7px; padding-left:4px; }
.detay-aciklama strong{ font-weight:700; color:var(--metin); }
.detay-aciklama em{ font-style:italic; }
.detay-aciklama .ac-hr{ border:none; border-top:1px solid var(--cizgi); margin:16px 0; }
.ozellik-liste{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.ozellik-liste li{ font-size:14px; color:#3a3f47; }

/* Sağ iletişim kart */
.detay-yan{ position:sticky; top:80px; }
.iletisim-kart{ background:#fff; border:1px solid var(--cizgi); border-radius:var(--radius); padding:20px; box-shadow:var(--golge); }
.detay-fiyat{ font-size:27px; font-weight:800; color:var(--kirmizi); }
.detay-fiyat small{ font-size:14px; color:var(--metin-acik); font-weight:600; }
.detay-fiyat--yan{ margin-bottom:8px; }
.detay-baslik{ font-size:22px; font-weight:700; }
.detay-baslik--yan{ font-size:16px; font-weight:600; margin-bottom:10px; }
.detay-konum{ display:flex; align-items:center; gap:6px; color:var(--metin-acik); font-size:14px; margin-bottom:16px; }
.detay-konum svg{ fill:var(--kirmizi); flex:0 0 auto; }

.danisman-kutu{ display:flex; align-items:center; gap:12px; padding:14px 0; border-top:1px solid var(--cizgi); border-bottom:1px solid var(--cizgi); margin-bottom:16px; }
.danisman-avatar{
    width:46px; height:46px; border-radius:50%; background:var(--lacivert); color:#fff;
    display:grid; place-items:center; font-weight:800; font-size:20px;
}
.danisman-kutu strong{ display:block; }
.danisman-kutu small{ color:var(--metin-acik); }
.iletisim-kart .btn{ margin-bottom:10px; }
.guven-not{ background:#f0f7f2; border:1px solid #cfe8d8; border-radius:8px; padding:12px; font-size:12.5px; color:#2d6a4f; margin-top:6px; }

.mobil-iletisim-bar{ display:none; }

/* ---------- Footer ---------- */
.site-footer{ background:var(--lacivert); color:#c7cdd8; margin-top:20px; }
.footer-grid{ display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:30px; padding:44px 16px 30px; }
.footer-col h4{ color:#fff; font-size:15px; margin-bottom:14px; }
.footer-col ul li{ margin-bottom:9px; }
.footer-col ul li a{ color:#aeb6c4; font-size:14px; }
.footer-col ul li a:hover{ color:#fff; }
.footer-brand p{ font-size:14px; margin:12px 0; }
.footer-contact a{ color:#aeb6c4; }
.footer-contact a:hover{ color:#fff; }
.footer-bottom{ border-top:1px solid rgba(255,255,255,.1); }
.footer-bottom .container{ display:flex; justify-content:space-between; padding:16px; font-size:13px; color:#8b93a3; flex-wrap:wrap; gap:8px; }

/* ---------- WhatsApp float ---------- */
.whatsapp-float{
    position:fixed; right:20px; bottom:20px; z-index:90;
    width:56px; height:56px; border-radius:50%; background:var(--yesil);
    display:grid; place-items:center; box-shadow:0 6px 18px rgba(37,211,102,.5);
    transition:.2s;
}
.whatsapp-float:hover{ transform:scale(1.08); }

/* ---------- Üye alanı (header) ---------- */
.fav-link{ position:relative; display:inline-flex; align-items:center; color:var(--metin); padding:6px; }
.fav-link:hover{ color:var(--kirmizi); }
.fav-sayac{
    position:absolute; top:-4px; right:-6px; background:var(--kirmizi); color:#fff;
    font-size:10px; font-weight:800; min-width:16px; height:16px; border-radius:9px;
    display:grid; place-items:center; padding:0 3px;
}
.fav-sayac:empty,.fav-sayac[data-bos="1"]{ display:none; }
.btn-uye{
    background:var(--kirmizi); color:#fff; border:none; border-radius:8px;
    padding:9px 16px; font-weight:700; font-size:14px; cursor:pointer; font-family:inherit;
}
.btn-uye:hover{ background:var(--kirmizi-koyu); }
.uye-menu{ position:relative; }
.uye-btn{
    display:flex; align-items:center; gap:8px; background:var(--gri-bg); border:1px solid var(--cizgi);
    border-radius:24px; padding:5px 12px 5px 5px; cursor:pointer; font-family:inherit; font-weight:600; font-size:14px;
}
.uye-avatar{ width:28px; height:28px; border-radius:50%; background:var(--lacivert); color:#fff; display:grid; place-items:center; font-weight:800; }
.uye-dropdown{
    position:absolute; right:0; top:calc(100% + 8px); background:#fff; border:1px solid var(--cizgi);
    border-radius:10px; box-shadow:var(--golge-hover); min-width:170px; padding:6px; display:none; z-index:120;
}
.uye-dropdown.acik{ display:block; }
.uye-dropdown a{ display:block; padding:10px 12px; border-radius:8px; font-size:14px; }
.uye-dropdown a:hover{ background:var(--gri-bg); }

/* ---------- Favori butonu (kart/detay) ---------- */
.fav-btn{
    position:absolute; top:10px; right:10px; width:34px; height:34px; border-radius:50%;
    background:rgba(255,255,255,.92); border:none; cursor:pointer; color:#8a94a6;
    display:grid; place-items:center; z-index:2; transition:.15s; box-shadow:0 2px 6px rgba(0,0,0,.15);
}
.fav-btn svg{ width:18px; height:18px; }
.fav-btn:hover{ transform:scale(1.1); color:var(--kirmizi); }
.fav-btn.aktif{ color:var(--kirmizi); }
.fav-btn.aktif svg{ fill:var(--kirmizi); }
.ilan-karti{ position:relative; }
.fav-btn--buyuk{ width:42px; height:42px; top:14px; right:14px; }
.fav-btn--buyuk svg{ width:22px; height:22px; }

/* ---------- Gelişmiş filtre (accordion) ---------- */
.filtre-panel-baslik{ display:flex; align-items:center; justify-content:space-between; margin-bottom:6px; padding-bottom:12px; border-bottom:2px solid var(--gri-bg); }
.filtre-panel-baslik h3{ margin:0; font-size:18px; }
.filtre-temizle{ font-size:13px; color:var(--kirmizi); font-weight:600; }

.filtre-blok{ border-bottom:1px solid var(--cizgi); }
.filtre-blok > summary{
    list-style:none; cursor:pointer; padding:14px 2px; font-weight:700; font-size:14px;
    display:flex; align-items:center; justify-content:space-between; user-select:none;
}
.filtre-blok > summary::-webkit-details-marker{ display:none; }
.filtre-blok > summary::after{ content:"⌄"; font-size:16px; color:var(--metin-acik); transition:.2s; }
.filtre-blok[open] > summary::after{ transform:rotate(180deg); }
.filtre-govde{ padding:2px 2px 16px; display:flex; flex-direction:column; gap:9px; }
.filtre-alt-baslik{ font-size:12px; font-weight:700; color:var(--metin-acik); text-transform:uppercase; margin:6px 0 2px; }

.filtre-govde select,.filtre-govde input[type=text],.filtre-govde input[type=number],.filtre-govde input[type=tel]{
    width:100%; border:1px solid var(--cizgi); border-radius:8px; padding:10px 12px; font-size:14px; font-family:inherit; color:var(--metin);
}
.filtre-govde select:focus,.filtre-govde input:focus{ outline:none; border-color:var(--kirmizi); }

.secim{ display:flex; align-items:center; gap:8px; font-size:14px; cursor:pointer; padding:2px 0; }
.secim.aktif{ color:var(--kirmizi); font-weight:600; }
.secim.pasif{ color:#b0b6c0; cursor:not-allowed; }
.secim input{ accent-color:var(--kirmizi); }

.filtre-etiketler{ flex-direction:row; flex-wrap:wrap; }
.oda-etiket{ cursor:pointer; }
.oda-etiket input{ display:none; }
.oda-etiket span{
    display:inline-block; padding:8px 14px; border:1px solid var(--cizgi); border-radius:8px; font-size:14px; font-weight:600;
}
.oda-etiket input:checked + span{ background:var(--kirmizi); color:#fff; border-color:var(--kirmizi); }

.fiyat-ikili{ display:flex; gap:8px; }
.daha-fazla-sar{ display:none; }
.daha-fazla-sar.acik{ display:block; }
.daha-fazla-btn{
    width:100%; margin:14px 0 6px; padding:11px; background:var(--gri-bg); border:1px solid var(--cizgi);
    border-radius:8px; font-weight:700; font-size:14px; cursor:pointer; font-family:inherit; color:var(--metin);
}
.daha-fazla-btn:hover{ background:#eceef1; }
.filtre-uygula{ margin-top:8px; }

/* Aktif filtre etiketleri (sonuç üstü) */
.aktif-filtreler{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:18px; }
.filtre-etiket-chip{
    display:inline-flex; align-items:center; gap:6px; background:#fff; border:1px solid var(--cizgi);
    border-radius:20px; padding:6px 12px; font-size:13px; font-weight:600; color:var(--metin);
}
.filtre-etiket-chip span{ color:var(--metin-acik); }
.filtre-etiket-chip:hover{ border-color:var(--kirmizi); color:var(--kirmizi); }
.filtre-etiket-temizle{ background:var(--gri-bg); }

/* ---------- Sayfalama ---------- */
.sayfalama{ display:flex; justify-content:center; gap:6px; margin-top:30px; flex-wrap:wrap; }
.sayfalama a{
    min-width:40px; text-align:center; padding:9px 12px; border:1px solid var(--cizgi); border-radius:8px;
    font-weight:600; font-size:14px; background:#fff;
}
.sayfalama a:hover{ border-color:var(--kirmizi); color:var(--kirmizi); }
.sayfalama a.aktif{ background:var(--kirmizi); color:#fff; border-color:var(--kirmizi); }

/* ---------- Paylaş / talep / harita ---------- */
.paylas-satir{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin:16px 0; font-size:14px; }
.paylas-satir > span{ color:var(--metin-acik); font-weight:600; }
.paylas-btn{ padding:7px 14px; border-radius:8px; border:1px solid var(--cizgi); background:#fff; font-size:13px; font-weight:600; cursor:pointer; font-family:inherit; color:var(--metin); }
.paylas-btn.wa:hover{ background:#25d366; color:#fff; border-color:#25d366; }
.paylas-btn.fb:hover{ background:#1877f2; color:#fff; border-color:#1877f2; }
.paylas-btn.tw:hover{ background:#000; color:#fff; border-color:#000; }
.paylas-btn.kopyala:hover{ background:var(--gri-bg); }
.harita-sar{ line-height:0; }

.talep-form{ margin-top:14px; padding-top:16px; border-top:1px solid var(--cizgi); display:flex; flex-direction:column; gap:10px; }
.talep-baslik{ font-weight:700; font-size:15px; }
.talep-form input,.talep-form textarea{ border:1px solid var(--cizgi); border-radius:8px; padding:10px 12px; font-family:inherit; font-size:14px; }
.talep-form input:focus,.talep-form textarea:focus{ outline:none; border-color:var(--kirmizi); }
.form-basari{ background:#e9f7ef; color:#1e7e46; padding:14px; border-radius:8px; font-size:14px; margin-top:14px; }

/* ---------- İletişim sayfası ---------- */
.iletisim-grid{ display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.iletisim-bilgi,.iletisim-form-kutu{ background:#fff; border:1px solid var(--cizgi); border-radius:12px; padding:24px; }
.iletisim-bilgi h3,.iletisim-form-kutu h3{ font-size:18px; margin-bottom:16px; }
.iletisim-liste li{ padding:12px 0; border-bottom:1px solid var(--cizgi); font-size:14px; }
.iletisim-liste li span{ display:block; font-size:12px; color:var(--metin-acik); text-transform:uppercase; margin-bottom:3px; }
.iletisim-btnlar{ display:flex; gap:10px; margin-top:18px; }
.genel-form{ display:flex; flex-direction:column; gap:12px; }
.genel-form input,.genel-form textarea{ border:1px solid var(--cizgi); border-radius:8px; padding:12px 14px; font-family:inherit; font-size:14px; }
.genel-form input:focus,.genel-form textarea:focus{ outline:none; border-color:var(--kirmizi); }

/* ---------- Üyelik modalı ---------- */
.modal-katman{
    position:fixed; inset:0; background:rgba(20,25,40,.55); z-index:300;
    display:none; align-items:center; justify-content:center; padding:16px; backdrop-filter:blur(2px);
}
.modal-katman.acik{ display:flex; }
.modal-kutu{ background:#fff; border-radius:16px; width:100%; max-width:400px; padding:28px; position:relative; box-shadow:0 20px 60px rgba(0,0,0,.3); }
.modal-kapat{ position:absolute; top:14px; right:14px; background:none; border:none; font-size:18px; cursor:pointer; color:var(--metin-acik); }
.modal-sekme{ display:flex; gap:8px; margin-bottom:18px; }
.modal-sekme button{ flex:1; padding:11px; background:var(--gri-bg); border:none; border-radius:8px; font-weight:700; font-size:14px; cursor:pointer; font-family:inherit; color:var(--metin-acik); }
.modal-sekme button.aktif{ background:var(--kirmizi); color:#fff; }
.uye-form{ display:flex; flex-direction:column; gap:6px; }
.uye-form label{ font-weight:600; font-size:13px; margin-top:6px; }
.uye-form input{ border:1px solid var(--cizgi); border-radius:8px; padding:12px 14px; font-family:inherit; font-size:15px; }
.uye-form input:focus{ outline:none; border-color:var(--kirmizi); }
.uye-form .btn{ margin-top:12px; }
.modal-not{ color:var(--metin-acik); font-size:13px; margin:0 0 6px; }
.uye-hata{ display:none; background:#fdeaea; color:#b60d17; padding:9px 12px; border-radius:8px; font-size:13px; margin-top:8px; }

/* ---------- Anlık arama ---------- */
.hero-arama{ position:relative; }
.canli-sonuc{
    display:none; position:absolute; left:0; right:0; top:calc(100% + 8px);
    background:#fff; border-radius:12px; box-shadow:0 16px 40px rgba(0,0,0,.25);
    overflow:hidden; z-index:30; text-align:left; max-height:70vh; overflow-y:auto;
}
.canli-sonuc.acik{ display:block; }
.canli-satir{ display:flex; align-items:center; gap:12px; padding:10px 14px; border-bottom:1px solid var(--gri-bg); }
.canli-satir:hover{ background:var(--gri-bg); }
.canli-satir img{ width:56px; height:44px; object-fit:cover; border-radius:6px; flex:0 0 auto; }
.canli-bilgi{ flex:1; min-width:0; }
.canli-baslik{ display:block; font-size:14px; font-weight:600; color:var(--metin); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.canli-alt{ display:block; font-size:12px; color:var(--metin-acik); }
.canli-fiyat{ font-weight:800; color:var(--kirmizi); font-size:14px; white-space:nowrap; }
.canli-tumu{ display:block; text-align:center; padding:12px; font-weight:700; color:var(--kirmizi); font-size:14px; }
.canli-tumu:hover{ background:var(--gri-bg); }
.canli-bos{ padding:18px; text-align:center; color:var(--metin-acik); font-size:14px; }

/* ---------- Satıldı bandı ---------- */
.satildi-bant{
    position:absolute; top:14px; left:-34px; transform:rotate(-45deg);
    background:#b60d17; color:#fff; font-weight:800; font-size:12px; letter-spacing:1px;
    padding:5px 40px; box-shadow:0 2px 6px rgba(0,0,0,.3); z-index:3;
}
.ilan-karti:has(.satildi-bant) .ilan-karti-foto img{ filter:grayscale(.4) brightness(.9); }

/* ---------- Yönetici düzenle ---------- */
.karti-duzenle{
    position:absolute; top:10px; left:10px; z-index:3;
    background:rgba(27,42,74,.92); color:#fff; font-size:12px; font-weight:700;
    padding:5px 10px; border-radius:6px; box-shadow:0 2px 6px rgba(0,0,0,.25);
}
.karti-duzenle:hover{ background:var(--lacivert); }
.ilan-karti .etiket--satilik,.ilan-karti .etiket--kiralik{ } /* etiketle çakışmasın diye düzenle sol-üstte, etiket de sol-üstte: etiketi sağa al */
.ilan-karti:has(.karti-duzenle) .etiket--satilik,
.ilan-karti:has(.karti-duzenle) .etiket--kiralik{ left:auto; right:10px; }

.admin-duzenle-cubugu{ background:#eef3fb; border-bottom:1px solid #d5e0f0; }
.admin-duzenle-cubugu .container{
    display:flex; align-items:center; justify-content:space-between; gap:12px;
    padding:10px 16px; flex-wrap:wrap;
}
.admin-duzenle-cubugu span{ font-size:14px; color:var(--lacivert); }
.admin-duzenle-cubugu .btn{ padding:8px 18px; font-size:14px; }

/* ---------- Danışman ---------- */
.danisman-kutu-bilgi{ display:flex; flex-direction:column; }
.danisman-kutu-bilgi strong{ line-height:1.2; }
.danisman-kutu-bilgi small{ color:var(--metin-acik); }
.danisman-tum-ilan{ margin-top:4px; font-size:13px; font-weight:700; color:var(--kirmizi); }
.danisman-tum-ilan:hover{ text-decoration:underline; }

.danisman-profil{
    display:flex; align-items:center; gap:20px; background:#fff; border:1px solid var(--cizgi);
    border-radius:var(--radius); padding:24px; box-shadow:var(--golge); margin-bottom:24px; flex-wrap:wrap;
}
.danisman-avatar--buyuk{ width:80px; height:80px; font-size:34px; flex:0 0 auto; }
.danisman-profil-bilgi{ flex:1; min-width:200px; }
.danisman-profil-bilgi h1{ font-size:24px; margin:0 0 2px; }
.danisman-unvan{ color:var(--metin-acik); font-size:15px; }
.danisman-iletisim{ display:flex; gap:10px; margin-top:14px; flex-wrap:wrap; }
.danisman-sayac{ text-align:center; padding:14px 24px; background:var(--gri-bg); border-radius:var(--radius); }
.danisman-sayac strong{ display:block; font-size:28px; color:var(--kirmizi); }
.danisman-sayac span{ font-size:13px; color:var(--metin-acik); }

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width:1024px){
    .ilan-grid{ grid-template-columns:repeat(3,1fr); }
    .kategori-kutucuklar{ grid-template-columns:repeat(2,1fr); }
    .ilce-kutucuklar{ grid-template-columns:repeat(3,1fr); }
    .neden-grid{ grid-template-columns:repeat(2,1fr); }
    .detay-sayfa{ grid-template-columns:1fr; }
    .detay-yan{ position:static; }
    .iletisim-kart{ display:none; }        /* mobil bar devreye girer */
}

@media (max-width:768px){
    body{ font-size:14px; }
    .main-nav{
        position:fixed; top:64px; left:0; right:0; background:#fff;
        flex-direction:column; gap:0; padding:8px 16px 16px;
        box-shadow:0 10px 20px rgba(0,0,0,.1); transform:translateY(-120%);
        transition:.25s; border-bottom:1px solid var(--cizgi); z-index:99;
    }
    .main-nav.acik{ transform:translateY(0); }
    .main-nav a{ padding:13px 6px; border-bottom:1px solid var(--gri-bg); border-radius:0; }
    .nav-toggle{ display:flex; }
    .btn-phone span,.btn-phone{ font-size:0; padding:9px; }
    .btn-phone svg{ width:18px; height:18px; }

    .hero{ padding:40px 0; }
    .hero-baslik{ font-size:23px; margin-bottom:20px; }
    .hero-arama-ic{ flex-wrap:wrap; padding:10px; }
    .hero-arama-ic input{ flex:1 1 100%; order:1; }
    .hero-arama-ic .hero-arama-ikon{ display:none; }
    .hero-arama-ic .btn{ flex:1 1 100%; order:2; }
    .uye-ad-kisa{ display:none; }
    .btn-uye{ font-size:0; padding:9px 12px; }
    .btn-uye::before{ content:"Üye"; font-size:14px; }

    .ilan-grid,.ilan-grid--liste{ grid-template-columns:repeat(2,1fr); gap:12px; }
    .kategori-kutucuklar{ grid-template-columns:repeat(2,1fr); }
    .ilce-kutucuklar{ grid-template-columns:repeat(2,1fr); }
    .neden-grid{ grid-template-columns:1fr 1fr; }
    .section{ padding:32px 0; }
    .section-baslik h2{ font-size:19px; }

    /* Liste: filtre paneli mobilde açılır kapanır */
    .liste-sayfa{ grid-template-columns:1fr; }
    .filtre-ac{
        display:inline-flex; align-items:center; gap:8px; margin-bottom:14px;
        background:#fff; border:1px solid var(--cizgi); border-radius:8px;
        padding:11px 18px; font-weight:700; font-family:inherit; cursor:pointer; color:var(--metin);
    }
    .filtre-panel{
        position:fixed; inset:0; z-index:200; border-radius:0; overflow-y:auto;
        display:none; top:0;
    }
    .filtre-panel.acik{ display:block; }

    .detay-tablo{ grid-template-columns:1fr; }
    .ozellik-liste{ grid-template-columns:1fr 1fr; }
    .hizli-ozellik{ grid-template-columns:repeat(2,1fr); }
    .detay-ozet-mobil{ display:block; margin-top:16px; }
    .detay-baslik--yan{ display:none; }

    .iletisim-serit .container{ flex-direction:column; text-align:center; }
    .footer-grid{ grid-template-columns:1fr 1fr; gap:22px; }

    /* Mobil sabit iletişim çubuğu (detay) */
    .mobil-iletisim-bar{
        display:flex; gap:10px; position:fixed; left:0; right:0; bottom:0; z-index:95;
        background:#fff; padding:10px 14px; border-top:1px solid var(--cizgi);
        box-shadow:0 -4px 14px rgba(0,0,0,.08);
    }
    .mobil-iletisim-bar .btn{ flex:1; }
    .whatsapp-float{ bottom:76px; }
}

@media (max-width:480px){
    .ilan-grid,.ilan-grid--liste{ grid-template-columns:1fr; }
    .footer-grid{ grid-template-columns:1fr; }
    .hero-baslik{ font-size:21px; }
}
