/* =====================================================================
 SAYFA CSS — FİT TESTİ DETAYI (§8)
 ---------------------------------------------------------------------
 Kabuktan gelenler burada TEKRAR TANIMLANMADI: token'lar, .wrap, .sec,
 .btn/.btn-ghost, .lib-top + .lib-crumb + .lib-stats banner'ı, .lib-grid,
 .hr-note, .fp-card/.fp-head/.fp-list/.fp-row/.fp-badge kitleri.
 Burada yalnız bu sayfaya özgü ölçüler var: iki kolon kurgusu, uygunluk
 taraması paneli, kilitli adım bloğu, durdurma paneli ve sonuç paneli.
 Bunların hiçbiri başka sayfada yok — kabuğa taşınacak ortak kit değiller.
 ===================================================================== */

/* sayfa genel: yeşil eyebrow (fit bölümleri) — diğer 24 fit sayfasıyla aynı iki satır */
.sec-fit .eyebrow{color:var(--fit-deep)}
.sec-fit .eyebrow::before{background:var(--fit)}

/* ---- İKİ KOLON: sol akış · sağ sabit özet ---- */
/* R8/29: alt dolgu 0'di — .ft-body → .ft-coach sinirinda ara 74 px cikiyor,
 hemen altindaki .ft-coach → #diger sinirinda 148 px. Iki farkli deger.
 Kabugun kendi ayni-isi-yapan idiomu kullanildi (fit-shell.css:1557 .note-band):
 ust siki nefes, alt tam nefes. Sabit px yok → K-A rampasiyla birlikte hareket eder. */
.ft-body{padding:var(--sec-pad-sm) 0 var(--sec-pad);background:var(--bg-white)}
.ft-lay{display:grid;grid-template-columns:minmax(0,1fr) 348px;gap:40px;align-items:start;margin-top:26px}
.ft-col{min-width:0}

/* ---- BLOK BAŞLIĞI (sol kolon h2'leri) ---- */
/* R8/29: kolon ici dikey ritim TEK degiskene baglandi. Onceki hal olculdu:
 .ft-blk 44/34 · .ft-tier 46 · .ft-flow 30 · .ft-flow-act 30 →
 @1440 iki farkli ara (44·46), @768 uc (30·44·46), @390 uc (30·34·46).
 Kirilma noktasi 900 degil 640: kabuk rampasi (--sec-pad) 640'ta dusuyor,
 ritim de orada dussun ki ikisi ayni anda degissin (K-A ile tutarli). */
.ft-col{--ft-ara:44px}
@media (max-width:640px){ .ft-col{--ft-ara:34px} }
.ft-blk{margin-top:var(--ft-ara);scroll-margin-top:120px}
.ft-blk:first-child{margin-top:0}
/* R9 · "Önce oku" üçlüsü AKORDİYON oldu (Beyar): test amacı varsayılan
   açık, "kimler için uygun" ve "güvenlik uyarısı" katlı. Üç blok birden
   açıkken sayfa "sonra uygula" bölümüne inmeden önce çok uzuyordu. */
.ft-blk-h{display:flex;align-items:center;gap:12px;margin-bottom:18px}
h2.ft-acc-h{margin:0;font-size:inherit;font-weight:inherit;letter-spacing:normal}
button.ft-blk-h{width:100%;text-align:left;background:none;border:none;padding:0;
  font-family:inherit;cursor:pointer;color:inherit}
