/* ==========================================================================
   DERDİNİ SEÇ · tanıtım sayfası (index.html #dert, js/acadex-dert.js), 08.11.2026
   Ekip notlarının yerine: öğrenci derdine dokunur, onu çözen Acadex aracını görür.
   Önek drt- (çıplak .on/.ust gibi sınıflar sayfadaki başka bölümlerle çakışıyordu).
   ========================================================================== */
.drt{background:#F6F7FB;color:#1A2A5C;font-family:'Instrument Sans',system-ui,sans-serif}
.drt,.drt *,.drt *::before,.drt *::after{box-sizing:border-box}
.drt-wrap{max-width:1120px;margin:0 auto;padding:120px 28px}
.drt-bas{display:grid;gap:12px;justify-items:center;text-align:center;margin-bottom:40px}
.drt-eyb{font:500 13px 'JetBrains Mono',monospace;letter-spacing:.08em;text-transform:uppercase;color:#4A5470}
.drt-h{margin:0;font:800 clamp(34px,5vw,60px)/1.02 'Bricolage Grotesque',sans-serif;letter-spacing:-.035em}
.drt-h em{font-style:normal;font-family:Caveat,cursive;font-weight:700;color:#2F6BFF;font-size:1.15em}
.drt-alt{margin:0;max-width:560px;font-size:18px;line-height:1.5;color:#4B5675}
/* dert kâğıtları */
.drt-secim{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 14px;margin:0 0 34px;padding:0;list-style:none}
.drt-c{--r:-1.2deg;--c:#FFE89A;display:inline-flex;align-items:center;gap:10px;min-height:52px;padding:10px 18px 10px 14px;border:2px solid #1A2A5C;border-radius:4px 10px 6px 9px;background:var(--c);color:#1A2A5C;font:600 16.5px 'Instrument Sans',sans-serif;cursor:pointer;transform:rotate(var(--r));box-shadow:3px 4px 0 #1A2A5C;transition:transform .25s cubic-bezier(.2,.9,.3,1.3),box-shadow .25s}
.drt-secim li:nth-child(2) .drt-c{--r:1.4deg;--c:#CFE7F5}
.drt-secim li:nth-child(3) .drt-c{--r:-.6deg;--c:#FBD5C6}
.drt-secim li:nth-child(4) .drt-c{--r:1deg;--c:#D6EDD9}
.drt-secim li:nth-child(5) .drt-c{--r:-1.6deg;--c:#E6DDF7}
.drt-secim li:nth-child(6) .drt-c{--r:.8deg;--c:#FCE3B9}
.drt-c:hover{transform:rotate(0) translateY(-3px);box-shadow:4px 6px 0 #1A2A5C}
.drt-c:focus-visible{outline:3px solid #2F6BFF;outline-offset:3px}
.drt-c[aria-pressed="true"]{transform:rotate(0) translateY(-5px) scale(1.04);box-shadow:5px 7px 0 #1A2A5C}
.drt-c i{width:20px;height:20px;flex:none;border:2px solid #1A2A5C;border-radius:50%;background:#fff;display:grid;place-items:center;font-style:normal;font-size:12px;font-weight:800}
.drt-c[aria-pressed="true"] i::before{content:"✓"}
/* cevap: defter sayfası */
.drt-cevap{position:relative;max-width:860px;margin:0 auto;min-height:250px}
.drt-k{position:relative;display:grid;grid-template-columns:120px minmax(0,1fr);gap:8px 28px;align-items:center;padding:40px 44px 34px 84px;background-color:#fff;background-image:linear-gradient(#E4EAF5 1px,transparent 1px);background-size:100% 32px;border:1px solid #DDE2EC;border-radius:4px;box-shadow:0 1px 0 #DDE2EC,0 26px 40px -30px rgba(13,24,56,.45)}
.drt-k::before{content:"";position:absolute;top:0;bottom:0;left:52px;width:1px;background:#F2B8B0}
.drt-k[hidden]{display:none}
.drt-k.drt-gel{animation:drtGel .45s cubic-bezier(.2,.9,.3,1.15) both}
@keyframes drtGel{from{opacity:0;transform:translateY(14px) rotate(.8deg)}}
.drt-tape{position:absolute;top:-14px;left:50%;width:110px;height:28px;margin-left:-55px;background:rgba(236,226,196,.85);transform:rotate(-3deg)}
.drt-ic{grid-row:span 4;width:120px;height:120px}
.drt-ic *{fill:none;stroke:#1A2A5C;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.drt-ic .dolu{fill:var(--k,#FFD86B)}
.drt-arac{font:500 13px 'JetBrains Mono',monospace;color:#5B6787;letter-spacing:.04em}
.drt-k h3{margin:0;font:800 clamp(26px,3vw,36px)/1.05 'Bricolage Grotesque',sans-serif;letter-spacing:-.03em}
.drt-k p{margin:0;font-size:17.5px;line-height:1.6;color:#33405F}
.drt-git{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;margin-top:8px}
.drt-btn{display:inline-flex;align-items:center;min-height:48px;padding:12px 22px;border-radius:999px;background:#2F6BFF;color:#fff;font-weight:600;text-decoration:none;transition:transform .2s,background .2s}
.drt-btn:hover,.drt-btn:focus-visible{background:#1F55E0;transform:translateY(-1px);color:#fff}
.drt-lnk{display:inline-flex;align-items:center;min-height:44px;color:#1A2A5C;font-weight:600;text-decoration:underline;text-decoration-color:#2F6BFF;text-underline-offset:4px}
.drt-not{position:absolute;right:-12px;bottom:-22px;padding:10px 14px;max-width:210px;background:#FFF6C8;border:1px solid #E9DA92;font:600 20px/1.1 Caveat,cursive;color:#1A2A5C;transform:rotate(3deg);box-shadow:0 10px 18px -12px rgba(13,24,56,.5)}
.drt-ipucu{margin:18px 0 0;text-align:center;font:600 22px Caveat,cursive;color:#6A7593}
@media (max-width:760px){
  .drt-wrap{padding:88px 18px}
  .drt-c{font-size:15px;min-height:48px;padding:8px 14px 8px 10px}
  .drt-k{grid-template-columns:minmax(0,1fr);padding:30px 20px 30px 40px}
  .drt-k::before{left:24px}
  .drt-ic{grid-row:auto;width:72px;height:72px;position:absolute;right:14px;top:18px}
  .drt-k h3{padding-right:76px}
  .drt-not{position:static;margin-top:10px;transform:rotate(-1deg);max-width:none}
}
@media (prefers-reduced-motion:reduce){.drt-c,.drt-k.drt-gel{transition:none;animation:none}}