/* p-medios.css · /en-los-medios/ · «Pantallas»: muro de pantallas con encendido CRT · prefijo .md-
   El telón de HOY es el .marco compartido (main.js). Estado inicial oculto SOLO bajo .fx + .md-wall.is-armed (lo pone p-medios.js). */

/* ---------- hero: letrero «Al aire» + guía de canales ---------- */
.md-hero .phero-grid{grid-template-columns:minmax(0,1fr)}
.md-hero .chip{max-width:100%}
@media (min-width:1024px){.md-hero .phero-grid{grid-template-columns:minmax(0,1.32fr) minmax(0,.68fr)}}
.md-h1-3{font-size:.38em;letter-spacing:.05em;color:var(--cian);margin-top:.5em}
.md-onair{display:grid;gap:1.1rem;max-width:440px}
.md-lamp{display:grid;place-items:center;padding:1.05rem 1rem;border-radius:18px;background:linear-gradient(#240707,#120303);box-shadow:inset 0 0 0 2px rgba(255,59,48,.4),0 0 0 8px rgba(255,255,255,.04),0 30px 60px -30px rgba(255,59,48,.45)}
.md-lamp span{font:400 clamp(2.6rem,4.2vw,3.9rem)/1 var(--f-display);letter-spacing:.09em;text-transform:uppercase;color:#FF6A5F;text-shadow:0 0 16px rgba(255,59,48,.95),0 0 42px rgba(255,59,48,.55)}
@media (prefers-reduced-motion:no-preference){.fx .md-lamp span{animation:mdLamp 1.5s steps(1) .35s both}}
@keyframes mdLamp{0%{opacity:.12}9%{opacity:1}13%{opacity:.18}21%{opacity:1}25%{opacity:.3}33%,100%{opacity:1}}
.md-guide ol{display:grid;gap:.5rem}
.md-guide a{display:grid;grid-template-columns:3.6rem minmax(0,1fr);gap:.8rem;align-items:center;min-height:48px;padding:.65rem 1rem;border-radius:14px;background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);color:#fff;text-decoration:none;transition:background-color .3s,transform .35s var(--ease)}
.md-guide a:hover{background:rgba(37,244,238,.12);transform:translateX(4px)}
.md-guide b{font:400 1rem/1 var(--f-display);letter-spacing:.06em;color:var(--cian);font-variant-numeric:tabular-nums}
.md-guide span{font-size:.9rem;color:var(--niebla)}
.md-guide em{font-style:normal;font-weight:600;color:#fff}

/* ---------- respuesta directa + tabla ---------- */
.md-tabla{padding:.4rem 1rem;border-radius:22px;background:var(--hielo)}
.md-tabla th[scope=row]{font-size:.96rem;font-weight:600;letter-spacing:0;text-transform:none;color:var(--estudio)}
.md-tabla td{color:var(--gris)}

/* ---------- muro de pantallas ---------- */
.md-wall-top{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:1.2rem 4rem;align-items:end;margin-bottom:clamp(2.2rem,4vw,3.2rem)}
.md-wall-top .head{margin-bottom:0}
.md-wall{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(2rem,3.4vw,3rem) clamp(1.2rem,2.2vw,2rem);align-items:start}
.md-tv{grid-column:span 5;display:flex;flex-direction:column;gap:1.15rem;scroll-margin-top:calc(var(--hdr) + 1.2rem)}
.md-tv--lg{grid-column:span 7}
.md-tv:nth-last-child(-n+2){grid-column:span 6}
.md-scr{position:relative;padding:12px 12px 32px;border-radius:24px;background:linear-gradient(160deg,#0E2A3E,#020F19);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1),0 34px 60px -30px rgba(0,0,0,.85)}
.md-scr::before{content:attr(data-ch);position:absolute;left:18px;bottom:9px;font-size:.64rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--niebla)}
.md-scr::after{content:"";position:absolute;right:18px;bottom:12px;width:8px;height:8px;border-radius:50%;background:var(--wa);box-shadow:0 0 8px var(--wa);transition:background-color .3s,box-shadow .3s}
.md-crt{position:relative;aspect-ratio:16/9;border-radius:14px;overflow:hidden;background:#000;transform-origin:50% 50%;isolation:isolate}
.md-crt::before{content:"";position:absolute;inset:0;z-index:5;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(0,0,0,.22) 0 1px,transparent 1px 3px);opacity:.5}
.md-crt::after{content:"";position:absolute;inset:0;z-index:6;pointer-events:none;background:radial-gradient(ellipse at 50% 50%,#fff 0,rgba(200,255,253,.85) 32%,rgba(37,244,238,0) 72%);opacity:0}
.md-crt .md-yt,.md-crt .yt-frame{position:absolute;inset:0;width:100%;height:100%;border-radius:0;box-shadow:none;aspect-ratio:auto}

/* encendido CRT (al entrar) y «cambio de canal» (al pasar el cursor) */
.md-wall.is-armed .md-scr:not(.is-on):not(.is-done)::after{background:#33434E;box-shadow:none}
.fx .md-wall.is-armed .md-scr:not(.is-on):not(.is-done) .md-crt{transform:scale(.55,.006);opacity:0}
.fx .md-wall.is-armed .md-scr.is-on .md-crt{animation:mdOn .8s cubic-bezier(.22,.9,.24,1) both}
.fx .md-wall.is-armed .md-scr.is-on .md-crt::after{animation:mdFlash .8s ease-out both}
.fx .md-wall.is-armed .md-scr.is-done.is-zap .md-crt{animation:mdZap .5s cubic-bezier(.3,.7,.3,1) both}
.fx .md-wall.is-armed .md-scr.is-done.is-zap .md-crt::after{animation:mdFlash2 .5s ease-out both}
.fx .md-wall.is-armed .md-scr.is-done.is-zap .md-crt::before{animation:mdScan .5s linear both}
@keyframes mdOn{0%{transform:scale(.55,.006);opacity:1}40%{transform:scale(1,.006)}72%{transform:scale(1,1.04)}100%{transform:none;opacity:1}}
@keyframes mdFlash{0%,42%{opacity:1}100%{opacity:0}}
@keyframes mdZap{0%{transform:none}24%{transform:scale(1.03,.014)}56%{transform:scale(1,1.03)}100%{transform:none}}
@keyframes mdFlash2{0%{opacity:0}24%{opacity:1}100%{opacity:0}}
@keyframes mdScan{from{transform:translateY(-12px)}to{transform:none}}

/* pantalla de prensa */
.md-paper{position:absolute;inset:0;display:flex;flex-direction:column;gap:.55rem;padding:clamp(.9rem,2vw,1.4rem);background:#F3EFE6;color:#141414;font-family:Georgia,'Times New Roman',serif}
.md-paper-m{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:.2rem .8rem;padding-bottom:.45rem;border-bottom:3px double #141414}
.md-paper-m b{font-size:clamp(1.15rem,2.2vw,1.6rem);font-style:italic;letter-spacing:-.01em}
.md-paper-m span{font:700 .62rem/1.2 var(--f-body);letter-spacing:.1em;text-transform:uppercase;color:#5B5B5B}
.md-paper-h{font-weight:700;font-size:clamp(1.02rem,2vw,1.5rem);line-height:1.16}
.md-paper-l{position:relative;display:grid;gap:.42rem;margin-top:auto;padding-right:30%}
.md-paper-l i{display:block;height:6px;border-radius:3px;background:#D3CCBC}
.md-paper-l svg{position:absolute;right:0;bottom:-.4rem;width:22%;height:auto;fill:none;stroke:#141414;stroke-width:4;stroke-linecap:round;stroke-linejoin:round}

/* pantalla del curso */
.md-class{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;gap:.6rem;padding:clamp(1rem,3vw,2.2rem);background:radial-gradient(circle at 86% 26%,rgba(37,244,238,.22),transparent 46%),linear-gradient(140deg,var(--pcd),var(--madrugada))}
.md-class-k{display:flex;align-items:center;gap:.55rem;font-size:.68rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--bruma)}
.md-class-t{position:relative;z-index:1;font:400 clamp(1.9rem,3.6vw,3.3rem)/.94 var(--f-display);text-transform:uppercase;max-width:13ch}
.md-class-g{position:relative;z-index:1;font-size:.92rem;font-weight:600;color:var(--cian)}
.md-class-i{position:absolute;right:5%;bottom:8%;width:28%;height:auto;fill:none;stroke:rgba(255,255,255,.3);stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round}

/* pantalla de audio */
.md-audio{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1rem;background:radial-gradient(circle at 50% 120%,rgba(254,44,85,.45),transparent 60%),linear-gradient(160deg,#2A0A16,var(--madrugada))}
.md-audio-t{font:400 clamp(2rem,4vw,3.1rem)/1 var(--f-display);text-transform:uppercase;letter-spacing:.03em}
.md-audio-k{font-size:.72rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--bruma)}
.md-eq{display:flex;align-items:center;gap:5px;width:72%;height:30%}
.md-eq i{flex:1;height:100%;border-radius:4px;background:linear-gradient(var(--cian),var(--magenta));transform:scaleY(var(--h,.5))}
.md-eq i:nth-child(3n){--h:.9}.md-eq i:nth-child(3n+1){--h:.35}.md-eq i:nth-child(4n){--h:.7}.md-eq i:nth-child(5n){--h:1}
@media (prefers-reduced-motion:no-preference){.md-eq i{animation:mdEq 1.1s ease-in-out infinite alternate;animation-play-state:paused}.md-eq.is-playing i{animation-play-state:running}.md-eq i:nth-child(2n){animation-duration:.8s}.md-eq i:nth-child(3n){animation-delay:-.35s}}
@keyframes mdEq{to{transform:scaleY(calc(var(--h,.5) * .3))}}

/* pantalla de cifras */
.md-stats{position:absolute;inset:0;display:grid;grid-template-columns:1fr 1fr;align-content:center;gap:.2rem 1.2rem;padding:clamp(1rem,2.6vw,1.8rem);background:radial-gradient(circle at 18% 18%,rgba(254,44,85,.26),transparent 52%),linear-gradient(160deg,#04223A,#000D17)}
.md-stats li{display:flex;flex-direction:column;gap:.15rem;padding:.55rem 0;border-bottom:1px solid rgba(255,255,255,.14)}
.md-stats b{font:400 clamp(1.5rem,2.7vw,2.3rem)/1 var(--f-display);font-variant-numeric:tabular-nums;white-space:nowrap}
.md-stats li>span{font-size:.76rem;color:var(--niebla)}

/* ficha bajo cada pantalla */
.md-info{display:flex;flex-direction:column;gap:.55rem;padding-inline:.3rem}
.md-k{display:flex;flex-wrap:wrap;align-items:center;gap:.3rem .8rem;font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--cian)}
.md-k time{color:var(--niebla)}
.md-info h3{font-size:clamp(1.6rem,2.3vw,2.15rem)}
.md-info>p:not(.md-k){font-size:.98rem;line-height:1.6;color:var(--niebla);max-width:64ch}
.md-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.8rem 1.2rem;margin-top:.35rem;padding-top:.85rem;border-top:1px solid rgba(255,255,255,.12)}
.md-foot--links{justify-content:flex-start}
.md-num{font:400 1.9rem/1 var(--f-display);font-variant-numeric:tabular-nums;white-space:nowrap}
.md-num small{margin-left:.3rem;font:600 .82rem var(--f-body);color:var(--niebla)}
.md-out{display:inline-flex;align-items:center;gap:.45rem;min-height:44px;padding:.5rem 1rem;border-radius:999px;font-weight:700;font-size:.9rem;color:#fff;text-decoration:none;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.4);transition:background-color .3s,box-shadow .3s}
.md-out:hover{background:rgba(37,244,238,.14);box-shadow:inset 0 0 0 1.5px var(--cian)}
.md-out svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* ---------- responsivo ---------- */
@media (max-width:1023px){
  .md-wall-top{grid-template-columns:1fr}
  .md-wall{grid-template-columns:1fr}
  .md-tv,.md-tv--lg,.md-tv:nth-last-child(-n+2){grid-column:1 / -1}
  .md-onair{max-width:none}
}
@media (max-width:480px){
  .md-scr{padding:8px 8px 28px;border-radius:20px}
  .md-scr::before{left:14px}
  .md-paper-l{display:none}
  .md-tabla{padding:.3rem .6rem}
  .md-tabla tr>*:nth-child(2){display:none}
  .md-tabla th,.md-tabla td{padding:.7rem .5rem}
  .md-class-g{font-size:.82rem}
  .md-num{font-size:1.6rem}
}
