/* ════════════════════════════════════════════════
   BENDITO INGLÉS  |  Test de nivel
   Hereda los tokens de style.css
   ════════════════════════════════════════════════ */

.tpage{
  background:
    radial-gradient(circle at 82% -8%,var(--gp) 0%,transparent 46%),
    radial-gradient(circle at 4% 102%,rgba(244,124,94,.10) 0%,transparent 42%),
    var(--wh);
  min-height:100vh;
  display:flex;flex-direction:column;
}
.tpage main{flex:1}

/* ─── Pasos ─── */
.tstep{display:none;padding:clamp(2.5rem,6vw,5rem) 0 clamp(3.5rem,7vw,6rem)}
.tstep.is-active{display:block;animation:stepIn .5s var(--ease) both}
@keyframes stepIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

.tnarrow{max-width:min(760px,100%);margin-inline:auto;width:var(--W)}

/* ════════ INTRO ════════ */
.ttitle{
  font-size:clamp(1.9rem,1.3rem + 2.6vw,3.4rem);
  font-weight:900;line-height:1.04;letter-spacing:-.035em;
  color:var(--g);margin-bottom:.9rem;text-wrap:balance;
}
.ttitle em{font-style:normal;color:var(--o)}
.tlead{font-size:1.02rem;line-height:1.7;margin-bottom:1.75rem}

.tfacts{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:1px;background:var(--brd);
  border:1px solid var(--brd);border-radius:var(--rm);
  overflow:hidden;margin-bottom:2.25rem;
}
.tfacts li{padding:1.1rem 1.2rem;background:var(--wh)}
.tfacts strong{display:block;font-size:1.3rem;font-weight:900;color:var(--g);line-height:1.2}
.tfacts span{font-size:.76rem;color:var(--mut)}

.tform{
  padding:clamp(1.4rem,3vw,2rem);
  border:1px solid var(--brd);border-radius:var(--rm);
  background:var(--wh);box-shadow:0 6px 32px rgba(13,26,23,.06);
  display:grid;gap:.95rem;
}
.tform-ttl{
  font-size:.98rem;font-weight:800;color:var(--txt);
  padding-bottom:.9rem;margin-bottom:.15rem;
  border-bottom:1px solid var(--brd);
}
.terr{
  font-size:.84rem;font-weight:600;color:var(--oh);
  padding:.6rem .8rem;border-radius:var(--r);
  background:var(--op);border-left:3px solid var(--oh);
}
.tmini{font-size:.76rem;color:var(--mut);text-align:center;margin-top:-.25rem}

/* ════════ TEST ════════ */
.tprog-bar{
  position:sticky;top:var(--HH);z-index:400;
  height:4px;background:var(--gp);
  margin-bottom:clamp(2rem,5vw,3.25rem);
}
.tprog-fill{
  height:100%;width:0;
  background:linear-gradient(90deg,var(--gm),var(--o));
  transition:width .45s var(--ease);
}

.tq-head{
  display:flex;align-items:center;justify-content:space-between;
  gap:1rem;padding-bottom:.8rem;margin-bottom:1.4rem;
  border-bottom:1px solid var(--brd);
}
.tq-count{
  font-family:'Space Grotesk',monospace;
  font-size:.78rem;font-weight:700;color:var(--mut);
  letter-spacing:.08em;text-transform:uppercase;
}
.tq-count strong{color:var(--o);font-size:1.05rem}
.tq-count i{font-style:normal;opacity:.6}
.tq-pts{
  font-size:.72rem;font-weight:700;color:var(--g);
  padding:.3rem .65rem;border-radius:var(--r);
  background:var(--gp);letter-spacing:.04em;
}

.tq-text{
  font-size:clamp(1.1rem,.95rem + .7vw,1.6rem);
  font-weight:700;line-height:1.4;color:var(--txt);
  letter-spacing:-.015em;margin-bottom:1.5rem;
}

/* Alternativas */
.topts{display:grid;gap:.6rem;margin-bottom:1.75rem}
.topt{
  display:flex;align-items:center;gap:.9rem;
  padding:.95rem 1.1rem;border-radius:var(--rm);
  border:1.5px solid var(--brd);background:var(--wh);
  text-align:left;width:100%;cursor:pointer;
  font-size:.98rem;font-weight:600;color:var(--txt);
  transition:border-color .2s,background .2s,transform .15s var(--ease);
}
.topt:hover{border-color:rgba(31,111,99,.4);background:var(--off);transform:translateX(3px)}
.topt-key{
  width:28px;height:28px;flex-shrink:0;
  display:grid;place-items:center;border-radius:var(--r);
  background:var(--gp);color:var(--g);
  font-size:.78rem;font-weight:800;
  transition:background .2s,color .2s;
}
.topt.sel{border-color:var(--g);background:var(--gp)}
.topt.sel .topt-key{background:var(--g);color:var(--wh)}

