/* Radio Life Bolivia — Hub Multimedia v12
   Estilos extraidos del documento original. No editar por el editor de bloques. */

:root{--rojo:#d93025;--rojo-d:#a31f16;--negro:#080810;--card:#0f0f1e;--borde:#1e1e35;--blanco:#fff;--gris:#8888aa;--gris2:#ccccdd;--amarillo:#f5c518;--verde:#2e7d32}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--negro);color:var(--blanco);font-family:"DM Sans",sans-serif;font-size:15px;line-height:1.6;overflow-x:hidden}
body::before{content:"";position:fixed;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(ellipse 600px 400px at 20% 30%,rgba(217,48,37,.07) 0%,transparent 60%),radial-gradient(ellipse 500px 500px at 80% 70%,rgba(46,125,50,.05) 0%,transparent 60%);pointer-events:none;z-index:0}
nav{position:sticky;top:0;z-index:100;background:rgba(8,8,16,.95);backdrop-filter:blur(14px);border-bottom:1px solid var(--borde);padding:12px 40px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.nav-logo{display:flex;align-items:center;gap:12px;text-decoration:none}
.nav-logo img{height:48px;width:auto;filter:drop-shadow(0 2px 8px rgba(217,48,37,.4))}
.logo-nombre .radio{font-family:"Bebas Neue",sans-serif;font-size:20px;color:#fff;letter-spacing:3px;line-height:1;display:block}
.logo-nombre .slogan{font-size:10px;color:var(--gris);letter-spacing:1px}
.nav-links{display:flex;gap:18px;list-style:none}
.nav-links a{color:var(--gris);text-decoration:none;font-size:12px;transition:color .2s}
.nav-links a:hover{color:#fff}
.nav-right{display:flex;align-items:center;gap:10px}
.live-badge{display:flex;align-items:center;gap:7px;background:rgba(217,48,37,.12);border:1px solid rgba(217,48,37,.3);border-radius:30px;padding:6px 14px;font-size:12px;font-weight:500;color:#ff6b6b}
.live-dot{width:7px;height:7px;border-radius:50%;background:#ff4444;animation:pulso 1.4s ease-in-out infinite}
@keyframes pulso{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.8)}}
.app-btn-nav{display:flex;align-items:center;gap:6px;background:linear-gradient(135deg,#00c853,#1b5e20);border:none;border-radius:20px;padding:6px 14px;font-size:11px;font-weight:600;color:#fff;cursor:pointer;text-decoration:none;transition:transform .2s}
.app-btn-nav:hover{transform:translateY(-1px)}
.flag-bar{display:flex;height:8px;width:100%;position:sticky;top:73px;z-index:99}
.flag-r{flex:1;background:var(--rojo);animation:flagshine 2.5s ease-in-out infinite}
.flag-y{flex:1;background:var(--amarillo);animation:flagshine 2.5s ease-in-out .4s infinite}
.flag-g{flex:1;background:var(--verde);animation:flagshine 2.5s ease-in-out .8s infinite}
@keyframes flagshine{0%,100%{filter:brightness(1)}50%{filter:brightness(1.5)}}
.hero{position:relative;z-index:1;min-height:90vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:60px 40px;background:radial-gradient(ellipse 800px 600px at 50% 40%,rgba(217,48,37,.06) 0%,transparent 70%)}
.hero-logo{width:clamp(160px,22vw,280px);height:auto;margin-bottom:24px;filter:drop-shadow(0 8px 32px rgba(217,48,37,.6));opacity:0;animation:fadeUp .8s ease forwards .1s}
.hero-eyebrow{font-size:11px;letter-spacing:4px;color:var(--rojo);text-transform:uppercase;margin-bottom:14px;opacity:0;animation:fadeUp .8s ease forwards .3s}
.hero-subtitle{font-family:"Lora",serif;font-style:italic;font-size:clamp(16px,2.5vw,22px);color:var(--gris);margin-bottom:36px;opacity:0;animation:fadeUp .8s ease forwards .5s}
@keyframes fadeUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
.app-banner{background:linear-gradient(135deg,rgba(0,200,83,.1),rgba(27,94,32,.08));border:1px solid rgba(0,200,83,.25);border-radius:16px;padding:14px 22px;display:flex;align-items:center;gap:16px;max-width:460px;width:100%;margin:0 auto 24px;opacity:0;animation:fadeUp .8s ease forwards .6s}
.app-icon{width:44px;height:44px;background:linear-gradient(135deg,#00c853,#1b5e20);border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0}
.app-info{flex:1;text-align:left}
.app-title{font-size:13px;font-weight:600;color:#fff;margin-bottom:2px}
.app-sub{font-size:11px;color:var(--gris)}
.app-dl-btn{background:linear-gradient(135deg,#00c853,#1b5e20);color:#fff;border:none;border-radius:10px;padding:9px 16px;font-size:12px;font-weight:600;cursor:pointer;text-decoration:none;white-space:nowrap;font-family:"DM Sans",sans-serif;display:inline-block;transition:transform .15s}
.app-dl-btn:hover{transform:translateY(-2px)}
.player-container{background:var(--card);border:1px solid var(--borde);border-radius:20px;padding:24px 28px;width:100%;max-width:500px;margin-bottom:28px;opacity:0;animation:fadeUp .8s ease forwards .7s}
.player-header{display:flex;align-items:center;gap:14px;margin-bottom:18px}
.play-btn{width:52px;height:52px;border-radius:50%;background:var(--rojo);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:transform .15s,background .2s}
.play-btn:hover{background:var(--rojo-d);transform:scale(1.06)}
.play-tri{width:0;height:0;border-top:9px solid transparent;border-bottom:9px solid transparent;border-left:16px solid #fff;margin-left:3px}
.player-meta{flex:1;text-align:left}
.player-now{font-size:10px;color:var(--gris);letter-spacing:2px;text-transform:uppercase;margin-bottom:3px}
.player-show{font-size:15px;font-weight:600;color:#fff}
.player-host{font-size:12px;color:var(--gris)}
.visualizer{display:flex;align-items:center;justify-content:center;gap:4px;height:28px;margin-bottom:14px}
.vbar{width:4px;border-radius:3px;background:var(--rojo);opacity:.75}
.vb1{animation:vw .9s ease-in-out infinite}.vb2{animation:vw .9s .1s ease-in-out infinite}.vb3{animation:vw .9s .2s ease-in-out infinite}.vb4{animation:vw .9s .3s ease-in-out infinite}.vb5{animation:vw .9s .4s ease-in-out infinite}.vb6{animation:vw .9s .5s ease-in-out infinite}.vb7{animation:vw .9s .6s ease-in-out infinite}.vb8{animation:vw .9s .7s ease-in-out infinite}
@keyframes vw{0%,100%{height:6px}50%{height:26px}}

.hero-btns{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;opacity:0;animation:fadeUp .8s ease forwards .9s}
.btn-primary{background:var(--rojo);color:#fff;border:none;border-radius:10px;padding:12px 28px;font-size:14px;font-weight:600;cursor:pointer;font-family:"DM Sans",sans-serif;text-decoration:none;display:inline-block;transition:background .2s,transform .15s}
.btn-primary:hover{background:var(--rojo-d);transform:translateY(-2px)}
.btn-ghost{background:transparent;color:var(--gris2);border:1px solid var(--borde);border-radius:10px;padding:12px 28px;font-size:14px;cursor:pointer;font-family:"DM Sans",sans-serif;text-decoration:none;display:inline-block;transition:border-color .2s,color .2s,transform .15s}
.btn-ghost:hover{border-color:#555;color:#fff;transform:translateY(-2px)}
.divider{position:relative;z-index:1;display:flex;align-items:center;gap:16px;padding:0 40px;margin-bottom:32px}
.divider-line{flex:1;height:1px;background:var(--borde)}
.divider-label{font-size:10px;letter-spacing:3px;color:var(--gris);text-transform:uppercase}
section{position:relative;z-index:1;padding:0 40px 60px}
.section-title{font-family:"Bebas Neue",sans-serif;font-size:36px;letter-spacing:3px;color:#fff;margin-bottom:6px}
.section-sub{font-size:13px;color:var(--gris);margin-bottom:28px}
.grid-2{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px}
.grid-3{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.grid-4{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px}
.card{background:var(--card);border:1px solid var(--borde);border-radius:16px;padding:24px;transition:border-color .2s,transform .2s}
.card:hover{border-color:#333355;transform:translateY(-3px)}
.prog-row{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--borde)}
.prog-row:last-child{border-bottom:none}
.prog-dot2{width:10px;height:10px;border-radius:50%;flex-shrink:0}
.prog-time{font-size:12px;color:var(--gris);min-width:80px;font-weight:300}
.prog-nombre{font-size:14px;font-weight:500;color:#fff}
.prog-conductor{font-size:12px;color:var(--gris)}
.prog-live-tag{font-size:10px;background:rgba(217,48,37,.15);color:#ff6b6b;border:1px solid rgba(217,48,37,.25);border-radius:20px;padding:2px 10px}
.noticia-card{background:var(--card);border:1px solid var(--borde);border-radius:14px;overflow:hidden;transition:border-color .2s,transform .2s;text-decoration:none;display:block}
.noticia-card:hover{border-color:#333355;transform:translateY(-4px)}
.noticia-emoji{width:100%;height:110px;display:flex;align-items:center;justify-content:center;font-size:36px}
.noticia-body{padding:14px}
.noticia-cat{font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--rojo);margin-bottom:5px;font-weight:600}
.noticia-titulo{font-size:13px;font-weight:600;color:#fff;line-height:1.4;margin-bottom:6px}
.noticia-desc{font-size:12px;color:var(--gris);line-height:1.5;margin-bottom:8px}
.noticia-footer{display:flex;align-items:center;justify-content:space-between}
.noticia-fecha{font-size:11px;color:var(--gris)}
.noticia-fuente{font-size:10px;color:var(--rojo);letter-spacing:1px;font-weight:600}
.noticias-loading{text-align:center;padding:40px;color:var(--gris);font-size:13px;grid-column:1/-1}
.spinner{width:24px;height:24px;border:2px solid var(--borde);border-top-color:var(--rojo);border-radius:50%;animation:spin .8s linear infinite;margin:0 auto 12px}
@keyframes spin{to{transform:rotate(360deg)}}

/* UCH REALZADO */
.uch-section{position:relative;z-index:1;padding:0 40px 60px}
.uch-hero{background:linear-gradient(135deg,rgba(217,48,37,.12) 0%,rgba(139,0,0,.06) 50%,rgba(8,8,16,0) 100%);border:1px solid rgba(217,48,37,.3);border-radius:24px;padding:40px;position:relative;overflow:hidden}
.uch-hero::before{content:"";position:absolute;top:-60px;right:-60px;width:240px;height:240px;border-radius:50%;background:radial-gradient(circle,rgba(217,48,37,.12) 0%,transparent 70%);pointer-events:none}
.uch-hero-top{display:flex;align-items:center;gap:20px;margin-bottom:32px;flex-wrap:wrap}
.uch-logo-big{width:72px;height:72px;border-radius:50%;background:linear-gradient(135deg,var(--rojo),var(--rojo-d));display:flex;align-items:center;justify-content:center;font-size:32px;flex-shrink:0;box-shadow:0 8px 24px rgba(217,48,37,.4)}
.uch-titles{flex:1}
.uch-badge{display:inline-block;font-size:9px;letter-spacing:3px;text-transform:uppercase;background:rgba(217,48,37,.15);border:1px solid rgba(217,48,37,.3);color:#ff6b6b;border-radius:20px;padding:4px 12px;margin-bottom:8px}
.uch-main-title{font-family:"Bebas Neue",sans-serif;font-size:clamp(28px,4vw,48px);letter-spacing:3px;color:#fff;line-height:1;margin-bottom:6px}
.uch-host-line{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--gris)}
.uch-host-dot{width:6px;height:6px;border-radius:50%;background:var(--rojo);flex-shrink:0;animation:pulso 1.4s ease-in-out infinite}
.uch-date-card{background:rgba(0,0,0,.3);border:1px solid rgba(217,48,37,.2);border-radius:12px;padding:12px 20px;text-align:center;flex-shrink:0}
.uch-date-num{font-family:"Bebas Neue",sans-serif;font-size:48px;color:var(--rojo);line-height:1}
.uch-date-mes{font-size:11px;color:var(--gris);letter-spacing:2px;text-transform:uppercase}

/* AUDIO PLAYER GRANDE */
.uch-player-big{background:rgba(0,0,0,.4);border:1px solid rgba(217,48,37,.15);border-radius:16px;padding:24px;margin-bottom:24px}
.uch-now-playing{display:flex;align-items:center;gap:8px;margin-bottom:16px}
.uch-np-dot{width:8px;height:8px;border-radius:50%;background:#ff4444;animation:pulso 1s ease-in-out infinite;flex-shrink:0}
.uch-np-text{font-size:11px;color:#ff6b6b;letter-spacing:2px;text-transform:uppercase;font-weight:600}
audio{width:100%;height:40px;outline:none;border-radius:8px}
audio::-webkit-media-controls-panel{background:rgba(217,48,37,.15)}
.uch-actions-big{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px}
.uch-btn-big{display:flex;align-items:center;justify-content:center;gap:10px;border-radius:12px;padding:14px 20px;font-size:13px;font-weight:600;cursor:pointer;text-decoration:none;font-family:"DM Sans",sans-serif;transition:all .2s;border:none}
.uch-btn-dl{background:var(--rojo);color:#fff}
.uch-btn-dl:hover{background:var(--rojo-d);transform:translateY(-2px)}
.uch-btn-drive{background:transparent;color:var(--gris2);border:1px solid var(--borde) !important}
.uch-btn-drive:hover{border-color:#555 !important;color:#fff;transform:translateY(-2px)}
.uch-preview-note{font-size:11px;color:var(--gris);text-align:center;font-style:italic;padding-top:12px;border-top:1px solid var(--borde)}

/* HECHOS HISTÓRICOS */
.uch-hechos{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin-bottom:24px}
.hecho-big{background:rgba(0,0,0,.3);border:1px solid var(--borde);border-radius:12px;padding:16px;transition:border-color .2s}
.hecho-big:hover{border-left:3px solid var(--rojo);border-color:rgba(217,48,37,.3)}
.hecho-anio-big{font-family:"Bebas Neue",sans-serif;font-size:28px;color:var(--rojo);line-height:1;margin-bottom:6px}
.hecho-texto-big{font-size:13px;color:var(--gris2);line-height:1.55}

/* DONACIÓN */
.donacion-strip{background:linear-gradient(135deg,rgba(245,197,24,.06),rgba(8,8,16,0));border:1px solid rgba(245,197,24,.2);border-radius:16px;padding:24px;display:flex;align-items:center;gap:24px;flex-wrap:wrap;margin-top:8px}
.qr-small{background:#fff;border-radius:12px;padding:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.qr-small img{width:110px;height:110px}
.don-info{flex:1;min-width:200px}
.don-title{font-family:"Bebas Neue",sans-serif;font-size:22px;letter-spacing:2px;color:var(--amarillo);margin-bottom:6px}
.don-sub{font-size:12px;color:var(--gris);line-height:1.6;margin-bottom:12px}
.don-badges{display:flex;gap:8px;flex-wrap:wrap}
.don-badge{background:rgba(245,197,24,.08);border:1px solid rgba(245,197,24,.15);border-radius:8px;padding:5px 12px;font-size:11px;color:var(--gris2)}

/* MÚSICA */
.music-tabs{display:flex;gap:8px;margin-bottom:20px;flex-wrap:wrap}
.music-tab{background:var(--card);border:1px solid var(--borde);border-radius:20px;padding:8px 18px;font-size:12px;font-weight:500;color:var(--gris);cursor:pointer;transition:all .2s;font-family:"DM Sans",sans-serif}
.music-tab.active{background:var(--rojo);border-color:var(--rojo);color:#fff}
.music-tab:hover:not(.active){border-color:#555;color:#fff}
.music-panel{display:none}
.music-panel.active{display:block}

.ausp-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px}
.ausp-card{background:var(--card);border:1px solid var(--borde);border-radius:16px;overflow:hidden;transition:border-color .2s,transform .2s,box-shadow .2s;text-decoration:none;display:block}
.ausp-card:hover{border-color:#d93025;transform:translateY(-5px);box-shadow:0 8px 32px rgba(217,48,37,.15)}
.ausp-img-wrap{width:100%;height:220px;overflow:hidden;position:relative}
.ausp-img-wrap img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.ausp-card:hover .ausp-img-wrap img{transform:scale(1.05)}
.ausp-overlay{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(transparent,rgba(8,8,16,.9));padding:20px 16px 12px}
.ausp-nombre{font-family:"Bebas Neue",sans-serif;font-size:20px;letter-spacing:2px;color:#fff}
.ausp-body{padding:14px 16px}
.ausp-desc{font-size:12px;color:var(--gris);line-height:1.5;margin-bottom:10px}
.ausp-contacto{font-size:12px;color:var(--rojo);font-weight:500}
.ausp-badge{display:inline-block;font-size:9px;letter-spacing:2px;text-transform:uppercase;background:rgba(217,48,37,.1);border:1px solid rgba(217,48,37,.2);color:var(--rojo);border-radius:20px;padding:3px 10px;margin-bottom:8px}
.plat-card{background:var(--card);border:1px solid var(--borde);border-radius:14px;padding:20px 16px;text-align:center;text-decoration:none;display:block;transition:border-color .2s,transform .2s}
.plat-card:hover{border-color:#333355;transform:translateY(-4px)}
.plat-logo{width:48px;height:48px;border-radius:12px;margin:0 auto 12px;display:flex;align-items:center;justify-content:center;font-family:"Bebas Neue",sans-serif;font-size:22px;color:#fff}
.plat-nombre{font-size:13px;font-weight:500;color:#fff;margin-bottom:4px}
.plat-accion{font-size:11px;color:var(--gris)}
.contacto-card{background:linear-gradient(135deg,rgba(217,48,37,.1) 0%,rgba(8,8,16,0) 60%);border:1px solid rgba(217,48,37,.2);border-radius:20px;padding:40px;text-align:center}
.contacto-titulo{font-family:"Bebas Neue",sans-serif;font-size:40px;letter-spacing:3px;color:#fff;margin-bottom:12px}
.contacto-sub{font-size:14px;color:var(--gris);margin-bottom:28px;max-width:400px;margin-left:auto;margin-right:auto}
.contacto-links{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.contacto-link{display:flex;align-items:center;gap:8px;background:var(--card);border:1px solid var(--borde);border-radius:10px;padding:10px 18px;font-size:13px;color:var(--gris2);text-decoration:none;transition:border-color .2s,color .2s}
.contacto-link:hover{border-color:#555;color:#fff}
footer{position:relative;z-index:1;border-top:1px solid var(--borde);padding:40px 40px 32px;text-align:center}
.footer-logo-img{height:80px;width:auto;margin:0 auto 12px;display:block;filter:drop-shadow(0 4px 16px rgba(217,48,37,.4))}
.footer-logo-wrap{display:flex;align-items:center;justify-content:center;gap:6px;margin-bottom:8px}
.footer-r{font-family:"Bebas Neue",sans-serif;font-size:42px;letter-spacing:4px;color:var(--rojo);animation:glow-r 2s ease-in-out infinite}
.footer-l{font-family:"Bebas Neue",sans-serif;font-size:42px;letter-spacing:4px;color:var(--amarillo);animation:glow-y 2s ease-in-out .4s infinite}
.footer-b{font-family:"Bebas Neue",sans-serif;font-size:42px;letter-spacing:4px;color:#4caf50;animation:glow-g 2s ease-in-out .8s infinite}
@keyframes glow-r{0%,100%{text-shadow:0 0 8px rgba(217,48,37,.4)}50%{text-shadow:0 0 28px rgba(217,48,37,1),0 0 56px rgba(217,48,37,.5)}}
@keyframes glow-y{0%,100%{text-shadow:0 0 8px rgba(245,197,24,.4)}50%{text-shadow:0 0 28px rgba(245,197,24,1),0 0 56px rgba(245,197,24,.5)}}
@keyframes glow-g{0%,100%{text-shadow:0 0 8px rgba(76,175,80,.4)}50%{text-shadow:0 0 28px rgba(76,175,80,1),0 0 56px rgba(76,175,80,.5)}}
.footer-slogan{font-family:"Lora",serif;font-style:italic;font-size:14px;color:var(--gris);margin-bottom:24px}
.footer-links{display:flex;gap:20px;justify-content:center;margin-bottom:16px;flex-wrap:wrap}
.footer-links a{font-size:12px;color:var(--gris);text-decoration:none;transition:color .2s}
.footer-links a:hover{color:#fff}
.footer-legal{font-size:11px;color:#333}
@media(max-width:768px){nav{padding:10px 16px}.nav-links{display:none}.hero{padding:50px 20px 40px}section,.uch-section{padding:0 20px 48px}footer{padding:28px 20px}.divider{padding:0 20px}.uch-actions-big{grid-template-columns:1fr}.donacion-strip{flex-direction:column;text-align:center}}

/* ══ INTRO SPLASH ══ */
#rlb-intro{position:fixed;inset:0;z-index:9999;background:#000;overflow:hidden}
#rlb-intro.hide{animation:iOut .9s cubic-bezier(.77,0,.18,1) forwards;pointer-events:none}
@keyframes iOut{0%{opacity:1;transform:scale(1)}40%{opacity:1;transform:scale(1.03)}100%{opacity:0;transform:scale(1.1)}}
#intro-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.iov1{position:absolute;inset:0;z-index:1;background:radial-gradient(ellipse 80% 80% at 50% 50%,rgba(8,8,16,.04) 0%,rgba(8,8,16,.52) 100%)}
.iov2{position:absolute;inset:0;z-index:2;background:linear-gradient(to bottom,rgba(8,8,16,0) 0%,rgba(8,8,16,0) 40%,rgba(8,8,16,.65) 78%,rgba(8,8,16,.96) 100%)}

/* ── LOGO + ANILLOS ──
   Posición inicial: CENTRO
   0s→2s: centro
   2s→6s: derecha
   6s→10s: izquierda
*/
.il-wrap{
  position:absolute;z-index:5;
  /* CENTRO: 0-2s */
  top:50%;left:50%;
  transform:translate(-50%,-54%);
  animation:
    toRight 0.7s cubic-bezier(.23,1,.32,1) forwards 2s,
    toLeft  0.7s cubic-bezier(.23,1,.32,1) forwards 6s;
}
@keyframes toRight{
  from{top:50%;left:50%;transform:translate(-50%,-54%)}
  to  {top:50%;left:auto;right:5%;transform:translate(0,-50%)}
}
@keyframes toLeft{
  from{top:50%;left:auto;right:5%;transform:translate(0,-50%)}
  to  {top:50%;left:5%;right:auto;transform:translate(0,-50%)}
}

/* Anillos */
.il-rings{position:relative;display:flex;align-items:center;justify-content:center;width:380px;height:380px}
.il-ring{position:absolute;border-radius:50%;left:50%;top:50%;
  transform:translate(-50%,-50%) scale(.6);
  animation:rPulse 2.4s ease-out infinite}
.r1{width:170px;height:170px;border:2.5px solid rgba(217,48,37,.9);box-shadow:0 0 18px rgba(217,48,37,.4);animation-delay:0s}
.r2{width:240px;height:240px;border:2px   solid rgba(245,197,24,.75);box-shadow:0 0 14px rgba(245,197,24,.3);animation-delay:.7s}
.r3{width:318px;height:318px;border:1.5px solid rgba(46,125,50,.65);box-shadow:0 0 12px rgba(46,125,50,.25);animation-delay:1.4s}
.r4{width:378px;height:378px;border:1px   solid rgba(255,255,255,.2);animation-delay:2.1s}
@keyframes rPulse{
  0%  {opacity:.85;transform:translate(-50%,-50%) scale(.6)}
  100%{opacity:0;  transform:translate(-50%,-50%) scale(1.45)}
}

/* Logo img — un poco más pequeño */
.il-img{
  width:clamp(120px,15vw,175px);height:auto;
  position:relative;z-index:2;
  filter:
    drop-shadow(0 0 44px rgba(217,48,37,.88))
    drop-shadow(0 0 22px rgba(245,197,24,.5))
    drop-shadow(0 0 8px rgba(255,255,255,.25));
  animation:iBounce 1s cubic-bezier(.36,.07,.19,.97) both;
}
@keyframes iBounce{
  0%  {opacity:0;transform:scale(.22) rotate(-20deg)}
  55% {opacity:1;transform:scale(1.07) rotate(4deg)}
  75% {transform:scale(.97) rotate(-1.5deg)}
  100%{opacity:1;transform:scale(1) rotate(0)}
}

/* ── TEXTO CRAWL — corre de derecha a izquierda los 10s ── */
.ib-crawl-wrap{
  position:absolute;bottom:32px;left:0;right:0;z-index:6;
  overflow:hidden;
  /* Mascara fade en los bordes */
  -webkit-mask-image:linear-gradient(to right,transparent 0%,#000 8%,#000 92%,transparent 100%);
  mask-image:linear-gradient(to right,transparent 0%,#000 8%,#000 92%,transparent 100%);
  pointer-events:none;
}
.ib-crawl-track{
  display:flex;align-items:center;gap:0;
  white-space:nowrap;
  /* 10s exactos, linear, empieza de inmediato */
  animation:crawlMove 10s linear forwards;
  will-change:transform;
}
/* El texto empieza fuera de la pantalla por la derecha y termina fuera por la izquierda */
@keyframes crawlMove{
  0%  {transform:translateX(100vw)}
  100%{transform:translateX(-100%)}
}
.ib-crawl-item{
  font-family:"Bebas Neue",sans-serif;
  font-size:clamp(40px,7vw,78px);
  letter-spacing:8px;
  line-height:1;
  padding-right:60px;
}
.ib-cr{color:#d93025}
.ib-cl{color:#f5c518}
.ib-cb{color:#4caf50}
.ib-sep{
  font-family:"Bebas Neue",sans-serif;
  font-size:clamp(40px,7vw,78px);
  color:rgba(255,255,255,.25);
  padding-right:60px;
  letter-spacing:0;
}
.ib-slogan-crawl{
  font-family:"Lora",serif;font-style:italic;
  font-size:clamp(18px,3vw,30px);
  color:rgba(255,255,255,.78);
  letter-spacing:2px;
  padding-right:80px;
}

/* SKIP */
.i-skip{
  position:absolute;bottom:12px;right:22px;z-index:10;
  background:rgba(255,255,255,.07);backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.12);border-radius:20px;
  padding:6px 16px;font-size:11px;color:rgba(255,255,255,.5);
  letter-spacing:2px;text-transform:uppercase;cursor:pointer;
  font-family:"DM Sans",sans-serif;transition:all .2s;
}
.i-skip:hover{background:rgba(255,255,255,.14);color:#fff}

/* BARRA PROGRESO */
.i-prog{position:absolute;bottom:0;left:0;right:0;height:3px;background:rgba(255,255,255,.06);z-index:10}
.i-prog-f{height:100%;width:0%;background:linear-gradient(90deg,#d93025 0%,#f5c518 50%,#2e7d32 100%);transition:width .25s linear}

/* ══ CONTADOR VISITAS ══ */
.visit-wrap{display:flex;align-items:center;justify-content:center;gap:14px;padding:18px 0;border-top:1px solid rgba(255,255,255,.06);margin-top:16px}
.visit-label{font-size:10px;color:#444;letter-spacing:2px;text-transform:uppercase}
.visit-digits{display:flex;gap:3px;align-items:center}
.vd{background:#0f0f1e;border:1px solid rgba(255,255,255,.07);border-radius:6px;padding:5px 9px;font-family:"Bebas Neue",sans-serif;font-size:24px;color:#fff;min-width:30px;text-align:center}
.vd-s{font-family:"Bebas Neue",sans-serif;font-size:20px;color:#222;padding:0 1px}
.visit-dot{width:7px;height:7px;border-radius:50%;background:#2e7d32;animation:pulso 2s ease-in-out infinite}

.partido-grid{display:flex;flex-direction:column;gap:10px}
.partido-card{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.07);border-radius:14px;padding:14px 20px;display:flex;align-items:center;gap:16px;transition:border-color .2s,background .2s;position:relative;overflow:hidden}
.partido-card:hover{background:rgba(255,255,255,.06);border-color:rgba(74,144,217,.3)}
.partido-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(to bottom,#d93025,#f5c518,#2e7d32)}
.partido-equipo{display:flex;align-items:center;gap:10px;flex:1;min-width:0}
.partido-equipo.derecha{flex-direction:row-reverse;text-align:right}
.partido-bandera{font-size:32px;line-height:1;flex-shrink:0}
.partido-pais{font-size:14px;font-weight:600;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.partido-grupo{font-size:10px;color:#8888aa;letter-spacing:1px}
.partido-centro{display:flex;flex-direction:column;align-items:center;gap:4px;flex-shrink:0;min-width:90px}
.partido-hora{font-family:"Bebas Neue",sans-serif;font-size:22px;color:#fff;letter-spacing:2px;line-height:1}
.partido-hora-lbl{font-size:9px;color:#8888aa;letter-spacing:1px}
.partido-vs{font-size:11px;color:#555;letter-spacing:1px}
.partido-ciudad{font-size:10px;color:#8888aa;text-align:center;margin-top:2px}
.partido-vivo{display:inline-flex;align-items:center;gap:4px;background:rgba(217,48,37,.15);border:1px solid rgba(217,48,37,.3);border-radius:20px;padding:3px 10px;font-size:10px;color:#ff6b6b;font-weight:600}
.partido-score{font-family:"Bebas Neue",sans-serif;font-size:28px;color:#f5c518;letter-spacing:3px;line-height:1}

/* ══ SECCIÓN MULTIMEDIA ══ */
.media-section{position:relative;z-index:1;padding:0 40px 60px}

/* Layout principal 70/30 */
.media-grid{
  display:grid;
  grid-template-columns:1fr 340px;
  gap:20px;
  align-items:start;
}

/* ── COLUMNA IZQUIERDA: YouTube ── */
.media-yt-wrap{display:flex;flex-direction:column;gap:16px}

.media-live-badge{
  display:inline-flex;align-items:center;gap:8px;
  background:rgba(255,0,0,.12);border:1px solid rgba(255,0,0,.3);
  border-radius:20px;padding:6px 16px;
  font-size:11px;font-weight:700;color:#ff4444;
  letter-spacing:1px;text-transform:uppercase;width:fit-content;
  margin-bottom:4px;
}
.media-live-dot{
  width:8px;height:8px;border-radius:50%;background:#ff0000;
  animation:pulso 1s ease-in-out infinite;
}

.yt-player-wrap{
  position:relative;width:100%;
  padding-bottom:56.25%;/* 16:9 */
  height:0;overflow:hidden;
  border-radius:16px;
  background:#000;
  box-shadow:0 8px 40px rgba(0,0,0,.6);
}
.yt-player-wrap iframe{
  position:absolute;top:0;left:0;
  width:100%;height:100%;
  border:none;border-radius:16px;
}

/* Tabs de videos */
.yt-tabs{display:flex;gap:8px;margin-top:4px;flex-wrap:wrap}
.yt-tab{
  background:var(--card);border:1px solid var(--borde);
  border-radius:20px;padding:7px 16px;font-size:12px;
  font-weight:500;color:var(--gris);cursor:pointer;
  transition:all .2s;font-family:"DM Sans",sans-serif;
}
.yt-tab.on{background:#ff0000;border-color:#ff0000;color:#fff}
.yt-tab:hover:not(.on){border-color:#555;color:#fff}

/* Mini grid de videos recientes */
.yt-recientes{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:10px;margin-top:4px;
}
.yt-mini{
  background:var(--card);border:1px solid var(--borde);
  border-radius:12px;overflow:hidden;cursor:pointer;
  transition:border-color .2s,transform .2s;text-decoration:none;display:block;
}
.yt-mini:hover{border-color:#ff0000;transform:translateY(-3px)}
.yt-mini-thumb{
  position:relative;width:100%;padding-bottom:56.25%;
  background:#111;overflow:hidden;
}
.yt-mini-thumb img{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;transition:transform .3s;
}
.yt-mini:hover .yt-mini-thumb img{transform:scale(1.05)}
.yt-mini-play{
  position:absolute;inset:0;display:flex;
  align-items:center;justify-content:center;
  background:rgba(0,0,0,.4);
}
.yt-mini-play svg{width:36px;height:36px;opacity:.9;transition:opacity .2s}
.yt-mini:hover .yt-mini-play svg{opacity:1}
.yt-mini-info{padding:10px 12px}
.yt-mini-title{font-size:12px;font-weight:600;color:#fff;line-height:1.4;margin-bottom:4px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.yt-mini-date{font-size:10px;color:var(--gris)}

/* ── COLUMNA DERECHA: Facebook + Stats ── */
.media-fb-wrap{display:flex;flex-direction:column;gap:16px}

.media-fb-card{
  background:var(--card);border:1px solid var(--borde);
  border-radius:16px;overflow:hidden;
}
.media-fb-header{
  background:linear-gradient(135deg,#1877f2,#0a5bc4);
  padding:16px 20px;display:flex;align-items:center;gap:12px;
}
.fb-logo-circle{
  width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.15);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.media-fb-name{font-size:14px;font-weight:700;color:#fff}
.media-fb-handle{font-size:11px;color:rgba(255,255,255,.7)}
.media-fb-embed{width:100%;overflow:hidden;min-height:300px}
.media-fb-embed iframe{width:100%!important;max-width:100%!important}

/* Stats card */
.media-stats{
  background:var(--card);border:1px solid var(--borde);
  border-radius:16px;padding:20px;
}
.media-stats-title{
  font-size:11px;color:var(--gris);letter-spacing:2px;
  text-transform:uppercase;margin-bottom:16px;
}
.stat-row{
  display:flex;align-items:center;justify-content:space-between;
  padding:10px 0;border-bottom:1px solid var(--borde);
}
.stat-row:last-child{border-bottom:none}
.stat-name{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--gris2)}
.stat-ico{font-size:16px}
.stat-val{font-family:"Bebas Neue",sans-serif;font-size:20px;color:#fff;letter-spacing:1px}

/* CTA Seguir */
.fb-cta{
  display:flex;align-items:center;justify-content:center;gap:10px;
  background:linear-gradient(135deg,#1877f2,#0a5bc4);
  border-radius:12px;padding:14px 20px;text-decoration:none;
  font-size:14px;font-weight:700;color:#fff;
  transition:transform .2s,box-shadow .2s;
  border:none;width:100%;font-family:"DM Sans",sans-serif;
}
.fb-cta:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(24,119,242,.4)}

/* Responsive */
@media(max-width:900px){
  .media-grid{grid-template-columns:1fr}
  .media-section{padding:0 20px 48px}
}
@media(max-width:480px){
  .yt-recientes{grid-template-columns:1fr}
}

/* ══════════════════════════════════════════════════
   HUB MULTIMEDIA — Radio Life Bolivia 2026
   Prefijo `hub-` en todas las clases → sin conflictos
══════════════════════════════════════════════════ */

/* ── LIVE SCORES STRIP (debajo del logo, sticky al scroll) ── */

/* Label izquierdo */

/* Tarjeta de partido en la tira */

@keyframes pill-pulse {
  0%,100% { border-color: rgba(217,48,37,.4); }
  50%      { border-color: rgba(217,48,37,.8); }
}

/* Loading state */

.hub-spin-sm {
  width: 14px; height: 14px;
  border: 2px solid rgba(255,255,255,.1);
  border-top-color: #d93025;
  border-radius: 50%;
  animation: spin .8s linear infinite;
  flex-shrink: 0;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* ── HUB MULTIMEDIA SECTION ── */
.hub-section {
  position: relative; z-index: 1;
  padding: 0 40px 60px;
}
@media(max-width:640px) { .hub-section { padding: 0 16px 48px; } }

/* Grid 70/30 */
.hub-grid {
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: 24px;
  align-items: stretch; /* ambas columnas misma altura */
}
.hub-yt-wrap, .hub-side {
  display: flex;
  flex-direction: column;
}
/* YouTube ocupa todo el alto disponible */
.hub-yt-wrap { gap: 14px; }
#hub-panel-live,#hub-panel-wc,#hub-panel-rec { flex:1; }
.hub-player-ratio {
  position: relative; width: 100%;
  padding-bottom: 56.25%; height: 0;
  overflow: hidden; border-radius: 16px;
  background: #000;
  box-shadow: 0 12px 48px rgba(0,0,0,.7);
}
/* Facebook ocupa todo el alto sin espacio vacío */
.hub-fb-body iframe {
  min-height: 380px;
  height: 100%;
}
.hub-side { gap: 16px; }
.hub-fb-card {
  flex: 1; /* la card FB ocupa el espacio restante */
  display: flex;
  flex-direction: column;
}
.hub-fb-body {
  flex: 1;
  overflow: hidden;
  min-height: 280px;
}
@media(max-width:1024px) { .hub-grid { grid-template-columns: 1fr 280px; } }
@media(max-width:768px)  { .hub-grid { grid-template-columns: 1fr; } }

/* ── YOUTUBE PLAYER ── */
.hub-yt-wrap { display: flex; flex-direction: column; gap: 14px; }

.hub-yt-header {
  display: flex; align-items: center;
  justify-content: space-between; flex-wrap: wrap; gap: 8px;
}
.hub-yt-logo {
  display: flex; align-items: center; gap: 10px;
}
.hub-yt-logo svg { width: 28px; height: 20px; }
.hub-yt-channel {
  font-size: 13px; font-weight: 700; color: #fff;
}
.hub-yt-sub {
  font-size: 10px; color: #8888aa; letter-spacing: .5px;
}

/* Tabs */
.hub-tabs {
  display: flex; gap: 6px; flex-wrap: wrap;
}
.hub-tab {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 20px; padding: 6px 16px;
  font-size: 11px; font-weight: 600;
  color: #8888aa; cursor: pointer;
  transition: all .2s;
  font-family: "DM Sans", sans-serif;
  letter-spacing: .5px;
}
.hub-tab.on { color: #fff; border-color: transparent; }
.hub-tab.on.yt  { background: #ff0000; }
.hub-tab.on.wc  { background: rgba(74,144,217,.25); color: #4a90d9; border-color: rgba(74,144,217,.3); }
.hub-tab.on.rec { background: rgba(255,255,255,.12); color: #fff; }
.hub-tab:hover:not(.on) { border-color: #444; color: #ccc; }

/* Player responsive 16:9 */
.hub-player-ratio {
  position: relative; width: 100%;
  padding-bottom: 56.25%; height: 0;
  overflow: hidden; border-radius: 16px;
  background: #000;
  box-shadow: 0 12px 48px rgba(0,0,0,.7);
}
.hub-player-ratio iframe {
  position: absolute; top: 0; left: 0;
  width: 100%; height: 100%;
  border: none; border-radius: 16px;
}
.hub-player-placeholder {
  position: absolute; inset: 0;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  gap: 12px; background: #0a0a16;
  border-radius: 16px; cursor: pointer;
  transition: background .2s;
}
.hub-player-placeholder:hover { background: #111120; }
.hub-play-icon {
  width: 64px; height: 64px;
  background: #ff0000; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 0 40px rgba(255,0,0,.4);
  transition: transform .2s, box-shadow .2s;
}
.hub-player-placeholder:hover .hub-play-icon {
  transform: scale(1.08);
  box-shadow: 0 0 60px rgba(255,0,0,.6);
}
.hub-play-icon svg { margin-left: 4px; }
.hub-player-caption {
  font-size: 13px; color: #888; text-align: center; padding: 0 20px;
}

/* Mini grid recientes */
.hub-rec-grid {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 10px;
}
@media(max-width:480px) { .hub-rec-grid { grid-template-columns: 1fr; } }

.hub-rec-card {
  background: var(--card);
  border: 1px solid var(--borde);
  border-radius: 12px; overflow: hidden;
  text-decoration: none; display: block;
  transition: border-color .2s, transform .2s;
}
.hub-rec-card:hover {
  border-color: rgba(255,0,0,.4);
  transform: translateY(-3px);
}
.hub-rec-thumb {
  position: relative; width: 100%;
  padding-bottom: 56.25%; background: #111;
  overflow: hidden;
}
.hub-rec-thumb-bg {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
}
.hub-rec-play {
  width: 36px; height: 36px;
  background: rgba(255,0,0,.85); border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
}
.hub-rec-body { padding: 10px 12px; }
.hub-rec-title {
  font-size: 12px; font-weight: 600; color: #fff;
  line-height: 1.4; margin-bottom: 4px;
  display: -webkit-box; -webkit-line-clamp: 2;
  -webkit-box-orient: vertical; overflow: hidden;
}
.hub-rec-meta { font-size: 10px; color: #8888aa; }

/* Footer links del player */
.hub-yt-footer {
  display: flex; align-items: center;
  justify-content: space-between; flex-wrap: wrap; gap: 8px;
}
.hub-yt-link {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 12px; color: #ff0000;
  text-decoration: none; transition: opacity .2s;
}
.hub-yt-link:hover { opacity: .75; }
.hub-yt-note { font-size: 11px; color: #555; }

/* ── COLUMNA FACEBOOK + STATS ── */
.hub-side { display: flex; flex-direction: column; gap: 16px; }

.hub-fb-card {
  background: var(--card);
  border: 1px solid var(--borde);
  border-radius: 16px; overflow: hidden;
}
.hub-fb-head {
  background: linear-gradient(135deg,#1877f2,#0a5bc4);
  padding: 14px 18px;
  display: flex; align-items: center; gap: 12px;
}
.hub-fb-avatar {
  width: 42px; height: 42px; border-radius: 50%;
  background: rgba(255,255,255,.15);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.hub-fb-info-name { font-size: 14px; font-weight: 700; color: #fff; }
.hub-fb-info-sub  { font-size: 10px; color: rgba(255,255,255,.65); margin-top: 2px; }
.hub-fb-body {
  overflow: hidden;
}
.hub-fb-body iframe {
  width: 100% !important;
  max-width: 100% !important;
  border: none !important;
  display: block;
}

/* CTA seguir */
.hub-fb-cta {
  display: flex; align-items: center;
  justify-content: center; gap: 10px;
  background: linear-gradient(135deg,#1877f2,#0a5bc4);
  border-radius: 12px; padding: 13px 20px;
  text-decoration: none; font-size: 13px;
  font-weight: 700; color: #fff;
  transition: transform .2s, box-shadow .2s;
  font-family: "DM Sans", sans-serif;
}
.hub-fb-cta:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 24px rgba(24,119,242,.4);
}

/* Stats card */
.hub-stats-card {
  background: var(--card);
  border: 1px solid var(--borde);
  border-radius: 16px; padding: 18px 20px;
}
.hub-stats-title {
  font-size: 10px; color: #8888aa;
  letter-spacing: 2px; text-transform: uppercase;
  margin-bottom: 14px;
}
.hub-stat {
  display: flex; align-items: center;
  justify-content: space-between;
  padding: 9px 0;
  border-bottom: 1px solid rgba(255,255,255,.05);
}
.hub-stat:last-child { border-bottom: none; }
.hub-stat-label {
  display: flex; align-items: center;
  gap: 8px; font-size: 12px; color: #8888aa;
}
.hub-stat-val {
  font-family: "Bebas Neue", sans-serif;
  font-size: 15px; letter-spacing: 1px;
  text-decoration: none;
}

/* ── LIVE BADGE ── */
.hub-live-badge {
  display: inline-flex; align-items: center; gap: 6px;
  background: rgba(255,0,0,.1);
  border: 1px solid rgba(255,0,0,.25);
  border-radius: 20px; padding: 5px 12px;
  font-size: 10px; font-weight: 700;
  color: #ff4444; letter-spacing: 1px;
  text-transform: uppercase;
}
.hub-live-dot {
  width: 7px; height: 7px; border-radius: 50%;
  background: #ff0000;
  animation: pulso 1s ease-in-out infinite;
}

/* ══ LOGO HERO — ONDAS LATERALES ══ */
.hero-logo-wrap{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-bottom:24px;
}
.hero-logo-wrap .hero-logo{ margin-bottom:0; }

/* Anillos concéntricos alrededor del logo */
.hlw-ring{
  position:absolute;
  border-radius:50%;
  border:2px solid;
  left:50%; top:50%;
  transform:translate(-50%,-50%) scale(.6);
  opacity:0;
  animation:hlwPulse 2.6s ease-out infinite;
  pointer-events:none;
}
.hlw-r1{
  width:calc(100% + 40px);height:calc(100% + 40px);
  border-color:rgba(217,48,37,.8);
  box-shadow:0 0 12px rgba(217,48,37,.3);
  animation-delay:0s;
}
.hlw-r2{
  width:calc(100% + 90px);height:calc(100% + 90px);
  border-color:rgba(245,197,24,.6);
  box-shadow:0 0 10px rgba(245,197,24,.2);
  animation-delay:.7s;
}
.hlw-r3{
  width:calc(100% + 150px);height:calc(100% + 150px);
  border-color:rgba(46,125,50,.5);
  animation-delay:1.4s;
}
.hlw-r4{
  width:calc(100% + 220px);height:calc(100% + 220px);
  border-color:rgba(255,255,255,.15);
  animation-delay:2.1s;
}
@keyframes hlwPulse{
  0%  {opacity:.85;transform:translate(-50%,-50%) scale(.6)}
  100%{opacity:0;  transform:translate(-50%,-50%) scale(1.25)}
}

/* ══ FIX DEFINITIVO REFLOW MÓVIL HERO ══ */
.hero{
  contain:layout;
  overflow-x:clip;
}

/* En móvil, el reproductor flotante no empuja nada */
@media(max-width:768px){
  body{overflow-x:hidden}
  .rlp-wrap{
    position:fixed!important;
  }
  .hero-logo-wrap{
    contain:layout;
    min-height:200px;
    display:flex;
    align-items:center;
    justify-content:center;
  }
}

/* ══ FIX: Player flotante oculto durante el intro ══ */
body.intro-activo .rlp-wrap{
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
  transition:opacity .4s ease;
}
.rlp-wrap{
  transition:opacity .5s ease .3s, visibility .5s ease .3s;
}

/* ══ FIX MÓVIL DEFINITIVO — reproductor no mueve la web ══ */
html{
  overflow-x:hidden;
  width:100%;
}
body{
  overflow-x:hidden;
  position:relative;
  width:100%;
  max-width:100vw;
}
/* El reproductor flotante SIEMPRE fixed, nunca empuja contenido.
   OJO: nada de contain:size — colapsa la cápsula a 0x0 y desaparece. */
.rlp-wrap{
  position:fixed !important;
  will-change:transform;
  isolation:isolate;
}
@media(max-width:768px){
  /* Todos los iframes responsivos sin desbordar */
  iframe{max-width:100% !important}
  /* El hero no se desborda */
  .hero{
    padding-left:16px !important;
    padding-right:16px !important;
    overflow-x:hidden;
    max-width:100vw;
  }
  /* Widget lateral oculto en móvil (ya usa mob-bar) */
  .sw-wrap{display:none !important}
  /* Secciones sin desbordamiento horizontal */
  section, .hub-section, .media-section, .gal-sec{overflow-x:hidden}
  /* Grids a una columna en móvil */
  .hub-grid{grid-template-columns:1fr !important}
}


/* ══ ANTI-REFLOW MÓVIL ══ */
/* Reservar espacio para evitar saltos al cargar iframes */

.hero-vbars{min-height:30px}
/* Imagen del hero con dimensiones reservadas */
.hero-logo-wrap{min-height:clamp(160px,22vw,260px)}
.hero-logo{width:clamp(160px,22vw,260px);height:auto;display:block;will-change:auto}
/* Evitar reflow en móvil del player flotante */
@media(max-width:768px){
  .hero{overflow-x:hidden}
  
}
/* Estabilizar el hero en móvil */
@media(max-width:480px){
  .hero{padding-left:16px;padding-right:16px;overflow-x:hidden}
  .hero-logo-wrap{min-height:180px}
  
}

/* ── WIDGET LATERAL DESKTOP ── */
.sw-wrap{position:fixed;right:0;top:50%;transform:translateY(-50%);z-index:200;display:flex;flex-direction:column;gap:3px}
.sw-card{background:rgba(8,8,16,.9);backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.08);border-right:none;border-radius:10px 0 0 10px;padding:8px 10px;width:58px;overflow:hidden;transition:width .3s ease,border-color .25s}
.sw-card:hover{width:178px;border-color:rgba(217,48,37,.35)}
.sw-inner{white-space:nowrap;display:flex;flex-direction:column;gap:2px}
.sw-lbl{font-size:7px;color:#8888aa;letter-spacing:2px;text-transform:uppercase}
.sw-big{font-family:"Bebas Neue",sans-serif;font-size:18px;color:#fff;letter-spacing:2px;line-height:1}
.sw-sm{font-size:8px;color:#8888aa}
.sw-row{display:flex;align-items:center;gap:5px}
.sw-ic{font-size:18px;line-height:1}
.sw-tmp{font-size:12px;font-weight:600;color:#f5c518}
.sw-dsc{font-size:9px;color:#8888aa;max-width:110px;overflow:hidden;text-overflow:ellipsis}
@media(max-width:900px){.sw-wrap{display:none}}

/* ── BARRA MÓVIL ── */
.mob-bar{display:none;position:fixed;top:73px;left:0;right:0;z-index:90;background:rgba(8,8,16,.95);backdrop-filter:blur(10px);border-bottom:1px solid rgba(255,255,255,.06);padding:5px 14px;flex-direction:row;align-items:center;justify-content:space-between;overflow-x:auto;gap:8px}
.mob-cell{display:flex;align-items:center;gap:4px;flex-shrink:0}
.mob-ic{font-size:13px}
.mob-txt{display:flex;flex-direction:column;line-height:1.2}
.mob-val{font-size:11px;font-weight:600;color:#fff}
.mob-lbl{font-size:8px;color:#8888aa}
@media(max-width:900px){.mob-bar{display:flex}.flag-bar{top:108px}}

/* ── GALERÍA FLASH ── */
.gal-sec{position:relative;z-index:1;padding:0 40px 60px}
.gal-stage{position:relative;border-radius:20px;overflow:hidden;aspect-ratio:16/7;max-height:460px;background:#0f0f1e;cursor:pointer}
.gal-slide{position:absolute;inset:0;opacity:0;transition:opacity .65s ease,transform .7s ease;transform:scale(1.04);will-change:opacity,transform}
.gal-slide.on{opacity:1;transform:scale(1)}
.gal-slide img{width:100%;height:100%;object-fit:cover;object-position:center top;display:block}
.gal-ov{position:absolute;inset:0;background:linear-gradient(to top,rgba(8,8,16,.82) 0%,rgba(8,8,16,.1) 45%,transparent 70%);display:flex;flex-direction:column;justify-content:flex-end;padding:22px 26px}
.gal-badge{display:inline-flex;align-items:center;gap:6px;background:rgba(217,48,37,.82);border-radius:20px;padding:4px 12px;font-size:10px;color:#fff;letter-spacing:1px;text-transform:uppercase;width:fit-content;margin-bottom:8px}
.gal-cap{font-size:16px;font-weight:600;color:#fff;line-height:1.3}
.gal-btn{position:absolute;top:50%;transform:translateY(-50%);background:rgba(8,8,16,.55);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.12);border-radius:50%;width:44px;height:44px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:20px;color:#fff;transition:all .2s;z-index:10}
.gal-btn:hover{background:var(--rojo);transform:translateY(-50%) scale(1.1)}
.gal-prev{left:14px}.gal-next{right:14px}
.gal-dots{position:absolute;bottom:14px;left:50%;transform:translateX(-50%);display:flex;gap:6px;z-index:10}
.gal-dot{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.35);cursor:pointer;border:none;transition:all .3s}
.gal-dot.on{width:22px;border-radius:3px;background:#fff}
.gal-thumbs{display:grid;grid-template-columns:repeat(auto-fill,minmax(86px,1fr));gap:8px;margin-top:12px}
.gal-thumb{aspect-ratio:1;border-radius:10px;overflow:hidden;cursor:pointer;border:2px solid transparent;transition:all .25s}
.gal-thumb img{width:100%;height:100%;object-fit:cover;object-position:center top;transition:transform .3s}
.gal-thumb:hover img{transform:scale(1.08)}
.gal-thumb.on{border-color:var(--rojo)}
@media(max-width:640px){.gal-sec{padding:0 16px 48px}.gal-stage{aspect-ratio:4/3;max-height:270px}.gal-cap{font-size:13px}.gal-thumbs{grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:5px}}

/* ── TICKER DE NOTICIAS ── */
.ticker-bar{background:var(--rojo);padding:6px 0;overflow:hidden;position:relative;z-index:89}
.ticker-inner{display:flex;align-items:center;white-space:nowrap;animation:ticker 40s linear infinite}
.ticker-inner:hover{animation-play-state:paused}
.ticker-label{background:rgba(0,0,0,.3);color:#fff;font-size:11px;font-weight:700;letter-spacing:2px;padding:2px 14px;margin-right:20px;flex-shrink:0;text-transform:uppercase;border-radius:3px}
.ticker-item{font-size:12px;color:#fff;padding-right:40px;flex-shrink:0}
.ticker-sep{color:rgba(255,255,255,.5);padding-right:40px;flex-shrink:0}
@keyframes ticker{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}

/* ── COTIZACIÓN DÓLAR ── */
.dolar-bar{background:rgba(8,8,16,.98);border-bottom:1px solid rgba(255,255,255,.06);padding:8px 40px;display:flex;align-items:center;gap:20px;overflow-x:auto;position:relative;z-index:88}
.dolar-item{display:flex;align-items:center;gap:8px;flex-shrink:0}
.dolar-label{font-size:10px;color:#8888aa;letter-spacing:1px;text-transform:uppercase}
.dolar-val{font-family:"Bebas Neue",sans-serif;font-size:18px;color:#f5c518;letter-spacing:1px}
.dolar-ref{font-size:10px;color:#8888aa}
.dolar-sep{width:1px;height:28px;background:rgba(255,255,255,.08);flex-shrink:0}
.dolar-update{font-size:9px;color:#555;margin-left:auto;flex-shrink:0}
@media(max-width:640px){.dolar-bar{padding:6px 16px}}

/* ── TABS NOTICIAS ── */
.ntabs{display:flex;gap:8px;margin-bottom:20px;flex-wrap:wrap}
.ntab{background:var(--card);border:1px solid var(--borde);border-radius:20px;padding:7px 18px;font-size:12px;font-weight:500;color:var(--gris);cursor:pointer;transition:all .2s;font-family:"DM Sans",sans-serif}
.ntab.on{color:#fff;border-color:transparent}
.ntab.dep.on{background:#1565c0}
.ntab.far.on{background:#6a1b9a}
.ntab.cul.on{background:#2e7d32}
.ntab.int.on{background:var(--rojo)}
.npanel{display:none}.npanel.on{display:block}
.news-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}
.news-card{background:var(--card);border:1px solid var(--borde);border-radius:14px;overflow:hidden;text-decoration:none;display:block;transition:border-color .2s,transform .2s}
.news-card:hover{transform:translateY(-4px);border-color:#333355}
.news-cat-bar{height:3px;width:100%}
.news-img{width:100%;height:110px;overflow:hidden;background:#0a0a18;display:flex;align-items:center;justify-content:center;font-size:32px}
.news-img img{width:100%;height:100%;object-fit:cover}
.news-body{padding:12px}
.news-cat{font-size:9px;letter-spacing:2px;text-transform:uppercase;font-weight:700;margin-bottom:4px}
.news-ttl{font-size:13px;font-weight:600;color:#fff;line-height:1.4;margin-bottom:4px}
.news-date{font-size:10px;color:var(--gris)}
.news-spinner{text-align:center;padding:40px;grid-column:1/-1}
.news-spin{width:24px;height:24px;border:2px solid var(--borde);border-top-color:var(--rojo);border-radius:50%;animation:spin .8s linear infinite;margin:0 auto 10px}

/* ── CONDUCTORES ── */
.dj-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px}
.dj-card{background:var(--card);border:1px solid var(--borde);border-radius:20px;overflow:hidden;transition:border-color .2s,transform .2s}
.dj-card:hover{border-color:rgba(217,48,37,.4);transform:translateY(-4px)}
.dj-header{position:relative;height:180px;overflow:hidden;background:linear-gradient(135deg,#1a0a0a,#0f0f1e)}
.dj-avatar{width:100%;height:100%;object-fit:cover;object-position:center top}
.dj-avatar-ph{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:64px}
.dj-on-air{position:absolute;top:12px;right:12px;background:var(--rojo);color:#fff;font-size:9px;font-weight:700;letter-spacing:2px;padding:3px 10px;border-radius:20px;text-transform:uppercase}
.dj-flag{position:absolute;bottom:0;left:0;right:0;height:3px;display:flex}
.dj-flag-r{flex:1;background:#d93025}.dj-flag-y{flex:1;background:#f5c518}.dj-flag-g{flex:1;background:#2e7d32}
.dj-body{padding:20px}
.dj-name{font-family:"Bebas Neue",sans-serif;font-size:26px;letter-spacing:2px;color:#fff;margin-bottom:4px}
.dj-rol{font-size:12px;color:var(--rojo);font-weight:600;letter-spacing:1px;text-transform:uppercase;margin-bottom:10px}
.dj-horario{display:flex;align-items:center;gap:8px;background:rgba(217,48,37,.08);border:1px solid rgba(217,48,37,.15);border-radius:10px;padding:8px 12px;margin-bottom:12px}
.dj-hico{font-size:16px}
.dj-htext{font-size:12px;color:var(--gris2)}
.dj-prog{font-size:11px;color:var(--gris)}
.dj-bio{font-size:13px;color:var(--gris);line-height:1.6}

/* ── DEDICATORIAS ── */
.ded-section{position:relative;z-index:1;padding:0 40px 60px}
.ded-card{background:linear-gradient(135deg,rgba(217,48,37,.08),rgba(245,197,24,.04));border:1px solid rgba(217,48,37,.2);border-radius:20px;padding:36px;display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:center}

.ded-title{font-family:"Bebas Neue",sans-serif;font-size:38px;letter-spacing:3px;color:#fff;margin-bottom:8px;line-height:1}
.ded-sub{font-size:14px;color:var(--gris);line-height:1.7;margin-bottom:24px}
.ded-steps{display:flex;flex-direction:column;gap:12px}
.ded-step{display:flex;align-items:center;gap:12px}
.ded-num{width:28px;height:28px;border-radius:50%;background:var(--rojo);color:#fff;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.ded-step-text{font-size:13px;color:var(--gris2)}
.ded-actions{display:flex;flex-direction:column;gap:12px}
.ded-btn{display:flex;align-items:center;justify-content:center;gap:10px;border-radius:14px;padding:16px 24px;font-size:14px;font-weight:600;cursor:pointer;text-decoration:none;font-family:"DM Sans",sans-serif;transition:all .2s}
.ded-wa{background:linear-gradient(135deg,#25d366,#128c7e);color:#fff}
.ded-wa:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(37,211,102,.3)}
.ded-fb{background:linear-gradient(135deg,#1877f2,#0a5bc4);color:#fff}
.ded-fb:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(24,119,242,.3)}
.ded-note{font-size:11px;color:var(--gris);text-align:center;margin-top:8px;font-style:italic}
@media(max-width:768px){.ded-card{grid-template-columns:1fr}.ded-section{padding:0 20px 48px}}

/* ===== bloque 2 ===== */

/* ════════════════════════════════════════════════════════════
   VARIABLES CORPORATIVAS
   Personaliza aquí sin tocar el resto del código:
   ════════════════════════════════════════════════════════════ */
:root {
  --rlp-primary:        #d93025;            /* Color corporativo principal    */
  --rlp-secondary:      #f5c518;            /* Color corporativo secundario   */
  --rlp-primary-glow:   rgba(217,48,37,.35);/* Brillo del primary             */
  --rlp-secondary-glow: rgba(245,197,24,.2);/* Brillo del secondary           */
  --rlp-bg:             rgba(8,8,18,.82);   /* Fondo del cristal              */
  --rlp-glass:          rgba(255,255,255,.07);
  --rlp-border:         rgba(255,255,255,.13);
  --rlp-text:           #ffffff;
  --rlp-subtext:        rgba(255,255,255,.6);
  --rlp-blur:           18px;
  /* Tamaños fluidos: se adaptan solos de celular a escritorio */
  --rlp-size:           clamp(52px, 4.2vw, 64px);   /* Círculo en reposo      */
  --rlp-width:          clamp(220px, 24vw, 300px);  /* Ancho al expandirse    */
  --rlp-bottom:         clamp(14px, 2.2vw, 28px);   /* Separación del borde   */
  --rlp-right:          clamp(12px, 2.2vw, 28px);
  --rlp-z:              99999;
  --rlp-ease:           cubic-bezier(.23,1,.32,1);
}

/* ── RESET aislado: no afecta estilos globales ── */
.rlp-wrap, .rlp-wrap * {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  -webkit-tap-highlight-color: transparent;
}

/* ════ CONTENEDOR FIJO ════ */
.rlp-wrap {
  position: fixed;
  bottom: var(--rlp-bottom);
  right: var(--rlp-right);
  z-index: var(--rlp-z);
  font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
  /* Evitar que tape el contenido haciendo hover fuera */
  pointer-events: none;
}
.rlp-wrap > * { pointer-events: auto; }

/* ════ CÁPSULA PRINCIPAL ════ */
.rlp-capsule {
  position: relative;
  display: flex;
  align-items: center;
  overflow: hidden;
  cursor: pointer;
  user-select: none;

  /* Glassmorphism */
  background: var(--rlp-bg);
  backdrop-filter: blur(var(--rlp-blur)) saturate(180%);
  -webkit-backdrop-filter: blur(var(--rlp-blur)) saturate(180%);
  border: 1px solid var(--rlp-border);
  border-radius: 999px;

  /* Sombra base */
  box-shadow:
    0 8px 32px rgba(0,0,0,.5),
    0 2px 8px  rgba(0,0,0,.3),
    inset 0 1px 0 rgba(255,255,255,.1),
    inset 0 -1px 0 rgba(0,0,0,.2);

  /* FORMA INICIAL: círculo */
  width:  var(--rlp-size);
  height: var(--rlp-size);
  min-width: var(--rlp-size);

  transition:
    width .5s var(--rlp-ease),
    border-color .4s ease,
    box-shadow .4s ease;
}

/* Borde degradado animado (pseudo-elemento) */
.rlp-capsule::before {
  content: '';
  position: absolute;
  inset: -1px;
  border-radius: 999px;
  background: conic-gradient(
    from 0deg,
    var(--rlp-primary),
    var(--rlp-secondary),
    var(--rlp-primary)
  );
  opacity: 0;
  z-index: 0;
  transition: opacity .4s ease;
  animation: rlp-border-spin 4s linear infinite;
}
.rlp-capsule::after {
  content: '';
  position: absolute;
  inset: 1px;
  border-radius: 999px;
  background: var(--rlp-bg);
  z-index: 1;
}
@keyframes rlp-border-spin { to { transform: rotate(360deg); } }

/* ── Estado PLAYING ── */
.rlp-wrap.is-playing .rlp-capsule {
  width: var(--rlp-width);
  border-color: transparent;
  box-shadow:
    0 8px 32px rgba(0,0,0,.5),
    0 0 0 1px var(--rlp-primary),
    0 0 30px var(--rlp-primary-glow),
    0 0 70px var(--rlp-primary-glow),
    0 0 120px rgba(217,48,37,.08),
    inset 0 1px 0 rgba(255,255,255,.1);
}
.rlp-wrap.is-playing .rlp-capsule::before { opacity: 1; }

/* ════ ANILLOS DE PULSO (estado reposo) ════ */
.rlp-ring {
  position: absolute;
  inset: -1px;
  border-radius: 50%;
  border: 2px solid var(--rlp-primary);
  animation: rlp-pulse 2.8s ease-out infinite;
  pointer-events: none;
  z-index: 10;
}
.rlp-ring:nth-child(2) {
  animation-delay: .9s;
  border-color: var(--rlp-secondary);
}
@keyframes rlp-pulse {
  0%   { transform:scale(.88); opacity:.9; }
  100% { transform:scale(1.7); opacity:0;  }
}
.rlp-wrap.is-playing  .rlp-ring,
.rlp-wrap.is-loading  .rlp-ring { opacity:0; animation-play-state:paused; }

/* ════ BOTÓN PLAY/PAUSE ════ */
.rlp-btn {
  position: relative;
  z-index: 5;
  flex-shrink: 0;
  width: var(--rlp-size);
  height: var(--rlp-size);
  border: none;
  background: transparent;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  outline: none;
  transition: transform .2s ease;
}
.rlp-btn:hover  { transform: scale(1.08); }
.rlp-btn:active { transform: scale(0.94); }

/* Íconos SVG */
.rlp-ico {
  position: absolute;
  width: 24px; height: 24px;
  fill: var(--rlp-text);
  transition: opacity .25s ease, transform .25s ease;
}
.rlp-ico-play  { opacity:1;  transform:scale(1)    translateX(1px); }
.rlp-ico-pause { opacity:0;  transform:scale(.5); }
.rlp-ico-load  { opacity:0;  }

/* Play → activo */
.rlp-wrap.is-playing .rlp-ico-play  { opacity:0;  transform:scale(.5); }
.rlp-wrap.is-playing .rlp-ico-pause { opacity:1;  transform:scale(1); }
/* Cargando */
.rlp-wrap.is-loading .rlp-ico-play  { opacity:0; }
.rlp-wrap.is-loading .rlp-ico-load  {
  opacity:.85;
  animation: rlp-spin .75s linear infinite;
}
@keyframes rlp-spin { to { transform: rotate(360deg); } }

/* ════ PANEL DE INFORMACIÓN (expandido) ════ */
.rlp-info {
  position: relative;
  z-index: 5;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 0 18px 0 2px;
  opacity: 0;
  transform: translateX(-12px);
  transition:
    opacity .3s ease .2s,
    transform .3s ease .2s;
  pointer-events: none;
  white-space: nowrap;
  overflow: hidden;
}
.rlp-wrap.is-playing .rlp-info {
  opacity: 1;
  transform: translateX(0);
  pointer-events: auto;
}

/* ── Ecualizador ── */
.rlp-eq {
  display: flex;
  align-items: flex-end;
  gap: 3px;
  height: 22px;
  flex-shrink: 0;
}
.rlp-eq-bar {
  width: 3px;
  border-radius: 2px 2px 0 0;
  background: linear-gradient(to top, var(--rlp-primary) 0%, var(--rlp-secondary) 100%);
  transform-origin: bottom;
}
/* Pausa = barras bajas */
.rlp-wrap:not(.is-playing) .rlp-eq-bar {
  height: 3px !important;
  animation: none !important;
}
/* Animación EQ cuando suena */
.rlp-eq-bar:nth-child(1) { animation: rlp-eq-a .8s  ease-in-out .0s  infinite; }
.rlp-eq-bar:nth-child(2) { animation: rlp-eq-b .65s ease-in-out .12s infinite; }
.rlp-eq-bar:nth-child(3) { animation: rlp-eq-c 1.0s ease-in-out .05s infinite; }
.rlp-eq-bar:nth-child(4) { animation: rlp-eq-b .75s ease-in-out .28s infinite; }
.rlp-eq-bar:nth-child(5) { animation: rlp-eq-a .55s ease-in-out .18s infinite; }
.rlp-eq-bar:nth-child(6) { animation: rlp-eq-c .9s  ease-in-out .35s infinite; }
@keyframes rlp-eq-a { 0%,100%{ height:4px  } 50%{ height:20px } }
@keyframes rlp-eq-b { 0%,100%{ height:10px } 50%{ height:18px } }
@keyframes rlp-eq-c { 0%,100%{ height:16px } 50%{ height:4px  } }

/* ── Textos ── */
.rlp-texts { display:flex; flex-direction:column; gap:2px; }
.rlp-name {
  font-size: 13px; font-weight: 700;
  color: var(--rlp-text); letter-spacing: .4px;
}
.rlp-live {
  display: flex; align-items: center; gap: 5px;
  font-size: 10px; font-weight: 700;
  color: var(--rlp-secondary);
  letter-spacing: 1.5px; text-transform: uppercase;
}
.rlp-live-dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--rlp-primary);
  animation: rlp-blink 1.4s ease-in-out infinite;
}
@keyframes rlp-blink { 0%,100%{opacity:1} 50%{opacity:.25} }

/* ════ TOOLTIP (reposo) ════ */
.rlp-tooltip {
  background: rgba(8,8,18,.95);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid var(--rlp-border);
  border-radius: 10px;
  padding: 7px 14px;
  font-size: 12px;
  color: var(--rlp-subtext);
  white-space: nowrap;
  opacity: 0;
  transform: translateY(6px) scale(.95);
  transition: opacity .22s ease, transform .22s ease;
  pointer-events: none;
}
.rlp-wrap:not(.is-playing):not(.is-loading):hover .rlp-tooltip {
  opacity: 1;
  transform: translateY(0) scale(1);
}
.rlp-wrap.is-playing .rlp-tooltip { display: none; }

/* ════ TOAST DE ERROR ════ */
.rlp-toast {
  background: rgba(8,8,18,.97);
  border: 1px solid rgba(217,48,37,.5);
  border-radius: 10px;
  padding: 8px 14px;
  font-size: 11px;
  color: #ff9090;
  white-space: nowrap;
  opacity: 0;
  transform: translateY(6px);
  transition: opacity .25s ease, transform .25s ease;
  pointer-events: none;
}
.rlp-wrap.has-error .rlp-toast {
  opacity: 1;
  transform: translateY(0);
}

/* ════ RESPONSIVE MOBILE ════ */
@media (max-width: 480px) {
  :root {
    --rlp-size:   52px;
    --rlp-width:  260px;
    --rlp-bottom: 20px;
    --rlp-right:  16px;
  }
}

/* ═══════════════════════════════════════════════════════════
   REPRODUCTOR DE LA PORTADA
   ═══════════════════════════════════════════════════════════ */
#rlb-hero-player{position:relative}

.play-btn{position:relative;overflow:hidden}
.hp-ico-play,.hp-ico-pause,.hp-ico-spin{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;transition:opacity .18s,transform .18s}
.hp-ico-play{opacity:1}
.hp-ico-pause,.hp-ico-spin{opacity:0}

.hp-ico-play::before{content:"";width:0;height:0;border-top:10px solid transparent;border-bottom:10px solid transparent;border-left:17px solid #fff;margin-left:4px}
.hp-ico-pause::before{content:"";width:16px;height:18px;border-left:5px solid #fff;border-right:5px solid #fff}
.hp-ico-spin::before{content:"";width:20px;height:20px;border:2.5px solid rgba(255,255,255,.28);border-top-color:#fff;border-radius:50%;animation:hpspin .7s linear infinite}
@keyframes hpspin{to{transform:rotate(360deg)}}

#rlb-hero-player.is-playing .hp-ico-play{opacity:0;transform:scale(.7)}
#rlb-hero-player.is-playing .hp-ico-pause{opacity:1}
#rlb-hero-player.is-loading .hp-ico-play,
#rlb-hero-player.is-loading .hp-ico-pause{opacity:0}
#rlb-hero-player.is-loading .hp-ico-spin{opacity:1}
#rlb-hero-player.is-playing .play-btn{background:var(--rojo-d);box-shadow:0 0 0 0 rgba(217,48,37,.55);animation:hppulse 2.1s ease-out infinite}
@keyframes hppulse{70%{box-shadow:0 0 0 16px rgba(217,48,37,0)}100%{box-shadow:0 0 0 0 rgba(217,48,37,0)}}

.player-now{display:flex;align-items:center;gap:6px}
.hp-live-dot{width:6px;height:6px;border-radius:50%;background:#555;flex-shrink:0;transition:background .3s}
#rlb-hero-player.is-playing .hp-live-dot{background:var(--rojo);box-shadow:0 0 8px var(--rojo);animation:hpblink 1.4s ease-in-out infinite}
@keyframes hpblink{50%{opacity:.35}}

/* Visualizador: quieto en pausa, animado al sonar */
.visualizer{gap:3px;height:30px;margin-bottom:16px}
.vbar{width:4px;height:6px;background:linear-gradient(180deg,var(--rojo),var(--amarillo));opacity:.35;border-radius:3px;animation:none!important;transition:opacity .3s}
.visualizer.on .vbar{opacity:.9}
.visualizer.on .vb1 {animation:vw .90s ease-in-out infinite!important}
.visualizer.on .vb2 {animation:vw .78s .06s ease-in-out infinite!important}
.visualizer.on .vb3 {animation:vw 1.02s .12s ease-in-out infinite!important}
.visualizer.on .vb4 {animation:vw .84s .18s ease-in-out infinite!important}
.visualizer.on .vb5 {animation:vw .96s .24s ease-in-out infinite!important}
.visualizer.on .vb6 {animation:vw .72s .30s ease-in-out infinite!important}
.visualizer.on .vb7 {animation:vw 1.08s .36s ease-in-out infinite!important}
.visualizer.on .vb8 {animation:vw .88s .42s ease-in-out infinite!important}
.visualizer.on .vb9 {animation:vw .94s .48s ease-in-out infinite!important}
.visualizer.on .vb10{animation:vw .80s .54s ease-in-out infinite!important}
.visualizer.on .vb11{animation:vw 1.00s .60s ease-in-out infinite!important}
.visualizer.on .vb12{animation:vw .86s .66s ease-in-out infinite!important}
@keyframes vw{0%,100%{height:6px}50%{height:28px}}

/* Controles */
.hp-controls{display:flex;align-items:center;gap:12px}
.hp-mute{background:none;border:none;cursor:pointer;font-size:17px;line-height:1;padding:4px;border-radius:8px;flex-shrink:0;transition:background .2s}
.hp-mute:hover{background:rgba(255,255,255,.07)}

.hp-vol{--fill:85%;flex:1;height:5px;min-width:0;-webkit-appearance:none;appearance:none;background:linear-gradient(90deg,var(--rojo) 0,var(--rojo) var(--fill),rgba(255,255,255,.13) var(--fill),rgba(255,255,255,.13) 100%);border-radius:4px;cursor:pointer;outline:none}
.hp-vol::-webkit-slider-thumb{-webkit-appearance:none;width:15px;height:15px;border-radius:50%;background:#fff;border:2px solid var(--rojo);cursor:pointer;box-shadow:0 1px 5px rgba(0,0,0,.45)}
.hp-vol::-moz-range-thumb{width:15px;height:15px;border-radius:50%;background:#fff;border:2px solid var(--rojo);cursor:pointer;box-shadow:0 1px 5px rgba(0,0,0,.45)}
.hp-vol:focus-visible{box-shadow:0 0 0 3px rgba(217,48,37,.35)}

.hp-alt{font-size:11px;color:var(--gris);text-decoration:none;white-space:nowrap;padding:5px 10px;border:1px solid var(--borde);border-radius:8px;flex-shrink:0;transition:color .2s,border-color .2s}
.hp-alt:hover{color:var(--gris2);border-color:#333}

.hp-msg{font-size:11px;color:var(--amarillo);text-align:center;max-height:0;opacity:0;overflow:hidden;transition:max-height .3s,opacity .3s,margin-top .3s}
.hp-msg.on{max-height:40px;opacity:1;margin-top:10px}

/* ═══════════════════════════════════════════════════════════
   REPRODUCTOR UCH — "Un Día Como Hoy en la Historia"
   ═══════════════════════════════════════════════════════════ */
.uch-player-wrap{margin-bottom:16px}

.uchp{display:flex;align-items:center;gap:14px;background:linear-gradient(135deg,rgba(217,48,37,.10),rgba(245,197,24,.05));border:1px solid rgba(217,48,37,.26);border-radius:14px;padding:16px 18px;transition:border-color .3s,box-shadow .3s}
.uchp.is-playing{border-color:rgba(245,197,24,.45);box-shadow:0 0 26px rgba(217,48,37,.16)}

.uchp-btn{width:54px;height:54px;border-radius:50%;background:var(--rojo);border:none;cursor:pointer;flex-shrink:0;position:relative;box-shadow:0 0 20px rgba(217,48,37,.34);transition:transform .15s,background .2s}
.uchp-btn:hover{background:var(--rojo-d);transform:scale(1.06)}
.uchp-btn:focus-visible{outline:2px solid var(--amarillo);outline-offset:3px}

.uchp-ico-play,.uchp-ico-pause,.uchp-ico-spin{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;transition:opacity .18s}
.uchp-ico-pause,.uchp-ico-spin{opacity:0}
.uchp-ico-play::before{content:"";width:0;height:0;border-top:10px solid transparent;border-bottom:10px solid transparent;border-left:17px solid #fff;margin-left:4px}
.uchp-ico-pause::before{content:"";width:15px;height:17px;border-left:5px solid #fff;border-right:5px solid #fff}
.uchp-ico-spin::before{content:"";width:20px;height:20px;border:2.5px solid rgba(255,255,255,.28);border-top-color:#fff;border-radius:50%;animation:hpspin .7s linear infinite}
.uchp.is-playing .uchp-ico-play{opacity:0}
.uchp.is-playing .uchp-ico-pause{opacity:1}
.uchp.is-loading .uchp-ico-play,.uchp.is-loading .uchp-ico-pause{opacity:0}
.uchp.is-loading .uchp-ico-spin{opacity:1}

.uchp-body{flex:1;min-width:0}
.uchp-title{font-size:14px;font-weight:600;color:#fff;margin-bottom:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.uchp-bar{position:relative;height:6px;background:rgba(255,255,255,.12);border-radius:4px;cursor:pointer;margin-bottom:7px;touch-action:none}
.uchp-bar:focus-visible{outline:2px solid var(--amarillo);outline-offset:4px}
.uchp-buf{position:absolute;inset:0 auto 0 0;width:0;background:rgba(255,255,255,.16);border-radius:4px}
.uchp-prog{position:absolute;inset:0 auto 0 0;width:0;background:linear-gradient(90deg,var(--rojo),var(--amarillo));border-radius:4px}
.uchp-knob{position:absolute;right:-6px;top:50%;transform:translateY(-50%);width:13px;height:13px;border-radius:50%;background:#fff;box-shadow:0 1px 5px rgba(0,0,0,.5);opacity:0;transition:opacity .2s}
.uchp:hover .uchp-knob,.uchp.is-playing .uchp-knob{opacity:1}

.uchp-times{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:11px;color:var(--gris);font-variant-numeric:tabular-nums}
.uchp-sub{flex:1;text-align:center;color:#666;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.uchp-extra{display:flex;flex-direction:column;gap:5px;flex-shrink:0}
.uchp-mini{background:rgba(255,255,255,.06);border:1px solid var(--borde);color:var(--gris2);border-radius:7px;padding:5px 8px;font-size:10px;cursor:pointer;font-family:"DM Sans",sans-serif;white-space:nowrap;transition:background .2s,color .2s}
.uchp-mini:hover{background:rgba(255,255,255,.12);color:#fff}
.uchp-speed{font-variant-numeric:tabular-nums;min-width:38px}

#uch-iframe{width:100%;height:70px;border:none;border-radius:10px;background:#000}

.uch-vacio{text-align:center;padding:26px 16px}
.uch-vacio-ico{font-size:32px;margin-bottom:10px}
.uch-vacio-t{font-size:14px;color:var(--gris2);margin-bottom:4px}
.uch-vacio-s{font-size:12px;color:var(--gris)}

/* ═══════════════════════════════════════════════════════════
   AJUSTES PARA CELULAR
   ═══════════════════════════════════════════════════════════ */
@media(max-width:768px){
  .player-container{padding:18px 16px;max-width:100%;border-radius:16px}
  .play-btn{width:56px;height:56px}          /* área de toque cómoda */
  .player-show{font-size:14px}
  .visualizer{height:26px;gap:3px}
  .visualizer .vb9,.visualizer .vb10,
  .visualizer .vb11,.visualizer .vb12{display:none}
  @keyframes vw{0%,100%{height:5px}50%{height:24px}}

  .hp-controls{gap:10px}
  .hp-mute{font-size:19px;padding:7px}
  .hp-vol{height:7px}
  .hp-vol::-webkit-slider-thumb{width:19px;height:19px}
  .hp-vol::-moz-range-thumb{width:19px;height:19px}
  .hp-alt{display:none}                      /* se gana ancho para el volumen */

  /* El reproductor UCH pasa a dos filas */
  .uchp{flex-wrap:wrap;gap:12px;padding:14px}
  .uchp-body{order:3;flex:1 0 100%;width:100%}
  .uchp-btn{width:52px;height:52px}
  .uchp-extra{flex-direction:row;margin-left:auto}
  .uchp-mini{padding:8px 11px;font-size:11px}
  .uchp-bar{height:8px}
  .uchp-knob{opacity:1;width:15px;height:15px;right:-7px}
  .uchp-title{font-size:13px;white-space:normal}
  .uchp-times{font-size:10px}
}

@media(max-width:400px){
  .uchp-extra .uchp-speed{display:none}
  .player-container{padding:16px 13px}
  .uchp-sub{display:none}
}

/* Pantallas grandes: el reproductor respira un poco más */
@media(min-width:1200px){
  .player-container{max-width:540px}
}

/* Respeta a quien pidió menos animación en su sistema */
@media(prefers-reduced-motion:reduce){
  .visualizer.on .vbar{animation:none!important;height:14px}
  #rlb-hero-player.is-playing .play-btn{animation:none}
  #rlb-hero-player.is-playing .hp-live-dot{animation:none}
}


/* ═══════════════════════════════════════════════════════════
   REPRODUCTOR FLOTANTE — ajustes de tamaño y seguridad
   ═══════════════════════════════════════════════════════════ */

/* Se respeta la zona segura del iPhone (barra de gestos) */
.rlp-wrap{
  bottom:calc(var(--rlp-bottom) + env(safe-area-inset-bottom, 0px));
  right:calc(var(--rlp-right) + env(safe-area-inset-right, 0px));
}

/* Nunca más ancho que la pantalla */
.rlp-capsule{max-width:calc(100vw - (var(--rlp-right) * 2))}

/* ── CELULAR ──
   En pantallas chicas la cápsula queda siempre expandida: el usuario
   ve de una que es la radio, sin depender del hover que no existe. */
@media(max-width:768px){
  .rlp-capsule{
    width:var(--rlp-width);
    padding-right:14px;
  }
  .rlp-info{
    opacity:1;
    max-width:none;
    pointer-events:auto;
  }
  .rlp-tooltip{display:none}          /* no hay hover en táctil */
  .rlp-name{font-size:13px}
  .rlp-live{font-size:10px}
}

/* Celulares angostos: solo el círculo, para no tapar el contenido */
@media(max-width:420px){
  :root{
    --rlp-size:54px;
    --rlp-width:200px;
  }
  .rlp-capsule{width:var(--rlp-size);padding-right:0}
  .rlp-wrap.is-playing .rlp-capsule{width:var(--rlp-width);padding-right:12px}
  .rlp-info{opacity:0;max-width:0}
  .rlp-wrap.is-playing .rlp-info{opacity:1;max-width:none}
}

/* Pantalla apaisada y baja (celular de costado): más pegado al borde */
@media(max-height:480px) and (orientation:landscape){
  :root{--rlp-size:46px;--rlp-bottom:10px;--rlp-right:10px}
  .rlp-capsule{width:var(--rlp-size);padding-right:0}
  .rlp-info{display:none}
}

/* Monitores grandes: un poco más de presencia */
@media(min-width:1600px){
  :root{--rlp-size:66px;--rlp-width:315px}
}

/* Área de toque mínima real, aunque el círculo se vea chico */
.rlp-capsule{min-height:44px}

/* Que la barra de admin de WordPress no lo tape en móvil */
body.admin-bar .rlp-wrap{z-index:99999}