/* =================================================================
   DESTEK & İNDİRMELER (destek/indirmeler.html, egitimler.html, wiki.html — 2026-10-29)
   Resmî XGRIDS destek merkezinin üç sekmesi; içerik xgrids/tools/destek/cek.js ile çekilir.
   Kırıntı ve talep bandı urun.css'ten, talep vitrini urunler.css'ten. Ölçüler rem (bkz. CLAUDE.md "Ölçekleme").
   ================================================================= */

/* ---------- Hero: koyu zemin, kenarda mavi ışık, ince tarama ızgarası; altta üç sekme (wiki bölüm sayfası .whero aynı zemin) ---------- */
.dhero, .whero {
  position: relative; isolation: isolate; overflow: hidden; color: #fff;
  background:
    radial-gradient(ellipse 55% 85% at 88% 0%, rgba(var(--xg-rgb), .34), rgba(var(--xg-rgb), 0) 70%),
    radial-gradient(ellipse 75% 16rem at 50% 100%, rgba(var(--xg-rgb), .2), rgba(var(--xg-rgb), 0) 72%),
    var(--ink);
}
.dhero::before, .whero::before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background-image: linear-gradient(rgba(255, 255, 255, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .045) 1px, transparent 1px);
  background-size: 4rem 4rem;
  -webkit-mask-image: radial-gradient(ellipse 70% 90% at 75% 20%, #000 0%, transparent 75%);
  mask-image: radial-gradient(ellipse 70% 90% at 75% 20%, #000 0%, transparent 75%);
}
.dhero__ic { padding-block: 3.5rem 3.25rem; }
.dhero__baslik { display: flex; flex-direction: column; font-family: var(--font-baslik); font-weight: 800; text-transform: uppercase; }
.dhero__baslik > span:first-child { font-size: 5rem; line-height: .95; }
.dhero__slogan { margin-top: 0.75rem; font-size: 2.25rem; font-weight: 700; line-height: 1.05; color: var(--xg-acik); }
.dhero__metin { max-width: 46rem; margin-top: 1.25rem; font-size: var(--fs-lg); line-height: 1.6; color: rgba(255, 255, 255, .84); }
.dhero .kirinti[data-belir] { --sira: 0; }
.dhero__baslik[data-belir] { --sira: 1; }
.dhero__metin[data-belir] { --sira: 2; }
.dhero__metin .atlihan, .sayfa-destek .utalep__giris .atlihan { white-space: nowrap; }

.dsekmeler { border-top: 1px solid rgba(255, 255, 255, .12); background: rgba(var(--ink-rgb), .45); }
.dsekmeler__liste { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.dsekme {
  position: relative; display: flex; align-items: center; gap: 1rem; height: 100%; padding: 1.375rem 1.5rem 1.5rem;
  color: rgba(255, 255, 255, .72); transition: color .2s, background-color .2s;
}
.dsekmeler__liste li + li .dsekme { border-left: 1px solid rgba(255, 255, 255, .12); }
.dsekme::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 0.1875rem; background: var(--xg); transform: scaleX(0); transition: transform .25s var(--ease); }
.dsekme:hover { color: #fff; background: rgba(255, 255, 255, .04); }
.dsekme[aria-current="page"] { color: #fff; background: rgba(var(--xg-rgb), .14); }
.dsekme[aria-current="page"]::after, .dsekme:hover::after { transform: scaleX(1); }
.dsekme__ikon { flex: none; width: 2.75rem; height: 2.75rem; padding: 0.6875rem; border-radius: 50%; color: var(--xg-acik); background: rgba(var(--xg-rgb), .16); }
.dsekme[aria-current="page"] .dsekme__ikon { color: #fff; background: var(--xg); }
.dsekme__metin { display: flex; flex-direction: column; min-width: 0; }
.dsekme__ad { font-family: var(--font-baslik); font-size: 1.5rem; font-weight: 700; letter-spacing: .03em; line-height: 1.1; text-transform: uppercase; }
.dsekme small { margin-top: 0.25rem; font-size: var(--fs-sm); color: var(--koyu-soluk); }

/* ---------- Gövde: solda yapışkan ürün seçimi, sağda ürün paneli ---------- */
.destek { padding-block: 4rem var(--bolum-y); background: var(--kagit-2); }
.destek__izgara { display: grid; grid-template-columns: 19rem minmax(0, 1fr); gap: 2.5rem; align-items: start; }

.dsecim { position: sticky; top: calc(var(--ust-h) + 1.5rem); padding: 1.25rem 0.75rem; background: var(--kagit); border: 1px solid var(--cizgi); border-radius: var(--yaricap); }
.dsecim__ac { display: none; }
.dsecim__grup + .dsecim__grup { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--cizgi); }
.dsecim__baslik { margin: 0 0 0.375rem 0.75rem; font-family: var(--font-baslik); font-size: var(--fs-xs); font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--soluk); }
.dsecim__liste a {
  position: relative; display: flex; align-items: baseline; justify-content: space-between; gap: 0.75rem;
  padding: 0.5rem 0.75rem; border-radius: 0.375rem; font-weight: 600; line-height: 1.3; color: var(--metin);
  transition: background-color .15s, color .15s;
}
.dsecim__liste small { flex: none; font-size: var(--fs-xs); font-weight: 500; color: var(--soluk); }
.dsecim__liste a:hover { background: var(--kagit-2); color: var(--xg); }
.dsecim__liste a[aria-current="true"] { background: var(--xg-50); color: var(--xg-koyu); }
.dsecim__liste a[aria-current="true"]::before { content: ""; position: absolute; left: 0; top: 0.375rem; bottom: 0.375rem; width: 0.1875rem; border-radius: 2px; background: var(--xg); }
.dsecim__liste a[aria-current="true"] small { color: var(--xg); }

.destek__icerik { display: flex; flex-direction: column; gap: 1.5rem; min-width: 0; }
.destek__not { display: flex; align-items: flex-start; gap: 0.75rem; padding: 0.875rem 1.25rem; font-size: var(--fs-sm); line-height: 1.5; color: var(--soluk); background: var(--kagit); border: 1px solid var(--cizgi); border-left: 0.1875rem solid var(--xg); border-radius: var(--yaricap); }
.destek__not .ikon, .dbilgi .ikon { flex: none; width: 1.25rem; height: 1.25rem; margin-top: 0.0625rem; color: var(--xg); }
.destek__kaynak { font-size: var(--fs-xs); color: var(--soluk); }
.destek__kaynak a { text-decoration: underline; text-underline-offset: 0.1875rem; }
.destek__kaynak a:hover { color: var(--xg); }
/* JS açıkken yalnız seçili ürün paneli görünür; JS yokken paneller alt alta */
.js [data-destek] .durun:not(.is-etkin) { display: none; }

/* ---------- Ürün paneli ---------- */
.durun { scroll-margin-top: calc(var(--ust-h) + 1.5rem); padding: 2.5rem; background: var(--kagit); border: 1px solid var(--cizgi); border-radius: var(--yaricap); }
.durun + .durun { margin-top: 0; }
.durun__bas { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 1rem 2.5rem; align-items: end; padding-bottom: 2rem; border-bottom: 1px solid var(--cizgi); }
.durun__kat { font-family: var(--font-baslik); font-size: var(--fs-xs); font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--xg); }
.durun__ad { margin-top: 0.25rem; font-family: var(--font-baslik); font-size: 3rem; font-weight: 800; line-height: 1; text-transform: uppercase; color: var(--ink); }
.durun__giris { max-width: 52rem; margin-top: 0.875rem; line-height: 1.6; color: var(--soluk); }
.durun__baglanti { display: flex; flex-direction: column; align-items: flex-end; gap: 0.625rem; }
.durun__baglanti .ok-link { font-size: var(--fs-sm); }
.ok-link--soluk { color: var(--soluk); }
.ok-link--soluk:hover { color: var(--xg); }
.ok-link--soluk:hover .ikon { transform: translate(0.125rem, -0.125rem); }

.dbolum { margin-top: 2.5rem; }
.dbolum__baslik { margin-bottom: 1rem; font-family: var(--font-baslik); font-size: var(--fs-sm); font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--ink); }

