/* ============ Tokenlar ============ */
:root {
  --bosluk-1:.5rem; --bosluk-2:1rem; --bosluk-3:1.5rem; --bosluk-4:2rem;
  --bosluk-6:3rem; --bosluk-8:4rem; --bosluk-12:6rem;
  --yazi-sm:.9375rem; --yazi-md:1.0625rem; --yazi-lg:1.25rem;
  --yazi-xl:1.5rem; --yazi-2xl:2rem; --yazi-3xl:2.75rem;
  --koyu:#14181f; --koyu-2:#1d232d; --metin:#2a313c; --soluk:#5b6472;
  --zemin:#f7f6f3; --kart:#ffffff; --cizgi:#e4e1da;
  --vurgu:#b8860b; --vurgu-koyu:#8a6508; --vurgu-zemin:#fdf6e3;
  --basari:#1a7f4e; --tehlike:#b3261e;
  --yari-cap:12px; --golge:0 2px 12px rgba(20,24,31,.08);
  --font-govde:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --font-baslik:'Poppins',system-ui,sans-serif;
}
* { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; }
body { font-family:var(--font-govde); font-size:var(--yazi-md); line-height:1.65; color:var(--metin); background:var(--zemin); }
img { max-width:100%; display:block; }
h1,h2,h3 { font-family:var(--font-baslik); color:var(--koyu); line-height:1.25; }
h1 { font-size:var(--yazi-3xl); } h2 { font-size:var(--yazi-2xl); } h3 { font-size:var(--yazi-lg); }
a { color:var(--vurgu-koyu); }
.kapsayici { max-width:1120px; margin-inline:auto; padding-inline:var(--bosluk-3); }
.bolum { padding-block:var(--bosluk-8); }
.bolum-koyu { background:var(--koyu); color:#e8e4dc; }
.bolum-koyu h2, .bolum-koyu h3 { color:#fff; }
.bolum-baslik { max-width:640px; margin-bottom:var(--bosluk-6); }
.bolum-baslik p { color:var(--soluk); margin-top:var(--bosluk-2); }
.bolum-koyu .bolum-baslik p { color:#b9b2a4; }
.etiket { display:inline-block; font-size:var(--yazi-sm); font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--vurgu-koyu); margin-bottom:var(--bosluk-2); }

/* ============ Erişilebilirlik ============ */
.atla { position:absolute; left:-999px; top:0; background:var(--koyu); color:#fff; padding:var(--bosluk-2); z-index:100; }
.atla:focus { left:0; }
:focus-visible { outline:3px solid var(--vurgu); outline-offset:2px; }

/* ============ Üst bar ============ */
.ust { background:var(--koyu); position:sticky; top:0; z-index:50; box-shadow:var(--golge); }
.ust-ic { display:flex; align-items:center; gap:var(--bosluk-3); min-height:72px; }
.marka { display:flex; align-items:center; gap:var(--bosluk-2); text-decoration:none; margin-right:auto; }
.marka img { border-radius:8px; }
.marka-yazi { font-family:var(--font-baslik); font-weight:700; color:#fff; font-size:var(--yazi-md); display:flex; flex-direction:column; line-height:1.2; }
.marka-yazi small { font-weight:400; color:var(--vurgu); font-size:.75rem; letter-spacing:.1em; text-transform:uppercase; }
.menu { display:flex; gap:var(--bosluk-1); }
.menu a { color:#d8d3c8; text-decoration:none; font-weight:600; font-size:var(--yazi-sm); padding:var(--bosluk-2) var(--bosluk-2); min-height:44px; display:inline-flex; align-items:center; border-radius:8px; }
.menu a:hover, .menu a.aktif { color:#fff; background:rgba(255,255,255,.08); }
.dugme-telefon { background:var(--vurgu); color:var(--koyu); font-weight:700; text-decoration:none; padding:var(--bosluk-2) var(--bosluk-3); border-radius:6px; min-height:44px; display:inline-flex; align-items:center; gap:var(--bosluk-1); }
.dugme-telefon:hover { background:#d9a520; }
.menu-dugme { display:none; background:none; border:0; color:#fff; cursor:pointer; min-height:44px; min-width:44px; align-items:center; justify-content:center; }

/* ============ Düğmeler ============ */
.dugme { display:inline-flex; align-items:center; justify-content:center; gap:var(--bosluk-1); min-height:48px; padding:var(--bosluk-2) var(--bosluk-4); border-radius:999px; font-weight:700; text-decoration:none; border:2px solid transparent; cursor:pointer; font-size:var(--yazi-md); font-family:var(--font-govde); }
.dugme-vurgu { background:var(--vurgu); color:var(--koyu); }
.dugme-vurgu:hover { background:#d9a520; }
.dugme-koyu { background:var(--koyu); color:#fff; }
.dugme-koyu:hover { background:var(--koyu-2); }
.dugme-cizgi { border-color:var(--vurgu); color:var(--vurgu-koyu); background:transparent; }
.dugme-cizgi:hover { background:var(--vurgu-zemin); }

/* ============ Hero ============ */
.hero { position:relative; color:#fff; padding-block:var(--bosluk-12); background:linear-gradient(rgba(15,18,24,.82), rgba(15,18,24,.82)), url(../img/hero.webp) center/cover; }
.hero-ic { max-width:720px; }
.hero h1 { color:#fff; font-size:var(--yazi-3xl); margin-bottom:var(--bosluk-3); }
.hero p { font-size:var(--yazi-lg); color:#d8d3c8; margin-bottom:var(--bosluk-4); }
.hero-dugmeler { display:flex; gap:var(--bosluk-3); flex-wrap:wrap; }
.hero-rozetler { display:flex; gap:var(--bosluk-4); margin-top:var(--bosluk-6); flex-wrap:wrap; }
.hero-rozet { display:flex; align-items:center; gap:var(--bosluk-2); font-size:var(--yazi-sm); font-weight:600; color:#d8d3c8; }
.hero-rozet svg { color:var(--vurgu); flex:none; }

/* ============ Kartlar / ızgara ============ */
.izgara { display:grid; gap:var(--bosluk-3); }
.izgara-3 { grid-template-columns:repeat(3,1fr); }
.izgara-4 { grid-template-columns:repeat(4,1fr); }
.kart { background:var(--kart); border:1px solid var(--cizgi); border-radius:var(--yari-cap); overflow:hidden; box-shadow:var(--golge); display:flex; flex-direction:column; }
.kart img { aspect-ratio:16/10; object-fit:cover; width:100%; }
.kart-govde { padding:var(--bosluk-3); display:flex; flex-direction:column; gap:var(--bosluk-2); flex:1; }
.kart-govde p { color:var(--soluk); font-size:var(--yazi-sm); flex:1; }
.kart-baslik { display:flex; align-items:center; gap:var(--bosluk-2); }
.kart-baslik svg { color:var(--vurgu); flex:none; }
.kart-baglanti { font-weight:700; font-size:var(--yazi-sm); text-decoration:none; color:var(--vurgu-koyu); min-height:44px; display:inline-flex; align-items:center; }
.kart-baglanti:hover { text-decoration:underline; }

/* ============ İstatistik şeridi ============ */
.istatistik { display:grid; grid-template-columns:repeat(4,1fr); gap:var(--bosluk-3); text-align:center; }
.istatistik-sayi { font-family:var(--font-baslik); font-size:var(--yazi-2xl); color:var(--vurgu); font-weight:700; }
.istatistik p { color:#b9b2a4; font-size:var(--yazi-sm); }

/* ============ Adım şeridi ============ */
.adimlar { display:grid; grid-template-columns:repeat(3,1fr); gap:var(--bosluk-3); counter-reset:adim; }
.adim { background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.12); border-radius:var(--yari-cap); padding:var(--bosluk-3); }
.adim::before { counter-increment:adim; content:"0" counter(adim); font-family:var(--font-baslik); font-size:var(--yazi-xl); color:var(--vurgu); font-weight:700; display:block; margin-bottom:var(--bosluk-2); }
.adim p { color:#b9b2a4; font-size:var(--yazi-sm); }
.adim h3 { color:#fff; margin-bottom:var(--bosluk-1); }

/* ============ Mahalle şeridi ============ */
.mahalle-serit { display:flex; flex-wrap:wrap; gap:var(--bosluk-2); }
.mahalle-rozet { background:var(--kart); border:1px solid var(--cizgi); border-radius:999px; padding:var(--bosluk-2) var(--bosluk-3); min-height:44px; display:inline-flex; align-items:center; text-decoration:none; font-weight:600; font-size:var(--yazi-sm); color:var(--metin); }
.mahalle-rozet:hover { border-color:var(--vurgu); color:var(--vurgu-koyu); }

/* ============ SSS ============ */
.sss-oge { background:var(--kart); border:1px solid var(--cizgi); border-radius:var(--yari-cap); margin-bottom:var(--bosluk-2); }
.sss-oge summary { padding:var(--bosluk-3); font-weight:600; cursor:pointer; min-height:44px; display:flex; align-items:center; color:var(--koyu); list-style:none; }
.sss-oge summary::-webkit-details-marker { display:none; }
.sss-oge summary::after { content:"+"; margin-left:auto; font-size:var(--yazi-xl); color:var(--vurgu); font-weight:700; }
.sss-oge[open] summary::after { content:"−"; }
.sss-oge p { padding:0 var(--bosluk-3) var(--bosluk-3); color:var(--soluk); }

/* ============ Form ============ */
.form-kart { background:var(--kart); border:1px solid var(--cizgi); border-radius:var(--yari-cap); padding:var(--bosluk-4); box-shadow:var(--golge); max-width:560px; }
.form-alan { margin-bottom:var(--bosluk-3); }
.form-alan label { display:block; font-weight:600; font-size:var(--yazi-sm); margin-bottom:var(--bosluk-1); color:var(--koyu); }
.form-alan input, .form-alan textarea { width:100%; padding:var(--bosluk-2); border:1px solid var(--cizgi); border-radius:8px; font:inherit; background:#fff; color:var(--metin); }
.form-alan input:focus, .form-alan textarea:focus { border-color:var(--vurgu); outline:2px solid var(--vurgu); outline-offset:0; }
.bildirim-ok { background:#e8f5ee; border:1px solid #bfe3cf; color:var(--basari); padding:var(--bosluk-2) var(--bosluk-3); border-radius:8px; margin-bottom:var(--bosluk-3); font-weight:600; }
.bildirim-hata { background:#fdecea; border:1px solid #f5c6c0; color:var(--tehlike); padding:var(--bosluk-2) var(--bosluk-3); border-radius:8px; margin-bottom:var(--bosluk-3); font-weight:600; }

/* ============ İletişim sayfası ============ */
.iletisim-izgara { display:grid; grid-template-columns:1fr 1fr; gap:var(--bosluk-6); align-items:start; }
.iletisim-liste { list-style:none; display:flex; flex-direction:column; gap:var(--bosluk-3); }
.iletisim-liste li { display:flex; gap:var(--bosluk-2); align-items:flex-start; }
.iletisim-liste svg { color:var(--vurgu); flex:none; margin-top:4px; }
.iletisim-liste strong { display:block; color:var(--koyu); }

/* ============ Hizmet detay ============ */
.hizmet-hero { background:var(--vurgu-zemin); padding-block:var(--bosluk-8); }
.hizmet-izgara { display:grid; grid-template-columns:1.2fr .8fr; gap:var(--bosluk-6); align-items:start; }
.hizmet-gorsel { border-radius:var(--yari-cap); overflow:hidden; box-shadow:var(--golge); }
.hizmet-gorsel img { aspect-ratio:4/3; object-fit:cover; width:100%; }
.madde-liste { list-style:none; display:flex; flex-direction:column; gap:var(--bosluk-2); margin-top:var(--bosluk-3); }
.madde-liste li { display:flex; gap:var(--bosluk-2); align-items:flex-start; }
.madde-liste svg { color:var(--basari); flex:none; margin-top:4px; }

/* ============ Mahalle sayfası ============ */
.mahalle-hero { background:linear-gradient(rgba(15,18,24,.85), rgba(15,18,24,.85)), var(--koyu-2); color:#fff; padding-block:var(--bosluk-8); }
.mahalle-hero h1 { color:#fff; }
.mahalle-hero p { color:#d8d3c8; max-width:640px; }
.komsu-serit { margin-top:var(--bosluk-4); }

/* ============ Altlık ============ */
.altlik { background:var(--koyu); color:#b9b2a4; padding-block:var(--bosluk-8) var(--bosluk-4); margin-top:var(--bosluk-8); }
.altlik-ic { display:grid; grid-template-columns:1.4fr 1fr 1fr 1.2fr; gap:var(--bosluk-4); }
.altlik-kol img { border-radius:8px; margin-bottom:var(--bosluk-2); }
.altlik-kol h3 { color:#fff; font-size:var(--yazi-md); margin-bottom:var(--bosluk-2); }
.altlik-kol ul { list-style:none; display:flex; flex-direction:column; }
.altlik-kol a { color:#b9b2a4; text-decoration:none; min-height:44px; display:inline-flex; align-items:center; }
.altlik-kol a:hover { color:var(--vurgu); }
.altlik-son { border-top:1px solid rgba(255,255,255,.1); margin-top:var(--bosluk-6); padding-top:var(--bosluk-3); font-size:var(--yazi-sm); }
.whatsapp-sabit { position:fixed; right:var(--bosluk-3); bottom:var(--bosluk-3); background:#22c55e; color:#fff; width:56px; height:56px; border-radius:50%; display:flex; align-items:center; justify-content:center; box-shadow:var(--golge); z-index:60; }
.whatsapp-sabit:hover { background:#16a34a; }

/* ============ Sayfa başlığı (iç sayfa) ============ */
.sayfa-baslik { background:var(--vurgu-zemin); padding-block:var(--bosluk-6); }
.sayfa-baslik h1 { font-size:var(--yazi-2xl); }
.sayfa-baslik p { color:var(--soluk); margin-top:var(--bosluk-1); max-width:640px; }
.kirintilar { font-size:var(--yazi-sm); color:var(--soluk); margin-bottom:var(--bosluk-2); }
.kirintilar a { text-decoration:none; }

/* ============ Mobil ============ */
@media (max-width:900px) {
  .izgara-3, .izgara-4, .adimlar, .istatistik { grid-template-columns:repeat(2,1fr); }
  .hizmet-izgara, .iletisim-izgara { grid-template-columns:1fr; }
  .altlik-ic { grid-template-columns:1fr 1fr; }
  .menu { position:absolute; top:72px; left:0; right:0; background:var(--koyu-2); flex-direction:column; padding:var(--bosluk-2); display:none; box-shadow:var(--golge); }
  .menu.acik { display:flex; }
  .menu-dugme { display:inline-flex; }
  .dugme-telefon span { display:none !important; }
  .dugme-telefon { padding:var(--bosluk-2); }
}
@media (max-width:560px) {
  h1 { font-size:var(--yazi-2xl); }
  .izgara-3, .izgara-4, .adimlar, .istatistik, .altlik-ic { grid-template-columns:1fr; }
  .hero { padding-block:var(--bosluk-8); }
  .bolum { padding-block:var(--bosluk-6); }
}