/* ============================================================
   Cursos a tu ritmo (grabados): página del curso
   (courses/course_detail.html) y lección (courses/lesson_view.html).
   Mismo lenguaje que el curso en vivo: cabecera oscura, esquinas
   rectas, botones sin borde, colores --mcw-*. Todo va bajo .ar.
   ============================================================ */
.ar{--ok:var(--mcw-ok,#0B7A5C);--ok-bg:var(--mcw-ok-bg,#E4F6EF);--info:var(--mcw-navy2,#0A3169);--info-bg:var(--mcw-info-bg,#EAF1FC);--lock:var(--mcw-lock,#5F6878);--lock-bg:var(--mcw-lock-bg,#F0F1F4);--warn:var(--mcw-warn,#8A6212);--warn-bg:var(--mcw-warn-bg,#FBF3E3);--crimson-soft:rgba(158,27,50,.08);
  color:var(--mcw-ink);font-family:'Plus Jakarta Sans',sans-serif}
.ar *{box-sizing:border-box}
.ar [hidden]{display:none!important}
.ar h1,.ar h2,.ar h3,.ar h4,.ar h6,.ar p{margin:0}
.ar .bi{line-height:1}
.ar a{text-decoration:none}

/* Cabecera oscura (la misma del curso en vivo) */
.ar .ar-hero{min-height:230px;padding:48px 32px 30px}
.ar .ar-hero .lv-badge{border-radius:2px}
.ar .ar-hero h1{font-size:28px}
.ar .lv-badge.ar-badge-rit{background:rgba(15,157,119,.22);border-color:rgba(15,157,119,.45);color:#9ff0d4;display:inline-flex;gap:6px;align-items:center}

/* Botones y etiquetas */
.ar .ar-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;border:none;border-radius:2px;padding:10px 16px;font-family:'Sora',sans-serif;font-weight:700;font-size:12.5px;cursor:pointer;white-space:nowrap;line-height:1.2;text-decoration:none}
.ar .ar-btn-crimson{background:var(--mcw-crimson);color:#fff}
.ar .ar-btn-crimson:hover{background:var(--mcw-crimson-dark);color:#fff}
.ar .ar-btn-soft{background:var(--mcw-bg-alt);color:var(--mcw-ink)}
.ar .ar-btn-soft:hover{background:#e9ecf2;color:var(--mcw-ink)}
.ar .ar-btn-ok{background:var(--ok-bg);color:var(--ok);cursor:default}
.ar .ar-btn-sm{padding:7px 11px;font-size:11.5px}
.ar .ar-btn-block{width:100%}
.ar .ar-btn.is-off{opacity:.45;pointer-events:none}
.ar .ar-btn:focus-visible,.ar button:focus-visible,.ar a:focus-visible{outline:3px solid rgba(158,27,50,.25);outline-offset:2px}
.ar .ar-chip{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:800;letter-spacing:.03em;text-transform:uppercase;padding:4px 8px;border-radius:2px;white-space:nowrap;flex-shrink:0}
.ar .ar-chip.done{background:var(--ok-bg);color:var(--ok)}
.ar .ar-chip.lock{background:var(--lock-bg);color:var(--lock)}
.ar .ar-chip.crimson{background:var(--crimson-soft);color:var(--mcw-crimson)}
.ar .ar-chip.free{background:var(--warn-bg);color:var(--warn)}
.ar .ar-pbar{height:6px;background:#e3e6ec}
.ar .ar-pbar i{display:block;height:100%;background:var(--mcw-crimson)}
.ar .ar-pbar.ok i{background:var(--ok)}
.ar .ar-card{border:1px solid var(--mcw-line);border-radius:2px;background:#fff;padding:16px}
.ar .ar-card h4{font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--mcw-muted);margin-bottom:12px;display:flex;justify-content:space-between;align-items:center;gap:8px;font-family:'Plus Jakarta Sans',sans-serif}
.ar .ar-empty{font-size:13px;color:var(--mcw-muted);padding:16px 0}
.ar .ar-h3{font-family:'Sora',sans-serif;font-size:13.5px;font-weight:800;padding-bottom:8px;border-bottom:2px solid var(--mcw-ink);margin-bottom:10px;color:var(--mcw-ink)}

/* Pestañas */
.ar .ar-tabs{display:flex;gap:4px;border-bottom:1px solid var(--mcw-line);margin-bottom:16px;overflow-x:auto;scrollbar-width:none}
.ar .ar-tabs::-webkit-scrollbar{display:none}
.ar .ar-tab{border:none;background:none;padding:11px 14px;font-family:'Sora',sans-serif;font-weight:700;font-size:12.5px;color:var(--mcw-muted);border-bottom:2.5px solid transparent;cursor:pointer;white-space:nowrap;display:inline-flex;align-items:center;gap:7px;border-radius:0}
.ar .ar-tab:hover{color:var(--mcw-ink)}
.ar .ar-tab.on{color:var(--mcw-crimson);border-bottom-color:var(--mcw-crimson)}
.ar .ar-n{font-family:'Plus Jakarta Sans',sans-serif;font-size:12px;font-weight:800;background:var(--mcw-bg-alt);color:var(--mcw-muted);border-radius:2px;padding:1px 6px}
.ar .ar-pane{display:none}
.ar .ar-pane.on{display:block}
.ar:not(.js) .ar-pane.ar-pane--inicial{display:block}

/* ================= PÁGINA DEL CURSO ================= */
.ar-shell{max-width:1320px;margin:0 auto;padding:24px 32px 70px;display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:26px;align-items:start}
.ar-main{min-width:0}
.ar .ar-side{display:grid;gap:14px;position:sticky;top:calc(var(--hdr,64px) + 26px);min-width:0}

/* Miniatura tipo video */
.ar .ar-thumb{position:relative;aspect-ratio:16/9;background:linear-gradient(135deg,var(--mcw-navy,#0B1220),#1f3a66);display:flex;align-items:center;justify-content:center;color:#fff;overflow:hidden;background-size:cover;background-position:center}
.ar .ar-thumb::after{content:"";position:absolute;inset:0;background:rgba(11,18,32,.35)}
.ar .ar-thumb .ar-play{width:46px;height:46px;border-radius:50%;background:var(--mcw-crimson);display:flex;align-items:center;justify-content:center;font-size:21px;position:relative;z-index:1;color:#fff}
.ar .ar-thumb .ar-dur{position:absolute;right:6px;bottom:6px;background:rgba(0,0,0,.72);font-size:12px;font-weight:700;padding:2px 6px;z-index:1;color:#fff}
.ar .ar-preview{position:relative;aspect-ratio:16/9;background:var(--mcw-navy,#0B1220)}
.ar .ar-preview iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* Continúa donde te quedaste / curso terminado */
.ar .ar-resume{border:1px solid var(--mcw-line);border-top:3px solid var(--mcw-crimson);border-radius:2px;display:grid;grid-template-columns:200px minmax(0,1fr) auto;gap:18px;align-items:center;padding:16px;margin-bottom:22px}
.ar .ar-resume.fin{border-top-color:var(--ok)}
.ar .ar-resume.fin .ar-play{background:var(--ok)}
.ar .ar-eyebrow{font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--mcw-crimson);display:flex;gap:7px;align-items:center}
.ar .ar-resume.fin .ar-eyebrow{color:var(--ok)}
.ar .ar-resume h2,.ar .ar-buy h2{font-family:'Sora',sans-serif;font-size:17px;font-weight:800;margin-top:4px;color:var(--mcw-ink);overflow-wrap:anywhere}
.ar .ar-resume__meta{font-size:12.5px;color:var(--mcw-muted);font-weight:600;margin-top:5px}
.ar .ar-resume__prog{display:flex;align-items:center;gap:10px;margin-top:10px;font-size:11.5px;font-weight:700;color:var(--mcw-muted)}
.ar .ar-resume__prog .ar-pbar{flex:1;max-width:260px}
.ar .ar-resume__acts{display:flex;flex-direction:column;gap:8px;min-width:190px}

/* Compra */
.ar .ar-buy{border:1px solid var(--mcw-line);border-top:3px solid var(--mcw-crimson);border-radius:2px;display:grid;grid-template-columns:280px minmax(0,1fr) 230px;gap:18px;align-items:center;padding:16px;margin-bottom:22px}
.ar .ar-buy.sin-preview{grid-template-columns:minmax(0,1fr) 230px}
.ar .ar-buy p{font-size:13px;color:var(--mcw-muted);line-height:1.55;margin-top:6px}
.ar .ar-price{font-family:'Sora',sans-serif;font-size:24px;font-weight:800;color:var(--mcw-ink)}
.ar .ar-buy__acts{display:grid;gap:8px}

/* Temario */
.ar .ar-tools{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px;align-items:center}
.ar .ar-search{flex:1;min-width:200px;display:flex;align-items:center;gap:8px;border:1px solid var(--mcw-line);border-radius:2px;padding:0 12px;background:#fff;margin:0}
.ar .ar-search i{color:var(--mcw-muted)}
.ar .ar-search input{border:none;outline:none;font:inherit;font-size:13px;padding:10px 0;width:100%;background:none;color:var(--mcw-ink)}
.ar .ar-search:focus-within{border-color:var(--mcw-crimson);box-shadow:0 0 0 3px rgba(158,27,50,.1)}
.ar .ar-fbtn{border:none;background:var(--mcw-bg-alt);color:var(--mcw-muted);font-family:'Sora',sans-serif;font-size:11.5px;font-weight:700;padding:9px 11px;border-radius:2px;cursor:pointer}
.ar .ar-fbtn.on{background:var(--mcw-ink);color:#fff}
.ar .ar-mod{margin-bottom:12px;border:1px solid var(--mcw-line);border-radius:2px;background:#fff}
.ar .ar-mod__h{display:flex;align-items:center;gap:12px;width:100%;border:none;background:none;padding:14px 16px;cursor:pointer;text-align:left;font-family:inherit;color:inherit}
.ar .ar-mod.open .ar-mod__h{border-bottom:2px solid var(--mcw-ink)}
.ar .ar-mod__n{width:34px;height:34px;flex-shrink:0;border-radius:2px;background:var(--mcw-bg-alt);display:flex;align-items:center;justify-content:center;font-family:'Sora',sans-serif;font-weight:800;font-size:12px;color:var(--mcw-ink)}
.ar .ar-mod.done .ar-mod__n{background:var(--ok-bg);color:var(--ok)}
.ar .ar-mod.cur .ar-mod__n{background:var(--mcw-crimson);color:#fff}
.ar .ar-mod.locked{background:var(--mcw-bg-alt)}
.ar .ar-mod__t{flex:1;min-width:0}
.ar .ar-mod__t h3{font-family:'Sora',sans-serif;font-size:14px;font-weight:800;color:var(--mcw-ink);overflow-wrap:anywhere}
.ar .ar-mod__t small{display:block;font-size:11.5px;color:var(--mcw-muted);margin-top:3px;font-weight:600}
.ar .ar-mod__bar{width:90px;height:5px;background:#e3e6ec;flex-shrink:0}
.ar .ar-mod__bar i{display:block;height:100%;background:var(--ok)}
.ar .ar-chev{color:var(--mcw-muted);font-size:13px;transition:transform .15s;flex-shrink:0}
.ar .open > .ar-mod__h .ar-chev,.ar .open > .ar-tmod__h .ar-chev{transform:rotate(180deg)}
.ar .ar-mod__b{display:none;padding:4px 10px 10px}
.ar .ar-mod.open .ar-mod__b{display:block}
.ar .ar-les{display:grid;grid-template-columns:26px minmax(0,1fr) auto auto;gap:12px;align-items:center;padding:10px 8px;border-bottom:1px solid var(--mcw-line);color:var(--mcw-ink)}
.ar .ar-les:last-of-type{border-bottom:none}
.ar a.ar-les:hover{background:var(--mcw-bg-alt);color:var(--mcw-ink)}
.ar .ar-st{width:22px;height:22px;border-radius:50%;border:2px solid #cdd3dd;display:flex;align-items:center;justify-content:center;font-size:11px;color:#fff;flex-shrink:0}
.ar .ar-les.done .ar-st{background:var(--ok);border-color:var(--ok)}
.ar .ar-les.next .ar-st{border-color:var(--mcw-crimson);color:var(--mcw-crimson);font-size:12px}
.ar .ar-les.free .ar-st{border-color:var(--warn);color:var(--warn);font-size:12px}
.ar .ar-les.lock .ar-st{border:none;color:var(--lock);font-size:13px}
.ar .ar-les.lock{color:var(--mcw-muted)}
.ar .ar-les__t{min-width:0}
.ar .ar-les__t b{display:block;font-size:13px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ar .ar-les.done .ar-les__t b{color:var(--mcw-muted);font-weight:600}
.ar .ar-les__t small{display:block;font-size:11px;color:var(--mcw-muted);margin-top:2px;font-weight:600}
.ar .ar-les.next{background:linear-gradient(90deg,rgba(158,27,50,.06),transparent 70%)}
.ar .ar-dur-t{font-size:11.5px;color:var(--mcw-muted);font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
.ar .ar-lockbox{border:1px dashed var(--mcw-line);background:#fff;padding:12px;font-size:12.5px;color:var(--mcw-muted);display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:6px 0}
.ar .ar-lockbox b{color:var(--mcw-ink);display:block}
.ar .ar-lockbox > div{flex:1;min-width:180px}
.ar .evx-list,.ar .evx-it,.ar .evx-btn,.ar .evx-tag,.ar .evx-ic{border-radius:2px}
.ar .ar-mod__b .evx-list{margin:10px 0 4px}
.ar .ar-evsec{margin-bottom:22px}

/* Lateral */
.ar .ar-stat{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px}
.ar .ar-stat div{background:var(--mcw-bg-alt);padding:9px 6px;text-align:center}
.ar .ar-stat b{display:block;font-family:'Sora',sans-serif;font-size:16px;font-weight:800;color:var(--mcw-ink)}
.ar .ar-stat small{font-size:12px;color:var(--mcw-muted);font-weight:700}
.ar .ar-plabel{font-size:12px;color:var(--mcw-muted);margin-top:6px}
.ar .ar-inc{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.ar .ar-inc li{display:flex;gap:10px;font-size:12.5px;align-items:flex-start;line-height:1.45}
.ar .ar-inc i{color:var(--ok);font-size:14px}
.ar .ar-cert{display:flex;gap:12px;align-items:flex-start}
.ar .ar-cert__i{font-size:26px;color:var(--lock)}
.ar .ar-cert__i.on{color:var(--mcw-crimson)}
.ar .ar-cert p{font-size:12.5px;color:var(--mcw-muted);line-height:1.5}
.ar .ar-cert b{color:var(--mcw-ink)}
.ar .ar-help a{display:flex;align-items:center;gap:10px;font-size:12.5px;font-weight:700;padding:4px 0;color:var(--mcw-ink);background:none;border:none;cursor:pointer;font-family:inherit}
.ar .ar-help a i{color:var(--ok);font-size:15px}
.ar .ar-cross{font-size:12.5px;line-height:1.55;color:var(--mcw-muted)}
.ar .ar-cross a{color:var(--mcw-crimson);font-weight:700}

/* Información */
.ar .ar-desc{font-size:13.5px;line-height:1.7;color:var(--mcw-ink);overflow-wrap:anywhere}
.ar .ar-desc p{margin:0 0 10px}
.ar .ar-datos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--mcw-line);border-left:1px solid var(--mcw-line);margin-bottom:22px}
.ar .ar-datos > div{padding:11px 13px;border-right:1px solid var(--mcw-line);border-bottom:1px solid var(--mcw-line);min-width:0}
.ar .ar-datos small{display:block;font-size:12px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--mcw-muted)}
.ar .ar-datos b{display:block;font-size:13px;margin-top:3px;color:var(--mcw-ink);overflow-wrap:anywhere}
.ar .ar-learn{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 18px;margin-bottom:22px;list-style:none;padding:0}
.ar .ar-learn li{display:flex;gap:9px;font-size:13px;line-height:1.5}
.ar .ar-learn i{color:var(--ok)}

/* Foro existente: esquinas rectas */
.ar .st-forum-card,.ar .st-forum-textarea,.ar .st-forum-answer,.ar .st-btn{border-radius:2px}

/* Otros cursos */
.ar .ar-otros{max-width:1320px;margin:0 auto;padding:0 32px 60px}

/* Barra fija inferior en celular */
.ar-mbar{display:none}

/* ================= LECCIÓN ================= */
.ar .ar-ltop{display:flex;align-items:center;gap:12px;padding:10px 24px;border-bottom:1px solid var(--mcw-line);background:#fff}
.ar .ar-ltop .ar-back{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:700;color:var(--mcw-ink);min-width:0}
.ar .ar-ltop .ar-back span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ar .ar-ltop .ar-back i{color:var(--mcw-crimson)}
.ar .ar-ltop .ar-back:hover span{color:var(--mcw-crimson)}
.ar .ar-ltop .ar-prog{margin-left:auto;display:flex;align-items:center;gap:10px;font-size:11.5px;font-weight:700;color:var(--mcw-muted);flex-shrink:0}
.ar .ar-ltop .ar-prog .ar-pbar{width:120px}
.ar .ar-ltop .ar-tt{display:none}
.ar-lshell{max-width:1320px;margin:0 auto;padding:20px 24px 70px;display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:24px;align-items:start}
.ar .ar-lmain{min-width:0}
.ar .ar-player{position:relative;aspect-ratio:16/9;background:var(--mcw-navy,#0B1220)}
.ar .ar-player iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.ar .ar-player__empty{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#cfd8ea;font-size:13px;padding:20px;text-align:center}
.ar .ar-lhead{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-top:16px;flex-wrap:wrap}
.ar .ar-lhead small{font-size:11px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--mcw-crimson)}
.ar .ar-lhead h1{font-family:'Sora',sans-serif;font-size:20px;font-weight:800;margin-top:4px;color:var(--mcw-ink);overflow-wrap:anywhere}
.ar .ar-lhead .ar-meta{font-size:12.5px;color:var(--mcw-muted);font-weight:600;margin-top:4px;display:flex;gap:12px;flex-wrap:wrap}
.ar .ar-lacts{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.ar .ar-lacts form{margin:0}
.ar .ar-navsq{width:40px;height:38px;padding:0}
.ar .ar-nextbox{display:flex;align-items:center;gap:12px;margin-top:14px;padding:12px 14px;background:var(--ok-bg);border-left:3px solid var(--ok);flex-wrap:wrap}
.ar .ar-nextbox .bi-check-circle-fill{color:var(--ok);font-size:20px}
.ar .ar-nextbox > div{flex:1;min-width:180px;font-size:12.5px;color:var(--mcw-ink)}
.ar .ar-nextbox b{display:block;font-size:13px}
.ar .ar-ltabs{margin-top:18px}
.ar a.ar-file{display:flex;align-items:center;gap:10px;padding:10px 12px;background:var(--mcw-bg-alt);border-radius:2px;margin-bottom:6px;font-size:12.5px;font-weight:600;color:var(--mcw-ink)}
.ar a.ar-file:hover{background:#e9ecf2}
.ar .ar-file i{color:var(--mcw-crimson);font-size:16px}
.ar .ar-file span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ar .ar-file em{font-style:normal;font-size:11px;color:var(--mcw-muted);font-weight:700}
.ar .ar-ask{border:1px solid var(--mcw-line);border-radius:2px;padding:14px;margin-bottom:16px}
.ar .ar-ask textarea{width:100%;border:1px solid var(--mcw-line);border-radius:2px;padding:10px 12px;font:inherit;font-size:13px;min-height:70px;resize:vertical;margin-bottom:8px;color:var(--mcw-ink)}
.ar .ar-ask textarea:focus{outline:none;border-color:var(--mcw-crimson);box-shadow:0 0 0 3px rgba(158,27,50,.1)}
.ar .ar-ask__f{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.ar .ar-ask__f small{color:var(--mcw-muted);font-size:12px}
.ar .ar-q{border:1px solid var(--mcw-line);border-radius:2px;padding:14px;margin-bottom:10px}
.ar .ar-q p{font-size:13.5px;line-height:1.55}
.ar .ar-q .ar-ansr{margin-top:10px;background:var(--mcw-bg-alt);border-left:3px solid var(--ok);padding:10px 12px;font-size:13px;line-height:1.5}
.ar .ar-q.pend{background:var(--mcw-bg-alt);border-style:dashed}

/* Temario de la lección */
.ar .ar-tree{border:1px solid var(--mcw-line);border-radius:2px;position:sticky;top:calc(var(--hdr,64px) + 26px);max-height:calc(100vh - var(--hdr,64px) - 46px);max-height:calc(100dvh - var(--hdr,64px) - 46px);overflow:auto;background:#fff}
.ar .ar-tree.static{position:static;max-height:none}
.ar .ar-tree__top{padding:14px 16px;border-bottom:2px solid var(--mcw-ink)}
.ar .ar-tree__top b{font-family:'Sora',sans-serif;font-size:13px}
.ar .ar-tree__top .ar-pbar{margin-top:10px}
.ar .ar-tmod{border-bottom:1px solid var(--mcw-line)}
.ar .ar-tmod:last-child{border-bottom:none}
.ar .ar-tmod__h{display:flex;gap:10px;align-items:center;width:100%;border:none;background:var(--mcw-bg-alt);padding:11px 14px;cursor:pointer;text-align:left;font-family:'Sora',sans-serif;font-size:12.5px;font-weight:800;color:var(--mcw-ink)}
.ar .ar-tmod__h span{flex:1;min-width:0;overflow-wrap:anywhere}
.ar .ar-tmod__h small{font-family:'Plus Jakarta Sans',sans-serif;font-size:11px;color:var(--mcw-muted);font-weight:700}
.ar .ar-tmod__b{display:none}
.ar .ar-tmod.open .ar-tmod__b{display:block}
.ar .ar-tles{display:grid;grid-template-columns:22px minmax(0,1fr) auto;gap:10px;align-items:center;padding:9px 14px;font-size:12.5px;border-left:3px solid transparent;color:var(--mcw-ink)}
.ar a.ar-tles:hover{background:var(--mcw-bg-alt);color:var(--mcw-ink)}
.ar .ar-tles .ar-st{width:18px;height:18px;font-size:12px}
.ar .ar-tles.done .ar-st{background:var(--ok);border-color:var(--ok)}
.ar .ar-tles.cur{background:var(--crimson-soft);border-left-color:var(--mcw-crimson);font-weight:700;color:var(--mcw-crimson)}
.ar .ar-tles.cur .ar-st{border-color:var(--mcw-crimson);color:var(--mcw-crimson)}
.ar .ar-tles.lock{color:var(--mcw-muted)}
.ar .ar-tles.lock .ar-st{border:none;color:var(--lock);font-size:12px}
.ar .ar-tles .ar-dur-t{font-size:11px}
.ar .ar-tles.ev .ar-st{border:none;color:var(--info);font-size:13px}
.ar-lbar{display:none}

/* ================= Tablet ================= */
@media (max-width:1080px){
  .ar-shell{grid-template-columns:minmax(0,1fr)}
  .ar .ar-side{position:static;grid-template-columns:repeat(2,minmax(0,1fr))}
  /* Lección: el temario sigue al costado (más angosto) hasta 900 px. */
  .ar-lshell{grid-template-columns:minmax(0,1fr) 290px;gap:18px;padding-left:18px;padding-right:18px}
  .ar .ar-buy{grid-template-columns:minmax(0,1fr) 230px}
  .ar .ar-buy .ar-preview,.ar .ar-buy .ar-thumb{grid-column:1/-1}
}
@media (max-width:899px){
  .ar-lshell{grid-template-columns:minmax(0,1fr)}
  .ar .ar-ltree{display:none}
  .ar .ar-ltop .ar-tt{display:inline-flex}
}
@media (min-width:900px){ .ar .ar-solo-movil{display:none!important} }

/* El video nunca más alto que la pantalla: en un iPad horizontal ocupaba
   todo y los botones de la lección quedaban fuera de vista. Se angosta
   manteniendo la proporción 16:9. */
.ar .ar-player{max-width:calc((100vh - var(--hdr,64px) - 150px) * 16 / 9);margin-left:auto;margin-right:auto}
@supports (height:100dvh){
  .ar .ar-player{max-width:calc((100dvh - var(--hdr,64px) - 150px) * 16 / 9)}
}

/* ================= Celular ================= */
@media (max-width:700px){
  .ar .ar-hero{min-height:0;padding:26px 16px 18px}
  .ar .ar-hero h1{font-size:21px}
  .ar .ar-hero .lv-hero__sub{display:none}
  .ar .ar-hero .lv-hero__meta{gap:6px 14px;font-size:12px}
  .ar-shell{padding:14px 14px 90px;gap:16px}
  .ar .ar-resume{grid-template-columns:minmax(0,1fr);padding:0;gap:0}
  .ar .ar-resume > .ar-thumb{border-bottom:1px solid var(--mcw-line)}
  .ar .ar-resume > div:not(.ar-thumb){padding:12px 14px 0}
  .ar .ar-resume > .ar-resume__acts{padding:12px 14px 14px;min-width:0}
  .ar .ar-resume h2,.ar .ar-buy h2{font-size:15px}
  .ar .ar-buy,.ar .ar-buy.sin-preview{grid-template-columns:minmax(0,1fr);padding:14px}
  .ar .ar-buy .ar-preview,.ar .ar-buy .ar-thumb{margin:-14px -14px 0}
  .ar .ar-tabs{margin:0 -14px 14px;padding:0 8px}
  .ar .ar-mod__bar{display:none}
  .ar .ar-mod__h{padding:13px 12px}
  .ar .ar-mod__b{padding:2px 4px 8px}
  .ar .ar-les{grid-template-columns:24px minmax(0,1fr) auto;gap:10px;padding:11px 6px}
  .ar .ar-les .ar-chipcol{display:none}
  .ar .ar-les__t b{white-space:normal}
  .ar .ar-datos{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ar .ar-learn{grid-template-columns:minmax(0,1fr)}
  .ar .ar-side{grid-template-columns:minmax(0,1fr)}
  .ar .ar-m-hide{display:none}
  .ar .ar-otros{padding:0 14px 90px}
  .ar-mbar{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:150;background:#fff;border-top:1px solid var(--mcw-line,#E2E5EC);padding:10px 14px;gap:12px;align-items:center;box-shadow:0 -8px 20px rgba(11,18,32,.08);font-family:'Plus Jakarta Sans',sans-serif}
  .ar-mbar__t{flex:1;min-width:0;font-size:11.5px;color:var(--mcw-muted,#5C6B85);font-weight:700}
  .ar-mbar__t b{display:block;font-size:13px;color:var(--mcw-ink,#14213D);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .ar-mbar__bar{height:4px;background:#e3e6ec;margin-top:5px}
  .ar-mbar__bar i{display:block;height:100%;background:var(--mcw-crimson,#9E1B32)}
  .ar-mbar .ar-mbar__btn,.ar-lbar .ar-mbar__btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;border:none;border-radius:2px;padding:10px 14px;font-family:'Sora',sans-serif;font-weight:700;font-size:12px;white-space:nowrap;text-decoration:none;background:var(--mcw-crimson,#9E1B32);color:#fff;cursor:pointer}
  .ar-mbar form,.ar-lbar form{margin:0;display:flex}
  /* Lección */
  .ar .ar-ltop{padding:9px 14px}
  .ar .ar-ltop .ar-prog .ar-pbar{display:none}
  .ar-lshell{padding:0 0 90px;gap:0}
  .ar .ar-lbody{padding:0 14px}
  .ar .ar-lhead h1{font-size:17px}
  .ar .ar-lacts{display:none}
  .ar-lbar{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:150;background:#fff;border-top:1px solid var(--mcw-line,#E2E5EC);padding:8px 10px;gap:8px;box-shadow:0 -8px 20px rgba(11,18,32,.08)}
  .ar-lbar > *{flex:1}
  .ar-lbar .ar-mbar__btn{width:100%;padding:11px 8px}
  .ar-lbar .ar-mbar__btn.soft{background:var(--mcw-bg-alt,#F5F7FA);color:var(--mcw-ink,#14213D)}
  .ar-lbar .ar-mbar__btn.ok{background:var(--mcw-ok-bg,#E4F6EF);color:var(--mcw-ok,#0B7A5C);cursor:default}
  .ar-lbar .ar-mbar__btn.off{opacity:.4;pointer-events:none}
  .ar-lbar .ar-sq{flex:0 0 48px}
}

/* Certificado: acciones y aviso de nombre pendiente */
.ar .ar-cert__acc{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.ar .ar-cert__i.warn{color:var(--mcw-crimson)}


/* «Seguir viendo»: aviso de retomar, lección completada sola y cuenta atrás
   a la siguiente lección (ver static/js/progreso-video.js). */
.ar .ar-retoma{display:flex;align-items:center;gap:8px;margin:10px 0 0;padding:8px 12px;background:var(--mcw-bg-alt);border-left:3px solid var(--mcw-crimson);font-size:12.5px;font-weight:600;color:var(--mcw-ink)}
.ar .ar-retoma i{color:var(--mcw-crimson)}
.ar .ar-aviso-video{margin:10px 0 0;padding:10px 14px;background:var(--ok-bg);border-left:3px solid var(--ok);font-size:13px;font-weight:700;color:var(--mcw-ink)}
.ar .ar-siguiente{position:absolute;inset:0;z-index:3;display:flex;align-items:center;justify-content:center;background:rgba(6,10,22,.82);color:#fff;text-align:center;padding:16px}
.ar .ar-siguiente > div{display:grid;gap:10px;justify-items:center;max-width:420px}
.ar .ar-siguiente small{font-size:13px;color:#cfd8ea}
.ar .ar-siguiente strong{font-family:'Sora',sans-serif;font-size:17px;line-height:1.3}
.ar .ar-siguiente span{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}

/* Herramientas para practicar: a lo ancho cuando la columna derecha baja */
@media (max-width:1080px){ .ar .ar-side .ar-tools-card{grid-column:1/-1} }