/* =====================================================================
   BILGI YAZILARI — ortak bicem
   index.html'in tasarim dilini (V2) kullanir ama sadelestirilmistir:
   makale okunabilirligi oncelikli, dekoratif katman yok.
   Renk degiskenleri index.html ile BIREBIR ayni tutulmali.
   ===================================================================== */
:root{
  --kagit:#f6f8fa;
  --kat:#ffffff;
  --murekkep:#0c1a26;
  --gri:#404f5b;
  /* #7e8fa0 idi — WCAG AA (4,5:1) altinda kaliyordu, koyulastirildi */
  --soluk:#5f7282;
  --cizgi:#e2e8ee;
  --vurgu:#0e6a8f;
  --vurgu2:#0b7a88;
  --vurgu-metin:#fff;
  --glow:rgba(14,106,143,.20);
  /* WhatsApp yesili — TEMA BASINA AYRI. Klasik #25D366 acik zeminde
     1,86 kontrast veriyor, WCAG metin-disi esigi 3,0'in ALTINDA.
     Ayni ton (142°) korunup parlaklik dusuruldu. Olculdu; kontrast.py
     bu token'i da denetliyor. index.html'deki ikizle AYNI kalmali. */
  --wa:#1B9C4C;
  --uyari-zemin:#fff8ec;
  --uyari-cizgi:#e8c98a;
  --baslik:"Archivo","Segoe UI",system-ui,-apple-system,sans-serif;
  --metin:"IBM Plex Sans","Segoe UI",system-ui,-apple-system,sans-serif;
  --tek:"IBM Plex Mono",ui-monospace,"Cascadia Mono",Consolas,monospace;
}
@media (prefers-color-scheme: dark){
  :root{--kagit:#070d15;--kat:#0d1520;--murekkep:#ecf3f8;--gri:#9aacba;
        --soluk:#8296a8;--cizgi:#1d2937;--vurgu:#57c8ea;--vurgu2:#7ce0d3;
        --vurgu-metin:#03181f;--glow:rgba(87,200,234,.16);
        --wa:#25D366;
        --uyari-zemin:#1d1708;--uyari-cizgi:#6b5520}
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--kagit);color:var(--gri);
  font:16px/1.7 var(--metin);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
@media (prefers-color-scheme: dark){
  body{background:
    radial-gradient(900px 480px at 85% -80px, rgba(87,200,234,.07), transparent 60%),
    var(--kagit)}
}
a{color:inherit}
.ikon{flex:0 0 auto;stroke-width:2}
.ok-ici{vertical-align:-2px;margin-left:.25em;display:inline-block}
:focus-visible{outline:2px solid var(--vurgu);outline-offset:3px;border-radius:6px}
.sar{max-width:1060px;margin:0 auto;padding:0 30px}
@media (max-width:640px){.sar{padding:0 20px}}

/* --- ust serit --- */
.serit{position:sticky;top:0;z-index:30;
  background:color-mix(in srgb, var(--kagit) 80%, transparent);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border-bottom:1px solid var(--cizgi)}
.serit .sar{display:flex;align-items:center;justify-content:space-between;
  gap:16px;height:64px}
.marka{display:flex;align-items:center;gap:11px;text-decoration:none;min-height:44px}
.logo{display:block;height:34px;width:34px;object-fit:contain}
.marka-metin{display:flex;flex-direction:column;line-height:1.2}
.marka b{font-family:var(--baslik);font-size:16.5px;font-weight:800;
  color:var(--murekkep);letter-spacing:-.015em}
.marka span{font-family:var(--tek);font-size:10.5px;color:var(--soluk);
  letter-spacing:.14em;margin-top:4px}
.serit-tel{display:inline-flex;align-items:center;gap:9px;text-decoration:none;
  background:linear-gradient(135deg,var(--vurgu),var(--vurgu2));
  color:var(--vurgu-metin);font-weight:700;font-size:15px;padding:10px 18px;
  border-radius:999px;white-space:nowrap;
  box-shadow:0 12px 26px -16px var(--glow)}
@media (hover:hover){.serit-tel:hover{filter:brightness(1.06)}}
@media (max-width:520px){
  .serit-tel{font-size:0;gap:0;padding:9px 12px}
  .serit-tel::after{content:"Ara";font-size:12px;letter-spacing:0}
  /* ⚠️ 30 Eyl 2026: yabanci sayfalarda da "Ara" (Turkce) yaziyordu;
     orada numara isaretlemesinde simge yok. Yalniz telefon simgesi
     (maske; CSP img-src data: izinli). Erisilebilir ad numara olarak
     kalir. mobil-denetle bu kurali arar. */
  html:not([lang="tr"]) .serit-tel::after{content:"";width:17px;height:17px;
    background:currentColor;
    -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6.5 3h3l1.5 4-2 1.5a12 12 0 0 0 5.5 5.5L16 12l4 1.5v3a2 2 0 0 1-2.2 2A16.5 16.5 0 0 1 4 6.2 2 2 0 0 1 6 4V3Z'/%3E%3C/svg%3E") center/contain no-repeat;
    mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6.5 3h3l1.5 4-2 1.5a12 12 0 0 0 5.5 5.5L16 12l4 1.5v3a2 2 0 0 1-2.2 2A16.5 16.5 0 0 1 4 6.2 2 2 0 0 1 6 4V3Z'/%3E%3C/svg%3E") center/contain no-repeat}
  .serit-tel{min-width:64px;justify-content:center}
  .marka-metin{display:flex}
  .marka-metin>span{display:none}
}

/* --- sekmeler (ana sayfadakiyle ayni) ---
   Dar ekranda yatay kaydirilir; kaydirma cubugu gizli. Etkin sekme
   aria-current="page" (sayfa) veya "true" (bolum) ile isaretlenir. */
.menu{border-bottom:1px solid var(--cizgi);background:var(--kat)}
.menu .sar{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;
  -ms-overflow-style:none}
.menu .sar::-webkit-scrollbar{display:none}
.menu a{flex:0 0 auto;padding:13px 15px;text-decoration:none;
  font-size:14.5px;font-weight:500;color:var(--gri);white-space:nowrap;
  border-bottom:2px solid transparent}
@media (hover:hover){.menu a:hover{color:var(--vurgu)}}
.menu a:is([aria-current="page"],[aria-current="true"]){color:var(--vurgu);font-weight:600;
  border-bottom-color:var(--vurgu)}
@media (max-width:640px){.menu a{padding:12px 12px;font-size:14px}}

/* --- mobil hamburger menu (8 Agu 2026) ---------------------------
   Dar ekranda sekme seridi yatay kaydirmaliydi ve icerigin 328px'i
   gizli kaliyordu; kaydirinca satir bosaliyordu. Artik panel olarak
   aciliyor. Dil secicideki gibi `details` ogesiyle — JS yok.
   ⚠️ Acilma `:has()` ile; destegi yoksa hamburger gorunmez ve ESKI
   kaydirilabilir menu yerinde kalir (menusuz sayfa olusmaz). */
.menu-ac{display:none}
.menu-ac>summary{list-style:none;cursor:pointer;display:inline-flex;
  align-items:center;justify-content:center;width:40px;height:40px;
  border-radius:12px;border:1px solid var(--cizgi);background:var(--kat);
  color:var(--murekkep);flex:0 0 auto}
.menu-ac>summary::-webkit-details-marker{display:none}
.menu-ac>summary::marker{content:""}
.menu-ac[open]>summary{border-color:var(--vurgu);color:var(--vurgu)}

@media (max-width:640px){
  @supports selector(:has(*)){
    .menu-ac{display:block}
    .menu{display:none}
    /* ⚠️ 8 Agu 2026 — MENU YALNIZ SAYFANIN USTUNDEYKEN CALISIYORDU.
       `.serit` STICKY, `.menu` ise STATIC idi: baslik yukarida sabit
       kaliyor, panel sayfayla yukari kayiyordu. Menu aciliyordu ama
       ekranin disinda. Panel artik basligin altina sabitleniyor.
       ⚠️ `top:65px` = `.serit .sar{height:64px}` + 1px alt cizgi. */
    .serit:has(.menu-ac[open]) + .menu{display:block;
      position:fixed;left:0;right:0;top:65px;z-index:29;
      max-height:calc(100dvh - 65px);overflow-y:auto;
      box-shadow:0 18px 40px -22px rgba(0,0,0,.5)}
    .menu .sar{flex-direction:column;gap:0;overflow-x:visible}
    .menu a{padding:14px 2px;font-size:15.5px;
      border-bottom:1px solid var(--cizgi);border-left:2px solid transparent}
    .menu a:last-child{border-bottom:none}
    .menu a:is([aria-current="page"],[aria-current="true"]){border-bottom-color:var(--cizgi);
      border-left-color:var(--vurgu);padding-left:10px}
  }
  /* Serit tasmasi: numara giris bolumunde ve alt cubukta zaten var. */
  .serit-tel{font-size:0;gap:0;padding:9px 12px}
}

/* --- sayfa basi (hekimler / SSS / bilgi dizini) --- */
.sayfa-basi{padding:40px 0 6px}
.sayfa-basi h1{margin:0 0 14px;font-family:var(--baslik);color:var(--murekkep);
  font-weight:800;font-size:clamp(27px,4vw,40px);line-height:1.18;
  letter-spacing:-.03em;max-width:22ch}
.sayfa-basi .ozet{max-width:36rem}

/* --- hekim kartlari --- */
.hekimler{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:16px;padding:26px 0 8px}
.hekim{background:var(--kat);border:1px solid var(--cizgi);border-radius:16px;
  padding:22px 22px 20px;position:relative;box-shadow:var(--kart-golge);
  transition:transform 200ms cubic-bezier(.23,1,.32,1)}
.hekim-ad{display:flex;flex-direction:column;gap:5px;margin-bottom:12px}
.hekim-ad-baslik{margin:0;font-family:var(--baslik);font-size:19px;font-weight:800;
  color:var(--murekkep);letter-spacing:-.02em}
.hekim-unvan{font-family:var(--tek);font-size:11px;letter-spacing:.13em;
  color:var(--soluk);text-transform:uppercase}
.hekim p{margin:0 0 10px}
.hekim p:last-child{margin-bottom:0}

/* --- SSS --- */
.sss{display:flex;flex-direction:column;gap:10px;padding:24px 0 8px;
  max-width:74ch}
.sss-ogesi{background:var(--kat);border:1px solid var(--cizgi);
  border-radius:14px;overflow:hidden}
.sss-ogesi summary{cursor:pointer;padding:16px 20px;font-weight:600;
  color:var(--murekkep);list-style:none;display:flex;gap:12px;
  align-items:flex-start;justify-content:space-between}
.sss-ogesi summary::-webkit-details-marker{display:none}
.sss-ogesi summary::after{content:"+";font-family:var(--tek);font-size:19px;
  color:var(--vurgu);line-height:1;flex:0 0 auto}
.sss-ogesi[open] summary::after{content:"–"}
.sss-cevap{padding:0 20px 18px;max-width:66ch}
.sss-cevap p{margin:0 0 10px}
.sss-cevap p:last-child{margin-bottom:0}

/* --- bilgi yazisi dizini --- */
.dizin-yazi{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));
  gap:14px;padding:24px 0 8px}