/* Boş durum: bu sekmede içerik yok → diğer sekmelere geçiş */
.dbos { margin-top: 2rem; padding: 2.5rem; text-align: center; color: var(--soluk); background: var(--kagit-2); border: 1px dashed var(--cizgi); border-radius: var(--yaricap); }
.dbos__baglanti { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.75rem 2rem; margin-top: 1.25rem; }
.dbos__baglanti .ok-link { font-size: var(--fs-sm); }

/* ---------- İndirmeler: güncel sürüm kartı ---------- */
.dsurum { margin-top: 2rem; padding: 2rem; border: 1px solid var(--cizgi); border-radius: var(--yaricap); background: linear-gradient(180deg, var(--xg-50), rgba(238, 242, 255, 0) 9rem), var(--kagit); }
.dsurum__bas { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 1.25rem; }
.dsurum__rozet { padding: 0.25rem 0.75rem; border-radius: 2rem; font-family: var(--font-baslik); font-size: var(--fs-xs); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #fff; background: var(--xg); }
.dsurum__no { font-family: var(--font-baslik); font-size: 2.5rem; font-weight: 800; line-height: 1; color: var(--ink); }
.dsurum__tarih { font-size: var(--fs-sm); color: var(--soluk); }
.dbilgi { display: flex; align-items: flex-start; gap: 0.625rem; margin-top: 1.25rem; font-size: var(--fs-sm); line-height: 1.5; color: var(--metin); }
.dmotor { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; margin-top: 1rem; font-size: var(--fs-sm); color: var(--soluk); }
.dmotor > span:first-child { margin-right: 0.25rem; }
.dmotor__etiket { padding: 0.125rem 0.625rem; border: 1px solid var(--cizgi); border-radius: 2rem; font-weight: 600; color: var(--metin); background: var(--kagit); }

.ddosyalar { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.75rem; margin-top: 1.5rem; }
.ddosyalar:has(> li:only-child) { grid-template-columns: minmax(0, 1fr); }
.ddosya { display: flex; align-items: center; gap: 1rem; padding: 1rem 1.25rem; background: var(--kagit); border: 1px solid var(--cizgi); border-radius: var(--yaricap); }
.ddosya__ikon { display: flex; flex: none; align-items: center; justify-content: center; width: 3rem; height: 3rem; border-radius: 0.5rem; color: var(--xg); background: var(--xg-50); }
.ddosya__ikon .ikon { width: 1.5rem; height: 1.5rem; }
.ddosya__metin { display: flex; flex: 1; flex-direction: column; min-width: 0; }
.ddosya__ad { font-family: var(--font-baslik); font-size: 1.375rem; font-weight: 700; line-height: 1.15; color: var(--ink); }
.ddosya small { margin-top: 0.125rem; font-size: var(--fs-sm); color: var(--soluk); }
.ddosya .dugme { flex: none; gap: 0.5rem; }
.ddosya .dugme .ikon { width: 1.125rem; height: 1.125rem; }
.ddosya .dugme:hover .ikon { transform: none; }

.duygulama { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.75rem; margin-top: 1rem; font-size: var(--fs-sm); color: var(--soluk); }
.duygulama .ikon { width: 1.125rem; height: 1.125rem; color: var(--xg); }
.duygulama a { font-weight: 700; color: var(--xg); text-decoration: underline; text-underline-offset: 0.1875rem; }
.duygulama a:hover { color: var(--xg-koyu); }

.dsurum__notlar { margin-top: 2rem; padding-top: 1.75rem; border-top: 1px solid var(--cizgi); }

/* Sürüm notları: numaralı madde, tireli madde, ara başlık, paragraf */
.dnot { display: flex; flex-direction: column; gap: 0.625rem; font-size: var(--fs-base); line-height: 1.6; color: var(--metin); }
.dnot ul { display: flex; flex-direction: column; gap: 0.5rem; }
.dnot li { display: flex; gap: 0.75rem; }
.dnot__no { flex: none; display: inline-flex; align-items: center; justify-content: center; min-width: 1.625rem; height: 1.625rem; margin-top: 0.0625rem; border-radius: 50%; font-family: var(--font-baslik); font-size: var(--fs-sm); font-weight: 700; color: var(--xg); background: var(--xg-50); }
.dnot__tire::before { content: ""; flex: none; width: 0.375rem; height: 0.375rem; margin: 0.625rem 0.5rem 0 0.625rem; border-radius: 50%; background: var(--xg); }
.dnot__ara { margin-top: 0.5rem; font-family: var(--font-baslik); font-size: 1.125rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--ink); }
.dnot__ara:first-child { margin-top: 0; }
.dnot a { color: var(--xg); text-decoration: underline; text-underline-offset: 0.1875rem; word-break: break-all; }

