/* ===================== Certificados Exclusivos y clases en vivo (MASTER PSD) =====================
   Estilo: sobrio y suave (tipo Apple). Poco brillo, transiciones largas y tranquilas. */
:root{--lg-ease:cubic-bezier(.22,1,.36,1)}

/* ---------- «EN VIVO» ---------- */
@keyframes vivoLate{0%,100%{opacity:1}50%{opacity:.35}}
.en-vivo{display:inline-flex;align-items:center;gap:7px;padding:4px 10px;border-radius:999px;background:#e0001b;color:#fff;font:800 11.5px var(--fb);letter-spacing:.12em;text-transform:uppercase}
.en-vivo i{width:8px;height:8px;border-radius:50%;background:#fff;animation:vivoLate 1.1s ease-in-out infinite}
.nav a.nav-vivo{color:#fff;background:rgba(224,0,27,.16);box-shadow:inset 0 0 0 1px rgba(255,42,61,.5)}
.nav a.nav-vivo .ic{color:#ff2a3d;animation:vivoLate 1.1s ease-in-out infinite}
.nav .nav-badge{margin-left:auto;font:800 11px var(--fb);padding:2px 7px;border-radius:999px;background:rgba(255,255,255,.08);color:var(--muted)}
.vivo-pg{max-width:1100px}
.vivo-marco{position:relative;aspect-ratio:16/9;border-radius:16px;overflow:hidden;background:#000;box-shadow:0 30px 80px -30px rgba(224,0,27,.6);border:1px solid rgba(255,42,61,.35)}
.vivo-marco iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.vivo-info{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:16px 0 6px}
.vivo-info h1{font:800 26px var(--fh);letter-spacing:-.02em}
.vivo-ok{color:var(--muted);font-size:14px}

/* menú con los 3 certificados: solo el ícono y las letras en dorado, con una luz que pasa cada tanto (sin caja) */
@keyframes lgOroLuz{0%,62%{background-position:160% 0}100%{background-position:-60% 0}}
@keyframes lgIcoOro{0%,60%,100%{filter:none}78%{filter:brightness(1.5) drop-shadow(0 0 4px rgba(255,226,160,.9))}}
.nav a.lg-oro span{background:linear-gradient(100deg,#b8893a 0%,#e9cf96 35%,#fff7dc 50%,#e9cf96 65%,#b8893a 100%);background-size:260% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:lgOroLuz 5s ease-in-out infinite}
.nav a.lg-oro .ic{color:#e9cf96;animation:lgIcoOro 5s ease-in-out infinite}

/* ---------- módulo «Clases en vivo» (el primero de la primera fila del inicio) ---------- */
.vivo-card .vc-art{position:relative;aspect-ratio:2/3;border-radius:10px;overflow:hidden;background:linear-gradient(180deg,#1a0508,#0a0a0c);border:1px solid rgba(255,255,255,.08);box-shadow:0 14px 34px -16px rgba(0,0,0,.8);transition:box-shadow .5s var(--lg-ease),border-color .5s}
.vc-art>img{width:100%;height:100%;object-fit:cover;display:block}
.vivo-card:not(.on) .vc-art>img{filter:saturate(.7) brightness(.62)}
.vc-sin{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:radial-gradient(80% 60% at 50% 35%,rgba(224,0,27,.4),transparent 70%),#0b0b0d}
.vc-sin img{width:60px;border-radius:14px}
.vc-sin b{font:400 52px Anton,sans-serif;letter-spacing:.04em;line-height:1}
.vc-sin small{letter-spacing:.32em;font-weight:800;font-size:11px;color:var(--muted)}
.vc-velo{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(0deg,rgba(0,0,0,.92) 0%,rgba(0,0,0,.5) 34%,transparent 60%)}
.vc-badge{position:absolute;left:50%;top:14px;translate:-50% 0;z-index:3;display:inline-flex;align-items:center;gap:7px;padding:5px 11px;border-radius:999px;white-space:nowrap;background:rgba(18,18,20,.62);border:1px solid rgba(255,255,255,.14);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);font:700 10.5px var(--fb);letter-spacing:.14em;text-transform:uppercase;color:#fff}
.vivo-card.on .vc-badge{background:#e0001b;border-color:rgba(255,255,255,.18)}
.vc-badge i{width:7px;height:7px;border-radius:50%;background:#fff;animation:vivoLate 1.1s ease-in-out infinite}
.vc-pie{position:absolute;left:0;right:0;bottom:0;z-index:3;padding:16px 16px 18px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px}
.vc-pie b{font:700 16px/1.25 var(--fh);letter-spacing:-.01em}
.vc-pie small{color:#d4d4d8;font-size:13px}
.vc-cd{margin-top:4px;padding:5px 11px;border-radius:999px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.1);font:600 12px var(--fb);color:#e4e4e7}
.vc-btn{margin-top:8px;width:100%;display:inline-flex;align-items:center;justify-content:center;gap:7px;height:40px;border-radius:12px;background:#e0001b;font:700 13.5px var(--fh);transition:background .3s}
.vivo-card.on:hover .vc-btn{background:#e0001b;box-shadow:0 8px 22px -8px rgba(224,0,27,.85)}
/* en vivo: respira en rojo por dentro, suave */
@keyframes vivoRespira{0%,100%{border-color:rgba(255,42,61,.28);box-shadow:0 10px 26px -14px rgba(0,0,0,.8)}50%{border-color:rgba(255,42,61,.6);box-shadow:0 0 10px rgba(255,42,61,.2)}}
@keyframes vivoTinte{0%,100%{opacity:.15}50%{opacity:.45}}
.vivo-card.on .vc-art{border:1px solid rgba(255,42,61,.3);animation:vivoRespira 3.2s ease-in-out infinite}
.vivo-card.on .vc-art::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;border-radius:inherit;box-shadow:inset 0 0 26px rgba(255,30,50,.3);background:linear-gradient(0deg,rgba(224,0,27,.2),transparent 50%);animation:vivoTinte 3.2s ease-in-out infinite}
.vivo-card:not(.on) .vc-pie small{font-size:12.5px;color:#d4d4d8}

/* ---------- página «Certificados Exclusivos» ---------- */
.page.lg-pg{max-width:1240px;margin-inline:auto}
.lg-hero{text-align:center;max-width:820px;margin:0 auto 22px}
.lg-k{display:inline-flex;align-items:center;gap:8px;padding:6px 13px;border-radius:999px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);font:700 11px var(--fb);letter-spacing:.12em;text-transform:uppercase;color:#d4d4d8}
.lg-k .ic{color:#d6af6a}
.lg-k.oro{color:#e9cf96;border-color:rgba(214,175,106,.35);background:rgba(214,175,106,.06)}
.lg-det .lg-k{color:var(--c)}
.lg-hero h1{font:800 clamp(36px,4.8vw,62px)/1.02 var(--fh);letter-spacing:-.035em;margin:14px 0 12px;background:linear-gradient(180deg,#fff 35%,#9b9ba5);-webkit-background-clip:text;background-clip:text;color:transparent}
.lg-hero h1.lg-oro-txt{background:linear-gradient(100deg,#b8893a 0%,#e9cf96 30%,#fff7dc 50%,#e9cf96 70%,#b8893a 100%);background-size:260% 100%;-webkit-background-clip:text;background-clip:text;animation:lgOroLuz 6s ease-in-out infinite}
.lg-hero p{color:var(--muted);line-height:1.65;font-size:15.5px}
.lg-cuenta{display:inline-flex;align-items:center;gap:7px;margin-top:16px;padding:8px 14px;border-radius:999px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);font-size:13.5px;color:var(--muted)}
.lg-cuenta i{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.14)}
.lg-cuenta i.on{background:var(--c)}
.lg-cuenta span{margin-left:4px}.lg-cuenta b{color:#fff}

/* vitrina: el elegido grande al centro y los otros dos asomando a los lados */
.lg-show{position:relative;margin-top:6px}
.lg-luz{position:absolute;left:50%;top:46%;width:64%;height:80%;transform:translate(-50%,-50%);background:radial-gradient(closest-side,color-mix(in srgb,var(--c) 22%,transparent),transparent);filter:blur(40px);opacity:.6;pointer-events:none;transition:background .9s}
.lg-stage{position:relative;aspect-ratio:2;perspective:1800px;touch-action:pan-y;user-select:none;-webkit-user-select:none}
.lg-slide{position:absolute;left:50%;top:3%;width:62%;transition:transform .9s var(--lg-ease),opacity .8s,filter .8s;cursor:pointer;will-change:transform}
.lg-slide[data-p="0"]{transform:translateX(-50%);z-index:3}
.lg-slide[data-p="-1"]{transform:translateX(-112%) scale(.7) rotateY(24deg);z-index:1;opacity:.5;filter:brightness(.5)}
.lg-slide[data-p="1"]{transform:translateX(12%) scale(.7) rotateY(-24deg);z-index:1;opacity:.5;filter:brightness(.5)}
.lg-slide:not([data-p="0"]):hover{opacity:.75;filter:brightness(.65)}
.lg-frame{position:relative;display:block;border-radius:14px;overflow:hidden;box-shadow:0 40px 90px -45px rgba(0,0,0,.95),0 0 0 1px rgba(255,255,255,.08);transition:transform .6s var(--lg-ease),box-shadow .6s}
.lg-slide.ok[data-p="0"] .lg-frame{box-shadow:0 40px 90px -45px rgba(0,0,0,.95),0 0 0 1px rgba(255,255,255,.16)}
.lg-slide[data-p="0"]:hover .lg-frame{transform:scale(1.015)}
.lg-slide.bloq .dip,.lg-det-bloq .dip{filter:grayscale(1) brightness(.46) contrast(1.06)}
/* brillo de cristal que cruza de vez en cuando */
@keyframes lgPasa{0%{transform:translateX(-130%) skewX(-18deg)}24%,100%{transform:translateX(330%) skewX(-18deg)}}
.lg-brillo{position:absolute;top:0;bottom:0;left:0;width:30%;z-index:4;pointer-events:none;background:linear-gradient(90deg,transparent,rgba(255,255,255,.14) 45%,rgba(255,255,255,.22) 50%,rgba(255,255,255,.14) 55%,transparent);transform:translateX(-130%) skewX(-18deg);animation:lgPasa 7s 1.4s ease-in-out infinite}
.lg-slide:not([data-p="0"]) .lg-brillo{animation:none}
.lg-sello{position:absolute;left:50%;top:-13px;translate:-50% 0;z-index:6;display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:999px;background:rgba(24,24,27,.85);border:1px solid rgba(255,255,255,.14);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff;font:700 10.5px var(--fb);letter-spacing:.12em;text-transform:uppercase}
.lg-sello .ic{color:var(--c)}
.lg-candado{position:absolute;inset:0;z-index:5;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:#fff;text-align:center;padding:12px}
.lg-candado b{font:700 11px var(--fb);letter-spacing:.28em;text-transform:uppercase;padding:6px 14px;border-radius:999px;background:rgba(0,0,0,.55);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.lg-candado em{font-style:normal;font:600 14px var(--fb);color:#e4e4e7;text-shadow:0 2px 10px #000}
.lg-slide:not([data-p="0"]) .lg-candado em{display:none}
@keyframes lgLatido{0%,100%{transform:scale(1)}50%{transform:scale(1.04)}}
.lg-anillo{position:relative;width:96px;height:96px;display:grid;place-items:center;border-radius:50%;background:radial-gradient(circle at 50% 30%,rgba(255,255,255,.12),rgba(0,0,0,.55));-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 16px 40px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.18)}
.lg-anillo>svg:not(.lg-cand){position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.lg-anillo .bg{fill:none;stroke:rgba(255,255,255,.12);stroke-width:3}
.lg-anillo .fg{fill:none;stroke:#fff;stroke-width:3;stroke-linecap:round;transition:stroke-dashoffset 1.2s var(--lg-ease)}
.lg-anillo .lg-cand{position:relative;width:40px;height:40px;filter:drop-shadow(0 4px 10px rgba(0,0,0,.5))}
.lg-slide.bloq[data-p="0"] .lg-anillo{animation:lgLatido 3s ease-in-out infinite}
.lg-arr{position:absolute;top:40%;z-index:6;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:rgba(24,24,27,.6);border:1px solid rgba(255,255,255,.12);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:#fff;transition:transform .3s var(--lg-ease),background .3s}
.lg-arr:hover{background:rgba(255,255,255,.14);transform:scale(1.06)}
.lg-arr.l{left:1%}.lg-arr.r{right:1%}
/* pestañas: sobrias, sin brillo */
.lg-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;max-width:940px;margin:36px auto 0}
.lg-tab{position:relative;overflow:hidden;display:flex;align-items:center;gap:12px;padding:12px 14px 16px;border-radius:14px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.07);text-align:left;transition:background .4s var(--lg-ease),border-color .4s}
.lg-tab:hover{background:rgba(255,255,255,.055)}
.lg-tab.on{background:rgba(255,255,255,.075);border-color:rgba(255,255,255,.16)}
.lg-tab .ico{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.06);color:#8b8b94}
.lg-tab.ok .ico{color:var(--c);background:rgba(255,255,255,.08)}
.lg-tab b{display:block;font:700 14px var(--fh);letter-spacing:-.01em}
.lg-tab small{color:var(--muted);font-size:12px}
.lg-tbar{position:absolute;left:14px;right:14px;bottom:7px;height:2px;border-radius:2px;background:rgba(255,255,255,.07);overflow:hidden}
.lg-tbar i{display:block;height:100%;border-radius:inherit;background:var(--c);opacity:.85;transition:width 1.1s var(--lg-ease)}

/* detalle del elegido: por qué se otorga, requisitos con su avance y qué recibe */
.lg-det-card{max-width:1000px;margin:30px auto 0}
@keyframes lgEntra{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.lg-det-card.cambia .lg-dk{animation:lgEntra .6s var(--lg-ease)}
.lg-dk{border-radius:22px;border:1px solid rgba(255,255,255,.07);background:radial-gradient(110% 80% at 0% 0%,color-mix(in srgb,var(--c) 8%,transparent),transparent 55%),var(--card);padding:clamp(18px,3vw,32px)}
.lg-tag{display:inline-flex;align-items:center;gap:6px;padding:5px 11px;border-radius:999px;font:700 10.5px var(--fb);letter-spacing:.12em;text-transform:uppercase;color:#0b0b0d;background:var(--c)}
.lg-tag.no{background:rgba(255,255,255,.08);color:#d4d4d8}
.lg-dk-h small{display:block;color:var(--c);font:700 11.5px var(--fb);letter-spacing:.12em;text-transform:uppercase;margin-top:14px}
.lg-dk-h h2{font:800 clamp(26px,3vw,38px) var(--fh);letter-spacing:-.03em;margin:4px 0 10px}
.lg-motivo{color:#d4d4d8;line-height:1.75;font-size:15px;max-width:840px}
.lg-motivo b{color:#fff}
.lg-dk-g{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:16px;margin-top:22px}
.lg-col{padding:18px;border-radius:16px;background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.06)}
.lg-col h4{display:flex;align-items:center;gap:8px;font:700 12px var(--fb);letter-spacing:.1em;text-transform:uppercase;color:#e4e4e7;margin-bottom:14px}
.lg-col h4 .ic{color:var(--c)}
.lg-reqs{list-style:none;display:flex;flex-direction:column;gap:10px}
.lg-reqs li{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:12px;align-items:center;padding:12px;border-radius:12px;background:rgba(0,0,0,.22);border:1px solid rgba(255,255,255,.06)}
.lg-reqs .ico{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.06);color:var(--muted)}
.lg-reqs li.ok .ico{background:#e0001b;color:#ffffff}
.lg-reqs b{display:block;font-size:14px;font-weight:600;color:#fff;margin-bottom:7px;line-height:1.35}
.lg-mbar{display:block;height:4px;border-radius:9px;background:rgba(255,255,255,.08);overflow:hidden}
.lg-mbar i{display:block;height:100%;border-radius:inherit;background:var(--c)}
.lg-reqs li.ok .lg-mbar i{background:#e0001b}
.lg-reqs em{font-style:normal;font:700 13px var(--fb);color:#fff;white-space:nowrap}
.lg-tip{display:flex;gap:9px;align-items:flex-start;margin-top:12px;font-size:13.5px;line-height:1.6;color:var(--muted)}
.lg-tip .ic{flex:none;margin-top:2px;color:var(--c)}
.lg-tip b{color:#fff}
.lg-tip.rojo{align-items:center;color:#fff}
.lg-recibe{list-style:none;display:flex;flex-direction:column;gap:12px}
.lg-recibe li{display:flex;gap:10px;font-size:14px;line-height:1.5;color:#e4e4e7}
.lg-recibe .ic{flex:none;margin-top:2px;color:var(--c)}
.lg-dk-pie{display:flex;align-items:center;gap:22px;margin-top:22px;flex-wrap:wrap}
.lg-avance{flex:1;min-width:240px}
.lg-bar{height:8px;border-radius:99px;background:rgba(255,255,255,.07);overflow:hidden}
.lg-bar i{display:block;height:100%;border-radius:inherit;background:var(--c);transition:width 1.2s var(--lg-ease)}
.lg-est{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:8px;font-size:13.5px;color:var(--muted)}
.lg-est b{color:#fff}
.lg-ok{display:inline-flex;align-items:center;gap:6px;color:#ff4d5c;font-weight:700}
/* formación completa: aviso del paso en el que va */
@keyframes lgAviso{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.lg-paso{display:flex;align-items:center;gap:16px;margin-top:20px;padding:16px 18px;border-radius:16px;background:linear-gradient(90deg,rgba(224,0,27,.14),rgba(224,0,27,.04));border:1px solid rgba(255,42,61,.35);animation:lgAviso .6s var(--lg-ease)}
.lg-paso>div{flex:1;min-width:0}
.lg-paso b{display:block;font:700 15.5px var(--fh);color:#fff}
.lg-paso p{margin-top:4px;color:#d4d4d8;font-size:13.5px;line-height:1.55}
.lg-paso .ico{flex:none;width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:#e0001b;color:#fff}
.lg-paso .ico.nota{display:flex;flex-direction:column;align-items:center;justify-content:center;font:800 20px/1 var(--fh);background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);width:60px;height:60px}
.lg-paso .ico.nota small{font-size:11px;color:var(--muted);font-weight:600;margin-top:3px}
.lg-paso blockquote{margin:8px 0 2px;padding:10px 14px;border-radius:12px;background:rgba(0,0,0,.25);border-left:2px solid rgba(255,255,255,.35);color:#f4f4f5;font-size:14px;line-height:1.55;font-style:italic}
.lg-paso blockquote cite{display:block;margin-top:4px;font-style:normal;font-size:12px;color:var(--muted)}
.lg-paso.gris{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.1)}
.lg-paso.gris .ico{background:rgba(255,255,255,.1)}
.lg-paso.rojo .ico.nota{color:#ff6b78;border-color:rgba(255,42,61,.4)}
.lg-paso.verde{background:linear-gradient(90deg,rgba(224,0,27,.12),rgba(224,0,27,.03));border-color:rgba(224,0,27,.35)}
.lg-paso.verde .ico.nota{color:#ff4d5c;border-color:rgba(224,0,27,.4)}
@media (max-width:700px){.lg-paso{flex-wrap:wrap}.lg-paso .btn-pri{width:100%}}
/* colección completa: los 3, ordenados y sin textos de más */
.lg-trio{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:10px}
.lg-pieza{animation:lgEntra .8s var(--lg-ease) both}
.lg-pieza:nth-child(2){animation-delay:.08s}.lg-pieza:nth-child(3){animation-delay:.16s}
.lg-pieza .lg-frame:hover{transform:translateY(-4px)}
.lg-pieza-pie{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:14px}
.lg-pieza-pie b{display:block;font:700 15px var(--fh)}
.lg-pieza-pie small{color:var(--muted);font-size:12.5px}
.lg-btn-min{flex:none;display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 13px;border-radius:999px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);font:600 12.5px var(--fb);color:#fff;transition:background .3s}
.lg-btn-min:hover{background:rgba(255,255,255,.14)}
@media (max-width:980px){.lg-trio{grid-template-columns:1fr;max-width:640px;margin-inline:auto}}
@media (max-width:860px){
  .lg-stage{aspect-ratio:1.5}
  .lg-slide{width:82%;top:8%}
  .lg-slide[data-p="-1"]{transform:translateX(-128%) scale(.74) rotateY(22deg)}
  .lg-slide[data-p="1"]{transform:translateX(28%) scale(.74) rotateY(-22deg)}
  .lg-arr{width:40px;height:40px;top:34%}
  .lg-tabs{grid-template-columns:1fr}
  .lg-dk-g{grid-template-columns:1fr}
  .lg-anillo{width:72px;height:72px}.lg-anillo .lg-cand{width:30px;height:30px}
  .lg-candado em{font-size:12.5px}
}

/* ---------- página de cada certificado: todo centrado ---------- */
.page.lg-det{max-width:1000px;margin-inline:auto}
.lg-volver{display:flex;width:max-content;align-items:center;gap:6px;color:var(--muted);font-size:14px;margin-bottom:10px}
.lg-det-h{text-align:center;margin:4px 0 24px}
.lg-det-h h1{margin-top:12px;font:800 clamp(32px,4vw,50px)/1.05 var(--fh);letter-spacing:-.035em}
.lg-det .lg-acc{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:0 0 22px}
.lg-det .lg-acc button[disabled]{opacity:.4;cursor:not-allowed}
.lg-det-dip{max-width:980px;margin:0 auto}
.lg-det-bloq{margin-top:26px}
.lg-nota{font-size:12.5px;color:var(--dim);margin-top:10px}
.lg-aviso-firma{max-width:680px;margin:0 auto 18px;display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:16px;background:linear-gradient(90deg,rgba(224,0,27,.12),rgba(224,0,27,.03));border:1px solid rgba(255,42,61,.3);text-align:left;animation:lgAviso .6s var(--lg-ease)}
.lg-aviso-firma>div{flex:1;min-width:0}
.lg-aviso-firma b{display:block;font:700 15px var(--fh)}
.lg-aviso-firma p{margin-top:2px;color:var(--muted);font-size:13.5px}
.lg-aviso-firma .ico{flex:none;width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:#e0001b;color:#fff}
.lg-det-falta{max-width:620px;margin:0 auto}
@media (max-width:700px){.lg-aviso-firma{flex-wrap:wrap}.lg-aviso-firma .btn-pri{width:100%}}
/* proyecto final: una tarjeta centrada; se cierra en revisión y cuando ya está aprobado */
.lg-proy{max-width:640px;margin:0 auto;padding:28px 26px;border-radius:20px;border:1px solid rgba(255,255,255,.08);background:var(--card);text-align:center;scroll-margin-top:90px}
@keyframes lgResalta{0%{box-shadow:0 0 0 0 rgba(255,42,61,0)}30%{box-shadow:0 0 0 3px rgba(255,42,61,.5)}100%{box-shadow:0 0 0 0 rgba(255,42,61,0)}}
.lg-proy.resalta{animation:lgResalta 1.8s .4s ease}
.lg-proy h2{font:800 22px var(--fh);letter-spacing:-.02em;margin:12px 0 6px}
.lg-proy>p{color:var(--muted);font-size:14px;line-height:1.55}
.lg-proy-ico{width:52px;height:52px;border-radius:16px;display:inline-grid;place-items:center;background:#e0001b;color:#fff}
.lg-proy-ico.gris{background:rgba(255,255,255,.1)}
.lg-nota-gr{display:inline-flex;align-items:baseline;gap:2px;font:800 44px/1 var(--fh);letter-spacing:-.03em}
.lg-nota-gr small{font-size:17px;color:var(--muted);font-weight:600}
.lg-nota-gr.rojo{color:#ff6b78}.lg-nota-gr.verde{color:#ff4d5c}
.lg-proy blockquote{margin:14px 0 6px;padding:12px 14px;border-radius:12px;background:rgba(0,0,0,.25);border-left:2px solid rgba(255,255,255,.3);text-align:left;color:#f4f4f5;font-size:14px;line-height:1.55;font-style:italic}
.lg-proy blockquote cite{display:block;margin-top:4px;font-style:normal;font-size:12px;color:var(--muted)}
.lg-proy .brief{margin:16px 0 10px;padding:14px 16px;border-radius:12px;background:rgba(255,255,255,.03);border:1px solid var(--line);white-space:pre-wrap;text-align:left;line-height:1.6;color:#e4e4e8;font-size:14px}
.lg-proy form{display:flex;flex-direction:column;gap:12px;margin-top:18px;text-align:left}
.lg-proy form label{display:flex;flex-direction:column;gap:6px;font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--dim)}
.lg-proy form .btn-pri{align-self:center;margin-top:6px}
.lg-proy .pf-ent{margin-top:16px;text-align:left}

/* ---------- simulador (Erick) ---------- */
.lg-sim{max-width:1000px;margin:0 auto 20px;padding:16px;border-radius:18px;border:1px dashed rgba(255,255,255,.14);background:rgba(255,255,255,.02)}
.lg-sim-h{display:flex;align-items:center;gap:10px 16px;flex-wrap:wrap}
.lg-sim-k{display:inline-flex;align-items:center;gap:7px;font:700 11.5px var(--fb);letter-spacing:.1em;text-transform:uppercase;color:#ff5a68}
.lg-sim-h p{flex:1;min-width:240px;font-size:13px;line-height:1.5;color:var(--muted)}
.lg-sim-acc{display:flex;gap:8px}
.lg-sim button{height:32px;padding:0 12px;border-radius:9px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);font:600 12.5px var(--fb);color:#fff;transition:background .25s}
.lg-sim button:hover{background:rgba(255,255,255,.14)}
.lg-sim button.on{background:#fff;color:#111;border-color:transparent}
.lg-sim-g{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:14px}
.lg-sim-f{display:flex;flex-direction:column;justify-content:space-between;gap:12px;padding:12px;border-radius:12px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.07);border-top:2px solid var(--c)}
.lg-sim-f b{display:flex;align-items:center;gap:6px;font-size:13.5px}
.lg-sim-f small{display:block;margin-top:3px;color:var(--muted);font-size:12px}
.lg-sim-f.ok b .ic{color:#e0001b}
.lg-sim-f>span{display:flex;flex-wrap:wrap;gap:6px}
@media (max-width:860px){.lg-sim-g{grid-template-columns:1fr}}

/* ---------- desbloqueo ----------
   aurora roja + el color del certificado → candado metálico en un disco de cristal: el aro se llena y el arco se abre →
   destello y polvo de luz → el certificado sube y se enfoca, pasa a color y «Nombre Aquí» cambia al nombre del alumno → agradecimiento. */
.lg-fiesta{position:fixed;inset:0;z-index:300;display:grid;place-items:center;padding:24px;overflow:hidden;background:rgba(8,3,5,.78);-webkit-backdrop-filter:blur(22px) saturate(1.3);backdrop-filter:blur(22px) saturate(1.3);animation:lgFondo .5s ease both}
.lg-fiesta.sale{animation:lgFondoSale .38s ease both}
@keyframes lgFondo{from{opacity:0}to{opacity:1}}
@keyframes lgFondoSale{to{opacity:0;transform:scale(1.02)}}
.lg-aurora{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.lg-aurora i{position:absolute;border-radius:50%;filter:blur(90px);opacity:0;animation:lgAuroraIn 1.4s ease forwards,lgAuroraMueve 14s ease-in-out infinite alternate}
.lg-aurora .a{width:60vmax;height:60vmax;left:-12vmax;top:-18vmax;background:#e0001b}
.lg-aurora .b{width:52vmax;height:52vmax;right:-14vmax;bottom:-20vmax;background:#b0000f;animation-delay:.15s,-4s}
.lg-aurora .c{width:40vmax;height:40vmax;left:30%;top:28%;background:var(--c);animation-delay:.3s,-8s}
@keyframes lgAuroraIn{to{opacity:.55}}
@keyframes lgAuroraMueve{0%{transform:translate(0,0) scale(1)}100%{transform:translate(6vmax,4vmax) scale(1.12)}}
.lg-bruma{position:absolute;inset:0;pointer-events:none;background:radial-gradient(60% 50% at 50% 50%,rgba(255,255,255,0),rgba(0,0,0,.45))}
.lg-cerradura,.lg-fx{grid-area:1/1}
.lg-cerradura{position:relative;z-index:3;width:150px;height:150px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 50% 28%,rgba(255,255,255,.16),rgba(255,255,255,.03) 70%);border:1px solid rgba(255,255,255,.16);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);box-shadow:0 30px 80px -24px rgba(0,0,0,.8),inset 0 1px 0 rgba(255,255,255,.28);animation:lgCerIn .7s .1s var(--lg-ease) both,lgCerOut .7s 1.9s var(--lg-ease) forwards;pointer-events:none}
.lg-cerradura .lg-aro{position:absolute;inset:-1px;width:calc(100% + 2px);height:calc(100% + 2px);transform:rotate(-90deg)}
.lg-aro .bg{fill:none;stroke:rgba(255,255,255,.1);stroke-width:2}
.lg-aro .fg{fill:none;stroke:url(#lgAroG);stroke-width:2.4;stroke-linecap:round;animation:lgAroLlena 1s .35s var(--lg-ease) forwards}
@keyframes lgAroLlena{to{stroke-dashoffset:0}}
.lg-cerradura .lg-cand{width:66px;height:66px;overflow:visible;filter:drop-shadow(0 8px 18px rgba(0,0,0,.55))}
.lg-cerradura .arco{transform-origin:31.5px 21.5px;animation:lgArcoAbre .6s 1.35s cubic-bezier(.34,1.56,.64,1) forwards}
@keyframes lgArcoAbre{0%{transform:none}40%{transform:translateY(-4px)}100%{transform:translateY(-4px) rotate(32deg)}}
@keyframes lgCerIn{from{opacity:0;transform:scale(.86);filter:blur(10px)}to{opacity:1;transform:none;filter:none}}
@keyframes lgCerOut{0%{opacity:1;transform:none;filter:none}100%{opacity:0;transform:scale(1.35);filter:blur(12px)}}
.lg-cerradura::after{content:"";position:absolute;inset:-40%;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.85),rgba(255,80,100,.35) 35%,transparent 65%);opacity:0;animation:lgDestello 1s 1.85s ease-out forwards}
@keyframes lgDestello{0%{opacity:0;transform:scale(.4)}25%{opacity:1}100%{opacity:0;transform:scale(1.8)}}
.lg-chispas{position:absolute;left:50%;top:50%;z-index:2;pointer-events:none}
.lg-chispas i{position:absolute;width:var(--s);height:var(--s);border-radius:50%;background:#fff;box-shadow:0 0 10px 2px color-mix(in srgb,var(--c) 70%,#ff2a3d);opacity:0;animation:lgChispa 1.8s calc(1.95s + var(--d)) var(--lg-ease) forwards}
@keyframes lgChispa{0%{opacity:0;transform:translate(0,0) scale(.4)}15%{opacity:1}100%{opacity:0;transform:translate(var(--x),var(--y)) scale(1)}}
.lg-fx{position:relative;z-index:4;width:min(760px,100%,calc((100vh - 330px) * 1.414));min-width:min(320px,100%);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;text-align:center}
.lg-fx-k{display:inline-flex;align-items:center;gap:8px;padding:7px 14px;border-radius:999px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:#fff;font:700 11px var(--fb);letter-spacing:.16em;text-transform:uppercase;animation:lgSube .7s 2.15s var(--lg-ease) both}
.lg-fx-k .ic{color:#ffd27a}
.lg-fx h2{font:800 clamp(30px,4.2vw,52px)/1.04 var(--fh);letter-spacing:-.035em;animation:lgSube .7s 2.25s var(--lg-ease) both}
.lg-fx-dip{position:relative;width:100%;text-align:left;border-radius:12px;overflow:hidden;transform-origin:50% 100%;box-shadow:0 50px 120px -40px rgba(0,0,0,.95),0 0 0 1px rgba(255,255,255,.14);animation:lgDip 1.2s 2.2s var(--lg-ease) both}
.lg-fx-dip .dip{animation:lgColor 1.2s 2.5s ease both}
.lg-fx-dip .lg-brillo{animation:lgPasa 3.4s 3.2s ease-in-out both}
@keyframes lgDip{0%{opacity:0;transform:perspective(1400px) translateY(60px) rotateX(18deg) scale(.92);filter:blur(14px)}100%{opacity:1;transform:none;filter:none}}
@keyframes lgColor{0%{filter:grayscale(1) brightness(.5)}100%{filter:none}}
.lg-gracias{max-width:560px;color:#e4e4e7;font-size:15.5px;line-height:1.65;animation:lgSube .8s 3.7s var(--lg-ease) both}
.lg-fx .btns{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;animation:lgSube .8s 3.9s var(--lg-ease) both}
@keyframes lgSube{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
/* «Nombre Aquí» → nombre del alumno */
.lg-nom{display:inline-grid;vertical-align:bottom}
.lg-nom>span{grid-area:1/1;white-space:nowrap}
.lg-nom .a{animation:lgNomSale .7s calc(3.15s + var(--d,0s)) var(--lg-ease) forwards}
.lg-nom .b{opacity:0;animation:lgNomEntra 1s calc(3.4s + var(--d,0s)) var(--lg-ease) forwards}
@keyframes lgNomSale{to{opacity:0;filter:blur(10px);transform:translateY(-.18em) scale(.98)}}
@keyframes lgNomEntra{from{opacity:0;filter:blur(10px);transform:translateY(.18em) scale(1.02)}to{opacity:1;filter:none;transform:none}}
.dipF .lg-nom{justify-items:center}
@media (prefers-reduced-motion:reduce){.lg-fiesta *,.lg-fiesta{animation-duration:.01s!important;animation-delay:0s!important}}

/* ---------- firma ---------- */
.firma-pad{width:100%;aspect-ratio:3/1;border-radius:14px;background:#fff;touch-action:none;cursor:crosshair;display:block;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
.firma-guia{position:relative;margin:14px 0 6px}
.firma-guia::after{content:"";position:absolute;left:8%;right:8%;bottom:24%;height:1px;background:rgba(0,0,0,.25);pointer-events:none}
.firma-vista{height:56px;background:#fff;border-radius:10px;padding:4px 10px}

/* ---------- diplomas (A4 horizontal, todo en cqw para que escale) ---------- */
.dip{aspect-ratio:297/210;container-type:inline-size;width:100%}
.dip .hoja{position:relative;width:100%;height:100%;overflow:hidden;border-radius:4px;font-family:Inter,system-ui,sans-serif}
.dip .ab{position:absolute}
.dip .dp-lg{display:flex;align-items:center;gap:.8cqw}.dip .dp-lg .m{width:3cqw;border-radius:.5cqw}.dip .dp-lg .t{height:1.35cqw}
.dip .dp-fir{font-family:"Mrs Saint Delafield",cursive;font-weight:400;line-height:.75}
.dip .dp-firmas{display:flex;gap:3cqw;align-items:flex-end}
.dip .dp-firma{display:flex;flex-direction:column;align-items:center;min-width:16cqw}
.dip .dp-firma .img{height:4.6cqw;display:flex;align-items:flex-end;justify-content:center}
.dip .dp-firma img{max-height:4.6cqw;max-width:18cqw;object-fit:contain}
.dip .dp-firma .dp-fir{font-size:3.4cqw}
.dip .dp-firma i{display:block;width:100%;height:.1cqw;margin:.3cqw 0 .45cqw;background:currentColor;opacity:.45}
.dip .dp-firma small{font-size:.85cqw;line-height:1.35;text-align:center;opacity:.8}
.dip .dp-firma small b{display:block;font-size:.95cqw;opacity:1}
.dip .dp-firma .pend{font-size:.9cqw;opacity:.45;font-style:italic;padding-bottom:.6cqw}
.dip.oscuro .dp-firma img{filter:invert(1)}
.dip .dp-gar{font-size:.78cqw;line-height:1.45;opacity:.6}

/* plateado: alumno en vivo (tarjeta de cromo) */
.dipV{background:radial-gradient(90% 90% at 50% 40%,#f4f4f6,#c9cad0);color:#141418}
.dipV .sw{border-radius:50%;border:3.2cqw solid transparent;background:conic-gradient(from 30deg,#fff,#9da0a8,#f7f7f9,#6f727b,#e9eaee,#a7aab2,#fff) border-box;-webkit-mask:linear-gradient(#000 0 0) padding-box exclude,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) padding-box exclude,linear-gradient(#000 0 0)}
.dipV .sw.a{left:6cqw;top:-26cqw;width:62cqw;height:80cqw;transform:rotate(28deg)}
.dipV .sw.b{right:-8cqw;top:12cqw;width:50cqw;height:66cqw;transform:rotate(-24deg);opacity:.9}
.dipV .tarj{left:10cqw;right:10cqw;top:6cqw;bottom:6cqw;border-radius:2.4cqw;overflow:hidden;background:rgba(238,238,242,.92);box-shadow:0 3cqw 6cqw -2cqw rgba(0,0,0,.45);border:.1cqw solid rgba(255,255,255,.8)}
.dipV .ban{position:absolute;left:0;right:0;top:0;height:36%;background:#050506;overflow:hidden}
.dipV .ban .g1{position:absolute;right:-4cqw;top:-8cqw;width:34cqw;height:34cqw;border-radius:30%;transform:rotate(25deg);background:radial-gradient(circle at 40% 40%,#ffd2d6 0 6%,#ff3a4d 18%,#b0000f 45%,transparent 70%)}
.dipV .ban .g2{position:absolute;right:13cqw;top:1.4cqw;width:11cqw;height:11cqw;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fff,#ff6b78 25%,#e0001b 55%,transparent 72%)}
.dipV .ban .dp-lg{position:absolute;left:3cqw;top:2.4cqw}
.dipV .ban .kk{position:absolute;left:14.6cqw;bottom:1.6cqw;font-size:.95cqw;font-weight:700;letter-spacing:.4cqw;color:#c9ccd3;text-transform:uppercase}
.dipV .num{position:absolute;right:3cqw;bottom:-3cqw;font-family:Anton,sans-serif;font-size:15cqw;line-height:1;color:transparent;-webkit-text-stroke:.14cqw rgba(255,255,255,.5)}
.dipV .dp-av{position:absolute;left:3.6cqw;top:calc(36% - 4.6cqw);width:9.2cqw;height:9.2cqw;border-radius:50%;background:radial-gradient(circle,#1a0204,#050506);display:grid;place-items:center;border:.4cqw solid #ececf0;box-shadow:0 0 3cqw rgba(224,0,27,.55)}
.dipV .dp-av img{width:4.6cqw;border-radius:.9cqw}
.dipV .c{position:absolute;left:3.6cqw;right:3.6cqw;top:calc(36% + 5.4cqw);bottom:2.2cqw;display:flex;flex-direction:column}
.dipV .n{font-size:4cqw;font-weight:800;letter-spacing:-.16cqw;line-height:1}
.dipV .pill{align-self:flex-start;margin-top:.8cqw;padding:.4cqw 1.2cqw;border-radius:.6cqw;background:linear-gradient(90deg,#7d8088,#eceef1 45%,#a4a7ae 70%,#6f727a);color:#141418;font-size:.95cqw;font-weight:700;letter-spacing:.25cqw;text-transform:uppercase}
.dipV .p{margin-top:1cqw;font-size:1.12cqw;line-height:1.55;color:#3a3a42;max-width:56cqw}.dipV .p b{color:#141418}
.dipV .stats{position:absolute;right:3.6cqw;top:calc(36% + 1.6cqw);display:flex;gap:2.4cqw;text-align:right}
.dipV .stats div{font-size:.85cqw;color:#55565e}.dipV .stats b{display:block;font-size:2cqw;font-weight:800;color:#141418;letter-spacing:-.06cqw}
.dipV .pie{margin-top:auto;display:flex;justify-content:space-between;align-items:flex-end;gap:2cqw;font-size:.9cqw;color:#55565e}
.dipV .pie .dat b{display:block;color:#141418;font-size:1.05cqw}

/* rojo: formación completa (neón lateral), todo centrado en la hoja */
.dipF{background:#090407;color:#fff}
.dipF .cv{width:46cqw;height:46cqw;border-radius:5cqw;transform:rotate(45deg);background:linear-gradient(135deg,#3a0610,#0d0407 60%);box-shadow:0 0 7cqw rgba(224,0,27,.55),inset .35cqw .35cqw 1.4cqw rgba(255,210,215,.95),inset 1.5cqw 1.5cqw 4cqw rgba(255,60,80,.6)}
.dipF .cv.l{left:-40cqw;top:12cqw}.dipF .cv.r{right:-40cqw;top:12cqw;transform:rotate(225deg)}
.dipF .dp-nav{left:50%;top:3.2cqw;transform:translateX(-50%);display:flex;align-items:center;gap:2cqw;padding:.8cqw 1.1cqw .8cqw 1.5cqw;border-radius:1.4cqw;background:rgba(255,255,255,.04);border:.08cqw solid rgba(255,255,255,.1);font-size:.95cqw;color:#c2b8bb;white-space:nowrap}
.dipF .dp-nav b{padding:.45cqw 1cqw;border-radius:.8cqw;background:rgba(255,255,255,.08);color:#fff;font-weight:600}
.dipF .c{left:13cqw;right:13cqw;top:9cqw;bottom:14cqw;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.dipF .pill{display:flex;align-items:center;gap:.7cqw;font-size:1.05cqw;color:#d9cfd2}.dipF .pill i{width:1cqw;height:1cqw;border-radius:50%;background:#ff2a3d;box-shadow:0 0 1.2cqw #ff2a3d}
.dipF .n{font-size:6.8cqw;font-weight:600;letter-spacing:-.22cqw;line-height:1.04;margin-top:1.4cqw}
.dipF .p{font-size:1.35cqw;color:#a99ea2;line-height:1.55;margin-top:1.2cqw;max-width:56cqw}.dipF .p b{color:#fff;font-weight:600}
.dipF .info{margin-top:2cqw;display:flex;gap:3.6cqw;font-size:.95cqw;color:#a99ea2}.dipF .info div{display:flex;flex-direction:column;gap:.25cqw}.dipF .info b{color:#fff;font-size:1.5cqw;font-weight:600}
.dipF .dp-cred{margin-top:2cqw;display:flex;align-items:center;gap:1cqw;padding:.45cqw .45cqw .45cqw 1.4cqw;border-radius:1.2cqw;background:rgba(255,255,255,.04);border:.08cqw solid rgba(255,255,255,.12);font-size:1cqw;color:#c2b8bb}
.dipF .dp-cred b{padding:.7cqw 1.4cqw;border-radius:.9cqw;background:linear-gradient(180deg,#ff3346,#b0000f);color:#fff;font-weight:600}
.dipF .pie{left:9cqw;right:9cqw;bottom:3.6cqw;display:flex;justify-content:space-between;align-items:flex-end;color:#d9cfd2}
.dipF .dp-gar{max-width:24cqw;text-align:left}

/* dorado: diploma de reconocimiento (póster con portadas, medalla y lo mejor de su camino) */
.dipE{background:#070708;color:#fff}
.dipE .col{left:-4cqw;right:-4cqw;top:-6cqw;height:50%;display:flex;gap:1.2cqw;transform:rotate(-6deg)}
.dipE .col img{flex:1;min-width:0;height:100%;object-fit:cover;border-radius:1cqw}
.dipE .fade{inset:0;background:linear-gradient(180deg,rgba(7,7,8,.25) 0%,rgba(7,7,8,.72) 24%,#070708 45%)}
.dipE .rd{left:0;right:0;bottom:0;height:55%;background:radial-gradient(70% 70% at 50% 100%,rgba(230,192,102,.17),transparent 70%)}
.dipE .med{position:absolute;right:5cqw;top:23%;width:12.5cqw;transform:translateY(-50%);filter:drop-shadow(0 1.6cqw 2.6cqw rgba(0,0,0,.7))}
.dipE .c{left:5.6cqw;right:5.6cqw;top:3.6cqw;bottom:3.2cqw;display:flex;flex-direction:column}
.dipE .top{display:flex;justify-content:space-between;align-items:center}
.dipE .top span{padding:.5cqw 1.3cqw;border-radius:10cqw;background:linear-gradient(90deg,#b98a2e,#f6dc95 50%,#b98a2e);color:#2a1a00;font-size:.9cqw;font-weight:800;letter-spacing:.22cqw}
.dipE .cab{margin-top:auto;display:flex;align-items:flex-end;justify-content:space-between;gap:3cqw}
.dipE .marca{display:flex;flex-direction:column;align-items:center;gap:1.1cqw;padding:0 1cqw .4cqw 0}
.dipE .marca .lg2{display:flex;align-items:center;gap:1.4cqw}
.dipE .marca .m{width:6.4cqw;border-radius:1.3cqw;box-shadow:0 1cqw 3cqw rgba(224,0,27,.45)}
.dipE .marca .t{height:3.1cqw}
.dipE .marca span{font-size:.85cqw;font-weight:700;letter-spacing:.38cqw;text-transform:uppercase;color:#e6c066}
.dipE .big{font-family:Anton,sans-serif;font-size:9.6cqw;line-height:.82;letter-spacing:.1cqw;text-transform:uppercase}
.dipE .big span{color:transparent;-webkit-text-stroke:.15cqw #e6c066}
.dipE .rec{margin-top:.8cqw;font-size:1.3cqw;font-weight:700;letter-spacing:.9cqw;text-transform:uppercase;background:linear-gradient(90deg,#b98a2e,#f6dc95 50%,#b98a2e);-webkit-background-clip:text;background-clip:text;color:transparent}
.dipE .fila{display:flex;align-items:flex-end;justify-content:space-between;gap:3cqw;margin-top:1.7cqw}
.dipE .n{font-size:3.6cqw;font-weight:800;letter-spacing:-.12cqw;line-height:1}
.dipE .men{display:inline-flex;align-items:center;margin-top:1cqw;padding:.45cqw 1.2cqw;border-radius:10cqw;border:.1cqw solid rgba(230,192,102,.5);color:#f3d98f;font-size:.95cqw;font-weight:600;letter-spacing:.04cqw}
.dipE .p{margin-top:.9cqw;max-width:54cqw;font-size:1.05cqw;line-height:1.55;color:#c9c5c7}.dipE .p b{color:#fff;font-weight:600}
.dipE .dat{font-size:.85cqw;color:#a7a3a5;text-align:right;line-height:1.5}.dipE .dat b{display:block;color:#fff;font-size:1.05cqw}
/* lo mejor de su camino: una fila limpia con líneas finas doradas */
.dipE .best{display:flex;align-items:stretch;margin-top:1.8cqw;border-top:.08cqw solid rgba(230,192,102,.35);border-bottom:.08cqw solid rgba(230,192,102,.35)}
.dipE .best .bk{display:flex;align-items:center;max-width:9cqw;padding-right:2cqw;font-size:.8cqw;font-weight:800;letter-spacing:.2cqw;line-height:1.35;text-transform:uppercase;color:#e6c066}
.dipE .best div{flex:1;padding:1cqw 1.4cqw;border-left:.08cqw solid rgba(230,192,102,.2);font-size:.8cqw;letter-spacing:.06cqw;color:#a7a3a5}
.dipE .best b{display:block;font-size:2.1cqw;font-weight:700;letter-spacing:-.05cqw;line-height:1.15;color:#f0d590}
.dipE .dp-gar{margin-top:1cqw}

/* ---------- administración: vivo y certificados ---------- */
.adv-est{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.adv-prog{margin-top:16px;padding:16px;border-radius:14px;border:1px solid var(--line);background:rgba(255,255,255,.02)}
.adv-sw{display:flex;gap:12px;align-items:flex-start;cursor:pointer}
.adv-sw input{position:absolute;opacity:0;pointer-events:none}
.adv-sw>i{flex:none;position:relative;width:42px;height:24px;margin-top:2px;border-radius:99px;background:rgba(255,255,255,.16);transition:background .25s}
.adv-sw>i::after{content:"";position:absolute;left:3px;top:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:left .25s}
.adv-sw input:checked+i{background:var(--accent)}
.adv-sw input:checked+i::after{left:21px}
.adv-sw input:focus-visible+i{outline:2px solid #fff;outline-offset:2px}
.adv-sw b{display:block;color:#fff;font-size:14.5px}
.adv-sw small{color:var(--muted);font-size:12.5px;line-height:1.5}
.adv-cuando{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:14px}
.adv-cuando .campo{color-scheme:dark}
.adv-fechas{margin-top:14px;font-size:13.5px}
.adv-fechas ul{list-style:none;margin-top:8px;display:flex;flex-direction:column;gap:6px}
.adv-fechas li{display:flex;align-items:center;gap:8px;color:#e4e4e7}
.adv-fechas li .ic{color:var(--accent)}
@media (max-width:760px){.adv-cuando{grid-template-columns:1fr 1fr}}
.adv-rank{width:100%;border-collapse:collapse;font-size:14px}
.adv-rank th,.adv-rank td{text-align:left;padding:9px 10px;border-bottom:1px solid var(--line)}
.adv-rank th{font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--dim);font-weight:700}
.adv-rank td b{color:#fff}

/* ---------- revelado: al terminar la animación el certificado oficial brilla, flota suave y suelta confeti ---------- */
@keyframes lgFlota{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
.lg-slide.revela .lg-brillo,.lg-pieza.revela .lg-brillo,.lg-det-dip.revela .lg-brillo{animation:lgPasa 2.2s .15s ease-in-out 2}
.lg-pieza,.lg-det-dip{position:relative}
.lg-det-dip{border-radius:6px;overflow:visible}
.lg-dip-in{position:relative;overflow:hidden;border-radius:6px}
.lg-dip-in>.lg-brillo{animation:none}
.lg-confeti{position:absolute;inset:0;z-index:8;pointer-events:none}
.lg-confeti i{position:absolute;left:50%;top:30%;width:9px;height:4px;border-radius:1px;background:var(--k);opacity:0;animation:lgConfeti 2.8s var(--d) cubic-bezier(.2,.7,.3,1) forwards}
@keyframes lgConfeti{0%{opacity:1;transform:translate(0,0) rotate(0)}30%{opacity:1;transform:translate(calc(var(--x) * 1px),calc(var(--y) * 1px)) rotate(calc(var(--r) * .4))}100%{opacity:0;transform:translate(calc(var(--x) * 1.3px),calc(var(--y) * 1px + 340px)) rotate(var(--r))}}

/* confeti a pantalla completa y el certificado flotando suave, dentro de la animación de desbloqueo */
.lg-lluvia{position:absolute;inset:0;z-index:5;pointer-events:none;overflow:hidden}
.lg-lluvia i{position:absolute;top:-24px;left:var(--l);width:var(--w);height:var(--h);border-radius:2px;background:var(--k);opacity:0;animation:lgLluvia var(--t) var(--d) cubic-bezier(.25,.4,.45,1) forwards}
@keyframes lgLluvia{0%{opacity:1;transform:translate(0,0) rotate(0)}100%{opacity:1;transform:translate(var(--x),calc(100vh + 40px)) rotate(var(--r))}}
.lg-fx-flota{width:100%;animation:lgFlota 4.2s 3.4s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){.lg-lluvia{display:none}}

/* ---------- sala de transmisión propia (en pruebas) ---------- */
.page.sala-pg{max-width:1720px;width:100%;box-sizing:border-box;margin-inline:auto;padding:32px clamp(20px,3.4vw,56px) 40px}
.sala-h{display:flex;flex-direction:column;align-items:flex-start;gap:10px;margin-bottom:18px}
.sala-h h1{font:800 clamp(26px,3vw,38px) var(--fh);letter-spacing:-.03em}
.sala-grid{display:grid;grid-template-columns:minmax(0,1fr) clamp(320px,24vw,420px);gap:24px;align-items:stretch}
.sala-video{position:relative;aspect-ratio:16/9;border-radius:16px;overflow:hidden;background:#000;border:1px solid rgba(255,255,255,.08);box-shadow:0 30px 70px -40px rgba(0,0,0,.9)}
.sala-video video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#000}
.sala-vacio{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center;padding:24px;color:var(--muted);background:radial-gradient(70% 60% at 50% 40%,rgba(224,0,27,.12),transparent 70%),#0b0b0d}
.sala-vacio[hidden]{display:none}
.sala-vacio b{color:#fff;font:700 17px var(--fh)}.sala-vacio small{max-width:420px;line-height:1.5}
.sala-envivo{position:absolute;left:14px;top:14px;display:inline-flex;align-items:center;gap:7px;padding:5px 11px;border-radius:999px;background:#e0001b;font:800 11px var(--fb);letter-spacing:.12em;text-transform:uppercase}
.sala-envivo i{width:7px;height:7px;border-radius:50%;background:#fff;animation:vivoLate 1.1s ease-in-out infinite}
.sala-envivo[hidden]{display:none}
.sala-sonido{position:absolute;left:50%;bottom:18px;translate:-50% 0;display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:rgba(20,20,24,.82);border:1px solid rgba(255,255,255,.18);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);font:700 13.5px var(--fh)}
.sala-sonido[hidden]{display:none}
.sala-ctl{display:flex;flex-direction:column;gap:12px;margin-top:14px}
.sala-btns{display:flex;flex-wrap:wrap;gap:10px}
.sala-fila{display:flex;align-items:center;gap:12px}.sala-fila .campo{flex:1;min-width:0;height:48px}.sala-fila .sala-btns{flex:none}
@media (max-width:860px){.sala-fila{flex-direction:column;align-items:stretch}}
.sala-chat{display:flex;flex-direction:column;contain:size;min-height:480px;border-radius:16px;border:1px solid rgba(255,255,255,.08);background:var(--card);overflow:hidden}
.sala-chat-h{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--line)}
.sala-chat-h b{display:inline-flex;align-items:center;gap:9px;font:700 14.5px var(--fh)}
.sala-chat-logo{width:24px;height:24px;object-fit:contain;filter:drop-shadow(0 0 10px rgba(224,0,27,.45))}.sala-chat-h small{color:var(--muted);font-size:12px}
.sala-msjs{flex:1;min-height:0;overflow-y:auto;padding:12px 14px;display:flex;flex-direction:column;gap:10px}
.sala-chat-v{margin:auto;color:var(--dim);font-size:13px;text-align:center}
.sala-msj{font-size:13.5px;line-height:1.45;color:#e4e4e7;word-wrap:break-word}
.sala-msj b{display:block;font-size:12px;color:#ff6b78;margin-bottom:1px}
.sala-msj.mio b{color:#a1a1aa}
.sala-btns [hidden]{display:none}
.sala-chat-f{display:flex;gap:8px;padding:12px;border-top:1px solid var(--line)}
.sala-chat-f .campo{flex:1;min-width:0;height:40px}
/* quién está en el vivo (solo el profesor): tercera columna, como la lista de miembros de Discord */
.sala-grid.con-gente{grid-template-columns:minmax(0,1fr) clamp(300px,21vw,380px) 236px}
.sala-gente{display:none;flex-direction:column;contain:size;min-height:480px;border-radius:16px;border:1px solid rgba(255,255,255,.08);background:var(--card);overflow:hidden;animation:sgIn .35s cubic-bezier(.2,.8,.2,1)}
.sala-grid.con-gente .sala-gente{display:flex}
@keyframes sgIn{from{opacity:0;transform:translateX(14px)}}
.sala-gente-h{display:flex;align-items:center;gap:8px;padding:14px 12px 14px 16px;border-bottom:1px solid var(--line)}
.sala-gente-h b{font:700 14.5px var(--fh)}
.sala-gente-h span{min-width:22px;height:20px;padding:0 7px;border-radius:999px;background:#e0001b;color:#fff;font:800 11.5px var(--fb);display:grid;place-items:center}
.sala-gente-x{margin-left:auto;width:28px;height:28px;border-radius:8px;display:grid;place-items:center;color:var(--muted)}.sala-gente-x:hover{background:rgba(255,255,255,.08);color:#fff}
.sala-gente-l{flex:1;min-height:0;overflow-y:auto;padding:8px 8px 12px}
.sg-grupo{padding:12px 8px 6px;font:800 11px var(--fb);letter-spacing:.08em;text-transform:uppercase;color:var(--dim)}
.sg-fila{display:flex;align-items:center;gap:10px;padding:6px 8px;border-radius:10px}
.sg-fila:hover{background:rgba(255,255,255,.05)}
.sg-fila.fuera{opacity:.45}
.sg-av{position:relative;flex:none;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:hsl(var(--h) 55% 32%);font:800 11.5px var(--fb);color:#fff}
.sg-av i{position:absolute;right:-2px;bottom:-2px;width:12px;height:12px;border-radius:50%;background:#22c55e;border:2.5px solid var(--card)}
.sg-fila.fuera .sg-av i{background:#71717a}
.sg-n{min-width:0;display:flex;flex-direction:column}
.sg-n b{font:600 13.5px var(--fb);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sg-n small{font-size:11.5px;color:var(--muted)}
.sala-gente-bt{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 10px;border-radius:9px;margin-left:8px;color:#d4d4d8;background:rgba(255,255,255,.06);font:700 12.5px var(--fb)}
.sala-gente-bt:hover{background:rgba(255,255,255,.12);color:#fff}
.sala-grid.con-gente .sala-gente-bt{background:rgba(224,0,27,.18);color:#ff8a94}
.sala-chat-h small{margin-left:auto}
.sala-chat-h small{display:inline-flex;align-items:center;gap:6px;font-weight:700;color:#e9dcde;font-variant-numeric:tabular-nums}.sala-ojo{width:7px;height:7px;border-radius:50%;background:#ff3b4e;box-shadow:0 0 8px #ff3b4e}
@media (max-width:1280px){.sala-grid.con-gente{grid-template-columns:minmax(0,1fr) 320px}.sala-grid.con-gente .sala-gente{grid-column:2;contain:none;min-height:0;height:300px}}
@media (max-width:980px){.sala-grid,.sala-grid.con-gente{grid-template-columns:1fr}.sala-chat{height:420px;min-height:0;position:static}.sala-grid.con-gente .sala-gente{grid-column:auto}}

.sala-mic{display:grid;grid-template-columns:minmax(0,1fr) 140px;align-items:center;gap:12px 16px;padding:12px 14px;border-radius:12px;border:1px solid var(--line);background:rgba(255,255,255,.02)}
.sala-mic-f{display:flex;align-items:center;gap:12px;min-width:0}
.sala-mic-f>span{display:inline-flex;align-items:center;gap:7px;font:600 13.5px var(--fb);color:#e4e4e7;white-space:nowrap}
.sala-mic select{flex:1;min-width:0;height:auto;min-height:40px;padding:9px 34px 9px 12px;line-height:1.3;border-radius:10px;border:1px solid var(--line2);background:var(--bg,#0b0b0d);color:#fff;font:500 14px var(--fb);color-scheme:dark;text-overflow:ellipsis}
.sala-vols{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:10px 18px}
.sala-vols label{display:grid;grid-template-columns:auto 1fr 44px;align-items:center;gap:10px;font-size:12.5px;color:var(--muted)}
.sala-vols input{accent-color:#e0001b;width:100%}.sala-vols em{font-style:normal;text-align:right;color:#e4e4e7;font-variant-numeric:tabular-nums}
.sala-nivel{display:block;height:6px;border-radius:9px;background:rgba(255,255,255,.08);overflow:hidden}
.sala-nivel i{display:block;height:100%;width:0;border-radius:inherit;background:#f4f4f5;transition:width .08s linear}
.sala-nivel i.alto{background:#ff5a68}
.sala-fs{position:absolute;right:14px;bottom:14px;z-index:3;width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:rgba(20,20,24,.7);border:1px solid rgba(255,255,255,.16);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff;opacity:0;transition:opacity .3s,background .3s}
.sala-video:hover .sala-fs,.sala-fs:focus-visible{opacity:1}
.sala-fs:hover{background:rgba(255,255,255,.18)}
.sala-video:fullscreen{aspect-ratio:auto;width:100vw;height:100vh;border-radius:0;border:0}
@media (hover:none){.sala-fs{opacity:1}}
@media (max-width:700px){.sala-mic,.sala-vols{grid-template-columns:1fr}.sala-mic-f{flex-direction:column;align-items:stretch}.sala-nivel{width:100%}}

/* aviso para volver a la sala mientras estás en vivo en otra parte del aula */
.sala-flota{position:fixed;left:50%;bottom:22px;translate:-50% 0;z-index:90;display:inline-flex;align-items:center;gap:9px;padding:11px 18px;border-radius:999px;background:#e0001b;color:#fff;font:800 13px var(--fb);letter-spacing:.02em;box-shadow:0 14px 40px -10px rgba(224,0,27,.7)}
.sala-flota i{width:8px;height:8px;border-radius:50%;background:#fff;animation:vivoLate 1.1s ease-in-out infinite}

/* indicador de conexión del vivo */
.sala-red{display:flex;align-items:center;gap:9px;font-size:12.5px;color:var(--muted)}
.sala-red[hidden]{display:none}
.sala-red>i{width:8px;height:8px;border-radius:50%;background:#f4f4f5;flex:none}
.sala-red.mala>i{background:#f59e0b}.sala-red.mala span{color:#fbbf24}
.sala-diag{margin-left:auto;font-size:12px;color:var(--dim);text-decoration:underline;text-underline-offset:3px}
.sala-diag:hover{color:#fff}

.sala-vols label.sala-modo-f{grid-column:1/-1;grid-template-columns:auto 1fr;font-weight:600;color:#e4e4e7}
.sala-modo-f select{min-width:0;height:36px;padding:0 10px;border-radius:9px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.05);color:#fff;font:600 13px var(--fb)}.sala-modo-f option{color:#0b0d12}
.sala-limpia{grid-column:1/-1;display:flex!important;align-items:center;gap:8px;font-size:12.5px;color:var(--muted);cursor:pointer}.sala-limpia input{accent-color:#e0001b;width:15px;height:15px}

/* vivo: cargando y transmisión finalizada */
.sala-spin{width:38px;height:38px;border-radius:50%;border:3px solid rgba(255,255,255,.12);border-top-color:#e0001b;animation:salaGira .8s linear infinite;margin-bottom:6px}
@keyframes salaGira{to{transform:rotate(360deg)}}
.sala-fin-ic{display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:rgba(224,0,27,.14);color:#ff4d5c;margin-bottom:8px;animation:salaFinIn .5s cubic-bezier(.2,1.4,.4,1) both}
@keyframes salaFinIn{from{transform:scale(.5);opacity:0}}
.sala-vacio.fin b{font-size:20px}.sala-vacio .btn-sec{margin-top:12px}
.sala-h .en-vivo.off{background:rgba(255,255,255,.08);color:var(--muted)}

/* vivo: dónde transmites (sala propia o enlace) */
.adv-modo{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px}
.adv-modo label{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:12px;border:1px solid var(--line2);background:rgba(255,255,255,.02);cursor:pointer;color:var(--muted)}
.adv-modo label.on{border-color:#e0001b;background:rgba(224,0,27,.08);color:#fff}
.adv-modo input{position:absolute;opacity:0;pointer-events:none}
.adv-modo span{display:flex;flex-direction:column;gap:2px}.adv-modo b{color:#fff;font-size:14px}.adv-modo small{font-size:12px;color:var(--dim)}
.adv-enlace[hidden]{display:none}
@media(max-width:640px){.adv-modo{grid-template-columns:1fr}}

/* firma fija de Erick: más alta que la caja para que luzca sobre la línea */
.dip .dp-firma img.fe-erick{max-height:7.4cqw;max-width:20cqw;margin-bottom:-.9cqw}
.firma-fija{height:64px;padding:4px 12px;background:#f5f4f0}.firma-fija img{height:100%;width:auto;display:block}
/* aviso para Erick: hay un vivo por enlace encendido */
.vivo-adm{position:fixed;left:50%;bottom:22px;translate:-50% 0;z-index:95;display:flex;align-items:center;gap:12px;padding:10px 10px 10px 18px;border-radius:999px;background:#e0001b;color:#fff;font:600 13.5px var(--fb);box-shadow:0 16px 44px -10px rgba(224,0,27,.75);max-width:calc(100vw - 32px)}
.vivo-adm>i{flex:none;width:9px;height:9px;border-radius:50%;background:#fff;animation:vivoLate 1.1s ease-in-out infinite}
.vivo-adm span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vivo-adm button{flex:none;padding:8px 16px;border-radius:999px;background:#fff;color:#c00017;font:800 13px var(--fh)}
.vivo-adm button:hover{background:#ffe4e6}
/* certificados del aula de un docente: 3 firmas (MASTER PSD, el docente y el alumno) */
.dip .dp-firmas.tres{gap:2cqw}
.dip .dp-firmas.tres .dp-firma{min-width:12.5cqw}
.dip .dp-firmas.tres .dp-firma img{max-width:14cqw}
.dip .dp-firmas.tres .dp-firma img.fe-erick{max-height:6.2cqw;max-width:15cqw}
.dip .dp-firma img.fe-doc{max-height:5.4cqw;max-width:15cqw;margin-bottom:-.5cqw}

/* ===== sala del alumno: modo cine (el video lo más grande posible) ===== */
html.en-sala .shell .side{display:none}
html.en-sala .shell .main{margin-left:0}
.page.sala-pg.sala-alumno{max-width:none;padding:14px clamp(12px,1.6vw,28px) 24px}
.sala-alumno .sala-h{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;text-align:left;gap:12px;flex-wrap:wrap;margin:0 0 12px}
.sala-alumno .sala-h h1{flex:1;min-width:0;margin:0;font-size:clamp(18px,1.5vw,24px)}
.sala-h-acc{display:flex;gap:8px;flex-wrap:wrap}
.sala-alumno .sala-grid{grid-template-columns:minmax(0,1fr) clamp(260px,19vw,340px);gap:16px}
.sala-alumno .sala-grid.sin-chat{grid-template-columns:minmax(0,1fr)}
.sala-alumno .sala-grid.sin-chat .sala-chat{display:none}
/* que el video nunca pase del alto de la pantalla (se centra) */
.sala-alumno .sala-video{width:min(100%,calc((100dvh - 110px) * 16 / 9));margin-inline:auto}
.sala-alumno .sala-fs{opacity:1;width:auto;padding:0 14px;gap:8px;display:flex;align-items:center;font:700 13px var(--fb)}
@media (max-width:700px){.sala-alumno .sala-fs span{display:none}.sala-alumno .sala-fs{width:42px;padding:0;justify-content:center}}