/* Testler sayfası ve test sayfalarına özel stiller */

.band{background:var(--blue);color:var(--on-blue)}
.band .wrap{padding-block:3rem 2.8rem}
.band .ust{margin:0 0 .7rem;font:700 .9rem var(--body);letter-spacing:.06em;text-transform:uppercase;color:var(--yellow)}
.band .ust a{color:inherit}
.band h1{font-size:clamp(1.9rem,3.8vw,2.8rem);font-weight:800;max-width:24ch}
.band p.giris{margin:1rem 0 0;font-size:1.15rem;max-width:60ch;opacity:.92}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.btn.buyuk{font-size:1.1rem;padding:.95rem 1.7rem}
.btn:disabled{opacity:.45;cursor:not-allowed}
.cubuk{height:8px;border-radius:99px;background:var(--chip);overflow:hidden}
.cubuk i{display:block;height:100%;background:var(--blue);border-radius:inherit;transition:width .25s}

/* testler listesi */
.test-listesi{list-style:none;padding:0;margin:2rem 0 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,340px),1fr));gap:1rem}
.test-kart{background:var(--surface);border:1px solid var(--line);border-top:4px solid var(--blue);border-radius:14px;padding:1.5rem;display:flex;flex-direction:column;gap:.7rem}
.test-kart h2{font-size:1.4rem}
.test-kart p{margin:0;color:var(--muted)}
.test-kart .meta{display:flex;flex-wrap:wrap;gap:.4rem}
.test-kart .meta span{background:var(--chip);color:var(--chip-ink);font-weight:700;font-size:.88rem;padding:.2rem .6rem;border-radius:6px}
.test-kart .btn{align-self:flex-start;margin-top:.4rem}
.test-kart.yakinda{border-top-color:var(--line);background:var(--bg-alt)}
.test-kart.yakinda h2{color:var(--muted)}

/* test alanı */
.test{max-width:760px;scroll-margin-top:90px}
.giris-kutu p{color:var(--muted);font-size:1.08rem;margin:1.4rem 0 1.8rem;max-width:62ch}
.bilgi{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:1rem 2.5rem}
.bilgi li{display:flex;flex-direction:column}
.bilgi b{font:800 1.6rem/1.15 var(--display)}
.bilgi span{color:var(--muted);font-size:.95rem}

.ilerleme{display:grid;grid-template-columns:auto 1fr;gap:1rem;align-items:center;font-weight:700;color:var(--muted);font-size:.95rem}
fieldset{border:0;margin:1.6rem 0 0;padding:0;min-width:0}
legend{padding:0;display:block;width:100%}
legend .tur{display:inline-block;background:var(--chip);color:var(--chip-ink);font-weight:700;font-size:.85rem;padding:.2rem .6rem;border-radius:6px}
legend .metin{display:block;margin-top:.7rem;font:700 clamp(1.2rem,2.4vw,1.45rem)/1.35 var(--display)}
.ifadeler{list-style:upper-roman;margin:.9rem 0 0;padding-left:2.4rem;display:grid;gap:.35rem;font-size:1.05rem;line-height:1.45}
.ifadeler li{padding-left:.3rem}
.ifadeler li::marker{font-weight:700}
.secenekler{display:grid;gap:.6rem;margin-top:1.3rem}
.secenek{display:flex;gap:.9rem;align-items:center;background:var(--surface);border:1.5px solid var(--line);border-radius:12px;padding:.85rem 1rem;cursor:pointer;line-height:1.4}
.secenek:hover{border-color:var(--blue-ink)}
.secenek input{position:absolute;opacity:0;pointer-events:none}
.secenek .harf{flex:none;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--chip);color:var(--chip-ink);font:800 .95rem var(--display)}
.secenek:has(input:checked){border-color:var(--blue);background:#F3F7FE;box-shadow:inset 0 0 0 1px var(--blue)}
.secenek:has(input:checked) .harf{background:var(--blue);color:#fff}
.secenek:has(input:focus-visible){outline:3px solid var(--yellow);outline-offset:2px}
.gezinme{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:1.8rem}
.soru-kutu .gezinme{justify-content:space-between}
.soru-kutu #sonraki{margin-left:auto}

/* sonuç */
.puan-kutu{display:grid;grid-template-columns:auto 1fr;gap:1.5rem 2.2rem;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:1.6rem}
.puan{--y:0;width:150px;aspect-ratio:1;border-radius:50%;display:grid;place-content:center;text-align:center;
  background:radial-gradient(closest-side,#fff 78%,transparent 79%),conic-gradient(var(--blue) calc(var(--y)*1%),var(--chip) 0)}
.puan b{font:800 2.6rem/1 var(--display)}
.puan small{font-size:1.2rem;color:var(--muted)}
.puan span{font-weight:700;color:var(--muted);margin-top:.2rem}
.seviye{margin:0;font:800 1.5rem/1.2 var(--display);color:var(--blue-ink)}
.puan-kutu p{margin:.5rem 0 0;color:var(--muted)}
.turler{list-style:none;margin:1.1rem 0 0;padding:0;display:grid;gap:.6rem}
.turler li{display:grid;grid-template-columns:1fr auto;gap:.25rem 1rem;font-size:.95rem}
.turler .cubuk{grid-column:1/-1}
@media (max-width:600px){.puan-kutu{grid-template-columns:1fr;justify-items:start}.puan{width:130px}}

.sonuc h3{font-size:1.3rem}
.eksik,.oneri,.anahtar{margin-top:2.2rem}
.eksik ul{list-style:none;margin:.8rem 0 0;padding:0;display:grid;gap:.5rem}
.eksik li{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.3rem 1rem;border-left:3px solid var(--yellow);background:var(--bg-alt);padding:.65rem 1rem;border-radius:0 10px 10px 0}
.eksik li span{font-weight:700}
.eksik a{font-weight:600}
.oneri .list{margin-top:.8rem}
.sonraki-test{display:flex;flex-wrap:wrap;gap:.8rem 1.2rem;align-items:center;justify-content:space-between;margin-top:1.6rem;padding:1rem 1.2rem;border:1.5px solid var(--blue);border-radius:12px;background:#F3F7FE}
.alternatif{display:flex;flex-wrap:wrap;gap:.3rem 1rem;align-items:baseline;margin:.9rem 0 0;padding:.8rem 1rem;background:var(--chip);border-radius:10px;font-size:.98rem}
.alternatif a{font-weight:700;white-space:nowrap}
.paylas-satir{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem;margin-top:1.8rem}
.paylas-satir > span{font-weight:700;margin-right:.2rem}
.anahtar .not{margin:.3rem 0 .8rem;color:var(--muted);font-size:.95rem}
.cevap{border:1px solid var(--line);border-radius:10px;margin-top:.5rem;background:var(--surface)}
.cevap summary{cursor:pointer;padding:.75rem 1rem;display:flex;gap:.7rem;align-items:baseline;font-weight:600;line-height:1.4;list-style:none}
.cevap summary::-webkit-details-marker{display:none}
.cevap .isaret{flex:none;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;color:#fff;font-weight:800;font-size:.85rem;transform:translateY(2px)}
.cevap.dogru .isaret{background:#1E7B45}
.cevap.yanlis .isaret{background:#B3261E}
.cevap > div{padding:0 1rem .9rem 3.2rem}
.cevap p{margin:.45rem 0 0}
.cevap .sizin{color:#B3261E;font-weight:600}
.cevap .dogru-cevap{color:#1E7B45;font-weight:700}
@media (max-width:600px){.cevap > div{padding-left:1rem}}
