:root{
  --red:#d41010;
  --overlay: .050; 
  --bg:#ffffff;
  --text:#1f1f1f;
  --muted:#666;
  --surface:#f6f7f8;
  --radius:16px;
  --shadow:0 8px 24px rgba(0,0,0,.08);
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color:var(--text); background:var(--bg); line-height:1.6;
}

/* Layout */
.container{max-width:1100px;margin-inline:auto;padding:0 20px}
.section{padding:72px 0}
.section--light{background:var(--surface)}
.grid{display:grid;gap:32px}
.grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}

/* Topbar */
.topbar{
  background:var(--red); color:#fff; position:sticky; top:0; z-index:40;
  box-shadow:0 2px 12px rgba(0,0,0,.12);
}
.topbar__inner{
  display:flex; align-items:center; justify-content:space-between;
  min-height:70px; /* daha geniş */
  gap:16px;
  padding: 0 16;
}
.topbar__logo img{
  height: 170px;       /* net okunabilir boyut */
  width: auto;        /* oran korunsun */
  display: block;     /* alt boşluğu kaldırır */
}
.topbar .container{display:flex;align-items:center;justify-content:space-between;height:40px}
.topbar__info{ margin:0; font-weight:600; opacity:.95; }
.topbar__actions{ display:flex; gap:10px; }
@media (max-width: 768px){
  .topbar__actions{ display:none; }
}