button.ft-blk-h:hover h2{color:var(--fit-deep)}
button.ft-blk-h:focus-visible{outline:2px solid var(--fit-deep);outline-offset:4px;border-radius:var(--radius-sm,6px)}
.ft-acc-ok{margin-left:auto;flex:none;font-size:12px;color:var(--muted);transition:transform .18s var(--ease)}
button.ft-blk-h[aria-expanded="false"] .ft-acc-ok{transform:rotate(-90deg)}
button.ft-blk-h[aria-expanded="false"]{margin-bottom:0}
.ft-acc-govde[hidden]{display:none}
.ft-blk-h .ic{flex:none;width:40px;height:40px;border-radius:var(--radius-md);background:var(--fit-tint);color:var(--fit-deep);display:grid;place-items:center;font-size:16px}
.ft-blk-h h2{font-size:22px;letter-spacing:-.02em}
.ft-blk-h p{font-size:13px;color:var(--muted);font-weight:500;margin-top:2px}
.ft-lead{font-size:15px;font-weight:500;color:var(--slate-2);line-height:1.65}

/* ---- E6/it2 · OKUNABİLİRLİK: SATIR ÖLÇÜSÜ VE YASLAMA ----------------
 ÖLÇÜM (it1, 1440px): sol kolon akan metninde satır ölçüsü 47–157 karakter,
 11 paragraf 80 karakteri aşıyordu. Tipografide okunur aralık 45–75 karakter;
 157 karakterlik satırda göz satır başını kaybediyor.
 Çözüm: akan metne 68ch ölçü sınırı. Kart ızgaraları ve kutular etkilenmez —
 sınır YALNIZ sol kolonun akan metnine uygulanır. */
.ft-col .ft-lead,
.ft-col .ft-ul li,
.ft-col .ft-safe li,
.ft-col .ft-scr-note,
.ft-col > .ft-blk > p,
.ft-coach-in p{max-width:var(--measure)}

/* ---- E6/it1 · AKIŞ RAYI ------------------------------------------
 Sorun (it0 ölçümü): sol kolon altı eşit ağırlıklı bölüm olarak okunuyordu;
 "bu testi yapmak için ne yapmam gerek" sorusunun cevabı hiçbir yerde yoktu
 ve asıl eylem (uygunluk taraması) 700px kaydırmadan görünmüyordu.
 Çözüm: bilgi blokları ile UYGULAMA blokları ayrıldı; uygulama üç numaralı
 adıma indi ve sayfanın başında bir ray olarak gösteriliyor. */
.ft-flow{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;
  margin:0 0 var(--ft-ara);padding:0;list-style:none
}
.ft-flow a{
  display:flex;align-items:flex-start;gap:12px;height:100%;
  background:var(--paper);border:1px solid var(--line);border-radius:var(--radius-lg);
  padding:14px 16px;transition:.2s var(--ease)
}
.ft-flow a:hover{border-color:var(--fit);box-shadow:var(--sh-sm);transform:translateY(-2px)}
.ft-flow .n{
  flex:none;width:26px;height:26px;border-radius:var(--radius-circle);
  background:var(--fit-deep);color:#fff;display:grid;place-items:center;
  font-size:12.5px;font-weight:800;font-variant-numeric:tabular-nums
}
.ft-flow b{display:block;font-size:14px;color:var(--slate);letter-spacing:-.01em}
.ft-flow span{display:block;font-size:12px;font-weight:500;color:var(--muted);margin-top:3px;line-height:1.45}
.ft-flow .st{
  margin-top:7px;display:inline-flex;align-items:center;gap:6px;
  font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--fit-deep)
}
/* it2 · kilitli adım YEŞİL görünmemeli — "açık" sinyali veriyordu */
.ft-flow .st.is-locked{color:var(--muted)}
.ft-flow a:has(.is-locked){background:var(--bg)}
/* uygulama bloklarının başlığında ikon yerine ADIM NUMARASI */
.ft-blk.is-step .ft-blk-h .ic{background:var(--fit-deep);color:#fff;font-size:15px;font-weight:800;font-variant-numeric:tabular-nums}
/* bilgi blokları ile uygulama blokları arasına görünür bir eşik */
.ft-tier{
  display:flex;align-items:center;gap:12px;margin:var(--ft-ara) 0 22px;
  font-size:11.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)
}
.ft-tier::after{content:"";flex:1;height:1px;background:var(--line)}
.ft-tier:first-child{margin-top:0}
@media (max-width:900px){ .ft-flow{grid-template-columns:minmax(0,1fr);gap:9px} }