.yazi-kart{display:flex;flex-direction:column;gap:8px;text-decoration:none;
  background:var(--kat);border:1px solid var(--cizgi);border-radius:16px;
  padding:20px;position:relative;box-shadow:var(--kart-golge);
  transition:transform 200ms cubic-bezier(.23,1,.32,1)}
.yazi-kart b{font-family:var(--baslik);font-size:17px;font-weight:800;
  color:var(--murekkep);letter-spacing:-.02em;line-height:1.3}
.yazi-kart span{font-size:14.5px;color:var(--gri);line-height:1.6}

/* --- makale --- */
.yazi-bilgi a{display:inline-flex;align-items:center;min-height:44px;min-width:44px;white-space:nowrap}
.yazi{padding:38px 0 10px}
.izlek{font:600 11px/1.7 var(--metin);letter-spacing:.12em;text-transform:uppercase;
  color:var(--soluk);margin:0 0 16px}
.izlek a{color:var(--soluk);text-decoration:none;display:inline-flex;align-items:center;min-height:44px;min-width:44px}
@media (hover:hover){.izlek a:hover{color:var(--vurgu)}}
.yazi h1{margin:0 0 14px;font-family:var(--baslik);color:var(--murekkep);
  font-weight:800;font-size:clamp(27px,4vw,40px);line-height:1.18;
  letter-spacing:-.03em;max-width:20ch}