.tnav{display:flex;gap:.7rem;justify-content:space-between;margin-bottom:1.75rem}
.tnav .btn{min-width:140px}
.tnav .btn[disabled]{opacity:.35;pointer-events:none}

/* Mini-mapa de progreso */
.tdots{display:flex;flex-wrap:wrap;gap:4px;justify-content:center}
.tdot{
  width:100%;max-width:16px;height:4px;border-radius:2px;
  background:var(--brd);flex:1 1 10px;
  transition:background .3s;
}
.tdot.done{background:var(--gm)}
.tdot.now{background:var(--o)}

/* ════════ RESULTADO ════════ */
.tresult{
  text-align:center;padding:clamp(1.75rem,4vw,2.75rem);
  border:1px solid var(--brd);border-radius:var(--rm);
  background:var(--wh);box-shadow:0 10px 44px rgba(13,26,23,.08);
}
.tresult-logo{
  width:64px;height:64px;border-radius:var(--rm);
  margin:0 auto 1.1rem;object-fit:cover;
}
.tresult-kicker{
  font-size:.76rem;font-weight:700;color:var(--mut);
  letter-spacing:.12em;text-transform:uppercase;margin-bottom:.5rem;
}
.tscore{margin-bottom:1.2rem;line-height:1}
.tscore strong{
  font-size:clamp(3rem,2rem + 4vw,5rem);
  font-weight:900;color:var(--g);letter-spacing:-.04em;
}
.tscore span{display:block;font-size:.85rem;color:var(--mut);margin-top:.35rem}

.tlevel{
  display:inline-block;padding:.5rem 1.4rem;border-radius:var(--r);
  background:var(--o);color:var(--wh);
  font-size:1.5rem;font-weight:900;letter-spacing:.04em;
  box-shadow:0 6px 22px rgba(244,124,94,.32);
}
.tlevel-name{
  font-size:1.05rem;font-weight:800;color:var(--txt);
  margin:.85rem 0 .4rem;
}
.tlevel-desc{font-size:.94rem;line-height:1.65;max-width:46ch;margin:0 auto}

.tbreak{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:1px;background:var(--brd);
  border:1px solid var(--brd);border-radius:var(--rm);
  overflow:hidden;margin:1.75rem 0 1.25rem;
}
.tbreak div{padding:.9rem .6rem;background:var(--off)}
.tbreak b{display:block;font-size:1.25rem;font-weight:900;color:var(--g)}
.tbreak span{font-size:.72rem;color:var(--mut)}

.tsent{
  font-size:.82rem;color:var(--mut);
  padding:.6rem;border-radius:var(--r);background:var(--off);
  margin-bottom:1.4rem;
}
.tsent.ok{color:var(--g);background:var(--gp);font-weight:600}
.tsent.err{color:var(--oh);background:var(--op)}

.tresult-btns{display:flex;gap:.7rem;justify-content:center;flex-wrap:wrap}

/* Revisión */
.treview{margin-top:1.75rem}
.treview summary{
  cursor:pointer;font-size:.86rem;font-weight:700;color:var(--g);
  padding:.85rem 1.1rem;border-radius:var(--rm);
  border:1px solid var(--brd);background:var(--wh);
  list-style:none;
}
.treview summary::-webkit-details-marker{display:none}
.treview summary::before{content:'▸ ';color:var(--o)}
.treview[open] summary::before{content:'▾ '}
.treview-list{margin-top:.8rem;display:grid;gap:.5rem;padding-left:0;list-style:none}
.tr-item{
  padding:.85rem 1rem;border-radius:var(--rm);
  border:1px solid var(--brd);background:var(--wh);
  border-left:3px solid var(--brd);
}
.tr-item.ok{border-left-color:var(--gm)}
.tr-item.no{border-left-color:var(--o)}
.tr-q{font-size:.86rem;font-weight:600;color:var(--txt);margin-bottom:.4rem}
.tr-a{font-size:.8rem;color:var(--mut);display:block}
.tr-a b{color:var(--g);font-weight:700}
.tr-a.bad b{color:var(--oh)}

/* ─── Footer compacto ─── */
.tpage .foot{background:var(--blk)}
.tpage .foot-bot-inner{padding:1.4rem 0}

/* ─── Responsive ─── */
@media(max-width:640px){
  .tfacts{grid-template-columns:1fr}
  .tfacts li{display:flex;align-items:baseline;gap:.6rem}
  .fld-row{grid-template-columns:1fr}
  .tnav{flex-direction:column-reverse}
  .tnav .btn{width:100%}
  .tbreak{grid-template-columns:1fr}
  .tresult-btns .btn{width:100%}
}