/* =========================
   Erişilebilirlik: Skip Link (genel)
========================= */
.skip-link{
  position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden;
}
.skip-link:focus{
  position:fixed; left:16px; top:16px; width:auto; height:auto;
  background:#111; color:#fff; padding:10px 14px; border-radius:8px; z-index:1000; text-decoration:none;
}

/* =========================
   Reset & Değişkenler (genel)
========================= */
:root{
  --font-body: 'EB Garamond', serif;
  --font-head: 'EB Garamond', serif;
  --font-ui: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;

  --fs-p: 1.1rem;
  --fs-h: 1.15rem;
  --lh-body: 1.7;
  --lh-head: 1.35;

  --text: #111;

  --container-max: 920px;
  --container-pad: 24px;

  --menu-gap: 32px;
  --sticky-h: 72px;

  /* Masaüstü menü konum ayarı */
  --menu-shift-x: 0px;
  --menu-shift-y: 0px;
}

*{margin:0; padding:0; box-sizing:border-box}
html,body{height:100%}
html{overflow-y:scroll; scrollbar-gutter:stable}
body{
  min-height:100vh; display:flex; flex-direction:column;
  background:#fafafa; color:var(--text);
  font-family:var(--font-body); font-size:var(--fs-p); line-height:var(--lh-body);
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
}
main{flex:1}