.ozet{margin:0 0 8px;font-size:18px;line-height:1.65;color:var(--gri);
  max-width:36rem}
.yazi-bilgi{font-family:var(--tek);font-size:11px;letter-spacing:.1em;
  color:var(--soluk);border-top:1px solid var(--cizgi);
  padding-top:14px;margin-top:26px}

.govde{max-width:36rem;padding:26px 0 8px}
.govde h2{margin:38px 0 12px;font-family:var(--baslik);color:var(--murekkep);
  font-weight:800;font-size:clamp(20px,2.4vw,25px);letter-spacing:-.01em;
  line-height:1.3;position:relative;padding-bottom:12px}
.govde h2::after{content:"";position:absolute;left:0;bottom:0;width:38px;
  height:2px;border-radius:2px;background:linear-gradient(90deg,var(--vurgu),var(--vurgu2))}
.govde h3{margin:26px 0 8px;font-family:var(--baslik);color:var(--murekkep);
  font-weight:700;font-size:17.5px;letter-spacing:-.01em}
.govde p{margin:0 0 15px;font-size:16.5px;line-height:1.75}
.govde strong{color:var(--murekkep);font-weight:600}
.govde ul,.govde ol{margin:0 0 16px;padding-left:22px}
.govde li{margin-bottom:9px;font-size:16.5px;line-height:1.72}
.govde a{color:var(--vurgu);font-weight:600;text-decoration:underline;text-underline-offset:3px}
@media (hover:hover){.govde a:hover{text-decoration:underline;text-underline-offset:3px}}
/* 1 Eki 2026 (Sol 707): govde baglantisi cevresinden 600 agirlikla da
   ayrilir; KALIN metin icinde bu ipucu kaybolur, yalniz renk kalir
   (WCAG 1.4.1). Orada normal durumda da alt cizgi. */
.govde strong a,.govde b a{text-decoration:underline;text-underline-offset:3px}
/* 1 Eki 2026: hekim onayli temsili yazi gorseli. Boyut img width/height
   ozniteliginden gelir (yer ayrilir, kayma olmaz); yazi kolonunu asmaz. */
.yazi-gorsel{margin:22px 0 26px}
.yazi-gorsel img{display:block;width:100%;height:auto;border-radius:12px;
  background:var(--cizgi);outline:1px solid color-mix(in srgb,var(--murekkep) 12%,transparent);
  outline-offset:-1px}
@media (prefers-color-scheme:dark){
  .yazi-gorsel img{outline-color:color-mix(in srgb,var(--murekkep) 18%,transparent)}
}
.yazi-gorsel figcaption{margin-top:8px;font-size:13px;color:var(--gri)}
/* 1 Eki 2026 okunabilirlik olcumu: dizustu/masaustunde satir basina 87-93
   harf vardi (rahat aralik 45-75). Sutun 36rem + 18px -> 70-76. Alt oge
   secicisi (>) bilincli: .uyari/.cagri/.kaynaklar/.sss-cevap kutularinin
   kendi boylari korunur. Telefonda degisiklik yok. */
