/* ==========================================================================
   ŞK Hukuk Teması — v2.1 makale görünümü düzeltmeleri
   Bu dosya assets/style.css'ten SONRA yüklenir; !important yalnızca
   style.css:1040-1046'daki eşit özgüllüklü kuralları ezmek için kullanıldı.
   ========================================================================== */

/* ---------- 1. SVG güvenlik ağı ----------
   Şablonlardaki satır içi <svg>'lerin hiçbirinde width/height attribute'u yok.
   Boyut kuralı olmayan bir ikon (ör. .entry-meta svg) konteyner genişliğine
   yayılıp 770px'lik dev bir leke oluyordu. Tip seçici (0-0-1) olduğu için
   mevcut TÜM .xxx svg kuralları bunu rahatça ezer. */
svg{width:16px;height:16px;flex-shrink:0}
/* Makale gövdesine gömülü meşru bir SVG 16px'e ezilmesin */
.entry-content svg{width:auto;height:auto;max-width:100%}

/* ---------- 2. Yazı künyesi (asıl hata) ---------- */
.entry-meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px;
  margin:0 0 22px;padding-bottom:16px;border-bottom:1px solid var(--border-strong);
  font-family:var(--font-govde);
  font-size:.83rem;font-weight:400;color:var(--text-muted);line-height:1}
.entry-meta span{display:inline-flex;align-items:center;gap:7px;line-height:1}
.entry-meta svg{width:15px;height:15px;min-width:15px;flex:0 0 15px;
  fill:var(--brand);display:block}
.entry-meta a{color:var(--brand-deep);font-weight:500}
.entry-meta a:hover{color:var(--brand);text-decoration:underline}
html[data-tema="koyu"] .entry-meta a{color:var(--brand-light)}

/* ---------- 3. Okuma ölçüsü ve başlık ----------
   Not: page-hakkimizda.php, page-arabuluculuk.php gibi şablonlarda <article>
   var ama "entry-content" sınıfı yok. Bu yüzden okuma genişliği yalnızca
   makalelere uygulanıyor, sayfalarda metin ekran boyunca uzuyordu. Seçici
   sınıftan bağımsız hale getirildi ki her sayfada aynı satır ölçüsü olsun. */
.content article.entry-content{max-width:72ch}
.content > article > p,
.content > article > ul,
.content > article > ol,
.content > article > blockquote,
.content > article > h2,
.content > article > h3,
.content > article > h4{max-width:72ch}
.entry-title{font-size:2.15rem!important;line-height:1.24;letter-spacing:-.015em;
  margin:0 0 20px!important}

/* ---------- 4. Öne çıkan görsel ----------
   the_post_thumbnail('large') ham basılıyordu; oranı kilitleyip çerçeveliyoruz. */
.entry-content > img,
.entry-content img.wp-post-image{width:100%;height:auto;max-height:430px;
  object-fit:cover;object-position:center;border-radius:12px;
  margin:0 0 32px;border:1px solid var(--border-strong);display:block}

/* ---------- 5. Gövde tipografisi ----------
   Eski kural h1/h2/h3'ün üçünü de 1.4rem yapıyordu; başlık hiyerarşisi yoktu. */
.entry-content p{font-size:1.05rem!important;line-height:1.8!important;
  font-weight:400;color:var(--text);margin:0 0 18px}
.entry-content h2{font-size:1.5rem!important;line-height:1.32;
  margin:40px 0 15px!important;padding-left:15px;
  border-left:4px solid var(--brand)}
.entry-content h3{font-size:1.17rem!important;line-height:1.4;
  margin:28px 0 10px!important;padding-left:12px;
  border-left:3px solid var(--brand-cream)}
.entry-content h4{font-size:1.03rem;margin:22px 0 8px;color:var(--brand-deep)}
html[data-tema="koyu"] .entry-content h4{color:var(--brand-light)}
/* Başlık üstteki yapışkan menünün altında kalmasın */
.entry-content h2,.entry-content h3{scroll-margin-top:100px}

.entry-content ul,.entry-content ol{margin:0 0 20px 26px;line-height:1.8}
.entry-content li{margin-bottom:9px;padding-left:2px}
.entry-content li::marker{color:var(--brand);font-weight:700}
.entry-content li > ul,.entry-content li > ol{margin-top:9px;margin-bottom:4px}
.entry-content strong{font-weight:600;color:var(--text)}
.entry-content a:not(.btn):not(.pay){color:var(--brand-deep);
  border-bottom:1px solid rgba(var(--brand-rgb),.35);transition:border-color .2s,color .2s}
.entry-content a:not(.btn):not(.pay):hover{color:var(--brand);border-bottom-color:var(--brand)}
html[data-tema="koyu"] .entry-content a:not(.btn):not(.pay){color:var(--brand-light);
  border-bottom-color:rgba(var(--brand-light-rgb),.4)}

/* ---------- 5b. İKİ YANA YASLI DİZGİ ----------
   Hukuk metinlerinde (dilekçe, karar, mütalaa) standart dizgi iki yana yaslıdır.
   Yalnızca geniş ekranda uygulanır: dar ekranda satıra az kelime sığdığı için
   yaslama kelime aralarını açar ve metinde beyaz "nehirler" oluşur.
   Otomatik heceleme, aralıkların açılmasını engeller (html lang="tr" gerekir). */
@media(min-width:768px){
  .entry-content p,
  .entry-content li,
  .entry-content blockquote,
  .content > article > p,
  .content > article > ul li,
  .content > article > ol li,
  .content > article > blockquote{
    text-align:justify;
    text-justify:inter-word;
    hyphens:auto;
    -webkit-hyphens:auto;
    -ms-hyphens:auto;
    hyphenate-limit-chars:6 3 3;   /* en az 6 harfli kelimeyi böl, 3+3 parça */
    overflow-wrap:break-word;
  }
  /* Başlıklar ve kısa öğeler yaslanmaz */
  .entry-content h2,.entry-content h3,.entry-content h4,
  .entry-content figcaption,.entry-content th,.entry-content td,
  .toc a,.entry-meta{text-align:left;hyphens:manual}
}

/* ---------- 6. Alıntı, tablo, kutular ---------- */
.entry-content blockquote{margin:26px 0;padding:14px 24px 14px 54px;font-size:1.08rem}
.entry-content table{width:100%;border-collapse:collapse;margin:24px 0;
  font-size:.94rem;display:block;overflow-x:auto;white-space:nowrap}
@media(min-width:700px){.entry-content table{display:table;white-space:normal}}
.entry-content th{background:var(--brand-cream);font-family:var(--font-baslik);
  font-weight:600;text-align:left;border:1px solid var(--border-strong);padding:12px 13px}