.duyari { margin-top: 1.5rem; padding: 1.25rem 1.5rem; background: var(--kagit-2); border: 1px solid var(--cizgi); border-left: 0.1875rem solid var(--xg); border-radius: var(--yaricap); }
.duyari__baslik { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.75rem; font-family: var(--font-baslik); font-size: 1.125rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--ink); }
.duyari__baslik .ikon { width: 1.25rem; height: 1.25rem; color: var(--xg); }
.duyari .dnot { font-size: var(--fs-sm); }
.duyari .dnot__no { background: var(--kagit); }

/* Sistem gereksinimleri: temel ve önerilen yan yana, eşit yükseklik */
.dgerek { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.dgerek__sutun { padding: 1.25rem 1.5rem; border: 1px solid var(--cizgi); border-radius: var(--yaricap); }
.dgerek__sutun:only-child { grid-column: 1 / -1; }
.dgerek__baslik { margin-bottom: 0.5rem; font-family: var(--font-baslik); font-size: 1.125rem; font-weight: 700; text-transform: uppercase; color: var(--xg); }
.dgerek dl div { display: grid; grid-template-columns: 9rem minmax(0, 1fr); gap: 1rem; padding-block: 0.625rem; border-bottom: 1px solid var(--cizgi); font-size: var(--fs-sm); line-height: 1.45; }
.dgerek dl div:last-child { border-bottom: 0; }
.dgerek dt { color: var(--soluk); }
.dgerek dd { font-weight: 600; color: var(--metin); }

/* Kılavuzlar ve belgeler */
.dbelgeler { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.75rem; }
.dbelge { display: flex; align-items: center; gap: 1rem; height: 100%; padding: 1rem 1.25rem; border: 1px solid var(--cizgi); border-radius: var(--yaricap); transition: border-color .2s, box-shadow .2s; }
.dbelge:hover { border-color: rgba(var(--xg-rgb), .6); box-shadow: 0 0.75rem 1.75rem rgba(var(--ink-rgb), .08); }
.dbelge__ikon { flex: none; width: 1.75rem; height: 1.75rem; color: var(--xg); }
.dbelge__metin { display: flex; flex: 1; flex-direction: column; min-width: 0; }
.dbelge__ad { font-weight: 600; color: var(--ink); }
.dbelge small { font-size: var(--fs-xs); color: var(--soluk); }
.dbelge__ok { flex: none; color: var(--soluk); transition: color .2s, transform .2s var(--ease); }
.dbelge:hover .dbelge__ok { color: var(--xg); transform: translate(0.125rem, -0.125rem); }

/* Önceki sürümler: zaman çizgisi, notlar açılır */
.dgecmis { position: relative; display: flex; flex-direction: column; gap: 0.5rem; margin: 0; padding: 0 0 0 1.5rem; list-style: none; }
.dgecmis::before { content: ""; position: absolute; left: 0.3125rem; top: 0.75rem; bottom: 0.75rem; width: 2px; background: var(--cizgi); }
.dgecmis__oge { position: relative; }
.dgecmis__oge::before { content: ""; position: absolute; left: -1.5rem; top: 1.125rem; width: 0.75rem; height: 0.75rem; border: 2px solid var(--xg); border-radius: 50%; background: var(--kagit); }
.dgecmis details { border: 1px solid var(--cizgi); border-radius: var(--yaricap); }
.dgecmis summary { display: flex; align-items: center; gap: 1.25rem; padding: 0.75rem 1.25rem; cursor: pointer; list-style: none; font-size: var(--fs-sm); color: var(--soluk); }
.dgecmis summary::-webkit-details-marker { display: none; }
.dgecmis summary:hover { background: var(--kagit-2); }
.dgecmis__no { font-family: var(--font-baslik); font-size: 1.25rem; font-weight: 700; color: var(--ink); }
.dgecmis__ac { display: inline-flex; align-items: center; gap: 0.5rem; margin-left: auto; font-family: var(--font-baslik); font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--xg); }
.dgecmis__ac::after { content: ""; width: 0.5rem; height: 0.5rem; margin-top: -0.25rem; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); transition: transform .2s var(--ease); }
.dgecmis details[open] .dgecmis__ac::after { margin-top: 0.25rem; transform: rotate(-135deg); }
.dgecmis details[open] summary { border-bottom: 1px solid var(--cizgi); }
.dgecmis__govde { padding: 1.25rem 1.5rem 1.5rem; }
.dgecmis__govde .dnot { font-size: var(--fs-sm); }
.dgecmis__dosyalar { display: flex; flex-wrap: wrap; gap: 0.5rem 2rem; margin-top: 1.25rem; }
.dgecmis__dosyalar .ok-link { font-size: var(--fs-sm); }
.dgecmis__dosyalar .ok-link:hover .ikon { transform: none; }
.dgecmis__tumu { margin-top: 1.25rem; font-size: var(--fs-sm); }

