/* ══════════════════════════════════════════════════════════════
   ÜST BİLGİ (HEADER) — KOYU · mockup B seçeneği
   1 Ağustos 2026
   Bu bloğu silmek başlığı Kadence'in bugünkü hâline döndürür.
   Palet: #16211C mürekkep · #1F5C4A / #2E9E6B yeşil · #C9A227 altın
   ══════════════════════════════════════════════════════════════ */

/* --- 1. zemin (normal + yapışkan durum aynı) ------------------ */
#main-header .site-header-row-container-inner,
#mobile-header .site-header-row-container-inner{
  background:#16211C;
  border-bottom:1px solid rgba(255,255,255,.08);
}
#main-header .kadence-sticky-header.item-is-fixed,
#mobile-header .kadence-sticky-header.item-is-fixed{
  box-shadow:0 6px 20px rgba(0,0,0,.28);
}
/* Kadence yapışkan durumda zemini beyaza çeviriyor. Kendi kuralı
   (1,5,0) özgüllüğünde olduğu için aşağıdaki satır aynı seçicinin
   birebir kopyası — eşit özgüllük + sonra gelme = bu kazanır.
   !important gerekmiyor. */
#masthead .kadence-sticky-header.item-is-fixed:not(.item-at-start) > .site-header-row-container-inner{
  background:#16211C;
}

/* --- 2. logo -------------------------------------------------- */
/* CSS bir <img src> değiştiremez. Açık logo ana bağlantıya zemin
   görseli olarak basılır, koyu <img> saydamlaştırılır. Böylece
   Özelleştirici'deki logo ayarı — ve onu okuyan JSON-LD kurumsal
   logosu — hiç değişmez; bu blok silinince ikisi de eski hâline döner. */
#main-header a.brand,
#mobile-header a.brand{
  background-image:url("/wp-content/uploads/2026/08/Uzman-Projeler-Logo-light2-768x272.png");
  background-repeat:no-repeat;
  background-position:left center;
  background-size:contain;
}
#main-header a.brand img.custom-logo,
#mobile-header a.brand img.custom-logo{opacity:0}

/* --- 3. gezinme ----------------------------------------------- */
#site-navigation .menu > li > a{
  position:relative;
  color:#C8D3CC;
  border-radius:3px;
  padding:9px 12px;
}
#site-navigation .menu > li > a:hover,
#site-navigation .menu > li > a:focus{
  color:#FFFFFF;
  background:rgba(255,255,255,.06);
}
#site-navigation .menu > li.current-menu-item > a,
#site-navigation .menu > li.current-menu-ancestor > a{color:#FFFFFF}

/* açık sayfanın altın çizgisi */
#site-navigation .menu > li.current-menu-item > a .uzp-bs,
#site-navigation .menu > li.current-menu-ancestor > a .uzp-bs{display:none}
#site-navigation .menu > li.current-menu-item > a::after,
#site-navigation .menu > li.current-menu-ancestor > a::after{
  content:"";
  position:absolute;
  left:12px; right:12px; bottom:2px;
  height:2px;
  background:#C9A227;
  border-radius:1px;
}

/* alt menüler (varsa) */
#site-navigation .header-menu-container ul ul.sub-menu{
  background:#1B2822;
  border:1px solid rgba(255,255,255,.10);
}
#site-navigation .header-menu-container ul ul li.menu-item > a{color:#C8D3CC}
#site-navigation .header-menu-container ul ul li.menu-item > a:hover{
  color:#FFFFFF;
  background:rgba(255,255,255,.06);
}

/* --- 4. arama kutusu ------------------------------------------ */
#main-header .header-search-bar,
#main-header .header-search-bar .search-form{width:246px}
#main-header .search-form .search-field{
  width:100%;
  height:42px;
  background:#1B2822;
  border:1px solid rgba(255,255,255,.11);
  border-radius:3px;
  color:#FFFFFF;
  font-size:14px;
  padding-left:13px;
  padding-right:44px;
}
#main-header .search-form .search-field::placeholder{color:#8A968E;opacity:1}
#main-header .search-form .search-field:focus{
  background:#1B2822;
  border-color:#2E9E6B;
  box-shadow:0 0 0 3px rgba(46,158,107,.22);
}
#main-header .kadence-search-icon-wrap{color:#8A968E}

/* --- 5. İletişim düğmesi -------------------------------------- */
#main-header a.header-button,
#mobile-header a.header-button{
  background:#2E9E6B;
  color:#16211C;
  border-radius:3px;
  font-size:15px;
  font-weight:600;
  padding:10px 20px;
}
#main-header a.header-button:hover,
#main-header a.header-button:focus,
#mobile-header a.header-button:hover{
  background:#3BB47C;
  color:#16211C;
}

/* --- 6. mobil başlık düğmesi ---------------------------------- */
#mobile-header .menu-toggle-open,
#mobile-header .menu-toggle-open:hover{color:#FFFFFF}