/* Buttons */
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  height:44px;padding:0 18px;border-radius:999px;border:2px solid transparent;
  font-weight:600;text-decoration:none;transition:.2s;cursor:pointer;
}
.btn--primary{background:var(--red);color:#fff}
.btn--primary:hover{filter:brightness(.9)}
.btn--outline{background:transparent;border-color:var(--red);color:var(--red)}
.btn--outline:hover{background:var(--red);color:#fff}
.btn--ghost{background:rgba(255,255,255,.15);color:#fff;border-color:rgba(255,255,255,.25)}
.btn--ghost:hover{background:rgba(255,255,255,.25)}

/* Nav */
.nav{display:flex;align-items:center;justify-content:space-between;height: 68px;}
.nav__logo img{height:44px}
.nav__menu{display:flex;gap:20px;list-style:none;margin:0;padding:0}
.nav__menu a{color:#fff;text-decoration:none;font-weight:600;opacity:.9}
.nav__menu a:hover{opacity:1}

/* Burger */
.nav__toggle{display:none}
.nav__burger{display:none;width:28px;height:20px;position:relative;cursor:pointer}
.nav__burger::before,.nav__burger::after,
.nav__burger{background:#fff;border-radius:2px}
.nav__burger::before,.nav__burger::after{content:"";position:absolute;left:0;right:0;height:2px}
.nav__burger{height:2px}
.nav__burger::before{top:-8px}
.nav__burger::after{top:8px}
nav.nav.container{align-items: center; margin-right: 0;}


/* Hero */
.hero{
  position:relative; color:#fff; min-height:72vh;
  display:flex; align-items:center; justify-content:center; /* ortala */
  padding:0 0 48px; overflow:hidden;
}
/* HERO BG */
.hero__bg{
  position:absolute; inset:0;
  background:
    linear-gradient(0deg, rgba(255,0,0,var(--overlay)), rgba(255,0,0,var(--overlay))),
    url('src/images/main-header-img.png') center/cover no-repeat; /* görseli kapla */
  z-index:-1;
}
.hero__content{
  width:100%; text-align:left; display:grid; place-items:center start; gap:18px;
  padding:24px 20;
}
.hero__title{
  font-family: "Poppins", Inter, system-ui, sans-serif;
  font-weight:800; font-size:48px; line-height:1.1; margin:8px 0 4px;
  text-shadow:0 2px 10px rgba(0,0,0,.18);
}
.hero__subtitle{
  font-family: "Poppins", Inter, system-ui, sans-serif;
  font-weight:700; font-size:20px; margin:0 0 14px;
  text-shadow:0 1px 8px rgba(0,0,0,.18);
}
.hero__ctas{display:flex; gap:12px; flex-wrap:wrap; justify-content:flex-start}

/* Cards / Asides */
.card{background:#fff;border-radius:var(--radius);box-shadow:var(--shadow);padding:24px}
.card--cta h3{margin-top:0}

/* Forms */
form label{display:grid;gap:8px;font-weight:600;margin-bottom:14px}
input,select,textarea{
  width:100%;border:1.5px solid #e5e7eb;border-radius:12px;padding:12px 14px;font:inherit;
  outline:none;transition:border-color .2s, box-shadow .2s;background:#fff;
}
textarea{ resize:none; min-height:140px; max-height:140px; }
.char-counter{ display:block; text-align:right; font-size:13px; color:#666; margin-top:4px; }

.char-counter {
  display: block;
  text-align: right;
  font-size: 13px;
  color: #666;
  margin-top: 4px;
}

input:focus,select:focus,textarea:focus{
  border-color:var(--red); box-shadow:0 0 0 4px rgba(255,0,0,.12);
}
.quick-form .kvkk,.contact-form .kvkk{display:block;color:var(--muted);font-size:12px;margin-top:8px}

/* Features */
.features{gap:20px}
.feature{background:#fff;border-radius:14px;padding:20px;box-shadow:var(--shadow)}
.feature h3{margin:0 0 6px}

/* ikon “rozet”i */
.feature__icon{
  display:inline-grid; place-items:center; justify-content: start;
  width:56px; height:56px; margin-bottom:10px;
  border-radius:14px;   /* açık kırmızı zemin */
  color:var(--red);                    /* svg stroke rengi */
}
.feature__icon svg{ width:28px; height:28px }


/* Districts */
.districts{display:flex;flex-wrap:wrap;gap:10px;list-style:none;padding:0;margin:16px 0 0}
.districts li{background:#fff;border:1px solid #eee;padding:8px 12px;border-radius:999px}

.districts li.is-hidden { display: none; }

.districts__more-btn{
  background:#fff; border:1px solid #eee; padding:8px 12px;
  border-radius:999px; cursor:pointer; user-select:none;
  font-weight:600; color:#1f1f1f; box-shadow:0 2px 8px rgba(0,0,0,.06);
}
.districts__more-btn:focus-visible{ outline:3px solid rgba(255,0,0,.25) }

/* Açılınca gizliler görünsün */
.districts.expanded li.is-hidden { display:inline-flex; }


/* Map */
.map-wrap iframe{
  width:100%;
  min-height: 320px;   /* 320px'ten büyüttük */
  border:0;
  border-radius:14px;
  box-shadow:var(--shadow);
}
@media (min-width:1024px){
  .map-wrap iframe{ min-height: 420px; } /* desktop'ta daha büyük */
}


/* Contact */
.contact-list{list-style:none;padding:0;margin:0 0 16px}
.contact-list li{margin:6px 0}

/* Footer */
.footer{background:#0f0f10;color:#cfcfd3;padding:32px 0; min-height: 460px;}
.footer__grid{display:grid;gap:24px;grid-template-columns:2fr 1fr 1fr;align-items:center}
.footer__brand img{height:170px}
.footer__links{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.footer__links a{color:#cfcfd3;text-decoration:none}
.footer__links a:hover{color:#fff}
.footer__legal{font-size:14px}
.footer__legal a{color:#cfcfd3}
.copy{margin:8px 0 0}
/* mobilde tek sütun */
@media (max-width: 640px){
  .footer__grid {
    grid-template-columns: 1fr;   /* tüm bloklar alt alta */
    gap: 90px;
    align-items: start;           /* yukarıdan hizala */
    text-align: center;           /* istersen ortala */
  }
}


/* Section titles */
h2{font-size:32px;line-height:1.2;margin:0 0 12px}
p{margin:0 0 10px}

/* Alternating backgrounds on mobile spacing helper */
.section + .section{scroll-margin-top:110px}

/* Responsive */
@media (max-width: 1024px){
  .grid--3{grid-template-columns:repeat(1,minmax(0,1fr))}
}
@media (max-width: 768px){
  .grid--2{grid-template-columns:1fr}
  .nav__menu{
    position:absolute;inset:72px 0 auto 0;background:rgba(0,0,0,.6);
    backdrop-filter:saturate(160%) blur(8px);
    top: 100%;       
    padding:12px 20px;display:none;flex-direction:column;gap:12px
  }
  .nav__burger{display:block}
  .nav__menu a{padding:10px 0}
  .nav__toggle:checked ~ .nav__menu{display:flex}
  .hero{min-height:72vh; justify-content: center};
}

/* Hizmetlerimiz */

/* Bölüm zemin */
.section--services{ background:var(--surface); }

/* Eyebrow (küçük başlık etiketi) */
.eyebrow{
  display:inline-block; font-weight:700; font-size:13px; letter-spacing:.4px;
  color:var(--red); background:#fff; border:2px solid rgba(255,0,0,.15);
  padding:6px 10px; border-radius:999px; margin-bottom:10px;
}

/* Üst tanıtım bloğu */
.services-intro{ align-items:center; margin-bottom:32px; }
.services-intro__left h2{ margin:8px 0 10px; }
.services-intro__media img{
  width:100%; height:auto; border-radius:16px; box-shadow:var(--shadow);
}

/* Kartlar */
.service-cards{ gap:28px; }
.service-card{
  background:#fff; border-radius:16px; box-shadow:var(--shadow); padding:0 0 18px;
  transition:transform .2s ease, box-shadow .2s ease;
}
.service-card:hover{ transform:translateY(-4px); box-shadow:0 14px 32px rgba(0,0,0,.16); }

/* Kart görseli ve ikon rozet */
.service-card__media{ position:relative; padding:16px 16px 0; }
.service-card__media img{
  width:100%; height:220px; object-fit:cover; border-radius:12px;
}
/*
.service-card__icon{
  position:absolute; left:32px; bottom:-22px;
  width:56px; height:56px; border-radius:50%;
  display:grid; place-items:center; font-size:24px;
  background:#ffe9e9; border:2px solid rgba(0,0,0,.04); box-shadow:var(--shadow);
}
*/
/* Başlık/metin/link */
.service-card h3{ margin:32px 16px 6px; }
.service-card p{ margin:0 16px 10px; color:#454545; }
.link-more{
  display:inline-flex; align-items:center; gap:8px;
  color:var(--red); text-decoration:none; font-weight:700; margin:0 16px;
}
.link-more span{ display:inline-block; transform:translateX(0); transition:transform .15s; }
.link-more:hover span{ transform:translateX(2px); }

/* Responsive */
@media (max-width:1024px){
  .service-card__media img{ height:200px; }
}
@media (max-width:768px){
  .services-intro{ grid-template-columns:1fr; }
  .service-card__media img{ height:180px; }
}

/* Fixed Action Buttons */
.fab{
  position:fixed; right:20px; bottom:20px; display:flex; flex-direction:column; gap:16px; z-index:50;
  margin-top: 16px;     
}
.fab__btn{
  width:60px; height:60px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:28px; color:#fff;
  box-shadow:0 8px 20px rgba(0,0,0,.25);
  transition:transform .2s ease, box-shadow .2s ease;
  text-decoration:none;
}
.fab__btn:hover{
  transform:translateY(-3px);
  box-shadow:0 12px 28px rgba(0,0,0,.3);
}
.fab__phone{ background:#ff3b30; }    /* Telefon kırmızı */
.fab__wa   { background:#25D366; }    /* WhatsApp yeşili */

@media (min-width: 1025px){
  .fab__btn{ width:52px; height:52px; font-size:20px; }
}
