/* ═══════════════════════════════════════════════════════════════════════════
   MDM Studio Academy — page styles (extends the shared site brand system).
   ═══════════════════════════════════════════════════════════════════════════ */
.acad-bar{display:flex;justify-content:flex-end;gap:10px;align-items:center;margin:-6px 0 18px}
.acad-hi{color:var(--ink-dim);font-size:14px;margin-right:4px}
.btn-sm{padding:7px 14px;font-size:13px}
.btn-ghost{border:1px solid var(--line);color:var(--ink-dim);background:transparent;border-radius:10px;cursor:pointer}
.btn-ghost:hover{color:var(--ink);border-color:rgba(120,150,220,.4)}

/* track cards */
.acad-tracks{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;margin:26px 0}
.acad-track{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:22px;position:relative}
.acad-track h3{margin:0 0 6px;font-size:17px;color:var(--ink);padding-right:104px}
.acad-track p{color:var(--ink-dim);font-size:13.5px;line-height:1.55;margin:0 0 14px}
.acad-track .soon{position:absolute;top:14px;right:14px;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-faint);border:1px solid var(--line);border-radius:999px;padding:3px 9px}
.acad-track .live{position:absolute;top:14px;right:14px;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#7ef0c8;background:rgba(16,185,129,.12);border:1px solid rgba(16,185,129,.35);border-radius:999px;padding:3px 9px}
.acad-track.is-soon{opacity:.62}
.acad-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px;margin:22px 0}
.acad-step{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:18px}
.acad-step b{color:var(--ink);display:block;margin-bottom:5px}
.acad-step span{color:var(--ink-dim);font-size:13px;line-height:1.5}
.acad-step .n{width:26px;height:26px;border-radius:8px;background:var(--grad);color:#04122a;font-weight:800;font-size:13px;display:flex;align-items:center;justify-content:center;margin-bottom:10px}

/* course */
.acad-progress{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:14px 18px;margin:18px 0;display:flex;align-items:center;gap:14px}
.acad-prog-track{flex:1;height:8px;border-radius:999px;background:rgba(120,150,220,.15);overflow:hidden}
#acad-prog-fill{height:100%;width:0;background:var(--grad);border-radius:999px;transition:width .3s}
#acad-prog-label{color:var(--ink-dim);font-size:12.5px;white-space:nowrap}
.acad-module{margin:34px 0 8px}
.acad-module h2{font-size:21px;margin:0 0 4px}
.acad-module .m-blurb{color:var(--ink-dim);font-size:14px;margin:0 0 16px}
.acad-lesson{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:20px 22px;margin-bottom:12px}
.acad-lesson h3{margin:0 0 10px;font-size:16px;color:var(--ink)}
.acad-lesson p,.acad-lesson li{color:var(--ink-dim);font-size:14px;line-height:1.65}
.acad-lesson b{color:var(--ink)}
.acad-lesson-foot{display:flex;gap:12px;align-items:center;margin-top:12px;flex-wrap:wrap}
.acad-lesson-foot a{color:var(--cyan);font-size:13px;text-decoration:none}
[data-lesson]{border:1px solid var(--line);background:transparent;color:var(--ink-dim);border-radius:9px;padding:7px 14px;font-size:13px;cursor:pointer}
[data-lesson]:hover{border-color:rgba(120,150,220,.45);color:var(--ink)}
[data-lesson].done{background:rgba(16,185,129,.12);border-color:rgba(16,185,129,.4);color:#7ef0c8;cursor:default}
[data-quiz]{margin:4px 0 10px}

/* modal + questions */
.acad-overlay{position:fixed;inset:0;background:rgba(3,7,20,.72);z-index:80;display:flex;align-items:center;justify-content:center;padding:18px;overflow-y:auto}
.acad-modal{background:#0d1836;border:1px solid rgba(120,150,220,.25);border-radius:16px;padding:26px;max-width:420px;width:100%;position:relative;max-height:92vh;overflow-y:auto}
.acad-modal.acad-wide{max-width:680px}
.acad-modal h3{margin:0 0 14px}
.acad-x{position:absolute;top:10px;right:14px;background:none;border:0;color:var(--ink-faint);font-size:22px;cursor:pointer}
.acad-tabs{display:flex;gap:6px;margin-bottom:16px;border-bottom:1px solid var(--line);padding-bottom:10px}
.acad-tabs button{background:none;border:0;color:var(--ink-dim);font-size:14px;padding:6px 12px;border-radius:8px;cursor:pointer}
.acad-tabs button.on{background:rgba(47,125,246,.18);color:#9ec3ff;font-weight:600}
.acad-f{margin-bottom:12px}
.acad-f label{display:block;font-size:12px;color:var(--ink-dim);margin-bottom:5px}
.acad-f input{width:100%;box-sizing:border-box;background:#0a1330;border:1px solid var(--line);border-radius:9px;color:var(--ink);padding:10px 12px;font-size:14px}
.acad-ck{display:flex;gap:8px;align-items:flex-start;color:var(--ink-dim);font-size:12.5px;margin-bottom:9px}
.acad-ck a{color:var(--cyan)}
.acad-go{width:100%;margin-top:8px}
.acad-err{color:#ff9d9d;font-size:12.5px;min-height:16px;margin-top:4px}
.acad-sent{color:var(--ink-dim);font-size:13.5px}
.acad-dim{color:var(--ink-faint);font-size:12.5px}
.acad-q{border:1px solid var(--line);border-radius:12px;padding:16px 18px;margin-bottom:12px;background:rgba(10,19,48,.5)}
.acad-q-stem{color:var(--ink);font-size:14.5px;line-height:1.55;margin:0 0 10px}
.acad-q-n{display:inline-flex;width:22px;height:22px;border-radius:7px;background:rgba(47,125,246,.2);color:#9ec3ff;font-size:12px;font-weight:700;align-items:center;justify-content:center;margin-right:9px}
.acad-q-multi{font-size:11px;color:var(--ink-faint);font-style:italic}
.acad-opt{display:flex;gap:10px;align-items:flex-start;padding:8px 10px;border-radius:8px;cursor:pointer;color:var(--ink-dim);font-size:13.5px;line-height:1.5}
.acad-opt:hover{background:rgba(120,150,220,.08)}
.acad-opt input{margin-top:3px}
.acad-opt.is-correct{background:rgba(16,185,129,.12);color:#a9f0d5}
.acad-opt.is-wrong{background:rgba(224,36,36,.12);color:#ffb4b4}
.acad-q.right{border-color:rgba(16,185,129,.45)}
.acad-q.wrong{border-color:rgba(224,36,36,.4)}
.acad-q-fb{font-size:12.5px;color:var(--ink-dim);line-height:1.55;margin-top:8px}
.acad-q-fb:empty{display:none}
.acad-q-fb a{color:var(--cyan)}
.acad-quiz-foot{display:flex;align-items:center;gap:14px;margin-top:4px}
.acad-score{color:var(--ink);font-weight:700}

/* exam */
.acad-exam-top{position:sticky;top:64px;z-index:20;display:flex;justify-content:space-between;align-items:center;background:#0d1836;border:1px solid var(--line);border-radius:12px;padding:12px 18px;margin-bottom:16px}
#acad-timer{font-family:ui-monospace,monospace;font-size:20px;font-weight:700;color:var(--ink)}
#acad-timer.low{color:#ffb4b4}
.acad-note{background:rgba(47,125,246,.1);border:1px solid rgba(47,125,246,.3);color:#b8d2ff;border-radius:10px;padding:12px 16px;font-size:13.5px;margin:12px 0;line-height:1.55}
.acad-note.ok{background:rgba(16,185,129,.1);border-color:rgba(16,185,129,.35);color:#a9f0d5}
.acad-note.warn{background:rgba(245,158,11,.1);border-color:rgba(245,158,11,.35);color:#ffd9a0}
.acad-note a{color:inherit}
.acad-result{text-align:center;border-radius:16px;padding:34px;border:1px solid var(--line);margin-bottom:22px}
.acad-result.pass{background:rgba(16,185,129,.08);border-color:rgba(16,185,129,.35)}
.acad-result.fail{background:rgba(245,158,11,.06);border-color:rgba(245,158,11,.3)}
.acad-result-score{font-size:46px;font-weight:800;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.acad-result h3{margin:6px 0}
.acad-result p{color:var(--ink-dim)}
.acad-cert-cta{display:flex;gap:10px;justify-content:center;margin:16px 0 10px;flex-wrap:wrap}
.acad-areas{margin:14px 0 26px}
.acad-area{display:flex;align-items:center;gap:12px;margin-bottom:9px}
.acad-area-name{width:110px;color:var(--ink-dim);font-size:13px;text-transform:capitalize}
.acad-area-bar{flex:1;height:9px;border-radius:999px;background:rgba(120,150,220,.14);overflow:hidden}
.acad-area-bar div{height:100%;border-radius:999px}
.acad-area-bar .good{background:linear-gradient(90deg,#2dd4bf,#2dd4ee)}
.acad-area-bar .weak{background:linear-gradient(90deg,#f59e0b,#ef4444)}
.acad-area-n{width:40px;text-align:right;color:var(--ink-dim);font-size:12.5px}

/* dashboard + verify */
.acad-table{width:100%;border-collapse:collapse;margin:10px 0 22px;font-size:13.5px}
.acad-table th{color:var(--ink-faint);text-align:left;font-size:11px;letter-spacing:.06em;text-transform:uppercase;padding:8px 10px;border-bottom:1px solid var(--line)}
.acad-table td{color:var(--ink-dim);padding:9px 10px;border-bottom:1px solid rgba(120,150,220,.08)}
.acad-cert-row{display:flex;justify-content:space-between;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:14px 18px;margin-bottom:10px;gap:12px;flex-wrap:wrap}
.acad-cert-row b{color:var(--ink)}
#acad-dash h3{margin:26px 0 10px}
.acad-vbox{display:flex;gap:10px;margin:18px 0;flex-wrap:wrap}
.acad-vbox input{flex:1;min-width:240px;background:#0a1330;border:1px solid var(--line);border-radius:10px;color:var(--ink);padding:12px 14px;font-size:15px;font-family:ui-monospace,monospace;letter-spacing:.06em;text-transform:uppercase}
@media(max-width:700px){.acad-exam-top{top:56px}}

/* Phase 3 — lab, tutor, cohorts */
.acad-tutor{background:linear-gradient(135deg,rgba(45,212,238,.06),rgba(139,92,246,.07));border:1px solid rgba(120,150,220,.25);border-radius:14px;padding:18px 20px;margin:20px 0}
.acad-tutor h3{margin:0 0 4px;font-size:16px}
.acad-tutor .acad-tutor-sub{color:var(--ink-dim);font-size:12.5px;margin:0 0 12px}
.acad-tutor-row{display:flex;gap:10px;flex-wrap:wrap}
.acad-tutor-row input{flex:1;min-width:220px;background:#0a1330;border:1px solid var(--line);border-radius:10px;color:var(--ink);padding:11px 13px;font-size:14px}
.acad-tutor-a{color:var(--ink);font-size:14px;line-height:1.65;margin:14px 0 10px;white-space:pre-wrap}
.acad-tutor-srcs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:6px}
.acad-tutor-src{border:1px solid var(--line);border-radius:999px;padding:5px 12px;font-size:12px;color:var(--cyan);text-decoration:none}
.acad-tutor-src span{color:var(--ink-faint)}
.acad-tutor-src:hover{border-color:rgba(45,212,238,.5)}
.acad-lab-ex{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:20px 22px;margin-bottom:12px}
.acad-lab-ex h3{margin:0 0 10px;font-size:16px;color:var(--ink)}
.acad-lab-ex ol,.acad-lab-ex ul{color:var(--ink-dim);font-size:14px;line-height:1.6;margin:8px 0;padding-left:22px}
.acad-lab-ex b{color:var(--ink)}
.acad-lab-check{background:rgba(16,185,129,.06);border:1px solid rgba(16,185,129,.25);border-radius:10px;padding:10px 16px;margin-top:10px}
.acad-lab-check .t{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#7ef0c8;margin-bottom:4px}
.acad-lab-req{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:22px;margin-top:30px}
.acad-lab-req textarea{width:100%;box-sizing:border-box;background:#0a1330;border:1px solid var(--line);border-radius:10px;color:var(--ink);padding:11px 13px;font-size:14px;min-height:70px;margin:8px 0}
.acad-lab-req input{width:100%;box-sizing:border-box;background:#0a1330;border:1px solid var(--line);border-radius:10px;color:var(--ink);padding:11px 13px;font-size:14px;margin:8px 0}

/* ── Prerequisites panel (wave E21b). The `recommends` field has been in the API since it was
   written and displayed by NOTHING, so no learner ever saw it. This is where it surfaces, together
   with what the course assumes and which module recaps it. Generated from the track data — never
   hand-edited on the page. */
.acad-prereq{background:linear-gradient(135deg,rgba(47,125,246,.10),rgba(139,92,246,.08));
  border:1px solid rgba(120,150,220,.28);border-radius:14px;padding:22px 24px;margin:0 0 34px}
.acad-prereq h3{margin:0 0 14px;font-size:15px;letter-spacing:.02em;text-transform:uppercase;
  color:var(--cyan,#2dd4ee)}
.acad-prereq .pq{display:grid;grid-template-columns:200px 1fr;gap:10px 22px;
  padding:9px 0;border-top:1px solid rgba(120,150,220,.14)}
.acad-prereq .pq:first-of-type{border-top:0;padding-top:0}
@media(max-width:700px){.acad-prereq .pq{grid-template-columns:1fr;gap:4px}}
.acad-prereq .pq-l{font-size:11.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-faint,#64748f);padding-top:2px}
.acad-prereq .pq ul{margin:0;padding-left:18px}
.acad-prereq .pq li{margin:2px 0;font-size:14.5px}
.acad-prereq .pq-none{margin:0;font-size:14.5px;color:var(--ink-dim,#9fb0d0)}
.acad-prereq-note{margin:14px 0 0;font-size:13px;color:var(--ink-dim,#9fb0d0)}
.acad-prereq-cover{margin:8px 0 0;font-size:13.5px}
/* A recap module is marked so it reads as optional at a glance — a learner who already has the
   Associate track should be able to see, without reading it, that it is skippable. */
.acad-module.recap{border-left:3px solid rgba(45,212,238,.45)}
.acad-module.recap > h2::after{content:'RECAP · OPTIONAL';display:inline-block;margin-left:12px;
  vertical-align:middle;font-size:10px;font-weight:700;letter-spacing:.16em;
  color:var(--cyan,#2dd4ee);border:1px solid rgba(45,212,238,.4);border-radius:999px;padding:3px 9px}