/* ---------- Eğitim videoları: üç sütun, eşit kartlar ---------- */
.dvideolar { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; margin-top: 2rem; }
.dvideo__kart { display: flex; flex-direction: column; height: 100%; overflow: hidden; border: 1px solid var(--cizgi); border-radius: var(--yaricap); background: var(--kagit); transition: border-color .25s, box-shadow .25s, transform .25s var(--ease); }
.dvideo__kart:hover { transform: translateY(-0.25rem); border-color: rgba(var(--xg-rgb), .6); box-shadow: 0 1.25rem 2.5rem rgba(var(--ink-rgb), .12); }
.dvideo__medya { position: relative; display: block; aspect-ratio: 16 / 9; overflow: hidden; background: var(--ink-2); }
.dvideo__kapak { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--ease); }
.dvideo__kart:hover .dvideo__kapak { transform: scale(1.04); }
.dvideo__oynat {
  position: absolute; right: 0.875rem; bottom: 0.875rem; display: flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem;
  border-radius: 50%; color: #fff; background: rgba(var(--xg-rgb), .92); box-shadow: 0 0 0 0.375rem rgba(var(--xg-rgb), .22);
  transition: transform .25s var(--ease), background-color .25s;
}
.dvideo__oynat .ikon { width: 1.125rem; height: 1.125rem; margin-left: 0.125rem; }
.dvideo__kart:hover .dvideo__oynat { background: var(--xg); transform: scale(1.08); }
.dvideo__metin { display: flex; flex: 1; align-items: flex-start; gap: 0.75rem; padding: 1rem 1.25rem 1.25rem; }
.dvideo__no { flex: none; font-family: var(--font-baslik); font-size: 1.125rem; font-weight: 700; line-height: 1.35; color: var(--xg); }
.dvideo__ad { font-weight: 600; line-height: 1.35; color: var(--ink); }

