:root {
  --bosluk-1:.5rem; --bosluk-2:1rem; --bosluk-3:1.5rem; --bosluk-4:2rem; --bosluk-6:3rem; --bosluk-8:4rem;
  --yazi-sm:.9375rem; --yazi-md:1.0625rem; --yazi-lg:1.25rem;
  --koyu:#0e1626; --koyu-2:#16233a; --vurgu:#f0a500; --vurgu-koyu:#c78800; --metin:#2a2f3a; --metin-acik:#e8ecf4; --zemin:#f7f8fb; --kart:#ffffff; --cizgi:#e2e6ee;
  --yaricap:12px;
  --giris: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --baslik: "Poppins", var(--giris);
}
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { font-family:var(--giris); font-size:var(--yazi-md); line-height:1.7; color:var(--metin); background:var(--zemin); -webkit-font-smoothing:antialiased; }
p { margin-bottom:var(--bosluk-2); }
img { max-width:100%; display:block; }
h1,h2,h3 { font-family:var(--baslik); color:var(--koyu); line-height:1.25; }
h1 { font-size:clamp(1.75rem, 4vw, 2.75rem); }
h2 { font-size:clamp(1.4rem, 3vw, 2rem); margin-bottom:var(--bosluk-3); }
h3 { font-size:1.125rem; }
a { color:var(--vurgu-koyu); }
.atla { position:absolute; left:-999px; top:0; background:var(--koyu); color:#fff; padding:.75rem 1rem; z-index:99; }
.atla:focus { left:0; }

/* üst bar */
.ustbar { background:var(--koyu); color:#fff; position:sticky; top:0; z-index:50; box-shadow:0 2px 8px rgba(0,0,0,.25); }
.ustbar-ic { max-width:1180px; margin:0 auto; padding:0 var(--bosluk-3); display:flex; align-items:center; gap:var(--bosluk-3); min-height:68px; }
.marka { display:flex; align-items:center; gap:.6rem; color:#fff; text-decoration:none; font-family:var(--baslik); font-weight:700; font-size:1.05rem; }
.marka img { border-radius:8px; }
.menu { margin-left:auto; }
.menu ul { list-style:none; display:flex; gap:var(--bosluk-2); }
.menu a { color:#fff; text-decoration:none; font-weight:600; font-size:var(--yazi-sm); display:inline-flex; align-items:center; min-height:44px; }
.menu a:hover { color:var(--vurgu); }
.menu-dugme { display:none; background:none; border:1px solid rgba(255,255,255,.3); color:#fff; padding:.5rem .9rem; border-radius:8px; font:inherit; cursor:pointer; min-height:44px; }
.dugme { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:.7rem 1.4rem; border-radius:10px; font-weight:600; text-decoration:none; font-size:var(--yazi-sm); transition:background .2s; }
.dugme-ana { background:var(--vurgu); color:var(--koyu); }
.dugme-ana:hover { background:var(--vurgu-koyu); color:#fff; }
.dugme-ikincil { background:transparent; color:#fff; border:1px solid rgba(255,255,255,.5); }
.dugme-ikincil:hover { background:rgba(255,255,255,.12); }
.dugme-buyuk { font-size:1.15rem; padding:1rem 2rem; }
.dugme-telefon { background:var(--vurgu); color:var(--koyu); }

/* hero */
.hero { position:relative; min-height:520px; display:flex; align-items:center; }
.hero img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.hero-ic { position:relative; max-width:1180px; margin:0 auto; padding:var(--bosluk-8) var(--bosluk-3); width:100%; }
.hero::after { content:""; position:absolute; inset:0; background:linear-gradient(100deg, rgba(10,16,28,.92) 30%, rgba(10,16,28,.55) 70%, rgba(10,16,28,.3)); }
.hero-rozet { position:relative; z-index:1; display:inline-block; background:var(--vurgu); color:var(--koyu); font-weight:600; font-size:var(--yazi-sm); padding:.35rem .9rem; border-radius:999px; margin-bottom:var(--bosluk-2); }
.hero h1, .hero-metin, .hero-dugmeler { position:relative; z-index:1; color:#fff; }
.hero h1 { max-width:760px; }
.hero-metin { max-width:640px; margin:var(--bosluk-2) 0 var(--bosluk-4); font-size:var(--yazi-lg); }
.hero-dugmeler { display:flex; gap:var(--bosluk-2); flex-wrap:wrap; }

/* bölümler */
.bolum { max-width:1180px; margin:0 auto; padding:var(--bosluk-8) var(--bosluk-3); }
.bolum-koyu { max-width:none; background:var(--koyu-2); color:var(--metin-acik); }
.bolum-koyu h2 { color:#fff; }
.bolum-koyu .kart-ciplak h3 { color:#fff; }
.bolum-koyu .kart-ciplak p { color:var(--metin-acik); }
.bolum-cta { text-align:center; background:var(--koyu); color:#fff; max-width:none; }
.bolum-cta h2 { color:#fff; }
.bolum-cta p { margin-bottom:var(--bosluk-3); }
.bolum-giris { max-width:760px; margin-bottom:var(--bosluk-4); }
.bolum-koyu .ikon { fill:var(--vurgu); }

/* kartlar */
.izgara { display:grid; gap:var(--bosluk-3); }
.izgara-2 { grid-template-columns:repeat(2, 1fr); }
.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(--yaricap); overflow:hidden; display:flex; flex-direction:column; }
.kart img { aspect-ratio:3/2; object-fit:cover; width:100%; }
.kart-govde { padding:var(--bosluk-3); display:flex; flex-direction:column; gap:.6rem; flex:1; }
.kart-govde h2 a, .kart-govde h3 a { color:var(--koyu); text-decoration:none; }
.kart-govde h2 a:hover, .kart-govde h3 a:hover { color:var(--vurgu-koyu); }
.kart-baglanti { margin-top:auto; font-weight:600; text-decoration:none; }
.kart-ciplak { padding:var(--bosluk-3); background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); }
.bolum .kart-ciplak { background:var(--kart); border-color:var(--cizgi); }
.ikon { width:40px; height:40px; fill:var(--vurgu-koyu); margin-bottom:.6rem; }

/* mahalle listesi */
.mahalle-listesi { list-style:none; display:grid; grid-template-columns:repeat(3, 1fr); gap:var(--bosluk-2); }
.mahalle-listesi a { display:flex; align-items:center; gap:.6rem; min-height:52px; padding:.6rem 1rem; background:var(--kart); border:1px solid var(--cizgi); border-radius:10px; text-decoration:none; font-size:1rem; font-weight:600; color:var(--metin); line-height:1.4; }
.mahalle-listesi a::before { content:""; width:8px; height:8px; border-radius:50%; background:var(--vurgu); flex-shrink:0; }
.mahalle-listesi a:hover { border-color:var(--vurgu); color:var(--vurgu-koyu); background:#fffdf5; }
.mahalle-listesi strong { font-weight:700; color:var(--koyu); }
.mahalle-listesi a:hover strong { color:var(--vurgu-koyu); }
.mahalle-buyuk { grid-template-columns:repeat(3, 1fr); }

/* yorum */
.yorum { background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); border-radius:var(--yaricap); padding:var(--bosluk-3); }
.yorum p { font-style:italic; }
.yorum cite { display:block; margin-top:.8rem; color:var(--vurgu); font-style:normal; font-weight:600; font-size:var(--yazi-sm); }

/* hizmet detay */
.kirintilar { font-size:var(--yazi-sm); margin-bottom:var(--bosluk-3); color:#6b7280; }
.kirintilar a { color:var(--vurgu-koyu); text-decoration:none; }
.hizmet-baslik { display:flex; gap:var(--bosluk-4); align-items:flex-start; margin-bottom:var(--bosluk-4); flex-wrap:wrap; }
.hizmet-baslik img { width:360px; aspect-ratio:3/2; object-fit:cover; border-radius:var(--yaricap); flex-shrink:0; }
.hizmet-baslik div { flex:1; min-width:280px; }
.hizmet-ozet { font-size:var(--yazi-lg); margin-bottom:var(--bosluk-3); }
.madde-listesi { list-style:none; margin-bottom:var(--bosluk-4); }
.madde-listesi li { padding:.5rem 0 .5rem 1.6rem; position:relative; border-bottom:1px solid var(--cizgi); }
.madde-listesi li::before { content:"✓"; position:absolute; left:0; color:var(--vurgu-koyu); font-weight:700; }

/* sss */
.sss-oge { background:var(--kart); border:1px solid var(--cizgi); border-radius:var(--yaricap); margin-bottom:.75rem; }
.sss-oge summary { cursor:pointer; padding:1rem 1.2rem; list-style:none; min-height:44px; display:flex; align-items:center; }
.sss-oge summary::-webkit-details-marker { display:none; }
.sss-oge summary h2 { font-size:1.05rem; margin:0; }
.sss-oge p { padding:0 1.2rem 1rem; }

/* hakkımızda */
.istatistik { display:grid; grid-template-columns:repeat(4, 1fr); gap:var(--bosluk-3); margin:var(--bosluk-4) 0; text-align:center; }
.istatistik strong { display:block; font-family:var(--baslik); font-size:2rem; color:var(--vurgu-koyu); }
.istatistik span { font-size:var(--yazi-sm); color:#6b7280; }

/* iletişim */
.iletisim-buyuk a { font-size:1.4rem; font-weight:700; text-decoration:none; }

/* altlık */
.altlik { background:var(--koyu); color:var(--metin-acik); padding:var(--bosluk-6) var(--bosluk-3) var(--bosluk-2); }
.altlik-ic { max-width:1180px; margin:0 auto; display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:var(--bosluk-4); }
.altlik h3 { color:#fff; font-size:1rem; margin-bottom:.8rem; }
.altlik ul { list-style:none; }
.altlik a { color:var(--metin-acik); text-decoration:none; display:inline-flex; align-items:center; min-height:44px; font-size:var(--yazi-sm); }
.altlik a:hover { color:var(--vurgu); }
.altlik-tel a { color:var(--vurgu); font-weight:700; font-size:1.1rem; }
.altlik-alt { max-width:1180px; margin:var(--bosluk-4) auto 0; padding-top:var(--bosluk-2); border-top:1px solid rgba(255,255,255,.15); font-size:var(--yazi-sm); }

/* mobil */
@media (max-width: 900px) {
  .izgara-3, .izgara-4 { grid-template-columns:repeat(2, 1fr); }
  .mahalle-listesi, .mahalle-buyuk { grid-template-columns:repeat(2, 1fr); }
  .altlik-ic { grid-template-columns:1fr 1fr; }
  .istatistik { grid-template-columns:repeat(2, 1fr); }
  .dugme-telefon span { display:none; }
  .menu-dugme { display:inline-flex; align-items:center; }
  .menu ul { display:none; position:absolute; top:68px; left:0; right:0; background:var(--koyu); flex-direction:column; padding:var(--bosluk-2) var(--bosluk-3); gap:0; box-shadow:0 8px 16px rgba(0,0,0,.3); }
  .menu ul.acik { display:flex; }
  .menu ul li a { min-height:48px; width:100%; }
}
@media (max-width: 560px) {
  .izgara-2, .izgara-3, .izgara-4 { grid-template-columns:1fr; }
  .mahalle-listesi, .mahalle-buyuk { grid-template-columns:1fr; }
  .mahalle-listesi a { font-size:.95rem; }
  .altlik-ic { grid-template-columns:1fr; }
  .hizmet-baslik img { width:100%; }
  .hero { min-height:440px; }
}