/* Cátedra — estilos compartidos. © Carlo · Dev */
:root{--suave2:#FFF1C2;--hueco2:#EEE7D6;--osc:#0E1A3A;--sobre:#0E1A3A;--hueco:var(--hueco);--suave:var(--suave);--tinta:#0E1A3A;--tinta2:#1B2B57;--crema:#FBF7EE;--papel:#fff;--ambar:#FFB703;--ambar2:#E59F00;--ok:#16A34A;--mal:#DC2626;--gris:#5B6478;--linea:#E6DFCE;--sombra:0 18px 40px -22px rgba(14,26,58,.45);--r:18px;--serif:"Fraunces",Georgia,serif;--sans:"Plus Jakarta Sans",system-ui,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font:16px/1.55 var(--sans);color:var(--tinta);background:var(--crema);-webkit-font-smoothing:antialiased;overflow-x:hidden}
h1,h2,h3{font-family:var(--serif);line-height:1.08;margin:0;letter-spacing:-.01em}
h1{font-size:clamp(2.2rem,6.4vw,4.4rem);font-weight:800}h2{font-size:clamp(1.7rem,4vw,2.7rem);font-weight:700}h3{font-size:1.2rem}
p{margin:0}a{color:inherit}img,svg{max-width:100%}
.w{width:min(1160px,100% - 32px);margin:0 auto}
em{font-style:italic;color:var(--ambar2)}
.kick{display:inline-block;font:700 .74rem var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--ambar2);margin-bottom:10px}
.btn{display:inline-flex;align-items:center;gap:8px;border:0;cursor:pointer;font:700 .98rem var(--sans);padding:13px 22px;border-radius:999px;background:var(--ambar);color:var(--sobre);text-decoration:none;transition:transform .2s,box-shadow .2s,background .2s;min-height:46px}
.btn:hover{transform:translateY(-2px);box-shadow:0 10px 22px -10px rgba(255,183,3,.9)}
.btn:active{transform:none}.btn.osc{background:var(--osc);color:#fff}.btn.osc:hover{box-shadow:0 10px 22px -10px rgba(14,26,58,.7)}
.btn.lin{background:transparent;border:2px solid var(--tinta);color:var(--tinta)}.btn.lin:hover{background:var(--osc);color:#fff}
.btn[disabled]{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}.btn.chico{padding:8px 16px;min-height:38px;font-size:.88rem}
:focus-visible{outline:3px solid var(--ambar);outline-offset:2px}
/* barra */
.nav{position:sticky;top:0;z-index:30;background:rgba(251,247,238,.88);backdrop-filter:blur(12px);border-bottom:1px solid var(--linea)}
.nav .w{display:flex;align-items:center;gap:18px;height:64px}
.logo{font:800 1.35rem var(--serif);text-decoration:none;display:flex;align-items:center;gap:8px}
.logo i{width:30px;height:30px;border-radius:9px;background:var(--osc);color:var(--ambar);display:grid;place-items:center;font:800 1rem var(--serif);font-style:normal}
.nav nav{margin-left:auto;display:flex;gap:6px;align-items:center}
.nav nav a:not(.btn){padding:8px 12px;border-radius:999px;text-decoration:none;font-weight:600;font-size:.92rem;color:var(--tinta2)}
.nav nav a:not(.btn):hover{background:rgba(14,26,58,.07)}
.burger{display:none;margin-left:auto;background:none;border:0;font-size:1.6rem;min-width:44px;min-height:44px;cursor:pointer}
.progreso{position:fixed;left:0;top:0;height:3px;width:100%;background:var(--ambar);transform:scaleX(var(--p,0));transform-origin:0 50%;z-index:60}
@media(max-width:820px){.burger{display:block}.nav nav{position:absolute;top:64px;left:0;right:0;background:var(--crema);flex-direction:column;align-items:stretch;padding:12px 16px 18px;border-bottom:1px solid var(--linea);display:none}.nav nav.on{display:flex}.nav nav a{padding:12px!important}}
/* héroe */
.hero{position:relative;background:var(--osc);color:#fff;overflow:hidden;padding:clamp(48px,9vw,110px) 0 clamp(60px,9vw,120px)}
.hero .w{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center;position:relative;z-index:2}
.hero p.sub{font-size:1.14rem;color:#C9D2EC;margin:20px 0 28px;max-width:34em}
.hero .acc{display:flex;gap:12px;flex-wrap:wrap}
.hero .btn.lin{border-color:#fff;color:#fff}.hero .btn.lin:hover{background:#fff;color:#0E1A3A}
.hero .gar{margin-top:26px;display:flex;gap:18px;flex-wrap:wrap;color:#9FB0DB;font-size:.9rem}
.hero .gar span::before{content:"✓ ";color:var(--ambar);font-weight:800}
.glifo{position:absolute;font:700 var(--s,3rem) var(--serif);color:rgba(255,183,3,.14);animation:flota var(--t,9s) ease-in-out infinite alternate;user-select:none;pointer-events:none}
@keyframes flota{from{transform:translateY(0) rotate(-6deg)}to{transform:translateY(-26px) rotate(7deg)}}
.tarjeta-h{background:var(--papel);color:var(--tinta);border-radius:24px;padding:22px;box-shadow:0 40px 70px -30px #000;transform:rotate(2deg);animation:entra 1s .2s both cubic-bezier(.2,.8,.2,1)}
@keyframes entra{from{opacity:0;transform:translateY(40px) rotate(6deg)}}
.tarjeta-h .fila{display:flex;align-items:center;gap:14px;padding:12px 0;border-top:1px solid var(--linea)}
.tarjeta-h .fila:first-of-type{border:0}
.tarjeta-h b{display:block;font-size:.95rem}.tarjeta-h small{color:var(--gris)}
.barra{height:8px;background:var(--hueco2);border-radius:99px;overflow:hidden;flex:1}
.barra i{display:block;height:100%;width:var(--w,0);background:linear-gradient(90deg,var(--ambar),#FF8A00);border-radius:99px;transition:width 1.2s cubic-bezier(.2,.8,.2,1)}
.ico{width:44px;height:44px;border-radius:13px;display:grid;place-items:center;color:#fff;font:800 1.05rem var(--serif);flex:none;background:var(--c,var(--tinta))}
@media(max-width:820px){.hero .w{grid-template-columns:1fr}.tarjeta-h{transform:none}}
/* secciones */
section{padding:clamp(54px,8vw,96px) 0}
.cab{max-width:46em;margin-bottom:34px}.cab p{color:var(--gris);margin-top:12px;font-size:1.05rem}
.cifras{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:-52px;position:relative;z-index:3}
.cifras div{background:var(--papel);border-radius:var(--r);padding:20px;box-shadow:var(--sombra);text-align:center}
.cifras b{display:block;font:800 2.2rem var(--serif)}.cifras span{color:var(--gris);font-size:.9rem}
@media(max-width:640px){.cifras{grid-template-columns:repeat(2,1fr);margin-top:-36px}}
.filtro{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:22px}
.filtro button{border:1.5px solid var(--linea);background:var(--papel);padding:9px 16px;border-radius:99px;font:600 .9rem var(--sans);cursor:pointer;min-height:42px;transition:.2s}
.filtro button.on,.filtro button:hover{background:var(--osc);color:#fff;border-color:var(--osc)}
.cursos{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media(max-width:960px){.cursos{grid-template-columns:repeat(2,1fr)}}@media(max-width:600px){.cursos{grid-template-columns:1fr}}
.curso{background:var(--papel);border:1px solid var(--linea);border-radius:var(--r);padding:22px;display:flex;flex-direction:column;gap:12px;transition:transform .25s,box-shadow .25s;position:relative;overflow:hidden}
.curso::before{content:"";position:absolute;inset:0 0 auto 0;height:5px;background:var(--c)}
.curso:hover{transform:translateY(-5px);box-shadow:var(--sombra)}
.curso .meta{display:flex;gap:10px;flex-wrap:wrap;color:var(--gris);font-size:.84rem}
.curso p{color:var(--gris);font-size:.95rem;flex:1}
.etq{display:inline-block;padding:3px 10px;border-radius:99px;font-size:.74rem;font-weight:700;background:var(--hueco2);color:var(--tinta2)}
.etq.ok{background:#DCFCE7;color:#166534}.etq.al{background:#FEF3C7;color:#92400E}.etq.rj{background:#FEE2E2;color:#991B1B}
.pasos{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;counter-reset:p}
@media(max-width:860px){.pasos{grid-template-columns:repeat(2,1fr)}}@media(max-width:520px){.pasos{grid-template-columns:1fr}}
.paso{background:var(--papel);border-radius:var(--r);padding:22px;border:1px solid var(--linea);counter-increment:p}
.paso::before{content:counter(p);display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--ambar);font:800 1.1rem var(--serif);margin-bottom:12px}
.paso p{color:var(--gris);font-size:.94rem;margin-top:6px}
.oscuro{background:var(--osc);color:#fff}.oscuro .cab p{color:#B7C3E6}
.uni{display:grid;grid-template-columns:1fr 1fr;gap:34px;align-items:center}
@media(max-width:820px){.uni{grid-template-columns:1fr}}
.lista{list-style:none;padding:0;margin:22px 0 0;display:grid;gap:12px}
.lista li{display:flex;gap:12px;color:#D5DDF3}.lista li::before{content:"✓";color:var(--ambar);font-weight:800}
.mini-panel{background:var(--papel);color:var(--tinta);border-radius:22px;padding:20px;box-shadow:0 40px 70px -30px #000}
.mini-panel .fila{display:grid;grid-template-columns:1fr 120px 54px;gap:10px;align-items:center;padding:9px 0;border-top:1px solid var(--linea);font-size:.9rem}
.mini-panel .fila:first-of-type{border:0}
.planes{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;align-items:stretch}
@media(max-width:860px){.planes{grid-template-columns:1fr}}
.plan{background:var(--papel);border:1.5px solid var(--linea);border-radius:22px;padding:26px;display:flex;flex-direction:column;gap:14px;position:relative}
.plan.top{background:var(--osc);color:#fff;border-color:var(--tinta);transform:translateY(-8px)}
.plan.top::after{content:"Más elegido";position:absolute;top:-13px;left:24px;background:var(--ambar);color:var(--sobre);font:800 .72rem var(--sans);padding:5px 12px;border-radius:99px;letter-spacing:.06em}
@media(max-width:860px){.plan.top{transform:none}}
.plan .pr{font:800 2.6rem var(--serif)}.plan .pr small{font:500 .9rem var(--sans);opacity:.7}
.plan ul{list-style:none;padding:0;margin:0;display:grid;gap:8px;flex:1;font-size:.94rem}
.plan li::before{content:"✓ ";color:var(--ok);font-weight:800}.plan.top li::before{color:var(--ambar)}
.faq details{background:var(--papel);border:1px solid var(--linea);border-radius:14px;padding:16px 20px;margin-bottom:10px}
.faq summary{font-weight:700;cursor:pointer;min-height:28px}.faq p{margin-top:10px;color:var(--gris)}
footer{background:var(--osc);color:#9FB0DB;padding:34px 0;font-size:.9rem}
footer .w{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap}
/* revelado */
.rv{opacity:0;transform:translateY(26px);transition:opacity .7s cubic-bezier(.2,.8,.2,1),transform .7s cubic-bezier(.2,.8,.2,1);transition-delay:calc(var(--d,0)*70ms)}
.rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}.glifo,.tarjeta-h{animation:none}*{scroll-behavior:auto!important}}
/* modal / formulario */
.fondo{position:fixed;inset:0;background:rgba(14,26,58,.62);backdrop-filter:blur(4px);display:none;align-items:center;justify-content:center;z-index:80;padding:16px}
.fondo.on{display:flex}
.modal{background:var(--papel);border-radius:24px;padding:28px;width:min(440px,100%);max-height:94vh;overflow:auto;animation:entra .4s both;position:relative}
.modal .x{position:absolute;right:10px;top:10px;background:none;border:0;font-size:1.5rem;min-width:44px;min-height:44px;cursor:pointer}
.campo{display:grid;gap:6px;margin:14px 0}.campo label{font-weight:700;font-size:.88rem}
.campo input,.campo select,.campo textarea{font:inherit;padding:12px 14px;border:1.5px solid var(--linea);border-radius:12px;background:var(--papel);color:var(--tinta);min-height:46px;width:100%}
.campo input:focus,.campo select:focus,.campo textarea:focus{outline:none;border-color:var(--ambar);box-shadow:0 0 0 3px rgba(255,183,3,.3)}
.campo .err{color:var(--mal);font-size:.84rem;min-height:1em}
.nota-demo{background:var(--suave);border:1px dashed var(--ambar2);border-radius:12px;padding:10px 14px;font-size:.86rem;color:#6B4E00}
.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,30px);background:var(--osc);color:#fff;padding:12px 20px;border-radius:99px;opacity:0;transition:.35s;z-index:90;font-weight:600;max-width:92vw;text-align:center}
.toast.on{opacity:1;transform:translate(-50%,0)}
/* ===== aula ===== */
.barra-aula{background:var(--osc);color:#fff}.barra-aula .w{display:flex;align-items:center;gap:14px;height:64px}
.barra-aula .logo{color:#fff}.barra-aula .logo i{background:var(--ambar);color:var(--sobre)}
.yo{margin-left:auto;display:flex;align-items:center;gap:12px;font-size:.9rem}
.yo .av{width:36px;height:36px;border-radius:50%;background:var(--ambar);color:var(--sobre);display:grid;place-items:center;font-weight:800}
.yo small{display:block;color:#9FB0DB;font-size:.78rem;line-height:1.1}
.yo .quien{line-height:1.2}
@media(max-width:560px){.yo .quien{display:none}}
.saludo{padding:30px 0 10px}.saludo h1{font-size:clamp(1.8rem,4.6vw,2.8rem)}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:20px 0}
@media(max-width:700px){.kpis{grid-template-columns:repeat(2,1fr)}}
.kpi{background:var(--papel);border:1px solid var(--linea);border-radius:16px;padding:16px}
.kpi b{display:block;font:800 1.9rem var(--serif)}.kpi span{color:var(--gris);font-size:.85rem}
.sigue{background:var(--osc);color:#fff;border-radius:22px;padding:24px;display:flex;gap:18px;align-items:center;flex-wrap:wrap;margin-bottom:26px;position:relative;overflow:hidden}
.sigue::after{content:"";position:absolute;right:-40px;top:-60px;width:220px;height:220px;border-radius:50%;background:radial-gradient(var(--ambar),transparent 65%);opacity:.25}
.sigue .tx{flex:1;min-width:220px;position:relative;z-index:1}.sigue small{color:#9FB0DB}
.sigue .btn{position:relative;z-index:1}
@property --p{syntax:"<number>";inherits:false;initial-value:0}
.anillo{--p:0;width:64px;height:64px;border-radius:50%;background:conic-gradient(var(--c,var(--ambar)) calc(var(--p)*1%),var(--hueco2) 0);display:grid;place-items:center;flex:none;transition:--p 1s}
.anillo::before{content:attr(data-t);width:48px;height:48px;border-radius:50%;background:var(--papel);display:grid;place-items:center;font:800 .82rem var(--sans);color:var(--tinta)}
.mi-curso{background:var(--papel);border:1px solid var(--linea);border-radius:var(--r);padding:18px;display:flex;gap:14px;align-items:center;text-decoration:none;transition:.25s}
.mi-curso:hover{transform:translateY(-3px);box-shadow:var(--sombra)}
.mi-curso .tx{flex:1;min-width:0}.mi-curso small{color:var(--gris)}
.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}@media(max-width:700px){.grid2{grid-template-columns:1fr}}
.sub-t{font:800 1.4rem var(--serif);margin:30px 0 14px}
/* curso */
.vista{display:grid;grid-template-columns:320px 1fr;gap:24px;padding:22px 0 60px;align-items:start}
@media(max-width:900px){.vista{grid-template-columns:1fr}}
.lateral{background:var(--papel);border:1px solid var(--linea);border-radius:var(--r);padding:14px;position:sticky;top:12px;max-height:calc(100vh - 24px);overflow:auto}
@media(max-width:900px){.lateral{position:static;max-height:none}}
.lateral h3{padding:6px 8px 4px}.mod-t{font:700 .78rem var(--sans);text-transform:uppercase;letter-spacing:.08em;color:var(--gris);padding:12px 8px 4px}
.lec{display:flex;gap:10px;align-items:center;width:100%;text-align:left;background:none;border:0;border-radius:12px;padding:10px;cursor:pointer;font:inherit;color:inherit;min-height:46px}
.lec:hover{background:var(--hueco)}.lec.on{background:var(--suave2)}
.lec .pt{width:22px;height:22px;border-radius:50%;border:2px solid var(--linea);flex:none;display:grid;place-items:center;font-size:.7rem;font-weight:800;color:#fff}
.lec.hecha .pt{background:var(--ok);border-color:var(--ok)}.lec.hecha .pt::before{content:"✓"}
.lec small{display:block;color:var(--gris);font-size:.78rem}
.lec.ex .pt{background:var(--ambar);border-color:var(--ambar);color:var(--sobre)}
.lec[disabled]{opacity:.5;cursor:not-allowed}
.escena{background:var(--osc);border-radius:22px;aspect-ratio:16/9;position:relative;overflow:hidden;color:#fff;display:flex;flex-direction:column;justify-content:center;padding:clamp(18px,4vw,44px)}
@media(max-width:600px){.escena{aspect-ratio:auto;min-height:320px}}
.escena .glifo{font-size:9rem;right:4%;top:6%;color:rgba(255,183,3,.12)}
.escena h2{font-size:clamp(1.3rem,3.2vw,2.2rem);margin-bottom:16px;position:relative;z-index:1}
.escena ul{list-style:none;padding:0;margin:0;display:grid;gap:12px;position:relative;z-index:1}
.escena li{font-size:clamp(.95rem,1.8vw,1.2rem);padding-left:30px;position:relative;opacity:0;transform:translateX(-18px);transition:.6s}
.escena li.v{opacity:1;transform:none}.escena li::before{content:"";position:absolute;left:0;top:.5em;width:16px;height:4px;border-radius:4px;background:var(--ambar)}
.mando{display:flex;align-items:center;gap:12px;background:var(--papel);border:1px solid var(--linea);border-radius:16px;padding:10px 14px;margin-top:10px}
.mando button.pp{width:46px;height:46px;border-radius:50%;border:0;background:var(--ambar);font-size:1.1rem;cursor:pointer;flex:none}
.mando .t{font-size:.84rem;color:var(--gris);min-width:84px;text-align:right}
.acciones{display:flex;gap:10px;flex-wrap:wrap;margin:16px 0}
.bloque{background:var(--papel);border:1px solid var(--linea);border-radius:var(--r);padding:18px;margin-top:14px}
.bloque textarea{width:100%;min-height:90px;font:inherit;border:1.5px solid var(--linea);border-radius:12px;padding:12px;margin-top:8px;resize:vertical}
.preg{background:var(--papel);border:1px solid var(--linea);border-radius:var(--r);padding:22px}
.preg h3{font-family:var(--sans);font-size:1.15rem;margin:8px 0 16px}
.opc{display:block;width:100%;text-align:left;font:inherit;background:var(--papel);border:1.5px solid var(--linea);border-radius:14px;padding:14px 16px;margin-bottom:10px;cursor:pointer;min-height:50px;transition:.2s}
.opc:hover{border-color:var(--ambar)}.opc.sel{border-color:var(--tinta);background:var(--suave)}
.opc.bien{border-color:var(--ok);background:#DCFCE7}.opc.mal{border-color:var(--mal);background:#FEE2E2}
.resul{text-align:center;padding:10px}.resul .gran{font:800 4.4rem var(--serif);line-height:1}
.conf{position:fixed;inset:0;pointer-events:none;z-index:95}
.conf i{position:absolute;top:-12px;width:9px;height:14px;animation:cae 2.4s linear forwards}
@keyframes cae{to{transform:translateY(110vh) rotate(720deg)}}
.vacio{text-align:center;color:var(--gris);padding:30px}
/* ===== panel ===== */
.tabla{width:100%;border-collapse:collapse;background:var(--papel);border-radius:var(--r);overflow:hidden;border:1px solid var(--linea)}
.tabla th{text-align:left;font:700 .76rem var(--sans);text-transform:uppercase;letter-spacing:.07em;color:var(--gris);padding:12px 14px;background:var(--hueco)}
.tabla td{padding:12px 14px;border-top:1px solid var(--linea);font-size:.92rem;vertical-align:middle}
.tabla tr:hover td{background:var(--suave)}
.scroll-x{overflow-x:auto;border-radius:var(--r)}
.barras{display:grid;gap:12px}.barras .fila{display:grid;grid-template-columns:150px 1fr 48px;gap:12px;align-items:center;font-size:.9rem}
@media(max-width:560px){.barras .fila{grid-template-columns:100px 1fr 40px;font-size:.82rem}}
.herr{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 16px}
.herr input,.herr select{font:inherit;padding:10px 14px;border:1.5px solid var(--linea);border-radius:99px;background:var(--papel);min-height:44px}
.herr input{flex:1;min-width:180px}
@media(max-width:700px){.tabla.res thead{display:none}.tabla.res,.tabla.res tbody,.tabla.res tr,.tabla.res td{display:block}.tabla.res tr{padding:10px 4px;border-top:1px solid var(--linea)}.tabla.res td{border:0;padding:3px 12px}.tabla.res td[data-l]::before{content:attr(data-l) ": ";color:var(--gris);font-size:.8rem}}
.kpi b span{font:inherit;color:inherit;display:inline}
/* ===== tema oscuro ===== */
:root[data-tema="oscuro"]{--tinta:#E8EDFB;--tinta2:#C5CFEA;--crema:#0A1020;--papel:#131C34;--osc:#0A1328;--hueco:#1A2544;--hueco2:#223056;--suave:#2A2A12;--suave2:#3A3512;--linea:#26325A;--gris:#9AA7C7;--sombra:0 18px 40px -22px rgba(0,0,0,.8);color-scheme:dark}
:root[data-tema="oscuro"] .nav{background:rgba(10,16,32,.85)}
:root[data-tema="oscuro"] .etq.ok{background:#12351F;color:#86EFAC}:root[data-tema="oscuro"] .etq.al{background:#3A2C0B;color:#FCD34D}:root[data-tema="oscuro"] .etq.rj{background:#3B1414;color:#FCA5A5}
:root[data-tema="oscuro"] .opc.bien{background:#12351F}:root[data-tema="oscuro"] .opc.mal{background:#3B1414}
:root[data-tema="oscuro"] .nota-demo{background:#2A2A12;color:#F5D77A}
:root[data-tema="oscuro"] .hero,:root[data-tema="oscuro"] .oscuro,:root[data-tema="oscuro"] .plan.top{outline:1px solid #1B2A52}
.tema{background:none;border:1.5px solid var(--linea);border-radius:99px;width:42px;height:42px;cursor:pointer;font-size:1.05rem;color:inherit;flex:none}
.barra-aula .tema{border-color:#34437A;color:#fff}
.tema:hover{border-color:var(--ambar)}
/* ===== valor agregado ===== */
.dos{display:grid;grid-template-columns:1.1fr 1fr;gap:14px;margin-top:6px}@media(max-width:800px){.dos{grid-template-columns:1fr}}
.mini{font:inherit;border:1.5px solid var(--linea);border-radius:10px;padding:6px 8px;background:var(--papel);color:var(--tinta);min-height:40px}
.heat{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;max-width:300px}
.heat small{text-align:center;color:var(--gris);font-size:.68rem}
.heat i{aspect-ratio:1;border-radius:6px;background:var(--hueco2);display:block;transition:transform .2s}
.heat i.on{background:var(--ambar);box-shadow:0 0 0 2px rgba(255,183,3,.25)}.heat i.fut{opacity:.35}.heat i:hover{transform:scale(1.2)}
.recuerda{margin-top:16px;border-top:1px solid var(--linea);padding-top:12px}
.logros{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px}@media(max-width:480px){.logros{grid-template-columns:repeat(2,1fr)}}
.logro{border:1.5px dashed var(--linea);border-radius:14px;padding:12px 8px;text-align:center;filter:grayscale(1);opacity:.55;transition:.3s}
.logro span{font-size:1.7rem;display:block}.logro b{display:block;font-size:.8rem}.logro small{color:var(--gris);font-size:.7rem;line-height:1.2;display:block;margin-top:2px}
.logro.ok{filter:none;opacity:1;border-style:solid;border-color:var(--ambar);background:var(--suave);animation:pop .6s both}
@keyframes pop{from{transform:scale(.85)}60%{transform:scale(1.07)}}
.mi-curso{border-left:5px solid var(--c,var(--linea))}
.lec{transition:background .2s,transform .2s}.lec:hover{transform:translateX(3px)}
.vel{display:flex;gap:4px}.vel button{border:1.5px solid var(--linea);background:var(--papel);color:var(--tinta);border-radius:99px;padding:5px 10px;font:700 .78rem var(--sans);cursor:pointer;min-height:34px}
.vel button.on{background:var(--osc);color:#fff;border-color:var(--osc)}
.atajos{color:var(--gris);font-size:.78rem;margin-top:6px}kbd{border:1px solid var(--linea);border-bottom-width:2px;border-radius:6px;padding:0 6px;font:600 .74rem var(--sans);background:var(--papel)}
.tarjeta-rep{perspective:1000px;height:260px;cursor:pointer;margin:14px 0}
.tarjeta-rep>div{position:relative;width:100%;height:100%;transition:transform .6s;transform-style:preserve-3d}
.tarjeta-rep.vuelta>div{transform:rotateY(180deg)}
.tarjeta-rep .c{position:absolute;inset:0;backface-visibility:hidden;border-radius:22px;padding:24px;display:flex;flex-direction:column;justify-content:center;border:1px solid var(--linea);background:var(--papel);overflow:auto}
.tarjeta-rep .c.atras{transform:rotateY(180deg);background:var(--osc);color:#fff}
.tarjeta-rep ul{margin:10px 0 0;padding-left:20px;display:grid;gap:8px}
.buscador{position:fixed;inset:0;z-index:85;background:rgba(10,16,32,.6);backdrop-filter:blur(4px);display:none;align-items:flex-start;justify-content:center;padding:10vh 16px 16px}
.buscador.on{display:flex}.buscador>div{background:var(--papel);width:min(560px,100%);border-radius:20px;padding:14px;max-height:78vh;overflow:auto;animation:entra .3s both}
.buscador input{width:100%;font:inherit;font-size:1.05rem;padding:14px 16px;border:2px solid var(--ambar);border-radius:14px;background:var(--papel);color:var(--tinta)}
.res-b{display:flex;gap:12px;align-items:center;width:100%;text-align:left;background:none;border:0;font:inherit;color:inherit;padding:10px;border-radius:12px;cursor:pointer;min-height:52px}
.res-b:hover,.res-b.sel{background:var(--hueco)}.res-b small{color:var(--gris);display:block}
.btn-buscar{background:rgba(255,255,255,.1);border:1.5px solid #34437A;color:#fff;border-radius:99px;padding:8px 14px;font:600 .85rem var(--sans);cursor:pointer;min-height:42px}
.btn-buscar kbd{background:transparent;color:#9FB0DB;border-color:#34437A}
@media(max-width:560px){.btn-buscar kbd,.btn-buscar span{display:none}}
.cita{background:var(--papel);border:1px solid var(--linea);border-radius:var(--r);padding:22px;display:flex;flex-direction:column;gap:14px}
.cita p{font:italic 600 1.05rem/1.45 var(--serif)}.cita .qn{display:flex;gap:10px;align-items:center;font-size:.88rem}.cita .qn i{width:40px;height:40px;border-radius:50%;background:var(--ambar);color:var(--sobre);display:grid;place-items:center;font:800 1rem var(--serif);font-style:normal}
.cita small{color:var(--gris);display:block}.estr{color:var(--ambar);letter-spacing:2px}
.reco{background:var(--osc);color:#fff;border-radius:26px;padding:clamp(22px,4vw,40px)}
.reco h2{color:#fff}.reco .ops{display:flex;gap:10px;flex-wrap:wrap;margin:20px 0}
.reco .ops button{background:rgba(255,255,255,.08);border:1.5px solid #34437A;color:#fff;border-radius:99px;padding:11px 18px;font:600 .95rem var(--sans);cursor:pointer;min-height:46px;transition:.2s}
.reco .ops button:hover,.reco .ops button.on{background:var(--ambar);color:#0E1A3A;border-color:var(--ambar);transform:translateY(-2px)}
.reco .res{background:var(--papel);color:var(--tinta);border-radius:18px;padding:20px;display:none;gap:14px;align-items:center;flex-wrap:wrap}.reco .res.on{display:flex;animation:entra .5s both}
@media(max-width:820px){.nav nav .tema{align-self:flex-start}}
.cuenta{position:fixed;right:16px;bottom:16px;z-index:40}
.cert-acc{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
/* ===== secciones alternas + más animación ===== */
.alt{background:var(--papel)}
:root[data-tema="oscuro"] .alt{background:#0D1530}
:root[data-tema="oscuro"] .cita,:root[data-tema="oscuro"] .faq details{background:#131C34;border-color:#2C3A66}
:root[data-tema="oscuro"] .cita p{color:#E8EDFB}
:root[data-tema="oscuro"] .reco{background:#101B3A;border:1px solid #2C3A66}
.rv{filter:blur(6px);transition:opacity .7s cubic-bezier(.2,.8,.2,1),transform .7s cubic-bezier(.2,.8,.2,1),filter .7s}
.rv.in{filter:none}
.cursos>.rv:nth-child(3n+2){transition-delay:.1s}.cursos>.rv:nth-child(3n){transition-delay:.2s}
.curso,.cita,.plan,.logro,.kpi{transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s,border-color .35s}
.curso:hover,.cita:hover,.plan:hover{transform:translateY(-8px) scale(1.015);box-shadow:0 26px 50px -24px rgba(0,0,0,.45);border-color:var(--ambar)}
.curso:hover .ico{animation:bote .6s}
@keyframes bote{30%{transform:translateY(-8px) rotate(-8deg) scale(1.12)}60%{transform:translateY(0) rotate(5deg)}}
.btn{position:relative;overflow:hidden}
.btn::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.45) 50%,transparent 70%);transform:translateX(-120%)}
.btn:hover::after{transform:translateX(120%);transition:transform .7s}
.btn:active{transform:scale(.96)}
.hero .btn:not(.lin){animation:pulso 2.6s infinite}
@keyframes pulso{0%{box-shadow:0 0 0 0 rgba(255,183,3,.55)}70%,100%{box-shadow:0 0 0 18px rgba(255,183,3,0)}}
.estr{display:inline-block;animation:brilla 2.4s ease-in-out infinite}
@keyframes brilla{50%{transform:scale(1.12);filter:brightness(1.3)}}
.reco .ops button{animation:entra2 .5s both}.reco .ops button:nth-child(2){animation-delay:.06s}.reco .ops button:nth-child(3){animation-delay:.12s}.reco .ops button:nth-child(4){animation-delay:.18s}.reco .ops button:nth-child(5){animation-delay:.24s}.reco .ops button:nth-child(6){animation-delay:.3s}
@keyframes entra2{from{opacity:0;transform:translateY(14px) scale(.9)}}
.reco .res .ico{animation:bote 1s .3s}
.heat i.on{animation:pop .5s both}
.logro.ok span{animation:bote 1.2s 1}
.nav{transition:box-shadow .3s,background .3s}
@media(prefers-reduced-motion:reduce){.rv{filter:none}.btn::after,.hero .btn,.estr,.curso:hover .ico{animation:none}.curso:hover,.cita:hover,.plan:hover{transform:none}}
:root[data-tema="oscuro"] .reco .res{background:#1B2A55;border:1px solid #3C4E8C;color:#fff}
:root[data-tema="oscuro"] .reco .res small{color:#B6C3E6!important}
:root[data-tema="oscuro"] .reco .res .btn{background:var(--ambar);color:#0E1A3A}
/* ===== nivel, ranking, dudas, enfoque ===== */
.nivel{margin:18px 0}.xp{font:800 1.3rem var(--serif);color:var(--ambar)}
.rank{display:grid;gap:6px}.rank>div{display:grid;grid-template-columns:28px 1fr 90px;grid-template-areas:"p n x" "b b b";gap:2px 10px;align-items:center;padding:8px 10px;border-radius:12px;background:var(--hueco)}
.rank>div span{grid-area:p;font:800 .95rem var(--serif);color:var(--gris)}.rank>div b{grid-area:n;font-size:.92rem}.rank>div small{grid-area:x;text-align:right;color:var(--gris)}
.rank>div i{grid-area:b;height:5px;border-radius:9px;background:linear-gradient(90deg,var(--ambar) var(--w),transparent 0);opacity:.7}
.rank>div.yo{background:var(--suave);outline:2px solid var(--ambar);animation:pop .6s both}
.duda{padding:10px 12px;border-radius:12px;background:var(--hueco);margin-top:8px}.duda p{margin:2px 0 0;font-size:.92rem;color:var(--tinta2)}.duda.mia{background:var(--suave);animation:pop .4s both}
.pomo{position:fixed;left:16px;bottom:16px;z-index:40}
.pomo button{background:var(--papel);color:var(--tinta);border:1.5px solid var(--linea);border-radius:99px;padding:10px 16px;font:700 .85rem var(--sans);cursor:pointer;box-shadow:var(--sombra);min-height:44px}
.pomo.on button{border-color:#E11D48;animation:pulso 2s infinite}
body.enfoque .lateral,body.enfoque .atajos,body.enfoque .btn-buscar{opacity:.25;transition:opacity .4s}
body.enfoque .lateral:hover{opacity:1}
/* ===== evaluación, rutas ===== */
.modos{display:grid;grid-template-columns:1fr 1fr;gap:14px}@media(max-width:620px){.modos{grid-template-columns:1fr}}
.modo{text-align:left;background:var(--hueco);border:2px solid var(--linea);border-radius:18px;padding:20px;cursor:pointer;color:var(--tinta);display:grid;gap:4px;font:inherit;transition:.25s}
.modo span{font-size:1.8rem}.modo b{font:700 1.2rem var(--serif)}.modo small{color:var(--gris)}
.modo:hover{border-color:var(--ambar);transform:translateY(-5px);box-shadow:var(--sombra)}
.crono{float:right;font:800 .95rem var(--sans);color:var(--ambar)}.crono.urge{color:#E11D48;animation:pulso 1s infinite}
.explica{margin-top:14px;padding:14px 16px;border-radius:14px;animation:pop .4s both}.explica.ok{background:#12351F22;border:1.5px solid var(--ok)}.explica.no{background:#3B141422;border:1.5px solid var(--mal)}
.explica p{margin:4px 0 0;color:var(--tinta2)}
.rutas{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.ruta{background:var(--papel);border:1px solid var(--linea);border-radius:18px;padding:18px;display:grid;gap:8px;transition:.3s}
.ruta:hover{transform:translateY(-5px);box-shadow:var(--sombra);border-color:var(--ambar)}
.ruta.ok{border-color:var(--ok)}.ruta .ri{font-size:1.7rem}.ruta b{font:700 1.1rem var(--serif)}.ruta small{color:var(--gris)}
.rpasos{display:flex;align-items:center;gap:6px}.rpasos a{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:var(--hueco2);color:var(--tinta);text-decoration:none;font:800 .8rem var(--serif);border:2px solid var(--linea)}
.rpasos a.hecho{background:var(--ok);color:#fff;border-color:var(--ok)}.rpasos i{flex:1;height:2px;background:var(--linea);max-width:30px}
.instala{position:fixed;right:16px;bottom:16px;z-index:60;box-shadow:var(--sombra);animation:pulso 2.4s infinite}
/* ===== secciones claras (aula y panel) ===== */
.subnav{position:sticky;top:0;z-index:30;display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding:10px 0;margin:0 0 6px;background:linear-gradient(var(--crema) 75%,transparent);backdrop-filter:blur(8px)}
.subnav::-webkit-scrollbar{display:none}
.subnav a{flex:none;display:inline-flex;align-items:center;gap:6px;padding:9px 15px;border-radius:99px;text-decoration:none;font:700 .86rem var(--sans);color:var(--tinta2);border:1.5px solid var(--linea);background:var(--papel);min-height:42px;transition:.25s}
.subnav a:hover{border-color:var(--ambar);transform:translateY(-2px)}
.subnav a.on{background:var(--ambar);color:#0E1A3A;border-color:var(--ambar);box-shadow:0 8px 18px -10px var(--ambar)}
.sec{padding:26px 0 8px;scroll-margin-top:70px}
.sec+.sec{border-top:1px dashed var(--linea);margin-top:18px}
.sec-h{display:flex;gap:14px;align-items:flex-start;margin-bottom:18px}
.sec-h .num{font:800 .85rem var(--sans);color:var(--sobre);background:var(--ambar);border-radius:10px;padding:6px 9px;letter-spacing:.06em;flex:none;margin-top:5px;animation:pop .6s both}
.sec-h h2{font:800 clamp(1.3rem,3vw,1.7rem) var(--serif);margin:0;position:relative;display:inline-block}
.sec-h h2::after{content:"";position:absolute;left:0;bottom:-5px;height:3px;width:100%;background:var(--ambar);border-radius:3px;transform:scaleX(0);transform-origin:left;animation:subraya .9s .2s cubic-bezier(.2,.8,.2,1) forwards}
@keyframes subraya{to{transform:scaleX(1)}}
.sec-h p{margin:10px 0 0;color:var(--gris);font-size:.95rem}
.sec>.dos,.sec>.rutas,.sec>.grid2,.sec>.kpis,.sec>.bloque,.sec>.riesgos{animation:sube .7s both}
@keyframes sube{from{opacity:0;transform:translateY(24px)}}
.kpis .kpi:nth-child(1){animation:sube .6s .05s both}.kpis .kpi:nth-child(2){animation:sube .6s .12s both}.kpis .kpi:nth-child(3){animation:sube .6s .19s both}.kpis .kpi:nth-child(4){animation:sube .6s .26s both}
.kpi:hover{transform:translateY(-6px);box-shadow:var(--sombra);border-color:var(--ambar)}
.mi-curso{transition:.3s}.mi-curso:hover{transform:translateX(6px);border-color:var(--c,var(--ambar));box-shadow:var(--sombra)}
.tabla.res tbody tr{animation:fila .5s both}
.tabla.res tbody tr:nth-child(1){animation-delay:.02s}.tabla.res tbody tr:nth-child(2){animation-delay:.06s}.tabla.res tbody tr:nth-child(3){animation-delay:.1s}.tabla.res tbody tr:nth-child(4){animation-delay:.14s}.tabla.res tbody tr:nth-child(5){animation-delay:.18s}.tabla.res tbody tr:nth-child(n+6){animation-delay:.22s}
@keyframes fila{from{opacity:0;transform:translateX(-18px)}}
.tabla.res tbody tr:hover{background:var(--hueco)}
.riesgos{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.riesgo{display:grid;grid-template-columns:auto 1fr auto;grid-template-areas:"a n d" "a n b";gap:2px 12px;align-items:center;padding:14px;border-radius:16px;background:var(--papel);border:1.5px solid #E11D4855;animation:sube .5s calc(var(--i)*.08s) both}
.riesgo:hover{transform:translateY(-4px);box-shadow:var(--sombra)}
.riesgo .av2{grid-area:a;width:42px;height:42px;border-radius:50%;background:#E11D48;color:#fff;display:grid;place-items:center;font:800 1rem var(--serif);animation:latido 2s infinite}
@keyframes latido{50%{box-shadow:0 0 0 8px #E11D4822}}
.riesgo>div{grid-area:n}.riesgo small{display:block;color:var(--gris)}.riesgo .dias{grid-area:d;font:800 .85rem var(--sans);color:#E11D48;justify-self:end}.riesgo .btn{grid-area:b;justify-self:end}
.vacio.sano{padding:22px;border-radius:16px;background:var(--hueco);text-align:center;grid-column:1/-1}
@media(max-width:560px){.sec-h{gap:10px}.riesgos{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.sec-h h2::after{transform:none;animation:none}.sec>*,.kpis .kpi,.tabla.res tbody tr,.riesgo,.sec-h .num{animation:none}}
/* ===== portada: más movimiento ===== */
.hero h1 em{transition:.35s}.hero h1 em.sale{opacity:0;transform:translateY(-14px) rotateX(60deg);filter:blur(6px)}.hero h1 em.entra-p{animation:entraP .45s both}
@keyframes entraP{from{opacity:0;transform:translateY(16px);filter:blur(6px)}}
.glifo{transition:translate .5s cubic-bezier(.2,.8,.2,1)}
.cinta{overflow:hidden;background:var(--osc);color:#fff;border-block:1px solid #1B2A52;padding:14px 0;margin-top:-1px}
.cinta>div{display:flex;gap:42px;width:max-content;animation:cinta 38s linear infinite}
.cinta:hover>div{animation-play-state:paused}
.cinta span{font:700 .95rem var(--sans);letter-spacing:.04em;white-space:nowrap;display:flex;align-items:center;gap:42px}
.cinta span::after{content:"✦";color:var(--ambar)}
@keyframes cinta{to{transform:translateX(-50%)}}
.cab h2{position:relative;display:inline-block}
.cab.rv.in h2::after{content:"";position:absolute;left:0;bottom:-6px;height:4px;width:60%;background:var(--ambar);border-radius:4px;transform-origin:left;animation:subraya 1s .3s cubic-bezier(.2,.8,.2,1) both}
.cifras>div{transition:.3s}.cifras>div:hover{transform:translateY(-6px) scale(1.05)}
.nav nav a.act:not(.btn){background:var(--ambar);color:#0E1A3A}
.arriba{position:fixed;right:16px;bottom:72px;width:46px;height:46px;border-radius:50%;border:0;background:var(--osc);color:#fff;font:800 1.2rem var(--sans);cursor:pointer;opacity:0;transform:translateY(20px) scale(.8);pointer-events:none;transition:.3s;z-index:45;box-shadow:var(--sombra)}
.arriba.on{opacity:1;transform:none;pointer-events:auto}.arriba:hover{background:var(--ambar);color:#0E1A3A}
@media(prefers-reduced-motion:reduce){.cinta>div{animation:none}}