/* Video penceresi: resmî video özgün dili ve altyazısıyla, resmî CDN'den */
.dmodal { width: min(80rem, 92vw); max-width: none; padding: 0; border: 0; border-radius: var(--yaricap); background: var(--ink); color: #fff; box-shadow: 0 2rem 5rem rgba(0, 0, 0, .6); }
.dmodal::backdrop { background: rgba(var(--ink-rgb), .86); -webkit-backdrop-filter: blur(0.25rem); backdrop-filter: blur(0.25rem); }
.dmodal__ust { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 0.75rem 0.75rem 0.75rem 1.5rem; }
.dmodal__baslik { font-family: var(--font-baslik); font-size: 1.25rem; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; }
.dmodal__kapat { display: flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border-radius: 50%; font-size: 1.375rem; transition: background-color .2s; }
.dmodal__kapat:hover { background: rgba(255, 255, 255, .12); }
.dmodal__video { width: 100%; aspect-ratio: 16 / 9; background: #000; }

/* ---------- Wiki: kılavuz bölümleri, iki sütun ---------- */
.dwiki__bas { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem 2rem; margin-top: 2rem; }
.dwiki__bilgi { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 1rem; font-weight: 600; color: var(--ink); }
.dwiki__bilgi span + span { padding: 0.125rem 0.625rem; border-radius: 2rem; font-size: var(--fs-sm); font-weight: 600; color: var(--soluk); background: var(--kagit-2); }
.dwiki__bilgi > span:first-child { padding: 0; background: none; font-size: inherit; color: inherit; }
.dwiki { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.75rem; margin: 1.5rem 0 0; padding: 0; list-style: none; }
.dwiki__oge { display: flex; align-items: center; gap: 1rem; height: 100%; padding: 1rem 1.25rem; border: 1px solid var(--cizgi); border-radius: var(--yaricap); transition: border-color .2s, background-color .2s; }
.dwiki__oge:hover { border-color: rgba(var(--xg-rgb), .6); background: var(--xg-50); }
.dwiki__no { flex: none; font-family: var(--font-baslik); font-size: 1.375rem; font-weight: 700; color: var(--xg); }
.dwiki__ad { flex: 1; font-weight: 600; line-height: 1.35; color: var(--ink); }
.dwiki__ok { flex: none; color: var(--soluk); transition: color .2s, transform .2s var(--ease); }
.dwiki__oge:hover .dwiki__ok { color: var(--xg); transform: translate(0.125rem, -0.125rem); }

/* ---------- Wiki bölüm sayfası (destek/wiki/<slug>/<bölüm>.html, 2026-10-30): solda bölümler, ortada metin, sağda içindekiler ---------- */
.whero__ic { padding-block: 3rem 2.75rem; }
.whero .kirinti ol { margin-bottom: 1.75rem; }
.whero .ust-baslik { margin-bottom: 0.75rem; }
.whero__baslik { max-width: 64rem; font-family: var(--font-baslik); font-size: 3.75rem; font-weight: 800; line-height: 1; text-transform: uppercase; }
.whero__bilgi { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 1.5rem; }
.whero__bilgi span { padding: 0.25rem 0.75rem; border: 1px solid rgba(255, 255, 255, .16); border-radius: 2rem; font-size: var(--fs-sm); font-weight: 600; color: var(--koyu-metin); background: rgba(255, 255, 255, .04); }

.wiki { padding-block: 3.5rem var(--bolum-y); background: var(--kagit); }
.wiki__izgara { display: grid; grid-template-columns: 17rem minmax(0, 1fr) 14rem; gap: 3.5rem; align-items: start; }
.wiki__yan, .wiki__toc { position: sticky; top: calc(var(--ust-h) + 1.5rem); max-height: calc(100vh - var(--ust-h) - 3rem); overflow-y: auto; overscroll-behavior: contain; }
.wiki__icerik { grid-column: 2; min-width: 0; }

.wbolumler__bas { display: flex; align-items: baseline; gap: 0.625rem; margin-bottom: 0.75rem; list-style: none; pointer-events: none; font-family: var(--font-baslik); font-size: 1.25rem; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; color: var(--ink); }
.wbolumler__bas::-webkit-details-marker { display: none; }
.wbolumler__bas small { font-family: var(--font); font-size: var(--fs-xs); font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--soluk); }
.wbolumler__ok { display: none; margin-left: auto; color: var(--xg); transition: transform .2s var(--ease); }
.wbolumler__liste { margin: 0; padding: 0; list-style: none; border-left: 1px solid var(--cizgi); }
.wbolumler__liste a { display: flex; gap: 0.625rem; margin-left: -1px; padding: 0.4375rem 0.75rem; border-left: 0.125rem solid transparent; font-size: var(--fs-sm); line-height: 1.35; color: var(--soluk); transition: color .15s, border-color .15s, background-color .15s; }
.wbolumler__liste a:hover { color: var(--ink); border-left-color: var(--cizgi); }
.wbolumler__liste a[aria-current] { font-weight: 600; color: var(--xg-koyu); border-left-color: var(--xg); background: var(--xg-50); }
.wbolumler__no { flex: none; min-width: 1.25rem; font-family: var(--font-baslik); font-weight: 700; color: var(--xg); }
/* Gruplu sayfalar (motor eklentileri: API başvurusu, sürüm geçmişi…): açılır alt liste */
.wbolumler__grup summary { display: flex; align-items: baseline; gap: 0.625rem; padding: 0.4375rem 0.75rem; list-style: none; cursor: pointer; font-size: var(--fs-sm); line-height: 1.35; color: var(--soluk); transition: color .15s; }
.wbolumler__grup summary::-webkit-details-marker { display: none; }
.wbolumler__grup summary:hover, .wbolumler__grup details[open] > summary { color: var(--ink); }
.wbolumler__grup summary small { margin-left: auto; padding: 0 0.4375rem; border-radius: 1rem; font-size: var(--fs-xs); font-weight: 600; color: var(--soluk); background: var(--kagit-2); }
.wbolumler__grup ol { margin: 0 0 0.375rem 1.875rem; padding: 0; list-style: none; border-left: 1px solid var(--cizgi); }
.wbolumler__grup ol a { font-size: var(--fs-xs); }
.dwiki__ad small { margin-left: 0.375rem; font-size: var(--fs-xs); font-weight: 600; color: var(--soluk); }
.wiki__tum { margin-top: 1.25rem; font-size: var(--fs-sm); }

.wiki__toc-bas { margin-bottom: 0.75rem; font-family: var(--font-baslik); font-size: var(--fs-xs); font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--soluk); }
.wiki__toc ol { margin: 0; padding: 0; list-style: none; border-left: 1px solid var(--cizgi); }
.wiki__toc a { display: block; margin-left: -1px; padding: 0.3125rem 0 0.3125rem 0.875rem; border-left: 0.125rem solid transparent; font-size: var(--fs-sm); line-height: 1.35; color: var(--soluk); transition: color .15s, border-color .15s; }
.wiki__toc-3 a { padding-left: 1.75rem; font-size: var(--fs-xs); }
.wiki__toc a:hover { color: var(--ink); }
.wiki__toc a.is-etkin { color: var(--xg-koyu); border-left-color: var(--xg); }
.wiki__toc code, .wbolumler__liste code { font: inherit; }