img{width:100%; height:auto; display:block; border-radius:8px; border:1px solid #e7e7e7}
a{color:inherit; text-decoration:underline; text-underline-offset:3px; transition:color .2s}
a:hover{color:#000}
a:focus-visible{outline:3px solid #111; outline-offset:3px; text-decoration:none}
h1,h2,h3{
  font-family:var(--font-head); font-size:var(--fs-h); line-height:var(--lh-head);
  color:var(--text); font-weight:500; margin:.9em 0 .6em;
}
p{font-family:var(--font-body); font-size:var(--fs-p); line-height:var(--lh-body); color:var(--text); max-width:70ch}
body, p, a, .cta, .faq-question{overflow-wrap:anywhere; word-break:break-word}

/* =========================
   Header (genel)
========================= */
.site-header{background:#fff; border-bottom:1px solid #e0e0e0; position:sticky; top:0; z-index:1000}
.site-header .header-inner{display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 16px; min-height:56px; position:relative}
.mobile-only{display:flex}
.desktop-only{display:none}

.menu-toggle{display:inline-flex; flex-direction:column; align-items:center; justify-content:center; width:40px; height:40px; border:0; background:transparent; cursor:pointer; line-height:0}
.menu-toggle .bar{width:20px; height:2px; background:#000; border-radius:1px}
.menu-toggle .bar + .bar{margin-top:4px}
.menu-toggle[aria-expanded="true"] .bar:nth-child(1){transform:translateY(6px) rotate(45deg)}
.menu-toggle[aria-expanded="true"] .bar:nth-child(2){opacity:0}
.menu-toggle[aria-expanded="true"] .bar:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

.mobile-cta{display:flex; align-items:center; gap:8px}
.mobile-cta .cta-icon{
  display:inline-grid; grid-auto-flow:column; align-items:center; gap:8px;
  height:36px; padding:6px 12px; border-radius:999px; text-decoration:none; border:1px solid #e8e8e8; background:#fff;
  max-width:70vw; overflow:hidden;
}
.mobile-cta .cta-icon svg{width:18px; height:18px; display:block}
.mobile-cta .cta-icon .label{white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.cta-whatsapp svg path{fill:#25D366}

/* Mobil menü aç/kapa (genel) */
.nav-container{display:none}
.js .nav-container{
  position:absolute; left:0; right:0; top:56px; background:#fff;
  border-top:1px solid #e0e0e0; border-bottom:1px solid #e0e0e0; box-shadow:0 6px 16px rgba(0,0,0,.06);
  padding:12px 16px; display:none; flex-direction:column; gap:10px;
}
.js .nav-container.open{display:flex}
.js .nav-container[aria-hidden="true"]{display:none}
.site-header .nav-container a{
  color:rgb(0 0 0/.9); font-family:var(--font-ui); font-size:.95rem; letter-spacing:.2px;
  text-decoration:none; padding:12px 0; line-height:1.3; border-bottom:1px solid #f1f1f1;
}
.site-header .nav-container a:last-child{border-bottom:none}

/* Menü açıkken gövde kaymasın (genel) */
body.menu-open{overflow:hidden; position:fixed; width:100%}

/* Masaüstü header yerleşimi (genel, ≥992px) */
@media (min-width:992px){
  .mobile-only{display:none!important}
  .menu-toggle{display:none!important}
  .desktop-only{display:flex!important}

  .site-header .header-inner{
    display:grid !important;
    grid-template-columns:minmax(240px,1fr) auto minmax(240px,1fr);
    align-items:center; gap:12px; padding:14px 20px; min-height:66px;
  }
  .site-header .nav-left{justify-self:start}
  .site-header .nav-center{justify-self:center}
  .site-header .nav-right{justify-self:end}

  .site-header .nav-container,
  .site-header .nav-container[aria-hidden],
  .js .site-header .nav-container[aria-hidden="true"]{
    position:absolute !important;
    left: calc(50% + var(--menu-shift-x)) !important;
    top:  calc(50% + var(--menu-shift-y)) !important;
    transform: translate(-50%,-50%) !important;
    display:flex !important; flex-direction:row !important; align-items:center; gap:var(--menu-gap);
    padding:0 !important; background:transparent !important; border:0 !important; box-shadow:none !important; z-index:2;
  }
  .site-header .nav-container a{
    display:inline-flex; align-items:center; height:38px; padding:0; color:rgb(0 0 0/.9);
    font-family:var(--font-ui); font-size:.9rem; letter-spacing:.3px; text-decoration:none;
    border-bottom:1px solid transparent; transition:color .2s, border-color .2s;
  }
  .site-header .nav-container a:hover,
  .site-header .nav-container a[aria-current="page"]{color:#000; border-bottom-color:#000}
}

/* Header ikon boyutları (genel) */
.site-header svg, .site-header .icon{width:20px !important; height:20px !important; display:inline-block; flex:0 0 auto; vertical-align:middle}
.call-inline .icon, .whatsapp-inline .icon{width:18px !important; height:18px !important}
.mobile-cta .cta-icon svg{width:16px !important; height:16px !important}
svg{max-width:none}

/* =========================
   Footer (genel)
========================= */
footer{
  background:#f1f1f1; color:#444; border-top:1px solid #e5e5e5;
  padding:18px 20px; font-size:.7rem; display:flex; justify-content:center; align-items:center; text-align:center;
}
footer p{margin:0}

/* =========================
   Sticky CTA (genel, mobilde görünür)
========================= */
.sticky-cta{
  position:fixed; left:0; right:0; bottom:0; z-index:9999;
  display:flex; justify-content:space-around; gap:8px;
  padding:.5rem .6rem; border-top:1px solid rgba(0,0,0,.08);
  background:rgba(255,255,255,.9);
  backdrop-filter:saturate(160%) blur(8px); -webkit-backdrop-filter:saturate(160%) blur(8px);
  box-shadow:0 -8px 24px rgba(0,0,0,.12);
}
.sticky-cta a{
  display:inline-flex; align-items:center; justify-content:center; min-height:36px; padding:.52rem .9rem;
  border-radius:.8rem; border:1px solid #e8e8e8; background:#fff; text-decoration:none;
  font-family:var(--font-ui); font-weight:540; letter-spacing:.2px; box-shadow:0 1px 6px rgba(0,0,0,.04);
}
.sticky-cta .cta-whatsapp{border-color:#e3f6eb; background:#f7fffb}
.sticky-cta .cta-whatsapp:hover{background:#f1fff7}
@media (min-width:992px){.sticky-cta{display:none}}

/* =========================
   Menü & İletişim küçük düzeltmeler (genel)
========================= */
.site-header .nav-container a[aria-current="page"]{ color:#000; border-bottom-color:#000; }
@media (hover:hover){
  .site-header .nav-container a:hover{ color:#000; border-bottom-color:#000; }
}
.site-header .menu-toggle{ background:transparent !important; border:0 !important; box-shadow:none !important; }

/* =========================
   MOBİL HEADER: hamburger SOL, telefon+WhatsApp SAĞ (genel)
========================= */
@media (max-width: 991.98px){
  .site-header .header-inner{ justify-content: space-between !important; }
  .site-header .nav-center{
    display:flex !important; align-items:center !important; gap:8px !important;
    width:100% !important; min-width:0 !important; margin:0 !important;
  }
  #menu-toggle{ order:0; margin-right:auto !important; }
  .site-header .nav-center .mobile-cta{
    order:1; margin-left:auto !important; display:flex !important; gap:6px !important; white-space:nowrap;
  }
  .mobile-cta .cta-icon{ height:34px; padding:6px 10px; max-width:52vw; }
}
@media (max-width: 330px){ .mobile-cta .cta-icon .label{ display:none; } }

/* ******************************************************************
   ******************************************************************
   **************     ANASAYFA (HOME) — TÜM KURALLAR     ************
   **************      Masaüstü/Genel ve Mobil Sonda     ************
   ******************************************************************
   ****************************************************************** */

/* =========================
   HOME — Masaüstü/Genel
========================= */
body.home-page main{
  max-width:var(--container-max);
  margin:0 auto;
  padding:75px var(--container-pad) 20px;
  display:flex; flex-direction:column;
}

/* HERO */
.home-page .hero{
  display:grid; grid-template-columns:minmax(0,1fr) 360px;
  gap:92px; align-items:center; margin-bottom: clamp(36px, 6vw, 72px);
}
.home-page .hero > *{min-width:0}
.home-page .hero h1{
  font-size: clamp(1.7rem, 1.1rem + 3.2vw, 2.6rem);
  line-height:1.15; margin:0 0 .35em;
}
.home-page .hero p{font-size:clamp(1.02rem,.95rem + .4vw,1.18rem); opacity:.92; margin:0}
.home-page .cta-btns{display:flex; flex-wrap:wrap; gap:10px 12px; margin:14px 0 10px}
.home-page .cta-btns .cta{
  display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:10px 16px; border-radius:14px;
  border:1px solid #e7e7e7; background:#fff; text-decoration:none; font-family:var(--font-ui); font-weight:550; letter-spacing:.2px; line-height:1;
  box-shadow:0 2px 8px rgba(0,0,0,.03); transition:transform .06s, background .2s, border-color .2s, box-shadow .2s, color .2s;
}
.home-page .cta-btns .cta:hover{background:#f9f9f9; border-color:#e2e2e2; box-shadow:0 4px 14px rgba(0,0,0,.06)}
.home-page .cta-btns .cta:active{transform:translateY(1px)}
.home-page .cta-btns .cta.primary{background:#111; color:#fff; border-color:#111}
.home-page .cta-btns .cta.primary:hover{background:#000; border-color:#000}
.home-page .hero .hero-inline{margin-top:clamp(12px,1.4vw,20px); color:rgb(0 0 0/.66); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.home-page .hero .chip{background:transparent; border:0; padding:0}
.home-page .hero .chip + .chip::before{content:"•"; margin:0 .6rem; color:rgb(0 0 0/.38)}

/* HERO ⇄ IDENTITY: kısa, ortalı çizgi */
.section-divider{
  width:140px; max-width:30%;
  height:1px; border:0; background:rgba(0,0,0,.12);
  margin: clamp(28px, 6vw, 64px) auto clamp(22px, 5vw, 44px);
}

/* =========================
   IDENTITY — boşluk ve UX
   (okunabilirlik, satır genişliği, dengeli kırımlar)
========================= */
.home-page .identity{
  border-top:0 !important;
  padding-top:0;
  margin-top: clamp(32px, 6.5vw, 72px);
  margin-bottom: clamp(16px, 4vw, 40px);
  max-width:720px;
  margin-inline:auto;
  text-align:center;
  padding-inline:8px;
}

.home-page .identity p{
  /* UX iyileştirmeleri */
  margin: 0 0 .95em;                 /* paragraf aralığı artırıldı */
  line-height: 1.78;                 /* rahat okuma */
  font-size: clamp(1.04rem, 1rem + .2vw, 1.16rem);
  letter-spacing: .1px;
  color: rgb(0 0 0 / .92);
  max-width: 62ch;                   /* satır uzunluğu sınırı */
  margin-left:auto; margin-right:auto;
  text-wrap: pretty;                 /* destekleyen tarayıcıda daha iyi kırılım */
}
.home-page .identity p strong{
  display:block;
  margin-bottom:.5em;
  font-weight:600;
  letter-spacing:.2px;
  /* başlık hissi için minik vurgusu */
  font-size: clamp(1.06rem, 1.01rem + .25vw, 1.2rem);
}
.home-page .identity p + p{          /* ardışık paragraflar arasında minik fark */
  margin-top:.25em;
}

/* Telefon “pill”i: erişilebilir ve etkileşimli */
.home-page .identity .phone{ margin-top:.6rem; }
.home-page .identity .phone a{
  display:inline-flex; align-items:center; justify-content:center;
  min-height:44px; padding:10px 16px;
  border-radius:999px; text-decoration:none;
  border:1px solid #e8e8e8; background:#fff;
  box-shadow:0 2px 10px rgba(0,0,0,.04);
  transition: box-shadow .2s, transform .06s, border-color .2s, background .2s, color .2s;
  will-change: transform, box-shadow;
}
.home-page .identity .phone a:hover{
  background:#fafafa; border-color:#e2e2e2; box-shadow:0 4px 16px rgba(0,0,0,.08);
}
.home-page .identity .phone a:active{ transform: translateY(1px); }
.home-page .identity .phone a:focus-visible{ outline:3px solid #111; outline-offset:3px; }

/* =========================
   İLETİŞİM ŞERİDİ (kart)
========================= */
.home-page .contact-strip{
  display:grid; grid-template-columns:1.2fr auto; align-items:center; gap:16px;
  padding:14px 16px; margin-top:18px; border:1px solid #eee; border-radius:12px; background:#fff; box-shadow:0 6px 16px rgba(0,0,0,.04)
}
.home-page .contact-strip .maplink{text-decoration:none; border-bottom:1px solid rgba(0,0,0,.25); padding-bottom:1px}
.home-page .contact-strip .maplink:hover{border-bottom-color:#000}
.home-page .contact-strip .buttons{display:flex; flex-wrap:wrap; gap:8px 10px; justify-content:flex-end; min-width:0}
.home-page .contact-strip .buttons .cta{
  display:inline-flex; align-items:center; justify-content:center; min-height:40px; padding:8px 14px; border-radius:12px;
  border:1px solid #e7e7e7; background:#fff; text-decoration:none; font-family:var(--font-ui); font-weight:540; letter-spacing:.2px; box-shadow:0 2px 8px rgba(0,0,0,.03)
}
.home-page .contact-strip .buttons .cta.primary{background:#111; color:#fff; border-color:#111}

/* SSS (uzun üst çizgi yok) */
.home-page .faq{
  max-width:720px; padding:0; margin:clamp(36px, 6vw, 72px) auto 0 !important;
  border-top:0 !important;
}
.home-page .faq h2{text-align:center; margin:.9rem 0 .6rem}
.home-page .faq-item{margin:.55rem 0; border:1px solid #ececec; border-radius:10px; background:#fff; box-shadow:0 2px 10px rgba(0,0,0,.02); overflow:hidden}
.home-page .faq-question{
  width:100%; text-align:left; font:inherit; font-size:1rem; line-height:1.45; padding:.85rem 1rem;
  background:none; border:0; cursor:pointer; position:relative; -webkit-tap-highlight-color:transparent; color:var(--text)
}
.home-page .faq-item:not(.open) .faq-question{box-shadow:inset 0 -1px 0 #f0f0f0}
.home-page .faq-question::after{content:"+"; font-weight:600; opacity:.75; position:absolute; right:.85rem; top:50%; transform:translateY(-50%)}
.home-page .faq-item.open .faq-question::after,
.home-page .faq-question[aria-expanded="true"]::after{content:"–"; opacity:.95}
.home-page .faq-question:focus-visible{outline:2px solid #005fcc; outline-offset:2px; border-radius:6px}
.home-page .faq-answer{padding:0; max-height:0; opacity:0; overflow:hidden; transition:max-height .25s ease, opacity .2s ease, padding .2s ease}
.home-page .faq-item.open .faq-answer,
.home-page .faq-question[aria-expanded="true"] + .faq-answer{padding:.6rem 1rem .9rem; max-height:1000px; opacity:1}
.home-page .faq-more{display:flex; align-items:center; justify-content:center; gap:.9rem; margin:14px 0 4px; padding-inline:8px}
.home-page .faq-more .cta{
  font-family:'EB Garamond', serif; font-style:italic; letter-spacing:.2px; opacity:.92;
  padding:.62rem 1.05rem; border:1px solid #e2e2e2; border-radius:999px; background:#fff; text-decoration:none;
  box-shadow:0 1px 6px rgba(0,0,0,.03); transition:border-color .2s, box-shadow .2s, transform .08s
}
.home-page .faq-more .cta:hover{border-color:#dcdcdc; box-shadow:0 2px 10px rgba(0,0,0,.04)}

/* =========================
   HOME — Mobil uyarlamalar
========================= */
@media (max-width:991.98px){
  .home-page .hero{
    display:flex !important; flex-direction:column !important; align-items:center !important; text-align:center !important;
    gap:clamp(28px,7vw,52px) !important; margin-bottom:clamp(24px,6vw,40px) !important;
  }
  .home-page .hero .hero-inline{white-space:normal}
}

@media (max-width:768px){
  .home-page main.page-wrap{width:100%; max-width:var(--container-max); margin-inline:auto; padding-inline:14px}
  .home-page .hero,
  .home-page .identity,
  .home-page .contact-strip,
  .home-page .faq{
    padding-inline:0 !important; margin-inline:auto !important; width:100%; max-width:720px; box-sizing:border-box; text-align:center;
  }
  .home-page .cta-btns{justify-content:center}
  .home-page .contact-strip{grid-template-columns:1fr; text-align:center; justify-items:center; gap:12px; padding:12px}
  .home-page .contact-strip .buttons{justify-content:center}
  .home-page .contact-strip .buttons .cta{min-height:34px; padding:6px 10px; font-size:.93rem; border-radius:10px}
  .home-page .identity{ margin-top: clamp(28px, 8vw, 64px); }
  body.home-page main{padding-bottom:calc(var(--sticky-h) + env(safe-area-inset-bottom))} /* sticky-cta boşluğu */
}