/* --- 7. mobil çekmece ----------------------------------------- */
#mobile-site-navigation .menu > li > a{
  font-size:15px;
  font-weight:500;
  color:#C8D3CC;
}
#mobile-site-navigation .menu > li > a:hover{color:#FFFFFF}
#mobile-site-navigation .menu > li.current-menu-item > a,
#mobile-site-navigation .menu > li.current-menu-ancestor > a{
  color:#FFFFFF;
  box-shadow:inset 3px 0 0 #C9A227;
}

/* --- 7b. çekmecedeki arama kutusu ve düğme --------------------- */
/* Çekmece Kadence'te ayrı sınıflar kullanıyor: arama kutusu varsayılan
   beyaz kalıyordu, düğme .mobile-header-button (0px köşe) idi. */
#mobile-drawer .search-form .search-field{
  background:#1B2822;
  border:1px solid rgba(255,255,255,.11);
  border-radius:3px;
  color:#FFFFFF;
  font-size:14px;
}
#mobile-drawer .search-form .search-field::placeholder{color:#8A968E;opacity:1}
#mobile-drawer .search-form .search-field:focus{
  background:#1B2822;
  border-color:#2E9E6B;
  box-shadow:0 0 0 3px rgba(46,158,107,.22);
}
#mobile-drawer .kadence-search-icon-wrap{color:#8A968E}
#mobile-drawer a.mobile-header-button{
  background:#2E9E6B;
  color:#16211C;
  border-radius:3px;
  font-size:15px;
  font-weight:600;
  padding:11px 20px;
}
#mobile-drawer a.mobile-header-button:hover{background:#3BB47C;color:#16211C}

/* --- 8. klavye odağı ------------------------------------------ */
/* Kadence fareyle gezerken body'ye .hide-focus-outline ekler ve ilk
   Tab'da kaldırır; yani halka yalnızca klavye kullanıcısına görünür.
   Tarayıcının varsayılan halkası ince ve neredeyse siyah (#17191D) —
   koyu başlık üzerinde 1.02:1, görünmez. Bunun yerine yeşil halka. */
#masthead a:focus-visible,
#masthead button:focus-visible,
#masthead input:focus-visible,
#mobile-drawer a:focus-visible,
#mobile-drawer button:focus-visible,
#mobile-drawer input:focus-visible{
  outline:2px solid #2E9E6B;
  outline-offset:2px;
  border-radius:2px;
}

/* --- 9. yapışkan başlık ile sayfa içi yapışkan çubukların çakışması --- */
/* 1 Ağustos 2026. Başlık yapışkan yapılınca danışman, ekibimiz ve proje
   sayfalarındaki kendi yapışkan çubukları başlığın tam üstüne bindi.
   İki ayrı sebep vardı:

   (a) Hepsi top:0 (ya da 20px) ile yapışıyordu — yani başlığın oturduğu yere.
   (b) #masthead'de z-index:11 var. Bu bir YIĞIN BAĞLAMI yaratıyor; başlığın
       kendi z-index:1200'ü o bağlamın içinde kaldığı için dışarıdan 11 gibi
       davranıyor ve çubukların z-index:40'ı başlığı örtüyordu.

   Ayrıca Kadence'in "yukarı kaydırınca göster" (header_reveal_scroll_up)
   ayarı açıktı; başlık aşağı kaydırırken tamamen gizleniyordu. Sabit bir
   boşluk bırakmak o modda boşluk açtığı için bu ayar kapatıldı —
   başlık artık yapışkanken hep görünür. */

:root{ --uzp-ust:61px }                 /* yapışkan başlık: 60px + 1px çizgi */
body.admin-bar{ --uzp-ust:93px }        /* + yönetici çubuğu (32px) */
@media screen and (max-width:782px){
  body.admin-bar{ --uzp-ust:107px }     /* mobilde yönetici çubuğu 46px */
}

#masthead{ z-index:120 }                /* çubukların (40) ve alt barların (70/80)
                                           üstünde; lightbox (9999) ve mobil
                                           çekmecenin (99999) altında kalır */

html body.uzp-dt .uzp-dt-nav,
html body.admin-bar.uzp-dt .uzp-dt-nav,
html body.uzp-et .uzp-et-filter,
html body.admin-bar.uzp-et .uzp-et-filter,
html body .uzp-snav,
html body .uzp-kars__t thead th{ top:var(--uzp-ust) }

html body .uzp-filtre{ top:calc(var(--uzp-ust) + 20px) }
html body .uzp-detay__side > .uzp-advisor:only-child{ top:calc(var(--uzp-ust) + 24px) }

/* --- 10. mobil ve tablet çekmecesi ---------------------------- */
/* Panel Kadence'te max-width:90% ile geliyordu; 1024px'lik bir tablette
   ~920px, yani neredeyse tam ekran oluyordu. Sabit tavan konuldu.
   Zemin de yeşil degradeydi (#172F24 → #1A4133) — başlık ve altbilgi
   #16211C olduğu için artık onlarla aynı. */