@media (min-width:1024px){.govde>p,.govde>ul>li,.govde>ol>li{font-size:18px}}
/* 11 sayfada izlek ve ozet .govde ICINDE; .govde p kurali onlari eziyordu
   (olculdu: izlek 16,5px kalin, ozet 18 yerine 16,5px). */
.govde .izlek{font:600 11px/1.7 var(--metin);letter-spacing:.12em;text-transform:uppercase;margin:0 0 16px}
.govde .izlek a{color:var(--soluk);font-weight:600}
.govde .ozet{font-size:18px;line-height:1.65;margin:0 0 8px}

/* adim listesi — acil yazilarda sirali islem */
.adimlar{list-style:none;padding:0;margin:0 0 18px;counter-reset:adim}
.adimlar li{counter-increment:adim;position:relative;padding-left:44px;
  margin-bottom:14px}
.adimlar li::before{content:counter(adim);position:absolute;left:0;top:1px;
  width:29px;height:29px;border-radius:50%;
  background:linear-gradient(135deg,var(--vurgu),var(--vurgu2));color:var(--vurgu-metin);
  font-family:var(--baslik);font-weight:800;font-size:14px;
  display:flex;align-items:center;justify-content:center}

/* uyari kutusu — "su durumda beklemeyin" */
.uyari{background:var(--uyari-zemin);border:1px solid var(--uyari-cizgi);
  border-radius:16px;padding:20px 22px;margin:24px 0}
.uyari b{display:block;color:var(--murekkep);font-family:var(--baslik);
  font-size:16px;margin-bottom:7px}
.uyari p{margin:0;font-size:15.5px;line-height:1.7}
.uyari ul{margin:9px 0 0;padding-left:20px}
.uyari li{font-size:15.5px;margin-bottom:6px}

/* cagri kutusu */
.cagri{border:1px solid var(--cizgi);border-radius:20px;background:var(--kat);
  padding:26px 28px;margin:34px 0 10px;
  box-shadow:0 24px 60px -48px var(--glow)}
.cagri h2{margin:0 0 8px;padding:0;font-family:var(--baslik);
  color:var(--murekkep);font-weight:800;font-size:21px;letter-spacing:-.01em}
.cagri h2::after{display:none}
.cagri p{margin:0 0 16px;font-size:16px}
.cagri.hekim-kutusu{padding:10px 14px;margin:16px 0;border-radius:12px;
  font-size:14px;line-height:1.5;overflow-wrap:anywhere;
  /* PREMIUM: sade zemin, 1px cizgi, cok acik STATIK golge */
  box-shadow:0 1px 2px rgba(12,26,38,.04)}
/* efekt 5: hekim gorseli eklenirse kutu icinde en fazla 1.015, 200 ms */
.hekim-gorsel{display:block;overflow:hidden;border-radius:12px}
.hekim-gorsel img{display:block;width:100%;height:auto;
  transition:transform 200ms cubic-bezier(.23,1,.32,1)}
@media (hover:hover){.hekim-gorsel:hover img{transform:scale(1.015)}}
.eylem{display:flex;flex-wrap:wrap;gap:11px}
.dugme{display:inline-flex;align-items:center;gap:9px;text-decoration:none;
  font-weight:700;font-size:15.5px;padding:12px 20px;border-radius:999px;
  border:1px solid var(--cizgi);color:var(--murekkep);background:var(--kagit)}
/* WhatsApp CTA: yesil degrade + beyaz ikon/metin; telefon duzeni korunur. */
.dugme[href*="wa.me"]{--wa-cta-koyu:#096b34;--wa-cta-orta:#0d793b;--wa-cta-parlak:#0f8542;
  color:#fff;border-color:rgba(37,211,102,.42);
  background:linear-gradient(135deg,var(--wa-cta-koyu),var(--wa-cta-orta) 58%,var(--wa-cta-parlak));
  box-shadow:0 14px 30px -18px rgba(37,211,102,.28),inset 0 1px 0 rgba(255,255,255,.18)}
