/* Academia Digital Blockchain EnfocuX · Paleta B + dorado EnfocuX */
:root{
  --azul:#0b2f6e; --azul2:#0e49b5; --azul-prof:#061a3f; --tinta:#0c0f16;
  --rojo:#e8102e; --rojo2:#c40d27; --verde:#12a15f; --verde2:#17b978;
  --dorado:#e3ac2e; --dorado2:#f4c95d; --crema:#fffaf0; --papel:#fffdf7;
  --borde:#f0dfae; --sombra:0 10px 30px rgba(6,26,63,.18);
  --radio:18px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:"Segoe UI",system-ui,-apple-system,Roboto,"Helvetica Neue",Arial,sans-serif;color:#131a26;background:var(--crema);line-height:1.55}
img{max-width:100%;height:auto;display:block}
a{color:var(--azul2)}
.wrap{max-width:1180px;margin:0 auto;padding:0 18px}
/* ===== Cabecera ===== */
header.top{position:sticky;top:0;z-index:60;background:linear-gradient(90deg,var(--azul-prof),var(--azul) 55%,var(--azul2));color:#fff;box-shadow:0 4px 18px rgba(0,0,0,.35)}
.top-in{display:flex;align-items:center;gap:14px;padding:10px 18px;max-width:1180px;margin:0 auto}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:#fff;min-width:0}
.brand img{height:52px;width:auto}
.brand .bt{line-height:1.05}
.brand .bt b{font-size:1.45rem;letter-spacing:.3px;display:block}
.brand .bt span{color:var(--dorado2);font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:1.2px}
nav.main{display:flex;gap:4px;flex-wrap:wrap;margin-left:auto}
nav.main a{color:#eaf1ff;text-decoration:none;font-weight:600;font-size:.95rem;padding:9px 12px;border-radius:999px}
nav.main a:hover,nav.main a.act{background:rgba(255,255,255,.16);color:#fff}
.top-tools{display:flex;align-items:center;gap:10px;margin-left:8px}
.volver{color:#fff;text-decoration:none;font-weight:700;border:2px solid var(--dorado);padding:7px 14px;border-radius:999px;white-space:nowrap}
.volver:hover{background:var(--dorado);color:var(--tinta)}
select#lang{background:#fff;color:var(--tinta);border:2px solid var(--dorado);border-radius:999px;padding:7px 10px;font-weight:700;cursor:pointer}
@media(max-width:900px){nav.main{display:none}.brand .bt b{font-size:1.15rem}.brand img{height:42px}}
/* ===== Botones ===== */
.btn{display:inline-block;text-decoration:none;font-weight:800;border-radius:999px;padding:15px 28px;font-size:1.05rem;border:0;cursor:pointer;box-shadow:var(--sombra);transition:transform .12s ease, box-shadow .12s ease}
.btn:hover{transform:translateY(-2px)}
.btn-rojo{background:linear-gradient(180deg,#ff2440,var(--rojo) 55%,var(--rojo2));color:#fff}
.btn-azul{background:linear-gradient(180deg,var(--azul2),var(--azul));color:#fff}
.btn-dorado{background:linear-gradient(180deg,var(--dorado2),var(--dorado));color:var(--tinta)}
.btn-verde{background:linear-gradient(180deg,var(--verde2),var(--verde));color:#fff}
.btn-ghost{background:#fff;color:var(--azul);border:2px solid var(--azul)}
/* ===== Hero ===== */
.hero{background:radial-gradient(1100px 480px at 85% -10%,rgba(227,172,46,.35),transparent 60%),linear-gradient(160deg,var(--azul-prof) 0%,var(--azul) 52%,var(--azul2) 100%);color:#fff;padding:56px 0 64px;overflow:hidden}
.hero .kicker{color:var(--dorado2);font-weight:800;letter-spacing:1.6px;text-transform:uppercase;font-size:.85rem}
.hero h1{font-size:clamp(2.3rem,6vw,3.9rem);line-height:1.04;margin:.25em 0 .3em;font-weight:900}
.hero h1 .gold{color:var(--dorado2)}
.hero p.sub{font-size:clamp(1.05rem,2.4vw,1.3rem);max-width:760px;color:#e8efff}
.hero .logo-big{width:min(560px,100%);height:auto;margin:6px 0 18px;filter:drop-shadow(0 14px 30px rgba(0,0,0,.45))}
.hero .nota{background:rgba(255,255,255,.1);border-left:5px solid var(--dorado);padding:12px 16px;border-radius:10px;max-width:820px;color:#f5f8ff;font-size:.98rem;margin-top:22px}
.cta-row{display:flex;gap:14px;flex-wrap:wrap;margin-top:26px}
/* ===== Secciones ===== */
section.bloque{padding:58px 0}
section.bloque.azul{background:linear-gradient(170deg,var(--azul-prof),var(--azul) 70%);color:#fff}
section.bloque.claro{background:var(--papel)}
h2.titulo{font-size:clamp(1.8rem,4.4vw,2.7rem);line-height:1.1;margin:0 0 10px;font-weight:900}
h2.titulo .gold{color:var(--dorado)}
section.bloque.azul h2.titulo .gold{color:var(--dorado2)}
p.subt{font-size:1.08rem;max-width:840px;opacity:.92}
.chip{display:inline-block;background:var(--dorado);color:var(--tinta);font-weight:800;border-radius:999px;padding:4px 14px;font-size:.82rem;letter-spacing:.6px;text-transform:uppercase}
/* ===== Tarjetas ===== */
.grid{display:grid;gap:20px}
.grid.c3{grid-template-columns:repeat(3,1fr)}
.grid.c2{grid-template-columns:repeat(2,1fr)}
@media(max-width:900px){.grid.c3{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.grid.c3,.grid.c2{grid-template-columns:1fr}}
.card{background:#fff;border:2px solid var(--borde);border-radius:var(--radio);padding:22px;box-shadow:var(--sombra);cursor:pointer;position:relative}
.card img.iso{width:110px;height:110px;object-fit:cover;border-radius:14px;margin-bottom:12px;box-shadow:0 6px 16px rgba(6,26,63,.25)}
.card h3{margin:0 0 6px;font-size:1.22rem;color:var(--azul)}
.card p{margin:0;color:#2a3446}
.card .mas{margin-top:12px;font-weight:800;color:var(--rojo);display:none}
.card.abierta .mas{display:block}
.card .pista{font-size:.82rem;color:#7a6a2f;font-weight:700;margin-top:10px}
.card.azul{background:linear-gradient(165deg,var(--azul) 0%,var(--azul-prof) 90%);color:#fff;border-color:#2b4f96}
.card.azul h3{color:var(--dorado2)}
.card.azul p{color:#dbe7ff}
/* ===== Evidencia ===== */
.badge{display:inline-block;font-weight:900;font-size:.78rem;letter-spacing:.8px;border-radius:8px;padding:5px 10px;text-transform:uppercase}
.badge.real{background:var(--azul2);color:#fff}
.badge.meta{background:linear-gradient(180deg,var(--dorado2),var(--dorado));color:var(--tinta)}
.ev-cifra{font-size:clamp(1.7rem,3.6vw,2.4rem);font-weight:900;color:var(--azul);line-height:1.05;margin:10px 0 6px}
section.bloque.azul .ev-cifra{color:#fff}
.fuente{font-size:.86rem;color:#5a6480}
section.bloque.azul .fuente{color:#b9cdf5}
/* ===== Tablas ===== */
table{width:100%;border-collapse:collapse;background:#fff;border-radius:14px;overflow:hidden;box-shadow:var(--sombra)}
th{background:var(--azul);color:#fff;text-align:left;padding:12px 14px;font-size:.95rem}
td{padding:11px 14px;border-top:1px solid #eee3c2;vertical-align:top}
tr:nth-child(even) td{background:#fffaf0}
.precio{font-weight:900;color:var(--rojo);white-space:nowrap}
.etq{display:inline-block;background:#eef3ff;border:1px solid #c9d8ff;color:var(--azul);border-radius:999px;padding:2px 10px;font-size:.78rem;font-weight:700}
.etq.oro{background:#fdf3d7;border-color:var(--dorado);color:#7a5b00}
.etq.roja{background:#ffe9ec;border-color:#ffb3bf;color:var(--rojo2)}
/* ===== Método MMS ===== */
.mms{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
@media(max-width:800px){.mms{grid-template-columns:1fr}}
.mms .paso{border-radius:var(--radio);padding:24px;color:#fff;box-shadow:var(--sombra)}
.mms .paso h3{margin:0 0 8px;font-size:1.5rem;letter-spacing:1px}
.paso.mira{background:linear-gradient(160deg,var(--azul2),var(--azul-prof))}
.paso.mano{background:linear-gradient(160deg,var(--rojo),#8f0a1f)}
.paso.sello{background:linear-gradient(160deg,var(--verde2),#0a6e41)}
/* ===== Lienzo gemelo / lección ===== */
.gemelo{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media(max-width:860px){.gemelo{grid-template-columns:1fr}}
.lienzo{border-radius:var(--radio);padding:20px;box-shadow:var(--sombra);border:2px solid var(--borde);background:#fff}
.lienzo.agente{background:linear-gradient(170deg,#0d2f66,#071c40);color:#eaf1ff;border-color:#274b8f}
.lienzo h3{margin-top:0}
.correo{background:#fff;color:#1c2534;border-radius:12px;padding:14px 16px;margin:12px 0;border:1px solid #d8e2f5}
.lienzo.agente .correo{background:#0f2c5c;color:#eaf1ff;border-color:#2c4f92}
.correo .de{font-weight:800}
.correo .asunto{font-weight:700;color:var(--rojo)}
.lienzo.agente .correo .asunto{color:#ffb3bf}
.senal{background:#ffe9ec;border:1px dashed var(--rojo);color:#7c0d1d;border-radius:8px;padding:6px 10px;font-size:.88rem;margin-top:8px;display:none}
.senal.on{display:block}
.luz{display:flex;align-items:center;gap:10px;font-weight:800;margin:14px 0}
.luz .dot{width:22px;height:22px;border-radius:50%;background:#c8cedb;box-shadow:inset 0 -3px 6px rgba(0,0,0,.25)}
.luz.verde .dot{background:var(--verde2)}
.luz.ambar .dot{background:var(--dorado)}
.opciones{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
.opciones button{flex:1;min-width:130px}
.momento{display:none}
.momento.on{display:block}
.progreso{display:flex;gap:8px;margin:18px 0}
.progreso span{flex:1;text-align:center;padding:10px;border-radius:10px;background:#e9e2cd;color:#6b5d1e;font-weight:800}
.progreso span.on{background:var(--dorado);color:var(--tinta)}
.progreso span.ok{background:var(--verde);color:#fff}
.folio-box{background:linear-gradient(160deg,var(--azul-prof),var(--azul));color:#fff;border-radius:var(--radio);padding:22px;box-shadow:var(--sombra)}
.folio-box code{background:rgba(255,255,255,.15);padding:3px 8px;border-radius:6px;color:var(--dorado2);font-weight:800}
/* ===== Plataforma / expediente ===== */
.perfiles{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:20px}
.perfiles button.on{outline:3px solid var(--dorado)}
.mapa{display:grid;gap:12px}
.bloque-uc{display:flex;gap:14px;align-items:flex-start;background:#fff;border:2px solid var(--borde);border-radius:14px;padding:14px 16px;box-shadow:0 4px 14px rgba(6,26,63,.1)}
.bloque-uc .est{font-weight:900;border-radius:10px;padding:6px 10px;font-size:.8rem;white-space:nowrap}
.est.aprobado{background:var(--verde);color:#fff}
.est.curso{background:var(--dorado);color:var(--tinta)}
.est.pendiente{background:#dfe5f2;color:#43506b}
.barra{height:14px;background:#eee3c2;border-radius:99px;overflow:hidden}
.barra i{display:block;height:100%;background:linear-gradient(90deg,var(--verde2),var(--verde))}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
@media(max-width:800px){.kpis{grid-template-columns:1fr 1fr}}
.kpi{background:#fff;border:2px solid var(--borde);border-radius:14px;padding:16px;text-align:center;box-shadow:var(--sombra)}
.kpi b{font-size:1.7rem;color:var(--azul);display:block}
.aviso-demo{background:#fdf3d7;border:2px dashed var(--dorado);color:#6d5600;border-radius:12px;padding:10px 14px;font-weight:700;margin:16px 0}
/* ===== Verificar ===== */
.verify{display:flex;gap:10px;flex-wrap:wrap}
.verify input{flex:1;min-width:240px;padding:15px 18px;border-radius:999px;border:2px solid var(--azul);font-size:1.05rem;font-weight:700}
.resultado{margin-top:18px}
/* ===== Pie ===== */
footer{background:var(--tinta);color:#cfd8ec;padding:44px 0 30px;margin-top:0}
footer .cols{display:grid;grid-template-columns:2fr 1fr 1fr;gap:26px}
@media(max-width:800px){footer .cols{grid-template-columns:1fr}}
footer a{color:#eaf1ff;text-decoration:none;display:block;padding:3px 0}
footer h4{color:var(--dorado2);margin:0 0 10px}
footer .legal{border-top:1px solid #2a3350;margin-top:26px;padding-top:16px;font-size:.88rem;color:#93a3c4}
/* ===== T1 (asistente, no invasivo) ===== */
#t1{position:fixed;right:18px;bottom:18px;z-index:80}
#t1 .burbuja{width:60px;height:60px;border-radius:50%;border:3px solid var(--dorado);background:linear-gradient(160deg,var(--azul2),var(--azul-prof));color:#fff;font-weight:900;font-size:1.05rem;cursor:pointer;box-shadow:var(--sombra)}
#t1 .panel{display:none;width:min(330px,88vw);background:#fff;border:2px solid var(--borde);border-radius:16px;box-shadow:var(--sombra);overflow:hidden;margin-bottom:10px}
#t1.abierto .panel{display:block}
#t1 .panel header{background:var(--azul);color:#fff;padding:12px 16px;font-weight:800}
#t1 .panel .cuerpo{padding:14px 16px;font-size:.95rem}
#t1 .panel .chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
#t1 .panel .chips button{background:#eef3ff;border:1px solid #c9d8ff;border-radius:999px;padding:6px 12px;font-weight:700;cursor:pointer;color:var(--azul)}
#t1resp{margin-top:10px;background:#fffaf0;border-radius:10px;padding:10px 12px;display:none}
.oculto{display:none!important}
/* ===== Opciones de cuestionario — COLOR VIVO (corrección CEO 2026-11-10, 2ª vuelta) =====
   Por qué la vuelta anterior se seguía viendo BLANCA en el teléfono del CEO:
   (1) la «Lección en vivo» (leccion.html) nunca llevó las clases de la paleta: sus
       botones eran .btn-ghost blancos con radio 999px → círculos blancos gigantes;
   (2) en el aula MMS los tintes iban al 16–22 % sobre tarjeta blanca: una acuarela
       que a contraluz y en foto se lee blanca, y el radio 999px convertía las
       opciones altas en cápsulas ilegibles;
   (3) la hoja de estilos viajaba «caché primero» en el service worker: la primera
       visita tras un cambio seguía sirviendo la hoja anterior.
   Ahora: TARJETAS de verdad (radio 18px, texto a la izquierda, punto grande),
   degradados con cuerpo que se ven en una foto, tinte de fondo por momento
   (Prueba azul · Ensayos ámbar · Evaluación morado), micro-movimiento sobrio
   y en móvil las opciones van a ancho completo, una por fila. */
html{scroll-padding-top:96px}
@media(max-width:900px){html{scroll-padding-top:148px}}
@supports (overflow:clip){html,body{overflow-x:clip}}
/* forma de tarjeta común a toda opción del motor de cuestionarios */
.preg .opciones .op,.opciones [data-ord],.opciones [data-prueba],.opciones [data-prueba2]{
  border-radius:18px;text-align:left;padding:15px 17px;line-height:1.35;
  display:flex;align-items:center;gap:11px}
.preg .opciones .op{position:relative;color:#0c1a30;border:2.5px solid;font-weight:800;
  box-shadow:0 4px 12px rgba(6,26,63,.13);
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease}
.preg .opciones .op::before{content:"";flex:none;width:14px;height:14px;border-radius:50%;
  box-shadow:inset 0 -2px 3px rgba(0,0,0,.28),0 0 0 3px rgba(255,255,255,.55)}
.preg .opciones .op.opc-0{background:linear-gradient(180deg,#d6e9ff,#a8d0ff);border-color:#2f7fe0}
.preg .opciones .op.opc-0::before{background:#2f7fe0}
.preg .opciones .op.opc-1{background:linear-gradient(180deg,#ffe7c4,#ffd08a);border-color:#dd7f02}
.preg .opciones .op.opc-1::before{background:#dd7f02}
.preg .opciones .op.opc-2{background:linear-gradient(180deg,#e9e2ff,#cdb9ff);border-color:#7c4dff}
.preg .opciones .op.opc-2::before{background:#7c4dff}
.preg .opciones .op.opc-3{background:linear-gradient(180deg,#fff3b0,#ffe066);border-color:#c99300}
.preg .opciones .op.opc-3::before{background:#c99300}
.preg .opciones .op:hover:not(:disabled){transform:translateY(-3px) scale(1.02);box-shadow:0 14px 24px rgba(6,26,63,.24)}
.preg .opciones .op.opc-0:hover:not(:disabled){background:linear-gradient(180deg,#bcd9ff,#8fc2ff)}
.preg .opciones .op.opc-1:hover:not(:disabled){background:linear-gradient(180deg,#ffdca3,#ffbe5c)}
.preg .opciones .op.opc-2:hover:not(:disabled){background:linear-gradient(180deg,#d9ccff,#b79aff)}
.preg .opciones .op.opc-3:hover:not(:disabled){background:linear-gradient(180deg,#ffec8a,#ffd93b)}
.preg .opciones .op:active:not(:disabled){transform:translateY(-1px) scale(.98)}
.preg .opciones .op:focus-visible{outline:3px solid var(--dorado);outline-offset:2px}
.preg .opciones .op:disabled{opacity:.55;transform:none;box-shadow:none;cursor:default}
/* lección de muestra (leccion.html): sus botones de PRUEBA no llevan clase de paleta;
   reciben el mismo color por posición dentro de su .opciones */
.opciones [data-prueba],.opciones [data-prueba2]{border:2.5px solid;color:#0c1a30;font-weight:800;
  box-shadow:0 4px 12px rgba(6,26,63,.13);
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease}
.opciones [data-prueba]::before,.opciones [data-prueba2]::before{content:"";flex:none;width:14px;height:14px;
  border-radius:50%;box-shadow:inset 0 -2px 3px rgba(0,0,0,.28),0 0 0 3px rgba(255,255,255,.55)}
.opciones [data-prueba]:nth-child(1),.opciones [data-prueba2]:nth-child(1){background:linear-gradient(180deg,#d6e9ff,#a8d0ff);border-color:#2f7fe0}
.opciones [data-prueba]:nth-child(1)::before,.opciones [data-prueba2]:nth-child(1)::before{background:#2f7fe0}
.opciones [data-prueba]:nth-child(2),.opciones [data-prueba2]:nth-child(2){background:linear-gradient(180deg,#ffe7c4,#ffd08a);border-color:#dd7f02}
.opciones [data-prueba]:nth-child(2)::before,.opciones [data-prueba2]:nth-child(2)::before{background:#dd7f02}
.opciones [data-prueba]:nth-child(3),.opciones [data-prueba2]:nth-child(3){background:linear-gradient(180deg,#e9e2ff,#cdb9ff);border-color:#7c4dff}
.opciones [data-prueba]:nth-child(3)::before,.opciones [data-prueba2]:nth-child(3)::before{background:#7c4dff}
.opciones [data-prueba]:nth-child(4),.opciones [data-prueba2]:nth-child(4){background:linear-gradient(180deg,#fff3b0,#ffe066);border-color:#c99300}
.opciones [data-prueba]:nth-child(4)::before,.opciones [data-prueba2]:nth-child(4)::before{background:#c99300}
.opciones [data-prueba]:hover,.opciones [data-prueba2]:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 14px 24px rgba(6,26,63,.24)}
.opciones [data-prueba]:active,.opciones [data-prueba2]:active{transform:translateY(-1px) scale(.98)}
/* pool de pasos del ENSAYO «ordena»: color rotado por posición, con cuerpo */
.opciones [data-ord]{border:2.5px solid #2f7fe0;background:linear-gradient(180deg,#d6e9ff,#a8d0ff);color:#0c1a30;
  font-weight:800;box-shadow:0 4px 12px rgba(6,26,63,.13);
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease}
.opciones [data-ord]:nth-child(4n+2){background:linear-gradient(180deg,#ffe7c4,#ffd08a);border-color:#dd7f02}
.opciones [data-ord]:nth-child(4n+3){background:linear-gradient(180deg,#e9e2ff,#cdb9ff);border-color:#7c4dff}
.opciones [data-ord]:nth-child(4n){background:linear-gradient(180deg,#fff3b0,#ffe066);border-color:#c99300}
.opciones [data-ord]:hover:not(:disabled){transform:translateY(-3px) scale(1.02);box-shadow:0 14px 24px rgba(6,26,63,.24)}
.opciones [data-ord]:focus-visible{outline:3px solid var(--dorado);outline-offset:2px}
.opciones [data-ord]:disabled{opacity:.6;transform:none;box-shadow:none}
/* la zona de la pregunta respira: panel suave dentro de la tarjeta y tinte por momento */
.preg{background:rgba(255,255,255,.66);border:1.5px solid rgba(11,47,110,.10);border-radius:16px;padding:14px 16px}
.card:has([data-quiz="pr"]){background:linear-gradient(180deg,#f2f8ff,#e0efff);border-color:#b9d4fb}
.card:has([data-quiz^="eq"]){background:linear-gradient(180deg,#fffaf0,#ffefc4);border-color:#ecd28a}
.card:has([data-quiz="ev"]){background:linear-gradient(180deg,#f6f2ff,#e9e1ff);border-color:#cdbcf7}
#m1 .card{background:linear-gradient(180deg,#f2f8ff,#e0efff);border-color:#b9d4fb}
#m2 .lienzo:not(.agente){background:linear-gradient(180deg,#fffdf7,#ffefc9)}
#m3 .correo{border-color:#c9b8f5}
#m1 h2.titulo{border-left:6px solid var(--azul2);padding-left:12px}
#m2 h2.titulo{border-left:6px solid var(--dorado);padding-left:12px}
#m3 h2.titulo{border-left:6px solid #7c4dff;padding-left:12px}
/* dinamismo sobrio: entrada de cada pregunta y gesto al revelar */
@keyframes enf-entra{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.preg{animation:enf-entra .38s ease both}
.preg:nth-of-type(2){animation-delay:.06s}
.preg:nth-of-type(3){animation-delay:.12s}
.preg:nth-of-type(4){animation-delay:.18s}
.momento.on{animation:enf-entra .3s ease both}
@keyframes enf-pop{0%{transform:scale(1)}55%{transform:scale(1.06)}100%{transform:scale(1.03)}}
@keyframes enf-sac{0%,100%{transform:translateX(0)}25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
.preg .opciones .op.sel-bien,.opciones [data-ord].sel-bien{animation:enf-pop .32s ease}
.preg .opciones .op.sel-mal{animation:enf-sac .3s ease}
/* en móvil, las opciones de responder van a ancho completo: una por fila, sin cápsulas */
@media(max-width:620px){
  .preg .opciones,#m1 .opciones{flex-direction:column}
  .preg .opciones .op,.opciones [data-prueba],.opciones [data-prueba2]{width:100%;flex:none}
}
@media (prefers-reduced-motion: reduce){
  .preg .opciones .op,.opciones [data-ord],.opciones [data-prueba],.opciones [data-prueba2]{transition:none}
  .preg .opciones .op:hover:not(:disabled),.opciones [data-ord]:hover:not(:disabled){transform:none}
  .preg,.momento.on,.preg .opciones .op.sel-bien,.preg .opciones .op.sel-mal,.opciones [data-ord].sel-bien{animation:none}
}

/* ===== RESPONSIVE CABECERA/TABLAS — corrección CEO 2026-11-11 (frente web) =====
   La cabecera ya no se monta ni se corta en teléfono: la fila envuelve, la
   marca cede espacio (min-width:0) y las herramientas (Volver + idioma) no se
   encogen; a 420px o menos bajan a su propia fila, alineadas a la derecha.
   Las tablas nunca empujan la página: se desplazan dentro de su propio marco.
   Verificado con render a 360/390/768/834/1280 (scrollWidth = clientWidth). */
.top-in{flex-wrap:wrap}
.brand{flex:1 1 auto}
.brand .bt{min-width:0}
.top-tools{flex:0 0 auto}
@media(max-width:900px){html{scroll-padding-top:120px}}
@media(max-width:560px){
  .top-in{gap:8px 10px;padding:10px 12px}
  .brand{gap:9px}
  .brand img{height:38px}
  .brand .bt b{font-size:1.04rem;white-space:nowrap}
  .brand .bt span{font-size:.63rem;letter-spacing:.6px}
  .top-tools{gap:8px;margin-left:auto}
  .volver{padding:6px 11px;font-size:.92rem}
  select#lang{padding:6px 8px;font-size:.92rem}
  .hero{padding:40px 0 48px}
  .hero .kicker{font-size:.78rem;letter-spacing:1px}
  .hero .logo-big{width:min(400px,88%);margin:6px auto 16px}
  section.bloque{padding:42px 0}
}
@media(max-width:420px){
  .top-tools{flex:1 1 100%;justify-content:flex-end;margin-left:0}
  html{scroll-padding-top:150px}
}
@media(max-width:820px){
  table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
  th,td{padding:9px 10px}
}
@media(max-width:560px){th,td{font-size:.88rem}}
footer a{padding:6px 0}