@font-face{font-family:'Sequel 100 Wide';src:url('../assets/fonts/Sequel-100-Wide-45.otf') format('opentype');font-weight:300}
@font-face{font-family:'Sequel 100 Wide';src:url('../assets/fonts/Sequel-100-Wide-65.otf') format('opentype');font-weight:500}
@font-face{font-family:'Sequel 100 Wide';src:url('../assets/fonts/Sequel-100-Wide-75.otf') format('opentype');font-weight:600}
@font-face{font-family:'Sequel 100 Wide';src:url('../assets/fonts/Sequel-100-Wide-85.otf') format('opentype');font-weight:700}

/* ============ LAS REGLAS DE LA CASA ============
   Cantos: en punta con un pelo de redondeo. Lo grande 6 px, lo que se pulsa 5 px.
   Color: negro (o blanco de día), y el azul como hilo: borde, progreso, lo activo.
   Letra: Sequel 100 Wide para titulares y cifras, Poppins para todo lo demás. */
:root{--grande:6px;--boton:5px;--campo:5px;--azul:#0b79fb;--titular:'Sequel 100 Wide',Poppins,sans-serif}

/* modo noche (y las zonas que son oscuras siempre: vídeo, cabeceras con foto) */
body,.noche{
  --fondo:#000;--sup:#0b0b0c;--texto:#fff;--texto2:#cfcfcf;--tenue:#9c9c9c;
  --linea:rgba(255,255,255,.16);--linea2:rgba(255,255,255,.08);--borde-campo:rgba(255,255,255,.28);
  --azul-claro:#6fb1ff;--azul-suave:rgba(11,121,251,.1);--hover:rgba(255,255,255,.05);--num:rgba(255,255,255,.28);--campo-fondo:#0a0a0a;--foto:#151515;
  color:var(--texto)}
/* modo día */
body[data-tema="dia"]{
  --fondo:#fff;--sup:#f5f5f3;--texto:#0b0b0c;--texto2:#3d3d3f;--tenue:#707074;
  --linea:rgba(0,0,0,.14);--linea2:rgba(0,0,0,.07);--borde-campo:rgba(0,0,0,.3);
  --azul-claro:#0b79fb;--azul-suave:rgba(11,121,251,.07);--hover:rgba(0,0,0,.04);--num:rgba(0,0,0,.22);--campo-fondo:#fff;--foto:#e9e9e6}
body[data-tema="dia"] .noche{--fondo:#000;--sup:#0b0b0c;--texto:#fff;--texto2:#cfcfcf;--tenue:#9c9c9c;--linea:rgba(255,255,255,.16);--linea2:rgba(255,255,255,.08);--borde-campo:rgba(255,255,255,.28);--azul-claro:#6fb1ff;--azul-suave:rgba(11,121,251,.1);--hover:rgba(255,255,255,.05);--num:rgba(255,255,255,.28);--campo-fondo:#0a0a0a;--foto:#151515;color:#fff}

*{box-sizing:border-box}
body{margin:0;background:var(--fondo);font-family:Poppins,sans-serif;-webkit-font-smoothing:antialiased;transition:background .25s,color .25s}
a{color:inherit;text-decoration:none;cursor:pointer}
img{display:block;max-width:100%}
button{font:inherit;cursor:pointer}
h1,h2,h3,p,dl,ul,ol{margin:0;padding:0}

/* selector de páginas (no forma parte del diseño) */
.selector{position:sticky;top:0;z-index:60;display:flex;justify-content:space-between;background:#16161a;border-bottom:1px solid #2c2c33;font-size:11.5px}
.selector__paginas{display:flex;overflow-x:auto}
.selector button{background:none;border:0;border-right:1px solid #2c2c33;padding:11px 12px;color:#b8b8c0;font-weight:500;white-space:nowrap}
.selector button.on{background:#0b79fb;color:#fff}
.selector__ajustes{display:flex;align-items:center;flex:none;border-left:1px solid #2c2c33}
.selector__ajustes span{padding:0 10px;color:#7d7d86;white-space:nowrap}
.selector__ajustes button.on{background:#fff;color:#000}
.pagina{display:none;background:var(--fondo)}.pagina.on{display:block}
body:not(.visitante) .solo-visitante,body.visitante .solo-alumno{display:none}

/* ---- cabecera y pie de la web ---- */
.nav{display:flex;align-items:center;gap:28px;height:70px;padding:0 48px;background:var(--fondo);border-bottom:1px solid var(--linea)}
.nav__logo{font-family:var(--titular);font-weight:700;font-size:15px;line-height:.95;color:#2f6bff;position:relative;padding-right:18px;display:inline-block}
.nav__logo i{position:absolute;right:0;bottom:1px;width:15px;height:15px;border-radius:50%;background:#35b6f0}
.nav__buscar{flex:0 0 340px;padding:11px 16px;border:1px solid var(--linea);border-radius:var(--campo);font-size:12px;color:var(--tenue);background:var(--campo-fondo)}
.nav nav{margin-left:auto;display:flex;align-items:center;gap:28px;font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.nav nav a:hover{color:var(--azul)}
.nav__tema{width:36px;height:36px;display:grid;place-items:center;background:none;border:1px solid var(--linea);border-radius:var(--boton);color:var(--texto);font-size:15px}
body[data-tema="dia"] .de-noche,body:not([data-tema="dia"]) .de-dia{display:none}
.pie-web{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:40px;padding:56px 48px 28px;border-top:1px solid var(--linea);background:var(--fondo)}
.pie-web p{max-width:36ch;margin-top:16px;font-size:13px;line-height:1.6;color:var(--tenue)}
.pie-web .rotulo{margin:0 0 14px;color:var(--tenue)}
.pie-web div a{display:block;padding:5px 0;font-size:14px;color:var(--texto2)}
.pie-web__fin{grid-column:1/-1;max-width:none!important;padding-top:22px;border-top:1px solid var(--linea);font-size:11px!important}

/* ---- átomos ---- */
.rotulo{display:block;font-size:11px;font-weight:700;letter-spacing:.3em;text-transform:uppercase;color:var(--texto)}
.rotulo.azul,.azul{color:var(--azul-claro)}
.rotulo.tenue{color:var(--tenue)}
h1{margin-top:14px;font-family:var(--titular);font-weight:700;font-size:clamp(46px,7vw,112px);line-height:.9;text-transform:uppercase}
h2{margin-top:12px;font-family:var(--titular);font-weight:700;font-size:clamp(28px,3.4vw,52px);line-height:.96;text-transform:uppercase}
h3{font-family:var(--titular);font-weight:700;text-transform:uppercase;line-height:1}
.h1-medio{font-size:clamp(30px,3.4vw,52px);max-width:14ch}
.h2-corto{font-size:26px;margin:0}
.desc{max-width:62ch;margin-top:24px;font-size:16px;line-height:1.6;color:var(--texto2)}
.texto{max-width:64ch;margin-top:22px;font-size:16.5px;line-height:1.65;color:var(--texto2)}
.btn{display:inline-block;padding:15px 28px;background:var(--azul);color:#fff;border:1px solid var(--azul);border-radius:var(--boton);font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;white-space:nowrap;text-align:center;transition:filter .2s,background .2s}
.btn:hover{filter:brightness(1.12)}
.btn--linea{background:none;border-color:var(--borde-campo);color:var(--texto)}
.btn--linea:hover{background:var(--hover);filter:none}
.btn--negro{background:#000;border-color:#000}
.btn--grande{padding:21px 36px;font-size:12.5px}
.btn--ancho{display:block}
.enlace{font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;border-bottom:1px solid var(--linea);padding-bottom:3px;white-space:nowrap}
.enlace:hover{border-bottom-color:var(--azul)}
.enlace--tenue{color:var(--tenue)}
.acciones{display:flex;align-items:center;gap:26px;margin-top:28px}
.cifras{display:flex;border-top:1px solid var(--linea);border-bottom:1px solid var(--linea)}
.cifras div{padding:18px 30px;border-left:1px solid var(--linea)}
.cifras div:first-child{border-left:0;padding-left:0}
.cifras dt{font-family:var(--titular);font-weight:700;font-size:34px;line-height:1;font-variant-numeric:tabular-nums}
.cifras dt small{font-size:15px;font-weight:500;color:var(--tenue)}
.cifras dd{margin:9px 0 0;font-size:10px;font-weight:700;letter-spacing:.26em;text-transform:uppercase;color:var(--tenue)}
.cifras--ancha{justify-content:space-between;border:0}
.cifras--ancha div{flex:1;padding:6px 40px}
.cifras--ancha dt{font-size:54px}
.franja{padding:46px 48px;border-top:1px solid var(--linea)}
.seccion{padding-top:70px;padding-bottom:70px}
.seccion--corta{padding-top:52px;padding-bottom:52px}
.indice{display:flex;align-items:baseline;gap:14px;margin-bottom:26px;font-size:11px;font-weight:700;letter-spacing:.3em;text-transform:uppercase}
.indice b{font-family:var(--titular);font-weight:700;font-size:22px;letter-spacing:0;color:var(--azul)}
.seccion h2{margin-top:0}
.cabecera-fila{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:8px}
.cabecera-fila--arriba{margin-top:64px;padding-top:40px;border-top:1px solid var(--linea)}
.migas{display:flex;gap:14px;padding:24px 48px 0;font-size:11px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--tenue)}
.migas span{color:var(--texto)}
.volver{display:inline-block;margin-bottom:26px;font-size:11px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--tenue)}
.dos-col{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:64px;align-items:start}
.dos-col--medio{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);align-items:center}
.panel{padding:34px 34px 30px;border:1px solid var(--linea);border-radius:var(--grande);background:var(--fondo)}
.panel--hilo{box-shadow:inset 0 2px 0 var(--azul)}
.panel h3{margin:14px 0 20px;font-size:24px}
.lista-rayas{list-style:none}
.lista-rayas li{position:relative;padding:13px 0 13px 24px;border-top:1px solid var(--linea2);font-size:14px;line-height:1.4;color:var(--texto2)}
.lista-rayas li::before{content:'';position:absolute;left:0;top:22px;width:12px;height:2px;background:var(--azul)}
.progreso{display:block;height:3px;margin-top:16px;background:var(--linea)}
.progreso i{display:block;height:100%;background:var(--azul)}
.play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:62px;height:62px;display:grid;place-items:center;background:var(--azul);color:#fff;border-radius:var(--boton);font-size:19px;padding-left:4px}
.video{background:#000;border-radius:var(--grande);overflow:hidden}
.video img{width:100%}

/* ---- portadas de página y filtros ---- */
.portada{padding:64px 48px 44px}
.portada--centro{text-align:center;padding-bottom:30px}
.portada--centro .desc{margin-left:auto;margin-right:auto}
.filtros{padding:0 48px;border-top:1px solid var(--linea)}
.filtro{display:grid;grid-template-columns:110px minmax(0,1fr);align-items:center;border-bottom:1px solid var(--linea)}
.filtro .rotulo{color:var(--tenue)}
.opciones{display:flex;gap:34px}
.opciones a{padding:18px 0 16px;font-size:13px;font-weight:600;color:var(--texto2);border-bottom:2px solid transparent;margin-bottom:-1px}
.opciones a.on{color:var(--texto);border-bottom-color:var(--azul)}
.periodo{display:flex;justify-content:center;gap:38px;width:max-content;margin:0 auto 40px;border-bottom:1px solid var(--linea)}
.periodo--izq{margin:0 0 34px}
.periodo a{padding:0 0 14px;font-size:12px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--tenue);border-bottom:2px solid transparent;margin-bottom:-1px}
.periodo a.on{color:var(--texto);border-bottom-color:var(--azul)}
.periodo small{margin-left:8px;font-size:10px;letter-spacing:.1em;color:var(--azul-claro)}

/* ---- tarjetas: curso, clase, profesor ---- */
.rejilla{display:grid;gap:56px 28px}
.rejilla--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.rejilla--4{grid-template-columns:repeat(4,minmax(0,1fr));gap:44px 24px}
.rejilla--6{grid-template-columns:repeat(6,minmax(0,1fr));gap:24px 18px;margin-top:30px}
.rejilla--pagina{padding:44px 48px 72px}
.rejilla--dentro{margin-top:34px}
.img{position:relative;display:block;overflow:hidden;background:var(--foto);border-radius:var(--grande)}
.img img{width:100%;height:100%;object-fit:cover}
.curso,.clase,.profe{display:block}
.curso .img,.clase .img{aspect-ratio:16/9}
.curso .img img,.clase .img img,.profe .img img{transition:transform .5s}
.curso:hover .img img,.clase:hover .img img{transform:scale(1.04)}
.img video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .35s}
.img.viendo video{opacity:1}
.curso .img::after,.clase .img::after,.destacado .img::after{content:'';position:absolute;left:0;right:0;top:0;height:2px;background:var(--azul);transform:scaleX(0);transform-origin:left;transition:transform .35s}
.curso:hover .img::after,.clase:hover .img::after,.destacado:hover .img::after{transform:scaleX(1)}
.sonido,.corazon{position:absolute;right:12px;width:34px;height:34px;display:grid;place-items:center;background:rgba(0,0,0,.6);color:#fff;border-radius:var(--boton);font-size:15px;opacity:0;transition:opacity .25s}
.corazon{top:12px;font-size:18px}.sonido{top:52px}
a:hover>.img .corazon,a:hover>.img .sonido{opacity:1}
.dur{position:absolute;right:0;bottom:0;padding:6px 10px;background:#000;color:#fff;border-radius:var(--boton) 0 0 0;font-size:11px;font-weight:600;font-variant-numeric:tabular-nums}
.curso .rotulo,.clase .rotulo{margin-top:18px;font-size:10px;letter-spacing:.24em}
.curso strong{display:block;margin-top:10px;font-family:var(--titular);font-weight:700;font-size:19px;line-height:1.05;text-transform:uppercase}
.clase strong{display:block;margin-top:9px;font-size:16px;font-weight:600;line-height:1.3}
.con{display:block;margin-top:9px;font-size:13px;color:var(--texto2)}
.de-que-va{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;margin-top:12px;font-size:13.5px;line-height:1.55;color:var(--tenue)}
.pie{display:flex;justify-content:space-between;align-items:baseline;margin-top:14px;padding-top:12px;border-top:1px solid var(--linea);font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--tenue)}
.pie b{font-family:var(--titular);font-weight:700;font-size:16px;letter-spacing:0;color:var(--texto)}
.pie--sin{border-top:0;padding-top:0}.pie--sin b{font-family:Poppins;font-size:11px;letter-spacing:.14em;color:var(--azul-claro)}
.progreso--suelto{margin-top:14px}
.muestra{display:block;margin-top:10px;padding-top:10px;border-top:1px solid var(--linea);font-size:11.5px;font-weight:600;color:var(--azul-claro)}
.profe .img{aspect-ratio:4/5}
.profe .img img{object-position:center 15%;filter:grayscale(1) contrast(1.05);transition:filter .4s,transform .5s}
.profe:hover .img img{filter:none;transform:scale(1.03)}
.profe strong{display:block;margin-top:14px;font-family:var(--titular);font-weight:700;font-size:15px;line-height:1.1;text-transform:uppercase}
.profe .rotulo{margin-top:8px;font-size:9px;letter-spacing:.2em;color:var(--tenue)}
.destacado{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);margin:44px 48px 0;border:1px solid var(--linea);border-radius:var(--grande);overflow:hidden;box-shadow:inset 0 2px 0 var(--azul)}
.destacado .img{aspect-ratio:16/9;border-radius:0}
.destacado .txt{display:flex;flex-direction:column;justify-content:center;padding:40px 44px}
.destacado strong{display:block;margin-top:16px;font-family:var(--titular);font-weight:700;font-size:clamp(24px,2.6vw,40px);line-height:.98;text-transform:uppercase}
.destacado .sub{display:block;margin-top:16px;font-size:14px;line-height:1.6;color:var(--texto2)}
.destacado .cifras{margin-top:26px}
.cierre{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:40px;align-items:center;margin:0 24px;padding:40px 44px;background:var(--azul);border-radius:var(--grande) var(--grande) 0 0}
.cierre h2{font-size:clamp(22px,2.4vw,36px);max-width:26ch}
.cierre .btn{padding:20px 40px}
.seguir{display:grid;grid-template-columns:260px minmax(0,1fr) auto;gap:30px;align-items:center;margin:40px 48px 0;padding:18px 30px 18px 18px;border:1px solid var(--linea);border-radius:var(--grande);box-shadow:inset 2px 0 0 var(--azul)}
.seguir--dentro{margin:36px 0 0}
.seguir .img{aspect-ratio:16/9}
.seguir .play{width:46px;height:46px;font-size:14px}
.seguir strong{display:block;margin-top:10px;font-family:var(--titular);font-weight:700;font-size:20px;line-height:1.05;text-transform:uppercase}
.seguir .progreso{max-width:420px}

/* ---- cabeceras con vídeo ---- */
.heroe{position:relative;min-height:min(82vh,780px);display:flex;align-items:flex-end;overflow:hidden;background:#000}
.heroe--portada{min-height:min(88vh,860px)}
.heroe__fondo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 22%;filter:saturate(.85) brightness(.75)}
.heroe::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.5) 0%,rgba(0,0,0,.15) 35%,rgba(0,0,0,.88) 80%,#000 100%)}
.heroe__dentro{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:64px;align-items:end;width:100%;padding:140px 48px 56px}
.heroe__dentro--una{grid-template-columns:minmax(0,1fr)}
.heroe h1{font-size:clamp(40px,5.4vw,84px);max-width:13ch}
.heroe--portada h1{font-size:clamp(52px,8vw,132px);max-width:11ch}
.heroe__sub{max-width:50ch;margin-top:22px;font-size:17px;line-height:1.55;color:rgba(255,255,255,.85)}
.heroe .cifras{display:inline-flex;margin-top:30px}
.heroe .volver{color:rgba(255,255,255,.7)}
.medidor{display:flex;gap:5px;align-items:center;height:34px}
.medidor i{width:26px;height:10px;border:1px solid rgba(255,255,255,.4);border-radius:2px}
.medidor i.on{background:var(--azul);border-color:var(--azul)}
.tablero{display:flex;flex-direction:column;gap:14px;padding:30px 30px 26px;background:rgba(0,0,0,.55);border:1px solid rgba(255,255,255,.22);border-radius:var(--grande);backdrop-filter:blur(14px);box-shadow:inset 0 2px 0 var(--azul)}
.tablero__cifra{display:flex;align-items:baseline;gap:14px}
.tablero__cifra b{font-family:var(--titular);font-weight:700;font-size:46px;line-height:1}
.tablero__cifra span{font-size:10px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:#cfcfcf}
.tablero__barra{height:3px;margin:4px 0 8px;background:rgba(255,255,255,.18)}
.tablero__barra i{display:block;height:100%;background:var(--azul)}
.tablero .btn{display:block;padding:18px}
.tablero__nota{margin-top:4px;font-size:12px;line-height:1.5;color:#cfcfcf}
.tablero__nota a{color:#fff;border-bottom:1px solid var(--azul);white-space:nowrap}

/* ---- inicio ---- */
.herramientas{list-style:none;margin-top:30px;border-top:1px solid var(--linea)}
.herramientas li{display:grid;grid-template-columns:54px minmax(0,1fr);align-items:baseline;padding:16px 0;border-bottom:1px solid var(--linea)}
.herramientas b{font-family:var(--titular);font-weight:700;font-size:18px;color:var(--azul)}
.herramientas span{font-size:14px;line-height:1.5;color:var(--texto2)}
.herramientas strong{display:block;margin-bottom:3px;font-size:16px;font-weight:600;color:var(--texto)}
.estilos{margin-top:34px;border-top:1px solid var(--linea)}
.estilos a{display:grid;grid-template-columns:70px minmax(0,1fr) auto;align-items:center;padding:20px 8px;border-bottom:1px solid var(--linea);transition:padding .25s,background .25s}
.estilos a:hover{padding-left:24px;background:var(--hover)}
.estilos b{font-family:var(--titular);font-weight:700;font-size:16px;color:var(--num)}
.estilos strong{font-family:var(--titular);font-weight:700;font-size:clamp(26px,3.6vw,52px);line-height:1;text-transform:uppercase}
.estilos i{font-style:normal;font-size:26px;color:var(--azul);opacity:0;transition:opacity .25s}
.estilos a:hover i{opacity:1}.estilos a:hover b{color:var(--azul)}

/* ---- ficha de curso ---- */
.trailer,.tema__panel .img{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;background:#111;border-radius:var(--grande)}
.trailer img,.tema__panel .img img{width:100%;height:100%;object-fit:cover;filter:brightness(.7)}
.trailer em,.tema__panel .img em{position:absolute;left:0;right:0;bottom:18px;text-align:center;font-style:normal;font-size:10px;font-weight:700;letter-spacing:.3em;text-transform:uppercase;color:#fff}
.temas{margin-top:30px;border-top:1px solid var(--linea)}
.tema{border-bottom:1px solid var(--linea);border-left:2px solid transparent}
.tema.es-abierta{border-left-color:var(--azul);background:var(--azul-suave)}
.tema__fila{display:grid;grid-template-columns:78px minmax(0,1fr) auto 30px;gap:18px;align-items:center;padding:20px 18px 20px 16px;cursor:pointer;transition:padding .25s,background .25s}
.tema:not(.es-abierta) .tema__fila:hover{background:var(--hover);padding-left:26px}
.tema__fila b{font-family:var(--titular);font-weight:700;font-size:26px;line-height:1;color:var(--num)}
.tema.es-abierta .tema__fila b,.tema__fila:hover b{color:var(--azul)}
.tema__fila b i{display:block;margin-top:6px;font-family:Poppins;font-style:normal;font-size:8.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--azul-claro)}
.tema__titulo{font-size:18px;font-weight:600}
.tema__titulo small{display:block;margin-top:5px;font-size:10px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--tenue)}
.tema__dur{font-size:13px;color:var(--texto2);font-variant-numeric:tabular-nums}
.tema__mas{font-size:20px;font-weight:600;color:var(--azul);text-align:right}
.tema__panel{display:grid;grid-template-columns:320px minmax(0,1fr);gap:34px;padding:6px 18px 30px 112px}
.tema__panel .play{width:50px;height:50px;font-size:15px}
.pasos{margin-top:14px;font-size:15px;line-height:2;color:var(--texto2);max-width:78ch}
.pasos span:not(:last-child)::after{content:'·';margin:0 12px;color:var(--azul);font-weight:700}
.maestro{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);border:1px solid var(--linea);border-radius:var(--grande);overflow:hidden}
.maestro .img{min-height:420px;border-radius:0}
.maestro .img img{object-position:center 18%;filter:grayscale(1) contrast(1.05)}
.maestro>div{padding:52px 56px;align-self:center}
.maestro h3{margin-top:14px;font-size:clamp(30px,3.4vw,52px);line-height:.95}

/* ---- clase ---- */
.sala{display:grid;grid-template-columns:minmax(0,1fr) 400px;padding:20px 48px 0;align-items:stretch}
.sala .video{border-radius:var(--grande) 0 0 var(--grande)}
.cola{display:flex;flex-direction:column;min-height:0;padding-top:22px;border:1px solid var(--linea);border-left:0;border-radius:0 var(--grande) var(--grande) 0}
.cola .rotulo,.cola__resumen{padding:0 22px}
.cola__resumen{margin:8px 0 14px;font-size:11px;color:var(--tenue)}
.cola__lista{overflow-y:auto;border-top:1px solid var(--linea);max-height:calc((100vw - 496px) * 9 / 16 - 76px)}
.cola__fila{display:grid;grid-template-columns:104px minmax(0,1fr);gap:14px;padding:12px 22px;align-items:center;border-bottom:1px solid var(--linea);border-left:3px solid transparent}
.cola__fila:hover{background:var(--hover)}
.cola__fila .img{aspect-ratio:16/9;border-radius:3px}
.cola__fila .img b{position:absolute;inset:0;display:grid;place-items:center;background:rgba(0,0,0,.5);color:#fff;font-size:13px}
.cola__fila strong{display:block;font-size:13px;font-weight:600;line-height:1.3}
.cola__fila small{display:block;margin-top:5px;font-size:10px;letter-spacing:.06em;color:var(--tenue)}
.cola__fila.es-actual{border-left-color:var(--azul);background:var(--azul-suave)}
.cola__fila.es-actual small{color:var(--azul-claro)}
.cola__fila.es-vista strong{color:var(--tenue)}
.cabecera-clase{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:60px;align-items:end;padding:54px 48px 46px}
.cabecera-clase h1{font-size:clamp(38px,5.2vw,76px);max-width:14ch;line-height:.92}
.vecinas{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);padding:0}
.vecina{display:grid;grid-template-columns:minmax(0,46%) minmax(0,1fr);gap:30px;align-items:center;padding:40px 48px}
.vecina+.vecina{border-left:1px solid var(--linea)}
.vecina:hover{background:var(--hover)}
.vecina .img{aspect-ratio:16/9}
.vecina .img img{transition:transform .5s}.vecina:hover .img img{transform:scale(1.04)}
.vecina .num{display:block;margin-top:16px;font-family:var(--titular);font-weight:700;font-size:44px;line-height:.9;color:var(--num)}
.vecina strong{display:block;margin-top:10px;font-family:var(--titular);font-weight:700;font-size:clamp(17px,1.7vw,26px);line-height:1.02;text-transform:uppercase}
.vecina i{display:inline-block;margin-top:20px;font-style:normal;font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;border-bottom:1px solid var(--linea);padding-bottom:4px;white-space:nowrap}
.vecina--siguiente{box-shadow:inset 0 2px 0 var(--azul)}
.vecina--siguiente .num{color:var(--azul)}.vecina--siguiente i{border-bottom-color:var(--azul)}
.vecina--anterior .img img{filter:grayscale(1) brightness(.8)}
.vecina--anterior strong{font-size:clamp(15px,1.3vw,20px);color:var(--texto2)}
.vecina--anterior .num{font-size:32px}
.partida{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);padding:0}
.partida>div{padding:46px 48px}
.partida>div+div{border-left:1px solid var(--linea)}
.profesor{display:grid;grid-template-columns:150px minmax(0,1fr);gap:28px;align-items:center}
.profesor img{width:150px;height:150px;object-fit:cover;border-radius:var(--grande);filter:grayscale(1) contrast(1.05)}
.profesor h3{margin-top:10px;font-size:26px}
.profesor p{margin-top:10px;font-size:14px;color:var(--texto2)}
.profesor .acciones{margin-top:20px}
.grabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:18px}
.grabs--4{grid-template-columns:repeat(4,minmax(0,1fr));margin-top:30px}
.grab .img{aspect-ratio:16/9;background:linear-gradient(135deg,var(--sup),var(--foto));border:1px solid var(--linea)}
.grab small{display:block;margin-top:8px;font-size:10px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--tenue)}
.grab--nueva{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;gap:8px;aspect-ratio:16/9;padding:14px;border:1px solid var(--azul);border-radius:var(--grande);font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.grab--nueva i{width:10px;height:10px;border-radius:50%;background:#e23b3b}
.grab--nueva small{margin:0;font-size:9px}
.barra-siguiente{position:sticky;bottom:0;z-index:20;display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:34px;align-items:center;margin:0 24px;padding:16px 16px 16px 36px;background:var(--azul);border-radius:var(--grande) var(--grande) 0 0;box-shadow:0 -8px 30px rgba(0,0,0,.35);transform:translateY(110%);transition:transform .35s}
.barra-siguiente.visible{transform:none}
.barra-siguiente span{font-family:var(--titular);font-weight:600;font-size:22px;line-height:1;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.barra-siguiente small{display:block;margin-bottom:8px;font-family:Poppins;font-size:10px;font-weight:700;letter-spacing:.34em;opacity:.85}
.barra-siguiente b{font-family:var(--titular);font-weight:700;font-size:20px}
.barra-siguiente i{font-style:normal;padding:17px 42px;background:#000;border-radius:var(--boton);font-size:12px;font-weight:700;letter-spacing:.22em;text-transform:uppercase}

/* ---- ficha de profesor ---- */
.perfil-profe{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:64px;align-items:center;padding:48px}
.perfil-profe .img{aspect-ratio:4/5}
.perfil-profe .img img{object-position:center 15%}
.perfil-profe h1{font-size:clamp(40px,5.6vw,88px)}
.perfil-profe .cifras{display:inline-flex;margin-top:30px}

/* ---- suscríbete ---- */
.planes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:0 48px 64px;border:1px solid var(--linea);border-radius:var(--grande);overflow:hidden}
.plan{padding:40px 38px 34px;border-left:1px solid var(--linea)}
.plan:first-child{border-left:0}
.plan--destacado{background:var(--azul-suave);box-shadow:inset 0 3px 0 var(--azul)}
.plan h3{margin-top:16px;font-size:24px}
.precio{display:flex;align-items:baseline;gap:12px;margin-top:30px}
.precio b{font-family:var(--titular);font-weight:700;font-size:56px;line-height:.9}
.precio span{font-size:11px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--tenue)}
.plan .nota{margin:14px 0 26px;font-size:13px;color:var(--texto2);min-height:1.5em}
.plan .btn{display:block}
.plan ul{margin-top:30px}
.partida--dudas{grid-template-columns:minmax(0,4fr) minmax(0,8fr)}
details{border-top:1px solid var(--linea)}
details:last-child{border-bottom:1px solid var(--linea)}
summary{display:flex;justify-content:space-between;gap:20px;padding:22px 0;list-style:none;font-size:16px;font-weight:600;cursor:pointer}
summary i{font-style:normal;color:var(--azul);font-weight:700}
details p{margin:-6px 0 24px;max-width:64ch;font-size:14px;line-height:1.6;color:var(--texto2)}

/* ---- formularios: pago, acceso, contacto ---- */
label{display:block;margin-top:22px;font-size:10px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--tenue)}
.campo{display:block;margin-top:9px;padding:16px 18px;border:1px solid var(--borde-campo);border-radius:var(--campo);font-size:15px;font-weight:400;letter-spacing:0;text-transform:none;color:var(--tenue);background:var(--campo-fondo)}
.campo--activo{border-color:var(--azul);color:var(--texto);box-shadow:0 0 0 1px var(--azul)}
.campo em{font-style:normal;color:var(--azul)}
.campo--lista{display:flex;justify-content:space-between;color:var(--texto)}
.campo--alto{min-height:150px}
.dos-campos{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.campo-con-boton{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:end}
.campo-con-boton .btn{padding-top:17px;padding-bottom:17px}
.acepto{display:flex;align-items:center;gap:12px;margin:26px 0 24px;font-size:13px;color:var(--texto2)}
.acepto--entre{justify-content:space-between}.acepto--entre span{display:flex;align-items:center;gap:12px}
.acepto i{flex:none;width:18px;height:18px;border:1px solid var(--borde-campo);border-radius:3px}
.seguro{margin-top:16px;font-size:12px;color:var(--tenue);text-align:center}
.pago{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:72px;align-items:start;padding:30px 48px 90px;max-width:1340px;margin:0 auto}
.paso{display:grid;grid-template-columns:70px minmax(0,1fr);margin-top:40px;padding-top:30px;border-top:1px solid var(--linea)}
.paso>b{font-family:var(--titular);font-weight:700;font-size:30px;line-height:1;color:var(--azul)}
.paso h3{margin-top:4px;font-weight:600;font-size:17px}
.hecho{margin-top:14px;font-size:15px;color:var(--texto2)}
.hecho a{margin-left:14px;font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--tenue);border-bottom:1px solid var(--linea)}
.resumen-pago{position:sticky;top:70px;margin-top:38px}
.linea{display:flex;justify-content:space-between;align-items:baseline;padding:6px 0;font-size:15px}
.linea--tenue{font-size:12px;color:var(--tenue)}
.resumen-pago ul{margin-top:22px}
.linea--total{padding-top:22px;border-top:1px solid var(--linea);font-size:12px;font-weight:700;letter-spacing:.24em;text-transform:uppercase}
.linea--total b{font-family:var(--titular);font-weight:700;font-size:34px;letter-spacing:0}
.pequeno{margin-top:12px;font-size:12px;color:var(--tenue)}
.acceso{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);min-height:calc(100vh - 112px)}
.acceso__foto{position:relative;display:flex;align-items:flex-end;padding:56px 48px;overflow:hidden;background:#000}
.acceso__foto video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.6) saturate(.85)}
.acceso__foto div{position:relative}
.acceso__foto h2{font-size:clamp(30px,3.6vw,56px);max-width:12ch;margin-top:16px}
.acceso__formulario{align-self:center;width:100%;max-width:520px;margin:0 auto;padding:56px 48px}
.o{display:flex;align-items:center;gap:16px;margin:22px 0;font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--tenue)}
.o::before,.o::after{content:'';flex:1;height:1px;background:var(--linea)}
.contacto{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:72px;align-items:start;padding:64px 48px 96px}
.lista-rayas--datos{margin-top:40px;max-width:520px}
.lista-rayas--datos li{font-size:16px;color:var(--texto);padding-top:16px;padding-bottom:16px}
.lista-rayas--datos li::before{top:24px}
.lista-rayas--datos .rotulo{margin-bottom:6px;font-size:10px}
.contacto .panel label:first-child,.contacto .dos-campos label{margin-top:0}

/* ---- mi cuenta ---- */
.cuenta{display:grid;grid-template-columns:260px minmax(0,1fr);align-items:start}
.cuenta__menu{position:sticky;top:42px;display:flex;flex-direction:column;min-height:calc(100vh - 112px);padding:40px 0 30px 48px;border-right:1px solid var(--linea)}
.cuenta__menu .rotulo{margin-bottom:18px}
.cuenta__menu a{display:flex;justify-content:space-between;align-items:center;padding:13px 22px 13px 16px;margin-left:-16px;font-size:14px;font-weight:500;color:var(--texto2);border-left:2px solid transparent}
.cuenta__menu a:hover{background:var(--hover)}
.cuenta__menu a.on{color:var(--texto);font-weight:600;border-left-color:var(--azul);background:var(--azul-suave)}
.cuenta__menu a b{min-width:20px;padding:2px 6px;background:var(--azul);color:#fff;border-radius:3px;font-size:10px;text-align:center}
.cuenta__menu .salir{margin-top:auto;color:var(--tenue)}
.cuenta__contenido{padding:44px 48px 90px}
.cuenta__cifras{display:inline-flex;margin-top:30px}
.cuenta__dos{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:28px}
.tabla{width:100%;margin-top:16px;border-collapse:collapse;font-size:13.5px}
.tabla td{padding:13px 0;border-top:1px solid var(--linea2);color:var(--texto2)}
.tabla td:nth-child(3){font-weight:600;color:var(--texto);text-align:right;padding-right:20px}
.tabla td:last-child{text-align:right;font-size:11px;font-weight:700;letter-spacing:.14em;color:var(--azul-claro)}

/* ---- mensajes ---- */
.mensajes{display:grid;grid-template-columns:400px minmax(0,1fr);height:calc(100vh - 112px);min-height:640px}
.mensajes__lista{border-right:1px solid var(--linea);overflow-y:auto}
.mensajes__cabeza{padding:34px 28px 26px 48px}
.mensajes__cabeza .rotulo{margin-top:12px}
.hilo{display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:14px;align-items:center;padding:16px 24px 16px 45px;border-top:1px solid var(--linea);border-left:3px solid transparent}
.hilo:hover{background:var(--hover)}
.hilo.on{border-left-color:var(--azul);background:var(--azul-suave)}
.hilo img,.mensajes__hilo header img{width:48px;height:48px;object-fit:cover;object-position:center 15%;border-radius:var(--boton);filter:grayscale(1)}
.hilo strong{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600}
.hilo strong b{width:7px;height:7px;border-radius:50%;background:var(--azul)}
.hilo small{display:block;margin-top:4px;font-size:12.5px;color:var(--tenue);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hilo time{font-size:10.5px;color:var(--tenue)}
.mensajes__hilo{display:flex;flex-direction:column;min-width:0}
.mensajes__hilo header{display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:14px;align-items:center;padding:20px 48px 20px 32px;border-bottom:1px solid var(--linea)}
.mensajes__hilo header strong{display:block;font-family:var(--titular);font-weight:700;font-size:16px;text-transform:uppercase}
.mensajes__hilo header small{display:block;margin-top:4px;font-size:12px;color:var(--tenue)}
.charla{flex:1;display:flex;flex-direction:column;gap:14px;padding:30px 48px 30px 32px;overflow-y:auto}
.sobre{align-self:center;padding:8px 14px;border:1px solid var(--linea);border-radius:var(--boton);font-size:12px;color:var(--texto2)}
.sobre span{margin-right:8px;font-size:9.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--azul-claro)}
.globo{max-width:min(62ch,72%);padding:15px 18px 12px;border:1px solid var(--linea);border-radius:var(--grande);background:var(--sup);font-size:14.5px;line-height:1.55}
.globo time{display:block;margin-top:8px;font-size:10.5px;color:var(--tenue)}
.globo--mio{align-self:flex-end;background:var(--azul);border-color:var(--azul);color:#fff}
.globo--mio time{color:rgba(255,255,255,.75)}
.globo--video .img{width:260px;aspect-ratio:16/9;margin-bottom:10px;background:rgba(0,0,0,.35)}
.mensajes__hilo footer{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:12px;align-items:center;padding:18px 48px 22px 32px;border-top:1px solid var(--linea)}
.mensajes__hilo footer .campo{margin:0}
.mensajes__hilo footer .btn{padding-top:17px;padding-bottom:17px}
body[data-pagina="mensajes"] .pie-web,body[data-pagina="acceso"] .pie-web{display:none}

.mensajes__cabeza h1{font-size:30px}

/* ---- comparar con la web actual ---- */
.actual{display:none;background:#fff}
.actual img{width:100%;display:none}
.actual p{padding:120px 48px;color:#333;text-align:center;font-size:15px}
body.viendo-actual .actual{display:block}
body.viendo-actual .pagina.on,body.viendo-actual .nav,body.viendo-actual .pie-web{display:none}

/* ---- portada: carriles de carteles, niveles, estilos con foto, reseñas ---- */
.desc--ancha{max-width:90ch;margin-top:18px}
.carril{position:relative;margin:36px -48px 0;padding-left:48px}
.carril__pista{display:flex;gap:20px;overflow-x:auto;padding-right:48px;scroll-snap-type:x proximity;scrollbar-width:none}
.carril__pista::-webkit-scrollbar{display:none}
.carril__flecha{position:absolute;right:24px;top:38%;width:52px;height:52px;display:grid;place-items:center;background:var(--azul);color:#fff;border-radius:var(--boton);font-size:20px;cursor:pointer;box-shadow:0 6px 24px rgba(0,0,0,.4)}
.cartel{flex:0 0 calc((100% - 48px - 80px) / 5);min-width:240px;scroll-snap-align:start;display:block}
.cartel .img{aspect-ratio:9/16}
.cartel .img img{transition:transform .5s}
.cartel:hover .img img{transform:scale(1.04)}
.cartel .img::after{content:'';position:absolute;left:0;right:0;top:0;height:2px;background:var(--azul);transform:scaleX(0);transform-origin:left;transition:transform .35s;z-index:2}
.cartel:hover .img::after{transform:scaleX(1)}
.cartel>.rotulo{margin-top:16px;font-size:10px;letter-spacing:.24em}
.cartel>strong{display:block;margin-top:9px;font-family:var(--titular);font-weight:700;font-size:16px;line-height:1.08;text-transform:uppercase}
.cartel--foto .img{aspect-ratio:3/4}
.cartel--foto .img::before{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(to top,rgba(0,0,0,.92) 0%,rgba(0,0,0,.3) 45%,rgba(0,0,0,0) 65%);pointer-events:none}
.cartel__texto{position:absolute;z-index:2;left:18px;right:18px;bottom:18px;color:#fff}
.cartel__texto .rotulo{font-size:9.5px;letter-spacing:.22em;color:#6fb1ff}
.cartel__texto strong{display:block;margin-top:9px;font-family:var(--titular);font-weight:700;font-size:18px;line-height:1.05;text-transform:uppercase}
.cartel__texto small{display:block;margin-top:9px;font-size:11.5px;color:#d6d6d6}
.niveles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:40px;border:1px solid var(--linea);border-radius:var(--grande);overflow:hidden}
.niveles a{display:block;padding:32px 30px 30px;border-left:1px solid var(--linea);transition:background .25s}
.niveles a:first-child{border-left:0}
.niveles a:hover{background:var(--azul-suave);box-shadow:inset 0 2px 0 var(--azul)}
.niveles b{font-family:var(--titular);font-weight:700;font-size:16px;color:var(--num)}
.niveles a:hover b{color:var(--azul)}
.medidor--4{float:right;height:16px}
.medidor--4 i{width:18px;height:8px;border-color:var(--borde-campo)}
.niveles strong{display:block;clear:both;margin-top:40px;font-family:var(--titular);font-weight:700;font-size:24px;line-height:1;text-transform:uppercase}
.niveles p{margin-top:14px;min-height:4.6em;font-size:15px;line-height:1.55;color:var(--texto2)}
.niveles .ir{display:inline-block;margin-top:18px;font-style:normal;font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;border-bottom:1px solid var(--linea);padding-bottom:3px}
.niveles a:hover .ir{border-bottom-color:var(--azul)}
.herramientas em{margin-left:10px;padding:2px 7px;background:var(--azul);color:#fff;border-radius:3px;font-style:normal;font-size:9px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;vertical-align:middle}
.estilos-con-foto{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:start;margin-top:34px}
.estilos-con-foto .estilos{margin-top:0}
.estilos-con-foto .estilos strong{font-size:clamp(22px,2.7vw,40px)}
.estilos-con-foto .estilos a{padding-top:15px;padding-bottom:15px}
.estilos a.on{padding-left:24px;background:var(--hover)}
.estilos a.on i{opacity:1}.estilos a.on b{color:var(--azul)}
.estilos__foto{position:sticky;top:70px;aspect-ratio:5/4;overflow:hidden;border-radius:var(--grande);background:var(--foto)}
.estilos__foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .4s}
.estilos__foto img.on{opacity:1}
.partida--resenas{grid-template-columns:minmax(0,4fr) minmax(0,8fr)}
.nota-media{display:flex;align-items:center;gap:18px;margin-top:22px}
.nota-media b{font-family:var(--titular);font-weight:700;font-size:84px;line-height:.85}
.nota-media span{font-size:13px;color:var(--texto2)}
.nota-media i,.resenas i{display:block;margin-bottom:6px;font-style:normal;letter-spacing:3px;color:var(--azul);font-size:15px}
.partida--resenas h3{margin-top:30px;font-size:26px;line-height:1.1}
.tienda img{width:190px;margin-top:24px;border-radius:var(--boton)}
.resenas{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0}
.resenas blockquote{margin:0;padding:22px 26px 24px;border-left:1px solid var(--linea);border-bottom:1px solid var(--linea)}
.resenas blockquote:nth-child(n+4){border-bottom:0}
.resenas p{font-size:15px;line-height:1.55;color:var(--texto)}
.resenas footer{margin-top:14px;font-size:10px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--tenue)}
.seccion--planes .planes{margin:40px 0 0}
.contigo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:center}
.contigo img{width:100%}
.dos-col--medio{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr)}
.dos-col--medio h2{font-size:clamp(26px,2.9vw,44px)}

/* ================= PORTADA QUE VENDE ================= */
.garantia{display:flex;flex-wrap:wrap;gap:10px 28px;margin-top:26px;font-size:12px;font-weight:600;letter-spacing:.08em;color:rgba(255,255,255,.85)}
.garantia i{font-style:normal;letter-spacing:2px;color:#6fb1ff;margin-right:6px}
.garantia span+span::before{content:'';display:inline-block;width:12px;height:2px;margin-right:12px;vertical-align:middle;background:var(--azul)}

/* ---- el taller: la sección grande de herramientas ---- */
.taller{position:relative;height:calc(var(--pasos) * 78vh + 100vh);background:#000;border-top:1px solid var(--linea)}
.taller__fijo{position:sticky;top:42px;height:calc(100vh - 42px);display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:56px;align-items:center;padding:28px 48px;overflow:hidden}
.taller__texto{display:flex;flex-direction:column;height:100%;min-height:0;padding:16px 0}
.taller h2{font-size:clamp(24px,2.5vw,38px);line-height:1.02}
.taller__pasos{position:relative;flex:1;min-height:250px;margin-top:30px}
.taller__pasos article{position:absolute;left:0;right:0;top:0;opacity:0;transform:translateY(26px);transition:opacity .45s,transform .45s;pointer-events:none}
.taller__pasos article.on{opacity:1;transform:none}
.taller__num{display:flex;align-items:baseline;gap:10px}
.taller__num b{font-family:var(--titular);font-weight:700;font-size:64px;line-height:.9;color:var(--azul)}
.taller__num span{font-size:12px;font-weight:700;letter-spacing:.2em;color:var(--tenue)}
.taller__num em{margin-left:8px;padding:4px 9px;background:var(--azul);border-radius:3px;font-style:normal;font-size:9.5px;font-weight:700;letter-spacing:.18em;text-transform:uppercase}
.taller__pasos h3{margin-top:22px;font-size:clamp(26px,3vw,46px);line-height:.98;max-width:13ch}
.taller__pasos article>p:last-child{max-width:44ch;margin-top:20px;font-size:17px;line-height:1.55;color:#cfcfcf}
.taller__carril{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--linea)}
.taller__carril li{padding:13px 0 11px;border-bottom:1px solid var(--linea);border-top:2px solid transparent;margin-top:-1px;font-size:11px;font-weight:600;letter-spacing:.08em;color:var(--tenue);cursor:pointer;transition:color .3s,border-color .3s}
.taller__carril li b{margin-right:8px;font-family:var(--titular);font-weight:700;font-size:10px;color:var(--num)}
.taller__carril li.on{color:#fff;border-top-color:var(--azul)}
.taller__carril li.on b{color:var(--azul)}
.taller__pantalla{min-width:0}
.taller__marco{position:relative;aspect-ratio:16/9;overflow:hidden;background:#0a0a0a;border:1px solid rgba(255,255,255,.2);border-radius:var(--grande);box-shadow:0 30px 80px rgba(11,121,251,.16)}
.taller__videos{position:absolute;inset:0;transition:transform .6s cubic-bezier(.2,.7,.2,1),width .5s,inset .5s}
.taller__videos video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity .5s}
.taller__videos .vb{opacity:0}
.taller__nota{margin-top:14px;font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--tenue);text-align:center}
.taller__barra{position:absolute;left:0;right:0;bottom:0;z-index:5;padding:40px 18px 12px;background:linear-gradient(to top,rgba(0,0,0,.85),rgba(0,0,0,0))}
.tiempo{position:relative;display:block;height:4px;background:rgba(255,255,255,.25);border-radius:2px}
.tiempo i{display:block;height:100%;width:0;background:#fff;border-radius:2px}
.tiempo u{position:absolute;top:-6px;width:3px;height:16px;background:var(--azul);opacity:0;transition:opacity .3s}
.tiempo u.a{left:3%}.tiempo u.b{left:8%}
.tiempo u.a::after{content:'';position:absolute;left:3px;top:6px;height:4px;width:calc((100vw - 96px) * 7 / 12 * .05);background:rgba(11,121,251,.8)}
.iconos{display:flex;justify-content:center;gap:6px;margin-top:11px}
.iconos em{padding:6px 10px;border:1px solid rgba(255,255,255,.22);border-radius:var(--boton);font-style:normal;font-size:9.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.7);transition:all .3s}
.iconos em.on{background:var(--azul);border-color:var(--azul);color:#fff;transform:translateY(-3px)}
.capa{position:absolute;z-index:4;opacity:0;pointer-events:none;transition:opacity .45s,transform .45s}
.capa b{display:block;font-family:var(--titular);font-weight:700;text-transform:uppercase}
/* lo que hace cada herramienta sobre el vídeo */
.taller[data-herramienta="camaras"] .vb{opacity:1}
.capa--camaras,.capa--espejo{left:18px;top:18px;padding:9px 13px;background:rgba(0,0,0,.7);border-left:2px solid var(--azul);font-size:11px}
.taller[data-herramienta="camaras"] .capa--camaras,.taller[data-herramienta="espejo"] .capa--espejo{opacity:1}
.taller[data-herramienta="espejo"] .taller__videos{transform:scaleX(-1)}
.capa--velocidad,.capa--bucle{right:22px;top:22px;padding:16px 20px;background:rgba(0,0,0,.72);border:1px solid rgba(255,255,255,.25);border-radius:var(--grande);text-align:right;transform:translateY(-14px)}
.capa--velocidad b{font-size:44px;line-height:1;color:#fff}
.capa--bucle b{font-size:22px;color:#6fb1ff}
.capa small{display:block;margin-top:7px;font-size:10px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:#cfcfcf}
.taller[data-herramienta="velocidad"] .capa--velocidad,.taller[data-herramienta="bucle"] .capa--bucle{opacity:1;transform:none}
.taller[data-herramienta="bucle"] .tiempo u{opacity:1}
.capa--secciones{right:0;top:0;bottom:0;width:38%;padding:22px 20px;background:rgba(0,0,0,.86);border-left:1px solid rgba(255,255,255,.2);transform:translateX(30px)}
.capa--secciones p,.capa--pregunta p{margin-bottom:12px;font-size:10px;font-weight:700;letter-spacing:.28em;text-transform:uppercase;color:#cfcfcf}
.capa--secciones span{display:flex;gap:12px;padding:9px 8px;border-top:1px solid rgba(255,255,255,.1);border-left:2px solid transparent;font-size:12.5px;line-height:1.3}
.capa--secciones span small{margin:0;font-size:11px;letter-spacing:0;color:#9c9c9c;font-variant-numeric:tabular-nums}
.capa--secciones span.on{border-left-color:var(--azul);background:rgba(11,121,251,.18)}
.taller[data-herramienta="secciones"] .capa--secciones{opacity:1;transform:none}
.capa--camara,.tuya{display:grid;place-items:center;background:linear-gradient(160deg,#20242c,#0d0f13);border-left:1px solid rgba(255,255,255,.25)}
.capa--camara{right:0;top:0;bottom:0;width:36%}
.capa--camara b,.tuya b{position:absolute;left:12px;top:12px;padding:6px 9px;background:rgba(0,0,0,.6);font-size:9.5px;letter-spacing:.06em}
.silueta{width:34%;aspect-ratio:1/2.3;background:radial-gradient(circle at 50% 12%,#59606e 0 11%,transparent 11.5%),linear-gradient(#59606e,#59606e) 50% 62%/52% 62% no-repeat;border-radius:40% 40% 8% 8%;opacity:.8}
.taller[data-herramienta="camara"] .capa--camara{opacity:1}
.taller[data-herramienta="camara"] .taller__videos{inset:0 36% 0 0}
.capa--grabate{inset:0}
.rec{position:absolute;left:18px;top:18px;display:flex;align-items:center;gap:9px;padding:9px 13px;background:rgba(0,0,0,.72);border-radius:var(--boton);font-size:11px;font-weight:700;letter-spacing:.16em}
.rec i{width:10px;height:10px;border-radius:50%;background:#e23b3b;animation:late 1s infinite}
@keyframes late{50%{opacity:.25}}
.tuya{position:absolute;right:0;top:0;bottom:0;width:50%}
.taller[data-herramienta="grabate"] .capa--grabate{opacity:1}
.taller[data-herramienta="grabate"] .taller__videos{inset:0 50% 0 0}
.capa--pregunta{right:22px;bottom:86px;width:min(340px,44%);padding:18px;background:rgba(8,8,10,.94);border:1px solid rgba(255,255,255,.25);border-radius:var(--grande);box-shadow:inset 0 2px 0 var(--azul);transform:translateY(24px)}
.capa--pregunta .adj{display:block;padding:9px 11px;margin-bottom:9px;border:1px solid rgba(255,255,255,.2);border-radius:var(--boton);font-size:11px;color:#6fb1ff}
.capa--pregunta .msg{display:block;min-height:66px;padding:11px;border:1px solid var(--azul);border-radius:var(--boton);font-size:13px;line-height:1.45}
.capa--pregunta .btn{display:block;margin-top:10px;padding:11px}
.taller[data-herramienta="pregunta"] .capa--pregunta{opacity:1;transform:none}

/* ---- niveles y estilos, en corto ---- */
.niveles--corto strong{margin-top:26px;font-size:20px}
.niveles--corto p{min-height:0;font-size:14px}
.niveles--corto a{padding:24px 26px}
.estilos-tira__titulo{margin-top:44px}
.estilos-tira{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));gap:10px;margin-top:16px}
.estilos-tira a{position:relative;display:block;aspect-ratio:4/5;overflow:hidden;border-radius:var(--grande);background:var(--foto)}
.estilos-tira img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) brightness(.7);transition:filter .4s,transform .5s}
.estilos-tira a:hover img{filter:none;transform:scale(1.05)}
.estilos-tira strong{position:absolute;left:10px;right:8px;bottom:10px;font-family:var(--titular);font-weight:700;font-size:11px;line-height:1.1;text-transform:uppercase;color:#fff}
.estilos-tira a::after{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.8),rgba(0,0,0,0) 55%)}
.estilos-tira strong{z-index:1}
.cierre--final{margin-top:0;padding:56px 52px}
.cierre--final h2{font-size:clamp(26px,3.2vw,48px);max-width:20ch}
.cierre--final .garantia i{color:#fff}
.cierre--final .garantia span+span::before{background:#fff}

body.solo-taller .heroe--portada{display:none}
.taller__carril{grid-template-columns:repeat(8,minmax(0,1fr));gap:6px;border-top:0}
.taller__carril li{font-size:0;padding:12px 0 0;border-bottom:0;border-top:2px solid var(--linea);margin-top:0}
.taller__carril li b{margin:0;font-size:11px}
.taller__texto{height:auto;padding:0}
.taller__pasos{flex:none;height:310px}
.taller__pasos{height:350px}
body.solo-taller[data-resto] .taller{display:none}

/* ---- el taller, segunda versión: reproductor de verdad y cambio solo, por tiempo ---- */
.taller{height:auto}
.taller__fijo{position:static;height:auto;min-height:calc(100vh - 42px);grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:48px;padding:64px 48px}
.taller__marco{aspect-ratio:auto;border:0;background:none;overflow:visible;box-shadow:0 30px 90px rgba(11,121,251,.18)}
.taller__real{width:100%;aspect-ratio:16/9;background:#000;border-radius:var(--grande);overflow:hidden}
.taller__pasos{height:330px}
.taller__pasos h3{font-size:clamp(24px,2.5vw,38px)}
.taller__carril{grid-template-columns:repeat(6,minmax(0,1fr))}
.taller__carril li{position:relative;font-size:0}
.taller__carril li::after{content:'';position:absolute;left:0;top:-2px;height:2px;width:0;background:var(--azul)}
.taller__carril li.on{border-top-color:rgba(255,255,255,.3)}
.taller__carril li.corre::after{animation:corre 6s linear forwards}
.taller.en-manos .taller__carril li.on{border-top-color:var(--azul)}
@keyframes corre{to{width:100%}}
.taller__nota .tuyo,.taller.en-manos .taller__nota .auto{display:none}
.taller.en-manos .taller__nota .tuyo{display:inline}
.taller__seguir{color:#fff;border-bottom:1px solid var(--azul);cursor:pointer}
.ademas{padding-top:0;border-top:0;background:#000}
.ademas>div{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:18px}
.ademas article{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:26px;align-items:center;padding:18px;border:1px solid var(--linea);border-radius:var(--grande)}
.ademas .hueco{display:grid;place-items:center;aspect-ratio:16/9;padding:14px;border:1px dashed rgba(255,255,255,.3);border-radius:var(--boton);font-size:11px;line-height:1.4;text-align:center;color:var(--tenue)}
.ademas h3{font-size:19px;line-height:1.1}
.ademas h3 em{display:inline-block;margin-left:6px;padding:3px 7px;background:var(--azul);border-radius:3px;font-family:Poppins;font-style:normal;font-size:9px;font-weight:700;letter-spacing:.16em;vertical-align:middle}
.ademas p{margin-top:10px;font-size:14px;line-height:1.55;color:#cfcfcf}

/* ---- el puntero de la demostración ---- */
.taller__marco{position:relative}
.taller__puntero{position:absolute;left:0;top:0;z-index:60;width:0;height:0;pointer-events:none;opacity:0;transform:translate(60%,60%);transition:transform .7s cubic-bezier(.3,.7,.2,1),opacity .3s}
.taller__puntero.visible{opacity:1}
.taller__puntero svg{position:absolute;left:-5px;top:-3px;filter:drop-shadow(0 3px 6px rgba(0,0,0,.6))}
.taller__puntero i{position:absolute;left:-22px;top:-22px;width:44px;height:44px;border:3px solid #0b79fb;border-radius:50%;opacity:0}
.taller__puntero.clic i{animation:clic .6s ease-out}
.taller__puntero.clic svg{animation:aprieta .25s}
@keyframes clic{0%{opacity:1;transform:scale(.3)}100%{opacity:0;transform:scale(1.5)}}
@keyframes aprieta{50%{transform:scale(.82)}}
.taller.en-manos .taller__puntero{opacity:0}
.taller__carril li.corre::after{animation-duration:var(--taller-segundos,7s)}
.taller__puntero{z-index:2147483000}
.taller__pasos h3{font-size:clamp(30px,3.4vw,54px);max-width:none;line-height:.95}
.taller__pasos{height:360px}

/* ---- niveles: cuatro peldaños; el que miras se abre y pone su clase ---- */
.escalera{display:flex;gap:10px;height:540px;margin-top:40px}
.peldano{position:relative;flex:1 1 0;min-width:0;display:block;overflow:hidden;border-radius:var(--grande);background:#111;color:#fff;transition:flex-grow .55s cubic-bezier(.3,.7,.2,1)}
.peldano.on{flex-grow:3.4;box-shadow:inset 0 0 0 0 transparent}
.peldano img,.peldano video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.peldano img{filter:grayscale(1) brightness(.55);transition:filter .5s}
.peldano video{opacity:0;transition:opacity .5s}
.peldano.on video{opacity:1}
.peldano.on img{filter:none}
.peldano::before{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(to top,rgba(0,0,0,.92) 0%,rgba(0,0,0,.25) 48%,rgba(0,0,0,.45) 100%)}
.peldano::after{content:'';position:absolute;left:0;right:0;top:0;z-index:2;height:3px;background:var(--azul);transform:scaleX(0);transform-origin:left;transition:transform .5s}
.peldano.on::after{transform:scaleX(1)}
.peldano__arriba{position:absolute;z-index:2;left:22px;right:22px;top:22px;display:flex;justify-content:space-between;align-items:center}
.peldano__arriba b{font-family:var(--titular);font-weight:700;font-size:18px;color:rgba(255,255,255,.6)}
.peldano.on .peldano__arriba b{color:#6fb1ff}
.peldano .medidor--4{float:none}
.peldano .medidor--4 i{border-color:rgba(255,255,255,.45)}
.peldano__abajo{position:absolute;z-index:2;left:22px;right:22px;bottom:24px}
.peldano strong{display:block;font-family:var(--titular);font-weight:700;font-size:20px;line-height:1;text-transform:uppercase;white-space:nowrap;transition:font-size .45s}
.peldano.on strong{font-size:clamp(30px,3.6vw,54px)}
.peldano em{display:block;margin-top:12px;font-style:normal;font-size:14px;line-height:1.4;color:#d8d8d8}
.peldano.on em{font-size:18px;color:#fff}
.peldano__mas{display:block;max-width:46ch;max-height:0;overflow:hidden;opacity:0;font-size:15px;line-height:1.55;color:#d8d8d8;transition:max-height .5s,opacity .4s,margin .4s}
.peldano.on .peldano__mas{max-height:160px;opacity:1;margin-top:8px}
.peldano__mas i{display:block;width:max-content;margin-top:18px;font-style:normal;font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:#fff;border-bottom:1px solid var(--azul);padding-bottom:4px}

/* ---- tu cámara y Grábate, escenificados sobre el reproductor ---- */
.taller__carril{grid-template-columns:repeat(8,minmax(0,1fr))}
.taller__marco{aspect-ratio:16/9;background:#000;border-radius:var(--grande);overflow:hidden}
.taller__real{height:100%;aspect-ratio:auto;border-radius:0;transition:width .5s cubic-bezier(.3,.7,.2,1)}
.taller__marco[data-escena="camara"] .taller__real{width:64%}
.taller__marco[data-escena="grabando"] .taller__real{width:50%}
.escena{position:absolute;inset:0;z-index:40;pointer-events:none}
.escena video{position:absolute;right:0;top:0;height:100%;width:0;object-fit:cover;transform:scaleX(-1);opacity:0;border-left:2px solid #000;transition:width .5s cubic-bezier(.3,.7,.2,1),opacity .4s}
.taller__marco[data-escena="camara"] .escena video{width:36%;opacity:1}
.taller__marco[data-escena="grabando"] .escena video{width:50%;opacity:1}
.escena__rotulo{position:absolute;right:14px;top:14px;padding:7px 11px;background:rgba(0,0,0,.7);border-radius:var(--boton);font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;opacity:0;transition:opacity .4s}
.taller__marco[data-escena="camara"] .escena__rotulo,.taller__marco[data-escena="grabando"] .escena__rotulo{opacity:1}
.escena__rec{position:absolute;left:50%;top:16px;transform:translateX(-50%);display:flex;align-items:center;gap:9px;padding:9px 14px;background:rgba(0,0,0,.78);border-radius:var(--boton);font-size:12px;font-weight:700;letter-spacing:.14em;opacity:0;transition:opacity .3s}
.escena__rec i{width:10px;height:10px;border-radius:50%;background:#e23b3b;animation:late 1s infinite}
.escena__rec u{text-decoration:none;font-variant-numeric:tabular-nums}
.taller__marco[data-escena="grabando"] .escena__rec{opacity:1}
.escena__boton{position:absolute;left:50%;top:38%;transform:translate(-50%,10px);display:flex;align-items:center;gap:10px;padding:14px 22px;background:rgba(0,0,0,.8);border:1px solid rgba(255,255,255,.4);border-radius:var(--boton);font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;opacity:0;transition:opacity .35s,transform .35s}
.escena__boton i{width:11px;height:11px;border-radius:50%;background:#e23b3b}
.taller__marco[data-escena="boton"] .escena__boton{opacity:1;transform:translate(-50%,0)}

/* las escenas no encogen el reproductor (se quedaba con un hueco negro debajo): lo corren a un lado y su panel ocupa el otro */
.taller__carril{grid-template-columns:repeat(9,minmax(0,1fr))}
.taller__real{transition:transform .5s cubic-bezier(.3,.7,.2,1)}
.taller__marco[data-escena="camara"] .taller__real,.taller__marco[data-escena="amigo"] .taller__real{width:100%;transform:translateX(-18%)}
.taller__marco[data-escena="grabando"] .taller__real{width:100%;transform:translateX(-25%)}
.taller__marco[data-escena="amigo"] .escena video{width:36%;opacity:1;transform:none}
.taller__marco[data-escena="amigo"] .escena__rotulo{opacity:1}
.escena__boton--amigo{display:none}
.taller__marco[data-escena="boton-amigo"] .escena__boton--amigo{display:flex;opacity:1;transform:translate(-50%,0)}
.escena__codigo{position:absolute;left:50%;top:50%;transform:translate(-50%,-40%);min-width:300px;padding:26px 30px 22px;background:rgba(6,6,8,.94);border:1px solid rgba(255,255,255,.28);border-radius:var(--grande);box-shadow:inset 0 2px 0 var(--azul);text-align:center;opacity:0;transition:opacity .35s,transform .35s}
.escena__codigo small{display:block;font-size:10px;font-weight:700;letter-spacing:.26em;text-transform:uppercase;color:#cfcfcf}
.escena__codigo b{display:block;margin:14px 0 12px;font-family:var(--titular);font-weight:700;font-size:44px;line-height:1;letter-spacing:.08em}
.escena__codigo em{font-style:normal;font-size:12px;color:#6fb1ff}
.taller__marco[data-escena="codigo"] .escena__codigo{opacity:1;transform:translate(-50%,-50%)}

/* ---- la fila de herramientas: iconos que se iluminan ---- */
.taller__carril{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));gap:7px;border:0}
.taller__carril li{position:relative;display:grid;place-items:center;aspect-ratio:1;padding:0;margin:0;font-size:0;overflow:hidden;border:1px solid rgba(255,255,255,.16);border-radius:var(--grande);color:rgba(255,255,255,.38);cursor:pointer;transition:color .35s,border-color .35s,background .35s,box-shadow .35s,transform .35s}
.taller__carril li svg{width:46%;height:46%;transition:transform .35s}
.taller__carril li:hover{color:#fff;border-color:rgba(255,255,255,.4)}
.taller__carril li.on{color:#fff;border-color:var(--azul);background:rgba(11,121,251,.16);box-shadow:0 0 0 1px var(--azul),0 0 26px rgba(11,121,251,.55);transform:translateY(-4px)}
.taller__carril li.on svg{transform:scale(1.12);filter:drop-shadow(0 0 6px rgba(111,177,255,.9))}
.taller__carril li::after{left:0;top:auto;bottom:0;height:3px;width:0;background:var(--azul)}
.taller__carril li.es-nuevo::before{content:'';position:absolute;right:5px;top:5px;width:6px;height:6px;border-radius:50%;background:var(--azul);box-shadow:0 0 8px var(--azul)}
.taller__carril li.on.es-nuevo::before{background:#fff}
/* la etiqueta «Nuevo en 2.0», más grande */
.taller__num{align-items:center}
.taller__num em{margin-left:14px;padding:9px 16px;border-radius:var(--boton);font-size:13px;letter-spacing:.2em;box-shadow:0 0 22px rgba(11,121,251,.55)}
/* la fila de herramientas, en dos filas (5 + 4) y con el nombre debajo del icono */
.taller__carril{grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.taller__carril li{aspect-ratio:auto;height:78px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:8px 4px}
.taller__carril li svg{width:22px;height:22px;flex:none}
.taller__carril li span{font-size:8.5px;font-weight:700;letter-spacing:.08em;line-height:1.2;text-transform:uppercase;text-align:center}
.taller__pasos{height:330px}
/* las dos filas ocupan todo el ancho: cinco arriba y, abajo, cuatro algo más anchas */
.taller__carril{display:flex;flex-wrap:wrap;gap:8px}
.taller__carril li{flex:1 1 calc(20% - 8px);min-width:0}
/* todas las casillas del mismo tamaño; las cuatro de abajo, centradas */
.taller__carril{justify-content:center}
.taller__carril li{flex:0 0 calc((100% - 32px) / 5)}

/* ---- Grábate, como es de verdad: botón en la cabecera y panel vertical con forma de móvil ---- */
.escena .escena__boton--grabar{left:auto;right:196px;top:12px;gap:7px;padding:7px 13px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.35);border-radius:999px;font-size:12px;letter-spacing:0;text-transform:none;transform:translateY(-6px)}
.escena .escena__boton--grabar i{width:10px;height:10px;background:#c23a3a}
.taller__marco[data-escena="boton"] .escena .escena__boton--grabar{opacity:1;transform:none}
.taller__marco[data-escena="lista"] .taller__real,.taller__marco[data-escena="grabando"] .taller__real{width:100%;transform:translateX(-15.8%)}
.taller__marco[data-escena="grabando"] .escena>video{width:0;opacity:0}
.taller__marco[data-escena="grabando"] .escena__rotulo{opacity:0}
.movil{position:absolute;right:0;top:0;height:100%;aspect-ratio:9/16;overflow:hidden;background:#000;border-left:2px solid #000;transform:translateX(102%);transition:transform .5s cubic-bezier(.3,.7,.2,1);font-family:Poppins,sans-serif}
.taller__marco[data-escena="lista"] .movil,.taller__marco[data-escena="grabando"] .movil{transform:none}
.taller__marco .escena .movil video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:1;border:0;transform:scaleX(-1)}
.movil__rejilla{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.09) 1px,transparent 1px);background-size:33.3% 33.3%}
.movil__tope{position:absolute;left:0;right:0;top:0;height:5px;background:rgba(255,255,255,.18);opacity:0}
.movil__tope i{display:block;height:100%;width:0;background:#0b79fb}
.taller__marco[data-escena="grabando"] .movil__tope{opacity:1}
.taller__marco[data-escena="grabando"] .movil__tope i{width:14%;transition:width 8s linear}
.movil__volver,.movil__privado{position:absolute;top:13px;padding:7px 10px;background:rgba(0,0,0,.62);border:1px solid rgba(255,255,255,.25);border-radius:999px;font-size:8.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;white-space:nowrap}
.movil__volver{left:10px}.movil__privado{right:10px}
.movil__rec{position:absolute;left:50%;top:54px;transform:translateX(-50%);display:flex;align-items:center;gap:8px;padding:7px 14px;background:rgba(224,71,62,.94);border-radius:999px;white-space:nowrap;opacity:0;transition:opacity .3s}
.movil__rec i{width:9px;height:9px;border-radius:50%;background:#fff;animation:late 1s infinite}
.movil__rec b{font-size:15px;font-weight:600;font-variant-numeric:tabular-nums}
.movil__rec small{font-size:9px;color:rgba(255,255,255,.8)}
.movil__suena{position:absolute;left:12px;right:12px;bottom:138px;padding:9px 10px;background:rgba(0,0,0,.7);border:1px solid rgba(255,255,255,.18);border-radius:14px;font-size:9px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;text-align:center;color:#6fb1ff;opacity:0;transition:opacity .3s}
.taller__marco[data-escena="grabando"] .movil__rec,.taller__marco[data-escena="grabando"] .movil__suena{opacity:1}
.movil__pie{position:absolute;left:0;right:0;bottom:0;display:flex;flex-direction:column;align-items:center;gap:10px;padding:22px 0 18px;background:linear-gradient(to top,rgba(4,6,14,.8),rgba(4,6,14,0))}
.movil__disparo{display:grid;place-items:center;width:68px;height:68px;border-radius:50%;background:#fff;border:5px solid rgba(255,255,255,.4);background-clip:padding-box;box-shadow:0 8px 22px rgba(0,0,0,.45)}
.movil__disparo i{width:28px;height:28px;border-radius:50%;background:#e0473e;transition:border-radius .25s,width .25s,height .25s}
.taller__marco[data-escena="grabando"] .movil__disparo i{width:24px;height:24px;border-radius:6px}
.movil__pie em{font-style:normal;font-size:9.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase}
.movil__pie .durante,.taller__marco[data-escena="grabando"] .movil__pie .antes{display:none}
.taller__marco[data-escena="grabando"] .movil__pie .durante{display:block}

/* ---- Baila con tu amigo: el panel de la cámara, partido en dos — tú arriba, tu amigo abajo ---- */
.taller__marco[data-escena="amigo"] .escena>video{width:0;opacity:0}
.taller__marco[data-escena="amigo"] .escena__rotulo{opacity:0}
.duo{position:absolute;right:0;top:0;width:36%;height:100%;display:flex;flex-direction:column;gap:2px;background:#000;border-left:2px solid #000;transform:translateX(102%);transition:transform .5s cubic-bezier(.3,.7,.2,1)}
.taller__marco[data-escena="amigo"] .duo{transform:none}
.duo span{position:relative;flex:1;min-height:0;overflow:hidden;background:#111}
.taller__marco .escena .duo video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:1;border:0;transform:none}
.taller__marco .escena .duo span:first-child video{transform:scaleX(-1)}
.duo b{position:absolute;left:10px;top:10px;display:flex;align-items:center;gap:7px;padding:6px 10px;background:rgba(0,0,0,.7);border-radius:var(--boton);font-family:Poppins,sans-serif;font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.duo b i{width:7px;height:7px;border-radius:50%;background:#3ddc84;box-shadow:0 0 8px #3ddc84}
.duo span:last-child{box-shadow:inset 0 2px 0 var(--azul)}

/* ---- Baila con tu amigo: píldora en la cabecera y hoja con el código, como «Preguntar al profesor» ---- */
.escena .escena__boton--amigo{left:auto;right:196px;top:12px;gap:7px;padding:7px 13px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.35);border-radius:999px;font-size:12px;letter-spacing:0;text-transform:none;transform:translateY(-6px)}
.escena .escena__boton--amigo svg{width:15px;height:15px}
.taller__marco[data-escena="boton-amigo"] .escena .escena__boton--amigo,.taller__marco[data-escena="codigo"] .escena .escena__boton--amigo{display:flex;opacity:1;transform:none}
.taller__marco[data-escena="codigo"] .escena .escena__boton--amigo{background:var(--azul);border-color:var(--azul)}
.escena .escena__codigo{left:auto;right:14px;top:58px;min-width:0;width:300px;padding:18px 20px 18px;text-align:left;border-radius:14px;transform:translateY(-10px)}
.taller__marco[data-escena="codigo"] .escena .escena__codigo{transform:none}
.escena__codigo strong{display:flex;justify-content:space-between;margin-bottom:16px;font-family:var(--titular);font-weight:700;font-size:13px;text-transform:uppercase}
.escena__codigo strong i{font-style:normal;font-family:Poppins;font-weight:400;color:#cfcfcf}
.escena .escena__codigo b{margin:8px 0 8px;font-size:34px;letter-spacing:.2em;color:#6fb1ff}
.escena .escena__codigo em{display:block;font-size:12px;color:#cfcfcf}
.escena__codigo u{display:inline-block;margin-top:14px;font-size:9.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#cfcfcf}
/* «Bailar» y «● Grabarme» están SIEMPRE en la cabecera del reproductor, como en la clase de verdad */
.escena .escena__boton--amigo,.escena .escena__boton--grabar{display:flex;opacity:1;transform:none}
.escena .escena__boton--grabar{right:292px}
/* se apartan cuando la clase se corre para hacer sitio a una cámara, y cuando el panel de secciones ocupa ese lado */
.taller__marco[data-escena="camara"] .escena .escena__boton,.taller__marco[data-escena="amigo"] .escena .escena__boton,.taller__marco[data-escena="lista"] .escena .escena__boton,.taller__marco[data-escena="grabando"] .escena .escena__boton,.taller[data-herramienta="secciones"] .escena .escena__boton{opacity:0}

/* ---- profesores de la portada: tres diseños y cuatro tratamientos de foto, para elegir ---- */
.conmutador{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:26px 0 22px;padding:10px 12px;border:1px dashed var(--borde-campo);border-radius:var(--grande);font-size:11px}
.conmutador span{margin:0 6px 0 10px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--tenue)}
.conmutador span:first-child{margin-left:0}
.conmutador button{padding:7px 12px;background:none;border:1px solid var(--linea);border-radius:var(--boton);color:var(--texto2);font-weight:600}
.conmutador button.on{background:var(--azul);border-color:var(--azul);color:#fff}
.pp{display:none}
.prueba-profes[data-diseno="a"] .pp--a,.prueba-profes[data-diseno="b"] .pp--b,.prueba-profes[data-diseno="c"] .pp--c{display:block}
/* las fotos */
.prueba-profes img{transition:filter .45s,transform .6s}
.prueba-profes[data-fotos="bn"] img,.prueba-profes[data-fotos="pasar"] img{filter:grayscale(1) contrast(1.06)}
.prueba-profes[data-fotos="pasar"] a:hover img,.prueba-profes[data-fotos="pasar"] .pf-uno__foto:hover img,.prueba-profes[data-fotos="pasar"] .pf-tira a.on img{filter:none}
.prueba-profes[data-fotos="azul"] img{filter:grayscale(1) contrast(1.1) brightness(.95)}
.prueba-profes[data-fotos="azul"] .pf-cartel::after,.prueba-profes[data-fotos="azul"] .pf-uno__foto::after{content:'';position:absolute;inset:0;background:#0b79fb;mix-blend-mode:multiply;opacity:.75;transition:opacity .45s;pointer-events:none}
.prueba-profes[data-fotos="azul"] .pf-cartel:hover::after,.prueba-profes[data-fotos="azul"] .pf-uno__foto:hover::after{opacity:0}
.prueba-profes[data-fotos="azul"] .pf-cartel:hover img,.prueba-profes[data-fotos="azul"] .pf-uno__foto:hover img{filter:none}
/* carteles (A y C) */
.pf-grandes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.pf-cartel{position:relative;display:block;aspect-ratio:3/4;overflow:hidden;border-radius:var(--grande);background:var(--foto);color:#fff}
.pf-cartel img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 15%}
.pf-cartel:hover img{transform:scale(1.04)}
.pf-cartel::before{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(to top,rgba(0,0,0,.9) 0%,rgba(0,0,0,.2) 42%,rgba(0,0,0,0) 60%);pointer-events:none}
.pf-cartel__texto{position:absolute;z-index:2;left:20px;right:18px;bottom:20px}
.pf-titulo{display:inline-block;margin-bottom:12px;padding:6px 10px;background:var(--azul);border-radius:3px;font-size:9.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.pf-titulo--falta{background:none;border:1px dashed rgba(255,255,255,.55);color:rgba(255,255,255,.8)}
.pf-cartel strong{display:block;font-family:var(--titular);font-weight:700;font-size:clamp(18px,1.9vw,28px);line-height:1;text-transform:uppercase}
.pf-cartel small{display:block;margin-top:9px;font-size:10px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:#d0d0d0}
.pf-resto{display:flex;align-items:center;gap:22px;margin-top:26px;padding-top:22px;border-top:1px solid var(--linea)}
.pf-minis{display:flex;gap:8px;flex:1;min-width:0}
.pf-minis a{flex:0 0 58px;height:58px;overflow:hidden;border-radius:var(--boton);background:var(--foto)}
.pf-minis img{width:100%;height:100%;object-fit:cover;object-position:center 12%}
.pf-cartel--carril{flex:0 0 calc((100% - 48px - 80px) / 5);min-width:230px;scroll-snap-align:start}
.pf-cartel--carril strong{font-size:18px}
.prueba-profes .carril{margin-top:0}
/* uno a uno (B) */
.pf-uno{display:none;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:56px;align-items:center}
.pf-uno.on{display:grid}
.pf-uno__foto{position:relative;display:block;aspect-ratio:4/5;max-height:560px;overflow:hidden;border-radius:var(--grande);background:var(--foto)}
.pf-uno__foto img{width:100%;height:100%;object-fit:cover;object-position:center 15%}
.pf-uno h3{margin-top:14px;font-size:clamp(34px,4.4vw,68px);line-height:.92}
.pf-uno__dato{margin-top:24px;font-size:11px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--tenue)}
.pf-uno__dato b{margin-right:10px;font-family:var(--titular);font-size:30px;letter-spacing:0;color:var(--texto);vertical-align:middle}
.pf-flechas{display:flex;align-items:center;gap:12px;margin-left:auto}
.pf-flechas i{display:grid;place-items:center;width:46px;height:46px;border:1px solid var(--borde-campo);border-radius:var(--boton);font-style:normal;font-size:18px;cursor:pointer}
.pf-flechas i:hover{border-color:var(--azul);background:var(--azul-suave)}
.pf-flechas em{font-style:normal;font-size:11px;font-weight:700;letter-spacing:.16em;color:var(--tenue)}
.pf-tira{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:10px;margin-top:30px;padding-top:22px;border-top:1px solid var(--linea)}
.pf-tira a{display:block;border-top:2px solid transparent;padding-top:8px;opacity:.55;transition:opacity .3s}
.pf-tira a.on,.pf-tira a:hover{opacity:1}
.pf-tira a.on{border-top-color:var(--azul)}
.pf-tira img{width:100%;aspect-ratio:1;object-fit:cover;object-position:center 12%;border-radius:var(--boton)}
.pf-tira span{display:block;margin-top:8px;font-size:9.5px;font-weight:700;letter-spacing:.06em;line-height:1.25;text-transform:uppercase}
.pf-uno{grid-template-columns:minmax(0,4fr) minmax(0,8fr)}
.pf-uno__foto{max-height:none}

/* ---- profesores: pasarela de carteles + miniaturas sincronizadas + descripción que sube ---- */
.pf-pasarela{position:relative}
.pf-pista{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.pf-pista::-webkit-scrollbar{display:none}
.pf-pista .pf-cartel{flex:0 0 calc((100% - 60px) / 4);scroll-snap-align:start}
.pf-flecha{position:absolute;right:-22px;top:50%;z-index:5;transform:translateY(-50%);display:grid;place-items:center;width:52px;height:52px;background:var(--azul);color:#fff;border-radius:var(--boton);font-size:20px;cursor:pointer;box-shadow:0 6px 24px rgba(0,0,0,.4);transition:opacity .3s}
.pf-flecha--atras{right:auto;left:-22px}
.pf-pasarela.al-principio .pf-flecha--atras,.pf-pasarela.al-final .pf-flecha:not(.pf-flecha--atras){opacity:0;pointer-events:none}
.pf-cartel::before{transition:background .4s}
.pf-cartel:hover::before,.pf-cartel.abierto::before{background:linear-gradient(to top,rgba(0,0,0,.95) 0%,rgba(0,0,0,.82) 50%,rgba(0,0,0,.25) 85%)}
.pf-titulo{line-height:1.35}
.pf-desc{display:block;max-height:0;overflow:hidden;opacity:0;transform:translateY(18px);font-size:13.5px;line-height:1.55;color:#e2e2e2;transition:max-height .5s cubic-bezier(.3,.7,.2,1),opacity .4s,transform .5s cubic-bezier(.3,.7,.2,1),margin .4s}
.pf-cartel:hover .pf-desc,.pf-cartel.abierto .pf-desc{max-height:260px;opacity:1;transform:none;margin-top:14px}
.pf-desc i{display:block;width:max-content;margin-top:14px;font-style:normal;font-size:10.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:#fff;border-bottom:1px solid var(--azul);padding-bottom:4px}
.pf-minis{gap:7px}
.pf-minis a{position:relative;flex:1 1 0;max-width:62px;height:auto;aspect-ratio:1;opacity:.4;cursor:pointer;transition:opacity .3s,box-shadow .3s,transform .3s}
.pf-minis a.on{opacity:1;box-shadow:0 0 0 2px var(--azul);transform:translateY(-3px)}
.pf-minis a:hover{opacity:1}
.pf-minis a.con-titulo::after{content:'★';position:absolute;right:2px;top:1px;font-size:9px;color:#fff;text-shadow:0 0 4px #000}
/* la descripción sube más y respira más */
.pf-cartel__texto{transition:bottom .5s cubic-bezier(.3,.7,.2,1)}
.pf-cartel:hover .pf-cartel__texto,.pf-cartel.abierto .pf-cartel__texto{bottom:40px}
.pf-cartel:hover::before,.pf-cartel.abierto::before{background:linear-gradient(to top,rgba(0,0,0,.96) 0%,rgba(0,0,0,.88) 62%,rgba(0,0,0,.4) 100%)}
.pf-desc{font-size:14.5px;line-height:1.75}
.pf-cartel:hover .pf-desc,.pf-cartel.abierto .pf-desc{max-height:340px;margin-top:22px}
.pf-desc i{margin-top:24px}
.pf-cartel:hover small,.pf-cartel.abierto small{margin-top:12px}
/* el oscurecido va pegado al texto: sube con él y solo tapa lo que el texto ocupa */
.pf-cartel:hover::before,.pf-cartel.abierto::before{background:linear-gradient(to top,rgba(0,0,0,.9) 0%,rgba(0,0,0,.2) 42%,rgba(0,0,0,0) 60%)}
.pf-cartel__texto::before{content:'';position:absolute;z-index:-1;left:-20px;right:-18px;top:-80px;bottom:-40px;background:linear-gradient(to top,rgba(0,0,0,.94) 0,rgba(0,0,0,.9) calc(100% - 80px),rgba(0,0,0,0) 100%);opacity:0;transition:opacity .45s;pointer-events:none}
.pf-cartel:hover .pf-cartel__texto::before,.pf-cartel.abierto .pf-cartel__texto::before{opacity:1}

/* lo que tiene cada profesor en la plataforma: la cuenta, siempre a la vista; la lista, al subir la descripción */
.pf-cuenta{display:block}
.pf-cuenta b{display:inline-block;margin-top:12px;padding-top:10px;border-top:1px solid rgba(255,255,255,.3);font-family:Poppins,sans-serif;font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#fff}
.pf-suyo{display:block;margin-top:18px;border-top:1px solid rgba(255,255,255,.2)}
.pf-suyo em{display:block;margin:14px 0 6px;font-style:normal;font-size:9.5px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:#6fb1ff}
.pf-suyo>span{display:block;padding:9px 0;border-bottom:1px solid rgba(255,255,255,.12);font-size:13px;font-weight:600;line-height:1.3;color:#fff}
.pf-suyo u{display:inline-block;margin-right:9px;padding:2px 6px;border:1px solid rgba(255,255,255,.4);border-radius:3px;text-decoration:none;font-size:8.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;vertical-align:middle}
.pf-suyo small{display:inline;margin:0 0 0 8px;font-size:10px;font-weight:500;letter-spacing:.04em;text-transform:none;color:#bdbdbd}
.pf-suyo .mas{border-bottom:0;font-size:11px;font-weight:500;color:#bdbdbd}
.pf-cartel:hover .pf-desc,.pf-cartel.abierto .pf-desc{max-height:460px}
/* etiquetas de título: azul para salsa, rosa para bachata; con resplandor y un brillo que las recorre */
.pf-titulo{position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:9px;padding:7px 11px 7px 7px;--c:11,121,251;background:rgb(var(--c));box-shadow:0 0 0 1px rgba(255,255,255,.18) inset,0 0 18px rgba(var(--c),.75),0 0 44px rgba(var(--c),.4);animation:late-titulo 3.2s ease-in-out infinite}
.pf-titulo--bachata{--c:233,30,128}
.pf-titulo b{flex:none;padding:3px 7px;background:#000;border-radius:2px;font-family:Poppins,sans-serif;font-size:8.5px;font-weight:700;letter-spacing:.16em;color:rgb(var(--c));filter:brightness(1.6)}
.pf-titulo::after{content:'';position:absolute;top:0;bottom:0;left:-60%;width:40%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-18deg);animation:brillo-titulo 3.2s ease-in-out infinite}
@keyframes brillo-titulo{0%,55%{left:-60%}100%{left:130%}}
@keyframes late-titulo{0%,100%{box-shadow:0 0 0 1px rgba(255,255,255,.18) inset,0 0 14px rgba(var(--c),.6),0 0 34px rgba(var(--c),.3)}50%{box-shadow:0 0 0 1px rgba(255,255,255,.18) inset,0 0 24px rgba(var(--c),.95),0 0 60px rgba(var(--c),.55)}}
.pf-cartel:nth-child(2n) .pf-titulo,.pf-cartel:nth-child(2n) .pf-titulo::after{animation-delay:.8s}
.pf-cartel:nth-child(3n) .pf-titulo,.pf-cartel:nth-child(3n) .pf-titulo::after{animation-delay:1.6s}
/* el cartel coge el resplandor de su etiqueta al pasar el cursor */
.pf-cartel:has(.pf-titulo--salsa):hover{box-shadow:0 0 0 2px rgb(11,121,251),0 0 40px rgba(11,121,251,.45)}
.pf-cartel:has(.pf-titulo--bachata):hover{box-shadow:0 0 0 2px rgb(233,30,128),0 0 40px rgba(233,30,128,.45)}
.pf-pista{padding:14px 4px;margin:-14px -4px}

/* ---- lo que hay dentro: cifras + filtro por estilo + pasarela ---- */
.prueba-profes{margin-top:34px}
.dentro__cabeza{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:48px;align-items:end}
.dentro__cabeza h2{max-width:16ch}
.dentro__cabeza .cifras dt{font-size:54px}
.dentro__cabeza .cifras div{padding:20px 38px}
.dentro__cabeza .cifras div:last-child{padding-right:0}
.dentro__filtro{margin-top:38px;border-top:1px solid var(--linea)}
.dentro__filtro .opciones{flex-wrap:wrap;gap:0 30px}
.dentro__filtro .opciones a{cursor:pointer}
.dentro__filtro small{margin-left:5px;font-size:10px;font-weight:700;color:var(--tenue)}
.dentro__filtro a.on small{color:var(--azul-claro)}
.dentro__filtro a.aparte{margin-left:auto}
.dentro .carril{margin-top:30px}
.dentro .cartel[hidden]{display:none}
.cartel--serie .cartel__texto .rotulo{color:#fff}
.dentro__pie{display:flex;justify-content:space-between;align-items:center;gap:30px;margin-top:30px;padding-top:22px;border-top:1px solid var(--linea);font-size:14px;color:var(--texto2)}
.dentro__pie b{display:inline-block;width:12px;height:2px;margin-right:12px;vertical-align:middle;background:var(--azul)}

/* ---- «lo que hay dentro»: las cinco mejoras, cada una con su interruptor ---- */
.conmutador--mejoras{margin:0 0 30px}
.dentro .cartel{order:var(--o)}
.dentro__filtros{margin-top:38px;border-top:1px solid var(--linea)}
.dentro__filtros .dentro__filtro{margin-top:0;border-top:0}
.dentro__vacio{order:9999;padding:60px 0;font-size:15px;color:var(--tenue)}
.dentro__vacio[hidden]{display:none}
/* 1 · nivel */
.cartel__nivel{display:none;gap:3px;margin-right:9px;vertical-align:middle}
.cartel__nivel i{width:11px;height:6px;border:1px solid rgba(255,255,255,.55);border-radius:1px}
.cartel__nivel i.on{background:#6fb1ff;border-color:#6fb1ff}
.dentro.con-nivel .cartel__nivel{display:inline-flex}
.dentro__filtro--nivel{display:none}
.dentro.con-nivel .dentro__filtro--nivel{display:grid}
.dentro__filtro--nivel .cartel__nivel i{border-color:var(--borde-campo)}
.dentro__filtro--nivel .cartel__nivel i.on{background:var(--azul);border-color:var(--azul)}
/* 2 · protagonista */
.cartel__destacado,.cartel__frase{display:none}
.dentro.con-prota:not(.filtrando) .cartel--prota{flex:0 0 calc((100% - 48px - 80px) / 5 * 2 + 20px);display:flex}
.dentro.con-prota:not(.filtrando) .cartel--prota .img{flex:1;aspect-ratio:auto}
.dentro.con-prota:not(.filtrando) .cartel--prota .img img{object-position:center 18%}
.dentro.con-prota:not(.filtrando) .cartel--prota .img::after{transform:scaleX(1)}
.dentro.con-prota:not(.filtrando) .cartel--prota .cartel__texto{left:26px;right:26px;bottom:26px}
.dentro.con-prota:not(.filtrando) .cartel--prota strong{font-size:clamp(24px,2.5vw,38px);margin-top:12px}
.dentro.con-prota:not(.filtrando) .cartel__destacado{display:inline-block;margin-bottom:14px;padding:6px 10px;background:#fff;color:#000;border-radius:3px;font-size:9.5px;font-weight:700;letter-spacing:.18em;text-transform:uppercase}
.dentro.con-prota:not(.filtrando) .cartel__frase{display:block;max-width:44ch;margin-top:12px;font-size:14px;line-height:1.55;color:#e2e2e2}
/* 3 · estrella de campeón */
.cartel__estrella{display:none;position:absolute;z-index:2;left:12px;top:12px;padding:6px 9px;--c:11,121,251;background:rgb(var(--c));color:#fff;border-radius:3px;font-size:9px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;box-shadow:0 0 16px rgba(var(--c),.7)}
.cartel__estrella--bachata{--c:233,30,128}
.dentro.con-estrella .cartel__estrella{display:block}
/* 4 · arreglos */
.solo-arreglo{display:none!important}
.dentro.con-arreglos .solo-arreglo{display:block!important}
.dentro.con-arreglos .cartel--zouk{--o:75}
.dentro.con-arreglos .cuenta-todos{display:none}
/* 5 · franja de venta */
.dentro__venta{display:none;grid-template-columns:minmax(0,1fr) auto;gap:40px;align-items:center;margin-top:34px;padding:34px 40px;background:var(--azul);border-radius:var(--grande)}
.dentro__venta h3{margin-top:12px;font-size:clamp(22px,2.5vw,36px);line-height:1}
.dentro__venta p:last-child{display:flex;flex-direction:column;align-items:center;gap:16px}
.dentro__venta .enlace{border-bottom-color:rgba(255,255,255,.6)}
.dentro.con-venta .dentro__venta{display:grid}
.dentro.con-venta .dentro__pie{display:none}
/* arreglos de las mejoras: el protagonista coge la altura de la fila, y el cartel de Zouk se va atrás de verdad */
.dentro.con-prota:not(.filtrando) .cartel--prota{display:block;position:relative}
.dentro.con-prota:not(.filtrando) .cartel--prota .img{position:absolute;inset:0;aspect-ratio:auto}
.dentro.con-arreglos .cartel--zouk{--o:75!important}

/* pasarelas: flecha de volver, y las dos se esconden al llegar al tope */
.carril__flecha{transition:opacity .3s}
.carril__flecha--atras{right:auto;left:22px}
.carril__flecha.fuera{opacity:0;pointer-events:none}

/* cursos y series: dos pestañas grandes que dicen qué es cada cosa */
.dentro__tipo{display:grid;grid-template-columns:1fr 1fr;margin-top:38px;border:1px solid var(--linea);border-radius:var(--grande);overflow:hidden}
.dentro__tipo a{display:grid;grid-template-columns:auto minmax(0,1fr);gap:22px;align-items:center;padding:22px 28px;cursor:pointer;color:var(--tenue);transition:background .3s,color .3s}
.dentro__tipo a+a{border-left:1px solid var(--linea)}
.dentro__tipo a:hover{background:var(--hover)}
.dentro__tipo b{font-family:var(--titular);font-weight:700;font-size:44px;line-height:1;color:var(--num)}
.dentro__tipo span{font-size:14px;line-height:1.45}
.dentro__tipo strong{display:block;margin-bottom:4px;font-family:var(--titular);font-weight:700;font-size:20px;line-height:1;text-transform:uppercase}
.dentro__tipo a.on{background:var(--azul-suave);box-shadow:inset 0 3px 0 var(--azul);color:var(--texto2)}
.dentro__tipo a.on b{color:var(--azul)}
.dentro__tipo a.on strong{color:var(--texto)}
.dentro .dentro__filtros{margin-top:0;border-top:0}
.dentro.viendo-series .dentro__filtros{display:none}
.dentro.viendo-series .carril{margin-top:34px}
.dentro__cabeza .cifras div:first-child{padding-left:38px}

/* ---- reseñas: tres diseños ---- */
.resenas2 .conmutador{margin:0 0 30px}
.rs{display:none}
.resenas2[data-diseno="a"] .rs--a,.resenas2[data-diseno="b"] .rs--b,.resenas2[data-diseno="c"] .rs--c{display:grid}
.resenas2[data-diseno="b"] .rs--b{display:block}
.rs-cabeza{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:48px;align-items:end;margin-bottom:44px}
.rs-cabeza h2{max-width:18ch}
.rs-nota{display:flex;align-items:center;gap:18px}
.rs-nota b{font-family:var(--titular);font-weight:700;font-size:76px;line-height:.85}
.rs-nota span{font-size:13px;line-height:1.5;color:var(--texto2)}
.rs-nota i,.rs-cita i{display:block;font-style:normal;letter-spacing:3px;color:var(--azul);font-size:15px}
.rs-nota img{width:150px;margin-left:16px;border-radius:var(--boton)}
.rs-comillas{display:block;height:.55em;font-family:var(--titular);font-weight:700;font-size:150px;line-height:1;color:var(--azul)}
.rs footer{margin-top:18px;font-size:11px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--texto)}
.rs footer span{display:block;margin-top:5px;font-size:10px;font-weight:500;letter-spacing:.12em;color:var(--tenue)}
.rs-cita{margin:0;padding:24px 26px 26px}
.rs-cita p{margin-top:10px;font-size:15.5px;line-height:1.6;color:var(--texto)}
/* A */
.rs--a{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:0;border:1px solid var(--linea);border-radius:var(--grande);overflow:hidden}
.rs-grande{margin:0;padding:44px 44px 40px;background:var(--azul-suave);box-shadow:inset 0 3px 0 var(--azul);display:flex;flex-direction:column;justify-content:center}
.rs-grande p{margin-top:26px;font-family:var(--titular);font-weight:700;font-size:clamp(22px,2.3vw,34px);line-height:1.12;text-transform:uppercase}
.rs-grande footer{margin-top:28px}
.rs-muro{display:grid;grid-template-columns:1fr 1fr}
.rs-muro .rs-cita{border-left:1px solid var(--linea);border-bottom:1px solid var(--linea)}
.rs-muro .rs-cita:nth-last-child(-n+2){border-bottom:0}
/* B */
.rs-cinta{overflow:hidden;margin:0 -48px;mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.rs-cinta+.rs-cinta{margin-top:16px}
.rs-cinta__pista{display:flex;gap:16px;width:max-content;animation:cinta 50s linear infinite}
.rs-cinta--vuelta .rs-cinta__pista{animation-direction:reverse}
.rs-cinta:hover .rs-cinta__pista{animation-play-state:paused}
.rs-cinta .rs-cita{flex:0 0 380px;border:1px solid var(--linea);border-radius:var(--grande);background:var(--fondo)}
@keyframes cinta{to{transform:translateX(calc(-50% - 8px))}}
/* C */
.rs--c{justify-items:center;text-align:center;padding:10px 0 0}
.rs-turno{position:relative;width:100%;max-width:1100px;min-height:300px;margin-top:20px}
.rs-turno blockquote{position:absolute;inset:0;margin:0;opacity:0;transform:translateY(20px);transition:opacity .6s,transform .6s}
.rs-turno blockquote.on{opacity:1;transform:none}
.rs-turno p{font-family:var(--titular);font-weight:700;font-size:clamp(26px,3.4vw,52px);line-height:1.08;text-transform:uppercase}
.rs-turno footer{margin-top:30px}
.rs-puntos{display:flex;gap:8px;margin-top:10px}
.rs-puntos i{width:28px;height:3px;background:var(--linea);cursor:pointer;transition:background .3s}
.rs-puntos i.on{background:var(--azul)}
/* la nota de las reseñas, en grande */
.rs-cabeza{align-items:center}
.rs-nota--grande{gap:30px;padding:26px 34px;border:1px solid var(--linea);border-radius:var(--grande);box-shadow:inset 0 3px 0 var(--azul);background:var(--azul-suave)}
.rs-nota--grande b{font-size:150px;line-height:.8}
.rs-nota--grande b small{font-size:34px;color:var(--tenue)}
.rs-nota--grande i{font-size:34px;letter-spacing:6px}
.rs-nota--grande strong{display:block;margin-top:10px;font-size:17px;font-weight:600;color:var(--texto)}
.rs-nota--grande img{display:block;width:210px;margin:18px 0 0}
html.limpio .selector{display:none}
/* ---- en todos tus dispositivos: tele, portátil y móvil con la plataforma dentro ---- */
.aparatos{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:56px;align-items:center}
.aparatos__lista{list-style:none;margin-top:28px;border-top:1px solid var(--linea)}
.aparatos__lista li{padding:14px 0;border-bottom:1px solid var(--linea);font-size:14px;line-height:1.5;color:var(--texto2)}
.aparatos__lista b{display:block;font-size:11px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--texto)}
.aparatos__escena{position:relative;aspect-ratio:16/10;background:radial-gradient(ellipse at 50% 60%,rgba(11,121,251,.28),rgba(11,121,251,0) 62%)}
.ap{position:absolute}
.ap__pantalla{display:block;overflow:hidden;background:#000}
.ap__pantalla img{display:block;width:100%;height:100%;object-fit:cover;object-position:top center}
/* la tele, al fondo */
.ap--tv{left:8%;top:0;width:84%}
.ap--tv .ap__pantalla{aspect-ratio:16/9;border:7px solid #0d0d0f;border-radius:8px;box-shadow:0 0 0 1px #2c2c33,0 30px 80px rgba(0,0,0,.7),0 0 90px rgba(11,121,251,.3)}
.ap--tv i{display:block;width:26%;height:14px;margin:0 auto;background:linear-gradient(#1b1b20,#0c0c0e);clip-path:polygon(18% 0,82% 0,100% 100%,0 100%)}
/* el portátil, delante a la izquierda */
.ap--portatil{left:0;bottom:0;width:54%}
.ap--portatil .ap__pantalla{width:86%;margin:0 auto;aspect-ratio:16/10;border:8px solid #111114;border-bottom-width:10px;border-radius:10px 10px 0 0;box-shadow:0 0 0 1px #33333b}
.ap--portatil i{display:block;height:14px;background:linear-gradient(#3a3a42,#17171b);border-radius:0 0 12px 12px;box-shadow:0 24px 50px rgba(0,0,0,.7)}
/* el móvil, tumbado, delante a la derecha */
.ap--movil{right:2%;bottom:4%;width:36%}
.ap--movil .ap__pantalla{aspect-ratio:19.5/9;border:7px solid #0d0d0f;border-radius:22px;box-shadow:0 0 0 1px #3a3a42,0 24px 60px rgba(0,0,0,.75)}
/* ---- dispositivos, segunda versión: más trabajados ---- */
.aparatos__escena{aspect-ratio:16/10.4;background:none;isolation:isolate}
.ap-luz{position:absolute;z-index:-1;left:6%;right:6%;top:-4%;height:74%;background:radial-gradient(ellipse at 50% 45%,rgba(11,121,251,.55),rgba(11,121,251,.12) 45%,rgba(11,121,251,0) 70%);filter:blur(30px);animation:ap-luz 6s ease-in-out infinite}
@keyframes ap-luz{50%{opacity:.65}}
.ap-suelo{position:absolute;z-index:-1;left:-4%;right:-4%;bottom:2.5%;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.28) 20%,rgba(255,255,255,.28) 80%,transparent)}
.ap-suelo::after{content:'';position:absolute;left:8%;right:8%;top:1px;height:70px;background:radial-gradient(ellipse at 50% 0,rgba(11,121,251,.22),transparent 70%)}
.ap__pantalla{position:relative}
.ap__brillo{position:absolute;inset:0;background:linear-gradient(115deg,rgba(255,255,255,.14) 0,rgba(255,255,255,.03) 22%,transparent 38%);pointer-events:none}
.ap__rotulo{position:absolute;left:50%;transform:translateX(-50%);font-size:9.5px;font-weight:700;letter-spacing:.3em;text-transform:uppercase;color:#8d8d94;white-space:nowrap}
/* la tele: colgada, marco fino, luz detrás */
.ap--tv{left:9%;top:0;width:82%}
.ap--tv .ap__pantalla{aspect-ratio:16/9;border:5px solid #08080a;border-bottom-width:9px;border-radius:7px;box-shadow:0 0 0 1px #34343c,0 0 0 2px #000,0 40px 90px rgba(0,0,0,.8),0 0 120px rgba(11,121,251,.35)}
.ap--tv .ap__pantalla::after{content:'';position:absolute;left:50%;bottom:-7px;width:22px;height:3px;margin-left:-11px;border-radius:2px;background:#2f6bff;box-shadow:0 0 8px #2f6bff}
.ap--tv .ap__pie{display:block;width:34%;height:9px;margin:0 auto;background:linear-gradient(#2a2a31,#0b0b0d);clip-path:polygon(30% 0,70% 0,100% 100%,0 100%)}
.ap--tv .ap__rotulo{top:-22px}
/* el portátil: tapa con cámara, bisagra y base en perspectiva */
.ap--portatil{left:-3%;bottom:2.5%;width:56%;animation:ap-flota 7s ease-in-out infinite}
.ap__tapa{position:relative;display:block;width:84%;margin:0 auto;padding:9px 9px 12px;background:linear-gradient(#1c1c21,#0e0e11);border-radius:12px 12px 2px 2px;box-shadow:0 0 0 1px #3d3d46,inset 0 0 0 1px #000}
.ap__tapa>u{position:absolute;left:50%;top:3px;width:4px;height:4px;margin-left:-2px;border-radius:50%;background:#33333b}
.ap--portatil .ap__pantalla{width:auto;margin:0;aspect-ratio:16/10;border:0;border-radius:3px;box-shadow:none}
.ap__base{position:relative;display:block;height:13px;background:linear-gradient(#c9c9d1 0,#8a8a93 18%,#3a3a42 55%,#141417 100%);border-radius:2px 2px 14px 14px;box-shadow:0 30px 50px rgba(0,0,0,.85)}
.ap__base>u{position:absolute;left:50%;top:0;width:16%;height:5px;margin-left:-8%;background:#55555e;border-radius:0 0 7px 7px}
.ap--portatil .ap__rotulo{bottom:-24px}
/* el móvil: tumbado, con su isla y sus botones */
.ap--movil{right:-1%;bottom:5%;width:41%;animation:ap-flota 7s ease-in-out -3.5s infinite}
.ap__caja{position:relative;display:block;padding:6px;background:linear-gradient(135deg,#4a4a53,#16161a 40%,#2b2b32);border-radius:26px;box-shadow:0 0 0 1px #000,0 28px 60px rgba(0,0,0,.85),0 0 50px rgba(11,121,251,.25)}
.ap__caja::before,.ap__caja::after{content:'';position:absolute;top:-3px;height:3px;background:#3a3a42;border-radius:2px 2px 0 0}
.ap__caja::before{left:22%;width:9%}.ap__caja::after{left:34%;width:14%}
.ap__caja>u{position:absolute;z-index:2;left:13px;top:50%;width:9px;height:26%;margin-top:-13%;transform:translateY(50%);background:#000;border-radius:6px}
.ap--movil .ap__pantalla{aspect-ratio:844/390;border:0;border-radius:21px;box-shadow:none}
.ap--movil .ap__rotulo{bottom:-24px}
@keyframes ap-flota{50%{transform:translateY(-7px)}}
html.sinpuntero .taller__puntero{display:none}
/* el móvil del mockup: más grande y con la proporción de la captura nueva */
.ap--movil{width:47%;right:-3%;bottom:3%}
.ap--movil .ap__pantalla{aspect-ratio:932/430}
.ap__caja>u{left:9px;width:7px;height:20%;margin-top:-10%}
.ap--portatil{width:52%}
/* la escena, más alta: el portátil y el móvil bajan y dejan ver el bucle abierto en la tele */
.aparatos__escena{aspect-ratio:16/11.6}
.ap--tv{left:10%;width:80%}
.ap--portatil{width:50%;left:-3%}
.ap--movil{width:45%;right:-3%;bottom:2.5%}

/* ---- preguntas frecuentes ---- */
.faq{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:64px;align-items:start}
.faq__lado{position:sticky;top:80px}
.faq__temas{display:flex;flex-direction:column;margin-top:34px;border-top:1px solid var(--linea)}
.faq__temas a{display:flex;align-items:baseline;gap:16px;padding:16px 14px;border-bottom:1px solid var(--linea);border-left:2px solid transparent;font-size:15px;font-weight:600;color:var(--tenue);cursor:pointer;transition:all .3s}
.faq__temas a b{font-family:var(--titular);font-weight:700;font-size:13px;color:var(--num)}
.faq__temas a:hover{color:var(--texto);background:var(--hover)}
.faq__temas a.on{color:var(--texto);border-left-color:var(--azul);background:var(--azul-suave)}
.faq__temas a.on b{color:var(--azul)}
.faq__ayuda{margin-top:34px;font-size:14px;line-height:1.55;color:var(--texto2)}
.faq__ayuda p+p{margin:8px 0 16px}
.faq__grupo{display:none}
.faq__grupo.on{display:block}
.faq details{border-top:1px solid var(--linea);border-bottom:0;border-left:2px solid transparent;transition:background .3s,border-color .3s}
.faq details:last-child{border-bottom:1px solid var(--linea)}
.faq details[open]{border-left-color:var(--azul);background:var(--azul-suave)}
.faq summary{display:grid;grid-template-columns:54px minmax(0,1fr) 28px;gap:10px;align-items:center;padding:26px 22px;font-size:19px;font-weight:600}
.faq summary::-webkit-details-marker{display:none}
.faq summary b{font-family:var(--titular);font-weight:700;font-size:16px;color:var(--num)}
.faq details[open] summary b{color:var(--azul)}
.faq summary i{position:relative;width:28px;height:28px;border:1px solid var(--borde-campo);border-radius:var(--boton);transition:all .3s}
.faq summary i::before,.faq summary i::after{content:'';position:absolute;left:50%;top:50%;width:12px;height:2px;margin:-1px 0 0 -6px;background:var(--texto);transition:transform .3s}
.faq summary i::after{transform:rotate(90deg)}
.faq details[open] summary i{background:var(--azul);border-color:var(--azul)}
.faq details[open] summary i::before,.faq details[open] summary i::after{background:#fff}
.faq details[open] summary i::after{transform:rotate(0)}
.faq details p{margin:-8px 0 0;padding:0 60px 30px 86px;max-width:none;font-size:16px;line-height:1.65;color:var(--texto2)}
.faq__temas a b{display:none}

/* ---- la metodología ---- */
.metodo__cabeza{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:64px;align-items:end}
.metodo__cabeza h2{margin-top:14px;max-width:20ch}
.metodo__cabeza .desc{margin:0}
.metodo__cifras{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:48px;border-top:1px solid var(--linea);border-bottom:1px solid var(--linea)}
.metodo__cifras div{padding:34px 36px;border-left:1px solid var(--linea)}
.metodo__cifras div:first-child{border-left:0;padding-left:0}
.metodo__cifras dt{font-family:var(--titular);font-weight:700;font-size:clamp(48px,6vw,92px);line-height:.9}
.metodo__cifras dt small{margin-left:8px;font-size:.28em;letter-spacing:.06em;color:var(--azul)}
.metodo__cifras dt i{font-style:normal;margin:0 .12em;font-size:.5em;vertical-align:middle;color:var(--azul)}
.metodo__cifras dd{margin:16px 0 0;font-size:11px;font-weight:700;letter-spacing:.22em;line-height:1.5;text-transform:uppercase;color:var(--tenue)}
.metodo__pasos{list-style:none;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));margin-top:44px}
.metodo__pasos li{position:relative;padding:22px 26px 6px 0;border-top:2px solid var(--linea)}
.metodo__pasos li::before{content:'';position:absolute;left:0;top:-7px;width:12px;height:12px;border-radius:50%;background:var(--fondo);border:2px solid var(--azul)}
.metodo__pasos b{display:block;font-family:var(--titular);font-weight:700;font-size:13px;color:var(--azul)}
.metodo__pasos strong{display:block;margin-top:10px;font-family:var(--titular);font-weight:700;font-size:24px;line-height:1;text-transform:uppercase}
.metodo__pasos span{display:block;margin-top:10px;font-size:14px;line-height:1.5;color:var(--texto2)}
.metodo__pasos .metodo__fin{border-top-color:var(--azul)}
.metodo__pasos .metodo__fin::before{background:var(--azul);box-shadow:0 0 14px var(--azul)}
.metodo__pasos .metodo__fin strong{margin-top:23px;color:var(--azul-claro)}

/* ---- planes: tres diseños ---- */
.precios .conmutador{margin:0 0 30px}
.pr{display:none;margin-top:34px}
.precios[data-diseno="a"] .pr--a,.precios[data-diseno="b"] .pr--b,.precios[data-diseno="c"] .pr--c{display:block}
.precios[data-periodo="anual"] .solo-mensual,.precios[data-periodo="mensual"] .solo-anual{display:none}
.pr-periodo{margin-bottom:34px}
.pr-periodo a{cursor:pointer}
.pr-sueltos{margin-top:30px;padding-top:22px;border-top:1px solid var(--linea);font-size:14px;color:var(--texto2)}
.pr-sueltos b{display:inline-block;width:12px;height:2px;margin-right:12px;vertical-align:middle;background:var(--azul)}
.pr-sueltos .enlace{margin-left:14px}
.plan__chapa{position:absolute;left:50%;top:0;transform:translate(-50%,-50%);padding:8px 16px;background:var(--azul);color:#fff;border-radius:var(--boton);font-size:10.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;white-space:nowrap;box-shadow:0 0 22px rgba(11,121,251,.6)}
.plan__chapa--fija{position:static;display:inline-block;transform:none}
/* A */
.pr-tres{margin:0;overflow:visible;align-items:stretch}
.pr-tres .plan .nota{min-height:3em}
.plan--sube{position:relative;margin:-18px 0;padding-top:58px;padding-bottom:52px;border:1px solid var(--azul);border-radius:var(--grande);background:linear-gradient(180deg,rgba(11,121,251,.2),rgba(11,121,251,.05) 45%),var(--fondo);box-shadow:0 0 0 1px var(--azul),0 0 60px rgba(11,121,251,.35)}
.plan--sube .precio b{font-size:64px}
/* B */
.pr-prota{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:56px;align-items:center;padding:48px 52px;border:1px solid var(--azul);border-radius:var(--grande);background:linear-gradient(120deg,rgba(11,121,251,.2),rgba(11,121,251,.03) 60%),var(--fondo);box-shadow:0 0 70px rgba(11,121,251,.25)}
.pr-prota h3{margin-top:20px;font-size:clamp(30px,3.6vw,54px);line-height:.95}
.pr-prota__frase{max-width:44ch;margin-top:16px;font-size:16px;line-height:1.55;color:var(--texto2)}
.pr-prota .pr-periodo{width:max-content;margin:28px 0 0}
.pr-prota .precio{margin-top:22px}
.pr-prota .precio b{font-size:84px}
.pr-prota .nota{margin:12px 0 26px;font-size:14px;color:var(--texto2)}
.pr-prota__pie{margin-top:16px;font-size:12px;color:var(--tenue)}
.pr-prota .lista-rayas li{font-size:15.5px;padding-top:16px;padding-bottom:16px;color:var(--texto)}
.pr-prota .lista-rayas li::before{top:26px}
.pr-otros{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:16px}
.pr-otro{display:block;padding:24px 26px;border:1px solid var(--linea);border-radius:var(--grande);transition:border-color .3s,background .3s}
.pr-otro:hover{border-color:var(--azul);background:var(--azul-suave)}
.pr-otro strong{display:block;margin:12px 0 8px;font-family:var(--titular);font-weight:700;font-size:17px;line-height:1.1;text-transform:uppercase}
.pr-otro>span:not(.rotulo){display:block;font-size:13.5px;line-height:1.5;color:var(--texto2)}
.pr-otro i{display:inline-block;margin-top:14px;font-style:normal;font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;border-bottom:1px solid var(--azul);padding-bottom:3px}
/* C */
.pr-tabla{width:100%;border-collapse:separate;border-spacing:0;table-layout:fixed}
.pr-tabla thead th{padding:30px 26px 28px;text-align:left;vertical-align:bottom;font-weight:400;border-bottom:1px solid var(--linea)}
.pr-tabla thead th:first-child{width:26%}
.pr-tabla thead strong{display:block;margin:12px 0 18px;font-family:var(--titular);font-weight:700;font-size:19px;line-height:1.05;text-transform:uppercase}
.pr-tabla thead b{display:block;font-family:var(--titular);font-weight:700;font-size:44px;line-height:.9}
.pr-tabla thead small{display:block;margin:8px 0 20px;font-size:10.5px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--tenue)}
.pr-tabla thead .btn{display:block;padding:13px}
.pr-tabla tbody th{padding:20px 0;text-align:left;font-size:15px;font-weight:500;color:var(--texto2);border-bottom:1px solid var(--linea2)}
.pr-tabla tbody td{padding:20px 26px;font-size:15px;font-weight:600;border-bottom:1px solid var(--linea2)}
.pr-tabla .es-el-bueno{background:var(--azul-suave);border-left:1px solid var(--azul);border-right:1px solid var(--azul)}
.pr-tabla thead .es-el-bueno{border-top:3px solid var(--azul);border-radius:var(--grande) var(--grande) 0 0}
.pr-tabla tbody tr:last-child .es-el-bueno{border-bottom:1px solid var(--azul);border-radius:0 0 var(--grande) var(--grande)}
.pr-tabla i.si,.pr-tabla i.no{display:inline-block;width:14px;height:2px;background:var(--num)}
.pr-tabla i.si{width:9px;height:16px;background:none;border:solid var(--azul);border-width:0 3px 3px 0;transform:rotate(45deg) translate(-2px,-4px)}
/* el interruptor de pago: un deslizador con dos posiciones, anual o mensual */
.pr-periodo{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:0;width:max-content;margin:0 auto 34px;padding:5px;border:1px solid var(--borde-campo);border-bottom:1px solid var(--borde-campo);border-radius:calc(var(--boton) + 5px);background:var(--campo-fondo)}
.pr-periodo::before{content:'';position:absolute;left:5px;top:5px;bottom:5px;width:calc(50% - 5px);background:var(--azul);border-radius:var(--boton);box-shadow:0 0 22px rgba(11,121,251,.55);transition:transform .35s cubic-bezier(.3,.7,.2,1)}
.precios[data-periodo="mensual"] .pr-periodo::before{transform:translateX(100%)}
.pr-periodo a{position:relative;z-index:1;margin:0;padding:14px 26px;border:0;text-align:center;white-space:nowrap;color:var(--texto2);transition:color .3s}
.pr-periodo a.on{color:#fff;border:0}
.pr-periodo a small{display:block;margin:5px 0 0;font-size:9.5px;color:var(--azul-claro)}
.pr-periodo a.on small{color:#fff}
.pr-prota .pr-periodo{margin:28px 0 0}

/* planes: el completo de protagonista y, a su lado, los otros dos con lo que incluyen */
.pr--b{display:none;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:20px;align-items:stretch}
.precios[data-diseno="b"] .pr--b{display:grid}
.pr-prota{display:block;padding:44px 48px}
.pr-prota__incluye{margin-top:34px;padding-top:26px;border-top:1px solid rgba(255,255,255,.18)}
.pr-prota__incluye .lista-rayas{display:grid;grid-template-columns:1fr 1fr;column-gap:34px;margin-top:8px}
.pr-prota .lista-rayas li{font-size:14.5px;padding-top:13px;padding-bottom:13px}
.pr-prota .lista-rayas li::before{top:23px}
.pr-lados{display:flex;flex-direction:column;gap:16px}
.pr-lado{flex:1;display:flex;flex-direction:column;padding:28px 30px 26px;border:1px solid var(--linea);border-radius:var(--grande);transition:border-color .3s,background .3s}
.pr-lado:hover{border-color:var(--borde-campo);background:var(--hover)}
.pr-lado__cabeza{display:flex;justify-content:space-between;align-items:flex-end;gap:20px}
.pr-lado h4{margin:10px 0 0;font-family:var(--titular);font-weight:700;font-size:21px;line-height:1;text-transform:uppercase}
.pr-lado__precio{text-align:right;white-space:nowrap}
.pr-lado__precio b{display:block;font-family:var(--titular);font-weight:700;font-size:34px;line-height:.9}
.pr-lado__precio span{display:block;margin-top:7px;font-size:10px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--tenue)}
.pr-lado__frase{margin-top:14px;font-size:13.5px;line-height:1.5;color:var(--texto2)}
.pr-lado .lista-rayas{margin:14px 0 20px}
.pr-lado .lista-rayas li{padding:9px 0 9px 22px;font-size:13.5px}
.pr-lado .lista-rayas li::before{top:18px}
.pr-lado .btn{display:block;margin-top:auto;padding:13px}
.pr-suelto{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:20px 30px;border:1px solid var(--linea);border-radius:var(--grande);transition:border-color .3s,background .3s}
.pr-suelto:hover{border-color:var(--azul);background:var(--azul-suave)}
.pr-suelto strong{display:block;margin-top:8px;font-family:var(--titular);font-weight:700;font-size:15px;text-transform:uppercase}
.pr-suelto i{font-style:normal;font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;white-space:nowrap;border-bottom:1px solid var(--azul);padding-bottom:3px}
/* Pruébanos, con aire de súper oferta: cupón de borde discontinuo, cinta en la esquina y brillo */
.pr-lado--oferta{position:relative;overflow:hidden;border:2px dashed #6fb1ff;background:repeating-linear-gradient(135deg,rgba(111,177,255,.07) 0 14px,transparent 14px 28px),var(--fondo);animation:oferta-late 2.6s ease-in-out infinite}
.pr-lado--oferta:hover{border-color:#fff;background:repeating-linear-gradient(135deg,rgba(111,177,255,.12) 0 14px,transparent 14px 28px),var(--fondo)}
@keyframes oferta-late{50%{box-shadow:0 0 34px rgba(111,177,255,.4)}}
.pr-lado--oferta::after{content:'';position:absolute;top:0;bottom:0;left:-40%;width:28%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.22),transparent);transform:skewX(-18deg);animation:oferta-brillo 3.4s ease-in-out infinite;pointer-events:none}
@keyframes oferta-brillo{0%,45%{left:-40%}100%{left:130%}}
.pr-cinta{position:absolute;z-index:2;right:-46px;top:20px;width:180px;padding:7px 0;background:#fff;color:#000;text-align:center;font-size:10px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;transform:rotate(38deg);box-shadow:0 6px 18px rgba(0,0,0,.5)}
.pr-lado--oferta .pr-lado__cabeza{padding-right:70px;align-items:flex-start}
.pr-lado--oferta .pr-lado__precio{text-align:left;order:-1;margin-right:26px}
.pr-lado--oferta .pr-lado__cabeza{justify-content:flex-start}
.pr-lado--oferta .pr-lado__precio b{font-size:62px;color:#fff;text-shadow:0 0 26px rgba(111,177,255,.9)}
.pr-lado--oferta .pr-lado__precio span{color:#6fb1ff}
.pr-lado--oferta .rotulo{color:#6fb1ff}
.btn--blanco{background:#fff;border-color:#fff;color:#000}
.btn--blanco:hover{filter:none;background:#6fb1ff;border-color:#6fb1ff}
.pr-cinta{right:-58px;top:30px;width:230px;padding:9px 0;font-size:11.5px}
.pr-lado--oferta .pr-lado__cabeza{padding-right:110px}

/* ---- la metodología, con movimiento (cada mejora tiene su interruptor) ---- */
.conmutador--metodo{margin:0 0 30px}
.metodo{overflow:hidden}
.metodo__pasos li>b{transition:color .4s}
.metodo__pasos strong{transition:color .4s,transform .4s}
/* 2 · recorrido */
.metodo.con-recorrido .metodo__pasos li{transition:border-color .5s}
.metodo.con-recorrido .metodo__pasos li::after{content:'';position:absolute;left:0;top:-2px;height:2px;width:0;background:var(--azul);box-shadow:0 0 10px var(--azul)}
.metodo.con-recorrido .metodo__pasos li.hecho::after{width:100%}
.metodo.con-recorrido .metodo__pasos li.ahora::after{width:100%;transition:width 2.2s linear}
.metodo.con-recorrido .metodo__pasos li.ahora::before,.metodo.con-recorrido .metodo__pasos li.hecho::before{background:var(--azul);box-shadow:0 0 16px var(--azul);z-index:1}
.metodo.con-recorrido .metodo__pasos li.ahora::before{transform:scale(1.5);transition:transform .4s}
.metodo.con-recorrido .metodo__pasos li.ahora strong{color:var(--azul-claro);transform:translateX(6px)}
.metodo.con-recorrido .metodo__pasos li:not(.ahora):not(.hecho) strong{color:var(--tenue)}
.metodo.con-recorrido .metodo__pasos .metodo__fin{border-top-color:var(--linea)}
.metodo.con-recorrido .metodo__pasos .metodo__fin:not(.ahora)::before{background:var(--fondo);box-shadow:none}
/* 3 · vídeos */
.metodo__video{display:none}
.metodo.con-videos .metodo__video{display:block;aspect-ratio:16/10;margin:0 22px 18px 0;overflow:hidden;border-radius:var(--grande);background:var(--foto);order:-1}
.metodo.con-videos .metodo__pasos li{display:flex;flex-direction:column;padding-top:0;border-top:0}
.metodo.con-videos .metodo__pasos li::before,.metodo.con-videos .metodo__pasos li::after{display:none}
.metodo__video video{width:100%;height:100%;object-fit:cover;filter:grayscale(1) brightness(.55);transition:filter .5s,transform .6s}
.metodo.con-videos .metodo__pasos li.ahora .metodo__video{box-shadow:0 0 0 2px var(--azul),0 0 34px rgba(11,121,251,.45)}
.metodo.con-videos .metodo__pasos li.ahora video,.metodo.con-videos:not(.con-recorrido) .metodo__pasos li:hover video{filter:none;transform:scale(1.04)}
.metodo.con-videos .metodo__pasos .metodo__fin strong{margin-top:10px}
/* 4 · escalera */
.metodo.con-escalera .metodo__pasos{align-items:end;padding-top:calc(4 * 30px)}
.metodo.con-escalera .metodo__pasos li{transform:translateY(calc((var(--n) - 4) * -30px - 120px + (4 - var(--n)) * 30px));transform:translateY(calc(var(--n) * -30px))}
/* 5 · cinta */
.metodo__cinta{display:none}
.metodo.con-cinta .metodo__cinta{display:block;margin:54px -48px -70px;padding:20px 0;border-top:1px solid var(--linea);overflow:hidden}
.metodo__cinta div{display:flex;align-items:center;gap:34px;width:max-content;animation:cinta 38s linear infinite;font-family:var(--titular);font-weight:700;font-size:clamp(34px,4.6vw,72px);line-height:1;text-transform:uppercase}
.metodo__cinta span{color:transparent;-webkit-text-stroke:1px var(--borde-campo)}
.metodo__cinta span:nth-of-type(5n){color:var(--azul);-webkit-text-stroke:0}
.metodo__cinta i{font-style:normal;font-size:.5em;color:var(--azul)}

/* ================= FONDO: cuatro maneras de aligerar el negro ================= */
/* A · alterna blanco: una sección sí y otra no pasa a blanco (método, profesores, reseñas y preguntas) */
body[data-fondo="alterno"] .metodo,body[data-fondo="alterno"] #inicio>section:has(.prueba-profes),body[data-fondo="alterno"] .resenas2,body[data-fondo="alterno"] .faq{--fondo:#fff;--sup:#f4f4f1;--texto:#0b0b0c;--texto2:#3d3d3f;--tenue:#707074;--linea:rgba(0,0,0,.14);--linea2:rgba(0,0,0,.07);--borde-campo:rgba(0,0,0,.3);--azul-claro:#0b79fb;--azul-suave:rgba(11,121,251,.07);--hover:rgba(0,0,0,.04);--num:rgba(0,0,0,.22);--campo-fondo:#fff;--foto:#e9e9e6;background:#fff;color:#0b0b0c;border-top-color:transparent}
/* B · grises: las mismas secciones, en gris carbón en lugar de negro */
body[data-fondo="grises"] .metodo,body[data-fondo="grises"] #inicio>section:has(.prueba-profes),body[data-fondo="grises"] .resenas2,body[data-fondo="grises"] .faq{--fondo:#17181c;--sup:#1f2126;--campo-fondo:#1f2126;--foto:#26282e;background:#17181c}
body[data-fondo="grises"] .dentro,body[data-fondo="grises"] .aparatos{--fondo:#0c0d10;background:#0c0d10}
/* C · marino: el negro pasa a azul noche, con las secciones alternas un punto más claras */
body[data-fondo="marino"]{--fondo:#050a1a;--sup:#0a1330;--campo-fondo:#081027;--foto:#0e1836;--linea:rgba(150,180,255,.18);--linea2:rgba(150,180,255,.09)}
body[data-fondo="marino"] .nav,body[data-fondo="marino"] .pie-web{background:#050a1a}
body[data-fondo="marino"] .metodo,body[data-fondo="marino"] #inicio>section:has(.prueba-profes),body[data-fondo="marino"] .resenas2,body[data-fondo="marino"] .faq{--fondo:#0a1433;background:linear-gradient(180deg,#0a1433,#07102a)}
/* D · luces: sigue negro, pero cada sección lleva un foco azul suave que le da profundidad */
body[data-fondo="luces"] #inicio>section:not(.cierre){position:relative;isolation:isolate}
body[data-fondo="luces"] #inicio>section:not(.cierre):not(.taller)::before{content:'';position:absolute;z-index:-1;inset:0;pointer-events:none;background:radial-gradient(ellipse 55% 60% at 85% 0%,rgba(11,121,251,.22),transparent 70%),radial-gradient(ellipse 40% 50% at 0% 100%,rgba(11,121,251,.12),transparent 70%)}
body[data-fondo="luces"] #inicio>section:nth-of-type(even):not(.cierre):not(.taller)::before{background:radial-gradient(ellipse 55% 60% at 12% 0%,rgba(11,121,251,.2),transparent 70%),radial-gradient(ellipse 40% 55% at 100% 100%,rgba(53,182,240,.12),transparent 70%)}
/* ---- fondo blanco: la web clara, como la original; lo oscuro queda solo donde hay vídeo ---- */
.pr-prota__incluye{border-top-color:var(--linea)}
/* la tarjeta de súper oferta es oscura siempre: lleva el texto en blanco */
.pr-lado--oferta{--fondo:#000;--texto:#fff;--texto2:#cfcfcf;--tenue:#9c9c9c;--linea:rgba(255,255,255,.16);--linea2:rgba(255,255,255,.08);color:#fff}
/* blanca con negro: sobre la web blanca, tres secciones se quedan en negro para dar ritmo */
body[data-fondo="blanconegro"] .precios,body[data-fondo="blanconegro"] .dentro,body[data-fondo="blanconegro"] .aparatos{--fondo:#000;--sup:#0b0b0c;--texto:#fff;--texto2:#cfcfcf;--tenue:#9c9c9c;--linea:rgba(255,255,255,.16);--linea2:rgba(255,255,255,.08);--borde-campo:rgba(255,255,255,.28);--azul-claro:#6fb1ff;--azul-suave:rgba(11,121,251,.1);--hover:rgba(255,255,255,.05);--num:rgba(255,255,255,.28);--campo-fondo:#0a0a0a;--foto:#151515;background:#000;color:#fff}

/* ================= CABECERA DE LA PORTADA: cuatro versiones ================= */
.portada-hero{position:relative;background:#000;color:#fff}
.portada-hero>.conmutador{position:absolute;z-index:8;left:48px;top:14px;margin:0;background:rgba(0,0,0,.7);backdrop-filter:blur(8px)}
.hr{display:none}
.portada-hero[data-diseno="a"] .hr--a{display:flex}
.portada-hero[data-diseno="b"] .hr--b{display:grid}
.portada-hero[data-diseno="c"] .hr--c,.portada-hero[data-diseno="d"] .hr--d{display:block}
body.solo-taller .portada-hero{display:none}
body.solo-hero #inicio>section,body.solo-hero .pie-web{display:none}
/* B · la clase y tú */
.hr--b{grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:10px;padding:74px 10px 10px;min-height:min(92vh,900px)}
.hrb-pantallas{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.hrb-pantalla{position:relative;overflow:hidden;border-radius:var(--grande);background:#111}
.hrb-pantalla video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hrb-pantalla--tu video{transform:scaleX(-1);filter:saturate(.9)}
.hrb-rotulo{position:absolute;left:16px;top:16px;display:flex;align-items:center;gap:8px;padding:8px 12px;background:rgba(0,0,0,.72);border-radius:var(--boton);font-size:10.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase}
.hrb-rotulo--tu{background:var(--azul)}
.hrb-rotulo b{width:8px;height:8px;border-radius:50%;background:#fff;animation:late 1.2s infinite}
.hrb-herramientas{position:absolute;left:16px;right:16px;bottom:16px;display:flex;gap:6px;flex-wrap:wrap}
.hrb-herramientas i{padding:7px 10px;background:rgba(0,0,0,.7);border:1px solid rgba(255,255,255,.3);border-radius:var(--boton);font-style:normal;font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.hrb-herramientas i.on{background:var(--azul);border-color:var(--azul)}
.hrb-aviso{position:absolute;left:16px;right:16px;bottom:16px;padding:10px;border:1px dashed rgba(255,255,255,.6);border-radius:var(--boton);background:rgba(0,0,0,.6);font-size:11px;text-align:center}
.hrb-texto{display:flex;flex-direction:column;justify-content:center;padding:40px 44px;border-radius:var(--grande);background:#0d0d10}
.hrb-texto h1{font-size:clamp(40px,5vw,84px);line-height:.9}
.hrb-texto .btn--grande{display:block}
.hrb-texto .acciones{flex-direction:column;align-items:stretch;gap:18px}
.hrb-texto .acciones .enlace{align-self:flex-start}
/* C · el muro en movimiento */
.hr--c{position:relative;height:min(94vh,920px);overflow:hidden}
.hrc-muro{position:absolute;inset:-6% -4%;display:grid;grid-template-columns:repeat(5,1fr);gap:14px;transform:rotate(-7deg) scale(1.18)}
.hrc-col{overflow:hidden}
.hrc-col>div{display:flex;flex-direction:column;gap:14px;animation:muro-sube 46s linear infinite}
.hrc-col:nth-child(even)>div{animation-name:muro-baja;animation-duration:54s}
.hrc-col img{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:var(--grande);filter:saturate(1.05)}
@keyframes muro-sube{to{transform:translateY(calc(-50% - 7px))}}
@keyframes muro-baja{from{transform:translateY(calc(-50% - 7px))}to{transform:none}}
.hrc-texto{position:absolute;inset:0;display:flex;align-items:flex-end;padding:0 48px 60px;background:linear-gradient(90deg,rgba(0,0,0,.94) 0%,rgba(0,0,0,.78) 38%,rgba(0,0,0,.15) 72%),linear-gradient(0deg,rgba(0,0,0,.85),transparent 40%)}
.hrc-texto h1{font-size:clamp(52px,8vw,132px);max-width:10ch}
/* D · el vídeo dentro de las letras */
.hr--d{padding:74px 48px 56px}
.hrd-ventana{position:relative;overflow:hidden;background:#000}
.hrd-ventana video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(1.2) brightness(1.15)}
.hrd-letras{position:relative;background:#000;color:#fff;mix-blend-mode:multiply;padding:10px 0 0}
.hrd-letras h1{margin:0;font-size:clamp(70px,13.6vw,236px);line-height:.84;letter-spacing:-.02em}
.hrd-letras span{display:block;white-space:nowrap}
.hrd-pie{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:56px;align-items:end;margin-top:40px;padding-top:30px;border-top:1px solid rgba(255,255,255,.2)}
.hrd-pie .heroe__sub{margin:0}
.hrd-pie .acciones{margin-top:0}
.hrd-letras h1{font-size:clamp(60px,10.4vw,190px);line-height:.86}
.hrd-ventana video{filter:saturate(1.3) brightness(1.25) contrast(1.05)}
/* la barra de arriba, en dos filas: páginas arriba, ajustes abajo */
.selector{flex-wrap:wrap}
.selector__ajustes{flex:1 1 100%;border-left:0;border-top:1px solid #2c2c33;overflow-x:auto}

/* ---- cabeceras E, F y G: texto a la izquierda con degradado, y fondo que se alterna ---- */
.portada-hero>.conmutador{flex-wrap:wrap;max-width:calc(100% - 96px)}
.portada-hero[data-diseno="e"] .hr--e,.portada-hero[data-diseno="f"] .hr--f,.portada-hero[data-diseno="g"] .hr--g{display:block}
.hr--lado,.hr--g{position:relative;height:min(94vh,920px);overflow:hidden;background:#000}
.hrl-fondo{position:absolute;top:0;bottom:0;right:0;width:66%;overflow:hidden;transition:opacity 1.2s ease}
.hrl-fondo--entero{width:100%}
.hrl-fondo video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 30%}
.hrl-fondo .hrc-muro{inset:-8% -6%}
/* el degradado: negro macizo bajo el texto, que se abre hacia el vídeo */
.hr--lado .hrl-fondo::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#000 0%,rgba(0,0,0,.86) 14%,rgba(0,0,0,.35) 40%,rgba(0,0,0,0) 62%),linear-gradient(0deg,rgba(0,0,0,.55),transparent 30%)}
.hrl-texto{position:absolute;inset:0;z-index:2;display:flex;align-items:center;padding:60px 48px 40px;width:54%}
.hrl-texto h1{font-size:clamp(46px,6.2vw,104px);line-height:.9;max-width:9ch}
.hrl-texto .heroe__sub{max-width:44ch}
.hrl-texto::before{content:'';position:absolute;left:48px;top:22%;bottom:22%;width:2px;background:linear-gradient(var(--azul),transparent);transform:translateX(-22px)}
/* los turnos */
.hr--turnos .hrl-fondo--muro{opacity:0}
.hr--turnos[data-turno="muro"] .hrl-fondo--muro{opacity:1}
.hr--turnos[data-turno="muro"] .hrl-fondo:not(.hrl-fondo--muro){opacity:0}
.hr--g .hrc-texto{z-index:2}
.hrl-turnos{position:absolute;z-index:3;right:48px;bottom:34px;display:flex;gap:10px}
.hrl-turnos i{position:relative;min-width:120px;padding:12px 0 0;border-top:2px solid rgba(255,255,255,.3);font-style:normal;font-size:10.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.6);cursor:pointer}
.hrl-turnos i.on{color:#fff}
.hrl-turnos i.on::before{content:'';position:absolute;left:0;top:-2px;height:2px;background:var(--azul);animation:turno 7s linear forwards}
@keyframes turno{from{width:0}to{width:100%}}
/* el titular de la cabecera, siempre en dos líneas: «Baila como» / «nunca antes» */
.portada-hero h1 span{display:block;white-space:nowrap}
.portada-hero h1{max-width:none!important}
.hrl-texto{width:60%}
.hrl-texto h1{font-size:clamp(34px,4.9vw,84px)}
.hrb-texto h1{font-size:clamp(24px,2.9vw,50px)}
.hrc-texto h1,.heroe--portada h1{font-size:clamp(44px,7.4vw,124px)}
/* el titular de la cabecera: una palabra por línea, en bloque */
.portada-hero h1{line-height:.86;letter-spacing:-.01em}
.hrl-texto{width:54%}
.hrl-texto h1{font-size:clamp(44px,6.6vw,112px)}
.hrb-texto h1{font-size:clamp(40px,5.2vw,88px)}
.hrc-texto h1,.heroe--portada h1{font-size:clamp(48px,7vw,118px)}
.hrd-letras h1{font-size:clamp(54px,9vw,160px)}
.hr--lado,.hr--g,.hr--c{height:min(100vh,1000px)}
.heroe--portada{min-height:min(100vh,1000px)}

/* ---- cabecera H: la F dentro de un marco, con el sello V 2.0 ---- */
.portada-hero[data-diseno="h"] .hr--h{display:block}
.hr--marco{height:min(100vh,1000px);padding:70px 28px 28px;background:#000}
.hrm-caja{position:relative;height:100%;overflow:hidden;border:1px solid rgba(255,255,255,.3);border-radius:var(--grande)}
.hr--marco .hrl-texto{padding:40px 52px;width:56%}
.hr--marco .hrl-texto::before{display:none}
.hr--marco .hrl-texto h1{font-size:clamp(40px,6vw,104px)}
/* las cuatro esquinas, marcadas en azul como un visor */
.hrm-esquina{position:absolute;z-index:4;width:34px;height:34px;border:3px solid var(--azul);pointer-events:none}
.hrm-esquina--1{left:-1px;top:-1px;border-right:0;border-bottom:0;border-radius:var(--grande) 0 0 0}
.hrm-esquina--2{right:-1px;top:-1px;border-left:0;border-bottom:0;border-radius:0 var(--grande) 0 0}
.hrm-esquina--3{left:-1px;bottom:-1px;border-right:0;border-top:0;border-radius:0 0 0 var(--grande)}
.hrm-esquina--4{right:-1px;bottom:-1px;border-left:0;border-top:0;border-radius:0 0 var(--grande) 0}
/* rótulos pequeños montados sobre el marco */
.hrm-borde{position:absolute;z-index:4;left:50%;transform:translate(-50%,-50%);padding:0 16px;background:#000;font-size:10px;font-weight:700;letter-spacing:.34em;text-transform:uppercase;white-space:nowrap;color:#cfcfcf}
.hrm-borde--arriba{top:0}
.hrm-borde--abajo{top:100%}
.hrm-caja{overflow:visible}
.hrm-caja>.hrl-fondo{border-radius:0 var(--grande) var(--grande) 0}
/* el sello V 2.0 */
.hrm-sello{position:absolute;z-index:5;right:34px;top:34px;display:flex;flex-direction:column;align-items:center;justify-content:center;width:132px;height:132px;border:2px solid #fff;border-radius:50%;background:rgba(11,121,251,.92);transform:rotate(-10deg);box-shadow:0 0 0 6px rgba(11,121,251,.3),0 0 46px rgba(11,121,251,.75);animation:sello 4s ease-in-out infinite}
.hrm-sello b{font-family:var(--titular);font-weight:700;font-size:34px;line-height:1;letter-spacing:-.02em}
.hrm-sello i{margin-top:7px;font-style:normal;font-size:8.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase}
@keyframes sello{50%{transform:rotate(-10deg) scale(1.06);box-shadow:0 0 0 10px rgba(11,121,251,.2),0 0 70px rgba(11,121,251,.95)}}
.hr--marco .hrl-turnos{right:34px;bottom:30px}
/* la barra de versiones de cabecera pasa a ser una tira propia, encima, para no tapar el marco */
.portada-hero>.conmutador{position:static;max-width:none;margin:0;padding:10px 48px;border:0;border-bottom:1px dashed rgba(255,255,255,.25);border-radius:0;background:#0d0d10}
.hr--marco{padding:34px 34px 38px;height:min(calc(100vh - 40px),980px)}
.hr--b{padding-top:10px}.hr--d{padding-top:40px}

/* ---- más maneras de enmarcar la cabecera ---- */
.portada-hero[data-diseno="i"] .hr--i,.portada-hero[data-diseno="j"] .hr--j,.portada-hero[data-diseno="k"] .hr--k{display:block}
.hrq-lienzo{position:relative;height:100%;overflow:hidden;background:#000}
.hrq-lienzo .hrl-texto{padding:40px 56px;width:56%}
.hrq-lienzo .hrl-texto::before{display:none}
.hrq-lienzo .hrl-texto h1{font-size:clamp(40px,5.8vw,100px)}
.hrm-sello i{max-width:92px;text-align:center;line-height:1.3;font-size:8px}
.hrm-sello{width:140px;height:140px}
/* I · paspartú: franja ancha de color hueso alrededor, y la firma abajo */
.hr--cuadro{height:min(calc(100vh - 40px),1000px);padding:44px 44px 0;background:#eeece6;color:#0b0b0c;display:flex!important;flex-direction:column}
.portada-hero:not([data-diseno="i"]) .hr--cuadro{display:none!important}
.hr--cuadro .hrq-lienzo{flex:1;height:auto;min-height:0;box-shadow:0 0 0 1px rgba(0,0,0,.25),0 30px 70px rgba(0,0,0,.35)}
.hrq-firma{display:flex;justify-content:space-between;align-items:center;height:62px;font-size:10.5px;font-weight:700;letter-spacing:.3em;text-transform:uppercase;color:#3d3d3f}
.hrq-firma span:nth-child(2){color:#8a8a86}
/* J · marco grueso azul */
.hr--grueso{height:min(calc(100vh - 40px),1000px);padding:22px;background:var(--azul)}
.hr--grueso .hrq-lienzo{border-radius:3px}
.hr--grueso .hrm-sello{right:-6px;top:-6px;background:#fff;color:#000;border-color:#000;box-shadow:0 10px 30px rgba(0,0,0,.5);animation:none;transform:rotate(-10deg)}
/* K · tarjeta flotante */
.hr--flota{height:min(calc(100vh - 40px),1000px);padding:30px 40px 46px;background:radial-gradient(ellipse 70% 60% at 70% 40%,rgba(11,121,251,.45),transparent 70%),#05070d}
.hr--flota .hrq-lienzo{border-radius:34px;border:1px solid rgba(255,255,255,.22);box-shadow:0 40px 100px rgba(0,0,0,.8),0 0 90px rgba(11,121,251,.35)}
.hr--flota .hrl-fondo{border-radius:0 34px 34px 0}
/* dentro del cuadro con paspartú el lienzo es oscuro: su texto, en blanco */
.hr--cuadro .hrq-lienzo{color:#fff;--texto:#fff;--texto2:#cfcfcf;--linea:rgba(255,255,255,.16)}
.hr--cuadro .hrq-lienzo .hrm-sello{color:#fff}
.hr--grueso .hrm-sello{right:14px;top:14px}
/* el cuadro con paspartú, con los cantos redondeados */
.hr--cuadro .hrq-lienzo{border-radius:20px}
.hr--cuadro .hrl-fondo{border-radius:0 20px 20px 0}
.hr--cuadro{border-radius:0 0 26px 26px}
/* el sello, más grande, para que «Nuevas herramientas» se lea */
.hrm-sello{width:190px;height:190px;right:38px;top:38px}
.hrm-sello b{font-size:48px}
.hrm-sello i{max-width:140px;margin-top:10px;font-size:12.5px;letter-spacing:.14em;line-height:1.25}
/* menos franja alrededor del cuadro */
.hr--cuadro{padding:18px 18px 0}
.hrq-firma{height:46px;padding:0 8px}
/* el sello, con menos peso: más pequeño, sin relleno azul ni latido, solo el aro */
.hrm-sello{width:128px;height:128px;right:30px;top:30px;background:rgba(0,0,0,.45);border:1.5px solid rgba(255,255,255,.85);box-shadow:none;animation:none;backdrop-filter:blur(6px)}
.hrm-sello b{font-size:30px}
.hrm-sello i{max-width:100px;margin-top:7px;font-size:9px;letter-spacing:.16em;color:#6fb1ff}
/* la cabecera queda fijada en la I: fuera la tira de opciones; y la franja crema, recta por abajo */
.portada-hero>.conmutador{display:none}
.hr--cuadro{border-radius:0}
/* negro + crema: la web sigue oscura, pero cuatro secciones pasan al crema del marco de la cabecera */
body[data-fondo="crema"] .metodo,body[data-fondo="crema"] #inicio>section:has(.prueba-profes),body[data-fondo="crema"] .resenas2,body[data-fondo="crema"] .faq{--fondo:#eeece6;--sup:#e4e1d9;--texto:#0b0b0c;--texto2:#3a3a3c;--tenue:#6d6c68;--linea:rgba(0,0,0,.16);--linea2:rgba(0,0,0,.08);--borde-campo:rgba(0,0,0,.3);--azul-claro:#0b79fb;--azul-suave:rgba(11,121,251,.08);--hover:rgba(0,0,0,.05);--num:rgba(0,0,0,.24);--campo-fondo:#f6f5f0;--foto:#dcd9d0;background:#eeece6;color:#0b0b0c;border-top-color:transparent}
body[data-fondo="crema"] .rs-cinta .rs-cita{background:#f6f5f0}

/* ---- el camino y el método, en una sola sección ---- */
.camino .metodo__cabeza h2{max-width:19ch;margin-top:0}
.camino .metodo__cifras dt small{font-size:.24em}
.camino__rotulo{display:flex;align-items:center;gap:28px;margin-top:48px}
.camino__rotulo .rotulo{white-space:nowrap}
.camino__linea{flex:1;display:flex;align-items:center;gap:14px}
.camino__linea b{flex:1;height:2px;background:linear-gradient(90deg,var(--linea),var(--azul))}
.camino__linea i{font-family:var(--titular);font-style:normal;font-weight:700;font-size:15px;color:var(--tenue)}
.camino__linea i:last-child{color:var(--azul)}
.camino .escalera{margin-top:20px;height:500px}
.camino__clase{display:grid;grid-template-columns:200px minmax(0,1fr);gap:28px;align-items:start;margin-top:44px;padding-top:34px;border-top:1px solid var(--linea)}
.camino__clase .rotulo{padding-top:22px}
.camino__clase .metodo__pasos{margin-top:0}
.camino__clase .metodo__pasos strong{font-size:20px}
.camino__clase .metodo__pasos span{font-size:13.5px}
.camino .metodo__pasos .metodo__fin strong{margin-top:10px}

/* ---- los pasos de la clase, de cinco maneras ---- */
.conmutador--pasos{margin:0 0 34px}
.peldano__pasos{display:none}
/* A · una frase grande: «Mira. Repite. Grábate. Corrige. Baila.», y se va encendiendo palabra a palabra */
.camino[data-pasos="frase"] .camino__clase{display:block}
.camino[data-pasos="frase"] .camino__clase .rotulo{padding:0}
.camino[data-pasos="frase"] .metodo__pasos{position:relative;display:flex;flex-wrap:wrap;gap:0 .32em;margin-top:20px;padding-bottom:58px;font-size:clamp(34px,5.5vw,96px)}
.camino[data-pasos="frase"] .metodo__pasos li{position:static;padding:0;border:0}
.camino[data-pasos="frase"] .metodo__pasos li::before,.camino[data-pasos="frase"] .metodo__pasos li::after{display:none!important}
.camino[data-pasos="frase"] .metodo__pasos li>b{display:none}
.camino[data-pasos="frase"] .metodo__pasos li strong{margin:0!important;font-size:1em;line-height:.95;transform:none!important;color:transparent!important;-webkit-text-stroke:1.5px var(--num);transition:color .5s,-webkit-text-stroke-color .5s}
.camino[data-pasos="frase"] .metodo__pasos li strong::after{content:'.'}
.camino[data-pasos="frase"] .metodo__pasos li.hecho strong{color:var(--texto)!important;-webkit-text-stroke:0}
.camino[data-pasos="frase"] .metodo__pasos li.ahora strong{color:var(--azul)!important;-webkit-text-stroke:0}
.camino[data-pasos="frase"] .metodo__pasos li>span{position:absolute;left:0;bottom:8px;margin:0;font-size:18px;color:var(--texto2);opacity:0;transform:translateY(8px);transition:opacity .4s,transform .4s}
.camino[data-pasos="frase"] .metodo__pasos li.ahora>span{opacity:1;transform:none}
/* B · cinco tarjetas: la que toca se levanta y se ilumina */
.camino[data-pasos="tarjetas"] .metodo__pasos{gap:12px}
.camino[data-pasos="tarjetas"] .metodo__pasos li{padding:22px 22px 24px;border:1px solid var(--linea);border-radius:var(--grande);background:var(--campo-fondo);transition:transform .4s,box-shadow .4s,border-color .4s}
.camino[data-pasos="tarjetas"] .metodo__pasos li::before,.camino[data-pasos="tarjetas"] .metodo__pasos li::after{display:none!important}
.camino[data-pasos="tarjetas"] .metodo__pasos li>b{font-size:34px;line-height:1;color:var(--num)}
.camino[data-pasos="tarjetas"] .metodo__pasos li strong{margin-top:22px!important;transform:none!important}
.camino[data-pasos="tarjetas"] .metodo__pasos li.ahora{border-color:var(--azul);box-shadow:0 0 0 1px var(--azul),0 16px 36px rgba(11,121,251,.25);transform:translateY(-8px)}
.camino[data-pasos="tarjetas"] .metodo__pasos li.ahora>b{color:var(--azul)}
/* C · en una línea: discreto, como un pie de la sección */
.camino[data-pasos="linea"] .camino__clase{display:flex;align-items:center;gap:30px;margin-top:34px;padding-top:26px}
.camino[data-pasos="linea"] .camino__clase .rotulo{padding:0;white-space:nowrap;color:var(--tenue)}
.camino[data-pasos="linea"] .metodo__pasos{display:flex;flex-wrap:wrap;align-items:center;gap:0}
.camino[data-pasos="linea"] .metodo__pasos li{padding:0;border:0}
.camino[data-pasos="linea"] .metodo__pasos li::before,.camino[data-pasos="linea"] .metodo__pasos li::after{display:none!important}
.camino[data-pasos="linea"] .metodo__pasos li>b,.camino[data-pasos="linea"] .metodo__pasos li>span{display:none}
.camino[data-pasos="linea"] .metodo__pasos li strong{margin:0!important;font-size:22px;transform:none!important}
.camino[data-pasos="linea"] .metodo__pasos li+li strong::before{content:'→';margin:0 18px;font-family:Poppins,sans-serif;font-weight:400;color:var(--azul)}
/* D · dentro del nivel abierto: los pasos van como chapitas sobre el vídeo, y abajo no hay nada */
.camino[data-pasos="dentro"] .camino__clase{display:none}
.camino[data-pasos="dentro"] .peldano.on .peldano__pasos{position:absolute;z-index:2;left:22px;top:58px;display:flex;flex-wrap:wrap;gap:6px}
.peldano__pasos u{padding:7px 11px;background:rgba(0,0,0,.62);border:1px solid rgba(255,255,255,.35);border-radius:var(--boton);text-decoration:none;font-size:10.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;animation:chapita 11s infinite}
.peldano__pasos u:nth-child(2){animation-delay:2.2s}.peldano__pasos u:nth-child(3){animation-delay:4.4s}.peldano__pasos u:nth-child(4){animation-delay:6.6s}.peldano__pasos u:nth-child(5){animation-delay:8.8s}
@keyframes chapita{0%,18%{background:#0b79fb;border-color:#0b79fb}22%,100%{background:rgba(0,0,0,.62);border-color:rgba(255,255,255,.35)}}
/* E · sin ellos */
.camino[data-pasos="sin"] .camino__clase{display:none}
/* «.hecho» también es una clase de la página de pago: aquí no debe tocar el tamaño ni la posición del paso */
.metodo__pasos li.hecho{margin-top:0;font-size:inherit;color:inherit}
/* la línea del 0 al 100: se llena hasta el nivel abierto */
.camino__rotulo{margin-top:56px;align-items:flex-end}
.camino__linea{align-items:center;gap:18px;padding-top:34px}
.camino__linea>b{position:relative;height:6px;border-radius:3px;background:var(--linea)}
.camino__linea>b>u{position:absolute;left:0;top:0;bottom:0;width:calc(var(--p) * 1%);border-radius:3px;background:linear-gradient(90deg,#35b6f0,var(--azul));box-shadow:0 0 16px rgba(11,121,251,.75);transition:width .7s cubic-bezier(.3,.7,.2,1)}
.camino__linea>b>u::after{content:'';position:absolute;right:-7px;top:50%;width:14px;height:14px;margin-top:-7px;border-radius:50%;background:#fff;border:3px solid var(--azul);box-shadow:0 0 0 5px rgba(11,121,251,.25),0 0 18px var(--azul)}
.camino__linea>b>s{position:absolute;top:-4px;width:2px;height:14px;margin-left:-1px;background:var(--num);text-decoration:none}
.camino__linea>b>em{position:absolute;left:calc(var(--p) * 1%);bottom:20px;transform:translateX(-50%);padding:6px 11px;background:var(--azul);color:#fff;border-radius:var(--boton);font-family:var(--titular);font-style:normal;font-weight:700;font-size:15px;line-height:1;white-space:nowrap;box-shadow:0 6px 18px rgba(11,121,251,.45);transition:left .7s cubic-bezier(.3,.7,.2,1)}
.camino__linea>b>em::after{content:'';position:absolute;left:50%;bottom:-5px;width:10px;height:10px;margin-left:-5px;background:var(--azul);transform:rotate(45deg)}
.camino__linea>i{font-size:18px;transition:color .4s,transform .4s,text-shadow .4s}
.camino__linea>i.fin{color:var(--tenue)}
.camino__linea.lleno>i.fin{color:var(--azul);transform:scale(1.5);text-shadow:0 0 18px rgba(11,121,251,.7)}
.camino__linea.lleno>b>em{opacity:0}
.camino__linea>b>em{transition:left .7s cubic-bezier(.3,.7,.2,1),opacity .3s}
/* la línea del 0 al 100, más sutil: hilo fino, sin resplandor, sin marcas, y la cifra como texto pequeño */
.camino__rotulo{margin-top:48px;align-items:center}
.camino__linea{padding-top:0}
.camino__linea>b{height:2px;border-radius:0}
.camino__linea>b>u{border-radius:0;background:var(--azul);box-shadow:none}
.camino__linea>b>u::after{right:-4px;width:8px;height:8px;margin-top:-4px;background:var(--azul);border:0;box-shadow:none}
.camino__linea>b>s{display:none}
.camino__linea>b>em{bottom:10px;padding:0;background:none;box-shadow:none;color:var(--azul);font-family:Poppins,sans-serif;font-size:11px;font-weight:700;letter-spacing:.1em}
.camino__linea>b>em::after{display:none}
.camino__linea>i{font-size:15px}
.camino__linea.lleno>i.fin{transform:none;text-shadow:none}

/* ---- sección 05: cursos, series y clases sueltas, con la explicación de cada cosa ---- */
.dentro__tipo{grid-template-columns:repeat(3,1fr);border-radius:var(--grande) var(--grande) 0 0}
.dentro__tipo b{min-width:1.3em;text-align:center}
.dentro__explica{border:1px solid var(--linea);border-top:0;border-radius:0 0 var(--grande) var(--grande);background:var(--azul-suave)}
.dentro__explica article{display:none;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:48px;align-items:center;padding:34px 38px}
.dentro__explica article.on,.dentro__explica:not(:has(.on)) article:first-child{display:grid}
.dentro__explica h3{font-size:clamp(20px,2.1vw,30px);line-height:1.02}
.dentro__explica p{max-width:62ch;margin-top:14px;font-size:15.5px;line-height:1.6;color:var(--texto2)}
.ex-para{padding-top:14px;border-top:1px solid var(--linea);color:var(--texto)!important}
.ex-para .rotulo{display:inline;margin-right:10px;font-size:10px}
.ex-ejemplos{display:flex;flex-wrap:wrap;gap:6px}
.ex-ejemplos u{padding:6px 10px;border:1px solid var(--borde-campo);border-radius:var(--boton);text-decoration:none;font-size:11px;font-weight:600;color:var(--texto)}
/* los dibujos */
.ex-dibujo{display:flex;align-items:center;justify-content:center;gap:10px;min-height:150px}
.ex-dibujo span{display:block;padding:14px 12px;border:1px solid var(--borde-campo);border-radius:var(--boton);background:var(--fondo);font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;white-space:nowrap}
.ex-dibujo b{display:block;margin-bottom:8px;font-family:var(--titular);font-size:22px;line-height:1;letter-spacing:0;color:var(--azul)}
.ex-dibujo i{font-style:normal;font-size:18px;color:var(--azul)}
.ex-dibujo--curso .fin{background:var(--azul);border-color:var(--azul);color:#fff}
.ex-dibujo--curso .fin b{color:#fff}
.ex-dibujo--curso span{animation:ex-paso 4.8s infinite}
.ex-dibujo--curso span:nth-of-type(2){animation-delay:1.2s}.ex-dibujo--curso span:nth-of-type(3){animation-delay:2.4s}.ex-dibujo--curso span:nth-of-type(4){animation:none}
@keyframes ex-paso{0%,20%{border-color:var(--azul);box-shadow:0 0 0 1px var(--azul)}30%,100%{border-color:var(--borde-campo);box-shadow:none}}
.ex-dibujo--serie .caja{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:38px 16px 16px;border:1px dashed var(--azul);background:none}
.ex-dibujo--serie .caja em{position:absolute;left:14px;top:-1px;transform:translateY(-50%);padding:5px 10px;background:var(--azul);color:#fff;border-radius:3px;font-style:normal;font-size:10px;letter-spacing:.16em}
.ex-dibujo--serie .caja span{padding:16px 14px;text-align:center}
.ex-dibujo--suelta{gap:26px}
.ex-dibujo--suelta span{padding:26px 20px}
.ex-dibujo--suelta span:nth-child(1){transform:rotate(-6deg)}
.ex-dibujo--suelta span:nth-child(2){transform:translateY(-14px) rotate(3deg);border-color:var(--azul)}
.ex-dibujo--suelta span:nth-child(3){transform:rotate(8deg)}
.dentro .dentro__filtros{margin-top:26px}
.dentro.viendo-series .carril{margin-top:30px}
.cartel--suelta .img img{object-position:center}

/* ---- sección 05, comprimida: título, pestañas, explicación, filtros y carteles caben en una pantalla ---- */
.dentro{padding-top:44px;padding-bottom:44px}
.dentro .indice{margin-bottom:12px}
.dentro__cabeza{align-items:center}
.dentro__cabeza h2{max-width:none;font-size:clamp(22px,2.5vw,36px)}
.dentro__cabeza .cifras{border:0}
.dentro__cabeza .cifras div{display:flex;align-items:baseline;gap:12px;padding:0!important}
.dentro__cabeza .cifras dt{font-size:30px}
.dentro__cabeza .cifras dd{margin:0}
.dentro__tipo{margin-top:20px}
.dentro__tipo a{padding:13px 22px;gap:16px}
.dentro__tipo b{font-size:30px}
.dentro__tipo strong{font-size:16px;margin-bottom:3px}
.dentro__tipo span{font-size:12.5px}
.dentro__explica article{grid-template-columns:auto minmax(0,1fr);gap:30px;padding:16px 24px}
.dentro__explica h3{font-size:17px}
.dentro__explica p{max-width:none;margin-top:6px;font-size:14px;line-height:1.5}
.ex-dibujo{min-height:0;gap:6px;justify-content:flex-start}
.ex-dibujo span{padding:9px 10px;font-size:0}
.ex-dibujo b{margin:0;font-size:15px}
.ex-dibujo i{font-size:13px}
.ex-dibujo--serie .caja{grid-template-columns:repeat(6,1fr);gap:5px;padding:20px 9px 9px}
.ex-dibujo--serie .caja em{left:8px;padding:3px 7px;font-size:8.5px}
.ex-dibujo--serie .caja span{width:22px;height:22px;padding:0}
.ex-dibujo--suelta{gap:12px;padding:4px 8px}
.ex-dibujo--suelta span{width:34px;height:34px;padding:0}
.ex-dibujo--suelta span:nth-child(2){transform:translateY(-6px) rotate(3deg)}
/* estilo y nivel, en una sola línea */
.dentro .dentro__filtros{display:flex;flex-wrap:wrap;align-items:center;gap:0 34px;margin-top:14px;border-bottom:1px solid var(--linea)}
.dentro .dentro__filtros .dentro__filtro{display:flex;align-items:center;gap:16px;border:0}
.dentro.con-nivel .dentro__filtro--nivel{display:flex;margin-left:auto}
.dentro .dentro__filtro .rotulo{font-size:9.5px}
.dentro .dentro__filtro .opciones{gap:0 20px}
.dentro .dentro__filtro .opciones a{padding:11px 0 10px;font-size:12.5px}
/* carteles algo más pequeños: seis a la vista */
.dentro .carril{margin-top:16px}
.dentro .cartel{flex:0 0 calc((100% - 48px - 100px) / 6);min-width:200px}
.dentro .cartel__texto strong{font-size:15px}
.dentro .cartel__texto small{font-size:10.5px}
.dentro__venta{margin-top:22px;padding:22px 30px}
.dentro__venta h3{font-size:clamp(18px,1.9vw,26px)}
/* los carteles de serie ya llevan el titulo dentro de la imagen: no se repite encima */
.dentro .cartel--serie .solo-arreglo{display:none!important}
.dentro .cartel--serie .img::before{background:linear-gradient(to top,rgba(0,0,0,.8) 0%,rgba(0,0,0,0) 26%)}
/* sección 05: más aire arriba, tarjetas más grandes y, en vez de la franja azul, un separador */
.dentro{padding-top:76px;padding-bottom:56px}
.dentro .indice{margin-bottom:18px}
.dentro__tipo{margin-top:30px}
.dentro .dentro__filtros{margin-top:20px}
.dentro .carril{margin-top:24px}
.dentro .cartel{flex:0 0 calc((100% - 48px - 80px) / 5);min-width:240px}
.dentro .cartel__texto strong{font-size:17px}
.dentro .cartel__texto small{font-size:11.5px}
.dentro__pie{display:flex;align-items:center;justify-content:center;gap:22px;margin-top:38px;padding-top:0;border-top:0;font-size:11px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--tenue)}
.dentro__pie i{flex:1;height:1px;background:var(--linea)}
.dentro__pie .enlace{color:var(--texto);border-bottom-color:var(--azul)}
/* el dibujo de serie: al cambiar de tema, el rótulo entra y las fichas caen de una en una */
.ex-dibujo--serie .caja em{min-width:0;transition:none}
.ex-dibujo--serie .caja.cambia em{animation:serie-rotulo .45s ease-out}
.ex-dibujo--serie .caja.cambia>span{animation:serie-ficha .5s ease-out backwards}
.ex-dibujo--serie .caja.cambia>span:nth-of-type(2){animation-delay:.06s}.ex-dibujo--serie .caja.cambia>span:nth-of-type(3){animation-delay:.12s}
.ex-dibujo--serie .caja.cambia>span:nth-of-type(4){animation-delay:.18s}.ex-dibujo--serie .caja.cambia>span:nth-of-type(5){animation-delay:.24s}.ex-dibujo--serie .caja.cambia>span:nth-of-type(6){animation-delay:.3s}
@keyframes serie-rotulo{from{opacity:0;transform:translateY(-120%)}to{opacity:1;transform:translateY(-50%)}}
@keyframes serie-ficha{0%{opacity:0;transform:translateY(-10px) scale(.7);border-color:var(--azul);background:var(--azul)}60%{opacity:1;border-color:var(--azul)}100%{transform:none}}
.ex-dibujo--serie{min-width:210px}
/* el dibujo de «clase suelta»: tres fichas que flotan, y por turnos se elige una, se enciende y le sale el ▶ */
.ex-dibujo--suelta span{position:relative;animation:suelta-elige 6s infinite}
.ex-dibujo--suelta span:nth-child(1){--giro:-6deg;--sube:0px;animation-delay:0s;transform:rotate(-6deg)}
.ex-dibujo--suelta span:nth-child(2){--giro:3deg;--sube:-6px;animation-delay:2s;transform:translateY(-6px) rotate(3deg);border-color:var(--borde-campo)}
.ex-dibujo--suelta span:nth-child(3){--giro:8deg;--sube:0px;animation-delay:4s;transform:rotate(8deg)}
.ex-dibujo--suelta span::after{content:'';position:absolute;left:50%;top:50%;margin:-6px 0 0 -4px;border:6px solid transparent;border-left:10px solid #fff;border-right:0;opacity:0;animation:suelta-play 6s infinite;animation-delay:inherit}
@keyframes suelta-elige{
  0%{transform:translateY(var(--sube)) rotate(var(--giro));background:var(--fondo);border-color:var(--borde-campo);box-shadow:none}
  8%,26%{transform:translateY(calc(var(--sube) - 9px)) rotate(0deg) scale(1.18);background:var(--azul);border-color:var(--azul);box-shadow:0 8px 20px rgba(11,121,251,.5)}
  34%,100%{transform:translateY(var(--sube)) rotate(var(--giro));background:var(--fondo);border-color:var(--borde-campo);box-shadow:none}}
@keyframes suelta-play{0%,6%{opacity:0}10%,26%{opacity:1}32%,100%{opacity:0}}

/* ================= CREMA: la zona clara de la web (misma receta en todas las páginas) ================= */
.crema{--fondo:#eeece6;--sup:#e4e1d9;--texto:#0b0b0c;--texto2:#3a3a3c;--tenue:#6d6c68;--linea:rgba(0,0,0,.16);--linea2:rgba(0,0,0,.08);--borde-campo:rgba(0,0,0,.3);--azul-claro:#0b79fb;--azul-suave:rgba(11,121,251,.08);--hover:rgba(0,0,0,.05);--num:rgba(0,0,0,.24);--campo-fondo:#f6f5f0;--foto:#dcd9d0;background:#eeece6;color:#0b0b0c}
.nv{display:inline-flex;gap:3px;margin-right:9px;vertical-align:middle}
.nv i{width:11px;height:6px;border:1px solid var(--borde-campo);border-radius:1px}
.nv i.on{background:var(--azul);border-color:var(--azul)}

/* ================= PÁGINA DE CURSOS ================= */
.cur-cabeza{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:64px;align-items:end;padding:70px 48px 56px}
.cur-cabeza h1{font-size:clamp(64px,11vw,190px);line-height:.82;letter-spacing:-.02em}
.cur-que .ex-dibujo{justify-content:flex-start;margin-bottom:18px}
.cur-que .ex-dibujo span{background:var(--campo-fondo)}
.cur-que .ex-dibujo--curso .fin{background:var(--azul)}
.cur-que h3{font-size:24px}
.cur-que p{max-width:52ch;margin-top:12px;font-size:16px;line-height:1.6;color:var(--texto2)}
.cur-que .cifras{display:inline-flex;margin-top:26px}
.cur-que .cifras dt{font-size:30px}
.cur-banda{padding:18px;background:#eeece6}
.cur-destacado{position:relative;display:block;height:min(62vh,560px);overflow:hidden;border-radius:20px;background:#000;color:#fff}
.cur-destacado__fondo{position:absolute;top:0;bottom:0;right:0;width:66%}
.cur-destacado__fondo video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 25%}
.cur-destacado__fondo::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#000 0%,rgba(0,0,0,.86) 14%,rgba(0,0,0,.3) 42%,rgba(0,0,0,0) 64%),linear-gradient(0deg,rgba(0,0,0,.5),transparent 30%)}
.cur-destacado__texto{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;justify-content:center;width:52%;padding:40px 48px}
.cur-destacado__texto .rotulo{color:#6fb1ff}
.cur-destacado strong{display:block;margin-top:16px;font-family:var(--titular);font-weight:700;font-size:clamp(30px,4vw,64px);line-height:.92;text-transform:uppercase}
.cur-destacado__nivel{display:block;margin-top:18px;font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:#d0d0d0}
.cur-destacado__nivel .nv i{border-color:rgba(255,255,255,.5)}
.cur-destacado__sub{display:block;max-width:46ch;margin-top:16px;font-size:15px;line-height:1.6;color:#d8d8d8}
.cur-destacado .acciones{gap:30px}
.cur-destacado__dato{font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:#cfcfcf}
.cur-destacado__dato b{display:block;margin-bottom:4px;font-family:var(--titular);font-size:24px;letter-spacing:0;color:#fff}
.cur-lista{padding:0 48px 80px}
.cur-filtros{position:sticky;top:80px;z-index:20;display:flex;flex-wrap:wrap;align-items:center;gap:0 34px;padding-top:10px;background:var(--fondo);border-bottom:1px solid var(--linea)}
.cur-filtros .filtro{display:flex;align-items:center;gap:16px;border:0}
.cur-filtros .rotulo{font-size:9.5px;color:var(--tenue)}
.cur-filtros .opciones{gap:0 22px;flex-wrap:wrap}
.cur-filtros .opciones a{padding:14px 0 12px;cursor:pointer}
.cur-filtros small{margin-left:4px;font-size:10px;font-weight:700;color:var(--tenue)}
.cur-cuenta{margin-left:auto;font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--tenue)}
.cur-cuenta b{font-family:var(--titular);font-size:20px;letter-spacing:0;color:var(--texto);margin-right:6px}
.cur-rejilla{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:48px 22px;margin-top:36px}
.cur-tarjeta{display:block}
.cur-tarjeta[hidden]{display:none}
.cur-tarjeta .img{aspect-ratio:4/5;border-radius:12px}
.cur-tarjeta .img img{transition:transform .6s}
.cur-tarjeta:hover .img img{transform:scale(1.04)}
.cur-tarjeta .img::after{content:'';position:absolute;left:0;right:0;top:0;height:3px;background:var(--azul);transform:scaleX(0);transform-origin:left;transition:transform .35s;z-index:3}
.cur-tarjeta:hover .img::after{transform:scaleX(1)}
.cur-tarjeta__desc{position:absolute;z-index:2;left:0;right:0;bottom:0;padding:60px 18px 18px;background:linear-gradient(to top,rgba(0,0,0,.94) 0%,rgba(0,0,0,.85) 62%,rgba(0,0,0,0) 100%);color:#e6e6e6;font-size:13px;line-height:1.55;opacity:0;transform:translateY(16px);transition:opacity .4s,transform .45s cubic-bezier(.3,.7,.2,1)}
.cur-tarjeta:hover .cur-tarjeta__desc{opacity:1;transform:none}
.cur-tarjeta__desc i{display:block;width:max-content;margin-top:12px;font-style:normal;font-size:10.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:#fff;border-bottom:1px solid var(--azul);padding-bottom:3px}
.cur-tarjeta__nivel{display:block;margin-top:16px;font-size:10px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--azul-claro)}
.cur-tarjeta strong{display:block;margin-top:9px;font-family:var(--titular);font-weight:700;font-size:18px;line-height:1.05;text-transform:uppercase}
.cur-tarjeta__con{display:block;margin-top:8px;font-size:13px;color:var(--texto2)}
.cur-tarjeta__pie{display:flex;justify-content:space-between;align-items:baseline;margin-top:12px;padding-top:10px;border-top:1px solid var(--linea);font-size:10.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--tenue)}
.cur-tarjeta__pie b{font-family:var(--titular);font-size:16px;letter-spacing:0;color:var(--texto)}
.cur-vacio{padding:70px 0;font-size:16px;color:var(--texto2);text-align:center}
.cur-vacio[hidden]{display:none}
.cur .cierre{margin-top:0}
.cur .cur-lista+.cierre{margin:0;border-radius:0}
/* cabecera de Cursos: el titular no puede pisar la explicación */
.cur-cabeza{grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:end}
.cur-cabeza h1{font-size:clamp(54px,8.4vw,150px)}
.cur-cabeza>div{min-width:0}
/* el titular «Cursos» en su propia fila, y la explicación debajo, a lo ancho */
.cur-cabeza{display:block;padding:60px 48px 44px}
.cur-cabeza h1{font-size:clamp(64px,11.5vw,200px);line-height:.8}
.cur-que{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:8px 40px;align-items:center;margin-top:34px;padding-top:26px;border-top:1px solid var(--linea)}
.cur-que .ex-dibujo{grid-row:1 / span 2;margin:0}
.cur-que h3{font-size:20px;align-self:end}
.cur-que p{grid-column:2;margin:0;align-self:start;max-width:64ch;font-size:15px}
.cur-que .cifras{grid-column:3;grid-row:1 / span 2;margin:0}
/* cabecera de Cursos, directa: el titular y una línea de datos */
.cur-cabeza{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;padding:44px 48px 26px}
.cur-cabeza h1{margin:0;font-size:clamp(56px,9vw,150px);line-height:.8}
.cur-cabeza__dato{display:flex;align-items:baseline;gap:9px;padding-bottom:8px;font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--tenue);white-space:nowrap}
.cur-cabeza__dato b{font-family:var(--titular);font-size:24px;letter-spacing:0;color:var(--texto)}
.cur-cabeza__dato i{width:1px;height:22px;margin:0 14px;background:var(--linea);align-self:center}

/* ================= FICHA DE CURSO ================= */
.fc-hero{padding:18px 18px 0}
.fc-lienzo{position:relative;height:min(calc(100vh - 150px),760px);min-height:560px;overflow:hidden;border-radius:20px;background:#000;color:#fff}
.fc-lienzo__fondo{position:absolute;top:0;bottom:0;right:0;width:70%}
.fc-lienzo__fondo video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 25%}
.fc-lienzo__fondo::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#000 0%,rgba(0,0,0,.88) 16%,rgba(0,0,0,.3) 44%,rgba(0,0,0,0) 62%),linear-gradient(0deg,rgba(0,0,0,.6),transparent 34%)}
.fc-lienzo__texto{position:absolute;left:0;top:0;bottom:0;z-index:1;display:flex;flex-direction:column;justify-content:center;width:56%;padding:40px 52px}
.fc-lienzo .volver{margin-bottom:22px;color:rgba(255,255,255,.7)}
.fc-lienzo .rotulo .nv i{border-color:rgba(255,255,255,.5)}
.fc-lienzo h1{margin-top:14px;font-size:clamp(40px,6vw,104px);line-height:.86;max-width:9ch}
.fc-con{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-top:22px;font-size:15px;color:#d8d8d8}
.fc-con strong{color:#fff;font-weight:600}
.fc-con .pf-titulo{margin:0}
.fc-lienzo .heroe__sub{max-width:44ch;margin-top:18px;font-size:15.5px}
.fc-tablero{position:absolute;z-index:2;right:34px;bottom:34px;width:330px;display:flex;flex-direction:column;gap:14px;padding:26px 26px 20px;background:rgba(6,6,8,.72);border:1px solid rgba(255,255,255,.22);border-radius:14px;backdrop-filter:blur(14px);box-shadow:inset 0 2px 0 var(--azul)}
.fc-tablero__cifra{display:flex;align-items:baseline;gap:12px}
.fc-tablero__cifra b{font-family:var(--titular);font-weight:700;font-size:46px;line-height:1}
.fc-tablero__cifra b small{font-size:.45em;color:#9c9c9c}
.fc-tablero__cifra span{font-size:10px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:#cfcfcf}
.fc-tablero__barra{display:flex;gap:4px}
.fc-tablero__barra i{flex:1;height:5px;border-radius:2px;background:rgba(255,255,255,.2)}
.fc-tablero__barra i.on{background:var(--azul)}
.fc-tablero__barra i.ahora{background:#fff;animation:late 1.4s infinite}
.fc-tablero .btn{display:block}
.fc-tablero__nota{display:flex;justify-content:space-between;gap:12px;font-size:11.5px;color:#cfcfcf}
.fc-tablero__nota a{color:#fff;border-bottom:1px solid var(--azul)}
.fc-firma{display:flex;justify-content:space-between;align-items:center;height:58px;padding:0 10px;font-size:10.5px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--tenue)}
.fc-firma b{margin-right:8px;font-family:var(--titular);font-size:17px;letter-spacing:0;color:var(--texto)}
/* el curso */
.fc-curso{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:72px;align-items:start;border-top:0}
.fc-curso h2{margin-top:0}
.fc-para{padding:30px 32px;border:1px solid var(--linea);border-radius:14px;background:var(--campo-fondo)}
.fc-para .lista-rayas{margin:10px 0 26px}
.fc-para .lista-rayas li{font-size:15px;color:var(--texto)}
.fc-herramientas{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.fc-herramientas u{padding:7px 11px;border:1px solid var(--borde-campo);border-radius:var(--boton);text-decoration:none;font-size:11px;font-weight:600}
/* el temario */
.fc-temario h2{margin-top:0}
.fc-clases{margin-top:30px;border-top:1px solid var(--linea)}
.fc-clase{border-bottom:1px solid var(--linea);border-left:2px solid transparent;transition:background .3s}
.fc-clase.on{border-left-color:var(--azul);background:var(--azul-suave)}
.fc-clase__fila{display:grid;grid-template-columns:54px 96px minmax(0,1fr) auto 70px 28px;gap:20px;align-items:center;padding:16px 18px 16px 14px;cursor:pointer}
.fc-clase:not(.on) .fc-clase__fila:hover{background:var(--hover)}
.fc-clase__fila>b{font-family:var(--titular);font-weight:700;font-size:26px;line-height:1;color:var(--num)}
.fc-clase.on .fc-clase__fila>b,.fc-clase__fila:hover>b{color:var(--azul)}
.fc-clase__mini{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;border-radius:6px;background:var(--foto)}
.fc-clase__mini img{width:100%;height:100%;object-fit:cover}
.fc-clase.vista .fc-clase__mini img{opacity:.45}
.fc-clase__mini i{position:absolute;inset:0;display:grid;place-items:center;font-style:normal;font-size:16px;color:#fff}
.fc-clase__titulo{font-size:18px;font-weight:600}
.fc-clase__titulo small{display:block;margin-top:5px;font-size:13px;font-weight:400;color:var(--tenue);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fc-clase__estado{font-size:10px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--azul-claro);white-space:nowrap}
.fc-clase.vista .fc-clase__estado{color:var(--tenue)}
.fc-clase__dur{font-size:13px;color:var(--texto2);text-align:right;font-variant-numeric:tabular-nums}
.fc-clase__mas{position:relative;width:28px;height:28px;border:1px solid var(--borde-campo);border-radius:var(--boton)}
.fc-clase__mas::before,.fc-clase__mas::after{content:'';position:absolute;left:50%;top:50%;width:12px;height:2px;margin:-1px 0 0 -6px;background:var(--texto);transition:transform .3s}
.fc-clase__mas::after{transform:rotate(90deg)}
.fc-clase.on .fc-clase__mas{background:var(--azul);border-color:var(--azul)}
.fc-clase.on .fc-clase__mas::after{transform:none}
.fc-clase__panel{display:none;grid-template-columns:360px minmax(0,1fr);gap:36px;align-items:center;padding:6px 18px 28px 88px}
.fc-clase.on .fc-clase__panel{display:grid}
.fc-clase__video{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;border-radius:12px;background:#111}
.fc-clase__video img{width:100%;height:100%;object-fit:cover;filter:brightness(.75)}
.fc-clase__video .play{width:54px;height:54px;font-size:16px}
.fc-pasos{margin-top:12px;font-size:15.5px;line-height:2;color:var(--texto2)}
.fc-pasos span:not(:last-child)::after{content:'·';margin:0 12px;color:var(--azul);font-weight:700}
/* quién te enseña */
.fc-profe{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:64px;align-items:center;border-top:0}
.fc-profe .img{aspect-ratio:4/5;border-radius:14px}
.fc-profe .img img{object-position:center 15%}
.fc-profe h2{margin-top:16px;font-size:clamp(34px,4.6vw,76px)}
.fc-siguen{margin-top:34px}
/* la barra de compra del visitante */
.fc-barra{position:sticky;bottom:0;z-index:30;display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:30px;align-items:center;padding:14px 48px;background:rgba(6,6,8,.94);border-top:1px solid rgba(255,255,255,.18);backdrop-filter:blur(10px)}
.fc-barra span{font-size:12px;color:#cfcfcf}
.fc-barra small{display:block;margin-bottom:3px;font-family:var(--titular);font-weight:700;font-size:15px;text-transform:uppercase;color:#fff}
.fc-barra b{font-family:var(--titular);font-weight:700;font-size:26px}
body:not(.visitante) .fc-barra{display:none}

/* ---- ficha de curso: tráiler, «lo que aprenderás» y contenidos ---- */
.fc-curso{grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:64px}
.fc-videos{display:grid;grid-template-columns:1fr 1fr;gap:16px;position:sticky;top:100px}
.fc-video{position:relative;display:block;aspect-ratio:16/10;overflow:hidden;border-radius:14px;background:#111;color:#fff;cursor:pointer}
.fc-video--grande{grid-column:1 / -1;aspect-ratio:16/9}
.fc-video img{width:100%;height:100%;object-fit:cover;object-position:center 22%;filter:brightness(.72);transition:transform .6s,filter .4s}
.fc-video:hover img{transform:scale(1.04);filter:brightness(.9)}
.fc-video .play{width:54px;height:54px;font-size:16px;transition:transform .3s}
.fc-video--grande .play{width:78px;height:78px;font-size:24px}
.fc-video:hover .play{transform:translate(-50%,-50%) scale(1.1)}
.fc-video__pie{position:absolute;left:0;right:0;bottom:0;padding:40px 18px 16px;background:linear-gradient(to top,rgba(0,0,0,.9),transparent)}
.fc-video__pie b{display:block;font-family:var(--titular);font-weight:700;font-size:15px;text-transform:uppercase}
.fc-video--grande .fc-video__pie b{font-size:20px}
.fc-video__pie small{display:block;margin-top:5px;font-size:11px;letter-spacing:.06em;color:#d0d0d0}
.fc-videos .fc-herramientas{grid-column:1 / -1;align-items:center;margin-top:6px}
.fc-videos .fc-herramientas .rotulo{margin-right:8px;font-size:9.5px}
.fc-contenidos{margin-top:34px;padding-top:26px;border-top:1px solid var(--linea)}
.fc-contenidos p{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 16px;align-items:baseline;margin-top:18px;font-size:15px;font-weight:600}
.fc-contenidos p b{font-family:var(--titular);font-size:18px}
.fc-contenidos p i{grid-column:1 / -1;height:4px;border-radius:2px;background:var(--linea)}
.fc-contenidos p u{display:block;height:100%;border-radius:2px;background:var(--azul)}
.fc-tablero__nota a{cursor:pointer}
.fc-opiniones__lista{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:30px}
.fc-opiniones .rs-cita{border:1px solid var(--linea);border-radius:14px;background:var(--campo-fondo)}
.fc-visor{position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:60px;background:rgba(0,0,0,.92)}
.fc-visor[hidden]{display:none}
.fc-visor video{width:min(100%,1300px);max-height:100%;border-radius:14px;background:#000}
.fc-visor__cerrar{position:absolute;right:30px;top:22px;padding:10px 16px;border:1px solid rgba(255,255,255,.35);border-radius:var(--boton);color:#fff;font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;cursor:pointer}

/* ficha de curso · «el curso»: texto corto, cuatro claves y un solo vídeo */
.fc-curso{align-items:center}
.fc-curso .texto{max-width:56ch;font-size:17px}
.fc-claves{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:30px}
.fc-claves li{display:flex;align-items:center;gap:14px;padding:18px 20px;border:1px solid var(--linea);border-radius:12px;background:var(--campo-fondo);font-size:15.5px;font-weight:600;line-height:1.25}
.fc-claves i{flex:none;width:8px;height:14px;margin:-4px 4px 0 4px;border:solid var(--azul);border-width:0 3px 3px 0;transform:rotate(45deg)}
.fc-curso>.fc-video--grande{aspect-ratio:16/9;align-self:center}
.fc-curso>.fc-video--grande{grid-column:auto}
/* ficha · «el curso», con más cuerpo: entrada grande, dos párrafos, vídeo más pequeño y las claves numeradas */
.fc-curso{grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:72px;align-items:start}
.fc-entrada{max-width:22ch;margin-top:26px;padding-left:20px;border-left:3px solid var(--azul);font-family:var(--titular);font-weight:700;font-size:clamp(20px,2.1vw,30px);line-height:1.08;text-transform:uppercase}
.fc-curso .texto{max-width:60ch;font-size:16.5px}
.fc-curso__lado{position:relative}
.fc-curso__lado::before{content:'';position:absolute;z-index:0;right:-14px;top:-14px;width:62%;aspect-ratio:16/9;border-radius:14px;background:var(--azul)}
.fc-curso__lado>.fc-video--grande{position:relative;z-index:1;grid-column:auto;aspect-ratio:16/9;box-shadow:0 24px 50px rgba(0,0,0,.28)}
.fc-curso__lado .fc-video--grande .play{width:60px;height:60px;font-size:18px}
.fc-curso__lado .fc-video--grande .fc-video__pie b{font-size:16px}
.fc-curso__lado>.rotulo{margin:34px 0 0}
.fc-claves{grid-template-columns:1fr 1fr;gap:0;margin-top:12px;border-top:1px solid var(--linea)}
.fc-claves li{display:block;padding:16px 16px 18px 0;border:0;border-bottom:1px solid var(--linea);border-radius:0;background:none;font-size:15px}
.fc-claves li:nth-child(odd){border-right:1px solid var(--linea)}
.fc-claves li:nth-child(even){padding-left:18px}
.fc-claves li b{display:block;margin-bottom:8px;font-family:var(--titular);font-weight:700;font-size:22px;line-height:1;color:var(--azul)}
/* ficha · «el curso»: el lado derecho es un bloque azul entero, con el vídeo y las claves dentro */
.fc-curso{align-items:stretch;gap:64px}
.fc-curso__texto{align-self:center}
.fc-curso__lado{padding:26px;border-radius:20px;background:var(--azul);color:#fff}
.fc-curso__lado::before{display:none}
.fc-curso__lado>.fc-video--grande{box-shadow:0 18px 40px rgba(0,0,0,.35)}
.fc-curso__lado .play{background:#fff;color:var(--azul)}
.fc-curso__lado>.rotulo{margin-top:26px;color:rgba(255,255,255,.8)}
.fc-curso__lado .fc-claves{border-top-color:rgba(255,255,255,.35)}
.fc-curso__lado .fc-claves li{border-color:rgba(255,255,255,.35);color:#fff}
.fc-curso__lado .fc-claves li b{color:#fff;opacity:.7}
.fc-curso__lado .fc-claves li:nth-child(n+3){border-bottom:0;padding-bottom:4px}
/* ficha · «el curso»: texto y claves a un lado, vídeo al otro; cuatro repartos del azul */
.fc-curso{grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:56px;align-items:stretch}
.fc-curso>.conmutador{grid-column:1 / -1;margin:0 0 6px}
.fc-curso__texto{align-self:center;border-radius:20px;transition:background .3s,color .3s,padding .3s}
.fc-claves__titulo{margin-top:34px;color:var(--tenue)}
.fc-curso .fc-claves{grid-template-columns:1fr 1fr;margin-top:12px}
.fc-curso .fc-claves li:nth-child(n+3){border-bottom:0}
.fc-curso__video{display:flex;align-items:center;border-radius:20px;transition:background .3s,padding .3s}
.fc-curso__video .fc-video--grande{width:100%;grid-column:auto;aspect-ratio:16/10;box-shadow:0 20px 44px rgba(0,0,0,.3)}
/* A · el vídeo, sobre un bloque azul */
.fc-curso[data-opcion="a"] .fc-curso__video,.fc-curso[data-opcion="d"] .fc-curso__video{padding:30px;background:var(--azul)}
.fc-curso[data-opcion="a"] .play,.fc-curso[data-opcion="d"] .play{background:#fff;color:var(--azul)}
/* D · como la A, con el vídeo a la izquierda */
.fc-curso[data-opcion="d"] .fc-curso__video{order:1}
.fc-curso[data-opcion="d"] .fc-curso__texto{order:2}
/* B · el texto y las claves, dentro del bloque azul; el vídeo, sobre el crema */
.fc-curso[data-opcion="b"] .fc-curso__texto{padding:40px 42px;background:var(--azul)}
/* C · la sección entera, azul */
.fc-curso[data-opcion="c"]{background:var(--azul)}
.fc-curso[data-opcion="c"] .play{background:#fff;color:var(--azul)}
.fc-curso[data-opcion="b"] .fc-curso__texto,.fc-curso[data-opcion="c"] .fc-curso__texto{--texto:#fff;--texto2:rgba(255,255,255,.92);--tenue:rgba(255,255,255,.75);--linea:rgba(255,255,255,.35);color:#fff}
.fc-curso[data-opcion="b"] .fc-curso__texto h2,.fc-curso[data-opcion="c"] .fc-curso__texto h2{color:#fff}
.fc-curso[data-opcion="b"] .fc-curso__texto .indice b,.fc-curso[data-opcion="c"] .fc-curso__texto .indice b,.fc-curso[data-opcion="b"] .fc-claves li b,.fc-curso[data-opcion="c"] .fc-claves li b{color:#fff;opacity:.75}
.fc-curso[data-opcion="c"]>.conmutador{border-color:rgba(255,255,255,.5)}
.fc-curso[data-opcion="c"]>.conmutador span{color:#fff}
.fc-curso[data-opcion="c"]>.conmutador button{color:#fff;border-color:rgba(255,255,255,.5)}
.fc-curso[data-opcion="c"]>.conmutador button.on{background:#fff;color:var(--azul)}
/* ficha · «el curso», reparto A con el azul sutil: un velo azul claro con hilo, en lugar del bloque macizo */
.fc-curso[data-opcion="a"] .fc-curso__video{padding:22px;background:rgba(11,121,251,.1);border:1px solid rgba(11,121,251,.35);box-shadow:inset 0 3px 0 var(--azul)}
.fc-curso[data-opcion="a"] .play{background:var(--azul);color:#fff}
.fc-curso[data-opcion="a"] .fc-curso__video .fc-video--grande{aspect-ratio:auto;height:100%;min-height:380px;box-shadow:0 16px 36px rgba(0,0,0,.22)}

/* ---- ficha · el vídeo de «el curso»: cinco maneras de llevar el azul ---- */
.fc-curso[data-opcion="a"] .fc-curso__video{padding:0;background:none;border:0;box-shadow:none;position:relative}
.fc-curso[data-opcion="a"] .fc-curso__video .fc-video--grande{box-shadow:0 16px 36px rgba(0,0,0,.22)}
/* 1 · filo macizo: el azul de verdad, pero asomando solo 10 px alrededor */
.fc-curso[data-azul="filo"] .fc-curso__video{padding:10px;background:var(--azul)}
.fc-curso[data-azul="filo"] .fc-curso__video .fc-video--grande{box-shadow:none;border-radius:11px}
/* 2 · solo el pie: el vídeo limpio y, debajo, una banda azul con su rótulo */
.fc-curso[data-azul="pie"] .fc-curso__video .fc-video--grande{display:flex;flex-direction:column;box-shadow:0 16px 36px rgba(0,0,0,.22)}
.fc-curso[data-azul="pie"] .fc-video--grande img{flex:1;min-height:0;filter:none}
.fc-curso[data-azul="pie"] .fc-video--grande .fc-video__pie{position:static;padding:18px 22px;background:var(--azul)}
.fc-curso[data-azul="pie"] .fc-video--grande .play{top:calc(50% - 34px)}
/* 3 · dos esquinas: dos escuadras azules, arriba a la derecha y abajo a la izquierda */
.fc-curso[data-azul="esquina"] .fc-curso__video::before,.fc-curso[data-azul="esquina"] .fc-curso__video::after{content:'';position:absolute;width:90px;height:90px;border:6px solid var(--azul);pointer-events:none}
.fc-curso[data-azul="esquina"] .fc-curso__video::before{right:-12px;top:-12px;border-left:0;border-bottom:0;border-radius:0 18px 0 0}
.fc-curso[data-azul="esquina"] .fc-curso__video::after{left:-12px;bottom:-12px;border-right:0;border-top:0;border-radius:0 0 0 18px}
/* 4 · velo claro (el de antes) */
.fc-curso[data-azul="velo"] .fc-curso__video{padding:22px;background:rgba(11,121,251,.1);border:1px solid rgba(11,121,251,.35);box-shadow:inset 0 3px 0 var(--azul)}

/* ---- ficha · temario: fila limpia y un solo vídeo al abrir ---- */
.fc-clase__fila{grid-template-columns:70px minmax(0,1fr) auto 70px 28px;padding:20px 18px 20px 14px}
.fc-clase__fila>b{font-size:32px}
.fc-clase__titulo{font-family:var(--titular);font-weight:700;font-size:19px;line-height:1.1;text-transform:uppercase}
.fc-clase__titulo small{margin-top:8px;font-family:Poppins,sans-serif;font-size:10.5px;font-weight:700;letter-spacing:.22em;text-transform:uppercase}
.fc-clase.vista .fc-clase__titulo{color:var(--tenue)}
.fc-clase__estado{display:flex;align-items:center;gap:14px}
.fc-clase__estado u{padding:5px 10px;background:var(--azul);color:#fff;border-radius:3px;text-decoration:none;font-size:9.5px;letter-spacing:.18em}
.fc-clase__panel{grid-template-columns:380px minmax(0,1fr);gap:40px;align-items:start;padding:4px 18px 30px 104px}
.fc-clase__video em{position:absolute;left:0;right:0;bottom:16px;text-align:center;font-style:normal;font-size:10px;font-weight:700;letter-spacing:.3em;text-transform:uppercase;color:#fff}
.fc-clase__desc{max-width:64ch;font-size:16px;line-height:1.65;color:var(--texto2)}
.fc-pasos{display:flex;flex-wrap:wrap;gap:7px;margin-top:18px;line-height:1}
.fc-pasos span{padding:9px 13px;border:1px solid var(--borde-campo);border-radius:var(--boton);font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--texto)}
.fc-pasos span:not(:last-child)::after{display:none}
.fc-clase__nota{margin-top:18px;font-size:10.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--tenue)}
.fc-clase__nota b{color:var(--azul-claro)}
/* el botón de reproducir, en toda la web: circular y más suave (cristal translúcido con aro, en vez del cuadrado azul) */
.play{border-radius:50%!important;background:rgba(255,255,255,.16)!important;color:#fff!important;border:1.5px solid rgba(255,255,255,.75);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:0 8px 26px rgba(0,0,0,.3);transition:background .3s,transform .3s,border-color .3s}
a:hover>.play,a:hover .play,.fc-video:hover .play{background:var(--azul)!important;border-color:var(--azul)}
/* ficha · contenido centrado: las secciones no ocupan todo el ancho; el fondo sí llega de lado a lado */
.fc[data-ancho="centrado"]>section.franja{--lado:max(48px,calc((100% - 1240px) / 2));padding-left:var(--lado);padding-right:var(--lado)}
.fc[data-ancho="centrado"] .fc-curso{grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:56px;align-items:start}
.fc[data-ancho="centrado"] .fc-curso__video .fc-video--grande{height:auto;min-height:0;aspect-ratio:16/10}
.fc[data-ancho="centrado"] .fc-clase__panel{grid-template-columns:340px minmax(0,1fr);padding-left:104px}
.fc[data-ancho="centrado"] .fc-firma{padding-left:max(10px,calc((100% - 1240px) / 2));padding-right:max(10px,calc((100% - 1240px) / 2))}
.fc-curso>.conmutador span{margin-left:14px}
/* ficha centrada, con menos margen: columna de 1420 px */
.fc[data-ancho="centrado"]>section.franja{--lado:max(48px,calc((100% - 1420px) / 2))}
.fc[data-ancho="centrado"] .fc-firma{padding-left:max(10px,calc((100% - 1420px) / 2));padding-right:max(10px,calc((100% - 1420px) / 2))}
.fc[data-ancho="centrado"] .fc-clase__panel{grid-template-columns:360px minmax(0,1fr)}
.fc-clase__desc{font-size:17px;max-width:52ch}
/* cabecera de la ficha: en lugar de la descripción, los datos del curso y el acceso al vídeo */
.fc-hero{padding-bottom:18px}
.fc-datos{display:flex;margin-top:30px;border-top:1px solid rgba(255,255,255,.22);border-bottom:1px solid rgba(255,255,255,.22);width:max-content;max-width:100%}
.fc-datos div{padding:16px 28px;border-left:1px solid rgba(255,255,255,.22)}
.fc-datos div:first-child{padding-left:0;border-left:0}
.fc-datos dt{font-family:var(--titular);font-weight:700;font-size:30px;line-height:1}
.fc-datos dd{margin:8px 0 0;font-size:10px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:#bdbdbd}
.fc-ver{display:inline-flex;align-items:center;gap:14px;margin-top:26px;font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;cursor:pointer;width:max-content}
.fc-ver .play{position:static;transform:none;width:46px;height:46px;font-size:14px;flex:none}
.fc-ver:hover .play{transform:none}
.fc-ver small{font-size:11px;font-weight:500;letter-spacing:.06em;color:#bdbdbd}
.fc-datos .solo-visitante{display:none!important}
.fc-tablero__cifra b{white-space:nowrap}
.fc-tablero__cifra{align-items:center}
/* las 4 claves, en una sola fila a todo el ancho de la sección */
.fc-claves__fila{grid-column:1 / -1;margin-top:10px}
.fc-claves__fila .fc-claves__titulo{margin-top:0}
.fc-curso .fc-claves__fila .fc-claves{grid-template-columns:repeat(4,minmax(0,1fr))}
.fc-curso .fc-claves__fila .fc-claves li{padding:20px 22px 22px;border-bottom:1px solid var(--linea);border-right:1px solid var(--linea)}
.fc-curso .fc-claves__fila .fc-claves li:first-child{padding-left:0}
.fc-curso .fc-claves__fila .fc-claves li:last-child{border-right:0}
.fc-curso .fc-claves__fila .fc-claves li b{font-size:26px}
.fc[data-ancho="centrado"] .fc-curso{align-items:center}
/* cabecera: tres datos útiles en lugar del enlace al vídeo */
.fc-utiles{list-style:none;display:grid;gap:0;margin-top:26px;max-width:520px}
.fc-utiles li{display:grid;grid-template-columns:150px minmax(0,1fr);gap:16px;align-items:baseline;padding:11px 0;border-bottom:1px solid rgba(255,255,255,.14);font-size:14px;color:#d8d8d8}
.fc-utiles b{position:relative;padding-left:18px;font-size:10.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:#fff}
.fc-utiles b::before{content:'';position:absolute;left:0;top:50%;width:10px;height:2px;background:var(--azul)}
/* cabecera de la ficha: tres datos útiles, cada uno con su icono */
.fc-utiles{display:flex;flex-wrap:wrap;gap:12px 34px;max-width:none;margin-top:28px}
.fc-utiles li{display:flex;align-items:center;gap:14px;padding:0;border:0;font-size:13px;line-height:1.35;color:#cfcfcf}
.fc-utiles svg{flex:none;width:42px;height:42px;padding:10px;border:1px solid rgba(255,255,255,.3);border-radius:50%;color:#6fb1ff}
.fc-utiles b{display:block;padding:0;margin-bottom:3px;font-size:11px;letter-spacing:.16em;color:#fff}
.fc-utiles b::before{display:none}
body:not(.visitante) .fc-utiles .solo-visitante,body.visitante .fc-utiles .solo-alumno{display:none}
.fc-lienzo__texto{width:62%}

/* la muestra de una clase, al pasar el ratón por su vídeo (temario, anterior/siguiente) */
.fc-clase__video video,.cl-vecina .img video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .35s}
.fc-clase__video.viendo video,.cl-vecina .img.viendo video{opacity:1}
.fc-clase__video.viendo .play,.fc-clase__video.viendo em{opacity:0;transition:opacity .3s}

/* ================= PÁGINA DE CLASE ================= */
.cl{--col:1420px}
.cl-sala{padding:18px max(18px,calc((100% - 1700px) / 2)) 30px;background:#000;color:#fff}
.cl-migas{display:flex;align-items:center;gap:18px;padding:6px 6px 16px;font-size:11px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:#9c9c9c}
.cl-migas a{color:#fff}
.cl-migas__barra{display:flex;gap:4px;width:220px;margin-left:auto}
.cl-migas__barra i{flex:1;height:4px;border-radius:2px;background:rgba(255,255,255,.2)}
.cl-migas__barra i.on{background:var(--azul)}
.cl-migas__barra i.ahora{background:#fff}
.cl-rejilla{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:14px;align-items:stretch}
.cl-video{border-radius:16px;overflow:hidden;background:#000}
.cl-reproductor{width:100%;aspect-ratio:16/9;background:#0a0a0a}
.cl-cola{display:flex;flex-direction:column;min-height:0;border:1px solid rgba(255,255,255,.16);border-radius:16px;overflow:hidden;background:#0b0b0c}
.cl-cola__cabeza{display:flex;justify-content:space-between;align-items:baseline;padding:18px 18px 14px;border-bottom:1px solid rgba(255,255,255,.14)}
.cl-cola__cabeza small{font-size:11px;color:#9c9c9c}
.cl-cola__lista{flex:1;overflow-y:auto;height:0;min-height:200px}
.cl-cola__fila{display:grid;grid-template-columns:26px 88px minmax(0,1fr);gap:12px;align-items:center;padding:11px 16px 11px 14px;border-bottom:1px solid rgba(255,255,255,.08);border-left:3px solid transparent}
.cl-cola__fila:hover{background:rgba(255,255,255,.05)}
.cl-cola__fila>b{font-family:var(--titular);font-weight:700;font-size:13px;color:rgba(255,255,255,.4)}
.cl-cola__fila .img{aspect-ratio:16/9;border-radius:6px}
.cl-cola__fila .img u{position:absolute;inset:0;display:grid;place-items:center;background:rgba(0,0,0,.5);text-decoration:none;font-size:13px}
.cl-cola__fila strong{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:12.5px;font-weight:600;line-height:1.3}
.cl-cola__fila small{display:block;margin-top:4px;font-size:10.5px;color:#9c9c9c}
.cl-cola__fila.on{border-left-color:var(--azul);background:rgba(11,121,251,.12)}
.cl-cola__fila.on>b,.cl-cola__fila.on small{color:#6fb1ff}
.cl-cola__fila.vista strong{color:#9c9c9c}
.cl>section.franja{--lado:max(48px,calc((100% - 1420px) / 2));padding-left:var(--lado);padding-right:var(--lado)}
/* la clase */
.cl-ficha{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:64px;align-items:start;border-top:0}
.cl-ficha h1{margin-top:6px;font-size:clamp(32px,4.4vw,68px);line-height:.92}
.cl-ficha .texto{font-size:18px}
.cl-ficha .acciones{flex-wrap:wrap;gap:10px}
.cl-accion{display:inline-flex;align-items:center;gap:10px;padding:13px 18px}
.rec{width:10px;height:10px;border-radius:50%;background:#e23b3b;flex:none}
.cl-pasos{padding:26px 28px 22px;border:1px solid var(--linea);border-radius:14px;background:var(--campo-fondo)}
.cl-pasos ol{list-style:none;margin-top:10px}
.cl-pasos li{display:grid;grid-template-columns:34px minmax(0,1fr) auto 26px;gap:10px;align-items:center;padding:13px 0;border-top:1px solid var(--linea2);font-size:15.5px;font-weight:600;cursor:pointer}
.cl-pasos li:hover{color:var(--azul)}
.cl-pasos li b{font-family:var(--titular);font-size:13px;color:var(--azul)}
.cl-pasos li small{font-size:12px;font-weight:500;color:var(--tenue);font-variant-numeric:tabular-nums}
.cl-pasos li i{font-style:normal;font-size:16px;color:var(--tenue);opacity:0;transition:opacity .25s}
.cl-pasos li:hover i{opacity:1}
.cl-pasos__nota{margin-top:12px;font-size:11.5px;color:var(--tenue)}
/* anterior y siguiente */
.cl-vecinas{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:18px;padding-top:0;padding-bottom:70px;border-top:0}
.cl-vecina{display:grid;grid-template-columns:minmax(0,44%) minmax(0,1fr);gap:26px;align-items:center;padding:18px;border:1px solid var(--linea);border-radius:16px;background:var(--campo-fondo);transition:border-color .3s,box-shadow .3s}
.cl-vecina:hover{border-color:var(--azul)}
.cl-vecina .img{aspect-ratio:16/9;border-radius:10px}
.cl-vecina__texto b{display:block;margin-top:12px;font-family:var(--titular);font-weight:700;font-size:34px;line-height:.9;color:var(--num)}
.cl-vecina__texto strong{display:block;margin-top:8px;font-family:var(--titular);font-weight:700;font-size:clamp(15px,1.5vw,22px);line-height:1.05;text-transform:uppercase}
.cl-vecina__texto small{display:block;margin-top:8px;font-size:13.5px;line-height:1.45;color:var(--texto2)}
.cl-vecina__texto i{display:inline-block;margin-top:14px;font-style:normal;font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;border-bottom:1px solid var(--linea);padding-bottom:3px}
.cl-vecina--siguiente{box-shadow:inset 0 3px 0 var(--azul)}
.cl-vecina--siguiente .cl-vecina__texto b{color:var(--azul)}
.cl-vecina--siguiente i{border-bottom-color:var(--azul)}
.cl-vecina--anterior .img img{filter:grayscale(1) brightness(.85)}
.cl-vecina--anterior small{display:none}
/* grabaciones y profesora */
.cl-doble{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:64px;align-items:center}
.cl-doble .indice b{color:#e23b3b}
.cl-grabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.cl-grab .img{aspect-ratio:9/14;border-radius:12px;background:linear-gradient(160deg,#1a1c22,#0c0d10);border:1px solid var(--linea)}
.cl-grab small{display:block;margin-top:9px;font-size:10.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--tenue)}
.cl-grab--nueva{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;aspect-ratio:9/14;border:1px dashed var(--azul);border-radius:12px;text-align:center}
.cl-grab--nueva strong{font-family:var(--titular);font-size:15px;text-transform:uppercase}
.cl-grab--nueva small{margin:0}
.cl-profe{display:grid;grid-template-columns:150px minmax(0,1fr);gap:26px;align-items:center;padding:22px;border:1px solid var(--linea);border-radius:16px}
.cl-profe .img{aspect-ratio:4/5;border-radius:10px}
.cl-profe .img img{object-position:center 15%}
.cl-profe h3{margin:8px 0 12px;font-size:26px}
.cl-profe .acciones{margin-top:18px;gap:18px}
/* la barra de «siguiente clase» */
.cl-barra{position:sticky;bottom:0;z-index:30;display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:30px;align-items:center;padding:14px max(48px,calc((100% - 1420px) / 2));background:var(--azul);color:#fff;transform:translateY(110%);transition:transform .35s}
.cl-barra.visible{transform:none}
.cl-barra span{font-family:var(--titular);font-weight:700;font-size:20px;line-height:1;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cl-barra small{display:block;margin-bottom:7px;font-family:Poppins,sans-serif;font-size:10px;font-weight:700;letter-spacing:.3em;opacity:.85}
.cl-barra b{font-family:var(--titular);font-size:18px}
.cl-barra i{font-style:normal;padding:14px 34px;background:#000;border-radius:var(--boton);font-size:11.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase}
.cl-ficha h1{font-size:clamp(28px,3.3vw,50px);line-height:.96}
.cl-grabs{grid-template-columns:repeat(3,170px)}
.cl-doble{align-items:start}
.cl-pasos li.on{color:var(--azul)}
.cl-pasos li.on small{color:var(--azul)}
.cl-pasos li.on b::before{content:"▶ ";font-size:9px}
/* página de clase: tres opciones para la derecha del título */
.cl-ficha>.conmutador{grid-column:1 / -1;margin:0 0 10px}
.cl-ficha{align-items:center}
.cl-lado{display:none}
.cl[data-lado="sigue"] .cl-lado--sigue,.cl[data-lado="grabas"] .cl-lado--grabas,.cl[data-lado="pasos"] .cl-lado--pasos{display:block}
/* A · la siguiente clase, en grande, y la anterior debajo en pequeño; el bloque de anterior/siguiente de abajo sobra */
.cl[data-lado="sigue"] .cl-vecinas{display:none}
.cl[data-lado="sigue"] .cl-ficha{padding-bottom:80px}
.cl-sigue{display:block;overflow:hidden;border:1px solid var(--linea);border-radius:16px;background:var(--campo-fondo);box-shadow:inset 0 3px 0 var(--azul);transition:border-color .3s,box-shadow .3s}
.cl-sigue:hover{border-color:var(--azul);box-shadow:inset 0 3px 0 var(--azul),0 18px 40px rgba(11,121,251,.18)}
.cl-sigue .img{aspect-ratio:16/8;border-radius:0}
.cl-sigue .img video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .35s}
.cl-sigue .img.viendo video{opacity:1}
.cl-sigue .img.viendo .play{opacity:0}
.cl-sigue__texto{display:block;padding:22px 24px 24px}
.cl-sigue__texto strong{display:block;margin-top:10px;font-family:var(--titular);font-weight:700;font-size:22px;line-height:1.05;text-transform:uppercase}
.cl-sigue__texto small{display:block;margin:10px 0 18px;font-size:14.5px;line-height:1.5;color:var(--texto2)}
.cl-sigue__texto .btn{display:block}
.cl-antes{display:grid;grid-template-columns:92px minmax(0,1fr) auto;gap:16px;align-items:center;margin-top:14px;padding:10px 18px 10px 10px;border:1px solid var(--linea);border-radius:12px}
.cl-antes:hover{background:var(--hover)}
.cl-antes .img{aspect-ratio:16/9;border-radius:6px}
.cl-antes .img img{filter:grayscale(1) brightness(.85)}
.cl-antes small{display:block;font-size:10px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--tenue)}
.cl-antes strong{display:block;margin-top:4px;font-size:13.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cl-antes i{font-style:normal;font-size:10.5px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;white-space:nowrap}
/* B · tus grabaciones, al lado del título; abajo queda solo la profesora */
.cl-lado--grabas .cl-grabs{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:14px}
.cl-lado--grabas .cl-grab .img{background:linear-gradient(160deg,#d9d6cd,#c9c5ba)}
.cl[data-lado="grabas"] .cl-doble>div:first-child{display:none}
.cl[data-lado="grabas"] .cl-doble{grid-template-columns:minmax(0,1fr)}
.cl[data-lado="grabas"] .cl-profe{max-width:640px}
/* página de clase: «Baila con alguien», debajo de las acciones */
.cl-amigo{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:18px;align-items:center;margin-top:26px;padding:18px 20px;border:1px solid var(--linea);border-radius:14px;background:var(--campo-fondo);box-shadow:inset 3px 0 0 var(--azul)}
.cl-amigo__icono{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:var(--azul);color:#fff}
.cl-amigo__icono svg{width:22px;height:22px}
.cl-amigo strong{display:block;font-family:var(--titular);font-weight:700;font-size:15px;text-transform:uppercase}
.cl-amigo strong em{margin-left:8px;padding:3px 7px;background:var(--azul);color:#fff;border-radius:3px;font-family:Poppins,sans-serif;font-style:normal;font-size:9px;letter-spacing:.16em;vertical-align:middle}
.cl-amigo p{margin-top:5px;font-size:13.5px;line-height:1.45;color:var(--texto2)}
.cl-amigo__botones{display:flex;flex-direction:column;align-items:center;gap:10px;margin:0!important}
.cl-amigo__botones .btn{padding:12px 18px}
.cl-ficha{align-items:start}
/* grabaciones de la clase: cuando no hay ninguna, una invitación; cuando hay, sus miniaturas */
.cl-lado--grabas>.conmutador{margin:0 0 16px}
.cl-lado--grabas[data-grabas="no"] .cl-tiene,.cl-lado--grabas[data-grabas="si"] .cl-invita{display:none}
.cl-invita{display:grid;grid-template-columns:150px minmax(0,1fr);gap:26px;align-items:center;padding:24px;border:1px solid var(--linea);border-radius:16px;background:var(--campo-fondo)}
.cl-invita__movil{position:relative;display:block;aspect-ratio:9/16;overflow:hidden;border:5px solid #111;border-radius:20px;background:#111;transform:rotate(-4deg);box-shadow:0 16px 34px rgba(0,0,0,.25)}
.cl-invita__movil img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) brightness(.6)}
.cl-invita__movil .rec{position:absolute;left:50%;bottom:14px;width:30px;height:30px;margin-left:-15px;border:4px solid #fff;animation:late 1.4s infinite}
.cl-invita h3{margin-top:10px;font-size:24px;line-height:1.02}
.cl-invita p{margin-top:10px;font-size:14.5px;line-height:1.5;color:var(--texto2)}
.cl-invita__boton{display:inline-flex;align-items:center;gap:10px;margin-top:18px}
.cl-invita__garantias{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:16px!important;font-size:10.5px!important;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--tenue)!important}
.cl-invita__garantias span::before{content:'';display:inline-block;width:9px;height:2px;margin-right:8px;vertical-align:middle;background:var(--azul)}
.cl-tiene .cl-grabs{grid-template-columns:repeat(3,minmax(0,150px));margin-top:14px}
.cl-tiene .cl-grab .img{aspect-ratio:9/16;border-radius:14px;background:#111}
.cl-tiene .cl-grab .img img{filter:brightness(.8)}
.cl-tiene .cl-grab .play{width:40px;height:40px;font-size:12px}
.cl-tiene .cl-grab--nueva{aspect-ratio:9/16;border-radius:14px}
.cl-tiene__pie{display:flex;gap:26px;margin-top:20px}
/* el punto rojo de grabar (nombre propio, para no chocar con el «rec» de la portada) */
.punto-rec{display:inline-block;width:10px;height:10px;border-radius:50%;background:#e23b3b;flex:none}
/* el móvil de la invitación, con el aspecto de la grabadora de verdad: rejilla, «Privado» arriba y el botón blanco abajo */
.cl-invita__movil{transform:rotate(-3deg)}
.cl-invita__movil img{filter:brightness(.72)}
.cl-invita__movil .rejilla{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.14) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.14) 1px,transparent 1px);background-size:33.3% 33.3%}
.cl-invita__movil em{position:absolute;right:7px;top:8px;padding:4px 7px;background:rgba(0,0,0,.62);border:1px solid rgba(255,255,255,.3);border-radius:999px;font-style:normal;font-size:7.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#fff}
.cl-invita__movil .pie{position:absolute;left:0;right:0;bottom:0;display:flex;flex-direction:column;align-items:center;gap:6px;padding:26px 0 12px;background:linear-gradient(to top,rgba(4,6,14,.85),rgba(4,6,14,0))}
.cl-invita__movil .pie b{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:#fff;border:3px solid rgba(255,255,255,.4);background-clip:padding-box}
.cl-invita__movil .pie b::before{content:'';width:15px;height:15px;border-radius:50%;background:#e0473e}
.cl-invita__movil .pie small{font-size:7.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#fff}
.cl-invita .rotulo{letter-spacing:.2em;font-size:10px}
/* el móvil de la invitación, recto */
.cl-invita__movil{transform:none}

/* ================= BIBLIOTECA ================= */
.bib-sigue{height:min(52vh,470px)}
.bib-sigue__barra{display:block;width:min(100%,420px);height:4px;margin-top:22px;border-radius:2px;background:rgba(255,255,255,.2)}
.bib-sigue__barra i{display:block;height:100%;border-radius:2px;background:var(--azul)}
.bib-sigue__quedan{display:block;margin-top:10px;font-size:12.5px;color:#cfcfcf}
.bib-pestanas{display:grid;grid-template-columns:repeat(4,1fr);margin-top:40px;border:1px solid var(--linea);border-radius:var(--grande) var(--grande) 0 0;overflow:hidden}
.bib-pestanas a{padding:16px 22px;cursor:pointer;color:var(--tenue);transition:background .3s,color .3s}
.bib-pestanas a+a{border-left:1px solid var(--linea)}
.bib-pestanas a:hover{background:var(--hover)}
.bib-pestanas strong{display:block;font-family:var(--titular);font-weight:700;font-size:15px;text-transform:uppercase}
.bib-pestanas small{display:block;margin-top:4px;font-size:12.5px}
.bib-pestanas a.on{color:var(--texto2);background:var(--campo-fondo);box-shadow:inset 0 3px 0 var(--azul)}
.bib-pestanas a.on strong{color:var(--texto)}
.bib-filtros{position:static;padding-top:6px}
.bib[data-ver="series"] .bib-filtros .filtro,.bib[data-ver="historial"] .bib-filtros .filtro{visibility:hidden}
.bib-vista{display:none;margin-top:30px}
.bib[data-ver="sueltas"] .bib-vista--sueltas,.bib[data-ver="series"] .bib-vista--series,.bib[data-ver="favoritas"] .bib-vista--favoritas,.bib[data-ver="historial"] .bib-vista--historial{display:block}
.bib-rejilla{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:40px 22px}
.bib-clase,.bib-serie{display:block}
.bib-clase[hidden]{display:none}
.bib-clase .img{aspect-ratio:16/9;border-radius:12px}
.bib-clase .img img,.bib-serie .img img{transition:transform .6s}
.bib-clase:hover .img img,.bib-serie:hover .img img{transform:scale(1.04)}
.bib-clase .img::after,.bib-serie .img::after{content:'';position:absolute;left:0;right:0;top:0;height:3px;z-index:3;background:var(--azul);transform:scaleX(0);transform-origin:left;transition:transform .35s}
.bib-clase:hover .img::after,.bib-serie:hover .img::after{transform:scaleX(1)}
.bib-muestra{position:absolute;z-index:2;left:10px;top:10px;padding:5px 9px;background:#fff;color:#000;border-radius:3px;font-size:9px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
.bib-clase__nivel{display:block;margin-top:14px;font-size:10px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--azul-claro)}
.bib-clase strong,.bib-serie strong{display:block;margin-top:8px;font-size:15.5px;font-weight:600;line-height:1.3}
.bib-clase__con{display:block;margin-top:6px;font-size:12.5px;line-height:1.45;color:var(--tenue)}
.bib-clase__curso{display:block;margin-top:10px;padding-top:9px;border-top:1px solid var(--linea);font-size:12px;font-weight:600;color:var(--azul-claro)}
.bib-rejilla--series{grid-template-columns:repeat(5,minmax(0,1fr))}
.bib-serie .img{aspect-ratio:3/4;border-radius:12px}
.bib-serie__n{position:absolute;z-index:2;right:10px;bottom:10px;padding:5px 9px;background:rgba(0,0,0,.75);color:#fff;border-radius:3px;font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.bib-historial{list-style:none;border-top:1px solid var(--linea)}
.bib-historial a{display:grid;grid-template-columns:150px minmax(0,1fr) 130px 200px;gap:24px;align-items:center;padding:14px 0;border-bottom:1px solid var(--linea)}
.bib-historial a:hover{background:var(--hover)}
.bib-historial .img{aspect-ratio:16/9;border-radius:8px}
.bib-historial strong{display:block;font-size:15px;font-weight:600}
.bib-historial small{display:block;margin-top:5px;font-size:12px;color:var(--tenue)}
.bib-historial__cuando{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--tenue)}
.bib-historial__avance{display:flex;align-items:center;gap:12px}
.bib-historial__avance i{display:block;flex:1;height:4px;border-radius:2px;background:var(--azul);max-width:120px}
.bib-historial__avance small{margin:0;white-space:nowrap}
.bib .cur-cabeza h1{font-size:clamp(50px,7.6vw,128px)}
.bib .cur-lista{padding-top:40px}
.bib-pestanas{margin-top:0}
/* historial: la barra de avance, sobre su pista */
.bib-historial__avance{position:relative}
.bib-historial__avance::before{content:"";position:absolute;left:0;top:50%;width:120px;height:4px;margin-top:-2px;border-radius:2px;background:var(--linea)}
.bib-historial__avance i{position:relative;flex:none;max-width:120px}
.bib-historial__avance small{margin-left:auto}

/* ================= ZONA DE USUARIO: armazón (barra + menú lateral) e Inicio ================= */
body[data-pagina="zona"] .nav,body[data-pagina="zona"] .pie-web,body[data-pagina="biblioteca"] .nav,body[data-pagina="biblioteca"] .pie-web,body[data-pagina="zprofesor"] .nav,body[data-pagina="zprofesor"] .pie-web,body[data-pagina="miscursos"] .nav,body[data-pagina="miscursos"] .pie-web,body[data-pagina="favoritos"] .nav,body[data-pagina="favoritos"] .pie-web,body[data-pagina="historial"] .nav,body[data-pagina="historial"] .pie-web,body[data-pagina="grabaciones"] .nav,body[data-pagina="grabaciones"] .pie-web,body[data-pagina="zmensajes"] .nav,body[data-pagina="zmensajes"] .pie-web{display:none}
.zn{background:#eeece6}
.zn-barra{position:sticky;top:42px;z-index:40;display:flex;align-items:center;gap:28px;height:68px;padding:0 28px;background:#000;color:#fff;border-bottom:1px solid rgba(255,255,255,.12)}
.zn-barra .nav__logo{flex:0 0 220px}
.zn-buscar{display:flex;align-items:center;gap:12px;flex:0 1 460px;padding:11px 16px;border:1px solid rgba(255,255,255,.18);border-radius:var(--campo);background:#0d0d10;font-size:12.5px;color:#8d8d94}
.zn-buscar svg{width:16px;height:16px}
.zn-barra__der{display:flex;align-items:center;gap:22px;margin-left:auto}
.zn-icono{position:relative;display:grid;place-items:center;width:40px;height:40px;border:1px solid rgba(255,255,255,.2);border-radius:50%}
.zn-icono svg{width:18px;height:18px}
.zn-icono b{position:absolute;right:-3px;top:-3px;min-width:18px;height:18px;padding:0 4px;border-radius:9px;background:var(--azul);font-size:10px;line-height:18px;text-align:center}
.zn-yo{position:relative;display:flex;align-items:center;gap:12px;cursor:pointer}
.zn-yo__foto{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--azul);font-family:var(--titular);font-weight:700}
.zn-yo strong{display:block;font-size:13.5px;font-weight:600}
.zn-yo small{display:block;margin-top:2px;font-size:11px;color:#9c9c9c}
.zn-yo i{font-style:normal;font-size:11px;color:#9c9c9c}
.zn-yo__menu{position:absolute;right:0;top:calc(100% + 12px);display:none;flex-direction:column;min-width:210px;padding:8px;background:#121216;border:1px solid rgba(255,255,255,.16);border-radius:12px;box-shadow:0 20px 40px rgba(0,0,0,.5)}
.zn-yo:hover .zn-yo__menu{display:flex}
.zn-yo__menu a{padding:10px 12px;border-radius:8px;font-size:13.5px}
.zn-yo__menu a:hover{background:rgba(255,255,255,.07)}
.zn-yo__menu .salir{margin-top:6px;border-top:1px solid rgba(255,255,255,.12);border-radius:0 0 8px 8px;color:#9c9c9c}
.zn-cuerpo{display:grid;grid-template-columns:248px minmax(0,1fr);align-items:start}
.zn-menu{position:sticky;top:110px;display:flex;flex-direction:column;height:calc(100vh - 110px);padding:26px 14px 18px;background:#000;color:#fff;overflow-y:auto}
.zn-menu .rotulo{margin:6px 14px 10px;font-size:9.5px;color:#7d7d86}
.zn-menu .rotulo~.rotulo{margin-top:26px}
.zn-menu a{display:flex;align-items:center;gap:13px;padding:11px 14px;border-radius:10px;font-size:14px;font-weight:500;color:#cfcfcf;cursor:pointer;transition:background .2s,color .2s}
.zn-menu a:hover{background:rgba(255,255,255,.06);color:#fff}
.zn-menu a.on{background:rgba(11,121,251,.16);color:#fff;box-shadow:inset 3px 0 0 var(--azul)}
.zn-menu a svg{flex:none;width:19px;height:19px}
.zn-menu a.on svg{color:#6fb1ff}
.zn-menu a em,.zn-menu a b{margin-left:auto;padding:2px 7px;border-radius:3px;font-style:normal;font-size:9px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;background:var(--azul);color:#fff}
.zn-menu a b{border-radius:9px;letter-spacing:0;font-size:10px}
.zn-menu__plan{display:block;margin-top:auto;padding:16px;border:1px solid rgba(255,255,255,.16);border-radius:12px;box-shadow:inset 0 2px 0 var(--azul)}
.zn-menu__plan small{display:block;font-size:9.5px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:#7d7d86}
.zn-menu__plan strong{display:block;margin-top:6px;font-family:var(--titular);font-weight:700;font-size:14px;text-transform:uppercase}
.zn-menu__plan span{display:block;margin-top:4px;font-size:11.5px;color:#9c9c9c}
.zn-contenido{min-width:0;padding:22px 28px 70px}
/* bienvenida */
.zn-arriba{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:18px;align-items:stretch}
.zn-sigue{position:relative;display:block;min-height:470px;overflow:hidden;border-radius:18px;background:#000;color:#fff}
.zn-sigue__fondo{position:absolute;top:0;bottom:0;right:0;width:68%}
.zn-sigue__fondo video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.zn-sigue__fondo::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#000 0%,rgba(0,0,0,.85) 16%,rgba(0,0,0,.25) 46%,rgba(0,0,0,0) 66%),linear-gradient(0deg,rgba(0,0,0,.5),transparent 35%)}
.zn-sigue__texto{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;justify-content:center;width:60%;padding:34px 40px}
.zn-sigue__texto .rotulo{color:#6fb1ff}
.zn-sigue__ceja{display:block;margin-top:22px;font-size:11px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:#cfcfcf}
.zn-sigue strong{display:block;margin-top:10px;font-family:var(--titular);font-weight:700;font-size:clamp(26px,3vw,48px);line-height:.95;text-transform:uppercase}
.zn-sigue .cur-destacado__nivel .nv i{border-color:rgba(255,255,255,.5)}
.zn-lado{display:flex;flex-direction:column;gap:18px}
.zn-caja{display:block;flex:1;padding:20px 22px;border:1px solid var(--linea);border-radius:16px;background:var(--campo-fondo)}
.zn-caja__curso{display:grid;grid-template-columns:86px minmax(0,1fr);gap:16px;align-items:center;margin:12px 0 14px}
.zn-caja__curso .img{aspect-ratio:4/5;border-radius:8px}
.zn-caja__curso strong{display:block;font-family:var(--titular);font-weight:700;font-size:16px;line-height:1.05;text-transform:uppercase}
.zn-caja__curso small{display:block;margin:6px 0 10px;font-size:12px;color:var(--tenue)}
.zn-caja .fc-tablero__barra i{background:var(--linea)}
.zn-caja .fc-tablero__barra i.on{background:var(--azul)}
.zn-caja .fc-tablero__barra i.ahora{background:var(--texto)}
.zn-agenda{list-style:none;margin-top:10px}
.zn-agenda li{display:grid;grid-template-columns:50px minmax(0,1fr);gap:14px;align-items:center;padding:10px 0;border-top:1px solid var(--linea2)}
.zn-agenda b{font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;text-align:center;color:var(--tenue);line-height:1.1}
.zn-agenda b span{font-family:var(--titular);font-size:22px;letter-spacing:0;color:var(--azul)}
.zn-agenda strong{display:block;font-size:13.5px;font-weight:600;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.zn-agenda small{display:block;margin-top:3px;font-size:11.5px;color:var(--tenue)}
.zn-caja__acciones{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px}
.zn-caja__acciones .btn{display:inline-flex;align-items:center;gap:8px;padding:11px 14px}
.zn-caja__acciones svg{width:15px;height:15px}
.zn-cifras{display:grid;grid-template-columns:repeat(4,1fr);margin-top:18px;border:1px solid var(--linea);border-radius:16px;background:var(--campo-fondo)}
.zn-cifras div{padding:18px 22px;border-left:1px solid var(--linea)}
.zn-cifras div:first-child{border-left:0}
.zn-cifras dt{font-family:var(--titular);font-weight:700;font-size:30px;line-height:1}
.zn-cifras dd{margin:7px 0 0;font-size:10px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--tenue)}
/* filas */
.zn-fila{margin-top:44px}
.zn-fila__cabeza{display:flex;align-items:baseline;gap:18px}
.zn-fila__cabeza h2{margin:0;font-size:24px}
.zn-fila__cabeza .enlace{margin-left:auto}
.zn-carril{margin:18px -28px 0;padding-left:28px}
.zn-carril .carril__pista{gap:16px;padding-right:28px}
.zn-carril .carril__flecha--atras{left:10px}
.zn-carril .carril__flecha{right:10px}
.zn-clase{flex:0 0 300px;display:block;scroll-snap-align:start}
.zn-clase .img{aspect-ratio:16/9;border-radius:12px}
.zn-clase__nivel{display:block;margin-top:12px;font-size:9.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--azul-claro)}
.zn-clase strong{display:block;margin-top:7px;font-size:14.5px;font-weight:600;line-height:1.3}
.zn-clase small{display:block;margin-top:4px;font-size:12px;color:var(--tenue)}
.zn-top{position:absolute;z-index:2;left:10px;bottom:6px;font-family:var(--titular);font-weight:700;font-size:64px;line-height:.8;color:#fff;-webkit-text-stroke:2px #000;text-shadow:0 4px 18px rgba(0,0,0,.5)}
.zn-curso{flex:0 0 250px;display:block;scroll-snap-align:start}
.zn-curso .img{aspect-ratio:4/5;border-radius:12px}
.zn-curso .img::before{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(to top,rgba(0,0,0,.92),rgba(0,0,0,.15) 50%,transparent 66%);pointer-events:none}
.zn-curso__texto{position:absolute;z-index:2;left:16px;right:16px;bottom:16px;color:#fff}
.zn-curso__texto .rotulo{font-size:9px;letter-spacing:.18em;color:#6fb1ff}
.zn-curso__texto .nv i{border-color:rgba(255,255,255,.5)}
.zn-curso__texto strong{display:block;margin-top:8px;font-family:var(--titular);font-weight:700;font-size:17px;line-height:1.05;text-transform:uppercase}
.zn-curso__texto small{display:block;margin-top:6px;font-size:11.5px;color:#d0d0d0}
.zn-serie{flex:0 0 200px;display:block;scroll-snap-align:start}
.zn-serie .img{aspect-ratio:9/16;border-radius:12px}
.zn-serie strong{display:block;margin-top:10px;font-size:13.5px;font-weight:600}
.zn-barra .nav__logo{flex:none;margin-right:110px}
.zn-sigue__texto .bib-sigue__barra{flex:none;height:4px}
.zn-menu a{white-space:nowrap}
.zn-sigue strong{font-size:clamp(24px,2.6vw,42px)}
/* LAS PROPORCIONES DE LAS IMÁGENES, en toda la web: las de curso son 515×730 y los carteles de serie 383×563 */
.zn-curso .img,.cur-tarjeta .img,.cartel--foto .img,.fc-siguen .cur-tarjeta .img{aspect-ratio:515/730}
.zn-serie .img,.bib-serie .img,.cartel--serie .img,.cartel:not(.cartel--foto) .img{aspect-ratio:383/563}
.zn-curso{flex-basis:240px}
.zn-serie{flex-basis:210px}
.zn-curso__chapa{position:absolute;z-index:2;left:12px;top:12px;padding:5px 9px;background:#fff;color:#000;border-radius:3px;font-size:9px;font-weight:700;letter-spacing:.18em;text-transform:uppercase}
/* tarjetas de clase: agendar, junto al corazón (y el sonido, debajo) */
.agendar{position:absolute;z-index:3;right:12px;top:52px;width:34px;height:34px;display:grid;place-items:center;background:rgba(0,0,0,.6);color:#fff;border-radius:var(--boton);opacity:0;transition:opacity .25s,background .25s;cursor:pointer}
.agendar svg{width:17px;height:17px}
.agendar:hover{background:var(--azul)}
a:hover>.img .agendar{opacity:1}
.img:has(.agendar) .sonido{top:92px}
/* zona de usuario: menú plegable a solo iconos */
.zn-plegar{display:flex;flex-direction:column;justify-content:center;gap:4px;width:40px;height:40px;padding:0 10px;border-radius:var(--boton);cursor:pointer;flex:none}
.zn-plegar:hover{background:rgba(255,255,255,.08)}
.zn-plegar i{display:block;height:2px;border-radius:1px;background:#fff;transition:transform .3s,width .3s}
.zn-plegar i:nth-child(2){width:70%}
.zn.plegado .zn-plegar i:nth-child(2){width:100%}
.zn-cuerpo{transition:grid-template-columns .3s}
.zn.plegado .zn-cuerpo{grid-template-columns:76px minmax(0,1fr)}
.zn.plegado .zn-menu{padding-left:12px;padding-right:12px;overflow:visible}
.zn.plegado .zn-menu a{position:relative;justify-content:center;padding:12px 0}
.zn.plegado .zn-menu a span{display:none}
.zn.plegado .zn-menu a em{display:none}
.zn.plegado .zn-menu a b{position:absolute;right:4px;top:4px;margin:0;min-width:16px;padding:0 4px;font-size:9px;line-height:16px}
.zn.plegado .zn-menu .rotulo{visibility:hidden;height:0;margin:10px 0}
.zn.plegado .zn-menu__plan{display:none}
.zn.plegado .zn-menu a svg{width:21px;height:21px}
/* al plegado, el nombre sale como etiqueta al pasar el ratón */
.zn.plegado .zn-menu a:hover::after{content:attr(title);position:absolute;left:calc(100% + 12px);top:50%;transform:translateY(-50%);padding:7px 11px;background:#121216;border:1px solid rgba(255,255,255,.16);border-radius:8px;font-size:12.5px;white-space:nowrap;z-index:50}
.zn-menu .zn-menu__plan a.zn-menu__cambiar{display:inline-block;margin-top:12px;padding:0 0 3px;border-radius:0;border-bottom:1px solid var(--azul);font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#fff;background:none;box-shadow:none}
.zn-menu .zn-menu__plan a.zn-menu__cambiar:hover{color:#6fb1ff}
/* «cambiar tu suscripción»: una frase discreta, no un botón */
.zn-menu .zn-menu__plan a.zn-menu__cambiar{margin-top:8px;padding:0;border:0;font-size:11.5px;font-weight:400;letter-spacing:0;text-transform:none;color:#7d7d86;text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(255,255,255,.25)}
.zn-menu .zn-menu__plan a.zn-menu__cambiar:hover{color:#cfcfcf}
/* tarjetas de curso y serie, más grandes (misma proporción) */
.zn-curso{flex-basis:300px}
.zn-serie{flex-basis:262px}
/* curso destacado: el sitio de dos tarjetas, con su vídeo */
.zn-curso--prota{flex-basis:616px;position:relative}
.zn-curso--prota .img{aspect-ratio:auto;height:100%;min-height:425px}
.zn-curso--prota .img video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:1}
.zn-curso--prota .img::before{background:linear-gradient(90deg,rgba(0,0,0,.9) 0%,rgba(0,0,0,.55) 45%,rgba(0,0,0,0) 75%),linear-gradient(0deg,rgba(0,0,0,.6),transparent 40%)}
.zn-curso--prota .zn-curso__texto{left:28px;right:40%;bottom:28px}
.zn-curso--prota .zn-curso__texto .rotulo{color:#6fb1ff;font-size:10px}
.zn-curso--prota strong{font-size:30px;line-height:.95}
.zn-curso--prota small{margin-top:12px;font-size:12px}
.zn-curso--prota .btn{margin-top:18px;padding:12px 20px}
.zn-carril--cursos .carril__pista{align-items:stretch}
/* estrellas: media de la comunidad o tu nota */
.estrellas{display:flex;align-items:center;gap:8px;margin-top:8px}
.estrellas b{position:relative;display:inline-block;font-size:14px;letter-spacing:2px;line-height:1;color:var(--linea)}
.estrellas b::before{content:'★★★★★'}
.estrellas b::after{content:'★★★★★';position:absolute;left:0;top:0;width:calc(var(--n) / 5 * 100%);overflow:hidden;color:#f5b301;white-space:nowrap}
.estrellas em{font-style:normal;font-size:13px;font-weight:700}
.estrellas small{margin:0!important;font-size:11.5px;color:var(--tenue)}
.zn-quien{display:inline-flex;margin-left:6px;border:1px solid var(--linea);border-radius:999px;padding:3px}
.zn-quien a{padding:6px 14px;border-radius:999px;font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--tenue);cursor:pointer}
.zn-quien a.on{background:var(--texto);color:var(--fondo)}
.zn-votadas[data-quien="comunidad"] .zn-carril--ti,.zn-votadas[data-quien="ti"] .zn-carril--comunidad{display:none}
/* valorar la clase */
.cl-valora{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:22px;padding:14px 20px;border:1px solid var(--linea);border-radius:14px;background:var(--campo-fondo)}
.cl-valora strong{display:block;font-size:15px;font-weight:600}
.cl-valora small{display:block;margin-top:3px;font-size:12.5px;color:var(--tenue)}
.cl-valora__estrellas{display:flex;gap:4px}
.cl-valora__estrellas i{font-style:normal;font-size:30px;line-height:1;color:var(--linea);cursor:pointer;transition:color .15s,transform .15s}
.cl-valora__estrellas i.on{color:#f5b301}
.cl-valora__estrellas i:hover{transform:scale(1.15)}
.cl-valora.hecho small{color:var(--azul-claro)}

/* ================= POR CANCIÓN: discos de vinilo que asoman de la funda ================= */
.zn-canciones__cuenta{margin-left:auto;font-size:10px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--tenue)}
.zn-cancion{flex:0 0 236px;display:block;cursor:pointer;scroll-snap-align:start}
.zn-cancion__funda{position:relative;display:block;width:190px;aspect-ratio:1}
.zn-cancion__funda img{position:relative;z-index:1;display:block;width:100%;height:100%;object-fit:cover;border-radius:5px;box-shadow:0 10px 24px rgba(0,0,0,.28);transition:transform .4s}
.vinilo{position:absolute;top:4%;left:4%;width:92%;height:92%;border-radius:50%;background:var(--tapa) center/36% 36% no-repeat,#111;transform:translateX(12%);transition:transform .6s cubic-bezier(.2,.7,.2,1);box-shadow:0 8px 20px rgba(0,0,0,.35)}
.vinilo::before{content:'';position:absolute;inset:0;border-radius:50%;background:repeating-radial-gradient(circle,#111 0 2px,#1d1d1f 2px 4px);-webkit-mask:radial-gradient(circle,transparent 0 17.5%,#000 18%);mask:radial-gradient(circle,transparent 0 17.5%,#000 18%)}
.vinilo::after{content:'';position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle,#eeece6 0 2.4%,transparent 2.8%),conic-gradient(from 30deg,transparent,rgba(255,255,255,.16) 9%,transparent 20%,transparent 50%,rgba(255,255,255,.12) 59%,transparent 70%)}
.zn-cancion:hover .vinilo,.zn-cancion__funda--grande .vinilo{transform:translateX(44%)}
.zn-cancion:hover .vinilo::before,.zn-cancion__funda--grande .vinilo{animation:gira 3.5s linear infinite}
.zn-cancion:hover .vinilo{animation:gira 3.5s linear .5s infinite}
@keyframes gira{to{rotate:360deg}}
.zn-cancion:hover img{transform:translateY(-4px)}
.zn-cancion strong{display:block;margin-top:14px;max-width:190px;font-size:14.5px;font-weight:600;line-height:1.25}
.zn-cancion small{display:block;margin-top:3px;max-width:190px;font-size:12.5px;color:var(--tenue);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.zn-cancion em{display:block;margin-top:7px;font-style:normal;font-size:9.5px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--azul-claro)}
.zn-disco{position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:30px;background:rgba(0,0,0,.72);backdrop-filter:blur(6px)}
.zn-disco[hidden]{display:none}
.zn-disco__caja{position:relative;width:min(1080px,100%);max-height:calc(100vh - 60px);overflow-y:auto;padding:34px 36px 38px;border-radius:6px;background:#0b0b0e;color:#fff;border:1px solid rgba(255,255,255,.12);box-shadow:inset 0 2px 0 var(--azul),0 40px 80px rgba(0,0,0,.6)}
.zn-disco__cerrar{position:absolute;right:16px;top:14px;width:40px;height:40px;border:1px solid rgba(255,255,255,.2);border-radius:50%;background:none;color:#fff;font-size:22px;line-height:1;cursor:pointer}
.zn-disco__cabeza{display:flex;align-items:center;gap:40px}
.zn-cancion__funda--grande{flex:none;width:200px;margin-right:90px}
.zn-disco__cabeza .rotulo{color:#6fb1ff}
.zn-disco__cabeza strong{display:block;margin-top:10px;font-family:var(--titular);font-weight:700;font-size:clamp(26px,3vw,42px);line-height:.95;text-transform:uppercase}
.zn-disco__cabeza small{display:block;margin-top:8px;font-size:16px;color:#cfcfcf}
.zn-disco__cabeza em{display:block;margin-top:16px;font-style:normal;font-size:10px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:#9c9c9c}
.zn-disco__clases{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px 18px;margin-top:34px;padding-top:26px;border-top:1px solid rgba(255,255,255,.12)}
.zn-disco__clases .zn-clase small{color:#9c9c9c}
body.sin-scroll{overflow:hidden}

/* ================= BIBLIOTECA dentro de la zona ================= */
.zb-cabeza{display:flex;align-items:baseline;gap:30px;flex-wrap:wrap;padding:14px 0 4px}
.zb-cabeza h1{margin:0;font-size:clamp(34px,4vw,56px)}
.zb-cabeza .cur-cabeza__dato{margin:0}
.zb-pestanas{display:flex;gap:6px;margin-top:22px;border-bottom:1px solid var(--linea)}
.zb-pestanas a{position:relative;padding:14px 20px;font-family:var(--titular);font-weight:700;font-size:14px;text-transform:uppercase;color:var(--tenue);cursor:pointer;transition:color .2s}
.zb-pestanas a b{margin-left:6px;font-family:var(--cuerpo,inherit);font-size:11px;font-weight:600;color:var(--tenue)}
.zb-pestanas a:hover{color:var(--texto)}
.zb-pestanas a.on{color:var(--texto)}
.zb-pestanas a.on::after{content:'';position:absolute;left:0;right:0;bottom:-1px;height:3px;background:var(--azul)}
.zb-vista{display:none;margin-top:24px}
.zb[data-ver="clases"] .zb-vista--clases,.zb[data-ver="cursos"] .zb-vista--cursos,.zb[data-ver="series"] .zb-vista--series,.zb[data-ver="profesores"] .zb-vista--profesores{display:block}
.zb-filtros{display:flex;flex-direction:column;gap:12px;padding:18px 20px;border:1px solid var(--linea);border-radius:6px;background:var(--campo-fondo)}
.zb-fila{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.zb-fila>.rotulo{flex:0 0 58px;margin:0;font-size:9.5px}
.zb-fila>.zb-sep{flex:none;margin-left:22px}
.zb-chips{display:flex;flex-wrap:wrap;gap:6px}
.zb-chips a{display:inline-flex;align-items:center;gap:7px;padding:7px 13px;border:1px solid var(--linea);border-radius:5px;font-size:12.5px;font-weight:500;color:var(--texto2);cursor:pointer;transition:border-color .2s,background .2s,color .2s}
.zb-chips a:hover{border-color:var(--texto)}
.zb-chips a.on{background:var(--texto);border-color:var(--texto);color:var(--fondo)}
.zb-chips a.on .nv i{border-color:currentColor}
.zb-chips a.on .nv i.on{background:#6fb1ff;border-color:#6fb1ff}
.zb-fila--abajo{padding-top:12px;border-top:1px solid var(--linea2)}
.zb-select{display:inline-flex;align-items:center;gap:8px;padding:0 4px 0 12px;border:1px solid var(--linea);border-radius:5px;font-size:12.5px}
.zb-select span{font-size:9.5px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--tenue)}
.zb-select select{padding:8px 6px;border:0;background:none;font:inherit;font-weight:600;color:var(--texto);cursor:pointer;outline:0}
.zb-select.on{border-color:var(--azul);box-shadow:inset 0 0 0 1px var(--azul)}
.zb-interruptor{display:inline-flex;align-items:center;gap:10px;margin-left:6px;font-size:12.5px;cursor:pointer}
.zb-interruptor input{display:none}
.zb-interruptor i{position:relative;width:34px;height:20px;border-radius:10px;background:var(--linea);transition:background .2s}
.zb-interruptor i::after{content:'';position:absolute;left:3px;top:3px;width:14px;height:14px;border-radius:50%;background:#fff;transition:transform .2s}
.zb-interruptor input:checked+i{background:var(--azul)}
.zb-interruptor input:checked+i::after{transform:translateX(14px)}
.zb-cuenta{display:flex;align-items:center;gap:16px;margin:0 0 0 auto;font-size:12.5px;color:var(--tenue)}
.zb-cuenta b{font-family:var(--titular);font-size:18px;color:var(--texto)}
.zb-rejilla{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:34px 18px;margin-top:26px}
.zb-clase{flex:none}
.zb-clase[hidden]{display:none}
.zb-clase small{display:flex;align-items:center;gap:8px}
.zb-tipo{flex:none;padding:2px 6px;border:1px solid var(--linea);border-radius:3px;font-style:normal;font-size:9px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--texto2)}

.zb-visto{position:absolute;z-index:2;left:10px;top:10px;display:block;margin:0;padding:4px 8px;border-radius:3px;background:rgba(0,0,0,.72);color:#7fe3a5;font-size:9.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.zb-avance{position:absolute;z-index:2;left:0;right:0;bottom:0;height:4px;background:rgba(255,255,255,.25)}
.zb-avance i{display:block;height:100%;background:var(--azul)}
.zb-mas{display:flex;flex-direction:column;align-items:center;gap:12px;margin:46px 0 10px;font-size:12.5px;color:var(--tenue)}
.zb-mas__barra{display:block;width:220px;height:3px;border-radius:2px;background:var(--linea)}
.zb-mas__barra i{display:block;height:100%;border-radius:2px;background:var(--azul)}
.zb-rejilla--cursos{grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}
.zb-rejilla--series{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
.zb-rejilla--cursos .zn-curso,.zb-rejilla--series .zn-serie{flex:none}
.zb-rejilla--profes{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.zb-profe{display:block}
.zb-profe .img{display:block;aspect-ratio:4/5;overflow:hidden;border-radius:6px;background:#111}
.zb-profe img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.zb-profe:hover img{transform:scale(1.04)}
.zb-profe strong{display:block;margin-top:12px;font-family:var(--titular);font-weight:700;font-size:16px;text-transform:uppercase}
.zb-profe small{display:block;margin-top:5px;font-size:12.5px;line-height:1.4;color:var(--tenue);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.zb-profe em{display:block;margin-top:8px;font-style:normal;font-size:10px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--azul-claro)}
.zb-filtros .zb-interruptor{letter-spacing:0;text-transform:none;font-weight:500;font-size:12.5px;color:var(--texto2)}

/* ===== biblioteca: barra fina + ventana de filtros ===== */
.zb-barra{display:flex;align-items:center;gap:16px;padding:10px 0;border-bottom:1px solid var(--linea2)}
.zb-abrir{position:relative;flex:none;display:inline-flex;align-items:center;gap:10px;padding:11px 18px;border:1px solid var(--texto);border-radius:5px;background:var(--texto);color:var(--fondo);font:inherit;font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;cursor:pointer;transition:background .2s,border-color .2s}
.zb-abrir svg{width:17px;height:17px}
.zb-abrir:hover,.zb-abrir.on{background:var(--azul);border-color:var(--azul);color:#fff}
.zb-abrir b{display:grid;place-items:center;min-width:20px;height:20px;padding:0 5px;border-radius:10px;background:#fff;color:var(--azul);font-size:11px;letter-spacing:0}
.zb-buscar{flex:0 1 320px;display:flex;align-items:center;gap:10px;padding:0 14px;border:1px solid var(--linea);border-radius:5px;background:var(--campo-fondo);transition:border-color .2s,box-shadow .2s}
.zb-buscar:focus-within{border-color:var(--azul);box-shadow:0 0 0 3px rgba(11,121,251,.15)}
.zb-buscar svg{flex:none;width:16px;height:16px;color:var(--tenue)}
.zb-buscar input{flex:1;min-width:0;padding:11px 0;border:0;background:none;font:inherit;font-size:13px;color:var(--texto);outline:0}
.zb-vista--clases .zb-rejilla{grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 22px}
.zb-barra__rapido{flex:1;min-width:0;overflow-x:auto;scrollbar-width:none;-webkit-mask:linear-gradient(90deg,#000 92%,transparent)}
.zb-barra__rapido .zb-chips{flex-wrap:nowrap}
.zb-barra__rapido .zb-chips a{white-space:nowrap;border-color:transparent;background:none}
.zb-barra__rapido .zb-chips a:hover{border-color:var(--linea)}
.zb-barra__rapido .zb-chips a.on{background:var(--texto);color:var(--fondo)}
.zb-barra__der{flex:none;display:flex;align-items:center;gap:16px}
.zb-barra .zb-cuenta{margin:0}
.zb-activos{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:14px}
.zb-activos[hidden]{display:none}
.zb-activos a[data-quitar]{display:inline-flex;align-items:center;gap:8px;padding:6px 8px 6px 12px;border-radius:5px;background:rgba(11,121,251,.12);color:var(--azul-claro);font-size:12.5px;font-weight:600;cursor:pointer}
.zb-activos a[data-quitar] i{font-style:normal;display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:rgba(11,121,251,.18)}
.zb-activos a[data-quitar]:hover i{background:var(--azul);color:#fff}
.zb-activos .enlace{margin-left:6px;font-size:10px}
/* la ventana */
.zb-ventana{position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:30px;background:rgba(0,0,0,.62);backdrop-filter:blur(8px);animation:zbFondo .25s ease}
.zb-ventana[hidden]{display:none}
.zb-ventana__caja{display:flex;flex-direction:column;width:min(760px,100%);max-height:calc(100vh - 60px);border-radius:8px;background:var(--fondo);color:var(--texto);box-shadow:inset 0 3px 0 var(--azul),0 40px 90px rgba(0,0,0,.45);overflow:hidden;animation:zbSube .35s cubic-bezier(.2,.8,.2,1)}
@keyframes zbFondo{from{opacity:0}}
@keyframes zbSube{from{opacity:0;transform:translateY(24px) scale(.98)}}
.zb-ventana__cabeza{display:flex;align-items:baseline;gap:16px;padding:26px 30px 18px;border-bottom:1px solid var(--linea)}
.zb-ventana__cabeza h2{margin:0;font-size:28px}
.zb-ventana__cerrar{margin-left:auto;align-self:center;width:38px;height:38px;border:1px solid var(--linea);border-radius:50%;background:none;color:var(--texto);font-size:21px;line-height:1;cursor:pointer}
.zb-ventana__cerrar:hover{border-color:var(--texto)}
.zb-ventana__cuerpo{flex:1;overflow-y:auto;padding:6px 30px 26px}
.zb-ventana__rotulo{margin:24px 0 12px;font-size:10px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--tenue)}
.zb-cartas{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.zb-cartas a{display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:16px 16px 14px;border:1px solid var(--linea);border-radius:6px;background:var(--campo-fondo);cursor:pointer;transition:border-color .2s,box-shadow .2s,transform .2s}
.zb-cartas a:hover{border-color:var(--texto);transform:translateY(-2px)}
.zb-cartas a.on{border-color:var(--azul);box-shadow:inset 0 0 0 1px var(--azul),0 10px 24px rgba(11,121,251,.18);background:var(--campo-fondo);color:var(--texto)}
.zb-cartas strong{margin-top:8px;font-size:15px;font-weight:700}
.zb-cartas small{font-size:12px;color:var(--tenue)}
.zb-cartas .nv i{width:16px;height:6px}
.zb-cartas i svg{width:28px;height:28px;color:var(--azul-claro)}
.zb-cartas a.on .nv i{border-color:var(--azul)}
.zb-caras a{padding:4px 12px 4px 4px;border-radius:999px}
.zb-caras img,.zb-caras b{width:28px;height:28px;border-radius:50%;object-fit:cover}
.zb-caras b{display:grid;place-items:center;background:var(--azul);color:#fff;font-size:12px}
.zb-ventana__sinver{display:flex;margin:26px 0 0;padding:16px 18px;border:1px solid var(--linea);border-radius:6px;letter-spacing:0;text-transform:none}
.zb-ventana__sinver span strong{display:block;font-size:14px;font-weight:600}
.zb-ventana__sinver span small{display:block;margin-top:2px;font-size:12px;color:var(--tenue);font-weight:400}
.zb-ventana__pie{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 30px;border-top:1px solid var(--linea);background:var(--campo-fondo)}
.zb-ventana__ver{cursor:pointer}
.zb-ventana__ver.apagado{opacity:.45}
.zb-ventana .zb-chips a.on .nv i.on{background:var(--azul)}
.zb-abrir b[hidden]{display:none}
.zb.filtrando .zb-mas{display:none}
.zb-vista--clases .zb-rejilla{grid-template-columns:repeat(4,minmax(0,1fr));gap:36px 18px}
.zb-barra .zb-buscar{flex:0 1 460px}
.zb-barra .zb-cuenta{margin-left:auto}
.zb-barra .zb-buscar,.zb-barra .zb-abrir,.zb-barra .zb-select{height:44px;box-sizing:border-box}
.zb-barra .zb-abrir{padding-top:0;padding-bottom:0}
/* barra de la biblioteca: todo a la misma línea y la misma altura */
.zb-barra{align-items:center;gap:12px;padding:14px 0}
.zb-barra>*{margin:0!important;align-self:center}
.zb-barra .zb-buscar,.zb-barra .zb-abrir,.zb-barra .zb-select{height:46px;border-radius:6px}
.zb-barra .zb-cuenta{display:flex;align-items:baseline;gap:6px;margin-left:auto!important;margin-right:6px!important;line-height:1}
.zb-barra .zb-cuenta b{font-size:20px;line-height:1}
.zb-barra .zb-select{padding:0 8px 0 14px}

/* ===== biblioteca · cursos ===== */
.zb[data-ver="series"] .zb-abrir,.zb[data-ver="profesores"] .zb-abrir,.zb[data-ver="series"] .zb-barra .zb-select,.zb[data-ver="profesores"] .zb-barra .zb-select{display:none}
.zb[data-ver="cursos"] .zb-ventana__duracion{display:none}
.zb-vista{margin-top:28px}
.zb-rejilla{margin-top:0}
.zb-rejilla--cursos{grid-template-columns:repeat(4,minmax(0,1fr));gap:30px 18px}
.zb-curso[hidden]{display:none}
.zb-estado{position:absolute;z-index:3;left:12px;top:12px;padding:5px 10px;border-radius:4px;background:var(--azul);color:#fff;font-size:9.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.zb-estado--hecho{background:rgba(0,0,0,.72);color:#7fe3a5}
.zb-curso .zn-curso__texto strong{font-size:19px}
.zb-curso__meta{display:block;margin-top:10px;padding-top:9px;border-top:1px solid rgba(255,255,255,.18);font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#cfcfcf}
.zb-curso__barra{display:flex;gap:3px;margin-top:10px}
.zb-curso__barra i{flex:1;height:4px;border-radius:1px;background:rgba(255,255,255,.25)}
.zb-curso__barra i.on{background:var(--azul)}
.zb-curso .img::after{content:'';position:absolute;left:0;right:0;top:0;height:3px;z-index:3;background:var(--azul);transform:scaleX(0);transform-origin:left;transition:transform .35s}
.zb-curso:hover .img::after{transform:scaleX(1)}
.zb-rejilla--cursos{grid-template-columns:repeat(5,minmax(0,1fr));gap:26px 16px}
.zb-curso .zn-curso__texto{left:14px;right:14px;bottom:14px}
.zb-curso .zn-curso__texto strong{font-size:15.5px}
.zb-curso .zn-curso__texto small{font-size:11px}
.zb-curso__meta{margin-top:8px;padding-top:7px;font-size:9px}
.zb-estado{left:10px;top:10px;padding:4px 8px;font-size:8.5px}

/* ===== biblioteca · cursos: destacado y filas por estilo ===== */
.zb-opc{margin:0 0 22px}
.zb-destacado,.zb-porestilo{display:none}
.zb-vista--cursos[data-opc="b"] .zb-destacado,.zb-vista--cursos[data-opc="d"] .zb-destacado{display:grid}
.zb-vista--cursos[data-opc="c"] .zb-porestilo,.zb-vista--cursos[data-opc="d"] .zb-porestilo{display:block}
.zb-vista--cursos[data-opc="c"] .zb-rejilla--cursos,.zb-vista--cursos[data-opc="d"] .zb-rejilla--cursos{display:none}
/* buscando o filtrando, siempre la rejilla */
.zb.filtrando .zb-vista--cursos .zb-destacado,.zb.filtrando .zb-vista--cursos .zb-porestilo{display:none}
.zb.filtrando .zb-vista--cursos .zb-rejilla--cursos{display:grid}
.zb-destacado{position:relative;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);min-height:400px;margin-bottom:40px;overflow:hidden;border-radius:6px;background:#000;color:#fff}
.zb-destacado__texto{position:relative;z-index:2;display:flex;flex-direction:column;justify-content:center;padding:40px 44px}
.zb-destacado__sello{align-self:flex-start;padding:5px 10px;border-radius:4px;background:var(--azul);font-size:9.5px;font-weight:700;letter-spacing:.18em;text-transform:uppercase}
.zb-destacado strong{display:block;margin-top:18px;font-family:var(--titular);font-weight:700;font-size:clamp(28px,2.8vw,44px);line-height:.95;text-transform:uppercase}
.zb-destacado .cur-destacado__nivel{margin-top:16px}
.zb-destacado .cur-destacado__nivel .nv i{border-color:rgba(255,255,255,.5)}
.zb-destacado p{max-width:460px;margin:16px 0 0;font-size:14.5px;line-height:1.6;color:#cfcfcf}
.zb-destacado__datos{display:flex;align-items:center;gap:12px;margin-top:18px;font-size:12.5px;color:#9c9c9c}
.zb-destacado__datos b{font-family:var(--titular);font-size:16px;color:#fff}
.zb-destacado__datos i{width:1px;height:14px;background:rgba(255,255,255,.25)}
.zb-destacado .acciones{margin-top:26px}
.zb-destacado__video{position:relative}
.zb-destacado__video video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.zb-destacado__video::before{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,#000,rgba(0,0,0,.4) 22%,transparent 50%)}
.zb-estilo+.zb-estilo{margin-top:40px}
.zb-estilo .zn-fila__cabeza{margin-bottom:16px}
.zb-estilo .zn-carril{margin-top:0}
.zb-estilo .zb-curso{flex:0 0 calc((100% - 4 * 16px - 28px) / 5)}

/* ===== biblioteca · series: mismo patrón que cursos ===== */
.zb[data-ver="series"] .zb-abrir,.zb[data-ver="series"] .zb-barra .zb-select{display:inline-flex}
.zb[data-ver="series"] .zb-ventana__duracion{display:none}
.zb-vista--series .zb-destacado{display:grid}
.zb-vista--series .zb-porestilo{display:block}
.zb-vista--series .zb-rejilla--series{display:none}
.zb.filtrando .zb-vista--series .zb-destacado,.zb.filtrando .zb-vista--series .zb-porestilo{display:none}
.zb.filtrando .zb-vista--series .zb-rejilla--series{display:grid}
.zb-rejilla--series{grid-template-columns:repeat(6,minmax(0,1fr));gap:30px 16px}
.zb-serie{flex:none}
.zb-serie[hidden]{display:none}
.zb-serie .img{aspect-ratio:383/563;border-radius:8px}
.zb-serie .bib-serie__n{bottom:12px}
.zb-serie strong{margin-top:6px;font-size:14px;line-height:1.3}
.zb-serie small{display:block;margin-top:4px;font-size:11.5px;color:var(--tenue)}
.zb-serie .zn-clase__nivel{margin-top:12px;font-size:9px}
.zb-estilo .zb-serie{flex:0 0 calc((100% - 5 * 16px - 28px) / 6)}
.zb-destacado__episodio{display:flex;align-items:center;gap:14px;margin-top:20px;padding:10px;max-width:440px;border:1px solid rgba(255,255,255,.16);border-radius:6px;background:rgba(255,255,255,.05)}
.zb-destacado__episodio img{flex:none;width:112px;aspect-ratio:16/9;object-fit:cover;border-radius:4px}
.zb-destacado__episodio small{display:block;font-size:9.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#6fb1ff}
.zb-destacado__episodio b{display:block;margin-top:5px;font-size:14px;font-weight:600;line-height:1.3}
.zb-serie .zn-clase__nivel{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ===== biblioteca · profesores: mismo patrón ===== */
.zb-vista--profesores .zb-destacado{display:grid}
.zb-vista--profesores .zb-porestilo{display:block}
.zb-vista--profesores .zb-rejilla--profes{display:none}
.zb.filtrando .zb-vista--profesores .zb-destacado,.zb.filtrando .zb-vista--profesores .zb-porestilo{display:none}
.zb.filtrando .zb-vista--profesores .zb-rejilla--profes{display:grid}
.zb-rejilla--profes{grid-template-columns:repeat(6,minmax(0,1fr));gap:30px 16px}
.zb-profe{flex:none;display:block}
.zb-profe[hidden]{display:none}
.zb-profe .img{position:relative;aspect-ratio:4/5;border-radius:8px}
.zb-profe .img::before{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(to top,rgba(0,0,0,.75),transparent 40%);pointer-events:none}
.zb-profe .pf-titulo{position:absolute;z-index:2;left:10px;right:10px;bottom:10px;font-size:9px}
.zb-profe strong{margin-top:12px;font-size:14px}
.zb-profe small{font-size:11.5px}
.zb-profe em{font-size:9px}
.zb-estilo .zb-profe{flex:0 0 calc((100% - 5 * 16px - 28px) / 6)}
.zb-destacado--profe .pf-titulo{align-self:flex-start;margin-top:16px}
.zb-destacado--profe .zb-destacado__video video{object-position:center 20%}

/* ================= ZONA · ficha de profesor ================= */
.zp-elige{margin:4px 0 18px}
.zp{display:none}
.zp-todas[data-p="655"] .zp[data-p="655"],.zp-todas[data-p="57"] .zp[data-p="57"],.zp-todas[data-p="21"] .zp[data-p="21"]{display:block}
.zp-cabeza{position:relative;min-height:440px;overflow:hidden;border-radius:6px;background:#000;color:#fff;display:flex;flex-direction:column;justify-content:space-between}
.zp-cabeza__fondo{position:absolute;top:0;right:0;bottom:0;width:66%}
.zp-cabeza__fondo img{width:100%;height:100%;object-fit:cover;object-position:center 25%}
.zp-cabeza__fondo::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#000 0%,rgba(0,0,0,.75) 22%,rgba(0,0,0,.1) 60%),linear-gradient(0deg,rgba(0,0,0,.85),transparent 40%)}
.zp-cabeza__texto{position:relative;z-index:1;display:flex;flex-direction:column;align-items:flex-start;padding:30px 40px 0;max-width:640px}
.zp-volver{font-size:10.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:#cfcfcf;cursor:pointer}
.zp-volver:hover{color:#fff}
.zp-cabeza__quien{display:flex;align-items:center;gap:22px;margin-top:30px}
.zp-foto{flex:none;width:104px;height:104px;border-radius:50%;overflow:hidden;box-shadow:0 0 0 3px #000,0 0 0 5px var(--azul)}
.zp-foto img{width:100%;height:100%;object-fit:cover}
.zp-cabeza .rotulo{color:#6fb1ff}
.zp-cabeza h1{margin:8px 0 0;font-size:clamp(34px,4vw,60px);line-height:.92;color:#fff}
.zp-cabeza .pf-titulo{margin-top:20px}
.zp-cabeza .acciones{display:flex;align-items:center;gap:12px;margin-top:26px}
.zp-preguntar{display:inline-flex;align-items:center;gap:10px}
.zp-preguntar svg{width:17px;height:17px}
.zp-red{display:grid;place-items:center;width:48px;height:48px;border:1px solid rgba(255,255,255,.3);border-radius:50%;color:#fff;cursor:pointer;transition:background .2s,border-color .2s}
.zp-red:hover{background:#fff;color:#000;border-color:#fff}
.zp-red svg{width:19px;height:19px}
.zp-cifras{position:relative;z-index:1;display:grid;grid-template-columns:repeat(4,1fr);margin:34px 0 0;border-top:1px solid rgba(255,255,255,.14)}
.zp-cifras div{padding:18px 40px;border-left:1px solid rgba(255,255,255,.14)}
.zp-cifras div:first-child{border-left:0}
.zp-cifras dt{font-family:var(--titular);font-weight:700;font-size:26px;line-height:1}
.zp-cifras dd{margin:6px 0 0;font-size:10px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:#9c9c9c}
.zp-sobre{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:50px;align-items:start;margin-top:44px}
.zp-bio p:not(.rotulo){max-width:720px;margin:12px 0 0;font-size:15px;line-height:1.7;color:var(--texto2)}
.zp-bio .rotulo{margin:0 0 4px}
.zp-bio__mas{display:none}
.zp-bio.abierta .zp-bio__mas{display:block}
.zp-bio__leer{display:inline-block;margin-top:14px}
.zp-trabajos .rotulo{margin:0 0 14px}
.zp-trabajos__fila{display:flex;gap:12px}
.zp-reel{position:relative;width:150px;aspect-ratio:9/16;overflow:hidden;border-radius:10px;background:#111;cursor:pointer;box-shadow:0 10px 24px rgba(0,0,0,.18)}
.zp-reel video{width:100%;height:100%;object-fit:cover}
.zp-reel .play{position:absolute;left:50%;top:50%;display:grid;place-items:center;width:44px;height:44px;margin:-22px 0 0 -22px;border-radius:50%;background:rgba(255,255,255,.22);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.45);color:#fff;font-style:normal;font-size:14px;transition:opacity .3s}
.zp-reel.suena .play{opacity:0}
.zp-seccion{margin-top:48px}
.zp-seccion .zn-fila__cabeza{margin-bottom:18px}
.zp-rejilla{display:grid;gap:30px 16px}
.zp-rejilla--cursos{grid-template-columns:repeat(5,minmax(0,1fr))}
.zp-rejilla--series{grid-template-columns:repeat(6,minmax(0,1fr))}
.zp-rejilla--clases{grid-template-columns:repeat(4,minmax(0,1fr))}
.zp-curso,.zp-rejilla .zb-serie,.zp-rejilla .zb-clase{flex:none}
.zp-curso .zn-curso__texto strong{font-size:15.5px}
.zp-otros{display:flex;gap:22px;flex-wrap:wrap}
.zp-otro{display:flex;flex-direction:column;align-items:center;gap:10px;width:96px;text-align:center;cursor:pointer}
.zp-otro span{width:84px;height:84px;border-radius:50%;overflow:hidden;box-shadow:0 0 0 2px var(--fondo),0 0 0 3px var(--linea);transition:box-shadow .2s}
.zp-otro:hover span{box-shadow:0 0 0 2px var(--fondo),0 0 0 4px var(--azul)}
.zp-otro img{width:100%;height:100%;object-fit:cover}
.zp-otro strong{font-size:12px;font-weight:600;line-height:1.25}
.zp-rejilla--cursos{grid-template-columns:repeat(6,minmax(0,1fr))}
.zp-curso .zn-curso__texto strong{font-size:14px}

/* ===== ficha de profesor: el móvil de verdad y tres diseños ===== */
.zp-elige span+button{margin-left:0}
.zp-elige span:not(:first-child){margin-left:22px}
.zp-sobre,.zp-trabajos{margin:0}
.zp-cuerpo{display:grid;gap:0 56px;margin-top:40px}
.zp-sobre h2{margin:0 0 6px;font-size:24px}
.zp-bio p{max-width:760px;margin:12px 0 0;font-size:15px;line-height:1.75;color:var(--texto2)}
.zp-tabs{display:none}
.zp-lateral{grid-area:movil;position:relative;z-index:3}
.zp-lateral .rotulo{margin:0 0 10px;text-align:center}
.zp-sobre{grid-area:sobre}
.zp-secciones{grid-area:secs;min-width:0}
.zp-seccion:first-child{margin-top:44px}
/* el móvil: la imagen del iPhone por encima y los vídeos en su pantalla */
.zp-movil{position:relative;width:100%;max-width:340px;margin:0 auto;aspect-ratio:485/833}
.zp-movil__marco{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:2;filter:drop-shadow(0 30px 40px rgba(0,0,0,.35))}
.zp-movil__pantalla{position:absolute;left:15.7%;width:67.2%;top:17.3%;height:71%;overflow:hidden;background:#000;z-index:1}
.zp-movil__pista{display:flex;height:100%;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.zp-movil__pista video{flex:0 0 100%;width:100%;height:100%;object-fit:cover}
.zp-movil__flecha{position:absolute;z-index:3;top:50%;right:-8px;width:40px;height:40px;margin-top:-20px;border:0;border-radius:50%;background:#000;color:#fff;font-size:24px;line-height:1;cursor:pointer;box-shadow:0 6px 16px rgba(0,0,0,.3);transition:background .2s}
.zp-movil__flecha:hover{background:var(--azul)}
.zp-movil__flecha--atras{right:auto;left:-8px}
.zp-movil__puntos{display:flex;justify-content:center;gap:7px;margin:12px 0 0}
.zp-movil__puntos i{width:7px;height:7px;border-radius:50%;background:var(--linea);cursor:pointer}
.zp-movil__puntos i.on{width:20px;border-radius:4px;background:var(--azul)}
.zp-cuerpo.sin-movil{grid-template-columns:1fr!important}
/* A · escaparate: biografía y el móvil subido sobre la cabecera; debajo, todo a lo ancho */
.zp-todas[data-d="a"] .zp-cuerpo{grid-template-columns:minmax(0,1fr) 340px;grid-template-areas:"sobre movil" "secs secs"}
.zp-todas[data-d="a"] .zp-lateral{margin-top:-260px}
.zp-todas[data-d="a"] .zp-cabeza__texto{max-width:calc(100% - 420px)}
.zp-todas[data-d="a"] .zp-cifras{margin-right:400px}
.zp-todas[data-d="a"] .zp-cabeza__fondo{right:0;width:75%}
.zp-todas[data-d="a"] .zp-lateral .rotulo{color:#cfcfcf}
.zp-todas[data-d="a"] .zp-sobre{align-self:start}
/* B · columna fija: el móvil a la izquierda y te acompaña al bajar */
.zp-todas[data-d="b"] .zp-cuerpo{grid-template-columns:320px minmax(0,1fr);grid-template-areas:"movil sobre" "movil secs"}
.zp-todas[data-d="b"] .zp-lateral{align-self:start;position:sticky;top:96px}
.zp-todas[data-d="b"] .zp-rejilla--cursos{grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}
.zp-todas[data-d="b"] .zp-rejilla--series{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
.zp-todas[data-d="b"] .zp-rejilla--clases{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
/* C · por pestañas: solo se ve una cosa cada vez, el móvil fijo a la derecha */
.zp-todas[data-d="c"] .zp-cuerpo{grid-template-columns:minmax(0,1fr) 320px;grid-template-areas:"tabs movil" "panel movil"}
.zp-todas[data-d="c"] .zp-tabs{grid-area:tabs;display:flex;gap:6px;align-self:start;border-bottom:1px solid var(--linea)}
.zp-todas[data-d="c"] .zp-tabs a{position:relative;padding:14px 18px;font-family:var(--titular);font-weight:700;font-size:14px;text-transform:uppercase;color:var(--tenue);cursor:pointer}
.zp-todas[data-d="c"] .zp-tabs a b{margin-left:4px;font-size:11px;font-weight:600}
.zp-todas[data-d="c"] .zp-tabs a.on{color:var(--texto)}
.zp-todas[data-d="c"] .zp-tabs a.on::after{content:'';position:absolute;left:0;right:0;bottom:-1px;height:3px;background:var(--azul)}
.zp-todas[data-d="c"] .zp-sobre,.zp-todas[data-d="c"] .zp-secciones{grid-area:panel;margin-top:28px}
.zp-todas[data-d="c"] .zp-sobre h2,.zp-todas[data-d="c"] .zp-seccion .zn-fila__cabeza{display:none}
.zp-todas[data-d="c"] .zp-bio__mas{display:block}
.zp-todas[data-d="c"] .zp-bio__leer{display:none}
.zp-todas[data-d="c"] .zp-seccion{margin-top:0}
.zp-todas[data-d="c"] .zp:not([data-tab="sobre"]) .zp-sobre,.zp-todas[data-d="c"] .zp[data-tab="sobre"] .zp-secciones{display:none}
.zp-todas[data-d="c"] .zp-seccion[data-tab]{display:none}
.zp-todas[data-d="c"] .zp[data-tab="cursos"] .zp-seccion[data-tab="cursos"],.zp-todas[data-d="c"] .zp[data-tab="series"] .zp-seccion[data-tab="series"],.zp-todas[data-d="c"] .zp[data-tab="clases"] .zp-seccion[data-tab="clases"]{display:block}
.zp-todas[data-d="c"] .zp-seccion--otros{display:none}
.zp-todas[data-d="c"] .zp-lateral{margin-top:-200px}
.zp-todas[data-d="c"] .zp-cabeza__texto{max-width:calc(100% - 380px)}
.zp-todas[data-d="c"] .zp-cifras{margin-right:376px}
.zp-todas[data-d="c"] .zp-lateral .rotulo{color:#cfcfcf}
.zp-todas[data-d="c"] .zp-rejilla--cursos{grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}
.zp-todas[data-d="c"] .zp-rejilla--series{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
.zp-todas[data-d="c"] .zp-rejilla--clases{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.zp-todas[data-d="c"] .zp-bio{columns:1}
/* la pantalla del móvil va POR ENCIMA del dibujo (su pantalla es gris, no transparente), justo bajo las historias */
.zp-movil__pantalla{z-index:3;left:15.7%;width:67.1%;top:17.4%;height:72.1%;border-radius:0 0 3px 3px}
.zp-movil__flecha{z-index:4}
.zp .zp-sobre{display:block}
.zp-cifras dt{font-size:24px;white-space:nowrap}
.zp-movil__pantalla{height:70.4%}
.zp-todas[data-d="a"] .zp-lateral>.rotulo,.zp-todas[data-d="c"] .zp-lateral>.rotulo{visibility:hidden}

/* ================= ZONA · ficha de profesor (rehecha: un solo recorrido) ================= */
.zq-elige{margin:4px 0 18px}
.zq{display:none}
.zq-todas[data-p="655"] .zq[data-p="655"],.zq-todas[data-p="57"] .zq[data-p="57"],.zq-todas[data-p="21"] .zq[data-p="21"]{display:block}
/* quién es */
.zq-cabeza{position:relative;min-height:500px;display:flex;align-items:flex-end;overflow:hidden;border-radius:6px;background:#000;color:#fff}
.zq-cabeza__fondo{position:absolute;inset:0}
.zq-cabeza__fondo img{width:100%;height:100%;object-fit:cover;object-position:center 22%}
.zq-cabeza__fondo::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.92) 0%,rgba(0,0,0,.6) 38%,rgba(0,0,0,0) 72%),linear-gradient(0deg,rgba(0,0,0,.9) 0%,transparent 55%)}
.zq-volver{position:absolute;z-index:2;left:44px;top:30px;font-size:10.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:#cfcfcf;cursor:pointer}
.zq-volver:hover{color:#fff}
.zq-cabeza__texto{position:relative;z-index:1;display:flex;flex-direction:column;align-items:flex-start;padding:0 44px 44px;max-width:900px}
.zq-cabeza .rotulo{color:#6fb1ff}
.zq-cabeza h1{margin:12px 0 0;font-size:clamp(44px,5.6vw,94px);line-height:.88;color:#fff}
.zq-cabeza .pf-titulo{margin-top:22px}
.zq-cabeza .acciones{display:flex;align-items:center;gap:12px;margin-top:28px}
.zq-preguntar{display:inline-flex;align-items:center;gap:10px}
.zq-preguntar svg{width:17px;height:17px}
.zq-red{display:grid;place-items:center;width:50px;height:50px;border:1px solid rgba(255,255,255,.3);border-radius:50%;color:#fff;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.zq-red:hover{background:#fff;color:#000;border-color:#fff}
.zq-red svg{width:19px;height:19px}
/* su frase */
.zq-frase{padding:84px 20px 76px;text-align:center}
.zq-frase__comillas{display:block;height:64px;font-family:var(--titular);font-weight:700;font-size:170px;line-height:1;color:var(--azul)}
.zq-frase blockquote{max-width:1000px;margin:0 auto;font-family:var(--titular);font-weight:700;font-size:clamp(28px,3.3vw,50px);line-height:1.04;letter-spacing:-.01em;text-transform:uppercase;color:var(--texto)}
.zq-frase__firma{display:inline-flex;align-items:center;gap:12px;margin:30px 0 0;font-size:11px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--tenue)}
.zq-frase__firma img{width:38px;height:38px;border-radius:50%;object-fit:cover}
.zq-frase__firma::before{content:'';width:34px;height:1px;background:var(--linea)}
/* sobre él o ella, con el móvil aparte */
.zq-sobre{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:90px;align-items:center;padding-top:64px;border-top:1px solid var(--linea)}
.zq-sobre.sin-movil{grid-template-columns:1fr}
.zq-bio .indice{margin:0 0 18px}
.zq-bio p:not(.indice){max-width:700px;margin:0 0 16px;font-size:15.5px;line-height:1.8;color:var(--texto2)}
.zq-bio p:nth-child(2){font-size:20px;line-height:1.55;color:var(--texto)}
.zq-trabajos{position:relative;display:flex;flex-direction:column;align-items:center}
.zq-trabajos::before{content:'';position:absolute;left:50%;top:44%;width:440px;height:440px;margin:-220px 0 0 -220px;border-radius:50%;background:radial-gradient(circle,rgba(11,121,251,.22),rgba(11,121,251,0) 66%);pointer-events:none}
.zq-movil{position:relative;width:290px;aspect-ratio:485/833}
.zq-movil__marco{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none;filter:drop-shadow(0 30px 40px rgba(0,0,0,.3))}
.zq-movil__pantalla{position:absolute;z-index:3;left:15.7%;width:67.1%;top:17.4%;height:70.4%;overflow:hidden;background:#000}
.zq-movil__pista{display:flex;height:100%;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.zq-movil__pista video{flex:0 0 100%;width:100%;height:100%;object-fit:cover}
.zq-trabajos__pie{position:relative;display:flex;flex-direction:column;align-items:center;gap:12px;margin-top:14px}
.zq-trabajos__pie .rotulo{margin:0}
.zq-trabajos__mando{display:flex;align-items:center;gap:14px}
.zq-trabajos__mando button{display:grid;place-items:center;width:38px;height:38px;border:1px solid var(--linea);border-radius:50%;background:none;color:var(--texto);font-size:15px;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.zq-trabajos__mando button:hover{background:var(--texto);color:var(--fondo);border-color:var(--texto)}
.zq-movil__puntos{display:flex;gap:6px}
.zq-movil__puntos i{width:7px;height:7px;border-radius:50%;background:var(--linea);cursor:pointer;transition:width .3s}
.zq-movil__puntos i.on{width:20px;border-radius:4px;background:var(--azul)}
/* el separador */
.zq-cifras{display:grid;grid-template-columns:200px minmax(0,1fr);align-items:center;gap:30px;margin-top:70px;padding:34px 44px;border-radius:6px;background:#000;color:#fff}
.zq-cifras .rotulo{margin:0;color:#6fb1ff;line-height:1.6}
.zq-cifras dl{display:flex;margin:0}
.zq-cifras div{flex:1;padding:0 30px;border-left:1px solid rgba(255,255,255,.14)}
.zq-cifras dt{font-family:var(--titular);font-weight:700;font-size:clamp(26px,2.6vw,40px);line-height:1;white-space:nowrap}
.zq-cifras dd{margin:8px 0 0;font-size:10px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:#9c9c9c}
/* cursos, series, clases */
.zq-seccion{margin-top:64px}
.zq-seccion .indice{margin:0}
.zq-seccion h2{margin:10px 0 24px;font-size:clamp(26px,2.4vw,36px)}
.zq-seccion h2 span{margin-left:6px;font-family:inherit;font-size:.5em;color:var(--tenue);vertical-align:middle}
.zq-rejilla{display:grid;gap:30px 16px}
.zq-rejilla--cursos{grid-template-columns:repeat(5,minmax(0,1fr))}
.zq-rejilla--series{grid-template-columns:repeat(6,minmax(0,1fr))}
.zq-rejilla--clases{grid-template-columns:repeat(4,minmax(0,1fr))}
.zq-rejilla>*{flex:none}
.zq-curso .zn-curso__texto strong{font-size:15px}
.zq-otros{margin-top:70px;padding-top:34px;border-top:1px solid var(--linea)}
.zq-otros .rotulo{margin:0 0 18px}
.zq-otros>div{display:flex;gap:22px;flex-wrap:wrap}
.zq-frase__comillas{display:block;width:58px;height:44px;margin:0 auto 26px;color:var(--azul)}
.zq-sobre{align-items:start}
.zq-trabajos{margin-top:-10px}
.zq-seccion h2{display:flex;align-items:baseline;gap:14px}
.zq-seccion h2 b{font-size:.62em;color:var(--azul)}
.zq-seccion h2 span{margin-left:0}
/* la frase, debajo del texto, a la izquierda */
.zq-bio .zq-frase{margin-top:40px;padding:34px 0 0;text-align:left;border-top:1px solid var(--linea)}
.zq-bio .zq-frase__comillas{width:44px;height:34px;margin:0 0 18px}
.zq-bio .zq-frase blockquote{max-width:680px;margin:0;font-size:clamp(24px,2.3vw,36px)}
.zq-bio .zq-frase__firma{margin-top:22px}
.zq-bio .zq-frase__firma::before{display:none}
/* el móvil más grande */
.zq-sobre{grid-template-columns:minmax(0,1fr) 460px;gap:70px;align-items:center}
.zq-movil{width:360px}
.zq-trabajos::before{width:520px;height:520px;margin:-260px 0 0 -260px}
.zq-bio p.zq-frase__firma{max-width:none;margin:24px 0 0;font-size:11px;line-height:1;color:var(--tenue)}
/* ficha de profesor: página de lectura, centrada en su columna */
.zq-todas,.zq-elige{max-width:1240px;margin-left:auto;margin-right:auto}
.zq-sobre{grid-template-columns:minmax(0,1fr) 420px;gap:60px}
.zq-rejilla--cursos{grid-template-columns:repeat(4,minmax(0,1fr))}
.zq-rejilla--series{grid-template-columns:repeat(5,minmax(0,1fr))}
.zq-rejilla--clases{grid-template-columns:repeat(3,minmax(0,1fr))}
.zq-cifras{grid-template-columns:170px minmax(0,1fr)}
.zq-cifras div{padding:0 22px}
.zq-sobre{grid-template-columns:minmax(0,1fr) 470px}
.zq-movil{width:420px}
.zq-trabajos::before{width:600px;height:600px;margin:-300px 0 0 -300px}

/* ================= ZONA · Mis cursos (los guardados con ♥) ================= */
.mc{max-width:1420px;margin:0 auto}
.mc-intro{margin:6px 0 0;font-size:14px;color:var(--tenue)}
.mc-intro b{color:#ff4d6d}
.corazon.on{opacity:1;color:#ff4d6d;background:rgba(0,0,0,.72)}
/* el que llevas entre manos */
.mc-actual{display:grid;grid-template-columns:200px minmax(0,1fr) 380px;gap:36px;margin-top:28px;padding:28px;border-radius:6px;background:#000;color:#fff}
.mc-actual__cartel{display:block;aspect-ratio:515/730;overflow:hidden;border-radius:6px}
.mc-actual__cartel img{width:100%;height:100%;object-fit:cover}
.mc-actual .rotulo{color:#6fb1ff;margin:0}
.mc-actual__centro strong{display:block;margin-top:10px;font-family:var(--titular);font-weight:700;font-size:30px;line-height:.95;text-transform:uppercase}
.mc-actual__centro>small{display:flex;align-items:center;gap:8px;margin-top:10px;font-size:12.5px;color:#cfcfcf}
.mc-actual__centro .nv i{border-color:rgba(255,255,255,.5)}
.mc-barra{display:flex;gap:4px;margin-top:18px}
.mc-barra i{flex:1;height:5px;border-radius:1px;background:rgba(127,127,127,.3)}
.mc-barra i.on{background:var(--azul)}
.mc-barra i.ahora{background:linear-gradient(90deg,var(--azul) 62%,rgba(127,127,127,.3) 62%)}
.mc-actual__cuenta{margin:10px 0 0;font-size:12.5px;color:#9c9c9c}
.mc-actual__cuenta b{color:#fff}
.mc-temario{list-style:none;margin:18px 0 0;padding:0;columns:2;column-gap:26px}
.mc-temario li{display:flex;align-items:baseline;gap:10px;padding:8px 0;border-top:1px solid rgba(255,255,255,.1);break-inside:avoid;font-size:12.5px;color:#9c9c9c}
.mc-temario b{flex:none;width:20px;font-size:11px;color:#6d6d74}
.mc-temario span{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mc-temario small{font-size:11px;color:#6d6d74}
.mc-temario li.hecha b{color:#7fe3a5}
.mc-temario li.hecha span{color:#cfcfcf}
.mc-temario li.ahora{color:#fff}
.mc-temario li.ahora b{color:var(--azul)}
.mc-actual__siguiente{display:flex;flex-direction:column;align-items:flex-start}
.mc-actual__siguiente .img{position:relative;display:block;width:100%;aspect-ratio:16/9;margin-top:12px;overflow:hidden;border-radius:6px}
.mc-actual__siguiente .img img{width:100%;height:100%;object-fit:cover}
.mc-actual__siguiente .play{position:absolute;left:50%;top:50%;display:grid;place-items:center;width:54px;height:54px;margin:-27px 0 0 -27px;border-radius:50%;background:rgba(255,255,255,.22);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.5);color:#fff}
.mc-actual__visto{position:absolute;left:0;right:0;bottom:0;height:4px;background:rgba(255,255,255,.25)}
.mc-actual__visto i{display:block;height:100%;background:var(--azul)}
.mc-actual__siguiente strong{display:block;margin-top:14px;font-size:15px;font-weight:600;line-height:1.35}
.mc-actual__siguiente small{display:block;margin-top:5px;font-size:12px;color:#9c9c9c}
.mc-actual__siguiente .btn{margin-top:auto}
/* los guardados */
.mc-bloque{margin-top:52px}
.mc-bloque .zn-fila__cabeza{margin-bottom:18px}
.mc-filtro{display:flex;gap:4px;margin-left:auto}
.mc-filtro a{padding:8px 14px;border-radius:5px;font-size:12.5px;font-weight:600;color:var(--tenue);cursor:pointer}
.mc-filtro a b{margin-left:4px;font-weight:500;color:var(--tenue)}
.mc-filtro a.on{background:var(--texto);color:var(--fondo)}
.mc-filtro a.on b{color:var(--fondo);opacity:.7}
.mc-rejilla{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:26px 16px}
.mc-rejilla>a{flex:none;transition:opacity .35s,transform .35s}
.mc-rejilla>a[hidden]{display:none}
.mc-rejilla>a.mc-sale{opacity:0;transform:scale(.94)}
.mc-bloque .zb-curso{flex:0 0 calc((100% - 4 * 16px - 28px) / 5)}

/* ================= ZONA · Mis favoritos ================= */
.fv{max-width:1420px;margin:0 auto}
.fv-rejilla{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:34px 18px}
.fv-rejilla>a{flex:none;transition:opacity .35s,transform .35s}
.fv-rejilla>a[hidden]{display:none}
.fv-rejilla>a.mc-sale{opacity:0;transform:scale(.94)}
.fv-rejilla--series{grid-template-columns:repeat(6,minmax(0,1fr))}
.fv-curso{position:absolute;z-index:2;left:10px;top:10px;padding:4px 8px;border-radius:3px;background:var(--azul);color:#fff;font-size:9px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
/* mis favoritos: la clase a medias */
.fv-ahora{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);margin-top:28px;overflow:hidden;border-radius:6px;background:#000;color:#fff}
.fv-ahora__video{position:relative;aspect-ratio:16/9}
.fv-ahora__video video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.fv-ahora__texto{display:flex;flex-direction:column;justify-content:center;padding:36px 44px}
.fv-ahora .rotulo{margin:0;color:#6fb1ff}
.fv-ahora strong{display:block;margin-top:12px;font-family:var(--titular);font-weight:700;font-size:clamp(24px,2.3vw,36px);line-height:.98;text-transform:uppercase}
.fv-ahora small{display:flex;align-items:center;gap:8px;margin-top:12px;font-size:12.5px;color:#cfcfcf}
.fv-ahora small .nv i{border-color:rgba(255,255,255,.5)}
.fv-ahora__barra{display:block;height:5px;margin-top:22px;border-radius:2px;background:rgba(255,255,255,.2)}
.fv-ahora__barra i{display:block;height:100%;border-radius:2px;background:var(--azul)}
.fv-ahora__cuenta{margin-top:10px;font-size:12.5px;color:#9c9c9c}
.fv-ahora__cuenta b{color:#fff}
.fv-ahora .acciones{margin-top:26px}

/* mis favoritos: todo junto, por pestañas */
.fv-vista{display:none}
.fv[data-ver="todo"] .fv-vista--todo,.fv[data-ver="cursos"] .fv-vista--cursos,.fv[data-ver="series"] .fv-vista--series,.fv[data-ver="clases"] .fv-vista--clases{display:block}
.fv .mc-bloque:first-child{margin-top:34px}
.fv-rejilla--cursos{grid-template-columns:repeat(5,minmax(0,1fr))}
.fv-vista--todo .zb-curso{flex:0 0 calc((100% - 4 * 16px - 28px) / 5)}
.fv-vista--todo .zb-serie{flex:0 0 calc((100% - 5 * 16px - 28px) / 6)}
.fv-vista--todo .zb-clase{flex:0 0 calc((100% - 3 * 16px - 28px) / 4)}
.fv [data-abre]{margin-left:auto;cursor:pointer}

.fv-vista>.mc-actual,.fv-vista>.fv-ahora{margin-top:30px}
.fv-vista>.mc-actual+.mc-bloque,.fv-vista>.fv-ahora+.mc-bloque{margin-top:52px}
.fv-ahora .mc-barra{margin-top:20px}

/* favoritos · todo: el carrusel de lo que estás haciendo (asoma el siguiente a la derecha) */
.fv-sigue{margin-top:30px}
.fv-sigue__cabeza{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.fv-sigue__cabeza .rotulo{margin:0}
.fv-sigue__mando{display:flex;align-items:center;gap:8px}
.fv-sigue__chips{display:flex;gap:4px;margin-right:8px}
.fv-sigue__chips a{padding:7px 13px;border-radius:5px;font-size:12px;font-weight:600;color:var(--tenue);cursor:pointer}
.fv-sigue__chips a.on{background:var(--texto);color:var(--fondo)}
.fv-sigue__mando button{display:grid;place-items:center;width:38px;height:38px;border:1px solid var(--linea);border-radius:50%;background:none;color:var(--texto);font-size:15px;cursor:pointer}
.fv-sigue__mando button:hover:not(:disabled){background:var(--texto);color:var(--fondo);border-color:var(--texto)}
.fv-sigue__mando button:disabled{opacity:.3;cursor:default}
.fv-sigue__ventana{overflow:hidden;margin-right:-28px}
.fv-sigue__pista{display:flex;gap:16px;transition:transform .55s cubic-bezier(.2,.8,.2,1)}
.fv-sigue__hoja{flex:0 0 88%;transition:opacity .4s}
.fv-sigue__hoja.fuera{opacity:.45;cursor:pointer}
.fv-sigue__hoja>.mc-actual,.fv-sigue__hoja>.fv-ahora{margin:0;height:100%}
.fv-sigue__pista{align-items:stretch}

.fv-sigue__ventana.sola{margin-right:0}
.fv-sigue__ventana.sola .fv-sigue__hoja{flex-basis:100%}
.fv-vista>.fv-sigue+.mc-bloque{margin-top:52px}

/* ================= ZONA · Mi historial ================= */
.hs{max-width:1240px;margin:0 auto}
/* tu actividad */
.hs-actividad{display:grid;grid-template-columns:260px minmax(0,1fr);gap:40px;align-items:end;margin-top:28px;padding:28px 32px;border-radius:6px;background:#000;color:#fff}
.hs-actividad .rotulo{margin:0;color:#9c9c9c}
.hs-actividad strong{display:block;margin-top:12px;font-family:var(--titular);font-weight:700;font-size:40px;line-height:1}
.hs-actividad small{display:block;margin-top:8px;font-size:12.5px;color:#9c9c9c}
.hs-barras{display:flex;align-items:flex-end;gap:5px;height:110px}
.hs-barra{position:relative;flex:1;height:100%;display:flex;flex-direction:column;justify-content:flex-end}
.hs-barra i{display:block;border-radius:2px 2px 0 0;background:rgba(11,121,251,.55);transition:background .2s}
.hs-barra:hover i{background:#6fb1ff}
.hs-barra.hoy i{background:var(--azul);box-shadow:0 0 14px rgba(11,121,251,.6)}
.hs-barra em{position:absolute;left:0;right:0;top:100%;margin-top:6px;font-style:normal;font-size:9.5px;font-weight:700;text-align:center;color:#6d6d74}
/* barra de filtros */
.hs-barra-filtros{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:44px;padding-bottom:12px;border-bottom:1px solid var(--linea)}
.hs-tipos{display:flex;gap:6px}
.hs-tipos a{padding:9px 16px;border:1px solid var(--linea);border-radius:5px;font-size:12.5px;font-weight:600;color:var(--texto2);cursor:pointer}
.hs-tipos a.on{background:var(--texto);border-color:var(--texto);color:var(--fondo)}
/* la línea de tiempo */
.hs-dias{list-style:none;margin:0;padding:0}
.hs-dia{position:relative;margin-top:34px;padding-left:28px;border-left:2px solid var(--linea)}
.hs-dia[hidden]{display:none}
.hs-dia::before{content:'';position:absolute;left:-7px;top:4px;width:12px;height:12px;border-radius:50%;background:var(--fondo);box-shadow:inset 0 0 0 3px var(--azul)}
.hs-dia__cabeza{display:flex;align-items:baseline;gap:12px;margin:0 0 14px}
.hs-dia__cabeza b{font-family:var(--titular);font-weight:700;font-size:20px;text-transform:uppercase}
.hs-dia__cabeza span{font-size:12.5px;color:var(--tenue)}
.hs-lista{list-style:none;margin:0;padding:0;border:1px solid var(--linea);border-radius:6px;background:var(--campo-fondo)}
.hs-fila{display:grid;grid-template-columns:52px 176px minmax(0,1fr) 150px 190px;gap:20px;align-items:center;padding:14px 18px;border-top:1px solid var(--linea2);transition:opacity .35s,transform .35s,background .2s}
.hs-fila:first-child{border-top:0}
.hs-fila:hover{background:var(--hover)}
.hs-fila[hidden]{display:none}
.hs-fila.mc-sale{opacity:0;transform:translateX(20px)}
.hs-hora{font-size:12px;font-weight:700;color:var(--tenue)}
.hs-img{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;border-radius:5px;cursor:pointer}
.hs-img img{width:100%;height:100%;object-fit:cover}
.hs-img .dur{font-size:10px}
.hs-avance{position:absolute;left:0;right:0;bottom:0;height:4px;background:rgba(255,255,255,.3)}
.hs-avance i{display:block;height:100%;background:var(--azul)}
.hs-tipo{display:inline-block;padding:3px 8px;border-radius:3px;font-size:9px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;background:var(--linea2);color:var(--texto2)}
.hs-tipo--curso{background:rgba(11,121,251,.12);color:var(--azul-claro)}
.hs-tipo--serie{background:rgba(255,77,109,.12);color:#e0405f}
.hs-texto strong{display:block;margin-top:7px;font-size:15px;font-weight:600;line-height:1.3}
.hs-texto small{display:flex;align-items:center;gap:7px;margin-top:5px;font-size:12px;color:var(--tenue)}
.hs-visto{font-size:12.5px;color:var(--tenue)}
.hs-visto b{font-family:var(--titular);font-size:16px;color:var(--texto)}
.hs-visto small{display:block;margin-top:3px;font-size:11.5px}
.hs-visto .hs-ok{font-family:inherit;font-size:12.5px;color:#2fa866}
.hs-acciones{display:flex;align-items:center;justify-content:flex-end;gap:10px}
.hs-acciones .btn{padding:11px 16px}
.hs-quitar{display:grid;place-items:center;width:32px;height:32px;border:0;border-radius:50%;background:none;color:var(--tenue);font-size:18px;cursor:pointer;opacity:0;transition:opacity .2s,background .2s}
.hs-fila:hover .hs-quitar{opacity:1}
.hs-quitar:hover{background:var(--linea2);color:var(--texto)}

/* ================= ZONA · Mis grabaciones ================= */
.gb{max-width:1240px;margin:0 auto}
.gb-privado{display:flex;align-items:center;gap:10px;margin:8px 0 0;font-size:13.5px;color:var(--tenue)}
.gb-privado svg{flex:none;width:17px;height:17px;color:var(--texto)}
.gb-privado b{color:var(--texto)}
/* tu evolución */
.gb-evolucion{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:50px;align-items:center;margin-top:28px;padding:40px 44px;border-radius:6px;background:#000;color:#fff;overflow:hidden;position:relative}
.gb-evolucion::before{content:'';position:absolute;right:-120px;top:50%;width:620px;height:620px;margin-top:-310px;border-radius:50%;background:radial-gradient(circle,rgba(11,121,251,.28),transparent 65%);pointer-events:none}
.gb-evolucion__texto{position:relative}
.gb-evolucion .rotulo{margin:0;color:#6fb1ff}
.gb-evolucion strong{display:block;margin-top:12px;font-family:var(--titular);font-weight:700;font-size:clamp(26px,2.6vw,40px);line-height:.95;text-transform:uppercase}
.gb-evolucion small{display:block;margin-top:8px;font-size:12.5px;color:#9c9c9c}
.gb-evolucion p{max-width:440px;margin:18px 0 0;font-size:15px;line-height:1.6;color:#cfcfcf}
.gb-evolucion__dato{display:block;margin-top:14px;font-size:12.5px;color:#9c9c9c}
.gb-evolucion__dato b{color:#fff}
.gb-evolucion .acciones{margin-top:26px}
.gb-evolucion__par{position:relative;display:flex;align-items:center;gap:18px}
.gb-movilito{position:relative;display:block;width:200px;aspect-ratio:9/16;overflow:hidden;border-radius:16px;border:3px solid #26262b;background:#111;box-shadow:0 20px 40px rgba(0,0,0,.5)}
.gb-movilito img{width:100%;height:100%;object-fit:cover;filter:saturate(.8)}
.gb-movilito--ahora{width:230px;border-color:var(--azul);box-shadow:0 0 0 1px var(--azul),0 24px 50px rgba(11,121,251,.35)}
.gb-movilito--ahora img{filter:none}
.gb-movilito em{position:absolute;left:10px;right:10px;bottom:10px;padding:7px 9px;border-radius:6px;background:rgba(0,0,0,.72);font-style:normal;font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;text-align:center}
.gb-movilito--ahora em{background:var(--azul)}
.gb-evolucion__flecha{font-size:26px;color:#6fb1ff}
.gb-toma__rec{position:absolute;left:8px;top:8px;padding:3px 7px;border-radius:4px;background:rgba(0,0,0,.65);font-style:normal;font-size:10px;font-weight:700;color:#fff}
.gb-toma__rec::first-letter{color:#ff3b3b}
/* grabarte otra vez */
.gb-nueva{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:24px;align-items:center;margin-top:20px;padding:20px 24px;border:1px solid var(--linea);border-radius:6px;background:var(--campo-fondo)}
.gb-nueva__boton{display:grid;place-items:center;width:64px;height:64px;border-radius:50%;border:3px solid var(--texto);cursor:pointer}
.gb-nueva__boton i{width:40px;height:40px;border-radius:50%;background:#ff3b3b;transition:transform .2s,border-radius .2s}
.gb-nueva__boton:hover i{transform:scale(.85)}
.gb-nueva strong{display:block;font-family:var(--titular);font-weight:700;font-size:20px;text-transform:uppercase}
.gb-nueva small{display:block;margin-top:5px;font-size:13px;color:var(--tenue)}
.gb-nueva__clases{display:flex;gap:10px}
.gb-nueva__clases a{position:relative;display:block;width:150px;aspect-ratio:16/9;overflow:hidden;border-radius:5px;cursor:pointer}
.gb-nueva__clases img{width:100%;height:100%;object-fit:cover}
.gb-nueva__clases span{position:absolute;left:0;right:0;bottom:0;padding:16px 8px 6px;background:linear-gradient(transparent,rgba(0,0,0,.85));color:#fff;font-size:10.5px;font-weight:600;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* por clase */
.gb-comparar{display:flex;align-items:center;gap:14px;margin-left:auto}
.gb-comparar__aviso{display:none;font-size:12.5px;color:var(--tenue)}
.gb-lista[data-modo="comparar"] .gb-comparar__aviso{display:inline}
.gb-comparar__boton{display:inline-flex;align-items:center;gap:8px;cursor:pointer}
.gb-comparar__boton svg{width:16px;height:16px}
.gb-comparar__boton.listo{background:var(--azul);border-color:var(--azul);color:#fff}
.gb-grupo{display:grid;grid-template-columns:300px minmax(0,1fr);gap:28px;align-items:start;padding:24px 0;border-top:1px solid var(--linea)}
.gb-grupo__clase{display:flex;flex-direction:column;gap:12px;cursor:pointer}
.gb-grupo__clase .img{display:block;aspect-ratio:16/9;overflow:hidden;border-radius:6px}
.gb-grupo__clase img{width:100%;height:100%;object-fit:cover}
.gb-grupo__clase strong{display:block;font-size:15px;font-weight:600;line-height:1.3}
.gb-grupo__clase small{display:block;margin-top:4px;font-size:12px;color:var(--tenue)}
.gb-grupo__clase em{display:block;margin-top:8px;font-style:normal;font-size:10px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--azul-claro)}
.gb-grupo__clase .enlace{display:inline-block;margin-top:10px}
.gb-grupo__tomas{display:flex;gap:14px;flex-wrap:wrap}
.gb-toma{position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;width:132px;cursor:pointer;transition:opacity .35s,transform .35s}
.gb-toma.mc-sale{opacity:0;transform:scale(.9)}
.gb-toma__img{position:relative;display:block;width:100%;aspect-ratio:9/16;overflow:hidden;border-radius:12px;background:#111;box-shadow:0 8px 18px rgba(0,0,0,.15);transition:box-shadow .2s,transform .2s}
.gb-toma:hover .gb-toma__img{transform:translateY(-3px)}
.gb-toma__img img{width:100%;height:100%;object-fit:cover}
.gb-toma__play{position:absolute;left:50%;top:50%;display:grid;place-items:center;width:40px;height:40px;margin:-20px 0 0 -20px;border-radius:50%;background:rgba(255,255,255,.22);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.5);color:#fff;font-size:13px}
.gb-toma__ultima{position:absolute;left:8px;right:8px;bottom:8px;padding:4px 0;border-radius:4px;background:var(--azul);color:#fff;font-size:9px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;text-align:center}
.gb-toma__marca{position:absolute;right:8px;top:8px;display:none;place-items:center;width:24px;height:24px;border-radius:50%;border:2px solid #fff;background:rgba(0,0,0,.4);color:transparent;font-size:12px;font-weight:700}
.gb-lista[data-modo="comparar"] .gb-toma__marca{display:grid}
.gb-toma[data-sel="1"] .gb-toma__marca{background:var(--azul);border-color:var(--azul);color:#fff}
.gb-toma[data-sel="1"] .gb-toma__img{box-shadow:0 0 0 3px var(--azul),0 12px 24px rgba(11,121,251,.3)}
.gb-toma small{font-size:12px;font-weight:600;color:var(--texto2)}
.gb-toma__acciones{display:flex;gap:4px;opacity:0;transition:opacity .2s}
.gb-toma:hover .gb-toma__acciones{opacity:1}
.gb-toma__acciones button{display:grid;place-items:center;width:30px;height:30px;border:1px solid var(--linea);border-radius:50%;background:var(--fondo);color:var(--texto);font-size:15px;cursor:pointer}
.gb-toma__acciones button:hover{background:var(--texto);color:var(--fondo)}
.gb-toma__acciones svg{width:14px;height:14px}
.gb-espacio{display:flex;align-items:center;gap:14px;margin:30px 0 0;padding-top:20px;border-top:1px solid var(--linea);font-size:12.5px;color:var(--tenue)}
.gb-espacio b{color:var(--texto)}
.gb-espacio__barra{flex:none;width:160px;height:4px;border-radius:2px;background:var(--linea)}
.gb-espacio__barra i{display:block;height:100%;border-radius:2px;background:var(--azul)}
/* mis grabaciones: tres estados (con grabaciones, una sola toma, ninguna) */
.gb-estados{max-width:1240px;margin:4px auto 18px}
.gb-vacio,.gb-evolucion--una,.gb-solo-sin{display:none}
.gb[data-e="una"] .gb-evolucion--llena,.gb[data-e="vacio"] .gb-evolucion--llena{display:none}
.gb[data-e="una"] .gb-evolucion--una{display:grid}
.gb[data-e="una"] .gb-grupo:not([data-n="1"]){display:none}
.gb[data-e="vacio"] .gb-vacio{display:grid}
.gb[data-e="vacio"] .gb-lista,.gb[data-e="vacio"] .gb-espacio,.gb[data-e="vacio"] .gb-solo-con{display:none}
.gb[data-e="vacio"] .gb-solo-sin{display:inline}
.gb-vacio{grid-template-columns:minmax(0,1fr) auto;gap:60px;align-items:center;margin-top:28px;padding:44px 48px;border-radius:6px;background:#000;color:#fff;position:relative;overflow:hidden}
.gb-vacio::before{content:'';position:absolute;right:-100px;top:50%;width:600px;height:600px;margin-top:-300px;border-radius:50%;background:radial-gradient(circle,rgba(255,59,59,.18),transparent 65%);pointer-events:none}
.gb-vacio .rotulo{margin:0;color:#ff6b6b}
.gb-vacio__texto>strong{display:block;margin-top:12px;font-family:var(--titular);font-weight:700;font-size:clamp(28px,3vw,46px);line-height:.95;text-transform:uppercase}
.gb-vacio p{max-width:520px;margin:18px 0 0;font-size:15px;line-height:1.6;color:#cfcfcf}
.gb-pasos{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:30px 0 0;padding:24px 0 0;border-top:1px solid rgba(255,255,255,.14)}
.gb-pasos li{display:flex;gap:12px}
.gb-pasos b{font-family:var(--titular);font-size:22px;color:#ff6b6b}
.gb-pasos span{font-size:12.5px;line-height:1.5;color:#9c9c9c}
.gb-pasos strong{display:block;margin-bottom:4px;font-size:14px;font-weight:600;color:#fff}
.gb-vacio__movil{position:relative}
.gb-vacio__boton{position:absolute;left:50%;bottom:62px;display:grid;place-items:center;width:58px;height:58px;margin-left:-29px;border-radius:50%;border:3px solid #fff}
.gb-vacio__boton i{width:38px;height:38px;border-radius:50%;background:#ff3b3b;animation:gbLate 1.6s ease-in-out infinite}
@keyframes gbLate{50%{transform:scale(.82)}}
.gb-movilito--hueco{display:grid;place-items:center;border:2px dashed rgba(255,255,255,.35);background:rgba(255,255,255,.04);box-shadow:none}
.gb-movilito--hueco .gb-vacio__boton{position:static;margin:0}
.gb-movilito--hueco em{background:rgba(255,255,255,.12)}
.gb-evolucion--una .btn .punto-rec,.gb-grabar__boton .punto-rec{display:inline-block;width:10px;height:10px;margin-right:9px;border-radius:50%;background:#ff3b3b;vertical-align:middle}
/* grabarte: tarjetas grandes */
.gb-nueva{display:block;margin-top:44px;padding:0;border:0;background:none}
.gb-nueva .zn-fila__cabeza .enlace{margin-left:auto}
.gb-grabar-fila{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:18px}
.gb-grabar{display:block;cursor:pointer}
.gb-grabar__img{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;border-radius:8px;background:#111}
.gb-grabar__img img{width:100%;height:100%;object-fit:cover;transition:transform .6s,filter .3s}
.gb-grabar:hover .gb-grabar__img img{transform:scale(1.04);filter:brightness(.7)}
.gb-grabar__rec{position:absolute;left:50%;top:50%;display:grid;place-items:center;width:70px;height:70px;margin:-35px 0 0 -35px;border-radius:50%;border:3px solid #fff;background:rgba(0,0,0,.25);backdrop-filter:blur(4px);transition:transform .25s}
.gb-grabar__rec i{width:46px;height:46px;border-radius:50%;background:#ff3b3b;transition:transform .25s,border-radius .25s}
.gb-grabar:hover .gb-grabar__rec{transform:scale(1.08)}
.gb-grabar:hover .gb-grabar__rec i{transform:scale(.6);border-radius:8px}
.gb-grabar__dura{position:absolute;right:10px;bottom:10px;padding:4px 8px;border-radius:4px;background:rgba(0,0,0,.7);color:#fff;font-size:11px;font-weight:700}
.gb-grabar .hs-tipo{margin-top:14px}
.gb-grabar strong{display:block;margin-top:8px;font-size:16px;font-weight:600;line-height:1.3}
.gb-grabar small{display:block;margin-top:4px;font-size:12.5px;color:var(--tenue)}
.gb-grabar__boton{display:inline-flex;align-items:center;margin-top:14px}

/* mis grabaciones: pestañas por tipo y el reto del mes */
.gb-pestanas{margin-top:44px}
.gb-pestanas__reto em{margin-left:8px;padding:3px 7px;border-radius:4px;background:#ff3b3b;color:#fff;font-family:var(--cuerpo,inherit);font-style:normal;font-size:9.5px;font-weight:700;letter-spacing:.1em;vertical-align:middle}
.gb-grupo.fuera-tipo{display:none}
.gb[data-e="vacio"] .gb-pestanas{display:none}
.gb-reto{display:none;margin-top:28px}
.gb[data-t="reto"] .gb-reto{display:block}
.gb[data-t="reto"] .gb-lista,.gb[data-t="reto"] .gb-nueva,.gb[data-t="reto"] .gb-espacio{display:none}
.gb-reto__cabeza{display:grid;grid-template-columns:260px minmax(0,1fr) auto;gap:32px;align-items:center;padding:24px;border-radius:6px;background:#000;color:#fff;box-shadow:inset 0 3px 0 #ff3b3b}
.gb-reto__img{display:block;aspect-ratio:16/9;overflow:hidden;border-radius:5px}
.gb-reto__img img{width:100%;height:100%;object-fit:cover}
.gb-reto__cabeza .rotulo{margin:0;color:#ff6b6b}
.gb-reto__cabeza strong{display:block;margin-top:8px;font-family:var(--titular);font-weight:700;font-size:26px;line-height:1;text-transform:uppercase}
.gb-reto__cabeza small{display:block;margin-top:6px;font-size:12.5px;color:#9c9c9c}
.gb-reto__cabeza dl{display:flex;gap:28px;margin:16px 0 0}
.gb-reto__cabeza dt{font-family:var(--titular);font-weight:700;font-size:22px;line-height:1}
.gb-reto__cabeza dd{margin:5px 0 0;max-width:200px;font-size:10.5px;line-height:1.35;color:#9c9c9c}
.gb-reto__cabeza .acciones{display:flex;flex-direction:column;align-items:flex-end;gap:12px}
.gb-reto__cabeza .btn .punto-rec{display:inline-block;width:10px;height:10px;margin-right:9px;border-radius:50%;background:#ff3b3b;vertical-align:middle}
.gb-reto__cuerpo{display:grid;grid-template-columns:auto minmax(0,1fr);gap:44px;margin-top:30px}
.gb-reto__cuerpo .rotulo{margin:0 0 14px}
.gb-reto__tomas{display:flex;gap:16px}
.gb-reto__toma{display:flex;flex-direction:column;align-items:center;gap:8px;width:150px}
.gb-reto__toma small{font-size:12px;font-weight:600}
.gb-reto__toma .btn{padding:10px 12px;font-size:10px;background:#ff3b3b;border-color:#ff3b3b}
.gb-reto__toma.publicada .gb-toma__img{box-shadow:0 0 0 3px #ff3b3b,0 12px 24px rgba(255,59,59,.25)}
.gb-reto__ok{font-size:12px;color:#e0405f}
.gb-reto__toma .enlace{font-size:9.5px}
.gb-reto__aviso{display:flex;gap:10px;max-width:330px;margin:20px 0 0;padding:14px 16px;border:1px solid rgba(255,59,59,.35);border-radius:6px;background:rgba(255,59,59,.06);font-size:12.5px;line-height:1.5;color:var(--texto2)}
.gb-reto__aviso svg{flex:none;width:16px;height:16px;margin-top:2px;color:#e0405f}
.gb-reto__muro .zn-fila__cabeza{margin-bottom:14px}
.gb-reto__muro .zn-fila__cabeza .rotulo{margin:0}
.gb-reto__muro .zn-fila__cabeza .enlace{margin-left:auto}
.gb-reto__muro-fila{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}
.gb-muro{position:relative;display:block;aspect-ratio:9/16;overflow:hidden;border-radius:10px;background:#111;cursor:pointer}
.gb-muro img{width:100%;height:100%;object-fit:cover}
.gb-muro::after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 55%,rgba(0,0,0,.8))}
.gb-muro b{position:absolute;z-index:1;left:8px;bottom:24px;color:#fff;font-size:12px;font-weight:600}
.gb-muro em{position:absolute;z-index:1;left:8px;bottom:8px;color:#ff8fa3;font-style:normal;font-size:11px;font-weight:700}
/* el reto: comparar dos tomas también */
.gb-comparable[data-modo="comparar"] .gb-comparar__aviso{display:inline}
.gb-comparable[data-modo="comparar"] .gb-toma__marca{display:grid}
.gb-reto__mias-cabeza{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:14px}
.gb-reto__mias-cabeza .rotulo{margin:0!important}
.gb-reto__mias-cabeza .gb-comparar{margin-left:0}
.gb-reto__mias-cabeza .btn{padding:9px 12px;font-size:10px}
.gb-reto__toma{width:140px}
.gb-reto__toma .gb-toma__acciones{order:5}
.gb-reto__aviso{max-width:470px}
.gb-reto__toma .gb-reto__publicar{width:100%;padding:10px 0;text-align:center;white-space:nowrap}

/* ================= la ventana de COMPARAR ================= */
.gc{position:fixed;inset:0;z-index:220;display:grid;place-items:center;padding:24px;background:rgba(0,0,0,.86);backdrop-filter:blur(10px);animation:zbFondo .25s ease}
.gc[hidden]{display:none}
.gc__caja{display:flex;flex-direction:column;width:min(1180px,100%);max-height:calc(100vh - 48px);border-radius:8px;background:#0b0b0e;color:#fff;border:1px solid rgba(255,255,255,.1);box-shadow:inset 0 3px 0 var(--azul),0 40px 90px rgba(0,0,0,.6);overflow:hidden;animation:zbSube .35s cubic-bezier(.2,.8,.2,1)}
.gc__cabeza{display:flex;align-items:center;gap:30px;padding:22px 28px;border-bottom:1px solid rgba(255,255,255,.1)}
.gc__cabeza .rotulo{margin:0;color:#6fb1ff}
.gc__cabeza strong{display:block;margin-top:6px;font-family:var(--titular);font-weight:700;font-size:20px;text-transform:uppercase;line-height:1}
.gc__cabeza small{display:block;margin-top:5px;font-size:12px;color:#9c9c9c}
.gc__modos{display:flex;gap:4px;margin-left:auto;padding:4px;border:1px solid rgba(255,255,255,.14);border-radius:7px}
.gc__modos a{padding:9px 16px;border-radius:5px;font-size:12.5px;font-weight:600;color:#9c9c9c;cursor:pointer;white-space:nowrap}
.gc__modos a.on{background:#fff;color:#000}
.gc__cerrar{width:40px;height:40px;border:1px solid rgba(255,255,255,.2);border-radius:50%;background:none;color:#fff;font-size:22px;line-height:1;cursor:pointer}
.gc__escena{flex:1;min-height:0;display:grid;place-items:center;padding:26px;background:radial-gradient(ellipse at center,rgba(11,121,251,.12),transparent 70%)}
.gc__lado,.gc__encima,.gc__profe{display:none;align-items:center;gap:22px}
.gc[data-modo="lado"] .gc__lado,.gc[data-modo="profe"] .gc__profe{display:flex}
.gc[data-modo="encima"] .gc__encima{display:flex;flex-direction:column}
.gc-marco{position:relative;display:block;height:min(56vh,540px);aspect-ratio:9/16;overflow:hidden;border-radius:16px;border:3px solid #26262b;background:#000}
.gc-marco video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.gc-marco--ahora{border-color:var(--azul);box-shadow:0 0 0 1px var(--azul),0 20px 50px rgba(11,121,251,.3)}
.gc-marco em,.gc-clase em{position:absolute;left:10px;right:10px;bottom:10px;padding:7px 9px;border-radius:6px;background:rgba(0,0,0,.72);font-style:normal;font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;text-align:center}
.gc-marco--ahora em{background:var(--azul)}
.gc-marco--grande{height:min(52vh,500px)}
.gc__mezcla{display:flex;align-items:center;gap:12px;margin-top:16px;font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#9c9c9c}
.gc__mezcla input{width:260px;accent-color:var(--azul)}
.gc-clase{position:relative;display:block;height:min(56vh,540px);aspect-ratio:16/9;max-width:56vw;overflow:hidden;border-radius:10px;border:3px solid #26262b;background:#000}
.gc-clase video{width:100%;height:100%;object-fit:cover}
.gc-clase em{right:auto}
.gc.espejo .gc-marco video{transform:scaleX(-1)}
.gc.espejo .gc-v-ahora{transform:scaleX(-1) translateX(-6px)!important}
.gc__mando{display:flex;align-items:center;gap:22px;padding:16px 28px;border-top:1px solid rgba(255,255,255,.1)}
.gc__play{flex:none;display:grid;place-items:center;width:52px;height:52px;border:0;border-radius:50%;background:var(--azul);color:#fff;font-size:16px;cursor:pointer;box-shadow:0 8px 20px rgba(11,121,251,.4)}
.gc__tiempo{flex:1;display:flex;align-items:center;gap:14px;font-size:12px;color:#9c9c9c}
.gc__tiempo b{font-weight:600;font-variant-numeric:tabular-nums}
.gc__linea{position:relative;flex:1;height:5px;border-radius:3px;background:rgba(255,255,255,.15)}
.gc__linea i{position:absolute;left:0;top:0;bottom:0;width:0;border-radius:3px;background:var(--azul)}
.gc__linea u{position:absolute;top:-4px;width:2px;height:13px;background:#fff;opacity:.5}
.gc__velocidad{display:flex;gap:2px;padding:3px;border:1px solid rgba(255,255,255,.14);border-radius:6px}
.gc__velocidad a{padding:7px 10px;border-radius:4px;font-size:12px;font-weight:600;color:#9c9c9c;cursor:pointer}
.gc__velocidad a.on{background:rgba(255,255,255,.14);color:#fff}
.gc__espejo{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border:1px solid rgba(255,255,255,.2);border-radius:6px;background:none;color:#fff;font:inherit;font-size:12.5px;font-weight:600;cursor:pointer}
.gc__espejo svg{width:16px;height:16px}
.gc__espejo.on{background:#fff;color:#000}
.gc__pie{display:flex;align-items:center;gap:10px;margin:0;padding:14px 28px;background:rgba(255,255,255,.03);font-size:12.5px;color:#9c9c9c}
.gc__pie svg{width:16px;height:16px}
.gc__pie-acciones{display:flex;gap:10px;margin-left:auto}
.gc__pie .btn{display:inline-flex;align-items:center;gap:8px;padding:11px 16px}
.gc__pie .btn--linea{color:#fff;border-color:rgba(255,255,255,.3)}
.gc__pie .btn svg{width:14px;height:14px}

/* comparar desde cada toma: casillas en todas las tomas mientras eliges, y la barra fija de abajo */
.gb.comparando .gb-toma__marca{display:grid}
.gb.comparando .gb-toma{cursor:copy}
.gb-primera-ultima{display:inline-block;margin-top:8px;color:var(--azul-claro)}
.gb-barra-comparar{position:fixed;z-index:150;left:50%;bottom:24px;display:flex;align-items:center;gap:20px;padding:12px 14px 12px 12px;border-radius:10px;background:#0b0b0e;color:#fff;box-shadow:0 20px 50px rgba(0,0,0,.45),inset 0 0 0 1px rgba(255,255,255,.12);transform:translateX(-50%);animation:zbSube .3s cubic-bezier(.2,.8,.2,1)}
.gb-barra-comparar[hidden]{display:none}
.gb-barra-comparar__miniaturas{display:flex;gap:6px}
.gb-barra-comparar__miniaturas i{width:34px;height:60px;border-radius:6px;border:2px dashed rgba(255,255,255,.3);background:center/cover no-repeat}
.gb-barra-comparar__miniaturas i.llena{border:2px solid var(--azul)}
.gb-barra-comparar b{font-family:var(--titular);font-size:18px}
.gb-barra-comparar small{display:block;margin-top:2px;font-size:11.5px;color:#9c9c9c}
.gb-barra-comparar .btn{display:inline-flex;align-items:center;gap:8px;opacity:.4;pointer-events:none}
.gb-barra-comparar .btn svg{width:16px;height:16px}
.gb-barra-comparar .btn.listo{opacity:1;pointer-events:auto}
.gb-barra-comparar .enlace{color:#cfcfcf;cursor:pointer}
.gb-toma.no-elegible{opacity:.3;pointer-events:none;filter:grayscale(1)}
/* con la profesora: elegir cuál de tus dos tomas va junto a la clase */
.gc__cual{display:none;align-items:center;gap:6px;margin-bottom:16px;padding:4px;border:1px solid rgba(255,255,255,.14);border-radius:7px}
.gc[data-modo="profe"] .gc__cual{display:inline-flex}
.gc__cual span{padding:0 10px 0 8px;font-size:10px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:#9c9c9c}
.gc__cual a{padding:8px 14px;border-radius:5px;font-size:12.5px;font-weight:600;color:#9c9c9c;cursor:pointer}
.gc__cual a.on{background:var(--azul);color:#fff}
.gc[data-modo="profe"] .gc__escena{display:flex;flex-direction:column;align-items:center;justify-content:center}
/* con la profesora: las dos a la misma altura y dentro de la ventana */
.gc__profe{max-width:100%;justify-content:center}
.gc__profe .gc-marco,.gc__profe .gc-clase{height:min(46vh,440px);flex:none}
.gc__profe .gc-clase{max-width:calc(100% - 22px - min(46vh,440px) * 9 / 16)}
.gc__cual{margin-bottom:18px}

/* ================= ZONA · Mensajería ================= */
#zmensajes .zn-contenido{padding:0}
.ms{display:grid;grid-template-columns:330px minmax(0,1fr) 290px;height:calc(100vh - 110px);min-height:620px;border-left:1px solid var(--linea)}
/* conversaciones */
.ms-lista{display:flex;flex-direction:column;min-height:0;border-right:1px solid var(--linea);background:var(--campo-fondo)}
.ms-lista__cabeza{display:flex;align-items:center;justify-content:space-between;padding:22px 20px 14px}
.ms-lista__cabeza h1{margin:0;font-size:28px}
.ms-nuevo{padding:10px 14px;font-size:10.5px}
.ms-buscar{display:flex;align-items:center;gap:10px;margin:0 20px 10px;padding:0 12px;border:1px solid var(--linea);border-radius:6px;background:var(--fondo)}
.ms-buscar svg{width:15px;height:15px;color:var(--tenue)}
.ms-buscar input{flex:1;padding:10px 0;border:0;background:none;font:inherit;font-size:13px;color:var(--texto);outline:0}
.ms-lista nav{flex:1;overflow-y:auto}
.ms-conv{display:grid;grid-template-columns:46px minmax(0,1fr) auto;gap:12px;align-items:center;padding:14px 20px;border-left:3px solid transparent;cursor:pointer;transition:background .2s}
.ms-conv:hover{background:var(--hover)}
.ms-conv.on{background:var(--fondo);border-left-color:var(--azul)}
.ms-conv img{width:46px;height:46px;border-radius:50%;object-fit:cover}
.ms-conv strong{display:block;font-size:14px;font-weight:600}
.ms-conv small{display:block;margin-top:3px;font-size:12.5px;color:var(--tenue);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ms-conv.sin-leer small{color:var(--texto);font-weight:500}
.ms-conv__lado{display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.ms-conv time{font-size:11px;color:var(--tenue)}
.ms-conv b{display:grid;place-items:center;min-width:20px;height:20px;padding:0 6px;border-radius:10px;background:var(--azul);color:#fff;font-size:11px}
.ms-lista__pie{margin:0;padding:14px 20px;border-top:1px solid var(--linea);font-size:11.5px;line-height:1.5;color:var(--tenue)}
/* el hilo */
.ms-hilo{display:flex;flex-direction:column;min-height:0;min-width:0}
.ms-hilo__cabeza{display:flex;align-items:center;gap:14px;padding:16px 26px;border-bottom:1px solid var(--linea)}
.ms-hilo__cabeza img{width:44px;height:44px;border-radius:50%;object-fit:cover}
.ms-hilo__cabeza strong{display:block;font-size:15.5px;font-weight:600}
.ms-hilo__cabeza small{display:block;margin-top:2px;font-size:12px;color:var(--tenue)}
.ms-hilo__cabeza .enlace{margin-left:auto}
.ms-hilo__cuerpo{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:12px;padding:20px 26px 26px}
.ms-dia{display:flex;justify-content:center;margin:10px 0 4px}
.ms-dia span{padding:5px 12px;border-radius:999px;background:var(--linea2);font-size:11px;font-weight:600;color:var(--tenue)}
.ms-msg{display:flex;flex-direction:column;max-width:68%}
.ms-msg p{margin:0;padding:12px 16px;border-radius:16px;font-size:14.5px;line-height:1.5}
.ms-msg time{margin-top:5px;font-size:11px;color:var(--tenue)}
.ms-msg--mio{align-self:flex-end;align-items:flex-end}
.ms-msg--mio p{background:var(--azul);color:#fff;border-bottom-right-radius:4px}
.ms-msg--suyo{flex-direction:row;align-items:flex-end;gap:10px}
.ms-msg--suyo>div{display:flex;flex-direction:column}
.ms-msg--suyo p{background:var(--campo-fondo);border:1px solid var(--linea);border-bottom-left-radius:4px}
.ms-cara{flex:none;width:32px;height:32px;border-radius:50%;object-fit:cover}
.ms-msg--seguido{margin-top:-6px}
.ms-msg--nuevo{animation:zbSube .3s ease}
/* adjuntos: la clase y el minuto, o una grabación */
.ms-adjunto{display:flex;gap:12px;align-items:center;margin-bottom:6px;padding:8px;border:1px solid var(--linea);border-radius:12px;background:var(--fondo);cursor:pointer;text-align:left}
.ms-adjunto .img{position:relative;flex:none;width:120px;aspect-ratio:16/9;overflow:hidden;border-radius:7px}
.ms-adjunto img{width:100%;height:100%;object-fit:cover}
.ms-adjunto .img b{position:absolute;right:5px;bottom:5px;padding:2px 6px;border-radius:3px;background:var(--azul);color:#fff;font-size:10px}
.ms-adjunto small{display:block;font-size:9.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--azul-claro)}
.ms-adjunto strong{display:block;margin-top:4px;font-size:13px;font-weight:600;line-height:1.3}
.ms-adjunto em{display:block;margin-top:3px;font-style:normal;font-size:11.5px;color:var(--tenue)}
.ms-adjunto--grabacion .img{width:70px;aspect-ratio:9/16}
.ms-adjunto--grabacion .img i{position:absolute;left:50%;top:50%;display:grid;place-items:center;width:28px;height:28px;margin:-14px 0 0 -14px;border-radius:50%;background:rgba(255,255,255,.25);backdrop-filter:blur(4px);color:#fff;font-style:normal;font-size:10px}
.ms-adjunto--grabacion .img b{left:5px;right:auto;bottom:auto;top:5px;background:rgba(0,0,0,.65)}
.ms-adjunto--grabacion small{color:#e0405f}
/* escribir */
.ms-escribir{display:flex;align-items:flex-end;gap:12px;padding:14px 26px 20px;border-top:1px solid var(--linea)}
.ms-escribir__caja{flex:1;border:1px solid var(--linea);border-radius:12px;background:var(--campo-fondo);transition:border-color .2s,box-shadow .2s}
.ms-escribir__caja:focus-within{border-color:var(--azul);box-shadow:0 0 0 3px rgba(11,121,251,.12)}
.ms-escribir textarea{display:block;width:100%;padding:12px 14px 4px;border:0;background:none;resize:none;font:inherit;font-size:14.5px;color:var(--texto);outline:0}
.ms-escribir__barra{display:flex;align-items:center;justify-content:space-between;padding:6px 8px 8px 10px}
.ms-adjuntar{display:flex;gap:6px}
.ms-adjuntar button{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border:1px solid var(--linea);border-radius:6px;background:none;color:var(--texto2);font:inherit;font-size:12px;font-weight:600;cursor:pointer}
.ms-adjuntar button:hover{border-color:var(--texto)}
.ms-adjuntar svg{width:15px;height:15px}
.ms-escribir__barra small{font-size:11px;color:var(--tenue)}
.ms-enviar{display:grid;place-items:center;width:50px;height:50px;border:0;border-radius:50%;background:var(--linea);color:#fff;cursor:pointer;transition:background .2s}
.ms-enviar.listo{background:var(--azul)}
.ms-enviar svg{width:20px;height:20px}
/* ficha del profesor */
.ms-ficha{display:flex;flex-direction:column;align-items:center;gap:10px;padding:28px 22px;overflow-y:auto;border-left:1px solid var(--linea);text-align:center}
.ms-ficha__foto{width:96px;height:96px;border-radius:50%;overflow:hidden;box-shadow:0 0 0 3px var(--fondo),0 0 0 5px var(--azul)}
.ms-ficha__foto img{width:100%;height:100%;object-fit:cover}
.ms-ficha>strong{margin-top:6px;font-family:var(--titular);font-weight:700;font-size:18px;text-transform:uppercase}
.ms-ficha .pf-titulo{font-size:8.5px}
.ms-ficha .rotulo{align-self:stretch;margin:18px 0 0;padding-top:16px;border-top:1px solid var(--linea);font-size:9.5px;text-align:left}
.ms-ficha__curso{display:flex;align-self:stretch;gap:12px;align-items:center;text-align:left;cursor:pointer}
.ms-ficha__curso img{width:54px;aspect-ratio:515/730;object-fit:cover;border-radius:5px}
.ms-ficha__curso strong{display:block;font-size:13.5px;font-weight:600}
.ms-ficha__curso small{display:block;margin-top:3px;font-size:11.5px;color:var(--tenue)}
.ms-ficha__compartido{display:flex;align-self:stretch;gap:8px}
.ms-ficha__compartido span{position:relative;flex:1;aspect-ratio:1;overflow:hidden;border-radius:6px}
.ms-ficha__compartido img{width:100%;height:100%;object-fit:cover}
.ms-ficha__compartido i{position:absolute;left:5px;bottom:5px;padding:2px 6px;border-radius:3px;background:rgba(0,0,0,.7);color:#fff;font-style:normal;font-size:9.5px;font-weight:700}
.ms-ficha>.enlace{margin-top:auto;padding-top:20px}
/* la mensajería ocupa la pantalla justa (en la maqueta, quitando también la barra de pestañas de arriba) */
.ms{height:calc(100vh - 190px);min-height:560px}
.ms-lista__cabeza h1{font-size:22px}
.ms-lista__cabeza{gap:12px}

/* ===== mensajería: como la de la academia (bandeja por estados, hilos con asunto, cuatro puertas) ===== */
.ms{grid-template-columns:370px minmax(0,1fr)}
.ms-lista__cabeza h1{font-size:24px}
.ms-escribe{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;font-size:10.5px}
.ms-escribe svg{width:14px;height:14px}
.ms-lista__intro{margin:0;padding:0 20px 14px;font-size:12.5px;color:var(--tenue);border-bottom:1px solid var(--linea)}
.ms-grupo{margin:0;padding:16px 20px 6px;font-size:9.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--tenue)}
.ms-grupo b{margin-left:4px;color:var(--texto)}
.ms-conv{grid-template-columns:42px minmax(0,1fr) auto;align-items:start;padding:12px 20px}
.ms-conv>img,.ms-conv>b{width:42px;height:42px;border-radius:50%;object-fit:cover}
.ms-conv>b{display:grid;place-items:center;background:#000;color:#fff;font-family:var(--titular);font-size:12px}
.ms-conv strong{margin-top:6px;font-size:13.5px;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ms-conv small{margin-top:2px}
.ms-conv--nueva strong{color:var(--texto)}
.ms-conv--leido{opacity:.75}
.ms-enviada{padding:3px 8px;border-radius:999px;background:var(--linea2);font-style:normal;font-size:10px;font-weight:600;color:var(--tenue)}
.ms-tag{display:inline-block;padding:3px 8px;border-radius:3px;background:rgba(11,121,251,.12);color:var(--azul-claro);font-size:9px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.ms-tag--particular{background:rgba(245,179,1,.16);color:#b07d00}
.ms-tag--grabacion{background:rgba(255,77,109,.12);color:#e0405f}
/* el hilo */
.ms-centro{display:flex;flex-direction:column;min-height:0;min-width:0}
.ms-hilo,.ms-nuevo-msg{display:flex;flex-direction:column;flex:1;min-height:0}
.ms-hilo[hidden],.ms-nuevo-msg[hidden]{display:none}
.ms-hilo__cabeza{display:block;padding:20px 30px 16px}
.ms-hilo__cabeza h2{margin:10px 0 0;font-size:24px;line-height:1.05}
.ms-hilo__cabeza small{display:block;margin-top:6px;font-size:12.5px;color:var(--tenue)}
.ms-hilo__cabeza small b{color:var(--texto)}
.ms-contexto{display:flex;align-items:center;gap:14px;margin:0 30px 6px;padding:10px;border:1px solid var(--linea);border-radius:8px;background:var(--campo-fondo);cursor:pointer}
.ms-contexto .img{flex:none;width:110px;aspect-ratio:16/9;overflow:hidden;border-radius:5px}
.ms-contexto img{width:100%;height:100%;object-fit:cover}
.ms-contexto small{display:block;font-size:9.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--tenue)}
.ms-contexto strong{display:block;margin-top:3px;font-size:14px;font-weight:600}
.ms-contexto em{display:block;margin-top:2px;font-style:normal;font-size:12px;color:var(--tenue)}
.ms-contexto .enlace{margin-left:auto;margin-right:8px}
.ms-particular{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;margin:0 30px 6px;border:1px solid rgba(245,179,1,.4);border-radius:8px;background:rgba(245,179,1,.4);overflow:hidden}
.ms-particular div{padding:12px 14px;background:var(--campo-fondo)}
.ms-particular dt{font-size:9.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#b07d00}
.ms-particular dd{margin:5px 0 0;font-size:13px;font-weight:600}
.ms-firma{margin-bottom:4px;font-size:11.5px;font-weight:600;color:var(--tenue)}
.ms-firma em{font-style:normal;color:var(--azul-claro)}
.ms-msg--nueva p{border-color:var(--azul);box-shadow:0 0 0 1px var(--azul)}
.ms-cara--rd{display:grid;place-items:center;background:#000;color:#fff;font-family:var(--titular);font-size:10px}
.ms-esperando{display:flex;align-items:center;gap:10px;align-self:flex-end;margin:4px 0 0;font-size:12.5px;color:var(--tenue)}
.ms-esperando span{display:flex;gap:4px}
.ms-esperando i{width:6px;height:6px;border-radius:50%;background:var(--tenue);animation:msPunto 1.4s infinite ease-in-out}
.ms-esperando i:nth-child(2){animation-delay:.2s}.ms-esperando i:nth-child(3){animation-delay:.4s}
@keyframes msPunto{0%,80%,100%{opacity:.25}40%{opacity:1}}
.ms-escribir__caja{display:flex;align-items:flex-end}
.ms-escribir__caja textarea{flex:1}
.ms-escribir__caja small{padding:0 12px 10px;font-size:11px;color:var(--tenue);white-space:nowrap}
/* escribir: las cuatro puertas */
.ms-nuevo-msg{overflow-y:auto}
.ms-puertas{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;padding:4px 30px 0}
.ms-puertas a{display:flex;flex-direction:column;gap:6px;padding:16px;border:1px solid var(--linea);border-radius:8px;background:var(--campo-fondo);cursor:pointer;transition:border-color .2s,box-shadow .2s}
.ms-puertas a span{font-size:18px;color:var(--tenue)}
.ms-puertas a strong{font-size:14px;font-weight:600}
.ms-puertas a small{font-size:11.5px;color:var(--tenue);line-height:1.35}
.ms-puertas a.on{border-color:var(--azul);box-shadow:inset 0 0 0 1px var(--azul)}
.ms-puertas a.on span{color:var(--azul)}
.ms-puertas a.especial.on{border-color:#d9a000;box-shadow:inset 0 0 0 1px #d9a000}
.ms-puertas a.especial.on span{color:#d9a000}
.ms-form{margin:20px 30px 30px;padding:24px;border:1px solid var(--linea);border-radius:10px;background:var(--campo-fondo)}
.ms-campo{margin-bottom:18px}
.ms-campo label{display:block;margin:0 0 8px;font-size:9.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--tenue)}
.ms-campo select,.ms-campo input,.ms-campo textarea{width:100%;padding:11px 13px;border:1px solid var(--linea);border-radius:6px;background:var(--fondo);font:inherit;font-size:14px;color:var(--texto);outline:0}
.ms-campo select:focus,.ms-campo input:focus,.ms-campo textarea:focus{border-color:var(--azul)}
.ms-a-quien{margin:6px 0 0;font-size:12px;color:var(--tenue)}
.ms-a-quien b{color:var(--texto)}
.ms-dos{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.ms-alterna{display:flex;padding:3px;border:1px solid var(--linea);border-radius:6px;background:var(--fondo)}
.ms-alterna a{flex:1;padding:8px;border-radius:4px;text-align:center;font-size:13px;font-weight:600;color:var(--tenue);cursor:pointer}
.ms-alterna a.on{background:var(--texto);color:var(--fondo)}
.ms-form__pie{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:18px;border-top:1px solid var(--linea)}
.ms-form__pie p{margin:0;font-size:12.5px;color:var(--tenue)}
.ms-solo-clase,.ms-solo-curso,.ms-solo-particular{display:none}
.ms-form[data-puerta="clase"] .ms-solo-clase,.ms-form[data-puerta="curso"] .ms-solo-curso{display:block}
.ms-form[data-puerta="particular"] .ms-solo-particular{display:block}
.ms-form[data-puerta="particular"] .ms-dos.ms-solo-particular{display:grid}
.ms-form[data-puerta="particular"] .ms-sin-particular{display:none}
.ms-campo label.ms-solo-particular,.ms-form__pie .btn .ms-solo-particular{display:none}
.ms-form[data-puerta="particular"] .ms-campo label.ms-solo-particular,.ms-form[data-puerta="particular"] .ms-form__pie .btn .ms-solo-particular{display:inline}
.ms-form[data-puerta="particular"] .ms-campo label.ms-sin-particular,.ms-form[data-puerta="particular"] .ms-form__pie .btn .ms-sin-particular{display:none}
.ms-form[data-puerta="particular"] .ms-campo label.ms-solo-particular{display:block}
.ms-error{margin:0 0 14px;padding:10px 14px;border-left:3px solid #dc2626;background:rgba(220,38,38,.08);font-size:14px}
.ms-form[data-puerta="particular"] .btn{background:#d9a000;border-color:#d9a000}
/* mensajería: los cuatro accesos, siempre a la vista arriba */
.ms{grid-template-rows:auto minmax(0,1fr)}
.ms-acciones{grid-column:1 / -1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) minmax(0,1.35fr);gap:10px;padding:14px 20px;border-bottom:1px solid var(--linea);background:var(--fondo)}
.ms-acciones a{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid var(--linea);border-radius:8px;background:var(--campo-fondo);cursor:pointer;transition:border-color .2s,transform .2s}
.ms-acciones a:hover{border-color:var(--azul);transform:translateY(-2px)}
.ms-acciones a>span:first-child{display:grid;place-items:center;flex:none;width:36px;height:36px;border-radius:8px;background:rgba(11,121,251,.12);color:var(--azul);font-size:15px}
.ms-acciones strong{display:block;font-size:13.5px;font-weight:600}
.ms-acciones small{display:block;margin-top:2px;font-size:11.5px;color:var(--tenue)}
.ms-acciones__particular{border-color:rgba(217,160,0,.55)!important;background:linear-gradient(120deg,rgba(245,179,1,.14),var(--campo-fondo) 70%)!important}
.ms-acciones__particular>span:first-child{background:#d9a000!important;color:#fff!important}
.ms-acciones__particular em{margin-left:auto;padding:8px 12px;border-radius:5px;background:#d9a000;color:#fff;font-style:normal;font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;white-space:nowrap}

/* ================= en la web (no en la maqueta) =================
   La maqueta tiene arriba su propia barra (el selector de páginas, 42 px) y lo
   fijo se colocaba debajo. En la web esa barra no existe: lo fijo va arriba. */
.selector,.actual{display:none!important}
.zn-barra,.cuenta__menu,.taller__fijo{top:0}
.taller__fijo{height:100vh}
.zn-menu{top:68px;height:calc(100vh - 68px)}
.ms{height:calc(100vh - 68px)}
/* sin interruptor de modo noche/día: la web lleva siempre su diseño */
.nav__tema{display:none!important}
.nav a,.pie-web a{color:inherit;text-decoration:none}

/* ================= móvil y tableta (la maqueta solo se dibujó en ordenador) ================= */
.nav__menu{display:none}
@media (max-width:1100px){
  .nav{gap:16px;padding:0 20px}
  .nav__buscar{display:none}
  .nav nav{gap:18px}
  .cl-rejilla{grid-template-columns:minmax(0,1fr)}
  .cl-cola{max-height:420px}
  .cl-ficha{grid-template-columns:minmax(0,1fr);gap:36px}
}
@media (max-width:820px){
  .nav{position:sticky;top:0;z-index:50;height:60px;justify-content:space-between}
  .nav__menu{display:grid;place-items:center;width:42px;height:42px;border:1px solid var(--linea);border-radius:var(--boton);background:none;color:var(--texto);font-size:18px}
  .nav nav{display:none;position:absolute;left:0;right:0;top:60px;flex-direction:column;align-items:stretch;gap:0;padding:8px 20px 16px;background:var(--fondo);border-bottom:1px solid var(--linea)}
  .nav.abierto nav{display:flex}
  .nav nav a{padding:14px 0;border-bottom:1px solid var(--linea2)}
  .franja{--lado:18px;padding-left:18px;padding-right:18px}
  .seccion{padding-top:44px;padding-bottom:44px}
  h1{font-size:clamp(30px,9vw,46px)}
  h2{font-size:clamp(24px,7vw,34px)}
  .pie-web{grid-template-columns:1fr 1fr;gap:28px;padding:40px 18px 24px}
  .pie-web>div:first-child{grid-column:1/-1}
  .cl-sala{padding:10px 0 18px}
  .cl-migas{flex-wrap:wrap;gap:8px 14px;padding:6px 14px 12px;font-size:10px}
  .cl-migas__barra{flex-basis:100%}
  .cl-video{border-radius:0}
  .cl-cola{margin:0 12px;max-height:none}
  .cl-ficha .acciones{display:flex;flex-direction:column;align-items:stretch}
  .cl-amigo{grid-template-columns:auto minmax(0,1fr)}
  .cl-amigo__botones{grid-column:1/-1;flex-direction:row!important;justify-content:space-between}
  .cl-invita{grid-template-columns:96px minmax(0,1fr);gap:16px;padding:16px}
  .cl-vecinas{grid-template-columns:minmax(0,1fr)}
  .cl-vecina{grid-template-columns:minmax(0,40%) minmax(0,1fr);gap:14px;padding:12px}
  .cl-vecina strong{font-size:15px}
  .cl-profe{grid-template-columns:96px minmax(0,1fr);gap:16px;padding:16px}
  .cl-profe .acciones{display:flex;flex-wrap:wrap;gap:10px}
  .cl-barra{left:10px;right:10px;bottom:10px}
  .cl-barra span{font-size:13px}
}
@media (max-width:820px){
  html,body{overflow-x:hidden}
  .cl-ficha>*,.cl-lado,.cl-invita>div,.cl-vecina__texto,.cl-amigo>div{min-width:0}
  .cl-ficha h1,.cl-vecina strong{overflow-wrap:break-word;hyphens:auto}
  .cl-valora{flex-wrap:wrap;gap:10px}
  .cl-valora__estrellas i{font-size:26px}
  .cl-amigo strong{font-size:15px}
  .indice{flex-wrap:wrap}
}
/* ficha de curso y cursos, en pantallas estrechas */
@media (max-width:1100px){
  .cur-rejilla{grid-template-columns:repeat(3,minmax(0,1fr))}
  .fc-profe{grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:36px}
  .fc-clase__panel{grid-template-columns:260px minmax(0,1fr)}
}
@media (max-width:820px){
  .cur-cabeza{flex-direction:column;align-items:flex-start;gap:12px;padding:28px 18px 18px}
  .cur-cabeza__dato{flex-wrap:wrap}
  .cur-banda{padding-left:12px;padding-right:12px}
  .cur-destacado{height:auto;min-height:560px}
  .cur-filtros{position:static;gap:8px 18px}
  .cur-filtros .opciones{flex-wrap:wrap}
  .cur-rejilla{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 12px}
  .cur-lista{padding-left:18px;padding-right:18px}
  .cierre{flex-direction:column;align-items:flex-start;gap:20px;padding:40px 18px}
  .fc-hero{padding:10px 10px 14px}
  .fc-lienzo{height:auto;min-height:0;border-radius:14px}
  .fc-lienzo__texto{position:relative;padding:28px 20px 20px}
  .fc-datos{width:100%}
  .fc-tablero{position:relative;right:auto;bottom:auto;width:auto;margin:0 14px 16px}
  .fc-curso{grid-template-columns:minmax(0,1fr)!important}
  .fc-claves{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fc-clase__fila{grid-template-columns:44px minmax(0,1fr) 56px 20px;padding:16px 8px}
  .fc-clase__estado{display:none}
  .fc-clase__panel{grid-template-columns:minmax(0,1fr)}
  .fc-profe{grid-template-columns:minmax(0,1fr);gap:24px}
  .fc-profe .img{max-width:260px}
  .fc-opiniones__lista{grid-template-columns:minmax(0,1fr)!important}
  .fc-barra{left:10px;right:10px;bottom:10px}
}
@media (max-width:480px){
  .cur-rejilla{grid-template-columns:minmax(0,1fr)}
}
/* «lo que hay dentro»: la serie especial, doble de ancha, cuando se mira «Series» */
.dentro .cartel--serie-prota{flex:0 0 calc((100% - 48px - 80px) / 5 * 2 + 20px);position:relative}
.dentro .cartel--serie-prota .img{position:absolute;inset:0;aspect-ratio:auto;overflow:hidden;border-radius:var(--grande,6px);background:#000}
.dentro .cartel--serie-prota .img video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.dentro .cartel--serie-prota .img::before{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(to top,rgba(0,0,0,.92),rgba(0,0,0,.35) 55%,rgba(0,0,0,.05))}
.dentro .cartel--serie-prota .cartel__texto{z-index:2;left:26px;right:26px;bottom:26px}
.dentro .cartel--serie-prota strong{font-size:clamp(24px,2.5vw,38px);margin-top:12px}
.dentro .cartel--serie-prota .cartel__destacado,.dentro .cartel--serie-prota .cartel__frase{display:block}
.dentro .cartel--serie-prota .cartel__destacado{display:inline-block}
@media (max-width:820px){.dentro .cartel--serie-prota{flex-basis:85%}}
.dentro .cartel--serie-prota .cartel__destacado{margin-bottom:14px;padding:6px 10px;background:#fff;color:#000;border-radius:3px;font-size:9.5px;font-weight:700;letter-spacing:.18em;text-transform:uppercase}
.dentro .cartel--serie-prota .cartel__frase{max-width:44ch;margin-top:12px;font-size:14px;line-height:1.55;color:#e2e2e2}
/* el curso destacado: su vídeo de fondo siempre corriendo */
.cartel__fondo-video video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:1!important}
.dentro .cartel--serie-prota .img video{opacity:1!important}

/* ================= SUSCRÍBETE ================= */
.sb-cabeza{align-items:flex-end}
.sb-sub{margin:10px 0 0;max-width:52ch;font-size:15px;line-height:1.55;color:var(--tenue)}
.sb-estrellas{width:auto!important;height:auto!important;background:none!important;font-style:normal;color:#f5b301;letter-spacing:2px;margin-right:8px}
.sb-planes{padding-top:10px}
/* C · según lo que buscas */
.sb-pregunta{margin:0 0 18px;font-family:var(--titular);font-weight:700;font-size:clamp(24px,2.6vw,38px);text-transform:uppercase;text-align:center}
.sb-puertas{display:grid;grid-template-columns:1fr 1.25fr 1fr;gap:16px;align-items:stretch}
.sb-puerta{display:flex;flex-direction:column;padding:28px 26px;border:1px solid var(--linea);border-radius:8px;background:var(--campo-fondo);cursor:pointer;transition:transform .25s,box-shadow .25s,border-color .25s}
.sb-puerta:hover{transform:translateY(-4px);border-color:var(--texto);box-shadow:0 18px 36px rgba(0,0,0,.1)}
.sb-puerta .rotulo{margin:0;color:var(--azul-claro)}
.sb-puerta strong{display:block;margin-top:10px;font-family:var(--titular);font-weight:700;font-size:22px;line-height:1;text-transform:uppercase}
.sb-puerta>small{display:block;margin-top:8px;font-size:13.5px;line-height:1.5;color:var(--tenue)}
.sb-puerta__plan{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin:22px 0 4px;padding-top:18px;border-top:1px solid var(--linea)}
.sb-puerta__plan b{font-family:var(--titular);font-size:36px;line-height:1}
.sb-puerta__plan em{font-style:normal;font-size:12px;color:var(--tenue)}
.sb-puerta__plan i{flex-basis:100%;font-style:normal;font-size:10px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--tenue)}
.sb-puerta .lista-rayas{flex:1;margin:14px 0 22px}
.sb-puerta .btn{align-self:stretch;text-align:center}
.sb-puerta--prota{background:#000;color:#fff;border-color:var(--azul);box-shadow:0 0 0 1px var(--azul),0 24px 50px rgba(11,121,251,.25);transform:translateY(-10px)}
.sb-puerta--prota:hover{transform:translateY(-14px);border-color:var(--azul)}
.sb-puerta--prota .rotulo{color:#6fb1ff}
.sb-puerta--prota>small,.sb-puerta--prota .sb-puerta__plan em,.sb-puerta--prota .sb-puerta__plan i{color:#9c9c9c}
.sb-puerta--prota .sb-puerta__plan{border-top-color:rgba(255,255,255,.16)}
.sb-puerta--prota .lista-rayas li{color:#cfcfcf}
.sb-mensual{margin:26px 0 0;text-align:center;font-size:14px;color:var(--tenue)}
.sb-mensual b{color:var(--texto)}
/* en todos los planes */
.sb-todos{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:50px;align-items:center}
.sb-herramientas{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:0;padding:0}
.sb-herramientas li{display:flex;flex-direction:column;align-items:center;gap:10px;padding:20px 10px;border:1px solid rgba(255,255,255,.14);border-radius:8px;text-align:center;font-size:12px;font-weight:600}
.sb-herramientas svg{width:26px;height:26px;color:#6fb1ff}
/* garantías */
.sb-garantias{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;padding-top:40px;padding-bottom:40px}
.sb-garantias div{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;align-items:center}
.sb-garantias b{grid-row:span 2;display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:rgba(11,121,251,.1);color:var(--azul)}
.sb-garantias b svg{width:22px;height:22px}
.sb-garantias strong{font-size:14.5px;font-weight:600}
.sb-garantias small{font-size:12.5px;color:var(--tenue)}

/* suscríbete · A + C */
.sb--d .sb-puertas{grid-template-columns:minmax(0,1fr) minmax(0,1.7fr) minmax(0,1fr);align-items:start}
.sb--d .sb-puerta{margin-top:40px;cursor:default}
.sb--d .sb-puerta:hover{transform:none;box-shadow:none;border-color:var(--linea)}
.sb-puerta--oferta{background:#000;color:#fff;border:1px dashed var(--azul)!important}
.sb-puerta--oferta .rotulo{color:#6fb1ff}.sb-puerta--oferta>small,.sb-puerta--oferta .sb-puerta__plan em,.sb-puerta--oferta .sb-puerta__plan i{color:#9c9c9c}
.sb-puerta--oferta .sb-puerta__plan{border-top-color:rgba(255,255,255,.16)}.sb-puerta--oferta .lista-rayas li{color:#cfcfcf}
.sb-prota{position:relative;padding:40px 40px 34px;border:1px solid var(--azul);border-radius:var(--grande);background:linear-gradient(160deg,rgba(11,121,251,.16),rgba(11,121,251,.02) 55%),var(--fondo);box-shadow:0 0 70px rgba(11,121,251,.22)}
.sb-prota h3{margin-top:18px;font-size:clamp(28px,3vw,44px);line-height:.95}
.sb-prota__frase{margin-top:12px;font-size:15px;line-height:1.55;color:var(--texto2)}
.sb-prota__como{margin:26px 0 10px}
.sb-pagos{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.sb-pago{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:18px 18px 16px;border:1.5px solid var(--linea);border-radius:10px;background:var(--campo-fondo);color:var(--texto);font:inherit;text-align:left;cursor:pointer;transition:border-color .2s,box-shadow .2s}
.sb-pago:hover{border-color:var(--texto)}
.sb-pago.on{border-color:var(--azul);box-shadow:0 0 0 3px rgba(11,121,251,.18);background:var(--fondo)}
.sb-pago__ceja{display:flex;flex-wrap:wrap;gap:6px 8px;align-items:center;font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.sb-pago__ceja em{font-style:normal;letter-spacing:.06em;padding:3px 7px;border-radius:4px;background:var(--azul);color:#fff;font-size:10px}
.sb-pago b{font-family:var(--titular);font-size:clamp(30px,3vw,42px);line-height:1}
.sb-pago b small{font-family:inherit;font-size:13px;margin-left:4px;color:var(--tenue)}
.sb-pago__nota{font-size:12.5px;line-height:1.45;color:var(--tenue)}
.sb-prota__boton{display:block;margin-top:18px;text-align:center}
.sb-prota[data-pago="completo"] .solo-mes,.sb-prota[data-pago="mensual"] .solo-completo{display:none}
.sb-prota__incluye{margin-top:26px;padding-top:20px;border-top:1px solid var(--linea)}
.sb-prota__incluye .lista-rayas{display:grid;grid-template-columns:1fr 1fr;column-gap:28px;margin-top:6px}
.sb-suelto{margin-top:18px}
@media (max-width:900px){.sb--d .sb-puertas{grid-template-columns:minmax(0,1fr)}.sb--d .sb-prota{order:-1}.sb--d .sb-puerta{margin-top:0}.sb-pagos,.sb-prota__incluye .lista-rayas{grid-template-columns:minmax(0,1fr)}}
.sb-pago b{white-space:nowrap;font-size:clamp(26px,2.4vw,36px)}
.sb-prota .solo-completo,.sb-prota .solo-mes{display:block}
.btn.es-tuyo{opacity:.55;pointer-events:none}
@media (max-width:820px){.sb-cabeza{flex-direction:column;align-items:flex-start;gap:18px}.sb-todos{grid-template-columns:minmax(0,1fr);gap:28px}.sb-herramientas{grid-template-columns:repeat(2,minmax(0,1fr))}.sb-garantias{grid-template-columns:minmax(0,1fr)}.sb-prota{padding:30px 22px}.sb-pago b{font-size:30px}}
@media (max-width:820px){.sb-cabeza>div{width:100%;min-width:0}.sb-cabeza h1{font-size:clamp(34px,11.5vw,56px)}.sb-cabeza .cur-cabeza__dato{white-space:normal;row-gap:6px}.sb-planes{padding-left:16px;padding-right:16px}.sb-pregunta{font-size:24px}}

/* ================= ENTRAR / CREAR CUENTA ================= */
.ac-escena{position:relative;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);min-height:calc(100vh - 112px)}
.ac-foto{position:relative;display:flex;align-items:flex-end;padding:56px 52px;overflow:hidden;background:#000}
.ac-foto video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.55) saturate(.85)}
.ac-foto::after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.75),transparent 55%)}
.ac-foto__texto{position:relative;z-index:1}
.ac-foto h2{margin-top:14px;max-width:11ch;font-size:clamp(34px,4vw,64px);line-height:.92}
.ac-foto__datos{display:flex;flex-wrap:wrap;gap:10px 26px;margin:24px 0 0;font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:#bdbdbd}
.ac-foto__datos b{margin-right:6px;font-family:var(--titular);font-size:24px;letter-spacing:0;color:#fff}
.ac-lado{display:flex;align-items:center;justify-content:center;padding:96px 48px 56px}
.ac-form{width:100%;max-width:470px}
.ac-pestanas{display:flex;gap:6px;margin:0 0 34px;padding:5px;border:1px solid var(--linea);border-radius:999px;background:var(--campo-fondo)}
.ac-pestanas a{flex:1;padding:12px 10px;border-radius:999px;text-align:center;font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--tenue);cursor:pointer;transition:background .2s,color .2s}
.ac-pestanas a.on{background:var(--texto);color:var(--fondo)}
.ac-modo{display:none}
.ac-form[data-modo="entrar"] .ac-modo--entrar,.ac-form[data-modo="crear"] .ac-modo--crear,.ac-form[data-modo="olvido"] .ac-modo--olvido{display:block;animation:ac-entra .35s ease}
.ac-form[data-modo="olvido"] .ac-pestanas{visibility:hidden}
@keyframes ac-entra{from{opacity:0;transform:translateY(8px)}}
.ac-titulo{margin:0;font-family:var(--titular);font-weight:700;font-size:clamp(34px,3.4vw,52px);line-height:.92;text-transform:uppercase}
.ac-sub{margin:12px 0 26px;font-size:15px;line-height:1.55;color:var(--tenue)}
.ac-redes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.ac-red{display:flex;align-items:center;justify-content:center;gap:10px;padding:14px 10px;border:1px solid var(--linea);border-radius:var(--campo);background:var(--campo-fondo);font-size:14px;cursor:pointer;transition:border-color .2s,transform .2s}
.ac-red:hover{border-color:var(--texto);transform:translateY(-2px)}
.ac-red svg{width:20px;height:20px;flex:0 0 auto}
.ac-red b{font-weight:600}
.ac-form label{display:block;margin-top:16px;font-size:10.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase}
.ac-clave{position:relative;padding-right:52px}
.ac-ojo{position:absolute;top:50%;right:16px;transform:translateY(-50%);display:grid;color:var(--tenue);cursor:pointer}
.ac-ojo svg{width:20px;height:20px}
.ac-dos{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.ac-fila{display:flex;justify-content:space-between;align-items:center;gap:14px;margin:18px 0 22px;font-size:13.5px}
.ac-casilla{display:flex;align-items:center;gap:10px;cursor:pointer;color:var(--texto2)}
.ac-casilla i{display:grid;place-items:center;width:20px;height:20px;flex:0 0 auto;border:1.5px solid var(--borde-campo);border-radius:5px}
.ac-casilla.on i{border-color:var(--azul);background:var(--azul)}
.ac-casilla.on i::after{content:'';width:9px;height:5px;border:2px solid #fff;border-top:0;border-right:0;transform:translateY(-1px) rotate(-45deg)}
.ac-fila .enlace{white-space:nowrap}
.ac-pie{margin:22px 0 0;text-align:center;font-size:14px;color:var(--tenue)}
.ac-volver{display:inline-block;margin-bottom:22px;font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--tenue);cursor:pointer}
.ac-modo--olvido .btn{margin-top:22px}
/* B · la tarjeta crema flotando sobre el vídeo, que ocupa toda la pantalla */
@media (max-width:900px){.ac-escena{grid-template-columns:minmax(0,1fr)}.ac-foto{min-height:260px;padding:32px 20px}.ac-lado{padding:36px 18px 48px}
  .ac-redes{grid-template-columns:minmax(0,1fr)}.ac-dos{grid-template-columns:minmax(0,1fr);gap:0}.ac-fila{flex-direction:column;align-items:flex-start}}
.ac-casilla .enlace{font-size:inherit;font-weight:600;letter-spacing:0;text-transform:none;padding:0}

/* acceso: el vídeo como en el hero de la portada (sin oscurecer, mismo encuadre y esquinas) */
.ac-foto{border-radius:0 34px 34px 0}
.ac-foto video{filter:none;object-position:center 30%}
.ac-foto::after{background:linear-gradient(0deg,rgba(0,0,0,.8),rgba(0,0,0,.25) 38%,transparent 60%)}
@media (max-width:900px){.ac-foto{border-radius:0 0 26px 26px;min-height:320px}}
.ac-pagina .ac-escena{min-height:calc(100vh - 70px)}
.ac-caja{position:relative;display:block}
.ac-form input.campo{width:100%;font:inherit;font-size:15px;color:var(--texto);outline:none}
.ac-form input.campo::placeholder{color:var(--tenue)}
.ac-form input.campo:focus{border-color:var(--azul);box-shadow:0 0 0 1px var(--azul)}
.ac-form input.campo--mal{border-color:#e5484d;box-shadow:0 0 0 1px #e5484d}
.ac-error{display:block;margin-top:7px;font-size:13px;color:#d1383d}
.ac-aviso{margin:12px 0 22px;padding:14px 16px;border-left:3px solid var(--azul);background:rgba(11,121,251,.08);font-size:14.5px;line-height:1.5}
.ac-casilla input{position:absolute;opacity:0;width:0;height:0}
.ac-casilla input:checked+i{border-color:var(--azul);background:var(--azul)}
.ac-casilla input:checked+i::after{content:'';width:9px;height:5px;border:2px solid #fff;border-top:0;border-right:0;transform:translateY(-1px) rotate(-45deg)}
.ac-casilla input:focus-visible+i{box-shadow:0 0 0 3px rgba(11,121,251,.3)}
.ac-casilla{position:relative;margin:0!important;font-size:13.5px!important;font-weight:400!important;letter-spacing:0!important;text-transform:none!important}
.ac-red{color:var(--texto);text-decoration:none}
.ac-ojo.on{color:var(--azul)}
.ac-robot{margin-top:18px}
.ac-form button.btn{border:0;cursor:pointer}
.ac-form button.btn:disabled{opacity:.6}
.ac-modo--olvido .ac-volver{margin-top:0}
.ac-caja.ac-clave{padding-right:0}
.ac-clave input.campo{padding-right:52px}
.ac-form .ac-casilla{display:flex;align-items:center;gap:10px}
.ac-form button.btn--ancho{display:block;width:100%}
.ac-form input.campo{font-weight:400}
@media (max-width:900px){.ac-pagina .ac-escena{min-height:0}.ac-pagina .ac-lado{padding-top:28px}}
.zn-caja__vacio{margin:10px 0 14px;font-size:14px;line-height:1.5;color:var(--tenue)}
.zn-agenda li a{display:block;color:inherit}
.zn-yo__foto img{width:100%;height:100%;border-radius:50%;object-fit:cover}
/* zona en la web: la barra pegada arriba (en la maqueta deja sitio a la barra de diseños) */
.zn-barra{top:0}
.zn-yo__foto{overflow:hidden;flex:0 0 auto}
/* zona en el móvil (provisional, hasta diseñarla): el menú sale desde ☰ y el contenido ocupa todo */
@media (max-width:820px){
  .zn-barra{gap:14px;height:60px;padding:0 14px}
  .zn-buscar,.zn-yo>span:nth-child(2),.zn-yo>i{display:none}
  .zn-barra__der{margin-left:auto}
  .zn-cuerpo,.zn.plegado .zn-cuerpo{display:block}
  .zn-menu{position:fixed;top:60px;left:0;bottom:0;z-index:39;width:min(280px,82vw);height:auto;transform:translateX(-105%);transition:transform .25s ease;box-shadow:20px 0 40px rgba(0,0,0,.4)}
  .zn.abierto .zn-menu{transform:none}
  .zn-contenido{padding:14px 12px 60px}
  .zn-arriba{grid-template-columns:minmax(0,1fr)}
  .zn-sigue__texto strong{font-size:30px}
  .zn-cifras{grid-template-columns:repeat(2,minmax(0,1fr))}
  .zn-fila__cabeza{flex-wrap:wrap;gap:4px 14px}
  .zn-fila__cabeza h2{font-size:24px}
  .zn-fila__cabeza .rotulo{order:3;flex-basis:100%}
  .zn-fila__cabeza .enlace{margin-left:auto}
}
/* inicio de la zona: la serie destacada, en doble y con su vídeo, a la altura de los carteles */
.zn-carril--series .zn-serie--prota{flex:0 0 540px;align-self:flex-start}
.zn-serie--prota .img{min-height:0;aspect-ratio:auto;height:calc(262px * 16 / 9)}
@media (max-width:820px){.zn-carril--series .zn-serie--prota{flex-basis:86vw}.zn-serie--prota .img{height:min(130vw,466px)}.zn-serie--prota .zn-curso__texto{right:20px}}
.zn-guardada{display:flex;align-items:center;gap:6px;margin-top:8px;font-size:12px;color:var(--tenue)}
.zn-guardada b{color:#e5484d;font-size:13px}
/* biblioteca de la zona: lo filtrado y lo que espera a «Cargar más», fuera */
.zb-rejilla>[hidden],.zb-mas[hidden],.zb-activos[hidden],.zb-ventana[hidden]{display:none}
.zb-mas button{cursor:pointer}
/* profesores: tarjetas algo más grandes (5 por fila en vez de 6) */
.zb-estilo .zb-profe{flex:0 0 calc((100% - 4 * 16px - 28px) / 5)}
.zb-rejilla--profes{grid-template-columns:repeat(5,minmax(0,1fr))}
.zb-profe strong{font-size:16px}
@media (max-width:820px){.zb-estilo .zb-profe{flex-basis:62vw}.zb-rejilla--profes{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* favoritos: el play, centrado en la imagen de la siguiente clase */
.mc-actual__siguiente .img{position:relative;display:block;overflow:hidden}
/* favoritos: el vídeo de «sigue con tu serie / tu clase» llena toda la altura de la tarjeta */
.fv-ahora__video{aspect-ratio:auto;min-height:300px;height:100%}
@media (max-width:820px){.fv-ahora{grid-template-columns:minmax(0,1fr)}.fv-ahora__video{min-height:0;aspect-ratio:16/9}}
/* el corazón de favoritos de la zona: círculo blanco con un corazón dibujado; sale al pasar y se queda si está guardada */
.corazon[data-fav]{top:10px;right:10px;width:38px;height:38px;border-radius:50%;background:#fff;color:#0b0b0d;box-shadow:0 4px 14px rgba(0,0,0,.25);cursor:pointer;z-index:2;transition:opacity .25s,transform .15s}
.corazon[data-fav] svg{display:block;width:20px;height:20px;overflow:visible}
.corazon[data-fav] path{fill:none;stroke:currentColor;stroke-width:2;stroke-linejoin:round;transition:fill .2s,stroke .2s}
.corazon[data-fav].on{opacity:1;background:#fff;color:#ff3b5c}
.corazon[data-fav].on path{fill:#ff3b5c;stroke:#ff3b5c}
.corazon[data-fav]:active{transform:scale(.9)}
.corazon[data-fav].late svg{animation:rd-late .45s ease}
@keyframes rd-late{0%{transform:scale(1)}30%{transform:scale(1.35)}60%{transform:scale(.9)}100%{transform:scale(1)}}
@media (hover:none){.corazon[data-fav]{opacity:1}}
/* el corazón elegido es el A (círculo oscuro), y algo más pequeño */
.corazon[data-fav]{width:32px;height:32px;background:rgba(0,0,0,.55);color:#fff;box-shadow:none;backdrop-filter:blur(4px)}
.corazon[data-fav] svg{width:16px;height:16px}
.corazon[data-fav].on{background:rgba(0,0,0,.6);color:#ff3b5c}
/* ===== agendar una clase (zona 2.0; diseño A del muestrario agendar.html) ===== */
.zn .agendar{top:10px;right:48px;width:32px;height:32px;border-radius:50%;background:rgba(0,0,0,.55);backdrop-filter:blur(4px);z-index:2}
.zn .agendar svg{width:16px;height:16px}
.zn .agendar.on{opacity:1;background:var(--azul)}
.zn .img:has(.agendar) .sonido{top:auto;bottom:42px}
@media (hover:none){.zn .agendar{opacity:1}}
.zn-agendada{position:absolute;left:10px;bottom:10px;z-index:2;padding:5px 9px;border-radius:4px;background:var(--azul);color:#fff;font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.ag-fondo{position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:16px;background:rgba(0,0,0,.55);backdrop-filter:blur(3px)}
.ag-fondo[hidden]{display:none}
.ag-vent{position:relative;width:min(460px,100%);padding:26px 26px 22px;border-radius:14px;background:#121216;color:#fff;box-shadow:0 30px 70px rgba(0,0,0,.45)}
.ag-cerrar{position:absolute;top:14px;right:14px;width:32px;height:32px;border:0;border-radius:50%;background:rgba(255,255,255,.1);color:#fff;font-size:18px;cursor:pointer}
.ag-rotulo{margin:0;font-size:10.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:#6fb1ff}
.ag-vent h3{margin:8px 0 0;font-family:var(--titular);font-weight:700;font-size:22px;line-height:1;text-transform:uppercase}
.ag-clase{display:flex;gap:12px;align-items:center;margin-top:16px;padding:10px;border-radius:10px;background:rgba(255,255,255,.06)}
.ag-clase img{width:84px;height:48px;flex:0 0 auto;object-fit:cover;border-radius:6px;background:#222}
.ag-clase b{display:block;font-size:13px;line-height:1.3}.ag-clase small{display:block;margin-top:2px;color:#9c9c9c;font-size:12px}
.ag-atajos{display:flex;gap:8px;margin-top:20px}
.ag-atajos a{flex:1;padding:12px 8px;border:1px solid rgba(255,255,255,.18);border-radius:8px;text-align:center;font-size:13px;font-weight:600;cursor:pointer}
.ag-dias{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin-top:12px}
.ag-dias a{display:flex;flex-direction:column;align-items:center;gap:3px;padding:8px 0 6px;border:1px solid rgba(255,255,255,.12);border-radius:8px;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:#9c9c9c;cursor:pointer}
.ag-dias a b{font-family:var(--titular);font-size:17px;letter-spacing:0;color:#fff}
.ag-dias a i{width:5px;height:5px;border-radius:50%}
.ag-dias a.tiene i{background:#6fb1ff}
.ag-atajos a:hover,.ag-dias a:hover{border-color:rgba(255,255,255,.45)}
.ag-atajos a.on,.ag-dias a.on{background:var(--azul);border-color:var(--azul);color:#fff}
.ag-pie{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:20px}
.ag-eleccion{margin:0;font-size:13px;color:#cfcfcf}.ag-eleccion b{color:#fff}
.ag-boton{padding:13px 20px;border:0;border-radius:6px;background:var(--azul);color:#fff;font:inherit;font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;cursor:pointer}
.ag-boton:disabled{opacity:.4;cursor:default}
.ag-quitar{display:inline-block;margin-top:14px;font-size:12px;color:#9c9c9c;text-decoration:underline;cursor:pointer}
.ag-quitar[hidden],.ag-error[hidden]{display:none}
.ag-error{margin:12px 0 0;font-size:13px;color:#ff8a8a}
@media (max-width:520px){.ag-vent{padding:22px 16px 18px}.ag-dias{gap:4px}.ag-dias a b{font-size:15px}}
/* la bolita del alumno: el menú se abre al pulsar, no al pasar (el hueco lo cerraba al bajar) */
.zn-yo:hover .zn-yo__menu{display:none}
.zn-yo.abierto .zn-yo__menu{display:flex;z-index:60}
.zn-yo__menu::before{content:'';position:absolute;left:0;right:0;top:-14px;height:14px}
/* el menú de la cuenta (diseño B): tu plan a la izquierda, accesos en cuadrícula */
.zn-yo.abierto .zn-cuenta{display:grid}
.zn-cuenta{grid-template-columns:200px 1fr;width:520px;padding:0;overflow:visible;border-radius:14px;cursor:default}
.zn-cuenta__yo{display:block;padding:20px;border-radius:14px 0 0 14px;background:linear-gradient(160deg,rgba(11,121,251,.35),rgba(11,121,251,.05))}
.zn-cuenta__foto{display:grid;place-items:center;width:64px;height:64px;overflow:hidden;border-radius:50%;background:var(--azul);box-shadow:0 0 0 3px var(--azul);font-family:var(--titular);font-size:24px;font-weight:700}
.zn-cuenta__foto img{width:100%;height:100%;object-fit:cover}
.zn-cuenta__yo b{display:block;margin-top:12px;font-size:15px;line-height:1.25}
.zn-cuenta__yo small{display:block;margin-top:2px;font-size:12px;color:#bcd6ff;word-break:break-all}
.zn-cuenta__chapa{display:inline-block;margin-top:16px;padding:6px 10px;border-radius:999px;background:var(--azul);font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.zn-cuenta__cuando{display:block;margin-top:8px;font-size:12px;line-height:1.45;color:#cfdcff}
.zn-yo__menu a.zn-cuenta__enlace{display:inline-block;margin-top:12px;padding:0 0 2px;border-radius:0;border-bottom:1px solid;font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#fff}
.zn-cuenta__der{display:block;padding:14px}
.zn-cuenta__rejilla{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.zn-yo__menu .zn-cuenta__rejilla a{display:flex;flex-direction:column;gap:8px;padding:12px;border-radius:10px;background:rgba(255,255,255,.04);font-size:13px;font-weight:600;color:#fff}
.zn-cuenta__rejilla a:hover{background:rgba(255,255,255,.09)}
.zn-cuenta__rejilla svg{width:30px;height:30px;padding:7px;border-radius:8px;background:rgba(255,255,255,.07);color:#cfcfcf}
.zn-cuenta__rejilla small{font-size:11.5px;font-weight:400;color:#9c9c9c}
.zn-cuenta__pie{display:flex;justify-content:space-between;margin-top:10px;padding:10px 4px 2px;border-top:1px solid rgba(255,255,255,.1)}
.zn-yo__menu .zn-cuenta__pie a{padding:4px 0;font-size:13px;color:#fff}
.zn-yo__menu .zn-cuenta__pie a.salir{color:#9c9c9c}
@media (max-width:620px){.zn-cuenta{grid-template-columns:minmax(0,1fr);width:min(340px,calc(100vw - 24px))}.zn-cuenta__yo{border-radius:14px 14px 0 0}}
/* ===== Mi cuenta (zona 2.0; diseño A del muestrario mi-cuenta.html) ===== */
.cu-sub{margin:6px 0 0;color:var(--tenue);font-size:14.5px}
.cu-tabs{margin-top:18px}
.cu-tabs a{cursor:pointer}
.cu-panel{display:none;margin-top:26px;max-width:980px}
.cu[data-t="datos"] .cu-panel--datos,.cu[data-t="membresia"] .cu-panel--membresia,.cu[data-t="facturas"] .cu-panel--facturas{display:block}
.cu-caja{margin-top:18px;padding:26px 28px;border:1px solid var(--linea);border-radius:14px;background:var(--campo-fondo)}
.cu-caja:first-child{margin-top:0}
.cu-caja h2{margin:0 0 4px;font-family:var(--titular);font-weight:700;font-size:20px;text-transform:uppercase}
.cu-caja > p{margin:0 0 6px;font-size:13.5px;color:var(--tenue)}
.cu-foto{display:flex;gap:20px;align-items:center;margin-top:14px}
.cu-foto__img{display:grid;place-items:center;width:96px;height:96px;flex:0 0 auto;overflow:hidden;border-radius:50%;background:var(--azul);color:#fff;box-shadow:0 0 0 3px var(--azul);font-family:var(--titular);font-size:36px;font-weight:700}
.cu-foto__img img{width:100%;height:100%;object-fit:cover}
.cu-foto__boton{cursor:pointer}
.cu-foto small{display:block;margin-top:8px;font-size:12px;color:var(--tenue)}
.cu-dos{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.cu-campo{display:block;margin-top:14px;font-size:10.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase}
.cu-campo input.campo{width:100%;margin-top:8px;font:inherit;font-size:15px;font-weight:400;letter-spacing:0;text-transform:none;color:var(--texto);outline:none;background:#fff}
.cu-campo input.campo:focus{border-color:var(--azul);box-shadow:0 0 0 1px var(--azul)}
.cu-campo input.campo--mal{border-color:#e5484d}
.cu-boton{margin-top:20px;border:0;cursor:pointer}
.cu-boton--peligro{background:transparent;color:#d1383d;box-shadow:inset 0 0 0 1px rgba(209,56,61,.5);list-style:none;cursor:pointer}
.cu-boton--peligro::-webkit-details-marker{display:none}
.cu-boton--lleno{background:#d1383d;color:#fff;border:0}
.cu-peligro{border-color:rgba(209,56,61,.3)}
.cu-peligro h2{color:#d1383d}
.cu-borrar summary,.cu-cancelar summary{display:inline-block;list-style:none}
.cu-borrar summary::-webkit-details-marker,.cu-cancelar summary::-webkit-details-marker{display:none}
.cu-borrar__si,.cu-cancelar__si{margin-top:14px;padding:14px 16px;border-radius:10px;background:rgba(209,56,61,.08)}
.cu-borrar__si p,.cu-cancelar__si p{margin:0 0 12px;font-size:13.5px}
.cu-cancelar__si{background:rgba(255,255,255,.08)}
.cu-cancelar__si .btn{border:0;cursor:pointer}
.cu-plan{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;align-items:center;margin-bottom:18px;padding:28px;border-radius:14px;color:#fff;background:linear-gradient(120deg,rgba(11,121,251,.35),rgba(11,121,251,.05) 60%),#000}
.cu-plan .rotulo{margin:0;color:#6fb1ff}
.cu-plan strong{display:block;margin-top:8px;font-family:var(--titular);font-weight:700;font-size:30px;line-height:1;text-transform:uppercase}
.cu-plan p{margin:10px 0 0;font-size:14px;line-height:1.5;color:#cfcfcf}.cu-plan p b{color:#fff}
.cu-plan__acciones{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-start;margin-top:18px}
.cu-plan__acciones .btn{border:0;cursor:pointer}
.cu-plan .btn--linea{color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.4)}
.cu-plan__precio{text-align:right}.cu-plan__precio b{display:block;font-family:var(--titular);font-size:36px}.cu-plan__precio small{color:#9c9c9c;font-size:12px}
.cu-incluye{display:grid;grid-template-columns:1fr 1fr;gap:8px 24px;margin:12px 0 0;padding:0;list-style:none;font-size:14px}
.cu-incluye li::before{content:'— ';color:var(--azul)}
.cu-cursos{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px;margin-top:14px}
.cu-cursos a{display:flex;gap:12px;align-items:center;padding:10px;border-radius:10px;background:#fff;font-size:13px;font-weight:600;color:var(--texto)}
.cu-cursos img{width:56px;height:72px;object-fit:cover;border-radius:6px}
.cu-cursos small{display:block;font-weight:400;color:var(--tenue);font-size:12px}
.cu-vacio{margin:12px 0 0;font-size:14px;color:var(--tenue)}
.cu-aviso{margin-top:16px;padding:14px 16px;border-left:3px solid var(--azul);background:rgba(11,121,251,.08);font-size:13.5px;line-height:1.5}
.cu-tabla__caja{overflow-x:auto;margin-top:14px}
.cu-tabla{width:100%;border-collapse:collapse;font-size:14px}
.cu-tabla th{padding:0 12px 10px;text-align:left;font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--tenue);white-space:nowrap}
.cu-tabla td{padding:14px 12px;border-top:1px solid var(--linea)}
.cu-tabla td b{font-weight:600}
.cu-tabla .num{text-align:right;font-family:var(--titular);white-space:nowrap}
.cu-estado{padding:4px 8px;border-radius:4px;background:rgba(40,170,90,.12);color:#1e8a4a;font-size:11px;font-weight:700;letter-spacing:.06em;white-space:nowrap}
.cu-estado--pendiente{background:rgba(230,150,20,.14);color:#a8650a}
.cu-bajar{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--azul);white-space:nowrap}
.zn-aviso{display:flex;justify-content:space-between;gap:14px;align-items:center;margin:0 0 18px;padding:14px 16px;border-radius:10px;font-size:14px}
.zn-aviso--bien{background:rgba(40,170,90,.12);color:#16683a}
.zn-aviso--mal{background:rgba(209,56,61,.1);color:#a3262b}
.zn-aviso button{border:0;background:none;font-size:18px;color:inherit;cursor:pointer}
@media (max-width:820px){.cu-dos,.cu-incluye{grid-template-columns:minmax(0,1fr)}.cu-plan{grid-template-columns:minmax(0,1fr)}.cu-plan__precio{text-align:left}.cu-caja{padding:20px 16px}}
/* Mi cuenta: los botones de línea con su borde, y los desplegables sin los estilos de las preguntas frecuentes */
.cu .cu-boton.btn--linea{border:1px solid var(--borde-campo)}
.cu details.cu-borrar,.cu details.cu-cancelar{border:0}
.cu details.cu-borrar summary,.cu details.cu-cancelar summary{display:inline-block;padding:16px 26px;font-size:11px;font-weight:700;outline:none}
.cu details.cu-borrar p,.cu details.cu-cancelar p{margin:0 0 12px;max-width:none;color:inherit}
.cu details.cu-cancelar summary{padding:15px 26px;border:1px solid rgba(255,255,255,.4)}
/* página de clase · tus grabaciones de esta clase (Royal Dance 2.0) */
.cl-grab{display:block;padding:0;border:0;background:none;font:inherit;color:inherit;text-align:left;cursor:pointer}
.cl-grab .img{position:relative;display:block;overflow:hidden}
.cl-grab .img img,.cl-grab .img video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cl-grab .img video{object-fit:contain;background:#000}
.cl-grab .play{z-index:1}
.cl-grab__ultima{position:absolute;left:8px;top:8px;z-index:1;padding:4px 7px;border-radius:4px;background:var(--azul);color:#fff;font-size:9px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.cl-grab__procesando{position:absolute;inset:auto 8px 8px;z-index:1;padding:6px 8px;border-radius:6px;background:rgba(0,0,0,.7);color:#fff;font-size:11px;line-height:1.35}
.cl-tiene .cl-grabs{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(0,150px);overflow-x:auto;padding-bottom:6px}
.cl-tiene__pie{margin-top:14px}
.cl-invita .btn[data-grabar],.cl-accion[data-grabar]{cursor:pointer}
.cl-grab.cl-grab--nueva{display:flex;width:100%;aspect-ratio:9/16;border:1px dashed var(--azul);border-radius:14px;text-align:center}
/* Mis grabaciones (zona 2.0): lo que la maqueta no necesitaba */
.gb-toma{cursor:pointer}
.gb-toma__acciones button{cursor:pointer}
.gb-toma__procesando{position:absolute;left:8px;bottom:8px;z-index:1;padding:4px 7px;border-radius:4px;background:rgba(0,0,0,.7);color:#fff;font-size:9px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.gb-grupo.fuera-tipo{display:none}
.gb-alavez{border:0;cursor:pointer}
.gv{position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:16px;background:rgba(0,0,0,.75)}
.gv[hidden]{display:none}
.gv__caja{position:relative;width:min(420px,100%);padding:16px;border-radius:14px;background:#121216;color:#fff}
.gv__cerrar{position:absolute;top:10px;right:10px;z-index:2;width:34px;height:34px;border:0;border-radius:50%;background:rgba(255,255,255,.12);color:#fff;font-size:20px;cursor:pointer}
.gv__marco{display:grid;place-items:center;aspect-ratio:9/16;max-height:72vh;margin:0 auto;border-radius:10px;overflow:hidden;background:#000}
.gv__marco video{width:100%;height:100%;object-fit:contain}
.gv__espera{padding:20px;text-align:center;font-size:14px;color:#cfcfcf}
.gv__pie{margin:12px 0 0;font-size:13px;color:#cfcfcf}
.gb-toma__procesando{top:32px;bottom:auto}
/* comparar (zona 2.0): lo que la maqueta no necesitaba */
.gb-barra-comparar[hidden],.gc[hidden]{display:none}
.gb-barra-comparar__ir{border:0;cursor:pointer}
.gb-barra-comparar__ir:disabled{opacity:.5;cursor:default}
.gc-marco,.gc-clase{position:relative}
.gc__espera{position:absolute;inset:auto 10px 40%;z-index:2;padding:8px 10px;border-radius:8px;background:rgba(0,0,0,.7);color:#fff;font-size:12px;font-weight:600;text-align:center}
.gc__espera[hidden]{display:none}
.gc.espejo .gc-marco video{transform:scaleX(-1)}
.gc__play,.gc__espejo,.gc__cerrar{cursor:pointer}
.gc__modos a,.gc__cual a,.gc__velocidad a{cursor:pointer}
.gc__espejo.on{color:var(--azul)}
/* comparar (zona 2.0): lo que la maqueta no necesitaba */
.gb-barra-comparar[hidden],.gc[hidden]{display:none}
.gb-barra-comparar__ir{border:0;cursor:pointer}
.gb-barra-comparar__ir:disabled{opacity:.5;cursor:default}
.gc-marco,.gc-clase{position:relative}
.gc__espera{position:absolute;inset:auto 10px 40%;z-index:2;padding:8px 10px;border-radius:8px;background:rgba(0,0,0,.7);color:#fff;font-size:12px;font-weight:600;text-align:center}
.gc__espera[hidden]{display:none}
.gc.espejo .gc-marco video{transform:scaleX(-1)}
.gc__play,.gc__espejo,.gc__cerrar,.gc__modos a,.gc__cual a,.gc__velocidad a{cursor:pointer}
.gc__espejo.on{color:var(--azul)}

/* Mis grabaciones · mandar una toma (o las dos) al profe; va encima del comparador */
.gb-toma__enviada{color:var(--texto);font-weight:700}
.gc__pie .btn[hidden]{display:none}
.ge{position:fixed;inset:0;z-index:260;display:grid;place-items:center;padding:16px;background:rgba(0,0,0,.7)}
.ge[hidden]{display:none}
.ge__caja{position:relative;display:flex;flex-direction:column;gap:12px;width:min(440px,100%);padding:24px;border-radius:14px;background:#121216;color:#fff}
.ge__cerrar{position:absolute;top:10px;right:10px;width:34px;height:34px;border:0;border-radius:50%;background:rgba(255,255,255,.12);color:#fff;font-size:20px;cursor:pointer}
.ge__titulo{font-size:16px;line-height:1.35;padding-right:36px}
.ge__texto{width:100%;box-sizing:border-box;padding:12px 14px;border:1px solid rgba(255,255,255,.25);border-radius:10px;background:rgba(255,255,255,.05);color:#fff;font-family:inherit;font-size:14px;line-height:1.5;resize:none}
.ge__texto::placeholder{color:rgba(255,255,255,.45)}
.ge__texto[hidden]{display:none}
.ge__aviso{margin:0;font-size:13.5px;line-height:1.45;color:#fca5a5}
.ge__aviso--ok{color:#86efac;font-weight:600}
.ge__botones{display:flex;align-items:center;gap:16px}
.ge__mandar{display:inline-flex;align-items:center;gap:8px}
.ge__mandar svg{width:14px;height:14px}
.ge__mandar[hidden]{display:none}
.ge__no{color:rgba(255,255,255,.75);cursor:pointer}

/* Mensajería en pantallas estrechas: una columna (la lista arriba y la conversación debajo) hasta que
   se decida la versión móvil (entorno/propuestas/movil.html) */
@media (max-width:899px){
.ms{display:block;height:auto;min-height:0;border-left:0}
.ms-acciones{grid-template-columns:1fr 1fr;padding:12px 16px}
.ms-acciones__particular{grid-column:1 / -1}
.ms-lista{border-right:0;border-bottom:1px solid var(--linea)}
.ms-centro{min-height:0}
.ms-hilo__cuerpo{flex:none}
.ms-escribir{position:sticky;bottom:0;z-index:5;background:var(--fondo)}
.ms-hilo__cabeza h2{font-size:24px;line-height:1.1}
.ms-hilo__cuerpo{overflow:visible}
.ms-puertas{grid-template-columns:1fr 1fr}
.ms-dos{grid-template-columns:1fr !important}
}

/* El muro entero de un reto (perfil20/reto-muro): las participaciones en rejilla, con su ♥ */
.gb-muro-entero{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:22px;margin-top:30px}
.gb-muro.gb-muro--grande{aspect-ratio:auto;overflow:visible;border-radius:0;background:none;cursor:default}
.gb-muro.gb-muro--grande::after{display:none}
.gb-muro__ver{position:relative;display:block;aspect-ratio:9/16;overflow:hidden;border-radius:10px;background:#111;cursor:pointer}
.gb-muro__ver img{width:100%;height:100%;object-fit:cover}
.gb-muro__ver i{position:absolute;inset:0;display:grid;place-items:center;color:#fff;font-size:30px;font-style:normal;text-shadow:0 2px 12px rgba(0,0,0,.6)}
.gb-muro.ganadora .gb-muro__ver{box-shadow:0 0 0 2px #d9a000}
.gb-muro__pie{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:10px}
.gb-muro__quien{display:flex;align-items:center;gap:8px;min-width:0}
.gb-muro .gb-muro__quien img{flex:none;width:28px;height:28px;border-radius:50%;object-fit:cover}
.gb-muro.gb-muro--grande .gb-muro__quien b{position:static;color:var(--texto);font-size:13px}
.gb-muro.gb-muro--grande .gb-muro__quien em{position:static;color:#b88a00;font-size:11px}
.gb-muro__corazon{display:inline-flex;flex:none;align-items:center;gap:6px;min-height:44px;padding:0 14px;border:1px solid var(--linea);border-radius:999px;background:var(--fondo);color:var(--texto);font:inherit;font-weight:700;cursor:pointer}
.gb-muro__corazon.on{border-color:#ff3b5c;color:#ff3b5c}

/* Portada · las tres cifras del hero (2026-10-17): el número con peso, arriba; lo que es, debajo */
.hr-cifras{display:flex;gap:0;margin:30px 0 30px;padding:0;list-style:none}
.hr-cifras li{display:grid;grid-template-columns:auto;justify-items:start;gap:4px;padding:0 26px;border-left:1px solid rgba(255,255,255,.22)}
.hr-cifras li:first-child{padding-left:0;border-left:0}
.hr-cifras svg{width:18px;height:18px;margin-bottom:4px;color:#6fb1ff}
.hr-cifras b{font-family:var(--titular);font-weight:700;font-size:34px;line-height:1;letter-spacing:-.01em}
.hr-cifras span{font-size:10.5px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:rgba(255,255,255,.7)}
/* cada cifra, centrada en su columna: el icono encima del número (petición del dueño) */
.hr-cifras li{justify-items:center;text-align:center}

/* «Curso destacado» / «Serie destacada» (rehecha el 2026-10-18 a petición del dueño): sin cajita blanca; una estrella y
   el texto en azul claro con un hilo azul delante, que se lee sobre el vídeo sin taparlo */
.dentro.con-prota:not(.filtrando) .cartel__destacado,.dentro .cartel--serie-prota .cartel__destacado{display:inline-flex!important;align-items:center;gap:8px;margin-bottom:12px;padding:0!important;background:none!important;color:#8fc3ff!important;border-radius:0!important;font-size:10px!important;font-weight:700;letter-spacing:.22em;text-transform:uppercase;text-shadow:0 1px 8px rgba(0,0,0,.7)}
.dentro.con-prota:not(.filtrando) .cartel__destacado::before,.dentro .cartel--serie-prota .cartel__destacado::before{content:'';width:22px;height:2px;background:var(--azul);box-shadow:0 0 8px rgba(11,121,251,.8)}
.dentro.con-prota:not(.filtrando) .cartel__destacado::after,.dentro .cartel--serie-prota .cartel__destacado::after{content:'★';order:-1;margin-right:-2px;font-size:11px;letter-spacing:0;color:#fff}

/* la barra «Tu primera clase, hoy, por 0,99 €» de la portada: solo en el móvil (ver movil20.css y movil20.js) */
.barra-empieza{display:none}

/* el pie: «Made with ♥ por Royal Lab» (el corazón, en el magenta del puntito del logo de Royal Lab, late despacio) */
.pie-web__fin{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.pie-web__firma{display:inline-flex;align-items:center;gap:8px;font-size:11px;letter-spacing:.06em;color:var(--tenue)}
.pie-web__firma img{display:block;width:auto;height:46px}
.pie-web__corazon{display:inline-block;font-style:normal;font-size:15px;line-height:1;color:#e6007e;text-shadow:0 0 10px rgba(230,0,126,.65);animation:pie-latido 1.6s ease-in-out infinite}
@keyframes pie-latido{0%,60%,100%{transform:scale(1)}15%{transform:scale(1.25)}30%{transform:scale(1)}45%{transform:scale(1.15)}}
@media (prefers-reduced-motion:reduce){.pie-web__corazon{animation:none}}

/* el logo de Royal Dance Online (imagen desde el 2026-10-18; antes era texto con un punto) */
.nav__logo{padding-right:0!important}
.nav__logo i{display:none}
.nav__logo img{display:block;width:auto;height:34px}
.pie-web .nav__logo img{height:44px}
.pie-web__copy{display:block;margin-top:10px;font-size:11px;letter-spacing:.06em;color:var(--tenue)}
.pie-web__fin{justify-content:flex-end}

/* Cursos: la etiqueta de campeón del profesor sobre la foto de la tarjeta; el botón «Filtros» y su ventana, solo en
   el móvil (ver movil20.css y movil20.js) */
.cur-tarjeta .img{position:relative}
.cur-tarjeta__campeon{position:absolute;z-index:3;left:10px;bottom:10px;top:auto;right:10px;width:max-content;max-width:calc(100% - 20px);margin:0!important;font-size:8.5px!important;line-height:1.3;white-space:normal}
.cur-abrir,.cur-ventana{display:none}
.cierre h2.solo-movil{display:none}