/* ===== Inline source links (shared pattern with curvature / implant pages) ===== */
.ref-src{display:inline;font-family:var(--font-sans);font-size:.72em;line-height:1;white-space:normal;margin:0 .35em 0 .3em}
.ref-src a{display:inline-block;color:var(--c-primary-700);font-weight:500;text-decoration:none;border-bottom:1px dotted currentColor;white-space:nowrap;transition:color .15s,border-color .15s}
.ref-src a::before{content:"\2197";font-size:.85em;margin-right:2px;opacity:.7}
.ref-src a:hover{color:var(--c-primary-950);border-bottom-color:var(--c-primary-950)}
.ref-src a:focus-visible{outline:2px solid var(--c-primary-700);outline-offset:2px;border-radius:2px}

/* ===== Direct quotation from a cited source ===== */
.ev-quote{margin:28px 0;padding:22px 26px;background:var(--c-bg-alt);border-left:3px solid var(--c-primary-600);border-radius:0 var(--radius) var(--radius) 0}
.ev-quote p{margin:0;font-family:var(--font-display);font-size:21px;line-height:1.5;color:var(--c-primary-950);font-style:italic}
.ev-quote p+p{margin-top:12px}
.ev-quote cite{display:block;margin-top:14px;font-family:var(--font-sans);font-size:11.5px;font-style:normal;letter-spacing:.11em;text-transform:uppercase;color:var(--c-text-muted);line-height:1.6}
.ev-quote cite a{color:var(--c-primary-700);text-decoration:none;border-bottom:1px dotted currentColor;transition:color .15s}
.ev-quote cite a:hover{color:var(--c-primary-950);border-bottom-color:var(--c-primary-950)}
.ev-quote cite a:focus-visible{outline:2px solid var(--c-primary-700);outline-offset:2px;border-radius:2px}
@media (max-width:640px){.ev-quote{padding:18px 20px}.ev-quote p{font-size:19px}}