/* Kılavuz metni: resmî bloklar (başlık, paragraf, liste, tablo, görsel, not kutusu, alıntı, kod) */
.wmetin { max-width: 54rem; font-size: var(--fs-base); line-height: 1.7; color: var(--metin); }
.wmetin > :first-child { margin-top: 0; }
.wmetin h2, .wmetin h3, .wmetin h4, .wmetin h5 { scroll-margin-top: calc(var(--ust-h) + 1.5rem); font-family: var(--font-baslik); font-weight: 700; line-height: 1.15; color: var(--ink); }
.wmetin h2 { margin: 3rem 0 1rem; padding-top: 1.5rem; border-top: 1px solid var(--cizgi); font-size: 2.125rem; letter-spacing: .01em; text-transform: uppercase; }
.wmetin > h2:first-child { padding-top: 0; border-top: 0; }
.wmetin h3 { margin: 2.25rem 0 0.75rem; font-size: 1.5rem; }
.wmetin h4 { margin: 1.75rem 0 0.625rem; font-size: 1.25rem; }
.wmetin h5 { margin: 1.5rem 0 0.5rem; font-size: 1.0625rem; }
.wmetin p { margin: 0 0 1rem; }
.wmetin strong { font-weight: 600; color: var(--ink); }
.wmetin a { color: var(--xg-koyu); text-decoration: underline; text-decoration-color: rgba(var(--xg-rgb), .35); text-underline-offset: 0.1875rem; transition: text-decoration-color .15s; }
.wmetin a:hover { text-decoration-color: currentColor; }
.wmetin code { padding: 0.0625rem 0.375rem; border-radius: 0.25rem; font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; font-size: .875em; color: var(--ink); background: var(--kagit-2); overflow-wrap: anywhere; }
.wmetin hr { margin: 2rem 0; border: 0; border-top: 1px solid var(--cizgi); }
.wliste { margin: 0 0 1.25rem; padding-left: 1.5rem; }
ul.wliste { list-style: disc; }
ol.wliste { list-style: decimal; }
.wliste li { margin-top: 0.375rem; padding-left: 0.25rem; }
.wliste li::marker { font-weight: 600; color: var(--xg); }
.wliste li > p:last-child, .wliste li > .wliste:last-child { margin-bottom: 0; }
.wliste .wliste { margin-top: 0.375rem; }
.wgorsel { margin: 1.5rem 0; text-align: center; }
.wgorsel img, .wgorsel video { margin-inline: auto; border: 1px solid var(--cizgi); border-radius: var(--yaricap); background: var(--kagit); }
.wiframe { position: relative; margin: 1.5rem 0; aspect-ratio: 16 / 9; overflow: hidden; border: 1px solid var(--cizgi); border-radius: var(--yaricap); background: var(--ink); }
.wiframe iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.wgorsel figcaption { margin-top: 0.625rem; font-size: var(--fs-sm); color: var(--soluk); }
.wsimge { display: inline-block; width: auto; max-height: 1.75em; margin-inline: 0.125rem; vertical-align: middle; }
.wtablo { margin: 1.5rem 0; overflow-x: auto; border: 1px solid var(--cizgi); border-radius: var(--yaricap); }
.wtablo table { width: 100%; border-collapse: collapse; font-size: var(--fs-sm); line-height: 1.5; }
.wtablo th, .wtablo td { padding: 0.625rem 0.875rem; border-bottom: 1px solid var(--cizgi); text-align: left; vertical-align: top; }
.wtablo th + th, .wtablo td + td, .wtablo th + td, .wtablo td + th { border-left: 1px solid var(--cizgi); }
.wtablo tbody tr:last-child > * { border-bottom: 0; }
.wtablo th { font-weight: 600; color: var(--ink); background: var(--kagit-2); }
.wtablo td > :last-child, .wtablo th > :last-child { margin-bottom: 0; }
.wtablo .wgorsel { margin: 0.25rem 0; }
.wtablo .wgorsel img { border: 0; }
.wnot { margin: 1.5rem 0; padding: 1rem 1.25rem; border: 1px solid rgba(var(--xg-rgb), .2); border-left: 0.1875rem solid var(--xg); border-radius: var(--yaricap); background: var(--xg-50); }
.wnot--warning, .wnot--caution, .wnot--danger { border-color: var(--cizgi); border-left-color: var(--ink); background: var(--kagit-2); }
.wnot__baslik { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.5rem !important; font-family: var(--font-baslik); font-size: 1.0625rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--ink); }
.wnot__baslik .ikon { width: 1.125rem; height: 1.125rem; color: var(--xg); }
.wnot--warning .wnot__baslik .ikon, .wnot--caution .wnot__baslik .ikon, .wnot--danger .wnot__baslik .ikon { color: var(--ink); }
.wnot > :last-child { margin-bottom: 0; }
.walinti { margin: 1.25rem 0; padding: 0.25rem 0 0.25rem 1.25rem; border-left: 0.1875rem solid var(--cizgi); color: var(--soluk); }
.walinti > :last-child { margin-bottom: 0; }
.wkod { position: relative; margin: 1.25rem 0; padding: 1rem 1.25rem; overflow-x: auto; border-radius: var(--yaricap); background: var(--ink); }
.wkod[data-dil] { padding-top: 2.25rem; }
.wkod[data-dil]::before { content: attr(data-dil); position: absolute; top: 0.625rem; right: 1rem; font-family: var(--font-baslik); font-size: var(--fs-xs); font-weight: 700; letter-spacing: .08em; color: var(--koyu-soluk); }
/* Kod adı olan başlık (API sınıfı / yöntemi): büyük harfe çevrilmez, özgün yazımıyla */
.whero__baslik--kod, .wmetin h2.wbaslik--kod { text-transform: none; }
.wkod code { padding: 0; font-size: 0.875rem; line-height: 1.6; color: var(--koyu-metin); background: none; overflow-wrap: normal; white-space: pre; }
.wdetay { margin: 1.25rem 0; padding: 0.875rem 1.25rem; border: 1px solid var(--cizgi); border-radius: var(--yaricap); }
.wdetay summary { cursor: pointer; font-weight: 600; color: var(--ink); }
.wdetay[open] summary { margin-bottom: 0.75rem; }