#mobile-drawer .drawer-inner{
  width:min(88vw,380px);
  max-width:none;
  margin-left:auto;
  background:#16211C;
  background-image:radial-gradient(circle at 88% 6%,rgba(46,158,107,.12),transparent 55%);
  border-left:1px solid rgba(255,255,255,.08);
  display:flex;
  flex-direction:column;
}

/* Kadence içerik alanına kendi 25.5px yan boşluğunu veriyor; bizim 20px'lik
   iç boşluklarımızla toplanıp ~45px oluyordu. Sıfırlandı, boşluk tek yerden
   (öğe bazında 20px) yönetiliyor — ayraç çizgileri de kenardan kenara uzuyor. */
#mobile-drawer .drawer-content{flex:1 1 auto;overflow-y:auto;padding:0}
#mobile-drawer .site-header-item{display:block}

/* Kapatma düğmesi kendi satırını harcıyordu; logo satırının üstüne alındı. */
#mobile-drawer .drawer-header{
  position:absolute; top:0; right:0; left:auto; z-index:3; padding:0 12px;
}
#mobile-drawer .drawer-header .drawer-toggle{padding:18px 8px}

/* logo */
#mobile-drawer .mobile-html{
  padding:16px 20px;
  border-bottom:1px solid rgba(255,255,255,.08);
}
#mobile-drawer .mobile-html p{margin:0}
#mobile-drawer .mobile-html img{width:138px;height:auto;display:block}

/* arama */
#mobile-drawer .header-mobile-search-bar{padding:16px 20px 4px}

/* menü — sağda yön işareti */
#mobile-drawer #mobile-menu > li > a{
  padding:13px 20px;
  display:flex;
  align-items:center;
}
#mobile-drawer #mobile-menu > li:not(.menu-item-has-children) > a::after{
  content:"\203A";
  margin-left:auto;
  color:#41514A;
  font-size:17px;
  line-height:1;
}

/* İletişim düğmesi tam genişlik.
   .site-header-item satır yönlü bir flex; içindeki sarmalayıcı esnek öğe
   olduğu için içeriği kadar (130px) daralıyordu. */
#mobile-drawer .mobile-header-button-wrap,
#mobile-drawer .mobile-header-button-inner-wrap{
  flex:1 1 auto;
  width:100%;
}
#mobile-drawer .mobile-header-button-inner-wrap{padding:16px 20px 0}
#mobile-drawer a.mobile-header-button{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
}

/* --- alt blok: WhatsApp + telefon + platformlar --------------- */
#mobile-drawer .mobile-html2 p{margin:0}

#mobile-drawer .uzp-cek__wa{
  display:flex; align-items:center; justify-content:center; gap:9px;
  margin:9px 20px 0;
  padding:13px; border-radius:3px;
  background:#1F5C4A; color:#FFFFFF;
  font-size:14.5px; font-weight:600; line-height:1.2; text-decoration:none;
}
/* İkon uzp-whatsapp-ikon eklentisinden geliyor ve currentColor ile beyaz
   oluyor. Buraya İKİNCİ bir ikon EKLENMEZ — daha önce çift ikon hatasına
   yol açmıştı. */
#mobile-drawer .uzp-cek__wa:hover{background:#2E9E6B;color:#FFFFFF}

#mobile-drawer .uzp-cek__k{
  display:block;
  font-family:'IBM Plex Mono',ui-monospace,monospace;
  font-size:10px; letter-spacing:.16em; text-transform:uppercase;
  color:#8A968E; margin-bottom:3px;
}
#mobile-drawer .uzp-cek__ilet{padding:18px 20px 0}
#mobile-drawer .uzp-cek__tel{
  color:#FFFFFF; text-decoration:none; font-size:17px; font-weight:600;
}
#mobile-drawer .uzp-cek__ilet small{
  display:block; color:#8A968E; font-size:12.5px; margin-top:5px; line-height:1.6;
}

#mobile-drawer .uzp-cek__plat{
  padding:18px 20px 22px;
  margin-top:16px;
  border-top:1px solid rgba(255,255,255,.08);
}
#mobile-drawer .uzp-cek__plat .uzp-cek__k{margin-bottom:10px}
#mobile-drawer .uzp-cek__sira{display:flex;gap:8px;flex-wrap:wrap}
/* sahibinden logosu sarı ZEMİNLİ bir rozet (opak piksellerin %77'si sarı);
   koyu panelde tek başına çok baskın. Üçü de aynı kutucuk, aynı yükseklik. */
#mobile-drawer .uzp-cek__sira a{
  display:flex; align-items:center; justify-content:center; flex:1 1 auto;
  min-height:38px; padding:9px 11px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.08);
  border-radius:3px;
}
#mobile-drawer .uzp-cek__sira a:hover{background:rgba(255,255,255,.09)}
#mobile-drawer .uzp-cek__sira img{height:17px;width:auto;max-width:100%;display:block}