/* ===== Key figures band ===== */
.ev-band{padding:72px 0;background:var(--c-bg-alt);border-top:1px solid var(--c-line);border-bottom:1px solid var(--c-line)}
.ev-figs{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:8px}
.ev-fig{background:var(--c-bg);border:1px solid var(--c-line);border-radius:var(--radius);padding:26px 22px;display:flex;flex-direction:column;gap:10px}
.ev-fig-num{font-family:var(--font-display);font-size:42px;font-weight:500;line-height:1;color:var(--c-primary-700)}
.ev-fig-label{font-size:14px;line-height:1.6;color:var(--c-text-soft);margin:0}
.ev-fig-src{margin:auto 0 0;padding-top:14px;border-top:1px solid var(--c-line);font-size:11px;letter-spacing:.09em;text-transform:uppercase;line-height:1.6}
.ev-fig-src a{color:var(--c-primary-700);font-weight:500;text-decoration:none;border-bottom:1px dotted currentColor;transition:color .15s}
.ev-fig-src a:hover{color:var(--c-primary-950);border-bottom-color:var(--c-primary-950)}
.ev-fig-src a:focus-visible{outline:2px solid var(--c-primary-700);outline-offset:2px;border-radius:2px}
.ev-band-note{max-width:820px;margin:34px auto 0;text-align:center;font-size:14px;line-height:1.7;color:var(--c-text-muted)}
@media (max-width:1024px){.ev-figs{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.ev-band{padding:56px 0}.ev-figs{grid-template-columns:1fr}.ev-fig-num{font-size:36px}}

/* ===== Overview: gorsel sag ustte, metin altindan devam ediyor =====
   Global .svc-two-col iki sutunlu bir grid ve align-items:center kullaniyor.
   Bu sayfada metin sutunu cok uzun oldugu icin gorselin altinda buyuk bir
   bosluk kaliyordu. Grid yerine float kullaniyoruz: metin gorselin yanindan
   baslayip altindan devam ediyor.
   NOT: styles.min.css bu dosyadan SONRA yuklendigi icin tek sinifli
   .svc-two-col yetmiyor; ozgullugu yukseltmek zorunlu. */
/* Bolum kenarlari yukaridaki sectionlarla ayni hizada (tam .container genisligi):
   sol kenari metin, sag kenari float eden gorsel belirliyor. Metin bloklarina
   genislik siniri koymuyoruz; boylece satirlar gorselin yanindan baslayip
   gorsel bittikten sonra altindaki bosluga da akiyor. */
.svc-section .svc-two-col{display:block}
.svc-section .svc-two-col::after{content:"";display:table;clear:both}
/* margin-bottom YOK: 28px lik alt bosluk, gorselin hemen altindaki paragrafin
   ilk satir kutusunu float alanina sokup satiri kisa kesiyordu (tirtikli basamak).
   Gorsel ile alttaki metnin arasindaki bosluk paragrafin kendi margin ile geliyor. */
.svc-section .svc-two-col .svc-image{float:right;width:508px;margin:0 0 0 40px}

@media (max-width:1060px){
  /* Daralan kapsayicida 508px lik gorsel yanindaki sutunu bogazliyor. */
  .svc-section .svc-two-col .svc-image{width:419px;margin-left:32px}
}
/* NOT: .ev-quote / .svc-implant-list e BFC (flow-root) VERILMIYOR. Bir BFC koku
   float un yanina hic tasmaz, float un altindaki bosluga da girmez; kutu float
   bitene kadar daraltilir ya da asagi itilir. Bu bloklarin da bosluga akmasi
   gerektigi icin normal blok akisinda kaliyorlar. */

/* Global .svc-implant-list li bir flex container: <strong>etiket:</strong> ile
   ardindaki metin iki ayri flex item olup yan yana iki kolona bolunuyor. Buradaki
   maddeler etiket + aciklama oldugu icin akan tek bir paragraf olmalari gerekiyor;
   madde isaretini absolute konumlandirip li yi normal bloga ceviriyoruz. */
.svc-section .svc-two-col .svc-text .svc-implant-list li{display:block;position:relative;padding-left:18px;line-height:1.65}
.svc-section .svc-two-col .svc-text .svc-implant-list li::before{position:absolute;left:0;top:.6em}
.svc-section .svc-two-col .svc-text .svc-implant-list li strong{color:var(--c-primary-950)}

@media (max-width:760px){
  /* Kaynak sirasi gorsel-once oldugu icin mobilde order ile metni one aliyoruz,
     boylece onceki dizilim (metin, sonra gorsel) korunuyor. */
  .svc-section .svc-two-col{display:flex;flex-direction:column;gap:36px}
  .svc-section .svc-two-col .svc-text{order:1}
  .svc-section .svc-two-col .svc-image{order:2;float:none;width:100%;margin:0}
}

/* ===== Tedavi sekmeleri: gorsel sag ustte float, metin altina akiyor =====
   Global .itype-panel bir grid (1fr 420px) ve gorsel sutunu sticky. Metin sutunu
   cok uzun oldugu icin gorselin altinda genis bir bosluk kaliyordu. Overview ile
   ayni yaklasim: grid yerine float, metin gorselin yanindan baslayip altindaki
   bosluga da akiyor.
   NOT: styles.min.css bu dosyadan SONRA yuklendigi icin tek sinifli
   .itype-panel--active / .itype-panel-img yetmiyor; .itype-panels ile ozgullugu
   yukseltmek zorunlu. Kaynak sirasi gorsel-once oldugu icin float:right
   kendisinden sonraki metni sariyor. */
.itype-panels .itype-panel--active{display:block}
.itype-panels .itype-panel--active::after{content:"";display:table;clear:both}
.itype-panels .itype-panel-img{float:right;width:420px;margin:0 0 0 48px;position:static}

@media (max-width:1100px){
  .itype-panels .itype-panel-img{width:340px;margin-left:36px}
}
@media (max-width:760px){
  /* Mobilde tekrar yigin: metin once, gorsel sonra (onceki dizilim). */
  .itype-panels .itype-panel--active{display:flex;flex-direction:column;gap:28px}
  .itype-panels .itype-panel-body{order:1}
  .itype-panels .itype-panel-img{order:2;float:none;width:100%;margin:0}
}

/* Arka planli / cerceveli / kaydirilabilir bloklar:
   - flow-root: float un altina arka plan tasmasini engelliyor.
   - clear:right: BFC olduklari icin float un yanina denk geldiklerinde daraltilip
     duruyorlardi (or. gorselin son 14px ine denk gelen alinti 1232 yerine 764px
     cikiyordu, sebepsiz daralmis bir kutu gibi gorunuyordu). clear ile float un
     hemen altina inip tam genisligi aliyorlar. Metin akisi etkilenmiyor;
     paragraflar gorselin yanini ve altini normal sekilde doldurmaya devam ediyor. */
.itype-panels .ev-quote,
.itype-panels .ev-note,
.itype-panels .ev-table-wrap{display:flow-root;clear:right}

/* ===== Guideline status callout ===== */
.ev-note{margin:26px 0;padding:20px 22px;background:var(--c-bg);border:1px solid var(--c-line);border-left:3px solid var(--c-primary-300);border-radius:0 var(--radius) var(--radius) 0}
.ev-note p{margin:0;font-size:14.5px;line-height:1.7;color:var(--c-text-soft)}
.ev-note p+p{margin-top:10px}
.ev-note strong{color:var(--c-primary-950)}
.ev-note-label{display:block;margin-bottom:8px;font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--c-primary-700)}