.wgecis { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; max-width: 54rem; margin-top: 3rem; padding-top: 2rem; border-top: 1px solid var(--cizgi); }
.wgecis__oge { position: relative; display: flex; flex-direction: column; gap: 0.25rem; height: 100%; padding: 1rem 1.25rem; border: 1px solid var(--cizgi); border-radius: var(--yaricap); transition: border-color .2s, background-color .2s; }
.wgecis__oge:hover { border-color: rgba(var(--xg-rgb), .6); background: var(--xg-50); }
.wgecis__oge small { font-size: var(--fs-xs); font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--soluk); }
.wgecis__oge span { font-weight: 600; line-height: 1.35; color: var(--ink); }
.wgecis__oge--onceki { padding-left: 3rem; }
.wgecis__oge--sonraki { padding-right: 3rem; text-align: right; }
.wgecis__ok { position: absolute; top: 50%; color: var(--xg); transition: transform .2s var(--ease); }
.wgecis__oge--onceki .wgecis__ok { left: 1.125rem; transform: translateY(-50%) rotate(180deg); }
.wgecis__oge--sonraki .wgecis__ok { right: 1.125rem; transform: translateY(-50%); }
.wiki__kaynak { display: flex; gap: 0.625rem; max-width: 54rem; margin-top: 2rem; font-size: var(--fs-sm); line-height: 1.55; color: var(--soluk); }
.wiki__kaynak > .ikon { margin-top: 0.1875rem; color: var(--xg); }
.wiki__kaynak a { font-weight: 600; color: var(--xg-koyu); }