.entry-content td{border:1px solid var(--border-strong);padding:11px 13px;font-weight:400}
.entry-content tr:nth-child(even) td{background:var(--surface-alt)}
html[data-tema="koyu"] .entry-content th{background:#2C201B}
html[data-tema="koyu"] .entry-content tr:nth-child(even) td{background:rgba(255,255,255,.02)}
.entry-content hr{border:0;border-top:1px solid var(--border-strong);margin:34px 0}

/* ---------- 7. İçindekiler ----------
   Kutunun kendisi PHP tarafında (inc/icindekiler.php) üretilir. */
.toc{margin:0 0 30px;padding:20px 24px;background:var(--surface-alt);
  border:1px solid var(--border-strong);border-left:3px solid var(--brand);
  border-radius:0 var(--radius-lg) var(--radius-lg) 0}
.toc-bas{font-family:var(--font-baslik);font-size:1.05rem;font-weight:600;
  margin:0 0 12px;color:var(--text);letter-spacing:-.01em}
.toc ol{list-style:none;margin:0;padding:0;columns:2;column-gap:34px;counter-reset:tocs}
.toc li{break-inside:avoid;margin:0 0 8px;padding:0;line-height:1.5;
  display:flex;gap:9px;align-items:baseline}
.toc li::before{counter-increment:tocs;content:counter(tocs) ".";
  color:var(--brand);font-weight:600;font-size:.82rem;flex-shrink:0;
  font-variant-numeric:tabular-nums}
.toc a{font-size:.91rem;color:var(--text-muted);border:0!important;transition:color .18s}
.toc a:hover{color:var(--brand);text-decoration:underline}
@media(max-width:640px){.toc{padding:16px 18px}.toc ol{columns:1}}

/* ---------- 8. Paylaş / yazdır ---------- */
.paylas{margin:38px 0 0;padding-top:22px;border-top:1px solid var(--border-strong)}
.paylas-bas{font-size:.78rem;font-weight:600;letter-spacing:.09em;text-transform:uppercase;
  color:var(--text-muted);margin:0 0 13px}
.paylas-l{display:flex;flex-wrap:wrap;gap:9px}
.pay{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;
  background:var(--surface);border:1px solid var(--border-strong);border-radius:20px;
  font-family:inherit;font-size:.84rem;font-weight:500;color:var(--text);
  cursor:pointer;box-shadow:var(--shadow-sm);transition:border-color .2s,box-shadow .2s,color .2s,transform .2s}
.pay:hover{border-color:var(--brand);color:var(--brand);transform:translateY(-1px);
  box-shadow:var(--shadow-md)}
.pay svg{width:16px;height:16px;fill:currentColor}
html[data-tema="koyu"] .pay{background:var(--surface-alt)}

/* ---------- 8b. Önceki / sonraki yazı ---------- */
.komsu{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:30px 0 0}
.komsu-oge{display:flex;flex-direction:column;gap:6px;padding:16px 18px;
  background:var(--surface);border:1px solid var(--border-strong);
  border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);transition:border-color .2s,box-shadow .2s,transform .2s}
.komsu-oge:hover{border-color:var(--brand);box-shadow:var(--shadow-md);transform:translateY(-2px)}
.komsu-sonraki{text-align:right}
.komsu-yon{font-size:.74rem;font-weight:600;letter-spacing:.07em;
  text-transform:uppercase;color:var(--brand-deep)}
.komsu-baslik{font-family:var(--font-baslik);font-size:.98rem;
  font-weight:600;line-height:1.35;color:var(--text)}
.komsu-bos{display:block}
html[data-tema="koyu"] .komsu-oge{background:var(--surface-alt)}
html[data-tema="koyu"] .komsu-yon{color:var(--brand-light)}
@media(max-width:640px){
  .komsu{grid-template-columns:1fr}
  .komsu-sonraki{text-align:left}
  .komsu-bos{display:none}
}
@media print{.komsu{display:none!important}}

/* ---------- 9. İlgili yazılar ---------- */
.ilgili{margin:40px 0 0;padding-top:26px;border-top:1px solid var(--border-strong)}
.ilgili-bas{font-family:var(--font-baslik);font-size:1.3rem;font-weight:600;
  margin:0 0 18px;padding-left:14px;border-left:4px solid var(--brand);line-height:1.3}
.posts--ilgili{grid-template-columns:repeat(2,1fr);gap:16px}
.posts--ilgili .post{padding:20px}
.posts--ilgili .post h3{font-size:1rem;line-height:1.4}
.posts--ilgili .post .exc{font-size:.83rem}
@media(max-width:820px){.posts--ilgili{grid-template-columns:1fr}}

/* ---------- 10. Yan sütun (mevcut .aside/.askcard/.kunye CSS'i kullanılıyor) ---------- */
.aside .scta{margin-bottom:2px}
.aside .askcard h3{font-size:1.2rem}

/* ---------- 10b. İSTATİSTİK ŞERİDİ ----------
   Sicil numaraları sayaçtan çıkarılınca 5 sütunluk ızgarada boşluk kalıyordu. */
.stats .wrap,
html[data-duzen="ust"] .stats .wrap{grid-template-columns:repeat(3,1fr)}
@media(max-width:760px){
  .stats .wrap,
  html[data-duzen="ust"] .stats .wrap{grid-template-columns:repeat(3,1fr);gap:8px}
  .stat b{font-size:1.5rem}
  .stat span{font-size:.64rem;letter-spacing:.03em}
}

/* ---------- 10c. DOKUNMA HEDEFİ ----------
   Denetimde 189 dokunma hedefinden 39'u 40 px altındaydı; parmakla isabet
   ettirmek zorlaşıyordu. Küçük bağlantı ve düğmelere asgari alan verilir. */
@media(max-width:1140px){
  .topbar a,.fsoc a,.yan-sosyal a,.pay,.chip,
  .paylas-l a,.paylas-l button{min-height:40px}
  .topbar a,.chip{display:inline-flex;align-items:center}
  .fsoc a,.yan-sosyal a{min-width:40px}
  .yazi > a{padding-top:11px;padding-bottom:11px}
  .faq summary{min-height:48px}
}

/* ---------- 10d. GİRİŞ ANİMASYONU GÜVENLİĞİ ----------
   style.css:455 `.rev{opacity:0}` ile başlıyor ve görünür olmayı
   JavaScript'in eklediği `.in` sınıfına bırakıyordu. Sitede 39 blok bu
   sınıfı taşıyor; betik geç yüklenir, hata verir ya da hiç çalışmazsa
   içerik kalıcı olarak görünmez kalıyordu.
   Artık varsayılan GÖRÜNÜR; animasyon yalnızca betik çalıştığında
   (html.sk-js) devreye giriyor. */
.rev{opacity:1;transform:none}
html.sk-js .rev{opacity:0;transform:translateY(18px);
  transition:opacity .6s ease,transform .6s ease}
html.sk-js .rev.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){
  html.sk-js .rev{opacity:1;transform:none;transition:none}
}

/* ---------- 11. Sayfalama (arşiv/arama) ---------- */
.pagination{margin:34px 0 0}
.pagination .nav-links{display:flex;flex-wrap:wrap;gap:7px;justify-content:center}
.page-numbers{display:inline-flex;align-items:center;justify-content:center;
  min-width:40px;height:40px;padding:0 13px;border-radius:var(--radius);
  border:1px solid var(--border-strong);background:var(--surface);
  font-size:.89rem;font-weight:500;transition:border-color .2s,color .2s}