@media (hover:hover){.dugme[href*="wa.me"]:hover{color:#fff;
  background:linear-gradient(135deg,#087137,#117f40 54%,#0f8241);
  border-color:rgba(37,211,102,.68);box-shadow:0 18px 34px -16px rgba(37,211,102,.28),
    inset 0 1px 0 rgba(255,255,255,.22)}}
.dugme[href*="wa.me"]:focus-visible{outline:3px solid #096b34;outline-offset:3px}
.dugme.birincil{background:linear-gradient(135deg,var(--vurgu),var(--vurgu2));
  color:var(--vurgu-metin);border-color:transparent;
  box-shadow:0 14px 30px -18px var(--glow)}
@media (hover:hover){.dugme:hover{filter:brightness(1.05)}}
.dugme:active{filter:brightness(.94)}
/* PREMIUM v2 efekt 5: Ara/WhatsApp basinca scale(.97), 100 ms; hover'da
   onceden cizili gradyan katmaninin opacity'si (200 ms) + ikon 2px kayar.
   isolation: z-index:-1 katman zeminin ustunde, yazinin altinda (kontrast
   olcumu icin yikama kaldirildi). 44px hedef ve odak halkasi degismez. */
.dugme{transition:transform 100ms cubic-bezier(.23,1,.32,1)}
.dugme:is([href^="tel:"],[href*="wa.me"]):active{transform:scale(.97)}
.dugme:is([href^="tel:"],[href*="wa.me"]){position:relative;isolation:isolate}
.dugme:is([href^="tel:"],[href*="wa.me"])::before{content:"";position:absolute;
  inset:0;z-index:-1;border-radius:inherit;pointer-events:none;
  background:none;
  opacity:0;transition:opacity 200ms cubic-bezier(.23,1,.32,1)}
.dugme:is([href^="tel:"],[href*="wa.me"])>.ikon{transition:transform 200ms cubic-bezier(.23,1,.32,1)}
@media (hover:hover){
  .dugme:is([href^="tel:"],[href*="wa.me"]):hover::before{opacity:1}
  .dugme:is([href^="tel:"],[href*="wa.me"]):hover>.ikon{transform:translateX(2px)}}

/* diger yazilar */
.diger{border-top:1px solid var(--cizgi);margin-top:40px;padding:30px 0 0}
.diger h2{margin:0 0 14px;font-family:var(--baslik);color:var(--murekkep);
  font-weight:800;font-size:19px;letter-spacing:-.01em}
.diger-dizi{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.diger-kart{display:block;text-decoration:none;border:1px solid var(--cizgi);
  border-radius:16px;background:var(--kat);padding:18px 20px;
  position:relative;box-shadow:var(--kart-golge);
  transition:transform 200ms cubic-bezier(.23,1,.32,1)}
/* PREMIUM v2 efekt 3: kart hover'da -3px. Yumusak golge + 1px vurgu
   cercevesi ONCEDEN cizili ::after katmani; yalniz opacity'si 200 ms'de
   acilir (box-shadow/border animasyonu yok). index.html ile ayni dil. */
.diger-kart::after,.yazi-kart::after,.hekim::after{content:"";position:absolute;inset:-1px;
  border:1px solid var(--vurgu);border-radius:inherit;pointer-events:none;
  box-shadow:0 18px 36px -20px rgba(12,26,38,.28),0 4px 10px -6px rgba(12,26,38,.10);
  opacity:0;transition:opacity 200ms cubic-bezier(.23,1,.32,1)}
@media (hover:hover){.diger-kart:hover,.yazi-kart:hover,.hekim:hover{transform:translateY(-3px)}
  .diger-kart:hover::after,.yazi-kart:hover::after,.hekim:hover::after{opacity:1}}
.diger-kart b{display:block;font-family:var(--baslik);color:var(--murekkep);
  font-size:15.5px;font-weight:700;line-height:1.35;letter-spacing:-.01em}
@media (max-width:820px){.diger-dizi{grid-template-columns:1fr}}

footer{border-top:1px solid var(--cizgi);padding:38px 0 46px;margin-top:44px}
footer .sar{display:flex;justify-content:space-between;gap:26px;flex-wrap:wrap}
footer p{margin:0;font-size:13.5px;line-height:1.7;color:var(--soluk);
  max-width:46ch}
footer b{color:var(--murekkep);font-weight:700;font-family:var(--baslik)}
footer a{color:var(--vurgu);text-decoration:none;display:inline-flex;align-items:center;min-height:44px;min-width:44px}

/* --- dil secici (3 Agu 2026) -----------------------------------
   ⚠️ DIS KAYNAK YOK: `<details>` ile calisiyor, JavaScript'e
   BAGIMLI DEGIL. Site gizlilik politikasinda "hicbir ucuncu taraf
   sunucusuna istek gonderilmez" sozu var; bir bayrak kutuphanesi ya
   da JS eklentisi o sozu bozardi. Bayraklar da emoji, dosya degil.
   Klavyeyle acilir, ekran okuyucuyla okunur. */
.dil-sec{position:relative;margin-left:10px}
.dil-sec>summary{list-style:none;cursor:pointer;display:inline-flex;
  align-items:center;gap:7px;padding:9px 13px;border-radius:999px;
  border:1px solid var(--cizgi);background:var(--kat);
  color:var(--gri);font:600 14px/1 var(--metin);white-space:nowrap}
.dil-sec>summary::-webkit-details-marker{display:none}
.dil-sec>summary::marker{content:""}
@media (hover:hover){.dil-sec>summary:hover{border-color:var(--vurgu);color:var(--vurgu)}}
.dil-sec[open]>summary{border-color:var(--vurgu);color:var(--vurgu)}
.dil-sec>summary .ok{font-size:10px;opacity:.7;transition:transform .15s}
.dil-sec>summary .dil-simdi{display:none}
.dil-sec[open]>summary .ok{transform:rotate(180deg)}
.dil-liste{position:absolute;right:0;top:calc(100% + 8px);z-index:40;
  min-width:172px;padding:6px;border-radius:14px;
  border:1px solid var(--cizgi);background:var(--kat);
  box-shadow:0 18px 40px -22px rgba(0,0,0,.55)}
.dil-liste a{display:flex;align-items:center;gap:9px;padding:9px 11px;min-height:44px;
  border-radius:7px;text-decoration:none;color:var(--gri);
  font:500 14px/1.2 var(--metin)}
@media (hover:hover){.dil-liste a:hover{background:var(--kagit);color:var(--vurgu)}}
.dil-liste a[aria-current="true"]{color:var(--vurgu);font-weight:700}
/* Bayrak emojisi yerine kod rozeti: Windows bolgesel-gosterge
   ciftlerini bayrak olarak cizmiyor, "TR"/"GB" harfleri
   gorunuyordu. Rozet her isletim sisteminde ayni. */
.dil-kod{display:inline-flex;align-items:center;justify-content:center;
  min-width:26px;padding:2px 5px;border-radius:5px;
  border:1px solid var(--cizgi);background:var(--kagit);
  font:700 10px/1.4 var(--metin);letter-spacing:.5px;opacity:.85}

@media (max-width:520px){
  .dil-sec>summary{padding:8px 11px;font-size:13px}
  .dil-sec>summary .dil-ad{display:none}
  .dil-sec>summary .dil-simdi{display:inline-flex}
  /* ⚠️ Marka metni seridin disina tasiyordu (olculdu: 78px icerik,
     64px serit). Alt satir gizleniyor, ad tek satira sabitleniyor,
     telefon dugmesi daraltiliyor ki ad bolunmesin. */
  .marka-metin>span{display:none}
  .marka b{white-space:nowrap;font-size:15px}
  .serit-tel{font-size:0;gap:0;padding:8px 12px}
}
/* ⚠️ 30 Eyl 2026 — 360px telefonda serit sigmiyordu, sayfa yatay
   kayiyordu (olculdu: ana sayfa 375, fr 392, de 380; TR ic sayfa 320px'te
   342). Kenar ve aralik bosluklari daraltiliyor; marka adi sigmazsa
   KESILMEZ, iki satira iner (alt satir <=520px'te gizli, 2x15px serite
   sigar). 360px'te TR/EN tek satir; es/fr/de/ru iki satir. "…" yalniz
   tek kelimesi sigmayan hal icin (320px'te de/ru).
   index.html'deki ikizle AYNI (mobil-denetle ORTAK). */
@media (max-width:400px){
  .serit .sar{gap:6px;padding:0 14px}
  .dil-sec{margin-left:0}
  .dil-sec>summary{padding:8px 8px}
  .marka{min-width:0;flex:0 1 auto}
  .marka-metin{min-width:0}
  .marka b{white-space:normal;text-wrap:balance;overflow:hidden;
    text-overflow:ellipsis}
}

/* --- ekrana yapisik "Ara + WhatsApp" cubugu (8 Agu 2026) ------------
   index.html disindaki 77 sayfaya yayildi. Acil hasta aramadan bir
   BILGI YAZISINA dusuyor; o sayfada da tek dokunusla ulasabilmeli.
   ⚠️ .dugme.ikincil burada tanimlaniyor — index.html kendi gomulu
   stilinde tanimliyordu ve bilgi.css'te YOKTU; olmadan WhatsApp
   dugmesi bicemsiz kalirdi. Isaretleme her sayfada ayni olsun diye
   kural buraya tasindi, isaretleme degil. */
.dugme.ikincil{border-color:var(--cizgi);color:var(--murekkep);
  background:var(--kat)}
/* WhatsApp ikonu markanin kendi yesili (hekim istedi: "goz asinaligi").
   Secici BAGLANTIYA bakiyor, sinifa degil — 77 sayfada HTML'e hic
   dokunmadan calisiyor. index.html'deki ikizle AYNI kalmali. */
.dugme[href*="wa.me"] .ikon{color:#096b34;background:#fff;border-radius:50%;padding:4px;box-sizing:content-box}
@media (hover:hover){.dugme.ikincil[href*="wa.me"]:hover{border-color:var(--wa)}}
.sabit{position:fixed;left:0;right:0;bottom:0;z-index:40;display:none;gap:8px;
  padding:9px 12px calc(9px + env(safe-area-inset-bottom));
  background:color-mix(in srgb, var(--kagit) 88%, transparent);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border-top:1px solid var(--cizgi);opacity:0;pointer-events:none;
  transform:translateY(calc(100% + env(safe-area-inset-bottom)));
  transition:opacity .18s cubic-bezier(.23,1,.32,1),transform .18s cubic-bezier(.23,1,.32,1)}
/* Uc dugme (Ara · WhatsApp · Yol tarifi, 30 Eyl 2026): simge ustte, yazi
   altta. Yatay dugmelerle 360px telefonda "WhatsApp" (~138px) ucte bire
   sigmiyordu; min-width:0 tasmayi keser. index.html'deki ikizle AYNI. */
.sabit .dugme{flex:1 1 0;min-width:0;flex-direction:column;
  justify-content:center;gap:3px;padding:8px 4px;font-size:13.5px;
  line-height:1.2;text-align:center;border-radius:16px}
.sabit.sabit-gorunur{opacity:1;pointer-events:auto;transform:translateY(0)}
@media (max-width:720px){
  .sabit{display:flex}
  body{padding-bottom:88px}
}

/* ================= ERISILEBILIRLIK (11 Agu 2026) =================
   `ui-ux-pro-max` skill'inin 99 UX kilavuzuna karsi olculdu; iki
   gercek acik cikti ve ikisi de burada kapaniyor.
   Olcum ve gerekce: hasta-mesajlari/UX-OLCUMU-10AGU.md               */

/* --- 1) Iceriğe atla ---------------------------------------------
   43 sayfanin SIFIRINDA yoktu. Klavyeyle ya da ekran okuyucuyla
   gezen biri her sayfada butun menuyu tek tek gecmek zorundaydi.
   Gorunmez durur, YALNIZCA odaklaninca belirir — yani fareyle
   gezen icin hicbir sey degismiyor.                                 */
.atla{
  position:absolute; left:-9999px; top:0;
  background:var(--vurgu,#0e6a8f); color:var(--vurgu-metin,#fff);
  padding:.7rem 1.1rem; border-radius:0 0 .5rem 0;
  font:600 1rem/1.2 var(--metin,system-ui,sans-serif);
  text-decoration:none; z-index:9999;
}
.atla:focus{ left:0; outline:3px solid var(--vurgu-metin,#fff); outline-offset:-6px; }

/* --- 2) Hareket hassasiyeti --------------------------------------
   Bu dosya 42 sayfada kullaniliyor ve animasyon/gecis kurallari
   tasiyor, ama `prefers-reduced-motion` korumasi YALNIZCA
   index.html'de vardi. Migren ve vestibuler duyarliligi olan bir
   hastada animasyon bas donmesi yapabilir; tarayici ayari var,
   42 sayfa onu dinlemiyordu.                                        */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation:none !important;
    transition:none !important;
    scroll-behavior:auto !important;
  }
  ::view-transition-group(*),::view-transition-old(*),
  ::view-transition-new(*){animation:none !important}
}

/* --- 3) PREMIUM HAREKET (Eki 2026, prototip) -----------------------
   Ilke: 100-200 ms, tavan 300 ms; ease-out; yalniz transform/opacity;
   hover yalniz (hover:hover); will-change kalici degil.
   efekt 7: ic baglanti alt cizgisi soldan acilir (Ara/WhatsApp haric).
   Yalniz TEK KUTULU (inline-flex) baglantilarda: satir kiran govde
   baglantisinda ::after yanlis parcaya oturur; onlarda kalici alt cizgi
   (WCAG 1.4.1) zaten var.                                            */
.izlek a,.yazi-bilgi a{position:relative}
.izlek a::after,.yazi-bilgi a::after{content:"";position:absolute;left:0;right:0;
  bottom:calc(50% - .85em);height:1px;background:currentColor;
  transform:scaleX(0);transform-origin:left;
  transition:transform 150ms cubic-bezier(.23,1,.32,1)}
@media (hover:hover){.izlek a:hover::after,.yazi-bilgi a:hover::after{transform:scaleX(1)}}
.izlek a:focus-visible::after,.yazi-bilgi a:focus-visible::after{transform:scaleX(1)}
/* efekt 8: sayfalar arasi 200 ms capraz gecis; destek yoksa sessizce yok */
:root{--kart-golge:0 1px 2px rgba(12,26,38,.04),0 8px 22px -16px rgba(12,26,38,.12)}
@media (prefers-reduced-motion: no-preference){
  @view-transition{navigation:auto}
  ::view-transition-old(root),::view-transition-new(root){
    animation-duration:200ms;animation-timing-function:cubic-bezier(.23,1,.32,1)}
}

/* ============ DOKUNMA HEDEFI TABANI (11 Agu 2026) ================
   `ui-ux-pro-max` Touch kilavuzu: en az 44x44px. Canli sitede 375px
   genislikte OLCULDU (gercek getBoundingClientRect):

     ana telefon / WhatsApp / randevu   335x59  ✅ zaten saglam
     menu dugmesi                        40x40  4px eksik
     ust serit telefon ikonu             43x37  7px eksik
     dil secici                          66x38  6px eksik
     menu ici baglantilar (x6)          172x38  6px eksik

   Asil eylem dugmeleri zaten yeterliydi; eksik olanlar IKINCIL
   gezinme ogeleri. Yine de kapatiliyor: gece agriyla, tek elle,
   titrek parmakla telefon kullanan hasta icin 6 piksel fark eder.

   ⚠️ Metin ICINDEKI baglantilar (paragraf/liste) BILEREK disarida —
   44px kurali onlari hedeflemez, satir yuksekligini bozmak metni
   okunmaz yapar. Bu bilinen bir istisna.                          */
/* ⚠️ `.menu-ac .menu-liste a` seciciyi ILK YAZIMDA buraya koydum ve
   HICBIR SEYLE ESLESMIYORDU: `menu-liste` diye bir sinif bu sitede yok,
   uydurmusum. Menu bagintilari `.serit + .menu` icinde ve tarayicida
   olculdu: 335x55 — zaten fazlasiyla yeterli, kural gerekmiyor. */
.serit-tel,
.menu-ac > summary,
.dil-sec > summary{
  min-height:44px;
  display:inline-flex;
  align-items:center;
}
/* Kare/dar ikon dugmeleri: yukseklik tuttu ama GENISLIK 40-43'te kaldi.
   Kilavuz iki boyutu da 44 istiyor. */
.menu-ac > summary{ min-width:44px; justify-content:center; }
.serit-tel{ min-width:44px; justify-content:center; }

/* Gorsel tasmasi korumasi (11 Agu 2026).
   Olculdu: bugun mobilde yatay tasma YOK (scrollWidth 375 = viewport),
   yani zarar veren bir durum degildi. Ama `img` icin hicbir olcek
   kurali yoktu; genis bir gorsel eklenirse sayfa yatay kayardi ve bu
   telefonda okumayi bozar. Tek satirlik koruma.                    */
img{max-width:100%;height:auto}

/* Kaynaklar — 19 Agu 2026. 35 bilgi yazisinin hicbirinde dis otorite
   bagi yoktu; YMYL saglik iceriginde kaynak gostermek E-E-A-T'nin
   temeli ve GEO'da alintilanma olasiligini artiran ikinci etken. */
.kaynaklar{margin:34px 0 0;padding:18px 20px;background:var(--kagit);
  border:1px solid var(--cizgi);border-radius:10px}
.kaynaklar p{margin:0 0 10px;font-size:14px;line-height:1.6;color:var(--gri)}
.kaynaklar ol{margin:0;padding-left:20px}
.kaynaklar li{margin-bottom:7px;font-size:14.5px;line-height:1.6;color:var(--gri)}
.kaynaklar li:last-child{margin-bottom:0}
.kaynaklar a{color:var(--vurgu);font-weight:600;text-decoration:underline;
  text-underline-offset:2px}

/* "Bu sayfada" atlama kutusu — bu-sayfada.py uretir (30 Eyl 2026, UX §B8a).
   Varsayilan KAPALI (details), JS yok. Dokunma alani >= 44px, klavye odagi
   gorunur. Yalniz .bu-sayfada altinda. */
.bu-sayfada{max-width:36rem;margin:16px 0 4px;border:1px solid var(--cizgi);
  border-radius:12px;background:var(--kat)}
.bu-sayfada>summary{list-style:none;cursor:pointer;display:flex;align-items:center;
  min-height:44px;padding:0 16px;font:600 15px/1.3 var(--metin);color:var(--murekkep)}
.bu-sayfada>summary::-webkit-details-marker{display:none}
.bu-sayfada>summary::marker{content:""}
.bu-sayfada>summary::after{content:"+";margin-left:auto;padding-left:12px;
  font-weight:700;color:var(--vurgu)}
.bu-sayfada[open]>summary::after{content:"\2212"}
.bu-sayfada>summary:focus-visible,.bu-sayfada a:focus-visible{
  outline:2px solid var(--vurgu);outline-offset:2px;border-radius:8px}
.bu-sayfada ol{margin:0;padding:0 16px 12px 38px}
.bu-sayfada li{margin:0;color:var(--soluk)}
.bu-sayfada a{display:flex;align-items:center;padding:9px 0;min-height:44px;color:var(--vurgu);
  text-decoration:none;line-height:1.35;overflow-wrap:anywhere}
@media (hover:hover){.bu-sayfada a:hover{text-decoration:underline}}
/* Yapiskan ust serit (.serit, ~65px) atlama hedefini ortmesin: olculdu 30 Eyl,
   375px'te hedef H2 ust=0 (seridin altinda) idi. */
.yazi h2[id]{scroll-margin-top:84px}
/* SSS derin baglantisi (#soru-...) de ayni seridin altinda kalmasin. 2 Eki 2026 */
.sss-ogesi[id]{scroll-margin-top:84px}

/* CILA v3: mevcut baslik ailesi, sade yuzeyler ve ayni okuma ekseni. */
.govde h2,.diger h2,.cagri h2{font-weight:700;line-height:1.3}
.govde h2::after{background:var(--vurgu)}
.cagri,.cagri.hekim-kutusu,.yazi-kart,.diger-kart,.hekim{box-shadow:none}
.cagri{border-radius:16px}
.diger-kart::after,.yazi-kart::after,.hekim::after{
  box-shadow:0 6px 16px -10px rgba(12,26,38,.18)}
.dugme.birincil{background:var(--vurgu);box-shadow:none}
.sabit{background:var(--kat);backdrop-filter:none;-webkit-backdrop-filter:none}
/* Yalniz implant makalesi: giris/ozet/hekim/gorsel 36rem sol ekseninde. */
.yazi:has(#implant-tam-olarak-nedir){max-width:36rem}
.yazi:has(#implant-tam-olarak-nedir) .hekim-kutusu{padding-left:0;padding-right:0;
  border-left:0;border-right:0;border-radius:0;background:none}
.yazi:has(#implant-tam-olarak-nedir) .yazi-gorsel img{border-radius:16px}
.yazi:has(#implant-tam-olarak-nedir) ol.adimlar{padding-left:0}
.yazi:has(#implant-tam-olarak-nedir) .adimlar li{padding-left:44px;margin-bottom:24px}
.yazi:has(#implant-tam-olarak-nedir) .adimlar li::before{background:var(--vurgu);z-index:1}
.yazi:has(#implant-tam-olarak-nedir) .adimlar li:not(:last-child)::after{
  content:"";position:absolute;left:14px;top:30px;bottom:-24px;
  width:1px;background:var(--cizgi)}
@media (hover:hover) and (pointer:coarse){
  .yazi-kart:hover,.diger-kart:hover,.hekim:hover,.hekim-gorsel:hover img{transform:none}
}
@media (prefers-reduced-motion:reduce){
  .dugme:active,.dugme:hover>.ikon,.yazi-kart:hover,.diger-kart:hover,
  .hekim:hover,.hekim-gorsel:hover img{transform:none!important}
}