@media (prefers-reduced-motion: reduce) {
  .dvideo__kart, .dvideo__kapak, .dvideo__oynat, .dsekme::after { transition: none; }
  .dvideo__kart:hover, .dvideo__kart:hover .dvideo__kapak { transform: none; }
  .dvideo__kart:hover .dvideo__oynat { transform: none; }
}

/* ---------- Tablet / mobil ---------- */
@media (max-width: 1100px) {
  .dhero__baslik > span:first-child { font-size: 3.5rem; }
  .dhero__slogan { font-size: 1.75rem; }
  .dsekme { flex-direction: column; align-items: flex-start; gap: 0.625rem; padding: 1rem 1rem 1.125rem; }
  .dsekme small { display: none; }
  .dsekme__ad { font-size: 1.25rem; }
  .destek { padding-top: 2rem; }
  .destek__izgara { grid-template-columns: minmax(0, 1fr); gap: 1.5rem; }
  /* JS açıkken ürün seçimi açılır liste; JS yokken bağlantı listesi */
  .dsecim { position: static; padding: 1rem 1.25rem; }
  .js .dsecim__ac { display: block; }
  .js .dsecim__liste { display: none; }
  .dsecim__etiket { display: block; margin-bottom: 0.5rem; font-family: var(--font-baslik); font-size: var(--fs-xs); font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--soluk); }
  .dsecim__kutu { position: relative; }
  .dsecim__kutu select {
    width: 100%; min-height: 3rem; padding: 0 2.75rem 0 1rem; border: 1px solid var(--cizgi); border-radius: 0.375rem;
    font: inherit; font-weight: 600; color: var(--ink); background: var(--kagit); appearance: none; -webkit-appearance: none; cursor: pointer;
  }
  .dsecim__ok { position: absolute; right: 1rem; top: 50%; transform: translateY(-50%); pointer-events: none; color: var(--xg); }
  .durun { padding: 1.75rem; }
  .durun__bas { grid-template-columns: minmax(0, 1fr); }
  .durun__baglanti { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 0.75rem 1.5rem; }
  .durun__ad { font-size: 2.5rem; }
  .dvideolar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  /* Wiki bölüm sayfası: tek sütun; bölüm listesi açılır kutu (JS kapalı başlatır), içindekiler gizli */
  .whero__baslik { font-size: 2.75rem; }
  .wiki { padding-top: 2rem; }
  .wiki__izgara { grid-template-columns: minmax(0, 1fr); gap: 1.75rem; }
  .wiki__yan { position: static; max-height: none; overflow: visible; }
  .wiki__icerik { grid-column: auto; }
  .wiki__toc { display: none; }
  .wbolumler { border: 1px solid var(--cizgi); border-radius: var(--yaricap); background: var(--kagit-2); }
  .wbolumler__bas { margin: 0; padding: 0.875rem 1.25rem; pointer-events: auto; cursor: pointer; }
  .wbolumler__ok { display: block; }
  .wbolumler[open] .wbolumler__ok { transform: rotate(180deg); }
  .wbolumler__liste { margin: 0 1.25rem 1rem; }
}
@media (max-width: 640px) {
  .dhero__ic { padding-block: 2.5rem 2.25rem; }
  .dhero__baslik > span:first-child { font-size: 2.75rem; }
  .dhero__slogan { font-size: 1.375rem; }
  .dsekme { padding: 0.875rem 0.625rem 1rem; }
  .dsekme__ikon { width: 2.25rem; height: 2.25rem; padding: 0.5rem; }
  .dsekme__ad { font-size: 1.0625rem; }
  .durun { padding: 1.25rem; }
  .durun__ad { font-size: 2rem; }
  .dsurum { padding: 1.25rem; }
  .dsurum__no { font-size: 2rem; }
  .ddosyalar, .dbelgeler, .dgerek, .dwiki, .dvideolar { grid-template-columns: minmax(0, 1fr); }
  .ddosya { flex-wrap: wrap; }
  .ddosya .dugme { width: 100%; justify-content: center; }
  .dgerek dl div { grid-template-columns: 7rem minmax(0, 1fr); }
  .dgecmis summary { flex-wrap: wrap; gap: 0.25rem 1rem; }
  .dmodal { width: 100vw; border-radius: 0; }
  .whero__ic { padding-block: 2.25rem 2rem; }
  .whero__baslik { font-size: 2.125rem; }
  .wmetin h2 { font-size: 1.75rem; }
  .wmetin h3 { font-size: 1.3125rem; }
  .wgecis { grid-template-columns: minmax(0, 1fr); }
}
