/* Genel */
.service .breadcrumbs{margin-top:14px;margin-bottom:6px;color:var(--muted)}
.service .breadcrumbs a{color:var(--brand)}


/* Üst hero */
.service-hero{
  position:relative;
  background:#0f172a;
  border:1px solid rgba(255,255,255,.06);
  border-radius:18px;
  padding:24px;
  margin-top:14px;
  overflow:hidden;
}
.service-hero .sh-bg{
  position:absolute; inset:-20% -10% -30% -10%;
  background:
    radial-gradient(40% 30% at 20% 10%, rgba(90,162,255,.18), transparent 60%),
    radial-gradient(30% 25% at 80% 15%, rgba(19,185,129,.16), transparent 60%);
  filter:blur(60px);
}
.service-hero h1{position:relative;margin:0 0 6px}
.service-hero .lead{position:relative;color:#b6c3db;margin:0 0 10px}
.service-hero .badges{position:relative;display:flex;gap:8px;flex-wrap:wrap;margin:8px 0 10px}
.service-hero .ctaRow{position:relative;display:flex;gap:10px;flex-wrap:wrap}

/* İçerik 2 sütun */
.grid-2{display:grid;grid-template-columns:2fr 1fr;gap:18px}
@media(max-width:1000px){.grid-2{grid-template-columns:1fr}}

/* Tick list */
.tick{list-style:none;padding:0;margin:0 0 16px}
.tick li{position:relative;padding-left:24px;margin:8px 0}
.tick li::before{content:"✔";position:absolute;left:0;top:0;color:#58d68d}

/* Kıyas tablosu */
.compare{
  display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;padding:16px;border-radius:16px;
  background:#0f172a;border:1px solid rgba(255,255,255,.06);margin-bottom:18px
}
.compare > div:nth-child(-n+3){color:#cfe1ff}
@media(max-width:700px){.compare{grid-template-columns:1fr 1fr;}}
/* Son satırlar mobilde akacak */

/* Sidebar */
.sidebar .card{margin-bottom:14px}
.card.sticky{position:sticky;top:84px}

/* FAQ */
.faq details{background:#0f172a;border:1px solid rgba(255,255,255,.06);border-radius:12px;padding:10px 12px;margin:10px 0}
.faq summary{cursor:pointer;font-weight:600;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq p{margin:8px 0 0;color:#cdd6e6}

/* CTA kart */
.cta.card{display:flex;flex-direction:column;gap:8px;align-items:flex-start}

/* Reveal (mevcut anim’larla uyumlu) */
.reveal{opacity:0;transform:translateY(16px)}
.reveal-in{opacity:1;transform:none;transition:transform .7s cubic-bezier(.2,.7,.2,1),opacity .7s}


/* İletişim listesi */
.contact {
  list-style: none;      /* Noktaları kaldırır */
  padding: 0;            /* Soldaki boşluğu sıfırlar */
  margin: 0;             /* Yukarı-aşağı fazlalıkları kaldırır */
}

.contact li {
  margin: 6px 0;         /* Satırlar arası boşluk */
  font-weight: 500;      /* "Numara, Mail, WhatsApp" belirgin dursun */
}

.contact li a {
  color: var(--brand);   /* Link rengi tema rengiyle aynı */
  text-decoration: none; /* Alt çizgiyi kaldırır */
}

/* Sidebar link listeleri */
.links {
  list-style: none;   /* Noktaları kaldırır */
  padding: 0;         /* Sol boşluğu sıfırlar */
  margin: 0;
}

.links li {
  margin: 6px 0;      /* Satır arası boşluk */
}

.links a {
  color: var(--brand);
  text-decoration: none;
  font-weight: 500;   /* Daha belirgin linkler */
}

.links a:hover {
  text-decoration: underline; /* Hover’da alt çizgi */
}

/* Buton hover parıltı efekti */
.btn {
  position: relative;
  overflow: hidden;
  transition: background 0.3s, box-shadow 0.3s;
}

.btn:hover {
  box-shadow: 0 0 18px rgba(78,162,255,0.6); /* Mavi parıltı */
}

.btn.secondary:hover {
  box-shadow: 0 0 18px rgba(19,185,129,0.6); /* Yeşilimsi parıltı */
}

/* FAQ (temizlenmiş, neon çizgi yok) */
.faq details {
  background:#0f172a;
  border:1px solid rgba(255,255,255,.06);
  border-radius:12px;
  padding:10px 12px;
  margin:10px 0;
  transition: all 0.3s ease;
  overflow: hidden;
}

.faq details[open] {
  border-color: rgba(78,162,255,0.3);
  box-shadow: 0 0 12px rgba(78,162,255,0.15);
  transition: all 0.35s ease;
  animation: faqOpen 0.35s ease;
}

@keyframes faqOpen {
  from {opacity:0; transform: translateY(-6px);}
  to   {opacity:1; transform: translateY(0);}
}

.faq summary {
  cursor:pointer;
  font-weight:600;
  list-style:none;
  position:relative;
}

.faq summary::-webkit-details-marker {display:none;}

.faq p {
  margin:8px 0 0;
  color:#cdd6e6;
  line-height:1.5;
  transition: opacity 0.3s ease;
}

/* ==== MOBILE NAV: logo solda, hamburger en sağda (KANONİK) ==== */
@media (max-width:900px){
  /* Container hizalaması: logo sola, buton sağa */
  .nav .container{
    display:flex;
    align-items:center;
    justify-content:space-between;   /* 🔑 buton sağa */
    gap:10px;
    padding:10px 12px;               /* mevcut tasarınla uyumlu */
  }

  /* Nav panel mobilde akıştan çıkar; açılınca fixed panel */
  #primary-nav{
    display:none !important;         /* kapalı başlangıç */
    position:fixed;
    inset:calc(env(safe-area-inset-top) + 56px) 12px auto 12px;
    flex-direction:column; gap:10px; padding:14px;
    background:#0f172a; border:1px solid rgba(255,255,255,.1); border-radius:14px;
    box-shadow:0 20px 60px rgba(0,0,0,.4);
    transform:translateY(-10px); opacity:0; pointer-events:none; transition:.2s;
    z-index:1050;
  }
  body.nav-open #primary-nav{
    display:flex !important;
    transform:none; opacity:1; pointer-events:auto;
  }

  /* Hamburger: görünür ve sağda */
  .menu-toggle{
    display:inline-block;
    margin-left:auto;                /* güvenlik payı; sağa iter */
    position:relative; width:44px; height:36px;
    border:1px solid rgba(255,255,255,.18);
    background:rgba(17,25,40,.6); color:#fff; border-radius:10px; cursor:pointer;
  }
  .menu-toggle span{
    position:absolute; left:9px; right:9px; height:2px;
    background:#d6e3ff; border-radius:2px; transition:.25s;
  }
  .menu-toggle span:nth-child(1){ top:11px }
  .menu-toggle span:nth-child(2){ top:17px }
  .menu-toggle span:nth-child(3){ top:23px }
  .menu-toggle[aria-expanded="true"] span:nth-child(1){ transform:translateY(6px) rotate(45deg) }
  .menu-toggle[aria-expanded="true"] span:nth-child(2){ opacity:0 }
  .menu-toggle[aria-expanded="true"] span:nth-child(3){ transform:translateY(-6px) rotate(-45deg) }

  /* Logo responsive detayları (isteğe bağlı) */
  .logo{ gap:8px; flex:0 0 auto; }
  .logo-img{ height:30px; width:auto; object-fit:contain; filter:brightness(1.05) contrast(1.02); }
  .logo span{ font-size:clamp(13px,3.6vw,16px); }
}
@media (max-width:360px){
  .logo span{ display:none; }
  .menu-toggle{ width:40px; }
}

/* ===== DESKTOP NAV (>900px) — logo solda, menü sağda ===== */
@media (min-width: 901px){
  .nav .container{
    display:flex;
    align-items:center;
    justify-content:space-between;  /* logo ←  nav → */
    gap:16px;
  }

  /* Menü satır içi */
  #primary-nav{
    display:flex;                   /* desktop'ta görünür */
    align-items:center;
    gap:18px;
    margin-left:auto;               /* sağa yapıştır */
  }

  /* Hamburger masaüstünde tamamen saklı */
  .menu-toggle{ display:none !important; }
}

/* HEADER LOGO sabitleme */
.nav .logo{
  display:flex; align-items:center; gap:10px;
  white-space:nowrap; color:#fff; text-decoration:none; font-weight:800;
}

/* Spesifikiyet yüksek: header içindeki img'yi kilitle */
header.nav .logo-img,
.nav .logo .logo-img{
  height:36px;                      /* masaüstü boyu */
  width:auto;
  object-fit:contain;
  display:block;
}

@media (max-width:900px){
  header.nav .logo-img,
  .nav .logo .logo-img{ height:30px; }
}
@media (max-width:600px){
  header.nav .logo-img,
  .nav .logo .logo-img{ height:28px; }
}