/* ===== Evidence table inside treatment panels =====
   min-width:0, panel grid duzeninden kalan koruma: bir grid/flex ogesinin
   varsayilan min-width:auto degeri genis bir tabloyu kapsayicinin disina tasirip
   sayfanin overflow-x:hidden i tarafindan kirpilmasina yol aciyor. Panel artik
   blok akisinda ama mobil yigin (flex) icin gecerliligini koruyor. */
.itype-panel-body{min-width:0}
.ev-table-wrap{overflow-x:auto;max-width:100%;margin:22px 0}
.ev-table{width:100%;border-collapse:collapse;font-size:14.5px;min-width:340px}
.ev-table caption{caption-side:top;text-align:left;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--c-text-muted);padding-bottom:10px}
.ev-table th,.ev-table td{padding:11px 14px;text-align:left;border-bottom:1px solid var(--c-line);line-height:1.55}
.ev-table thead th{font-size:11.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--c-primary-950);font-weight:600;border-bottom:1px solid var(--c-primary-300)}
.ev-table tbody tr:last-child th,.ev-table tbody tr:last-child td{border-bottom:0}
.ev-table tbody th{font-weight:600;color:var(--c-primary-950)}
.ev-table td{color:var(--c-text-soft)}
.ev-table .ev-table-num{font-variant-numeric:tabular-nums;white-space:nowrap}

/* ===== FAQ ile ustteki bolum arasindaki bosluk =====
   Global .svc-section her iki yona var(--space-section) (1440px te 140px) veriyor.
   "Why Istanbul" bolumu --top-half oldugu icin ustu yariya iniyor ama alti 140px
   kaliyor; FAQ in ustu de 140px. Toplam 280px, sayfadaki en genis bolum arasi
   gecis (diger gecisler 140-210px). Iki tarafi da .35 ile carpip 98px e cekiyoruz
   (1440px te 49 + 49). Deger --space-section e bagli oldugu icin kucuk ekranlarda
   clamp ile birlikte orantili kuculuyor.
   NOT: styles.min.css sonra yuklendigi ve .svc-section{padding:...} kisayolu
   padding-bottom u da yazdigi icin iki sinifli seciciyle ozgulluk yukseltiliyor. */
.svc-section.svc-section--top-half{padding-bottom:calc(var(--space-section) * .35)}
.svc-section.svc-faq-section{padding-top:calc(var(--space-section) * .35)}

/* ===== Satir ici alinti (<q class="ev-q">) =====
   Kilavuz ve tanim metinlerinden birebir alintilar paragraf icinde duz metin
   gibi duruyordu. Semantik <q> ile isaretlenip gorsel olarak ayriliyor.
   Tirnak isaretlerini CSS koyuyor (markup ta &ldquo;/&rdquo; birakilmadi), boylece
   ac/kapa glifleri her yerde ayni ve alintinin kapsami tek yerden yonetiliyor.
   Neden italik + 500: sayfada <em> dergi adlari icin kullaniliyor (normal
   kalinlik, soft renk) ve noktali alt cizgi .ref-src linklerinin isareti; ikisiyle
   karismamasi icin alintiya ek olarak agirlik ve koyu renk veriliyor, tirnaklar
   da vurgu renginde. */
.ev-q{font-style:italic;font-weight:500;color:var(--c-primary-950);quotes:none}
.ev-q::before,.ev-q::after{font-style:normal;font-weight:600;color:var(--c-primary-600)}
.ev-q::before{content:"\201C"}
.ev-q::after{content:"\201D"}