/* ---- E6/it3 · MOBİLDE ASIL EYLEME ERİŞİM --------------------------
 ÖLÇÜM (it2, 390px): testi başlatan birincil düğme yalnız sağ kolonda
 duruyordu ve o kolon mobilde içeriğin SONUNA düşüyordu — düğmenin sayfa
 üstünden uzaklığı 5514px, yani kullanıcı testi başlatmak için sayfanın
 %60'ını kaydırmak zorundaydı.
 Çözüm: akış rayının hemen altına, YALNIZ ≤900px'te görünen bir eylem
 satırı. Masaüstünde sağ kolon zaten taşıdığı için tekrar basılmaz. */
.ft-flow-act{display:none}
@media (max-width:900px){
  .ft-flow-act{display:flex;flex-direction:column;gap:9px;margin:0 0 var(--ft-ara)}
  .ft-flow-act .btn{width:100%}
}

/* madde listesi (amaç maddeleri) */
.ft-ul{list-style:none;display:flex;flex-direction:column;gap:9px;margin-top:16px}
.ft-ul li{display:flex;gap:11px;font-size:14px;font-weight:500;color:var(--slate-2);line-height:1.55}
.ft-ul li i{flex:none;margin-top:3px;font-size:13px;color:var(--fit-deep)}

/* ---- KİMLER İÇİN UYGUN: uygun / şimdilik uygun değil ---- */
.ft-two{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.ft-who{border:1px solid var(--line);border-radius:var(--radius-lg);padding:18px 20px;background:var(--paper)}
.ft-who.is-ok{border-color:var(--fit-line);background:var(--fit-tint)}
.ft-who.is-no{border-color:#e8d5a8;background:#fff6e6}
.ft-who h3{font-size:14.5px;display:flex;align-items:center;gap:9px;margin-bottom:12px}
.ft-who.is-ok h3 i{color:var(--fit-deep)}
.ft-who.is-no h3 i{color:#8a6410}
.ft-who ul{list-style:none;display:flex;flex-direction:column;gap:8px}
.ft-who li{position:relative;padding-left:17px;font-size:13.5px;font-weight:500;color:var(--slate-2);line-height:1.5}
.ft-who li::before{content:"";position:absolute;left:0;top:8px;width:7px;height:7px;border-radius:var(--radius-circle);background:var(--fit)}
.ft-who.is-no li::before{background:#c99a2e}

/* ---- GÜVENLİK UYARISI ---- */
.ft-safe{border:1px solid #e8d5a8;background:#fff6e6;border-radius:var(--radius-lg);padding:20px 22px}
.ft-safe h3{font-size:15px;display:flex;align-items:center;gap:10px;margin-bottom:12px;color:#7a5608}
.ft-safe h3 i{color:#8a6410}
.ft-safe ul{list-style:none;display:flex;flex-direction:column;gap:10px}
.ft-safe li{display:flex;gap:11px;font-size:13.5px;font-weight:500;color:#5f4a1e;line-height:1.55}
.ft-safe li i{flex:none;margin-top:3px;font-size:12px;color:#8a6410}

/* ---- UYGUNLUK TARAMASI (§8 — testin ÖNÜNDEKİ kapı) ---- */
.ft-scr{border:1px solid var(--line);border-radius:var(--radius-xl);background:var(--paper);box-shadow:var(--sh-sm);overflow:hidden}
.ft-scr-h{display:flex;align-items:flex-start;gap:13px;padding:20px 22px;background:linear-gradient(160deg,var(--marka-koyu-zemin-yesil),#211E16);color:#fff}
.ft-scr-h .ic{flex:none;width:40px;height:40px;border-radius:var(--radius-md);background:color-mix(in srgb, var(--marka) 24%, transparent);border:1px solid color-mix(in srgb, var(--marka-parlak) 40%, transparent);color:#fff;display:grid;place-items:center;font-size:16px}
/* R12/R7: seçici torun <b>'leri de yakalıyordu — açıklama içindeki "Evet" ve
   "Her soruyu bir kez yanıtlarsın" vurguları blok olup cümleyi üçe bölüyordu.
   Başlık <b>'si .ft-scr-h > div'in DOĞRUDAN çocuğu, small içindekiler değil —
   seçici buna göre daraltıldı, cümle artık tek akan paragraf. */
.ft-scr-h > div > b{display:block;font-size:16px;font-weight:700}
.ft-scr-h small{display:block;font-size:12.5px;font-weight:500;color:rgba(255,255,255,.7);margin-top:3px;line-height:1.5}
.ft-scr-h small b{display:inline;font-size:inherit;font-weight:700;color:#fff}
/* R12/R8: 6px'ti — <legend> fieldset'in padding-top'unu atladığı için (bkz.
   docs/lessons.md §3) ilk sorunun ÜSTÜNDE gerçek nefes yoktu. 22px'e çıkarıldı:
   R11/M13'te kurulan "ayraç ↔ soru = 22px" grup-arası ritmiyle birebir aynı
   değer — yeni boşluk mevcut dikey ritmi bozmuyor, onunla tutarlı. */
.ft-scr-body{padding:22px 22px 22px}

/* R9 · soru–şık ritmi sıkıldı (Beyar: "sorular ve şıklar arasında çok
   boşluk var"). Ölçüm: soru alt kenarı → şık kabı üstü 27px, blok
   dolgusu 16+16. Tek satırlık bir soru için 14px font üstünde ~1.8×
   satır boşluğu; şıklar sorudan kopuk okunuyordu. */
/* R11/M13 · SORU SATIRI RİTMİ — Beyar: "test soruları kötü olmuş, mesela
   divider'a üstten çok yakın; boşluk hiyerarşisini tekrardan revize et."

   ÖLÇÜLEN İKİ KUSUR:
   1) `<legend>` fieldset'in `padding-top`'unu ATLIYOR — legend kutusu
      fieldset'in kenarlık bandına yerleşir, dolgu kutusunun üstünde kalır.
      Ölçüm: ayraç çizgisi → soru metni = **0px**. 13px dolgu hiç işlemiyordu.
      Çözüm: nefes legend'in KENDİ üst dolgusundan veriliyor.
   2) YAKINLIK TERSTİ (Gestalt): soru metni ↔ seçenekler **21px**,
      seçenekler ↔ alttaki ayraç **14px**. Yani seçenekler kendi sorusundan
      çok BİR SONRAKİ soruya yapışık okunuyordu. Birbirine ait olan yakın,
      ayrı olan uzak olmalı — oran ters çevrildi:
        ayraç ↔ soru      22px   (gruplar arası)
        soru  ↔ seçenek   14px   (grup içi)
        seçenek ↔ ayraç   22px   (gruplar arası)
   Değerler 4px ızgarasına oturuyor (tests/uiux-denetim.mjs · başlık 7). */
.ft-q{border:none;border-bottom:1px solid var(--line);padding:0 0 22px}
/* R9 · adımlar bitince sonuç girişini açan düğme */
.ft-steps-done{margin-top:18px;display:flex;justify-content:flex-start}
.ft-q:last-of-type{border-bottom:none}
.ft-q legend{font-size:14px;font-weight:600;color:var(--slate);line-height:1.5;
  /* üst nefes BURADAN geliyor — fieldset'in padding-top'u legend'e işlemiyor */
  padding:22px 0 0;margin-bottom:14px}
.ft-q:first-of-type legend{padding-top:0}
.ft-q legend .n{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:var(--radius-sm);background:var(--bg);color:var(--slate-2);font-size:11.5px;font-weight:800;margin-right:9px;font-variant-numeric:tabular-nums}
.ft-opts{display:flex;gap:9px;flex-wrap:wrap}
.ft-opt{position:relative;display:inline-flex}
.ft-opt input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.ft-opt span{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;font-weight:600;color:var(--slate);background:var(--paper);border:1px solid var(--line);padding:9px 17px;border-radius:var(--radius-sm);cursor:pointer;transition:.18s var(--ease);min-height:40px}
.ft-opt span i{font-size:12px;color:var(--muted)}
.ft-opt span:hover{border-color:var(--fit);color:var(--fit-deep);background:var(--fit-tint)}
.ft-opt input:checked+span{border-color:var(--fit);background:var(--fit);color:#fff}
.ft-opt input:checked+span i{color:#fff}
/* seçili boş daire → işaretli daire (fa-circle-check). Riskli seçenek kendi
 uyarı ikonunu taşıdığı için değiştirilmez — ikon farkı renkten bağımsız sinyal. */
.ft-opt input:checked+span i.fa-circle::before{content:"\f058"}
/* riskli yanıt: renk TEK sinyal değil — ikon değişir ve metin "Evet" yazar */
.ft-opt input[data-risk="1"]:checked+span{border-color:#d9a441;background:#fff6e6;color:#7a5608}
.ft-opt input[data-risk="1"]:checked+span i{color:#8a6410}
.ft-opt input:focus-visible+span{outline:3px solid var(--fit);outline-offset:2px}

/* ---- R14 (5. tur) · YANITLANAN SORU KİLİTLENİR ----------------------
   Beyar: "Bir seçenek tıklandığında yanlış olduğu gösteriliyor ama diğer
   seçenekler hâlâ tıklanabiliyor — kullanıcı yanlışı gördükten sonra
   doğruyu da tıklayıp puanını değiştirebiliyor."
   Ölçüldü (7 test slug'ında): 14 şıktan KİLİTLİ 0; riskli yanıt geri
   alınıp test açılabiliyordu. Kapı kapı değildi.
   Kilit yalnız görsel değil: input `disabled` + `aria-disabled` + odak
   sırasından çıkarılıyor. Seçilmeyen şık soluyor, seçilen tam opak kalıyor
   ki kullanıcı ne yanıtladığını okumaya devam edebilsin. */
.ft-q.is-locked .ft-opt span{cursor:default}
.ft-q.is-locked .ft-opt input:disabled+span{opacity:.5}
.ft-q.is-locked .ft-opt input:disabled:checked+span{opacity:1}
.ft-q.is-locked .ft-opt span:hover{border-color:var(--line);color:var(--slate);background:var(--paper)}
.ft-q.is-locked .ft-opt input:disabled:checked+span:hover{border-color:var(--fit);background:var(--fit);color:#fff}
.ft-q.is-locked .ft-opt input[data-risk="1"]:disabled:checked+span:hover{border-color:#d9a441;background:#fff6e6;color:#7a5608}
/* riskli yanıt verildiğinde GÜVENLİ şık ayrıca işaretlenir — kullanıcı
   neyin "temiz yanıt" sayıldığını görsün diye. */
.ft-q .ft-opt.is-safe{position:relative}
.ft-q .ft-opt.is-safe span{border-style:dashed;border-color:var(--fit)}
.ft-q .ft-opt.is-safe::after{
  content:"Temiz yanıt";position:absolute;left:0;top:calc(100% + 5px);
  font-size:11px;font-weight:700;letter-spacing:.02em;color:var(--fit-deep);white-space:nowrap
}
.ft-q.is-locked .ft-opts{margin-bottom:20px}
.ft-q.is-risk .ft-lockmsg{color:#7a5608}
.ft-lockmsg{
  display:flex;align-items:flex-start;gap:8px;margin:10px 0 0;
  font-size:12.5px;font-weight:600;color:var(--muted);line-height:1.5
}
.ft-lockmsg i{flex:none;font-size:11px;margin-top:3px}
/* yanıtlanmayan soru: sol şerit + ikonlu metin (yalnız renkle anlatılmıyor — §20) */
.ft-q.is-err{border-left:3px solid #a8391c;padding-left:14px;background:#fff8f6}
.ft-qerr{display:none;align-items:center;gap:8px;font-size:12.5px;font-weight:700;color:#a8391c;margin-top:10px}
.ft-q.is-err .ft-qerr{display:flex}

.ft-scr-acts{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px;padding-top:18px;border-top:1px solid var(--line)}
.ft-scr-note{display:flex;gap:10px;font-size:12px;font-weight:500;color:var(--muted);line-height:1.55;margin-top:14px}
.ft-scr-note i{flex:none;margin-top:3px;color:var(--fit-deep)}
.ft-formerr{display:none;align-items:center;gap:10px;font-size:13.5px;font-weight:700;color:#a8391c;background:#fff2ee;border:1px solid #f3cdc0;border-radius:var(--radius-md);padding:12px 15px;margin-top:16px}
.ft-formerr.show{display:flex}

/* ---- DURDURMA PANELİ (riskli yanıt → test açılmaz) ---- */
.ft-stop{border:1px solid #f3cdc0;background:#fff2ee;border-radius:var(--radius-xl);padding:24px 26px;margin-top:22px}
.ft-stop h3{display:flex;align-items:center;gap:11px;font-size:18px;color:#8f3018;margin-bottom:10px}
.ft-stop h3 i{flex:none;width:38px;height:38px;border-radius:var(--radius-md);background:#fadcd2;color:#a8391c;display:grid;place-items:center;font-size:16px}
.ft-stop p{font-size:14px;font-weight:500;color:#6d3626;line-height:1.65}
.ft-stop p+p{margin-top:10px}
.ft-stop ul{list-style:none;display:flex;flex-direction:column;gap:8px;margin:14px 0 0}
.ft-stop li{position:relative;padding-left:17px;font-size:13.5px;font-weight:500;color:#6d3626;line-height:1.5}
.ft-stop li::before{content:"";position:absolute;left:0;top:8px;width:7px;height:7px;border-radius:var(--radius-circle);background:#c2694c}
.ft-stop-acts{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}
.ft-stop .btn-stop{background:#a8391c;color:#fff}
.ft-stop .btn-stop:hover{background:#8f3018;transform:translateY(-2px)}
.ft-stop .btn-line{background:#fff;color:#8f3018;border:1px solid #f0c3b4}
.ft-stop .btn-line:hover{border-color:#a8391c;transform:translateY(-2px)}

/* ---- KİLİTLİ ADIM BLOĞU (tarama geçilmeden görünen yer tutucu) ---- */
.ft-lock{border:1px dashed var(--line);border-radius:var(--radius-xl);background:var(--bg);padding:34px 26px;text-align:center}
.ft-lock .ic{width:56px;height:56px;border-radius:var(--radius-circle);background:#fff;border:1px solid var(--line);color:var(--muted);display:grid;place-items:center;font-size:21px;margin:0 auto 14px}
.ft-lock h3{font-size:16.5px;margin-bottom:7px}
/* R11/M13 · 420px, 924px'lik kartın %45'i = 47 karakter/satır — okunur
   bandın (45–75) en dibinde ve kartın içinde yarım kalmış duruyordu.
   560px'e çıkarıldı: %61 · ~63 karakter/satır (bandın ortası).
   560 uydurma değil — deponun kendi ölçüsü (`.lib-sub{max-width:560px}`). */
.ft-lock p{font-size:13.5px;font-weight:500;color:var(--muted);line-height:1.6;max-width:560px;margin:0 auto 18px}

/* ---- ADIM ADIM UYGULAMA ---- */
.ft-steps{list-style:none;counter-reset:ftstep;display:flex;flex-direction:column;gap:2px}
.ft-steps li{display:flex;gap:16px;padding:15px 4px 15px 0;border-bottom:1px solid var(--line)}
.ft-steps li:last-child{border-bottom:none}
.ft-steps li::before{counter-increment:ftstep;content:counter(ftstep);flex:none;width:30px;height:30px;border-radius:var(--radius-md);background:var(--fit);color:#fff;font-size:13.5px;font-weight:700;display:grid;place-items:center;font-variant-numeric:tabular-nums}
.ft-steps li b{display:block;font-size:15px;font-weight:700;color:var(--slate);margin-bottom:3px}
.ft-steps li span{display:block;font-size:14px;font-weight:500;color:var(--slate-2);line-height:1.55}

/* ---- ÖLÇÜM FORMU + SONUÇ ---- */
.ft-mform{border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--paper);box-shadow:var(--sh-sm);padding:20px 22px}
.ft-mform .ft-q{border-bottom:none;padding:0}
.ft-mform .ft-opts{flex-direction:column;align-items:stretch}
.ft-mform .ft-opt{display:flex}
.ft-mform .ft-opt span{width:100%;justify-content:flex-start}
.ft-mact{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}

.ft-res{border:1px solid var(--fit-line);border-radius:var(--radius-xl);background:var(--fit-tint);padding:24px 26px;margin-top:20px}
.ft-res h3{font-size:18px;margin-bottom:10px;display:flex;align-items:center;gap:11px}
.ft-res h3 i{flex:none;width:38px;height:38px;border-radius:var(--radius-md);background:#fff;color:var(--fit-deep);display:grid;place-items:center;font-size:16px}
.ft-res-p{font-size:14px;font-weight:500;color:var(--slate-2);line-height:1.65}
.ft-res-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:18px}
.ft-res-k{background:#fff;border:1px solid var(--fit-line);border-radius:var(--radius-lg);padding:16px 18px}
.ft-res-k .lab{display:block;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:7px}
.ft-res-k b{display:block;font-size:17px;font-weight:800;color:var(--slate);letter-spacing:-.01em}
.ft-res-k small{display:block;font-size:12.5px;font-weight:500;color:var(--slate-2);margin-top:5px;line-height:1.5}
.ft-res-k a{color:var(--fit-deep);font-weight:700;text-decoration:underline;text-underline-offset:2px}
.ft-res-acts{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}

/* ---- SAĞ KOLON: sabit özet kartı ---- */
.ft-side{position:sticky;top:128px;display:flex;flex-direction:column;gap:16px}
.ft-side-card{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius-xl);box-shadow:var(--sh-md);overflow:hidden}
.ft-side-h{display:flex;align-items:center;gap:12px;padding:18px 20px;border-bottom:1px solid var(--line)}
.ft-side-h h2{font-size:15.5px}
.ft-side-h .ic{flex:none;width:36px;height:36px;border-radius:var(--radius-md);background:var(--fit-tint);color:var(--fit-deep);display:grid;place-items:center;font-size:14px}
.ft-side-body{padding:6px 20px 18px}
.ft-fact{display:flex;gap:13px;align-items:flex-start;padding:14px 0;border-bottom:1px solid var(--line)}
.ft-fact:last-child{border-bottom:none}
.ft-fact>i{flex:none;width:34px;height:34px;border-radius:var(--radius-md);background:var(--bg);color:var(--slate-2);display:grid;place-items:center;font-size:13px}
.ft-fact .tx{min-width:0;flex:1}
.ft-fact h3{font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:4px}
.ft-fact b{display:block;font-size:14.5px;font-weight:700;color:var(--slate)}
.ft-fact small{display:block;font-size:12.5px;font-weight:500;color:var(--slate-2);margin-top:3px;line-height:1.5}
.ft-eq{list-style:none;display:flex;flex-direction:column;gap:6px;margin-top:6px}
.ft-eq li{display:flex;gap:9px;font-size:12.5px;font-weight:500;color:var(--slate-2);line-height:1.45}
.ft-eq li i{flex:none;margin-top:2px;font-size:11px;color:var(--fit-deep)}
.ft-status{display:flex;align-items:center;gap:10px;padding:14px 20px;border-top:1px solid var(--line);background:var(--bg)}
.ft-status .lab{font-size:12px;font-weight:600;color:var(--muted)}
.ft-side-cta{padding:0 20px 20px;display:flex;flex-direction:column;gap:9px}
.ft-side-cta .btn{width:100%}
.ft-side-cta .btn-line{background:var(--paper);color:var(--slate);border:1px solid var(--line)}
.ft-side-cta .btn-line:hover{border-color:var(--fit);color:var(--fit-deep);transform:translateY(-2px)}

/* ---- DİĞER TESTLER RAYI ---- */
.ft-rail{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px}
.ft-rail a{display:inline-flex;align-items:center;gap:9px;font-size:13.5px;font-weight:600;color:var(--slate);background:var(--paper);border:1px solid var(--line);padding:10px 16px;border-radius:var(--radius-sm);transition:.18s var(--ease)}
.ft-rail a i{font-size:12px;color:var(--fit-deep)}
.ft-rail a:hover{border-color:var(--fit);color:var(--fit-deep);background:var(--fit-tint);transform:translateY(-2px)}
.ft-rail a[aria-current="page"]{border-color:var(--fit);background:var(--fit);color:#fff}
.ft-rail a[aria-current="page"] i{color:#fff}

/* ---- ANTRENÖRE DANIŞMA BANDI ---- */
.ft-coach{padding:var(--sec-pad) 0 var(--sec-pad);background:var(--bg-cream);border-top:1px solid var(--line)}
.ft-coach-in{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:30px;align-items:center;background:linear-gradient(160deg,var(--marka-koyu-zemin-yesil),#211E16);border-radius:var(--radius-xl);padding:var(--sec-pad-sm) 32px;color:#fff}
.ft-coach-in h2{color:#fff;font-size:24px;margin-bottom:10px}
.ft-coach-in p{font-size:14.5px;font-weight:500;color:rgba(255,255,255,.78);line-height:1.65}
.ft-coach-in p+p{margin-top:9px}
.ft-coach-acts{display:flex;flex-direction:column;gap:10px}
.ft-coach-acts .btn{width:100%}
.ft-coach-acts .btn-line{background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.24)}
.ft-coach-acts .btn-line:hover{background:rgba(255,255,255,.18);transform:translateY(-2px)}

/* ---- DAR EKRAN ---- */
@media (max-width:1024px){
  .ft-lay{grid-template-columns:1fr;gap:30px}
  .ft-side{position:static;top:auto}
  .ft-coach-in{grid-template-columns:1fr;gap:22px}
}
@media (max-width:640px){
  .ft-body{padding-top:var(--sec-pad-sm)}
  .ft-two,.ft-res-grid{grid-template-columns:1fr}
  /* R8/29: .ft-blk margin-top artik --ft-ara token'inda (640 kirilimi) */
  .ft-blk-h h2{font-size:19px}
  .ft-scr-body,.ft-side-body{padding-left:16px;padding-right:16px}
  .ft-scr-h{padding:16px}
  .ft-stop,.ft-res{padding:20px 18px}
  .ft-coach{padding:var(--sec-pad) 0 var(--sec-pad)}
  .ft-coach-in{padding:22px 18px}
  .ft-coach-in h2{font-size:20px}
  .ft-opt span{width:100%;justify-content:center}
  .ft-opts{flex-direction:column;align-items:stretch}
  .ft-opt{display:flex}
}