.page-numbers:hover{border-color:var(--brand);color:var(--brand)}
.page-numbers.current{background:var(--brand);border-color:var(--brand);color:#fff}
.page-numbers.dots{border:0;background:none}
html[data-tema="koyu"] .page-numbers{background:var(--surface-alt)}

/* Arşiv/arama sonuç bilgisi */
.sonuc-yok{padding:30px 0;color:var(--text-muted);font-size:1rem;line-height:1.8}

/* ---------- 12. header.php'den taşınan kurallar ---------- */
.ai-h svg{width:19px;height:19px;fill:var(--brand)}
.ai-l{display:flex;flex-wrap:wrap;gap:9px}
.ai-b{padding:9px 16px;background:var(--surface);border:1px solid var(--border-strong);
  border-radius:var(--radius);font-size:.86rem;font-weight:500;transition:border-color .2s,color .2s,transform .2s}
.ai-b:hover{border-color:var(--brand);color:var(--brand);transform:translateY(-1px)}
.ai-n{margin:12px 0 0;font-size:.76rem;color:var(--text-muted);line-height:1.6}
article h2[id]{scroll-margin-top:100px}

/* ---------- 12b. MOBİL MENÜ HATASI ----------
   style.css:1021'deki `.menu{flex-wrap:wrap}` kuralı (masaüstünde menünün
   sağdan taşmasını önlemek için eklenmiş) media query dışında olduğu için
   mobilde de geçerliydi. Mobilde .menu flex-direction:column ve
   max-height:76vh taşıdığından, içerik yüksekliği aşınca öğeler İKİNCİ BİR
   SÜTUNA sarıyor ve menü okunamaz hale geliyordu. */
@media(max-width:1140px){
  .menu{flex-wrap:nowrap!important;justify-content:flex-start!important;
    max-height:min(80vh,calc(100vh - 140px))}
  .menu > li{width:100%}
  .menu > li > a{width:100%}
  .menu li.cta > a,.menu li.cta2 > a{display:flex;justify-content:center;width:100%}
  .menu .duzen-dugme{width:100%;margin-top:10px}
  .submenu{width:100%}
}

/* ---------- 12c. MOBİLDE SABİT ÖĞE ÇAKIŞMASI ----------
   Ekranın altında dört ayrı sabit öğe üst üste biniyordu:
     .ctabar               (tema, z:999)     — WhatsApp / Randevu / Ara şeridi
     .sabit-randevu-btn    (snippet, z:999999) — şeridin WhatsApp düğmesini kapatıyordu
     .wpsr-fm-chat-wrapper (eklenti, z:9999)   — şeridin "Ara" düğmesini kapatıyordu
   Şerit zaten üç eylemi de içerdiği için, mobilde tek eylem katmanı bırakılıyor. */
@media(max-width:900px){
  /* Şeritte birebir aynısı ("Randevu") bulunduğu için mobilde gizlenir */
  .sabit-randevu-btn{display:none!important}

  /* Sohbet balonu şeridin üstüne alınır, üzerine binmez */
  .wpsr-fm-chat-wrapper,
  [id^="wpsr-chat-widget"]{bottom:88px!important}

  /* Şerit her zaman en üstte ve tam genişlikte kalsın */
  .ctabar{z-index:1000!important}
}

/* ---------- 12d. YATAY TAŞMA ----------
   .logo `white-space:nowrap` taşıdığı için dar ekranlarda satır sığmıyor,
   belge genişliği ekranı aşıyor ve sayfa yana kayıyordu. */
@media(max-width:1140px){
  .logo{white-space:normal;line-height:1.3}
  .nav .wrap{gap:12px}
  /* Sağdaki dikey sosyal sütunu mobilde görünmemeli.
     style.css:634'teki `html[data-duzen="ust"] body:has(.yan) .sosyal-sabit{display:flex}`
     kuralı medya sorgusu dışında olduğu için mobil gizlemeyi eziyordu. */
  .sosyal-sabit,
  html[data-duzen="ust"] body:has(.yan) .sosyal-sabit{display:none!important}
}
@media(max-width:520px){
  .logo{font-size:.95rem}
  .logo b{padding-right:8px;border-right-width:4px;margin-right:8px}
}
/* ---------- 12b. Yatay taşma: gizlemek yerine önlemek ----------
   17.08.2026 — Buradaki `html,body{overflow-x:hidden}` kaldırıldı.

   O kural taşmayı ÇÖZMÜYOR, gizliyordu: kaydırma çubuğu çıkmadığı için taşan
   kısım sessizce kırpılıyor, ziyaretçi metni "kesik" görüyor, biz de sorunu
   hiç fark etmiyorduk. eski-sayfalar.css'teki 12.08.2026 tarihli not da bunu
   "koruma değil, hata gizleyici" diye tarif ediyor.

   Kaldırmadan önce ölçüldü: 22 gerçek sayfa (ana sayfa, 12 makale, arşiv,
   hesaplayıcı, KVKK, dilekçe örnekleri, kadromuz, iletişim, hakkımızda)
   390 px genişlikte, maske kapalıyken tarandı — hiçbirinde taşma yok
   (belge kaydırma genişliği = görünür genişlik). KVKK'daki geniş tablo
   kendi kapsayıcısında yatay kayıyor, sayfayı taşırmıyor.

   Maskenin yerine, taşmanın SEBEPLERİNİ kapatan kurallar konuldu. Asıl
   boşluk şuydu: `overflow-wrap:break-word` yalnızca min-width:768px içinde
   tanımlıydı; yani uzun bir bağlantı veya kesintisiz kelime tam da mobilde
   satırı taşırabiliyordu. Artık her genişlikte geçerli. */
.entry-content{overflow-wrap:break-word}
.entry-content img,.entry-content iframe,.entry-content video,
.entry-content pre,.entry-content table{max-width:100%}
.entry-content pre{overflow-x:auto}

/* Izgara çocuklarının daralabilmesi.
   Maske kaldırılınca 360 px'te ana sayfanın "hakkımızda" bölümü 21 px taşıyordu:
   .about tek sütuna indiğinde `1fr` izi 346 px'e kilitleniyordu, çünkü ızgara ve
   esnek çocuklar varsayılan olarak `min-width:auto` taşır ve min-content
   genişliğinin altına inemez. eski-sayfalar.css'te v5 kartları için aynı tuzak
   12.08.2026'da not edilmişti; burada tema genelindeki ızgaralar için kapatılıyor.
   Masaüstünde yer bol olduğu için düzen değişmez. */
.about > *,.g4 > *,.rows > *,.posts > *,.prin > *,
.steps > *,.people > *,.cinfo > *,.fgrid > *{min-width:0}

/* Künye listesi: ikinci sütun `1fr` idi ve `min-width:auto` yüzünden en uzun
   değerin altına inemiyordu (320 px'te 192 px'e kilitleniyordu). */
.kunye dl{grid-template-columns:auto minmax(0,1fr)}
.kunye dd{overflow-wrap:break-word}

/* Üst şerit dar ekranda tek satıra sığmıyordu; sarmasına izin verildi. */
@media(max-width:480px){
  .topbar-group{flex-wrap:wrap;justify-content:center;gap:4px 14px}
}

/* ---------- 12c. KVKK aydınlatma paragrafı: görünmez metin düzeltmesi ----------
   17.08.2026 — ÖLÇÜLDÜ: kontrast oranı 1,13:1.

   Bir kod parçacığı `.askcard .kvkk-bilgi` ve `.hform .kvkk-bilgi` için beyaz
   renk veriyor (rgb(255 255 255 / .8)). Bu kural, formların KOYU zeminde
   durduğu eski tasarımdan kalma. Formlar artık açık zeminde (ölçülen zemin
   rgb(243,241,239)), dolayısıyla metin fiilen görünmez hâldeydi.

   Etkilenen sayfalar: ana sayfa, hakkımızda, iletişim, kadromuz, danışma,
   çalışma ilkelerimiz, online danışmanlık — yani KVKK aydınlatma metninin
   gösterildiği her yer. Sıradan bir görünüm kusuru değil: aydınlatma
   yükümlülüğünün yerine getirildiğinin görünür olması gerekir.

   YALNIZCA .hform — ÖNEMLİ AYRIM (ölçüldü):
     .hform  → kapsayıcı zemin rgb(243,241,239), AÇIK  → koyu metin gerekir
     .askcard→ background:var(--brand-panel) rgb(32,36,43), KOYU → beyaz doğru
   İlk denemede ikisi birden koyu renge çevrilmiş, .askcard içindeki metin
   2,37:1'e düşmüştü; yani düzeltme orayı bozuyordu. Ölçüm bunu yakaladı,
   kural .hform ile sınırlandı.

   Seçici (0,2,1) özgüllüğünde; parçacığın (0,2,0) kuralını sıralamadan
   bağımsız olarak ezer, !important gerekmez. Renk token'dan geldiği için
   karanlık temada kendiliğinden açık tona döner.

   KALICI ÇÖZÜM: parçacıktaki .hform satırı silinmeli; o zaman bu blok kalkar. */
.hform p.kvkk-bilgi{color:var(--text-muted);opacity:1}

/* ---------- 12d. Saydamlıktan doğan kontrast kayıpları ----------
   17.08.2026 — Saydamlık, rengi zeminle karıştırıp kontrastı düşürür ve bu
   gözle fark edilmez. Ölçüldü:
     .sk-uzmanlik-notu  opacity .82 -> 3,95:1  (eşik 4,5)  ✗
     .map .map-not      opacity .8  -> 3,77:1  (eşik 4,5)  ✗
   Renkler zaten yeterliydi (saydamlıksız 5,83:1); sorun yalnızca opaklıktı.
   Saydamlık kaldırıldı, renk aynı bırakıldı — görünüm neredeyse aynı,
   okunabilirlik AA eşiğinin üstüne çıkıyor. */
/* Özgüllük notu: parçacığın kuralları (0,1,0) ve bu dosyadan SONRA geliyor;
   eşit özgüllükte sonraki kazandığı için öge adı eklenerek (0,1,1)/(0,2,1)
   yapıldı. İlk denemede eşit özgüllükle yazılmış ve tutmamıştı — ölçümle
   görüldü. */
p.sk-uzmanlik-notu{opacity:1}
.map small.map-not{opacity:1}

/* Alt bilgideki sosyal düğmeler de sarmıyordu. Düğmeler dokunma hedefi olsun
   diye 40 px'e sabitlenmiş (bölüm 10); 320 px'te altı düğme + boşluklar tek
   satıra sığmayıp sayfayı 15 px taşırıyordu. Genişlikte yer varken düzen
   değişmez, yalnızca sığmadığında alt satıra iner. */
.fsoc{flex-wrap:wrap}

/* 17.08.2026 — 360 px altı için bırakılan geçici kalkan KALDIRILDI.
   O kalkan, 320 px'te her sayfada görülen 15 px'lik ortak taşma yüzünden
   konulmuştu. Kaynağı bulundu: alt bilgideki sosyal düğmeler (yukarıdaki
   .fsoc kuralı). Düzeltildikten sonra 17 sayfa 320, 360 ve 390 px'te
   kalkan olmadan temiz ölçüldü. Artık hiçbir genişlikte taşma gizlenmiyor:
   bir taşma olursa görünür olur ve düzeltilir. */

/* Dar ekranda geniş tablolar sayfayı değil kendilerini kaydırsın.
   .entry-content table için bu kural zaten vardı (bölüm 6); table.t makale
   gövdesi dışındaki şablonlarda da kullanılıyor ve oralarda korumasızdı —
   /hakkimizda/ sayfası 360 px'te bu yüzden 16 px taşıyordu. */
@media(max-width:699px){
  table.t{display:block;overflow-x:auto;white-space:nowrap;max-width:100%}
}

/* ---------- 13. Mobil ---------- */
@media(max-width:768px){
  .entry-title{font-size:1.62rem!important;margin-bottom:16px!important}
  .entry-content p{font-size:1.02rem!important;line-height:1.75!important}
  .entry-content h2{font-size:1.28rem!important;margin:30px 0 12px!important;padding-left:12px}
  .entry-content h3{font-size:1.08rem!important;margin:22px 0 9px!important}
  .entry-content > img,.entry-content img.wp-post-image{max-height:230px;
    border-radius:9px;margin-bottom:24px}
  .entry-meta{gap:7px 14px;font-size:.78rem;margin-bottom:18px;padding-bottom:13px}
  .entry-content ul,.entry-content ol{margin-left:20px}
}

/* ---------- 14. Yazdırma ---------- */
@media print{
  .paylas,.ilgili,.ilerleme{display:none!important}
  .entry-content > img,.entry-content img.wp-post-image{max-height:180pt}
  .toc{border:1pt solid #999;background:none}
  .entry-meta{border-bottom:1pt solid #000}
}

/* ==========================================================================
   v2.2 — Başlık hizası · Ajan tabanlı arama · Makaleler erişim/performans
   12.08.2026
   ========================================================================== */

/* ---------- 15. BAŞLIK ŞERİDİ HİZASI ----------
   Sorun: `.wrap` her yerde 1180 px ile sınırlı olduğu için 1920 px'lik bir
   ekranda üst şerit ve ana menü ortada 1180 px'lik bir adaya sıkışıyordu;
   logo soldan 383 px içeriden başlıyordu. Menü de o dar alana sığmadığından
   style.css:1021'deki `.menu{flex-wrap:wrap}` kuralıyla İKİNCİ BİR SATIRA
   sarıyor, başlık "ortada toplanmış" görünüyordu.

   Çözüm: başlık şeridi ekranın iki kenarına yaslanır; gövde içeriği 1180
   px'lik okuma şeridinde kalmaya devam eder. Menü tek satırda, sağa yaslı.

   Genişlik kademeleri (ölçülerek belirlendi — logo 444 px, menü 928 px):
     ≥ 1520 px : her şey tam boy            (gereken en az genişlik 1481 px)
     1241–1519 : künye küçülür, menüdeki
                 "Online Danışmanlık" düğmesi gizlenir  (gereken 1172 px)
     1141–1240 : künye tamamen gizlenir     (gereken  903 px)
     ≤ 1140 px : hamburger menü (mevcut davranış, dokunulmadı)             */

@media(min-width:1141px){
  .topbar .wrap,
  .nav .wrap{max-width:none;
    padding-left:clamp(20px,2.6vw,52px);
    padding-right:clamp(20px,2.6vw,52px)}
  .nav .wrap{gap:32px}
  .menu{flex-wrap:nowrap;justify-content:flex-end;gap:18px;margin-left:auto}
}

@media(min-width:1141px) and (max-width:1519px){
  .logo .tag{font-size:.86rem;opacity:.82}
  .menu li.cta2{display:none}
  .menu{gap:14px;font-size:.85rem}
}

@media(min-width:1141px) and (max-width:1240px){
  .logo .tag{display:none}
  .logo b{padding-right:0;margin-right:0;border-right:0}
  .menu{gap:12px;font-size:.82rem}
}

/* Künye, logo bağlantısının ikinci parçası. Mobilde her zaman görünür. */
.logo .tag{white-space:nowrap}

/* Üst şeritteki düzen anahtarı — menüden buraya taşındı */
.topbar .duzen-dugme{background:none;border:1px solid var(--border-dark);
  border-radius:16px;padding:5px 12px;color:inherit;font:inherit;font-size:.8rem;
  cursor:pointer;opacity:.85;transition:opacity .2s,color .2s,background-color .2s,border-color .2s}
.topbar .duzen-dugme:hover{opacity:1;color:#fff;background:var(--brand);border-color:var(--brand)}

/* ---------- 15b. DOKUNMA HEDEFİ — masaüstü ----------
   WCAG 2.5.8 asgari 24×24 px. Üst şerit bağlantıları 16 px, menü
   bağlantıları 23 px yükseğindeydi. Görsel yükseklik değişmesin diye
   yükseklik dolgu değil, saydam bir alanla veriliyor. */
@media(min-width:1141px){
  .topbar a,
  .topbar .duzen-dugme{min-height:24px}
  .menu > li > a{display:inline-flex;align-items:center;min-height:26px}
}

/* ---------- 16. AJAN TABANLI ARAMA ---------- */

/* 16a. Sitede arama — yan paneldeki kutu bir <form> içinde değildi ve
   girdinin `name` niteliği yoktu: Enter'a basınca hiçbir şey olmuyordu.
   Artık gerçek bir arama formu. */
.yan-ara form{display:contents}
/* Gönder düğmesi görsel olarak gizli (Enter zaten gönderir) ama klavyeyle
   sekmeyle gelindiğinde görünür olur — odaklanabilir hiçbir öğe görünmez kalmamalı. */
.ara-gonder{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);
  background:var(--brand);color:#fff;border:0;font:inherit;font-size:.8rem;cursor:pointer}
.ara-gonder:focus-visible{position:static;width:auto;height:auto;clip:auto;overflow:visible;
  margin-left:8px;padding:8px 14px;border-radius:8px;min-height:40px}

/* 16b. Üst şeritteki arama alanı (masaüstü).
   Klasik düzende site genelinde hiç arama yoktu. Ana menüye konsaydı menünün
   tek satıra sığma payını yiyordu; üst şeritte boş yer vardı. */
.topbar-ara{position:relative;display:flex;align-items:center}
.topbar-ara svg{position:absolute;left:10px;width:14px;height:14px;fill:currentColor;opacity:.6;
  pointer-events:none}
.topbar-ara input{width:190px;min-height:26px;padding:4px 10px 4px 30px;
  background:rgba(255,255,255,.06);border:1px solid var(--border-dark);border-radius:16px;
  color:#fff;font:inherit;font-size:.8rem;transition:border-color .2s,background-color .2s,width .2s}
.topbar-ara input::placeholder{color:rgba(255,255,255,.5)}
.topbar-ara input:focus{border-color:var(--brand);background:rgba(255,255,255,.1);width:230px;outline:none}

/* 16c. Mobil menüdeki arama alanı — üst şerit ≤1140 px'te gizlendiği için
   klasik düzende mobilde başka arama alanı kalmıyor. */
.menu-ara{display:none}
@media(max-width:1140px){
  .menu-ara{display:block;margin:8px 0 4px}
  .menu-ara-form{position:relative;display:flex;align-items:center}
  .menu-ara-form svg{position:absolute;left:12px;width:16px;height:16px;fill:#fff;opacity:.55;
    pointer-events:none}
  .menu-ara-form input{width:100%;min-height:44px;padding:0 12px 0 36px;
    background:var(--brand-soft);border:1px solid var(--border-dark);border-radius:9px;
    color:#fff;font:inherit;font-size:.95rem}
  .menu-ara-form input::placeholder{color:rgba(255,255,255,.5)}
  .menu-ara-form input:focus{border-color:var(--brand);outline:none}
}

/* 16d. Makale sonundaki "yapay zekâya sor" bloğu.
   .ai-* stilleri v2.1'de ek.css'e taşınmıştı ama bloğu basan şablon yoktu;
   kurallar sahipsiz kalmıştı. Blok geri geldi, eksik kurallar tamamlandı. */
.ai-kutu{margin:34px 0 6px;padding:20px 22px;background:var(--surface-warm);
  border:1px solid var(--border);border-left:3px solid var(--brand);border-radius:var(--radius)}
.ai-h{display:flex;align-items:center;gap:9px;margin:0 0 6px;
  font-family:var(--font-baslik);font-size:1.05rem;font-weight:600}
.ai-h svg{width:19px;height:19px;fill:var(--brand);flex-shrink:0}
.ai-l{display:flex;flex-wrap:wrap;gap:9px;margin-top:13px}
.ai-b{display:inline-flex;align-items:center;min-height:40px;
  padding:9px 16px;background:var(--surface);border:1px solid var(--border-strong);
  border-radius:var(--radius);font-family:inherit;font-size:.86rem;font-weight:500;
  color:inherit;cursor:pointer;transition:border-color .2s,color .2s,transform .2s}
.ai-b:hover{border-color:var(--brand);color:var(--brand);transform:translateY(-1px)}
.ai-n{margin:12px 0 0;font-size:.76rem;color:var(--text-muted);line-height:1.6}
.ai-giris{margin:0;font-size:.88rem;color:var(--text-muted);line-height:1.65}
@media print{.ai-kutu{display:none!important}}

/* ---------- 17. MAKALELER ARŞİVİ — erişim ve performans ----------
   Liste öğelerindeki dosya ikonu 342 kez satır içi SVG olarak
   basılıyordu (52 KB / sayfanın %22'si). Artık sayfa başında bir kez
   <symbol> olarak tanımlanıp <use> ile çağrılıyor.
   Ölçüler `.yazi svg` kuralından gelmeye devam ediyor (17×17). */
.sk-simge-deposu{position:absolute;width:0;height:0;overflow:hidden}

/* Arşiv araması artık gerçek bir <form>. Etiket görsel olarak gizli ama ekran
   okuyucuya açık; gönder düğmesi yalnızca klavyeyle odaklanınca görünür,
   o yüzden kapsayıcı satır düzeninde. */
.arsiv-ara{display:flex;align-items:center}
.arsiv-ara label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* Filtre düğmeleri: seçili durum artık aria-pressed ile de bildiriliyor.
   Durum yalnızca renkle taşınmasın diye seçiliye ayrıca iç çerçeve veriliyor.
   Yükseklik WCAG 2.5.8 asgarisine (24 px) rahatça çıkarıldı. */
.chip{display:inline-flex;align-items:center;min-height:40px}
.chip[aria-pressed="true"]{box-shadow:inset 0 0 0 1px rgba(255,255,255,.35)}

/* Sonuç sayacı canlı bölge (role="status"). display:none VERİLMEZ: gizlenen
   bir canlı bölge erişilebilirlik ağacından düşer ve içeriği değişince ekran
   okuyucu duyurmaz. Boşken sadece yer kaplamaz. */
.arsiv-sayac{margin:10px 0 0;font-size:.88rem;color:var(--text-muted);min-height:1.4em}

/* ==========================================================================
   RANDEVU WIDGET'I İÇİN YER AYIRMA — 12.08.2026

   Amelia (`.amelia-v2-booking`) sayfa yüklenirken kökü BOŞ basıyor ve
   içeriğini JS ile sonradan dolduruyor. Ölçüm (390 px, zaman çizelgesi):

     t = 1838 ms   yükseklik    0 px
     t = 2615 ms   yükseklik  560 px

   Yani blok 0'dan 560 px'e sıçrıyor. Randevu sayfasında açıklama metni
   takvimin ALTINA alındıktan sonra bu sıçrama altındaki her şeyi itmeye
   başladı ve CLS 0,175 → 0,69'a çıktı (3 ölçüm: 0,79 · 0,71 · 0,57 —
   Google'ın "kötü" eşiği 0,25).

   Değişiklik kötü değildi; ALTINA içerik konunca var olan kusur görünür oldu.
   Yer önceden ayrılırsa sıçrama kimseyi itmez.

   560 px hem 390 px hem 1200 px genişlikte ölçüldü, ikisinde de aynı.
   Takvim yüklendiğinde içerik bu yüksekliği zaten dolduruyor, dolayısıyla
   min-height fazladan boşluk üretmiyor.
   ========================================================================== */
.amelia-v2-booking{min-height:560px}

/* ==========================================================================
   v2.5.2 — [sk_alan_makaleleri] konu sayfası makale listesi
   Konu sayfalarının gövdesindeki kısa kodun karşılığı yoktu; liste hiç
   basılmıyor, üstelik kısa kod ham metin olarak ziyaretçiye görünüyordu.
   Liste uzun olabildiği için (İş Hukuku 78 yazı) iki sütuna açılıyor.
   ========================================================================== */
.alan-makaleleri{margin:36px 0 8px}
.alan-makaleleri__liste{list-style:none;margin:0;padding:0;
  columns:2;column-gap:32px}
.alan-makaleleri__liste li{break-inside:avoid;margin:0 0 12px;
  padding-left:14px;position:relative;line-height:1.5}
.alan-makaleleri__liste li::before{content:"›";position:absolute;left:0;
  color:#96773f;font-weight:700}
.alan-makaleleri__liste a{text-decoration:none}
.alan-makaleleri__liste a:hover{text-decoration:underline}
.alan-makaleleri__tarih{display:block;font-size:.85em;opacity:.65;margin-top:2px}
@media (max-width:760px){.alan-makaleleri__liste{columns:1}}
.alan-makaleleri__tumu{margin-top:8px}
.alan-makaleleri__tumu>summary{cursor:pointer;font-weight:600;color:#96773f;
  padding:8px 0;list-style:revert}
.alan-makaleleri__tumu[open]>summary{margin-bottom:12px}

/* ---------- 18. PANEL DÜZENİ KAPATILDI — mobil menü düzeltmesi (15.08.2026)

   Temada iki gezinme düzeni vardı: klasik üst menü ("ust", düğmesi #burger)
   ve sol panel ("yan", düğmesi #yanAc). #yanAc'a HİÇBİR yerde tıklama
   işleyicisi bağlanmamıştı — ne header.php'de satır içi onclick, ne app.js'te
   dinleyici; .yan.acik kuralı duruyordu ama 'acik' sınıfını ekleyen kod yoktu.
   Panel düzenine düşen her telefonda menü düğmesi basılıyor, hiçbir şey
   olmuyordu.

   Panele düşmenin iki yolu vardı: (1) style.css:927 gereği data-duzen niteliği
   yoksa varsayılan panel düzeni geçerliydi ve niteliği yazan betik
   localStorage'a bağlıydı (gizli sekme/ITP/çerez engelinde sessizce
   başarısız); (2) app.js kayıt bulamayınca niteliği doğrudan 'yan' yapıyordu.
   Her ikisinde de .topbar ile .nav gizleniyor, çalışan #burger ekrandan
   kalkıyordu.

   Düzen artık header.php'de sunucudan "ust" basılıyor ve app.js'teki seçici
   kaldırıldı. Aşağıdaki kurallar son emniyet katmanı: JS hiç çalışmasa bile
   klasik menü ekranda kalır.                                                */
.yan,.yan-ac,[data-duzen-degistir]{display:none!important}
@media screen{
  /* Kural bilerek @media screen içinde: ek.css bölüm 14 ve style.css:532
     yazdırmada .topbar/.nav'ı gizliyor, bu satırlar onu ezmemeli. */
  .topbar{display:block!important}
  .nav{display:block!important}
  /* Panel düzeninin gövdeye açtığı yan sütun ve üst şerit boşluğunu geri al. */
  .uyg-govde{margin-left:0!important;padding-top:0!important}
  .ctabar{left:0!important}
}

/* ---------- 19. MOBİLDE BAŞLIK LOGOSU HİZASI (15.08.2026)

   Sorun: telefonda marka adı "ŞERAFETTİN / KAYA" diye ikiye bölünüyor, üstelik
   ayırıcı çizgi bu iki satırın ORTASINDA asılı kalıyordu.

   Ölçüm (canlı sitede, gerçek mobil genişliklerde): 430 / 390 / 375 / 360 /
   320 px — HEPSİNDE `.logo b` iki satır. Yani ziyaretçinin yazı tipi ayarıyla
   ilgisi yoktu, her mobil cihazda vardı.

   Kök neden, üç kuralın üst üste binmesi:
     1) Yukarıdaki bölüm 12d — `.logo{white-space:normal}`. Yatay taşmayı
        önlemek için sarmalanmaya bilerek izin veriliyor.
     2) Aşağıdaki bölüm 15 — `.logo .tag{white-space:nowrap}`. Künye bölünmez
        ve tek parça 215 px yer kaplar; 390 px'lik ekranda logoya kalan alan
        284 px olduğundan marka adına yer kalmaz ve `<b>` ikiye bölünür (97 px).
     3) Ayırıcı çizgi `.logo b::after` ile `position:absolute; top:50%;
        transform:translateY(-50%)` olarak konuyor (sitede kod parçacığı #30).
        `<b>` iki satır olunca "dikey orta" iki satırın ARASI oluyor.

   Çözüm: mobilde logo alt alta dizilir — marka adı üstte tek satırda, künye
   altında.

   MARKA ÇİZGİSİ KORUNUR — logo bloğunun soluna dikey aksan olarak taşınır ve
   marka adı ile künyenin ikisi boyunca uzanır. Özgün yerleşim (marka ile künye
   ARASINDA dikey çizgi) mobilde geometrik olarak imkânsız: marka 182 px +
   çizgi 13 px + künye 215 px = 410 px, üstüne menü düğmesi 44 px — 390 px'lik
   ekrana sığmıyor. Çizginin rengi değişmedi (var(--brand)).

   `.logo b::after` gizlenir çünkü çizgiyi oraya mutlak konumla basan taraf
   sitedeki kod parçacığı #30'dur; yerine `.logo::before` konur.

   Doğrulama (aynı beş genişlikte): marka satır sayısı 2 → 1 · marka genişliği
   97 → 182 px · çizgi 3 px, rgb(166,58,34) · yatay taşma yok · menü düğmesiyle
   çakışma yok.                                                              */
@media(max-width:1140px){
  .logo{display:block;white-space:normal;line-height:1.25;position:relative;padding-left:14px}
  .logo b{display:block;white-space:nowrap;padding-right:0;margin-right:0;border-right:0}
  .logo b::after{display:none!important}
  .logo::before{content:"";position:absolute;left:0;top:2px;bottom:2px;width:3px;
    background:var(--brand);border-radius:2px}
  .logo .tag{display:block;white-space:nowrap;font-size:.8rem;opacity:.85}
}

/* ══════════════════════════════════════════════════════════════════════════
   20 · MOBİL MENÜ AÇIKKEN ALT EYLEM ŞERİDİ MENÜYÜ ÖRTÜYORDU — 15.08.2026

   Kusur: hamburger menü açıldığında ekranın altındaki sabit WhatsApp /
   Randevu / Ara şeridi menünün ÜSTÜNDE kalıyor, açık menünün son iki
   maddesini ("Sık Sorulan Sorular", "İletişim") kapatıyordu.

   Kök neden — ikisi de AYNI katmanda:
     style.css:47   .nav    { position:sticky; z-index:1000 }
     ek.css:276     .ctabar { z-index:1000!important }
   Eşit z-index'te belge sırasında SONRA gelen kazanır; .ctabar footer'da,
   .nav başlıkta olduğu için şerit menünün üstüne biniyordu. Açık menünün
   kendi z-index'i `auto` olduğundan .nav'ın 1000'ini aşamıyordu.

   Çözüm iki katmanlı — GEREKÇE:
   (a) `.nav{z-index:1200}` — GARANTİ katman. Hiçbir tarayıcı özelliğine
       bağlı değil, her yerde çalışır; menü şeridin üstüne çıkar.
   (b) `body:has(.menu.open) .ctabar{display:none}` — TERCİH EDİLEN davranış.
       Menü açıkken ölü şeridi tamamen kaldırır; (a) yalnızca üstünü örterdi.
       :has() desteklemeyen tarayıcıda sessizce devre dışı kalır, (a) devrede.

   Kaydırma kilidi: `.menu` zaten `max-height:76vh; overflow:auto` (style.css:
   425) olduğu için menü hiçbir zaman ekranı aşmaz — gövde kaydırması
   kilitlenince menü içeriği erişilemez hâle GELMEZ. Bu yüzden kilit güvenli.
   ══════════════════════════════════════════════════════════════════════════ */
@media screen and (max-width:1140px){
  .nav{z-index:1200}
  .menu.open{z-index:1201}
  body:has(.menu.open) .ctabar{display:none!important}
  html:has(.menu.open),body:has(.menu.open){overflow:hidden}
}

/* ══════════════════════════════════════════════════════════════════════════
   21 · ANA SAYFA DENETIMI — ORTA ÖNCELİKLİ MADDELER — 15.08.2026

   Kaynak: 15.08.2026 ana sayfa denetimi. Bu bölüm B4 · B5 · C1 · C2 · C4 ·
   C5 · D1 · D3 ve B2'nin görünüm tarafını karşılar. Canlıdaki eşleniği kod
   parçacığı #34'tür (tema dosyası düzenleyici kapalı olduğu için anında
   çözüm oradan verildi); bu paket yüklendikten sonra parçacık pasife
   alınabilir — parçacığın işaretleme yaması zaten kendiliğinden no-op olur,
   çünkü hedef dizeler front-page.php'de artık farklı.
   ══════════════════════════════════════════════════════════════════════════ */

/* B4 — "Gebze'de Avukatlık ve Arabuluculuk" bölümünde paragraflar arasında hiç
   boşluk yoktu: style.css:22'deki `*{margin:0}` sıfırlaması paragraf aralığını
   da siliyor, iki paragraf tek blok gibi akıyordu. Mobilde daha belirgindi. */
.about > div > p{margin-bottom:16px}
.about > div > p:last-of-type{margin-bottom:0}

/* B5 — mobilde makale tarihleri gizleniyordu (style.css:566 `.yazi time
   {display:none}`). Hukuki içerikte güncellik en güçlü güven sinyali; tarih
   mobilde de görünür, başlığın altına küçük punto ile iner. Soldaki 28 px
   girinti simge (17 px) + boşluk (11 px) toplamıdır, başlıkla hizalanır. */
@media(max-width:760px){
  .yazi > a{flex-wrap:wrap}
  .yazi time{display:block;order:3;flex:0 0 100%;width:100%;
    margin:3px 0 0 28px;font-size:.72rem;opacity:.9}
}

/* C1 — Danışma formunda görünür etiket yoktu; bilginin tek kaynağı
   placeholder'dı ve alan doldurulunca kayboluyordu. Etiketler front-page.php
   içinde basılıyor. */
.askcard .ask-lbl{display:block;margin:14px 0 6px;color:#fff;
  font-size:.88rem;font-weight:500;line-height:1.4}
.askcard .ask-lbl:first-of-type{margin-top:2px}
.askcard .ask-not{font-weight:400;opacity:.62;font-size:.8rem}

/* C2 — iOS Safari 16 px altındaki alana dokunulunca sayfayı büyütüyor ve
   düzen kayıyor. Ölçüm: form alanları 15,2 px (.95rem), arama kutuları
   12,8 / 13,3 / 13,8 px idi. */
.field input,.field select,.field textarea,
.askcard input,.askcard textarea,.askcard select,
.topbar-ara input,.menu-ara-form input,.yan-ara input{font-size:16px}
/* Üst şeritteki arama kutusu 16 px ile dar kalmasın diye biraz genişletildi. */
@media(min-width:1141px){
  .topbar-ara input{width:212px;min-height:32px;padding:5px 12px 5px 32px}
  .topbar-ara input:focus{width:250px}
}

/* C4 — placeholder kontrastı 3,34:1 idi — rgb(124,132,146) üzerine
   rgb(241,241,241); WCAG AA eşiği 4,5:1. Koyu zeminli arama kutusunda 2,85:1.
   Yeni değerler (hesaplandı):
     #5f6672 / #f1f1f1 = 5,11:1      #5f6672 / #fff = 5,77:1
     rgba(255,255,255,.74) koyu şeritte > 8:1
     #aab2bf / #31363E (koyu tema)  = 5,68:1                                */
.field input::placeholder,.field textarea::placeholder,
.askcard input::placeholder,.askcard textarea::placeholder{color:#5f6672;opacity:1}
.topbar-ara input::placeholder,.menu-ara-form input::placeholder,
.yan-ara input::placeholder{color:rgba(255,255,255,.74);opacity:1}
html[data-tema="koyu"] .askcard input::placeholder,
html[data-tema="koyu"] .askcard textarea::placeholder{color:#aab2bf;opacity:1}

/* C5 — dokunma hedefleri. Ölçüm: alt bilgi bağlantıları 17 px, alttaki yasal
   bağlantılar 15 px yüksekliğinde ve dikey aralıkları dardı; hamburger düğmesi
   37×41 px idi. Punto büyütülmeden dikey alan verilir.
   Düğmede yalnızca KUTU büyütülüyor; span'lerin 5 px'lik marjı korunuyor ki
   `.burger.on` çarpı animasyonundaki translateY(8px) bozulmasın. */
@media(max-width:1140px){
  .burger{width:44px;height:44px;padding:0;display:flex;
    flex-direction:column;align-items:center;justify-content:center}
}
footer .fgrid ul{gap:2px}
footer .fgrid ul li a{display:inline-flex;align-items:center;min-height:32px}
.fbot nav{gap:8px 18px}
.fbot nav a{display:inline-flex;align-items:center;min-height:32px}
/* C5 + D3 birlikte: tek sütunda 40 px'lik hedefler alt bilgiyi mobilde 334 px
   uzatıyordu ve D3'ün kazandırdığını geri alıyordu (ölçüldü: alt bilgi
   1612 → 1946 px). Bağlantı listeleri mobilde iki sütuna dizilince hem WCAG'in
   tercih ettiği 40 px hedef sağlanıyor hem alt bilgi kısalıyor (1676 px). */
@media(max-width:760px){
  footer .fgrid ul{display:grid;grid-template-columns:1fr 1fr;gap:2px 14px}
  footer .fgrid ul li a{min-height:40px}
}

/* D1 — telefon numarası üst şeritte "+90 534 545 23" / "32" diye bölünebiliyor
   (yönetim çubuğu yer kapladığında görüldü). nowrap eksikti. */
.topbar a[href^="tel:"],.frow a[href^="tel:"]{white-space:nowrap}

/* D3 — sayfa mobilde 12.090 px, masaüstünde 5.919 px ölçüldü; ziyaretçi
   iletişim formuna ulaşmak için ~11 ekran kaydırıyor. Mobilde son makale
   listesi 6'ya iner (masaüstünde 12 kalır); bölüm sonundaki "Tüm Makaleleri
   Gör" bağlantısı zaten var.
   Sunucu tarafında `posts_per_page` ile değil CSS ile: sayfa LiteSpeed ile
   önbellekli, tek bir HTML her cihaza servis ediliyor — cihaza göre farklı
   sorgu çalıştırmak önbellekle çelişirdi. */
@media(max-width:760px){
  body.home .yazi-liste--3 > .yazi:nth-of-type(n+7){display:none}
}

/* B2 — tıkla-yükle harita (gerekçe front-page.php'deki blokta). */
.map .map-eylem{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:14px}
.map .map-dugme{display:inline-flex;align-items:center;justify-content:center;
  min-height:44px;padding:0 18px;border-radius:8px;font:inherit;font-size:.88rem;
  font-weight:600;cursor:pointer;border:1px solid var(--brand);
  background:var(--brand);color:#fff;transition:background-color .2s}
.map .map-dugme:hover{background:var(--brand-hover)}
.map .map-yol{background:transparent;color:var(--brand-deep)}
.map .map-yol:hover{background:rgba(var(--brand-rgb),.08);color:#fff}
.map .map-not{display:block;margin-top:10px;font-size:.74rem;line-height:1.5;opacity:.8}
.map.map--yuklu{padding:0;display:block}

/* =========================================================================
   SK ana sayfa duzeltmeleri — 15.08.2026 (kod parcacigi #37'nin kalici hali)
   Hukuki metin + KVKK + reklam yasagi + ctabar. Ayrintili gerekce parcacikta.
   ========================================================================= */

/* O2 — KVKK bilgilendirme blogu. Onay kutusundan acik riza beyani cikarildi;
   isleme KVKK m.5/2-(c),(e),(f)'e dayanir, m.6 uyarisi serbest metin alanini
   denetimsiz ozel nitelikli veriden korur. */
.kvkk-bilgi{margin:10px 0 14px;font-size:.78rem;line-height:1.6;opacity:.85}
.askcard .kvkk-bilgi{color:rgba(255,255,255,.82)}
.hform .kvkk-bilgi{color:rgba(255,255,255,.8)}

/* O4 — uzmanlik notu (TBB Reklam Yasagi Yonetmeligi m.7/d okuyucuya yonelik) */
.sk-uzmanlik-notu{margin:14px auto 0;max-width:760px;font-size:.82rem;
  line-height:1.65;opacity:.82;text-align:center}

/* E1 — .ctabar mobil icin tasarlandi ama masaustunde de tam genislikte
   ekranin altina yapisip alt bilgiyi ve formun son satirlarini ortuyordu.
   Masaustunde telefon/WhatsApp zaten ust seritte, sag sabit sutunda ve alt
   bilgide var. MOBIL DAVRANIS DEGISMEZ (yalniz >=1024 px hedefleniyor). */
@media(min-width:1024px){
  .ctabar{display:none!important}
  body{padding-bottom:0!important}
}

/* B9 — ust seritte hafta sonu saati; dar ekranda serit tasmasin diye gizlenir
   (alt bilgide gorunmeye devam eder). Hafta sonu bilgisi KALDIRILMADI. */
@media(max-width:1240px){.sk-saat-hafta{display:none}}

/* B10 — alt bilgi yasal baglantilari: tek tutarli ayrac ve stil. */
.fbot nav{gap:0 6px!important;align-items:center}
.fbot nav a{text-decoration:none!important;border-bottom:0!important}
.fbot nav a:hover,.fbot nav a:focus-visible{text-decoration:underline!important}
.fbot nav a + a::before{content:"·";display:inline-block;margin:0 10px 0 0;
  opacity:.5;pointer-events:none;font-weight:400}
@media(max-width:1140px){
  .fbot{flex-direction:column;align-items:flex-start;gap:10px}
  .fbot nav{justify-content:flex-start}
}

/* E4 — style.css `.yazi-liste--3{columns:3}` cok-sutun duzeni sutunlari
   YUKSEKLIGE gore dengeledigi icin 12 makale 5/4/3 dagiliyordu. Izgarada
   3/3/3/3 esit dagilir. Yalniz ana sayfa; arsivde cok-sutun korunur. */
@media(min-width:1141px){
  body.home .yazi-liste--3{columns:auto;display:grid;
    grid-template-columns:repeat(3,1fr);column-gap:40px;row-gap:4px;
    align-items:start}
}

/* 10 arac karti 3 sutunda 3+3+3+1 dagiliyor, son kart sola yapisik
   kaliyordu; artan tek kart orta sutuna alinir. */
@media(min-width:1024px){
  .rows > .row:last-child:nth-child(3n+1){grid-column:2}
}

/* ══════════ ANA SAYFA — BÜRO KÜNYESİ PORTRESİ (15.08.2026, v2.6.2) ══════════
   Ana sayfada hiç editoryal görsel yoktu. Portre, "Gebze'de Avukatlık ve
   Arabuluculuk" bölümündeki .kunye kutusunun EN ÜSTÜNE, başlıktan önce girer;
   iki sütunlu .about ızgarası değişmediği için masaüstü düzeni bozulmaz.
   Mobilde .about tek sütuna indiğinde portre künye kutusunun üstünde kalır. */
.kunye-portre{margin:0 0 20px;padding:0}
.kunye-portre img{display:block;width:100%;height:auto;
  aspect-ratio:4/3;object-fit:cover;object-position:center 20%;
  border-radius:var(--radius);border:1px solid var(--border);
  background:var(--surface-warm)}
.kunye-portre figcaption{margin-top:11px;font-family:var(--font-baslik);
  font-size:.98rem;font-weight:600;line-height:1.3;
  display:flex;flex-direction:column;gap:3px}
.kunye-portre figcaption span{font-family:inherit;font-size:.78rem;font-weight:400;
  color:var(--brand-deep)}
/* Dar ekranda tam genişlik portre fazla baskın kalıyor; ölçülü tutulur. */
@media(max-width:760px){
  .kunye-portre{max-width:300px;margin-left:auto;margin-right:auto}
  .kunye-portre figcaption{text-align:center;align-items:center}
}