/* HERO tipo Netflix: cartelera a pantalla completa, texto a la izquierda, filas que suben sobre la cartelera. Misma paleta V4. */
.hero.ux.nf{min-height:min(88vh,860px)!important;background:#13244A!important;overflow:hidden}
.hero.ux.nf .heroImg{position:absolute;inset:0;top:0!important;height:100%!important;opacity:1!important;filter:saturate(.95) contrast(1.05)!important;background-position:center 30%!important;-webkit-mask-image:none!important;mask-image:none!important;
  transform-origin:70% 40%;animation:nfZoom 28s ease-in-out infinite alternate}
@keyframes nfZoom{from{transform:scale(1.02)}to{transform:scale(1.12)}}
/* degradados de cartelera: izquierda oscura para el texto + base que funde con la página */
.hero.ux.nf::before{content:"";position:absolute;inset:0;z-index:1;background:
  linear-gradient(90deg,#13244Afa 0%,#13244Ae6 24%,#13244A99 46%,#13244A26 72%,#13244A00 100%),
  linear-gradient(180deg,#13244A66 0%,#13244A00 22%,#13244A00 58%,var(--bg) 100%)!important}
html[data-theme=light] .hero.ux.nf::before{background:
  linear-gradient(90deg,#13244Afa 0%,#13244Ae6 24%,#13244A99 46%,#13244A26 72%,#13244A00 100%),
  linear-gradient(180deg,#13244A66 0%,#13244A00 22%,#13244A00 58%,#E8D7B5 100%)!important}
.hero.ux.nf::after{display:none}.hero.ux.nf .ux-arc{display:none}
.hero.ux.nf .heroInner{position:relative;z-index:2;display:flex!important;flex-direction:column!important;align-items:flex-start!important;justify-content:flex-end!important;text-align:left!important;gap:26px!important;max-width:1680px;
  min-height:min(88vh,860px)!important;padding-top:120px!important;padding-bottom:0!important}
.hero.ux.nf .heroLeft{align-items:flex-start!important;text-align:left!important;max-width:min(720px,100%);gap:14px!important;padding-bottom:8px}
.hero.ux.nf .heroLeft *{text-align:left!important}
.nfKick{display:flex;align-items:center;gap:12px;font:800 12px/1 var(--sans);letter-spacing:.3em;text-transform:uppercase;color:#E8D7B5}
.nfFree{background:#C8A46B;color:#13244A;padding:5px 9px;border-radius:3px;letter-spacing:.14em}
.hero.ux.nf h1{margin:0!important;max-width:none!important}
.hero.ux.nf h1 .l1{display:none!important}
.hero.ux.nf h1 .l2{display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:.02em}
.hero.ux.nf h1 .n1{font-size:clamp(16px,1.9vw,26px)!important;letter-spacing:.34em!important;color:#C4EAF2!important;-webkit-text-fill-color:#C4EAF2!important}
.hero.ux.nf h1 .n2{font-size:clamp(34px,6.2vw,104px)!important;line-height:.96!important;letter-spacing:-.02em!important;color:#E8D7B5!important;-webkit-text-fill-color:#E8D7B5!important;text-shadow:0 4px 40px rgba(0,0,0,.45)}
.nfMeta{text-transform:uppercase;margin:0;font:700 14px var(--sans);letter-spacing:.06em;color:#C4EAF2!important}
.hero.ux.nf .heroLeft p.ux-sub{color:#E8EEF6!important;max-width:34em!important;font-size:clamp(14px,1.25vw,18px);text-shadow:0 2px 18px rgba(0,0,0,.6)}
.hero.ux.nf .buttonRow{justify-content:flex-start!important;gap:12px;margin-top:6px}
.hero.ux.nf .btn{min-height:50px;padding:0 24px;border-radius:6px;font-size:15px}
.hero.ux.nf .btn.primary{background:#E8D7B5!important;color:#13244A!important;box-shadow:none}
.hero.ux.nf .btn.primary:hover{background:#fff!important}
.hero.ux.nf .btn.secondary{background:rgba(232,215,181,.18)!important;color:#fff!important;border:0!important;backdrop-filter:none}
.hero.ux.nf .btn.secondary:hover{background:rgba(232,215,181,.3)!important}
.liveDot{display:inline-block;width:9px;height:9px;border-radius:50%;background:#C4EAF2;box-shadow:0 0 0 0 rgba(196,234,242,.6);animation:livePulse 1.8s ease-out infinite}
@keyframes livePulse{70%{box-shadow:0 0 0 9px rgba(196,234,242,0)}100%{box-shadow:0 0 0 0 rgba(196,234,242,0)}}
.navLink.liveLink{display:inline-flex;align-items:center;gap:7px}
/* fila de facultades que sube sobre la cartelera (como las filas de Netflix) */
.hero.ux.nf .ux-right{width:100%!important;max-width:none!important;margin-bottom:-110px;position:relative;z-index:3}
.rowTitle{margin:0 0 10px;font:800 15px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:#E8D7B5}
.hero.ux.nf .cmos{height:clamp(170px,17vw,250px)!important;gap:12px}
.hero.ux.nf .cm{border-radius:8px;border-color:transparent}
.hero.ux.nf .cm:hover{transform:scale(1.04);z-index:2;border-color:#E8D7B5}
.hero.ux.nf+.ux-strip{padding-top:140px}
@media(prefers-reduced-motion:reduce){.hero.ux.nf .heroImg,.liveDot{animation:none}}
@media(max-width:900px){
  .hero.ux.nf{min-height:min(92svh,820px)!important}.hero.ux.nf .heroInner{min-height:min(92svh,820px)!important;padding-top:84px!important;gap:18px!important}
  .hero.ux.nf::before{background:linear-gradient(180deg,#13244A99 0%,#13244Ab3 38%,#13244Af0 74%,#13244A 100%)!important}
  html[data-theme=light] .hero.ux.nf::before{background:linear-gradient(180deg,#13244A99 0%,#13244Ab3 38%,#13244Af0 74%,#13244A 100%)!important}
  .hero.ux.nf .ux-right{margin-bottom:-70px}.hero.ux.nf+.ux-strip{padding-top:96px}
  .hero.ux.nf .btn{flex:1 1 100%;justify-content:center}.hero.ux.nf .buttonRow{width:100%}
  .hero.ux.nf h1 .n2{font-size:clamp(26px,8.6vw,44px)!important}.hero.ux.nf h1 .n1{letter-spacing:.2em!important}
}
/* ---- sección EN VIVO ---- */
.liveCard{display:grid;grid-template-columns:1fr;gap:var(--sp-gap,18px);background:var(--card);border:1px solid var(--border);border-radius:16px;overflow:hidden;box-shadow:var(--shadow)}
@media(min-width:900px){.liveCard{grid-template-columns:1.45fr 1fr}}
.liveFrame{margin:0!important;border-radius:0;min-height:260px}
.liveFrame .thumb{filter:saturate(.9)}
.liveBadge{position:absolute;z-index:4;left:16px;top:16px;display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:4px;font:800 12px/1 var(--sans);letter-spacing:.16em;background:#13244A;color:#E8D7B5}
.liveBadge.live{background:#2E56A6;color:#fff}.liveBadge.live::before{content:"";width:8px;height:8px;border-radius:50%;background:#C4EAF2;animation:livePulse 1.6s ease-out infinite}
.vfPlayBtn{position:absolute;z-index:4;left:50%;top:50%;transform:translate(-50%,-50%);width:76px;height:76px;border-radius:50%;border:0;background:#E8D7B5;color:#13244A;font-size:26px;padding-left:5px;cursor:pointer;box-shadow:0 10px 30px rgba(0,0,0,.4)}
.vfPlayBtn:disabled{opacity:.55;cursor:not-allowed}
.liveFrame video{position:absolute;inset:0;width:100%;height:100%;z-index:3;background:#000}
.liveErr{position:absolute;z-index:5;left:16px;right:16px;bottom:14px;margin:0;background:#13244Ae6;color:#E8D7B5;padding:10px 14px;border-radius:8px;font-size:13px}
.liveInfo{padding:var(--card-pad);display:flex;flex-direction:column;gap:12px;justify-content:center}
.liveInfo h3{margin:0;font-size:clamp(22px,2.4vw,32px)}.liveDesc{margin:0;color:var(--soft);line-height:1.7}
.liveWhen{display:flex;flex-direction:column;gap:4px;margin:4px 0 0}.liveLab{font:800 11px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--kick)}
.liveWhen strong{font:400 20px var(--serif);color:var(--fg)}
.liveCd{margin:0;font:800 22px var(--sans);letter-spacing:.04em;color:var(--fg);font-variant-numeric:tabular-nums}
.liveActs{display:flex;gap:10px;flex-wrap:wrap}.liveActs .btn:disabled{opacity:.55;cursor:not-allowed}
.liveInfo .note{margin:0}
html[data-theme=light] .liveCard{background:#D6B98B}

/* correcciones: alineación al borde, texto claro en ambos temas, titular contenido */
.hero.ux.nf .heroInner{padding-inline:var(--gutter)!important;margin:0 auto;width:100%}
.hero.ux.nf .heroLeft{margin:0!important;padding:0!important;width:100%!important;max-width:min(760px,100%)!important;grid-column:auto!important}
html[data-theme] .hero.ux.nf .heroLeft p.ux-sub{color:#E8EEF6!important;text-shadow:0 2px 18px rgba(0,0,0,.65)!important;margin:0!important;max-width:34em!important}
html[data-theme] .hero.ux.nf .nfMeta,html[data-theme] .hero.ux.nf h1 .n1{color:#C4EAF2!important;-webkit-text-fill-color:#C4EAF2!important}
html[data-theme] .hero.ux.nf h1 .n2{color:#E8D7B5!important;-webkit-text-fill-color:#E8D7B5!important;font-size:clamp(30px,5.2vw,86px)!important;max-width:100%;overflow-wrap:anywhere}
html[data-theme] .hero.ux.nf .nfKick{color:#E8D7B5!important}
.hero.ux.nf .heroLeft .nfFree{color:#13244A!important}
@media(max-width:900px){html[data-theme] .hero.ux.nf h1 .n2{font-size:clamp(24px,7.4vw,40px)!important}}
.hero.ux.nf .heroInner>.heroLeft{align-self:flex-start!important;margin-left:0!important;margin-right:auto!important;margin-inline:0 auto!important;justify-self:start!important}
.hero.ux.nf .heroInner>.ux-right{align-self:stretch!important}
html[data-theme] .hero.ux.nf h1 .n2{font-size:clamp(30px,4.6vw,76px)!important;white-space:nowrap}
@media(max-width:700px){html[data-theme] .hero.ux.nf h1 .n2{white-space:normal;font-size:clamp(22px,7vw,38px)!important}}
html[data-theme=light] .topbar .liveDot{background:#2E56A6;animation-name:livePulseBlue}
@keyframes livePulseBlue{70%{box-shadow:0 0 0 9px rgba(46,86,166,0)}100%{box-shadow:0 0 0 0 rgba(46,86,166,0)}}