/*
Theme Name: The Beerman Club
Theme URI: https://thebeermanclub.com
Author: The Beerman Club
Author URI: https://thebeermanclub.com
Description: Tema real de The Beerman Club — bar virtual de Rock independiente. Construido a partir del diseño aprobado (maquetas Artifact).
Version: 1.4.33
Requires at least: 6.4
Requires PHP: 7.4
Text Domain: beermanclub
*/

@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Karla:ital,wght@0,400;0,500;0,700;1,400&family=Space+Mono:wght@400;700&display=swap');

:root{
  --ink:#14100d;
  --ink-2:#1e1712;
  --ink-3:#271d16;
  --brick:#9a3f27;
  --brick-deep:#5c2416;
  --neon:#f5c433;
  --amber:#e08a34;
  --cream:#f3ead9;
  --cream-dim:#b9a98d;
  --line:rgba(201,143,74,0.16);
  --focus:#ffe083;
  --brass:#c98f4a;
  --brass-dim:rgba(201,143,74,0.35);
}

*{box-sizing:border-box;}
html{color-scheme:dark;}
body{
  margin:0;
  background:var(--ink);
  color:var(--cream);
  font-family:'Karla',ui-sans-serif,system-ui,sans-serif;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;display:block;}

h1,h2,h3,.display{
  font-family:'Bebas Neue',ui-sans-serif,system-ui,sans-serif;
  letter-spacing:0.03em;
  font-weight:400;
  text-wrap:balance;
  line-height:0.95;
  margin:0;
}
.mono{font-family:'Space Mono',ui-monospace,monospace;}
a{color:inherit;}
:focus-visible{outline:2px solid var(--focus); outline-offset:3px;}
@media (prefers-reduced-motion: reduce){
  *{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important;}
}

/* texture */
.grain{
  position:fixed; inset:0; pointer-events:none; z-index:2; opacity:0.05; mix-blend-mode:overlay;
  background-image:
    radial-gradient(circle at 20% 30%, #fff 0.5px, transparent 0.5px),
    radial-gradient(circle at 70% 60%, #fff 0.5px, transparent 0.5px),
    radial-gradient(circle at 40% 80%, #fff 0.5px, transparent 0.5px);
  background-size: 3px 3px, 5px 5px, 4px 4px;
}
.wood-grain{
  position:fixed; inset:0; pointer-events:none; z-index:1; opacity:0.16; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='300' height='300'><filter id='w'><feTurbulence type='fractalNoise' baseFrequency='0.012 0.19' numOctaves='3' seed='7' result='n'/><feColorMatrix in='n' type='matrix' values='0 0 0 0 0.62  0 0 0 0 0.42  0 0 0 0 0.22  0 0 0 0.55 0'/></filter><rect width='100%' height='100%' filter='url(%23w)'/></svg>");
  background-size:280px 280px;
}

.ornament-divider{display:flex; align-items:center; justify-content:center; gap:16px; padding:34px 24px; max-width:1180px; margin:0 auto;}
.ornament-divider .odl{flex:1; max-width:220px; height:1px; background:linear-gradient(90deg, transparent, var(--brass-dim));}
.ornament-divider .odl.right{background:linear-gradient(90deg, var(--brass-dim), transparent);}
.ornament-medal{width:46px; height:46px; object-fit:contain; opacity:0.95; filter:drop-shadow(0 3px 8px rgba(0,0,0,0.55));}
@media (max-width:600px){ .ornament-divider .odl{max-width:70px;} }

.wrap{max-width:1180px; margin:0 auto; padding:0 24px;}

/* ---------- NAV ---------- */
header.site{
  position:sticky; top:0; z-index:10;
  background:
    linear-gradient(180deg, rgba(20,16,13,0.68) 0%, rgba(20,16,13,0.82) 55%, rgba(20,16,13,0.92) 100%),
    url("assets/img/wood-bg.jpg") center 25% / cover no-repeat,
    var(--ink);
  border-bottom:1px solid var(--line);
  backdrop-filter:blur(6px);
}
.nav{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;
  padding:3px 24px; max-width:1180px; margin:0 auto;
}
.nav-right{display:flex; align-items:center; gap:2px; flex:none; margin-left:28px;}
.nav-radio-logo{height:106px; width:auto; display:block;}
.nav-radio-link{display:block; text-decoration:none; transition:transform 0.2s ease;}
.nav-radio-link:hover{transform:scale(1.04);}
.brand{display:flex; align-items:flex-end; gap:0px; text-decoration:none;}
.brand-horizontal{height:112px; width:auto; display:block; filter:drop-shadow(0 2px 5px rgba(0,0,0,0.4));}
.links{display:flex; gap:20px; list-style:none; margin:0; padding:0; flex:1; justify-content:center;}
.links a{
  position:relative;
  font-family:'Bebas Neue'; font-size:16px; letter-spacing:0.08em; text-decoration:none;
  color:var(--cream-dim); padding:2px 2px; border-bottom:2px solid transparent; line-height:1;
  transition:color 0.25s ease, text-shadow 0.25s ease;
}
.links a::after{
  content:''; position:absolute; left:50%; right:50%; bottom:-3px; height:2px;
  background:var(--neon); border-radius:2px; box-shadow:0 0 8px rgba(245,196,51,0.8);
  transition:left 0.28s cubic-bezier(.2,.8,.2,1), right 0.28s cubic-bezier(.2,.8,.2,1);
}
.links a:hover{color:var(--neon); text-shadow:0 0 10px rgba(245,196,51,0.55);}
.links a.active{color:var(--neon); animation:pbtnKwGlow 2.4s ease-in-out infinite;}
.links a:hover::after, .links a.active::after{left:0; right:0;}
.links a.pop{animation:navPop 0.4s ease;}
@keyframes navPop{
  0%{transform:scale(1);}
  35%{transform:scale(0.86);}
  65%{transform:scale(1.14);}
  100%{transform:scale(1);}
}

.mobile-links a{transition:color 0.2s ease, padding-left 0.2s ease;}
.mobile-links a:hover{color:var(--neon); padding-left:10px;}
.mobile-links a.active{color:var(--neon); padding-left:10px; animation:pbtnKwGlow 2.4s ease-in-out infinite;}
.mobile-links a.pop{animation:navPop 0.4s ease;}
.live-pill{
  display:flex; align-items:center; gap:6px; font-family:'Space Mono'; font-size:11px;
  letter-spacing:0.08em; color:var(--neon); border:1px solid var(--neon); border-radius:99px;
  padding:5px 10px 5px 8px; background:none; cursor:pointer; transition:background 0.15s ease, transform 0.15s ease;
  appearance:none; -webkit-appearance:none; -moz-appearance:none; font:inherit; margin:0; outline-offset:2px;
}
.live-pill:hover{background:rgba(224,255,140,0.08); transform:translateY(-1px);}
.live-pill:active{transform:translateY(0);}
.live-pill .dot{width:7px;height:7px;border-radius:50%;background:var(--neon); box-shadow:0 0 8px var(--neon); animation:pulse 1.6s ease-in-out infinite;}
.live-pill.paused{color:var(--cream-dim) !important; border-color:var(--line) !important;}
.live-pill.paused:hover{background:rgba(185,169,141,0.08);}
.live-pill.paused .dot{background:var(--cream-dim) !important; box-shadow:none !important; animation:none !important;}
@keyframes pulse{0%,100%{opacity:1;}50%{opacity:0.35;}}

.burger{display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:8px; margin-left:8px;}
.burger span{width:24px; height:2px; background:var(--cream); display:block; border-radius:2px;}
.mobile-links{display:none; flex-direction:column; gap:2px; list-style:none; margin:0; padding:10px 24px 14px; border-top:1px solid var(--line); width:100%; flex-basis:100%;}
.mobile-links a{
  font-family:'Bebas Neue'; font-size:20px; letter-spacing:0.06em; text-decoration:none;
  color:var(--cream-dim); padding:10px 2px; border-bottom:1px solid var(--line);
}
.mobile-links a.active{color:var(--neon);}
.mobile-links.open{display:flex;}

@media (max-width:900px){
  .links{display:none;}
  .burger{display:flex; order:3;}
  .nav-right{order:2;}
  .mobile-links{order:4;}
}
@media (max-width:640px){
  .brand-horizontal{height:56px;}
  .nav-radio-logo{height:44px;}
  .nav-right{margin-left:8px; gap:6px;}
  .live-pill{font-size:8px; padding:3px 7px 3px 5px; gap:5px;}
  .burger{padding:6px; margin-left:4px;}
  .nav{padding:6px 12px;}
}

/* ---------- VIDEOCLIP DESTACADO (bajo el reproductor) ---------- */
.feat-clip{
  margin-top:18px; border-radius:16px; border:1px solid var(--line);
  background:linear-gradient(165deg, var(--ink-3), var(--ink-2)); overflow:hidden;
}
.feat-clip-head{padding:22px 18px 4px;}
.feat-eyebrow{font-size:10.5px; color:var(--amber); letter-spacing:0.09em;}
.feat-clip-head h3{font-size:24px; margin-top:0; line-height:1.15;}
.feat-highlight{color:var(--neon); animation:pbtnKwGlow 2.4s ease-in-out infinite;}
.feat-thumb{
  display:block; position:relative; margin:18px 18px 0; border-radius:10px; overflow:hidden;
  aspect-ratio:16/9;
}
.feat-thumb img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform 0.4s ease;}
.feat-thumb:hover img{transform:scale(1.04);}
/* Previsualización real en autoplay silenciado (sin audio, en bucle); pointer-events:none
   para que el clic siga cayendo sobre el <a> que envuelve la tarjeta, nunca sobre el iframe. */
.feat-video{position:absolute; inset:0; width:100%; height:100%; border:0; pointer-events:none;}
.feat-thumb::after{content:''; position:absolute; inset:0; background:linear-gradient(180deg, rgba(10,8,6,0.05) 45%, rgba(10,8,6,0.7));}
.feat-play{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); z-index:1;
  width:56px; height:56px; border-radius:50%; background:rgba(20,16,13,0.55); border:1.5px solid var(--neon);
  display:flex; align-items:center; justify-content:center;
}
.feat-play-ic{border-left:16px solid var(--neon); border-top:10px solid transparent; border-bottom:10px solid transparent; margin-left:4px;}
.feat-badge{
  position:absolute; top:10px; left:10px; z-index:1; font-family:'Space Mono'; font-size:10px;
  background:var(--neon); color:var(--ink); font-weight:700; padding:4px 9px; border-radius:99px; letter-spacing:0.06em;
}
.feat-clip-info{padding:12px 18px 18px;}
.feat-song{font-size:17px; font-weight:700; color:var(--cream);}
.feat-band{font-size:12.5px; color:var(--cream-dim); margin-top:2px;}
.radio-hint{display:block; font-size:11px; color:var(--amber); letter-spacing:0.08em; margin:0 0 10px 2px;}
.feat-thumb.vph{background:linear-gradient(135deg, var(--g1,var(--brick)), var(--g2,var(--brick-deep)));}
.feat-vinit{position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-family:'Bebas Neue'; font-size:130px; letter-spacing:0.04em; color:rgba(243,234,217,0.16); z-index:0; transition:transform 0.4s ease;}
.feat-thumb:hover .feat-vinit{transform:scale(1.05);}

.hero-left-col, .hero-right-col{display:flex; flex-direction:column; min-height:0; min-width:0;}
.hero-left-col .eyebrow, .hero-left-col h1, .hero-left-col .hero-tagblock{margin-left:0;}
.hero-left-col .feat-clip{margin-top:22px; flex:1 1 auto; display:flex; flex-direction:column;}
.hero-left-col .feat-thumb{flex:none;}
.hero-left-col .feat-clip-info{flex:1 1 auto;}
.hero-right-col .console{margin-top:0; flex:none;}
.hero-right-col .playlist-card{flex:1 1 auto;}
@media (max-width:1100px){ .hero-left-col h1{font-size:38px;} }
@media (max-width:900px){ .hero-left-col, .hero-right-col{height:auto;} .hero-left-col .feat-clip, .hero-right-col .playlist-card{flex:none;} }

/* ---------- HERO / CONSOLE ---------- */
.hero{
  position:relative; padding:56px 0 40px;
  background:
    radial-gradient(620px 340px at 50% 30%, rgba(224,138,52,0.14), transparent 62%),
    radial-gradient(1100px 460px at 20% -10%, rgba(154,63,39,0.55), transparent 60%),
    radial-gradient(700px 400px at 90% 0%, rgba(245,196,51,0.10), transparent 55%),
    var(--ink);
  border-bottom:1px solid var(--line);
}
.hero-grid{
  display:grid; grid-template-columns:1.35fr 1fr; gap:28px; align-items:stretch;
}
@media (max-width:900px){
  .hero-grid{grid-template-columns:1fr; gap:0;}
  .hero-left-col, .hero-right-col{display:contents;}
  /* En móvil, justo debajo del título va el reproductor de la radio, y solo
     después el bloque de bienvenida (para no recibir al visitante con un muro
     de texto nada más entrar); el resto sigue en su orden habitual. */
  .hero-left-col > .eyebrow, .hero-left-col > .hero-tagline, .hero-left-col > h1{order:1;}
  .hero-right-col > .radio-hint, .hero-right-col > .console{order:2;}
  .hero-right-col > .radio-hint{margin-top:26px;}
  .hero-left-col > .hero-tagblock{order:3; margin-top:26px;}
  .hero-left-col > .feat-clip{order:4;}
  /* El texto de bienvenida va partido en dos: la segunda mitad baja por debajo
     de "Descubre algo nuevo" para romper el muro de texto. */
  .hero-left-col > .hero-tagblock-b{order:5; margin-top:26px;}
  .hero-right-col > .playlist-card{order:6;}
}
@media (max-width:900px){
  /* Radio (mismo criterio que en Home): justo debajo del logo va el
     reproductor, y solo después el título/texto de bienvenida; la playlist
     sigue al final. Selectores con .rhero para no afectar al Home, que
     comparte las mismas clases .hero-right-col/.hero-left-col. */
  .rhero .hero-right-col > .radio-hint, .rhero .hero-right-col > .console{order:1;}
  .rhero .hero-left-col > .rhero-title{order:2;}
  .rhero .hero-right-col > .playlist-card{order:3;}
  /* Menos aire en móvil: entre el nav y el logo, entre el logo y el
     reproductor, y entre el aviso "ESCUCHA LA RADIO..." y la caja del
     reproductor. */
  .rhero{padding-top:18px;}
  .rhero .hero-right-col > .radio-hint{margin-top:8px; margin-bottom:6px;}
}
.hero-logo-row{display:flex; align-items:center; gap:16px; margin-bottom:18px;}
.hero-horizontal{height:auto; width:auto; max-height:260px; max-width:70vw; display:block; filter:drop-shadow(0 8px 24px rgba(0,0,0,0.5));}
.eyebrow{
  font-family:'Space Mono'; font-size:12px; letter-spacing:0.16em; color:var(--amber);
  text-transform:uppercase; margin-bottom:10px; display:block;
}
.hero-tagline{
  font-family:'Space Mono'; font-size:12px; letter-spacing:0.04em; color:var(--cream-dim);
  display:block; margin:-6px 0 14px;
}
.hero h1{font-size:clamp(40px,6vw,74px); margin-bottom:6px;}
.hero h1 em{font-style:normal; color:var(--neon); animation:pbtnKwGlow 2.4s ease-in-out infinite;}
.hero-tagblock{color:var(--cream-dim); font-size:17px; margin-top:12px;}
.hero-tagblock p{margin:0 0 7px; text-align:justify; line-height:1.36;}
.hero-tagblock p:last-child{margin-bottom:0;}
/* Segundo bloque del texto de bienvenida (se separa del primero solo en movil,
   ver la media query de 900px): en escritorio va pegado al primero con el mismo
   aire que hay entre parrafos, para que no se note el corte. */
.hero-tagblock-b{margin-top:7px;}

/* console card */
.console{
  background:linear-gradient(160deg, var(--ink-3), var(--ink-2));
  border:1px solid var(--line); border-radius:18px; padding:22px;
  box-shadow:0 30px 60px -30px rgba(0,0,0,0.8), inset 0 0 0 1px rgba(255,255,255,0.02);
  margin-top:26px;
  position:relative; overflow:hidden;
}
.console::before{
  content:''; position:absolute; inset:-40% -10% auto -10%; height:220px;
  background:radial-gradient(circle, rgba(245,196,51,0.14), transparent 65%);
  pointer-events:none;
}
.console-top{display:flex; align-items:center; justify-content:space-between; gap:12px; position:relative;}
.onair{
  display:inline-flex; align-items:center; gap:8px; background:var(--brick); color:var(--cream);
  font-family:'Space Mono'; font-size:12px; letter-spacing:0.1em; padding:6px 12px; border-radius:6px;
  text-shadow:0 0 6px rgba(245,196,51,0.5); transition:opacity 0.08s linear;
}
.onair .dot{width:7px;height:7px;border-radius:50%;background:var(--neon); animation:pulse 1.6s ease-in-out infinite;}
.onair.flicker{animation:neonFlicker 1.8s linear;}
@keyframes neonFlicker{
  0%,19%,21%,23%,52%,54%,89%,91%,100%{opacity:1;}
  20%,22%,53%,90%{opacity:0.35;}
}
.console-top .right{display:flex; align-items:center; gap:12px;}
.onair-timer{font-family:'Space Mono'; font-size:12px; color:var(--neon); opacity:0.85; letter-spacing:0.04em;}
@media (prefers-reduced-motion: reduce){ .onair.flicker{animation:none;} }

.player-body{display:flex; align-items:center; gap:18px; margin-top:20px; position:relative; min-width:0;}

.vinyl-btn{
  width:88px; height:88px; border-radius:50%; flex:none; position:relative;
  background:transparent; border:none; padding:0; cursor:pointer;
  transition:transform 0.15s ease;
}
.vinyl-btn:hover{transform:scale(1.045);}
.vinyl-disc{
  position:absolute; inset:0; border-radius:50%; display:block;
  background:#0a0a0a;
  box-shadow:0 0 0 4px rgba(245,196,51,0.10), 0 18px 34px -10px rgba(0,0,0,0.75), inset 0 0 0 1px rgba(255,255,255,0.07);
  animation:spinVinyl 5s linear infinite;
  animation-play-state:paused;
}
.vinyl-btn.playing .vinyl-disc{animation-play-state:running;}
@keyframes spinVinyl{to{transform:rotate(360deg);}}
.vinyl-grooves{
  position:absolute; inset:4px; border-radius:50%; pointer-events:none; display:block;
  background:repeating-radial-gradient(circle at 50% 50%, rgba(255,255,255,0.05) 0 1px, transparent 1px 4px);
}
.vinyl-label-lg{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  width:44%; height:44%; border-radius:50%; object-fit:cover;
  box-shadow:0 0 0 3px rgba(0,0,0,0.85);
}
.vinyl-icon{
  position:absolute; right:-2px; bottom:-2px; width:22px; height:22px; border-radius:50%;
  background:radial-gradient(circle at 35% 30%, var(--neon), var(--amber) 75%);
  box-shadow:0 4px 10px -3px rgba(0,0,0,0.65), 0 0 0 3px var(--ink-2);
  display:flex; align-items:center; justify-content:center; z-index:2;
}
.vinyl-icon::after{
  content:''; border-left:7px solid var(--ink); border-top:5px solid transparent; border-bottom:5px solid transparent;
  margin-left:2px;
}
.vinyl-btn.playing .vinyl-icon::after{
  content:''; width:2px; height:8px; border-left:2px solid var(--ink); border-right:2px solid var(--ink);
  border-top:none; border-bottom:none; margin-left:0;
}

.now-playing{flex:1; min-width:0;}
.track-label{font-size:11px; letter-spacing:0.16em; color:var(--amber); font-family:'Space Mono'; display:block;}
.track-name-lg{
  font-family:'Bebas Neue'; font-size:24px; letter-spacing:0.01em; color:var(--cream); line-height:1.15;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-top:4px;
  transition:opacity 0.4s ease; position:relative;
}
.track-name-lg .inner{display:inline-block;}
.track-name-lg.marquee{text-overflow:clip;}
.track-name-lg.marquee .inner{animation:trackMarquee linear infinite;}
@keyframes trackMarquee{
  0%,12%{transform:translateX(0);}
  50%{transform:translateX(var(--marquee-dist,0));}
  62%{transform:translateX(var(--marquee-dist,0));}
  100%{transform:translateX(0);}
}
@media (prefers-reduced-motion: reduce){
  .track-name-lg.marquee .inner{animation:none;}
}
.now-playing.fade .track-name-lg{opacity:0;}
.waveform{display:block; width:100%; max-width:210px; height:28px; margin-top:12px;}
.console.paused .waveform{opacity:0.35;}
.radio-logo-player{height:88px; width:auto; flex:none; filter:drop-shadow(0 6px 14px rgba(0,0,0,0.5));}
@media (max-width:640px){
  .hero{padding-top:20px;}
  .hero-horizontal{max-width:100%; max-height:190px;}
  .vinyl-btn{width:56px; height:56px;}
  .vinyl-icon{width:16px; height:16px;}
  .radio-logo-player{height:52px;}
  .player-body{gap:10px;}
}

.vol{display:flex; align-items:center; gap:8px; margin-top:16px;}
.vol input[type=range]{
  -webkit-appearance:none; width:120px; height:3px; background:var(--line); border-radius:99px;
}
.vol input[type=range]::-webkit-slider-thumb{
  -webkit-appearance:none; width:13px; height:13px; border-radius:50%; background:var(--neon); cursor:pointer;
}
.vol span{font-family:'Space Mono'; font-size:11px; color:var(--cream-dim);}

.next-up{
  margin-top:18px; padding-top:14px; border-top:1px dashed var(--line);
  font-size:13px; color:var(--cream-dim); display:flex; justify-content:space-between; gap:10px;
}
.next-up b{color:var(--cream); font-weight:700;}

/* spotify card */
.playlist-card{
  background:linear-gradient(160deg, var(--ink-3), var(--ink-2));
  border:1px solid var(--line); border-radius:18px; padding:20px; margin-top:26px;
  display:flex; flex-direction:column;
}
.playlist-head{display:flex; align-items:center; gap:14px; margin-bottom:14px;}
.playlist-badge{width:64px; height:64px; border-radius:50%; flex:none; box-shadow:0 6px 16px -6px rgba(0,0,0,0.6);}
.playlist-eyebrow{font-size:11px; letter-spacing:0.12em; color:var(--amber); display:block;}
.playlist-head h3{font-size:20px; color:var(--cream); margin-top:4px;}
.track{
  display:flex; align-items:center; gap:12px; padding:9px 4px; border-bottom:1px solid var(--line);
  font-size:14px;
}
.track:last-child{border-bottom:none;}
.track .n{font-family:'Space Mono'; color:var(--cream-dim); width:16px; flex:none;}
.track .t{flex:1; min-width:0;}
.track .t .name{color:var(--cream);}
.track .t .artist{color:var(--cream-dim); font-size:12.5px;}
.track .len{font-family:'Space Mono'; font-size:12px; color:var(--cream-dim);}
/* El alto mínimo es 352px porque es lo que necesita el reproductor de Spotify
   para pintar su ficha entera (portada, botón de guardar, controles y lista).
   Con menos, Spotify dibuja igualmente el diseño de 352 y lo que sobra queda
   en blanco: es lo que pasaba en /radio/, donde la columna solo dejaba 233px.
   En el Home no cambia nada: allí el hueco ya pasa de 900px. */
.playlist-embed{border-radius:12px; overflow:hidden; background:var(--ink); line-height:0; flex:1 1 auto; display:flex; min-height:352px;}
.playlist-embed iframe{display:block; width:100%; height:100%; border:0; flex:1 1 auto;}
@media (max-width:900px){
  .playlist-embed{flex:none; height:352px; min-height:352px;}
  .playlist-embed iframe{height:352px;}
}
.playlist-cta{
  margin-top:14px; text-align:center; font-family:'Space Mono'; font-size:12px; letter-spacing:0.06em;
  color:var(--amber); border:1px solid var(--amber); border-radius:8px; padding:8px; text-decoration:none;
}
.playlist-cta:hover{background:rgba(224,138,52,0.12);}

/* ---------- VIDEOCLIP MARQUEE ---------- */
.marquee-section{padding:36px 0 8px; border-bottom:1px solid var(--line);}
.marquee-head{display:flex; align-items:baseline; justify-content:space-between; gap:16px; margin-bottom:16px;}
.marquee-head h2{font-size:30px;}
.marquee-head .sub{font-size:13px; color:var(--cream-dim); font-family:'Space Mono';}
.reel{
  display:flex; gap:16px; overflow-x:auto; padding:4px 24px 26px; margin:0 -24px;
  scroll-snap-type:x proximity;
}
.reel::-webkit-scrollbar{height:8px;}
.reel::-webkit-scrollbar-thumb{background:var(--brick); border-radius:99px;}
.clip{
  flex:none; width:230px; scroll-snap-align:start; cursor:pointer; position:relative;
  border-radius:12px; overflow:hidden; border:1px solid var(--line);
  background:var(--ink-2); display:block; text-decoration:none; transition:transform 0.2s ease;
}
.clip:hover{transform:translateY(-3px);}
.clip .thumb{
  height:130px; position:relative;
  display:flex; align-items:center; justify-content:center; overflow:hidden;
}
.clip .thumb img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
.clip .thumb::after{content:''; position:absolute; inset:0; background:linear-gradient(180deg, rgba(10,8,6,0.05), rgba(10,8,6,0.55));}
.clip .thumb .p{
  width:44px; height:44px; border-radius:50%; background:rgba(20,16,13,0.55); border:1.5px solid var(--neon);
  display:flex; align-items:center; justify-content:center; position:relative; z-index:1;
}
.clip .thumb .p::after{content:''; border-left:12px solid var(--neon); border-top:8px solid transparent; border-bottom:8px solid transparent; margin-left:3px;}
.clip .thumb .tag{position:absolute; top:8px; left:8px; font-family:'Space Mono'; font-size:10px; background:var(--brick); padding:2px 7px; border-radius:4px; letter-spacing:0.06em; z-index:1;}
.clip .info{padding:10px 12px 12px;}
.clip .info .song{font-size:14px; color:var(--cream); font-weight:700;}
.clip .info .band{font-size:12px; color:var(--cream-dim);}

/* ---------- NOTICIAS TICKER ---------- */
.news-section{padding:36px 0 8px; border-bottom:1px solid var(--line); position:relative;}
.news-section::before{
  content:''; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(ellipse 60% 100% at 100% 0%, rgba(154,63,39,0.10), transparent 65%);
}
.news-head{display:flex; align-items:baseline; justify-content:space-between; gap:16px; margin-bottom:16px; position:relative;}
.news-head .htitle{display:flex; align-items:center; gap:10px;}
.news-head h2{font-size:30px;}
.news-live{
  display:inline-flex; align-items:center; gap:5px; font-family:'Space Mono'; font-size:10.5px;
  color:var(--neon); border:1px solid var(--neon); border-radius:99px; padding:3px 9px 3px 7px; letter-spacing:0.06em;
}
.news-live .dot{width:6px;height:6px;border-radius:50%;background:var(--neon); box-shadow:0 0 7px var(--neon); animation:pulse 1.6s ease-in-out infinite;}
.news-head .sub{font-size:13px; color:var(--cream-dim); font-family:'Space Mono'; text-decoration:none; white-space:nowrap;}
.news-head .sub:hover{color:var(--neon);}
.news-reel{
  display:flex; gap:16px; overflow-x:auto; padding:4px 24px 26px; margin:0 -24px;
  scroll-snap-type:x proximity; position:relative;
}
.news-reel::-webkit-scrollbar{height:8px;}
.news-reel::-webkit-scrollbar-thumb{background:var(--brick); border-radius:99px;}
.nclip{
  flex:none; width:250px; scroll-snap-align:start; cursor:pointer; position:relative;
  border-radius:12px; overflow:hidden; border:1px solid var(--line);
  background:var(--ink-2); display:block; text-decoration:none; transition:transform 0.2s ease, border-color 0.2s ease;
}
.nclip:hover{transform:translateY(-4px); border-color:var(--amber);}
.nclip .thumb{height:145px; position:relative; display:flex; align-items:center; justify-content:center; overflow:hidden;}
.nclip .thumb img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform 0.4s ease;}
.nclip:hover .thumb img{transform:scale(1.06);}
.nclip .thumb::after{content:''; position:absolute; inset:0; background:linear-gradient(180deg, rgba(10,8,6,0.05) 40%, rgba(10,8,6,0.75));}
.nclip .thumb .tag{
  position:absolute; top:8px; left:8px; font-family:'Space Mono'; font-size:9.5px; background:var(--brick);
  color:var(--cream); padding:3px 8px; border-radius:99px; letter-spacing:0.08em; z-index:1;
}
.nclip .thumb .tag.new{background:var(--neon); color:var(--ink); font-weight:700;}
.nclip .rnb-chip{
  position:absolute; top:8px; right:8px; z-index:1; width:22px; height:22px; border-radius:50%;
  background:rgba(20,16,13,0.65); border:1px solid var(--neon); color:var(--neon);
  display:flex; align-items:center; justify-content:center;
}
.nclip .info{padding:10px 12px 12px; position:relative;}
.nclip .ndate{font-size:10.5px; color:var(--amber); letter-spacing:0.06em; margin-bottom:4px;}
.nclip .ntitle{
  font-size:14px; color:var(--cream); font-weight:700; line-height:1.32;
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
}
.nclip-more{
  flex:none; width:180px; scroll-snap-align:start; border-radius:12px; border:1px dashed var(--line);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; text-align:center;
  text-decoration:none; color:var(--cream-dim); padding:20px; transition:border-color 0.2s ease, color 0.2s ease;
}
.nclip-more:hover{border-color:var(--neon); color:var(--neon);}
.nclip-more .arrow-circ{
  width:40px; height:40px; border-radius:50%; border:1.5px solid currentColor;
  display:flex; align-items:center; justify-content:center; font-family:'Space Mono'; font-size:17px;
}
.nclip-more span.lbl{font-family:'Bebas Neue'; font-size:16px; letter-spacing:0.04em;}

/* ---------- CINTAS: scroll lateral automático, direcciones opuestas ---------- */
.reel, .news-reel{overflow-x:hidden; padding:4px 0 26px; margin:0;}
.reel-track, .news-track{
  display:flex; gap:16px; flex:none; width:max-content; padding:0 24px;
  transform:translateZ(0); backface-visibility:hidden;
}
.reel-track{animation:marqueeRight 60s linear infinite;}
.news-track{animation:marqueeLeft 55s linear infinite;}
.reel:hover .reel-track, .news-reel:hover .news-track{animation-play-state:paused;}
@keyframes marqueeLeft{from{transform:translateX(0);}to{transform:translateX(-50%);}}
@keyframes marqueeRight{from{transform:translateX(-50%);}to{transform:translateX(0);}}
@media (prefers-reduced-motion: reduce){
  .reel-track, .news-track{animation:none;}
  .reel, .news-reel{overflow-x:auto;}
}

/* ---------- DE TODO UN POCO (cinta mixta videoclips + noticias) ---------- */
.mix-section{padding:44px 0 8px; border-bottom:1px solid var(--line);}
.mix-reel{overflow-x:hidden; padding:4px 0 26px; margin:0;}
.mix-track{
  display:flex; gap:20px; flex:none; width:max-content; padding:0 24px;
  transform:translateZ(0); backface-visibility:hidden;
  animation:marqueeLeft 232s linear infinite;
}
.mix-reel:hover .mix-track{animation-play-state:paused;}
@media (prefers-reduced-motion: reduce){
  .mix-track{animation:none;}
  .mix-reel{overflow-x:auto;}
}
.mix-card{
  flex:none; width:364px; cursor:pointer; position:relative;
  border-radius:14px; overflow:hidden; border:1px solid var(--line);
  background:var(--ink-2); display:block; text-decoration:none; transition:transform 0.2s ease, border-color 0.2s ease;
}
.mix-card:hover{transform:translateY(-4px); border-color:var(--neon);}
.mix-card.is-news:hover{border-color:var(--amber);}
.mix-thumb{height:220px; position:relative; display:flex; align-items:center; justify-content:center; overflow:hidden;}
.mix-thumb img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform 0.4s ease;}
.mix-card:hover .mix-thumb img{transform:scale(1.06);}
.mix-thumb::after{content:''; position:absolute; inset:0; background:linear-gradient(180deg, rgba(10,8,6,0.05) 45%, rgba(10,8,6,0.72));}
.mix-thumb.mix-vph{background:linear-gradient(135deg, var(--g1,var(--brick)), var(--g2,var(--brick-deep)));}
.mix-vinit{position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-family:'Bebas Neue'; font-size:130px; letter-spacing:0.04em; color:rgba(243,234,217,0.16); z-index:0;}
.mix-kind{
  position:absolute; top:12px; left:12px; z-index:1; font-family:'Space Mono'; font-size:10.5px;
  background:var(--neon); color:var(--ink); font-weight:700; padding:4px 10px; border-radius:99px; letter-spacing:0.07em;
}
.mix-kind.news{background:var(--amber); color:var(--ink);}
.mix-kind.playlist{background:#1DB954; color:#04140b;}
.mix-card.is-playlist:hover{border-color:#1DB954;}
.mix-thumb.is-playlist-thumb{background:radial-gradient(circle at 50% 42%, rgba(154,63,39,0.45), var(--ink-2) 75%);}
.mix-thumb.is-playlist-thumb img{object-fit:contain; padding:20px;}
.mix-card.is-playlist:hover .mix-thumb img{transform:none;}
.mix-play{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); z-index:1;
  width:56px; height:56px; border-radius:50%; background:rgba(20,16,13,0.55); border:1.5px solid var(--neon);
  display:flex; align-items:center; justify-content:center;
}
.mix-play-ic{border-left:16px solid var(--neon); border-top:10px solid transparent; border-bottom:10px solid transparent; margin-left:4px;}
.mix-info{padding:14px 16px 16px; position:relative;}
.mix-title{font-size:17px; color:var(--cream); font-weight:700; line-height:1.28;}
.mix-title.clamp{display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;}
.mix-sub{font-size:13px; color:var(--cream-dim); margin-top:3px;}
.mix-date{font-size:11px; color:var(--amber); letter-spacing:0.06em; margin-bottom:5px; font-family:'Space Mono';}

/* ---------- PARTICIPACIÓN ---------- */
.participa{padding:44px 0; border-bottom:1px solid var(--line);}
.section-head{margin-bottom:24px;}
.section-head .eyebrow{margin-bottom:4px;}
.section-head h2{font-size:32px;}
.cards3{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
@media (max-width:900px){.cards3{grid-template-columns:1fr;}}
.card{
  background:linear-gradient(160deg, var(--ink-3), var(--ink-2)); border:1px solid var(--line);
  border-radius:16px; padding:20px; display:flex; flex-direction:column; gap:12px;
}
.card h3{font-size:22px; display:flex; align-items:center; gap:8px;}
.card h3 .ic{
  width:30px;height:30px;border-radius:8px;background:var(--brick-deep);display:flex;align-items:center;justify-content:center;
  font-family:'Space Mono'; font-size:14px; color:var(--neon);
}
.card p.desc{font-size:13.5px; color:var(--cream-dim); margin:0;}

/* encuesta */
.poll-opt{
  border:1px solid var(--line); border-radius:9px; padding:10px 12px; cursor:pointer; position:relative;
  overflow:hidden; background:var(--ink); font-size:14px;
}
.poll-opt .fill{
  position:absolute; inset:0; background:linear-gradient(90deg, rgba(245,196,51,0.22), rgba(245,196,51,0.05));
  width:0%; transition:width 0.5s ease; z-index:0;
}
.poll-opt .row{position:relative; z-index:1; display:flex; justify-content:space-between; gap:8px;}
.poll-opt .pct{font-family:'Space Mono'; color:var(--neon); display:none;}
.poll-opt.voted .pct{display:inline;}
.poll-opt:hover{border-color:var(--neon);}
.poll-meta{font-family:'Space Mono'; font-size:11px; color:var(--cream-dim); margin-top:2px;}

/* testimonios */
.testimonios{padding:44px 0; border-bottom:1px solid var(--line);}
.testi-grid{display:grid; grid-template-columns:1.3fr 1fr; gap:24px; align-items:start;}
@media (max-width:900px){ .testi-grid{grid-template-columns:1fr;} }
.wall{display:flex; flex-direction:column; gap:10px; max-height:190px; overflow-y:auto; padding-right:4px;}
.testi-grid .wall{max-height:none; overflow:visible; gap:12px;}
.msg{border-left:3px solid var(--amber); padding:6px 10px; font-size:13.5px; background:rgba(255,255,255,0.02); border-radius:0 8px 8px 0;}
.msg b{color:var(--neon); font-weight:700;}
.msg .from{display:block; font-family:'Space Mono'; font-size:10.5px; color:var(--cream-dim); margin-top:3px;}
.msg.pending{opacity:0.62; border-left-style:dashed; border-left-color:var(--cream-dim);}
.msg-badge{display:block; font-family:'Space Mono'; font-size:9.5px; letter-spacing:0.05em; color:var(--cream-dim); background:rgba(255,255,255,0.06); border-radius:99px; padding:2px 8px; margin-bottom:5px; width:fit-content;}
.mini-form{display:flex; gap:8px; margin-top:auto;}
.mini-form input{
  flex:1; background:var(--ink); border:1px solid var(--line); border-radius:8px; color:var(--cream);
  padding:9px 10px; font-family:'Karla'; font-size:13.5px;
}
.mini-form input:focus{border-color:var(--neon);}
.testi-form{display:flex; flex-direction:column; gap:10px; margin-top:auto;}
.testi-form input, .testi-form textarea{
  background:var(--ink); border:1px solid var(--line); border-radius:8px; color:var(--cream);
  padding:9px 10px; font-family:'Karla'; font-size:13.5px; width:100%;
}
.testi-form textarea{min-height:92px; resize:vertical; font-family:'Karla';}
.testi-form input:focus, .testi-form textarea:focus{border-color:var(--neon);}
.btn-send{
  background:var(--neon); color:var(--ink); border:none; border-radius:8px; padding:0 16px;
  font-family:'Bebas Neue'; font-size:15px; letter-spacing:0.04em; cursor:pointer; height:38px;
}
.btn-send:hover{background:var(--focus);}

.testi-viewall{
  display:inline-flex; align-items:center; gap:7px; margin-top:16px; background:transparent;
  border:1px solid var(--line); color:var(--cream-dim); border-radius:99px; padding:9px 18px;
  font-family:'Space Mono'; font-size:12px; letter-spacing:0.04em; cursor:pointer; transition:border-color 0.2s ease, color 0.2s ease;
}
.testi-viewall:hover{border-color:var(--neon); color:var(--neon);}
.testi-viewall .n{color:var(--neon); font-weight:700;}

.testi-modal{position:fixed; inset:0; z-index:1000; display:none; align-items:center; justify-content:center; padding:24px;}
.testi-modal.open{display:flex;}
.testi-modal-backdrop{position:absolute; inset:0; background:rgba(10,7,5,0.78); backdrop-filter:blur(3px);}
.testi-modal-card{
  position:relative; z-index:1; width:100%; max-width:640px; max-height:80vh; overflow-y:auto;
  background:linear-gradient(160deg, var(--ink-3), var(--ink-2)); border:1px solid var(--line);
  border-radius:18px; padding:30px 28px;
}
.testi-modal-close{
  position:absolute; top:16px; right:16px; width:34px; height:34px; border-radius:50%;
  background:var(--ink); border:1px solid var(--line); color:var(--cream-dim); font-size:18px;
  line-height:1; cursor:pointer; display:flex; align-items:center; justify-content:center;
}
.testi-modal-close:hover{border-color:var(--amber); color:var(--amber);}
.testi-modal-title{font-family:'Bebas Neue'; font-size:26px; color:var(--cream); margin-bottom:4px;}
.testi-modal-sub{font-size:13px; color:var(--cream-dim); margin-bottom:18px;}
.testi-modal-list{display:flex; flex-direction:column; gap:10px;}
@media (max-width:640px){ .testi-modal-card{padding:24px 18px;} .testi-modal-title{font-size:22px;} }

/* peticiones */
.req-list{display:flex; flex-direction:column; gap:8px; font-size:13px;}
.req-list .r{display:flex; justify-content:space-between; gap:10px; color:var(--cream-dim);}
.req-list .r b{color:var(--cream); font-weight:700;}
.req-list .r .s{font-family:'Space Mono'; font-size:10.5px; color:var(--amber);}

/* botones-teaser de Participación (el bloque completo vive en Radio) */
.participa-btns{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
@media (max-width:900px){ .participa-btns{grid-template-columns:1fr;} }
.pbtn{
  display:flex; flex-direction:column; gap:14px; text-decoration:none; color:inherit; position:relative; overflow:hidden;
  background:linear-gradient(160deg, var(--ink-3), var(--ink-2)); border:1px solid var(--line); border-radius:18px;
  padding:30px 26px 26px; transition:border-color 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease;
  animation:pbtnBreathe 3.6s ease-in-out infinite;
}
.pbtn:nth-child(1){animation-delay:0s;}
.pbtn:nth-child(2){animation-delay:0.5s;}
.pbtn:nth-child(3){animation-delay:1s;}
@keyframes pbtnBreathe{
  0%,100%{border-color:var(--line); box-shadow:0 0 0 rgba(245,196,51,0);}
  50%{border-color:rgba(245,196,51,0.45); box-shadow:0 0 26px rgba(245,196,51,0.14);}
}
.pbtn::before{
  content:''; position:absolute; inset:0; opacity:0.5; transition:opacity 0.25s ease; pointer-events:none;
  background:radial-gradient(circle at 85% 0%, rgba(245,196,51,0.14), transparent 62%);
}
.pbtn::after{
  content:''; position:absolute; top:0; left:-60%; width:45%; height:100%; pointer-events:none;
  background:linear-gradient(100deg, transparent, rgba(255,255,255,0.10) 45%, transparent 90%);
  transform:skewX(-18deg); animation:pbtnShine 4.5s ease-in-out infinite;
}
.pbtn:nth-child(1)::after{animation-delay:0.3s;}
.pbtn:nth-child(2)::after{animation-delay:1.1s;}
.pbtn:nth-child(3)::after{animation-delay:1.9s;}
@keyframes pbtnShine{
  0%{left:-60%;} 32%{left:130%;} 100%{left:130%;}
}
.pbtn:hover{
  border-color:var(--neon); transform:translateY(-6px) scale(1.015);
  box-shadow:0 18px 34px rgba(0,0,0,0.4), 0 0 30px rgba(245,196,51,0.28);
  animation-play-state:paused;
}
.pbtn:hover::before{opacity:1;}
.pbtn-ic{
  width:52px; height:52px; border-radius:13px; display:flex; align-items:center; justify-content:center;
  font-size:23px; background:var(--brick-deep); position:relative; z-index:1; flex:none;
  animation:pbtnIconPulse 2.4s ease-in-out infinite;
}
.pbtn:nth-child(1) .pbtn-ic{animation-delay:0s;}
.pbtn:nth-child(2) .pbtn-ic{animation-delay:0.3s;}
.pbtn:nth-child(3) .pbtn-ic{animation-delay:0.6s;}
@keyframes pbtnIconPulse{
  0%,100%{transform:scale(1); box-shadow:0 0 0 rgba(245,196,51,0);}
  50%{transform:scale(1.08); box-shadow:0 0 0 6px rgba(245,196,51,0.08);}
}
.pbtn:hover .pbtn-ic{animation:none; transform:scale(1.12) rotate(-4deg); background:var(--neon); color:var(--ink);}
.pbtn-live{
  position:absolute; top:20px; right:20px; display:flex; align-items:center; gap:5px; font-family:'Space Mono'; font-size:10px;
  letter-spacing:0.08em; color:var(--neon); z-index:1;
}
.pbtn-live .dot{width:6px; height:6px; border-radius:50%; background:var(--neon); animation:pbPulseDot 1.8s ease-in-out infinite;}
@keyframes pbPulseDot{0%,100%{opacity:1;} 50%{opacity:0.35;}}
.pbtn-title{
  font-family:'Bebas Neue'; font-size:30px; letter-spacing:0.015em; color:var(--cream); line-height:1.08; position:relative; z-index:1;
  text-wrap:balance;
}
.pbtn-title .kw{color:var(--neon); text-shadow:0 0 18px rgba(245,196,51,0.35); display:inline-block; animation:pbtnKwGlow 2.4s ease-in-out infinite;}
.pbtn:nth-child(1) .kw{animation-delay:0s;}
.pbtn:nth-child(2) .kw{animation-delay:0.3s;}
.pbtn:nth-child(3) .kw{animation-delay:0.6s;}
@keyframes pbtnKwGlow{
  0%,100%{text-shadow:0 0 10px rgba(245,196,51,0.25);}
  50%{text-shadow:0 0 22px rgba(245,196,51,0.65), 0 0 6px rgba(245,196,51,0.5);}
}
@media (max-width:1100px) and (min-width:901px){ .pbtn-title{font-size:25px;} }
@media (max-width:520px){ .pbtn-title{font-size:26px;} }
.pbtn-sub{font-size:13px; color:var(--cream-dim); line-height:1.4; position:relative; z-index:1;}
.pbtn-arrow{
  margin-top:auto; padding-top:6px; font-family:'Space Mono'; font-size:12px; color:var(--amber);
  display:flex; align-items:center; gap:6px; position:relative; z-index:1; transition:gap 0.22s ease, color 0.22s ease;
}
.pbtn-arrow .arr{display:inline-block; animation:pbtnArrowNudge 1.6s ease-in-out infinite;}
.pbtn:hover .pbtn-arrow{gap:11px; color:var(--neon);}
.pbtn:hover .pbtn-arrow .arr{animation:none;}
@keyframes pbtnArrowNudge{
  0%,100%{transform:translateX(0);} 50%{transform:translateX(5px);}
}
@media (prefers-reduced-motion: reduce){
  .pbtn, .pbtn::after, .pbtn-ic, .pbtn-title .kw, .pbtn-arrow .arr, .pbtn-live .dot{animation:none !important;}
}

.toast{
  position:fixed; bottom:22px; left:50%; transform:translateX(-50%) translateY(20px); opacity:0;
  background:var(--neon); color:var(--ink); font-family:'Bebas Neue'; letter-spacing:0.03em;
  padding:10px 20px; border-radius:99px; font-size:15px; z-index:50; transition:all 0.25s ease; pointer-events:none;
}
.toast.show{opacity:1; transform:translateX(-50%) translateY(0);}

/* ---------- MODAL VIDEO (reproductor propio, sin salir de la web) ---------- */
.ytm-modal{
  position:fixed; inset:0; z-index:80; display:none; align-items:center; justify-content:center; padding:24px;
}
.ytm-modal.open{display:flex;}
.ytm-modal-backdrop{
  position:absolute; inset:0; background:rgba(10,7,5,0.88); backdrop-filter:blur(3px);
}
.ytm-modal-card{
  position:relative; width:min(920px, 100%); background:var(--ink-2); border:1px solid var(--line);
  border-radius:16px; box-shadow:0 40px 90px -30px rgba(0,0,0,0.9); overflow:hidden;
}
.ytm-modal-close{
  position:absolute; top:10px; right:10px; z-index:2; width:36px; height:36px; border-radius:50%;
  background:rgba(20,16,13,0.75); border:1px solid var(--line); color:var(--cream); font-size:20px; line-height:1;
  cursor:pointer; display:flex; align-items:center; justify-content:center; transition:background 0.15s ease, transform 0.15s ease;
}
.ytm-modal-close:hover{background:var(--brick); transform:scale(1.06);}
.ytm-frame-wrap{position:relative; width:100%; aspect-ratio:16/9; background:#000;}
.ytm-frame-wrap iframe{position:absolute; inset:0; width:100%; height:100%; border:0;}

/* ---------- INDEX TILES ---------- */
.index{padding:48px 0 56px;}
.tiles{display:grid; grid-template-columns:repeat(auto-fit, minmax(200px,1fr)); gap:20px;}
@media (max-width:900px){.tiles{grid-template-columns:1fr;}}
.tile{
  position:relative; border-radius:16px; padding:26px 22px; min-height:170px; overflow:hidden;
  display:flex; flex-direction:column; justify-content:flex-end; text-decoration:none; color:var(--cream);
  border:1px solid var(--line);
}
.tile .bg{position:absolute; inset:0; opacity:0.9;}
.tile.radio .bg{background:radial-gradient(circle at 80% 0%, rgba(245,196,51,0.25), transparent 60%), linear-gradient(150deg, var(--brick-deep), var(--ink-2));}
.tile.media .bg{background:radial-gradient(circle at 80% 0%, rgba(224,138,52,0.30), transparent 60%), linear-gradient(150deg, #6b3a1c, var(--ink-2));}
.tile.news .bg{background:radial-gradient(circle at 80% 0%, rgba(245,196,51,0.18), transparent 60%), linear-gradient(150deg, #4a2a20, var(--ink-2));}
.tile.about .bg{background:radial-gradient(circle at 80% 0%, rgba(224,138,52,0.25), transparent 60%), linear-gradient(150deg, #3a2a1c, var(--ink-2));}
.tile.contact .bg{background:radial-gradient(circle at 80% 0%, rgba(154,63,39,0.35), transparent 60%), linear-gradient(150deg, var(--ink-3), var(--ink-2));}
.tile-logo{position:absolute; top:18px; right:18px; width:74px; height:auto; opacity:0.92;}
.tile .k{font-family:'Space Mono'; font-size:11px; color:var(--cream-dim); position:relative; letter-spacing:0.1em;}
.tile h3{font-size:34px; position:relative; margin-top:2px;}
.tile .arrow{position:relative; margin-top:10px; font-family:'Space Mono'; font-size:13px; color:var(--neon);}
.tile:hover{border-color:var(--neon);}
.tile:hover .arrow{text-decoration:underline;}

/* ---------- FOOTER ---------- */
footer{border-top:1px solid var(--line); padding:10px 0 2px; background:
    linear-gradient(180deg, rgba(30,23,18,0.78) 0%, rgba(20,16,13,0.90) 100%),
    url("assets/img/wood-bg.jpg") center 70% / cover no-repeat,
    var(--ink-3);}
.foot-grid{display:grid; grid-template-columns:auto 1fr auto; gap:44px; align-items:start;}
.foot-brand{display:flex; flex-direction:column; align-items:center; text-align:center;}
.foot-logos-row{display:flex; align-items:center; justify-content:center; gap:16px;}
.foot-logo-vert, .foot-logo-radio{height:86px; width:auto; display:block;}
.foot-tagline{
  font-family:'Bebas Neue'; font-size:21px; letter-spacing:0.02em; color:var(--cream);
  line-height:1.05; margin-top:14px; white-space:nowrap;
}
.foot-tagline em{font-style:normal; color:var(--neon); animation:pbtnKwGlow 2.4s ease-in-out infinite;}
.foot-col h4{font-family:'Space Mono'; font-size:11px; letter-spacing:0.1em; color:var(--amber); margin-bottom:10px;}
.foot-col-center{text-align:center;}
.foot-col:last-child{text-align:center;}
.foot-links-grid{
  display:inline-grid; grid-auto-flow:column; grid-template-rows:repeat(2, auto);
  gap:6px 28px; text-align:left;
}
.foot-col-center .foot-links-grid{gap:6px 44px;}
.foot-links-grid a{
  position:relative; display:inline-block;
  font-family:'Bebas Neue'; font-size:16px; letter-spacing:0.08em; text-decoration:none;
  color:var(--cream-dim); padding:2px 2px; border-bottom:2px solid transparent; line-height:1;
  transition:color 0.25s ease, text-shadow 0.25s ease;
}
.foot-links-grid a::after{
  content:''; position:absolute; left:50%; right:50%; bottom:-3px; height:2px;
  background:var(--neon); border-radius:2px; box-shadow:0 0 8px rgba(245,196,51,0.8);
  transition:left 0.28s cubic-bezier(.2,.8,.2,1), right 0.28s cubic-bezier(.2,.8,.2,1);
}
.foot-links-grid a:hover{color:var(--neon); text-shadow:0 0 10px rgba(245,196,51,0.55);}
.foot-links-grid a:hover::after{left:0; right:0;}
.foot-links-grid a.active{color:var(--neon); animation:pbtnKwGlow 2.4s ease-in-out infinite;}
.foot-links-grid a.active::after{left:0; right:0;}
@media (max-width:920px){
  .foot-grid{grid-template-columns:1fr; gap:30px;}
  .foot-col-center{text-align:left;}
  .foot-col:last-child{text-align:left;}
  .foot-col-center .foot-links-grid{display:grid; gap:6px 28px;}
  .foot-col-center .foot-links-grid, .foot-col:last-child .foot-links-grid{display:grid;}
  .foot-tagline{white-space:normal;}
}
.fine{margin-top:10px; padding-top:8px; border-top:1px dashed var(--line); font-family:'Space Mono'; font-size:11px; color:var(--cream-dim); text-align:center;}

/* note banner for review purposes */
.dev-note{
  background:var(--brick); color:var(--cream); font-family:'Space Mono'; font-size:12px;
  text-align:center; padding:8px 16px;
}
@media (max-width:600px){
  .hero h1{font-size:36px;}
  .player-body{flex-wrap:wrap;}
}

/* ---------- CONTENIDO GENÉRICO (páginas/entradas sin plantilla propia) ---------- */
.site-main{padding:56px 0;}
.site-main .wrap{max-width:820px;}
.site-main h1{font-size:clamp(32px,5vw,52px); margin-bottom:18px;}
.site-main p{line-height:1.6; color:var(--cream-dim); margin:0 0 16px;}
.site-main a{color:var(--neon);}

/* ---------- Estado "activo" para los menús de WordPress (current-menu-item) ---------- */
.links .current-menu-item > a, .links .current_page_item > a{color:var(--neon); animation:pbtnKwGlow 2.4s ease-in-out infinite;}
.links .current-menu-item > a::after, .links .current_page_item > a::after{left:0; right:0;}
.mobile-links .current-menu-item > a, .mobile-links .current_page_item > a{color:var(--neon); padding-left:10px; animation:pbtnKwGlow 2.4s ease-in-out infinite;}
.foot-links-grid a.active{color:var(--neon); animation:pbtnKwGlow 2.4s ease-in-out infinite;}
.foot-links-grid a.active::after{left:0; right:0;}

/* ================================================================
   MEDIA + REPRODUCTOR — página /media/ y /media/videoclip/
   ================================================================ */

/* ---------- MEDIA HERO ---------- */
.mhero{
  position:relative; padding:48px 0 34px;
  background:
    radial-gradient(620px 340px at 50% 30%, rgba(224,138,52,0.14), transparent 62%),
    radial-gradient(1100px 420px at 15% -10%, rgba(224,138,52,0.35), transparent 60%),
    radial-gradient(700px 360px at 90% 0%, rgba(245,196,51,0.10), transparent 55%),
    var(--ink);
  border-bottom:1px solid var(--line);
}
.mhero .eyebrow{
  font-family:'Space Mono'; font-size:12px; letter-spacing:0.16em; color:var(--amber);
  text-transform:uppercase; margin-bottom:10px; display:block;
}
.mhero h1{font-size:clamp(38px,5.6vw,60px);}
.mhero h1 em{font-style:normal; color:var(--neon); animation:pbtnKwGlow 2.4s ease-in-out infinite;}
.mhero p.tag{color:var(--cream-dim); font-size:16px; max-width:56ch; margin-top:12px;}

/* ---------- SUBNAV ---------- */
.subnav{
  position:sticky; top:0; z-index:9; background:rgba(20,16,13,0.94); backdrop-filter:blur(6px);
  border-bottom:1px solid var(--line);
}
.subnav .wrap{display:flex; gap:26px; overflow-x:auto;}
.subnav a{
  font-family:'Bebas Neue'; font-size:17px; letter-spacing:0.05em; text-decoration:none;
  color:var(--cream-dim); padding:14px 2px; white-space:nowrap; border-bottom:2px solid transparent;
  transition:color 0.2s ease, border-color 0.2s ease;
}
.subnav a:hover, .subnav a.active{color:var(--neon); border-color:var(--neon);}

/* ---------- SECTION SCAFFOLD (Media) ---------- */
.msection{padding:48px 0; border-bottom:1px solid var(--line); scroll-margin-top:106px;}
.msection:last-of-type{border-bottom:none;}
.msection .section-head{
  display:flex; align-items:flex-end; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-bottom:24px;
}
.msection .section-head .count{font-family:'Space Mono'; font-size:12.5px; color:var(--cream-dim);}

/* ---------- FILTER BAR ---------- */
.filters{display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-bottom:26px;}
.filters select, .filters input{
  background:var(--ink-2); border:1px solid var(--line); color:var(--cream);
  font-family:'Space Mono'; font-size:12.5px; letter-spacing:0.03em;
  padding:9px 12px; border-radius:8px; cursor:pointer;
}
.filters select:focus, .filters input:focus{border-color:var(--neon); outline:none;}
.filters input{cursor:text; flex:1; min-width:160px;}
.filters .fnote{font-family:'Space Mono'; font-size:11px; color:var(--cream-dim); opacity:0.75;}

/* ---------- VIDEO ARCHIVE GRID ---------- */
.varchive-grid{display:grid; grid-template-columns:repeat(auto-fill, minmax(210px,1fr)); gap:18px;}
.vclip{
  border-radius:12px; overflow:hidden; border:1px solid var(--line); background:var(--ink-2);
  display:block; text-decoration:none; color:inherit; transition:transform 0.2s ease, border-color 0.2s ease;
}
.vclip:hover{transform:translateY(-3px); border-color:var(--neon);}
.vclip .thumb{height:120px; position:relative; overflow:hidden;}
.vclip .thumb img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
.vclip .thumb::after{content:''; position:absolute; inset:0; background:linear-gradient(180deg, rgba(10,8,6,0.05), rgba(10,8,6,0.55));}
.vclip .thumb .p{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  width:40px; height:40px; border-radius:50%; background:rgba(20,16,13,0.55); border:1.5px solid var(--neon);
  display:flex; align-items:center; justify-content:center; z-index:1;
}
.vclip .thumb .p::after{content:''; border-left:11px solid var(--neon); border-top:7px solid transparent; border-bottom:7px solid transparent; margin-left:3px;}
.vclip .thumb .tag{position:absolute; top:8px; left:8px; font-family:'Space Mono'; font-size:10px; background:var(--brick); padding:2px 7px; border-radius:4px; letter-spacing:0.06em; z-index:1;}
.vclip .thumb.vph{background:linear-gradient(135deg, var(--g1,var(--brick)), var(--g2,var(--brick-deep)));}
.vclip .thumb .vinit{position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-family:'Bebas Neue'; font-size:46px; letter-spacing:0.04em; color:rgba(243,234,217,0.16); z-index:0;}
.vclip .info{padding:10px 12px 12px;}
.vclip .info .song{font-size:14px; color:var(--cream); font-weight:700;}
.vclip .info .band{font-size:12px; color:var(--cream-dim); margin-top:2px;}
.vclip .info .country{font-size:10.5px; color:var(--amber); font-family:'Space Mono'; margin-top:5px; display:block; letter-spacing:0.04em;}

.pager{display:flex; align-items:center; justify-content:center; gap:16px; margin-top:22px;}
.pager .pgbtn{
  font-family:'Space Mono'; font-size:12px; letter-spacing:0.04em; color:var(--cream);
  background:var(--ink-2); border:1px solid var(--line); border-radius:8px; padding:8px 16px;
  cursor:pointer; transition:border-color .2s ease, color .2s ease;
}
.pager .pgbtn:hover:not(:disabled){border-color:var(--neon); color:var(--neon);}
.pager .pgbtn:disabled{opacity:0.35; cursor:default;}
.pager .pgstate{font-family:'Space Mono'; font-size:12px; color:var(--cream-dim); letter-spacing:0.04em; min-width:120px; text-align:center;}

/* ---------- CANAL (YouTube / cabecera de plataforma) ---------- */
.canal-head{display:flex; align-items:center; gap:16px; margin-bottom:26px; flex-wrap:wrap;}
.platform-avatar{
  width:64px; height:64px; border-radius:50%; flex:none;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 0 0 3px var(--ink-2), 0 0 0 4px var(--line);
}
.platform-avatar svg{width:34px; height:34px; display:block;}
.platform-avatar.instagram{background:linear-gradient(45deg,#f58529,#dd2a7b,#8134af,#515bd4);}
.platform-avatar.tiktok{background:#000;}
.platform-avatar.tiktok svg{width:30px; height:30px;}
.platform-avatar.youtube{background:#FF0000;}
.platform-avatar.youtube svg{width:30px; height:30px;}
.canal-head-text .name{font-family:'Bebas Neue'; font-size:22px; color:var(--cream); letter-spacing:0.03em;}
.canal-head-text .handle{font-family:'Space Mono'; font-size:12px; color:var(--cream-dim);}
.canal-subscribe{
  margin-left:auto; display:inline-flex; align-items:center; gap:8px; text-decoration:none;
  background:var(--brick); color:var(--cream); font-family:'Bebas Neue'; font-size:15px; letter-spacing:0.05em;
  padding:11px 20px; border-radius:9px; transition:background 0.2s ease; white-space:nowrap;
}
.canal-subscribe:hover{background:var(--brick-deep);}
.canal-grid{display:grid; grid-template-columns:repeat(auto-fill, minmax(230px,1fr)); gap:18px;}
.canal-card{
  border-radius:12px; overflow:hidden; border:1px solid var(--line); background:var(--ink-2);
  display:block; text-decoration:none; color:inherit; transition:transform 0.2s ease, border-color 0.2s ease;
}
.canal-card:hover{transform:translateY(-3px); border-color:var(--neon);}
.canal-card .thumb{height:128px; position:relative; overflow:hidden;}
.canal-card .thumb img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
.canal-card .thumb::after{content:''; position:absolute; inset:0; background:linear-gradient(180deg, rgba(10,8,6,0.05), rgba(10,8,6,0.5));}
.canal-card .thumb .p{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  width:40px; height:40px; border-radius:50%; background:rgba(20,16,13,0.55); border:1.5px solid var(--neon);
  display:flex; align-items:center; justify-content:center; z-index:1;
}
.canal-card .thumb .p::after{content:''; border-left:11px solid var(--neon); border-top:7px solid transparent; border-bottom:7px solid transparent; margin-left:3px;}
.canal-card .thumb .dur{
  position:absolute; bottom:7px; right:7px; font-family:'Space Mono'; font-size:10.5px; background:rgba(10,8,6,0.85);
  padding:2px 6px; border-radius:4px; z-index:1;
}
.canal-card .info{padding:10px 12px 12px;}
.canal-card .info .title{font-size:13.5px; color:var(--cream); font-weight:700; line-height:1.3; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;}
.canal-card .info .meta{font-size:11.5px; color:var(--cream-dim); font-family:'Space Mono'; margin-top:6px;}
.canal-foot{
  margin-top:18px; padding-top:16px; border-top:1px dashed var(--line);
  font-family:'Space Mono'; font-size:12.5px; color:var(--cream-dim); display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;
}
.canal-foot b{color:var(--neon);}

/* ---------- REELS / TIKTOK (cinta vertical) ---------- */
.reels-strip{
  display:flex; gap:16px; overflow-x:auto; padding:4px 24px 22px; margin:0 -24px;
  scroll-snap-type:x proximity;
}
/* Variante con más filas de miniaturas visibles a la vez (usada en Instagram):
   cuadrícula fija de 6 columnas que salta de línea (sin desplazamiento
   horizontal) — todas las filas quedan iguales, con 6 tarjetas cada una. */
.reels-strip--multi{
  display:grid; grid-template-columns:repeat(6, 1fr); overflow-x:visible;
}
.reels-strip--multi .reel-card{width:100%;}
.reels-strip::-webkit-scrollbar{height:8px;}
.reels-strip::-webkit-scrollbar-thumb{background:var(--brick); border-radius:99px;}
.reel-card{
  flex:none; width:160px; aspect-ratio:9/16; scroll-snap-align:start; position:relative;
  border-radius:14px; overflow:hidden; border:1px solid var(--line); background:var(--ink-2);
  display:block; text-decoration:none; color:inherit; transition:transform 0.2s ease, border-color 0.2s ease;
}
.reel-card:hover{transform:translateY(-3px); border-color:var(--neon);}
.reel-card img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
.reel-card::after{content:''; position:absolute; inset:0; background:linear-gradient(180deg, rgba(10,8,6,0.05) 55%, rgba(10,8,6,0.75) 100%);}
.reel-card .p{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  width:38px; height:38px; border-radius:50%; background:rgba(20,16,13,0.55); border:1.5px solid var(--neon);
  display:flex; align-items:center; justify-content:center; z-index:1;
}
.reel-card .p::after{content:''; border-left:11px solid var(--neon); border-top:7px solid transparent; border-bottom:7px solid transparent; margin-left:3px;}
.reel-card .views{
  position:absolute; left:9px; bottom:9px; z-index:1; font-family:'Space Mono'; font-size:11px; color:var(--cream);
  display:flex; align-items:center; gap:4px;
}
.reel-card .views::before{content:'▶'; font-size:8px; color:var(--neon);}
.reel-card.soon{align-items:center; justify-content:center; display:flex; flex-direction:column; gap:8px; text-align:center; color:var(--cream-dim); padding:0 12px;}
.reel-card.soon span{font-family:'Space Mono'; font-size:10.5px; letter-spacing:0.03em;}

/* ---------- REPRODUCTOR (/media/videoclip/) ---------- */
.vhero{padding:28px 0 48px;}
.crumbs{
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  font-family:'Space Mono'; font-size:12px; color:var(--cream-dim);
  margin-bottom:20px; letter-spacing:0.03em;
}
.crumbs a{text-decoration:none; color:var(--cream-dim); transition:color 0.2s ease;}
.crumbs a:hover{color:var(--neon);}
.crumb-sep{opacity:0.5;}
.crumb-current{color:var(--amber);}

.player-frame{
  position:relative; width:100%; aspect-ratio:16/9; border-radius:18px; overflow:hidden;
  border:1px solid var(--line); background:var(--ink-2);
  box-shadow:0 40px 80px -36px rgba(0,0,0,0.85), inset 0 0 0 1px rgba(255,255,255,0.03);
}
.player-frame iframe, .player-frame .tt-embed-wrap{position:absolute; inset:0; width:100%; height:100%; border:0;}
.player-frame.vertical{aspect-ratio:9/16; max-width:380px; margin:0 auto;}
.player-frame .pending-note{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center; text-align:center;
  padding:24px; font-family:'Space Mono'; font-size:13px; color:var(--cream-dim); line-height:1.6;
}

.video-meta{
  display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-end; gap:20px;
  margin-top:26px; padding-bottom:36px; border-bottom:1px solid var(--line);
}
.vm-text .eyebrow{
  font-family:'Space Mono'; font-size:12px; letter-spacing:0.14em; color:var(--amber);
  text-transform:uppercase; display:block; margin-bottom:8px;
}
.vm-text h1{font-size:clamp(30px,4.4vw,48px);}
.vm-band{color:var(--cream-dim); font-size:16px; margin-top:6px;}
.vm-country{color:var(--amber); font-family:'Space Mono'; font-size:12px; letter-spacing:0.03em;}
.vm-views{font-family:'Space Mono'; font-size:12px; color:var(--cream-dim);}
.vm-views::before{content:'▶ '; color:var(--amber);}
.vm-desc{
  color:var(--cream-dim); font-size:14px; line-height:1.6; max-width:64ch; margin-top:14px;
  padding-top:14px; border-top:1px dashed var(--line);
}
.vm-actions{display:flex; gap:12px; flex-wrap:wrap;}
.btn-ghost, .btn-solid{
  font-family:'Bebas Neue'; font-size:15px; letter-spacing:0.05em; text-decoration:none;
  padding:12px 20px; border-radius:9px; display:inline-flex; align-items:center; gap:6px;
  transition:all 0.2s ease; white-space:nowrap; border:none; cursor:pointer;
}
.btn-ghost{border:1px solid var(--amber); color:var(--amber); background:none;}
.btn-ghost:hover{background:rgba(224,138,52,0.12);}
.btn-solid{background:var(--neon); color:var(--ink);}
.btn-solid:hover{background:var(--focus);}

.suggestions{padding:44px 0 60px;}
.suggestions .section-head{display:flex; align-items:baseline; justify-content:space-between; gap:16px; margin-bottom:16px;}
.sugg-reel{overflow:hidden; margin:0 -24px; padding:4px 0 6px;}
.sugg-grid{
  display:flex; flex:none; width:max-content; gap:16px; padding:0 24px;
  animation:suggMarquee 45s linear infinite; transform:translateZ(0); backface-visibility:hidden;
}
.sugg-reel:hover .sugg-grid{animation-play-state:paused;}
@keyframes suggMarquee{from{transform:translateX(0);}to{transform:translateX(-50%);}}
@media (prefers-reduced-motion: reduce){
  .sugg-grid{animation:none;}
  .sugg-reel{overflow-x:auto;}
}
.sclip{
  flex:none; width:230px;
  border:1px solid var(--line); border-radius:12px; overflow:hidden; background:var(--ink-2);
  cursor:pointer; text-align:left; padding:0; color:inherit; font:inherit;
  transition:transform 0.2s ease, border-color 0.2s ease;
}
.sclip:hover{transform:translateY(-3px); border-color:var(--neon);}
.sclip.active{border-color:var(--neon); box-shadow:0 0 0 1px var(--neon);}
.sclip .thumb{height:130px; position:relative; overflow:hidden;}
.sclip .thumb img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
.sclip .thumb::after{content:''; position:absolute; inset:0; background:linear-gradient(180deg, rgba(10,8,6,0.05), rgba(10,8,6,0.5));}
.sclip .thumb .p{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  width:38px; height:38px; border-radius:50%; background:rgba(20,16,13,0.55); border:1.5px solid var(--neon);
  display:flex; align-items:center; justify-content:center; z-index:1;
}
.sclip .thumb .p::after{content:''; border-left:11px solid var(--neon); border-top:7px solid transparent; border-bottom:7px solid transparent; margin-left:3px;}
.sclip .thumb.vph{background:linear-gradient(135deg, var(--g1,var(--brick)), var(--g2,var(--brick-deep)));}
.sclip .thumb .vinit{position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-family:'Bebas Neue'; font-size:38px; letter-spacing:0.04em; color:rgba(243,234,217,0.16); z-index:0;}
.sclip .info{padding:10px 12px 12px;}
.sclip .info .song{font-size:14px; color:var(--cream); font-weight:700;}
.sclip .info .band{font-size:12px; color:var(--cream-dim); margin-top:2px;}
.sclip .info .country{font-size:10.5px; color:var(--amber); font-family:'Space Mono'; margin-top:4px; display:block; letter-spacing:0.04em;}

@media (max-width:600px){
  .ornament-divider .odl{max-width:70px;}
  .canal-subscribe{margin-left:0; width:100%; justify-content:center;}
  .video-meta{flex-direction:column; align-items:flex-start;}
  .vm-actions{width:100%;}
  .btn-ghost, .btn-solid{flex:1; justify-content:center;}
}

/* ---------- MEDIA: móvil — archivadores compactos y miniaturas más pequeñas ----------
   (Videoclips/YouTube en 2 columnas + 10 por página vía JS; Instagram no se toca aquí,
   Pedro pidió dejarlo tal cual está). */
@media (max-width:640px){
  .filters{gap:8px;}
  .filters select{
    flex:1 1 auto; min-width:0; font-size:11px; padding:8px 8px;
  }
  .filters input{flex:1 1 100%; min-width:0; order:3;}

  .varchive-grid, .canal-grid{grid-template-columns:repeat(2, 1fr); gap:10px;}

  .vclip .thumb{height:82px;}
  .vclip .thumb .p{width:32px; height:32px;}
  .vclip .thumb .vinit{font-size:34px;}
  .vclip .info{padding:8px 9px 10px;}
  .vclip .info .song{font-size:12px;}
  .vclip .info .band{font-size:10.5px;}
  .vclip .info .country{font-size:9px; margin-top:3px;}

  .canal-card .thumb{height:86px;}
  .canal-card .thumb .p{width:32px; height:32px;}
  .canal-card .info{padding:8px 9px 10px;}
  .canal-card .info .title{font-size:11px;}
  .canal-card .info .meta{font-size:9.5px; margin-top:4px;}
}

/* =========================================================================
   NOTICIAS — listado (/noticias/) y ficha de artículo (single.php)
   Puerto 1:1 de la maqueta aprobada; .filters/.crumbs/.suggestions/.sugg-*/
   .btn-ghost/.btn-solid/.section-head ya existen (Media/reproductor) y se
   reutilizan tal cual.
   ========================================================================= */

/* ---------- Hero de /noticias/ ---------- */
.nhero{padding:28px 0 34px;}
.nhero h1{font-size:clamp(38px,5.6vw,60px);}
.nhero h1 em{font-style:normal; color:var(--neon); animation:pbtnKwGlow 2.4s ease-in-out infinite;}
.nhero p.tag{color:var(--cream-dim); font-size:16px; max-width:56ch; margin-top:12px;}

/* ---------- Filtros: pastillas de etiqueta (además de .filters ya existente) ---------- */
.tag-pills{display:flex; gap:8px; flex-wrap:wrap;}
.tpill{
  font-family:'Space Mono'; font-size:11.5px; letter-spacing:0.04em; color:var(--cream-dim);
  background:var(--ink-2); border:1px solid var(--line); border-radius:99px; padding:8px 15px;
  cursor:pointer; transition:background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.tpill:hover{border-color:var(--neon); color:var(--cream);}
.tpill.active{background:var(--brick); border-color:var(--brick); color:var(--cream);}

/* ---------- Noticia destacada ---------- */
.nsection{padding:8px 0 48px;}
.featured{
  display:grid; grid-template-columns:1.15fr 1fr; gap:0; border:1px solid var(--line); border-radius:16px;
  overflow:hidden; background:var(--ink-2); text-decoration:none; color:inherit;
  transition:border-color 0.2s ease, transform 0.2s ease; margin-top:22px;
}
.featured:hover{border-color:var(--neon); transform:translateY(-2px);}
.featured .fimg{position:relative; min-height:340px; overflow:hidden; background:var(--ink-3);}
.featured .fimg img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
.featured .fimg::after{content:''; position:absolute; inset:0; background:linear-gradient(90deg, rgba(10,8,6,0.05), rgba(10,8,6,0.15) 70%, rgba(10,8,6,0.55));}
.featured .fbody{padding:34px 36px; display:flex; flex-direction:column; justify-content:center; gap:14px;}
.featured .ftag{
  align-self:flex-start; font-family:'Space Mono'; font-size:11px; letter-spacing:0.08em; color:var(--ink);
  background:var(--neon); padding:5px 11px; border-radius:5px; text-transform:uppercase;
}
.featured h2{font-size:clamp(28px,3.2vw,40px); color:var(--cream);}
.featured h2 em{font-style:normal; color:var(--neon); animation:pbtnKwGlow 2.4s ease-in-out infinite;}
.featured p.excerpt{color:var(--cream-dim); font-size:15px; line-height:1.55;}
.featured .fmeta{
  display:flex; gap:14px; flex-wrap:wrap; font-family:'Space Mono'; font-size:11.5px; color:var(--cream-dim);
  border-top:1px dashed var(--line); padding-top:14px; margin-top:4px;
}
.featured .fmeta b{color:var(--amber);}
@media (max-width:820px){
  .featured{grid-template-columns:1fr;}
  .featured .fimg{min-height:220px;}
}

/* ---------- Aviso "sonó en la radio" (listado y artículo) ---------- */
.rnb-badge{
  display:inline-flex; align-items:flex-start; gap:9px; font-family:'Space Mono'; font-size:12.5px; line-height:1.5;
  color:var(--cream); background:var(--brick); border:1px solid var(--brick-deep); border-radius:10px;
  padding:12px 15px; margin:2px 0 0; max-width:100%;
}
.rnb-badge .dot{width:7px; height:7px; border-radius:50%; background:var(--neon); box-shadow:0 0 6px var(--neon); flex:none; margin-top:6px;}
.featured .rnb-badge{margin-top:2px; align-self:flex-start;}

/* ---------- Cuadrícula de noticias ---------- */
#newsGrid, #vGrid, #ytGrid, #igGrid, #tkGrid{scroll-margin-top:106px;}
.news-grid{
  display:grid; grid-template-columns:repeat(4, 1fr); gap:18px; margin-top:26px;
}
@media (max-width:1080px){
  .news-grid{grid-template-columns:repeat(2, 1fr);}
}
@media (max-width:680px){
  .news-grid{grid-template-columns:repeat(2, 1fr); gap:12px;}
  .ncard .thumb{height:110px;}
  .ncard .thumb .tag{font-size:9px; padding:2px 7px; top:7px; left:7px;}
  .ncard .thumb .date{font-size:9px; bottom:6px; right:7px;}
  .ncard .info{padding:10px 11px 12px; gap:6px;}
  .ncard .info h3{font-size:13px; line-height:1.3;}
  .ncard .info p.excerpt{display:none;}
  .ncard .info .rnb-mini{font-size:9.5px;}
}
.ncard{
  border-radius:14px; overflow:hidden; border:1px solid var(--line); background:var(--ink-2);
  display:flex; flex-direction:column; text-decoration:none; color:inherit;
  transition:transform 0.2s ease, border-color 0.2s ease;
}
.ncard:hover{transform:translateY(-4px); border-color:var(--neon);}
.ncard .thumb{height:190px; position:relative; overflow:hidden; background:var(--ink-3);}
.ncard .thumb img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform 0.4s ease;}
.ncard:hover .thumb img{transform:scale(1.05);}
.ncard .thumb::after{content:''; position:absolute; inset:0; background:linear-gradient(180deg, rgba(10,8,6,0.02), rgba(10,8,6,0.55));}
.ncard .thumb .tag{
  position:absolute; top:10px; left:10px; font-family:'Space Mono'; font-size:10px; letter-spacing:0.06em;
  background:var(--brick); color:var(--cream); padding:3px 9px; border-radius:5px; z-index:1; text-transform:uppercase;
}
.ncard .thumb .date{
  position:absolute; bottom:9px; right:10px; font-family:'Space Mono'; font-size:10.5px; color:var(--cream-dim); z-index:1;
}
.ncard .info{padding:16px 17px 18px; display:flex; flex-direction:column; gap:9px; flex:1;}
.ncard .info h3{font-size:20px; color:var(--cream); line-height:1.08;}
.ncard .info p.excerpt{font-size:13px; color:var(--cream-dim); line-height:1.5; flex:1;}
.ncard .rnb-mini{
  display:inline-flex; align-items:center; gap:6px; font-family:'Space Mono'; font-size:10.5px;
  color:var(--neon); border:1px solid rgba(245,196,51,0.4); border-radius:99px; padding:5px 10px; align-self:flex-start;
}
.ncard .rnb-mini .dot{width:5px; height:5px; border-radius:50%; background:var(--neon); flex:none;}

/* ---------- Variante mini del .ncard: cinta de sugerencias del artículo ---------- */
.ncard.ncard--sugg{flex:none; width:230px; cursor:pointer;}
.ncard.ncard--sugg .thumb{height:130px;}
.ncard.ncard--sugg .info{padding:11px 13px 13px; gap:0;}
.ncard.ncard--sugg .info .t{font-size:14.5px; color:var(--cream); font-weight:700; line-height:1.3;}

/* ---------- CTA "Colabora en Noticias" ---------- */
.contact-cta{text-align:center; padding:56px 0;}
.contact-cta p{color:var(--cream-dim); font-size:15px; max-width:60ch; margin:12px auto 20px;}
.contact-cta p strong{color:var(--cream);}

/* ---------- Ficha de artículo (single.php) ---------- */
.art-wrap{max-width:820px; margin:0 auto; padding:0 24px;}
.art-head{padding:22px 0 10px;}
.art-tag{
  display:inline-block; font-family:'Space Mono'; font-size:11px; letter-spacing:0.08em; color:var(--ink);
  background:var(--neon); padding:5px 12px; border-radius:5px; text-transform:uppercase; margin-bottom:16px;
}
.art-head h1{font-size:clamp(30px,5vw,46px); color:var(--cream);}
.art-meta{
  display:flex; gap:16px; flex-wrap:wrap; font-family:'Space Mono'; font-size:12px; color:var(--cream-dim);
  margin-top:16px; padding-bottom:20px; border-bottom:1px solid var(--line);
}
.art-meta b{color:var(--amber);}
.art-hero{margin:26px 0; border-radius:14px; overflow:hidden; border:1px solid var(--line);}
.art-hero img{width:100%; height:auto; display:block; max-height:460px; object-fit:cover;}
.art-body{font-size:17px; line-height:1.75; color:var(--cream); margin-top:26px;}
.art-body p{margin:0 0 20px;}
.art-body strong{color:var(--cream); font-weight:700;}
.art-body em{color:var(--cream); font-style:italic;}
.art-body a{color:var(--neon); text-decoration:underline;}
.art-links{
  margin-top:8px; padding:20px; border:1px solid var(--line); border-radius:12px; background:var(--ink-2);
  font-size:14.5px; display:flex; flex-wrap:wrap; gap:8px 12px; align-items:center;
}
.art-links b{font-family:'Space Mono'; font-size:11px; letter-spacing:0.06em; color:var(--amber); text-transform:uppercase; width:100%;}
.art-links a{color:var(--neon); text-decoration:none; border-bottom:1px dotted var(--neon);}
.art-links a:hover{color:var(--cream);}
.art-links span{color:var(--cream-dim);}
.art-actions{display:flex; gap:14px; flex-wrap:wrap; margin:34px 0 8px;}

@media (max-width:600px){
  .art-actions{width:100%;}
  .art-actions .btn-ghost, .art-actions .btn-solid{flex:1; justify-content:center;}
}

/* ---------- PÁGINA RADIO ---------- */
@keyframes eqBar{0%,100%{height:14%;}50%{height:88%;}}
@keyframes chatIn{from{opacity:0; transform:translateY(6px);}to{opacity:1; transform:translateY(0);}}
@keyframes floatUp{0%{transform:translateY(0) scale(0.8); opacity:1;}100%{transform:translateY(-120px) scale(1.3); opacity:0;}}
@keyframes pulseDot{0%,100%{opacity:1;} 50%{opacity:0.35;}}
@keyframes monthMarquee{from{transform:translateX(0);}to{transform:translateX(-50%);}}
@keyframes modalIn{from{opacity:0; transform:translateY(12px) scale(0.98);}to{opacity:1; transform:translateY(0) scale(1);}}

.rhero{
  position:relative; padding:44px 0 40px; overflow:hidden;
  background:
    radial-gradient(620px 340px at 50% 30%, rgba(224,138,52,0.14), transparent 62%),
    radial-gradient(1100px 460px at 15% -10%, rgba(154,63,39,0.6), transparent 60%),
    radial-gradient(800px 460px at 95% 10%, rgba(245,196,51,0.14), transparent 55%),
    var(--ink);
  border-bottom:1px solid var(--line);
}
.rhero-eq{position:absolute; inset:auto 0 0 0; height:120px; display:flex; align-items:flex-end; justify-content:flex-start; max-width:1180px; margin:0 auto; padding:0 24px; gap:3px; opacity:0.18; pointer-events:none; overflow:hidden;}
.rhero-eq span{width:6px; background:linear-gradient(180deg, var(--neon), var(--brick)); border-radius:3px 3px 0 0; animation:eqBar 1.1s ease-in-out infinite;}
.rhero-top{display:grid; grid-template-columns:1fr 1fr; gap:28px; align-items:stretch; position:relative;}
@media (max-width:940px){ .rhero-top{grid-template-columns:1fr;} }
.rhero-logo-row{display:flex; align-items:center; justify-content:center;}
.rhero-horizontal{max-width:94%; max-height:100%; width:auto; height:auto; object-fit:contain; display:block; filter:drop-shadow(0 8px 24px rgba(0,0,0,0.5));}
@media (max-width:940px){ .rhero-horizontal{max-height:260px;} }
.rhero-title{margin-top:30px;}
.rhero-title h1{font-size:clamp(38px,5.4vw,64px); margin-bottom:6px;}
.rhero-title h1 em{font-style:normal; color:var(--neon); animation:pbtnKwGlow 2.4s ease-in-out infinite;}
.rhero-sub{color:var(--cream-dim); font-size:15.5px; max-width:64ch; margin-top:10px;}
.rhero-sub p{margin:0 0 7px; text-align:justify; line-height:1.36;}
.rhero-sub p:last-child{margin-bottom:0;}
.next-chip{
  display:inline-flex; align-items:center; gap:8px; margin-top:18px; font-family:'Space Mono'; font-size:12px;
  color:var(--cream-dim); border:1px dashed var(--line); border-radius:99px; padding:7px 14px;
}
.next-chip b{color:var(--neon); font-family:'Bebas Neue'; font-size:14px; letter-spacing:0.02em;}

/* ---------- STICKY MINI PLAYER ---------- */
.mini-player{
  position:fixed; left:0; right:0; bottom:0; z-index:40; transform:translateY(110%); transition:transform 0.3s ease;
  background:linear-gradient(180deg, rgba(20,16,13,0.85), var(--ink-3)); backdrop-filter:blur(10px);
  border-top:1px solid var(--line); box-shadow:0 -14px 34px -18px rgba(0,0,0,0.7);
}
.mini-player.show{transform:translateY(0);}
.mini-wrap{max-width:1180px; margin:0 auto; padding:10px 24px; display:flex; align-items:center; gap:14px;}
.mini-vinyl{width:40px; height:40px; border-radius:50%; flex:none; position:relative; cursor:pointer; border:none; padding:0; background:transparent;}
.mini-disc{
  position:absolute; inset:0; border-radius:50%; background:#0a0a0a; overflow:hidden;
  animation:spinVinyl 5s linear infinite; animation-play-state:paused; box-shadow:0 0 0 2px rgba(245,196,51,0.14);
}
.mini-vinyl.playing .mini-disc{animation-play-state:running;}
.mini-disc img{position:absolute; top:3px; left:3px; width:calc(100% - 6px); height:calc(100% - 6px); border-radius:50%; object-fit:cover;}
.mini-vinyl .mini-ic{
  position:absolute; right:-2px; bottom:-2px; width:14px; height:14px; border-radius:50%;
  background:var(--neon); display:flex; align-items:center; justify-content:center; z-index:2;
}
.mini-vinyl .mini-ic::after{content:''; border-left:5px solid var(--ink); border-top:3px solid transparent; border-bottom:3px solid transparent; margin-left:1px;}
.mini-vinyl.playing .mini-ic::after{content:''; width:2px; height:5px; border-left:2px solid var(--ink); border-right:2px solid var(--ink); border-top:none; border-bottom:none; margin-left:0;}
.mini-info{flex:1; min-width:0;}
.mini-show{font-family:'Space Mono'; font-size:10px; color:var(--amber); letter-spacing:0.08em; display:block;}
.mini-track{font-family:'Bebas Neue'; font-size:16px; color:var(--cream); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.mini-links{display:flex; gap:10px; flex:none;}
.mini-links a{font-family:'Space Mono'; font-size:11px; color:var(--cream-dim); text-decoration:none; border:1px solid var(--line); border-radius:99px; padding:6px 12px; white-space:nowrap;}
.mini-links a:hover{color:var(--neon); border-color:var(--neon);}
@media (max-width:640px){ .mini-links a:not(.mini-top){display:none;} }

/* ---------- PARRILLA SEMANAL ---------- */
.parrilla{display:grid; grid-template-columns:repeat(7,1fr); gap:10px;}
@media (max-width:900px){ .parrilla{grid-template-columns:repeat(2,1fr);} }
@media (max-width:520px){ .parrilla{grid-template-columns:1fr;} }
.day-col{display:flex; flex-direction:column; gap:8px;}
.day-col-head{
  font-family:'Space Mono'; font-size:11px; letter-spacing:0.1em; color:var(--cream-dim); text-align:center;
  padding:6px 0; border-bottom:1px solid var(--line); text-transform:uppercase;
}
.day-col.today .day-col-head{color:var(--neon); border-bottom-color:var(--neon);}
.slot{
  background:var(--ink-2); border:1px solid var(--line); border-radius:10px; padding:10px 10px; cursor:pointer;
  transition:border-color 0.2s ease, transform 0.15s ease; text-align:left; width:100%; color:inherit; font:inherit;
}
.slot:hover{border-color:var(--amber); transform:translateY(-2px);}
.slot .t{font-family:'Space Mono'; font-size:10.5px; color:var(--amber);}
.slot .n{font-family:'Bebas Neue'; font-size:15px; color:var(--cream); line-height:1.1; margin-top:3px;}
.slot .c{font-size:11px; color:var(--cream-dim); margin-top:2px;}
.slot.live{background:linear-gradient(160deg, var(--brick), var(--brick-deep)); border-color:var(--neon);}
.slot.live .t{color:var(--neon); display:flex; align-items:center; gap:5px;}
.slot.live .t .dot{width:6px;height:6px;border-radius:50%;background:var(--neon); animation:pulse 1.6s ease-in-out infinite;}
.slot.empty{background:none; border-style:dashed; cursor:default; opacity:0.6;}
.slot.empty:hover{transform:none; border-color:var(--line);}
.slot.empty .n{color:var(--cream-dim); font-size:13px;}

/* ---------- DIRECTORIO DE PROGRAMAS ---------- */
.programs-grid{display:grid; grid-template-columns:1fr 1fr; gap:14px;}
@media (max-width:760px){ .programs-grid{grid-template-columns:1fr;} }
.prog-card{background:var(--ink-2); border:1px solid var(--line); border-radius:14px; overflow:hidden; transition:border-color 0.2s ease, transform 0.2s ease;}
.prog-card:hover{border-color:var(--amber); transform:translateY(-2px);}
.prog-card.live{background:linear-gradient(160deg, var(--brick), var(--brick-deep)); border-color:var(--neon);}
.prog-card.live:hover{border-color:var(--neon);}
.prog-card.live .prog-head-text .name{color:var(--neon);}
.prog-card.live .prog-head-text .name .dot{width:6px; height:6px; border-radius:50%; background:var(--neon); display:inline-block; margin-right:6px; animation:pulse 1.6s ease-in-out infinite; vertical-align:middle;}
.prog-card.live .prog-head-text .meta{color:var(--cream);}
.prog-head{
  display:flex; align-items:center; gap:12px; padding:14px; cursor:pointer; background:none; border:none; width:100%;
  text-align:left; color:inherit; font:inherit;
}
.prog-logo{
  width:46px; height:46px; border-radius:11px; flex:none; object-fit:contain;
  display:flex; align-items:center; justify-content:center;
  font-family:'Bebas Neue'; font-size:19px; color:var(--cream); background:linear-gradient(135deg, var(--g1), var(--g2));
}
img.prog-logo{background:var(--ink); padding:5px; box-sizing:border-box;}
.prog-head-text{flex:1; min-width:0;}
.prog-head-text .name{font-family:'Bebas Neue'; font-size:16.5px; color:var(--cream); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.prog-head-text .meta{font-size:11px; color:var(--cream-dim); margin-top:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.prog-chevron{font-family:'Space Mono'; font-size:16px; color:var(--amber); flex:none;}

.prog-modal{position:fixed; inset:0; z-index:1000; display:none; align-items:center; justify-content:center; padding:24px;}
.prog-modal.open{display:flex;}
.prog-modal-backdrop{position:absolute; inset:0; background:rgba(10,7,5,0.78); backdrop-filter:blur(3px);}
.prog-modal-card{
  position:relative; z-index:1; width:100%; max-width:620px; max-height:88vh; overflow-y:auto;
  background:linear-gradient(160deg, var(--ink-3), var(--ink-2)); border:1px solid var(--line); border-radius:20px;
  padding:32px; animation:modalIn 0.25s ease;
}
.prog-modal-close{
  position:absolute; top:16px; right:16px; width:36px; height:36px; border-radius:50%; border:1px solid var(--line);
  background:var(--ink); color:var(--cream); font-size:20px; line-height:1; cursor:pointer; display:flex; align-items:center; justify-content:center;
}
.prog-modal-close:hover{border-color:var(--amber); color:var(--amber);}
.prog-modal-top{display:flex; align-items:center; gap:18px; margin-bottom:8px;}
.prog-modal-logo{
  width:108px; height:108px; border-radius:20px; flex:none; object-fit:contain; display:flex; align-items:center; justify-content:center;
  font-family:'Bebas Neue'; font-size:44px; color:var(--cream); background:linear-gradient(135deg, var(--g1), var(--g2));
}
img.prog-modal-logo{background:var(--ink); padding:12px; box-sizing:border-box;}
.prog-modal-logo.wide{width:220px; height:108px; border-radius:16px;}
.prog-modal-logo.boss{width:168px; height:168px; margin-top:-54px; border:4px solid var(--ink-2); box-shadow:0 10px 28px rgba(0,0,0,.55); position:relative; z-index:2; border-radius:24px;}
img.prog-modal-logo.boss{padding:0;}
.prog-modal-title{font-family:'Bebas Neue'; font-size:30px; color:var(--cream); line-height:1.05;}
.prog-modal-live{color:var(--neon); font-family:'Space Mono'; font-size:13px; margin-left:8px;}
.prog-modal-sched{font-family:'Space Mono'; font-size:12.5px; color:var(--amber); margin-top:6px;}
.prog-modal-photos{display:flex; gap:2px; margin:-32px -32px 24px; border-radius:20px 20px 0 0; overflow:hidden;}
.prog-modal-photo-item{flex:1 1 0; display:flex; flex-direction:column; min-width:0;}
.prog-modal-photo{width:100%; aspect-ratio:5/4; object-fit:cover; object-position:center 18%; display:block; background:var(--ink);}
div.prog-modal-photo{display:flex; align-items:center; justify-content:center; font-family:'Bebas Neue'; font-size:48px; color:var(--cream); background:linear-gradient(135deg, var(--g2), var(--g1));}
.prog-modal-photo-label{font-family:'Bebas Neue'; font-size:15px; letter-spacing:0.02em; color:var(--cream); background:var(--ink-2); text-align:center; padding:9px 8px; border-top:1px solid var(--line);}
.prog-modal-desc{font-size:14.5px; color:var(--cream-dim); line-height:1.6;}
@media (max-width:560px){
  .prog-modal-card{padding:24px 20px;}
  .prog-modal-logo{width:80px; height:80px; font-size:32px;}
  .prog-modal-logo.wide{width:150px; height:72px;}
  .prog-modal-logo.boss{width:110px; height:110px; margin-top:-34px; border-width:3px; border-radius:18px;}
  img.prog-modal-logo.boss{padding:0;}
  .prog-modal-title{font-size:24px;}
  .prog-modal-photos{margin:-24px -20px 18px;}
  .prog-modal-photo-label{font-size:13px; padding:7px 6px;}
}

/* ---------- PARTICIPACIÓN ---------- */
.participa-top{display:grid; grid-template-columns:1fr 1fr; gap:20px; align-items:stretch;}
@media (max-width:940px){ .participa-top{grid-template-columns:1fr;} }
.poll-card{justify-content:center;}
.poll-card .poll{margin-top:2px;}
.poll-card .poll-opt{padding:13px 14px; font-size:14.5px;}
.req-section{margin-top:20px;}
#chat, #encuesta, #peticiones{scroll-margin-top:90px;}
.req-list{display:flex; flex-direction:column; gap:8px; font-size:13px; max-height:190px; overflow-y:auto; padding-right:4px;}
.req-list .r{display:flex; justify-content:space-between; align-items:center; gap:10px; color:var(--cream-dim); animation:chatIn 0.3s ease;}
.req-list .r b{color:var(--cream); font-weight:700;}
.req-list .r .s{font-family:'Space Mono'; font-size:10.5px; color:var(--amber); flex:none;}
.r-right{display:flex; align-items:center; gap:8px; flex:none;}
.r-vote{
  display:flex; align-items:center; gap:4px; background:var(--ink); border:1px solid var(--line); color:var(--cream-dim);
  border-radius:99px; padding:3px 10px; font-family:'Space Mono'; font-size:10.5px; cursor:pointer; transition:border-color 0.15s ease, color 0.15s ease; flex:none;
}
.r-vote:hover{border-color:var(--neon); color:var(--cream);}
.r-vote.voted{border-color:var(--neon); color:var(--neon); cursor:default;}
.r-vote .rv-ic{font-weight:700;}

.participa-pulse{
  display:flex; flex-wrap:wrap; align-items:center; gap:10px 14px; margin:18px 0 24px; padding:11px 18px;
  background:var(--ink-2); border:1px solid var(--line); border-radius:99px; font-family:'Space Mono'; font-size:11.5px; color:var(--cream-dim);
}
.participa-pulse .pulse-item{display:flex; align-items:center; gap:6px; white-space:nowrap;}
.participa-pulse .pulse-item b{color:var(--cream); font-weight:700;}
.participa-pulse .dot{width:6px; height:6px; border-radius:50%; background:#5fd97a; box-shadow:0 0 0 3px rgba(95,217,122,0.18); flex:none; animation:pulseDot 1.8s ease-in-out infinite;}
.participa-pulse .pulse-sep{color:var(--line); flex:none;}
@media (max-width:700px){ .participa-pulse{border-radius:14px;} }

/* chat en vivo */
.chat-card{display:flex; flex-direction:column; height:100%; position:relative;}
.chat-head{display:flex; align-items:center; justify-content:space-between; gap:10px;}
.chat-online{display:flex; align-items:center; gap:6px; font-family:'Space Mono'; font-size:10.5px; color:var(--cream-dim); flex:none; white-space:nowrap;}
.chat-online .dot{width:6px; height:6px; border-radius:50%; background:#5fd97a; box-shadow:0 0 0 3px rgba(95,217,122,0.18); flex:none;}
.chat-panel{display:flex; flex-direction:column; gap:10px; height:280px; overflow-y:auto; padding-right:4px; scroll-behavior:smooth;}
.chat-msg{font-size:13px; display:flex; gap:8px; align-items:flex-start; animation:chatIn 0.25s ease; position:relative; padding-right:20px;}
.chat-avatar{
  width:24px; height:24px; border-radius:50%; flex:none; display:flex; align-items:center; justify-content:center;
  font-family:'Bebas Neue'; font-size:12px; color:var(--ink); margin-top:1px;
}
.chat-msg-body{min-width:0;}
.chat-msg .u{font-weight:700; margin-right:5px;}
.chat-msg .txt{color:var(--cream-dim); word-break:break-word;}
.chat-report{
  position:absolute; right:0; top:1px; background:none; border:none; color:var(--cream-dim); opacity:0; cursor:pointer;
  font-size:12px; transition:opacity 0.15s ease; padding:2px; line-height:1;
}
.chat-msg:hover .chat-report{opacity:0.5;}
.chat-report:hover{opacity:1 !important; color:var(--amber);}
.chat-gate{border:1px dashed var(--line); border-radius:10px; padding:14px; text-align:center; display:flex; flex-direction:column; gap:9px; margin-top:auto;}
.chat-gate form{display:flex; gap:8px;}
.chat-gate .chat-rules{font-size:11px; color:var(--cream-dim); margin:0;}
.chat-form{margin-top:auto;}
.chat-form[hidden],.chat-meta[hidden],.chat-gate[hidden]{display:none;}
.chat-meta{font-size:11px; color:var(--cream-dim); margin-top:2px; display:flex; align-items:center; gap:6px; flex-wrap:wrap;}
.chat-meta b{color:var(--cream); font-weight:700;}
.chat-meta button{background:none; border:none; color:var(--amber); font-size:11px; cursor:pointer; padding:0; text-decoration:underline; font-family:'Karla';}
.chat-toast{
  position:absolute; left:50%; bottom:10px; transform:translateX(-50%) translateY(6px); opacity:0;
  background:var(--ink); border:1px solid var(--line); color:var(--cream); font-size:11.5px; padding:7px 14px; border-radius:99px;
  pointer-events:none; transition:opacity 0.2s ease, transform 0.2s ease; white-space:nowrap; z-index:3; box-shadow:0 8px 20px -8px rgba(0,0,0,0.6);
}
.chat-toast.show{opacity:1; transform:translateX(-50%) translateY(0);}
.reactions{display:flex; gap:10px; margin-top:4px; flex-wrap:wrap;}
.react-btn{
  background:var(--ink); border:1px solid var(--line); border-radius:99px; padding:7px 12px; cursor:pointer;
  display:flex; align-items:center; gap:6px; color:var(--cream-dim); font-family:'Space Mono'; font-size:12px;
  transition:transform 0.12s ease, border-color 0.12s ease;
}
.react-btn:hover{border-color:var(--neon); transform:translateY(-2px);}
.react-stage{position:relative; height:0;}
.react-float{position:absolute; bottom:0; font-size:20px; animation:floatUp 1.6s ease-out forwards; pointer-events:none;}

/* ---------- CINTA DE PLAYLISTS MENSUALES ---------- */
.month-reel{overflow:hidden; margin:0 -24px; padding:4px 0 6px;}
.month-track{display:flex; flex:none; width:max-content; gap:16px; padding:0 24px; animation:monthMarquee 40s linear infinite; transform:translateZ(0); backface-visibility:hidden;}
.month-reel:hover .month-track{animation-play-state:paused;}
@media (prefers-reduced-motion: reduce){ .month-track{animation:none;} .month-reel{overflow-x:auto;} }
.month-badge{flex:none; width:110px; text-align:center; text-decoration:none; color:var(--cream-dim); font-family:'Space Mono'; font-size:11px;}
.month-badge .circle{
  width:88px; height:88px; border-radius:50%; margin:0 auto 8px; display:flex; align-items:center; justify-content:center;
  overflow:hidden; background:var(--ink); border:2px solid var(--line);
  transition:border-color 0.2s ease, transform 0.2s ease;
}
.month-badge .circle img{width:100%; height:100%; object-fit:cover; display:block;}
.month-badge:hover .circle{border-color:var(--neon); transform:scale(1.05);}
.month-badge .lbl{display:block; letter-spacing:0.04em;}


/* ---- Ajustes Radio (correcciones post-lanzamiento, septiembre 2026) ---- */
#parrilla-section, #programas, #participa, #playlists{padding:48px 0; border-bottom:1px solid var(--line);}
img.prog-modal-logo{font-size:0;}
img.prog-modal-host-photo{font-size:0;}
img.prog-logo{font-size:0;}
.player-body .radio-logo-player{height:88px; width:auto; flex:0 0 auto; filter:drop-shadow(0 6px 14px rgba(0,0,0,0.5));}
@media (max-width:600px){ .player-body .radio-logo-player{height:56px;} }


/* Rachas de oyente (racha personal, sin servidor) */
.streak-mini{
  display:inline-flex; align-items:center; gap:8px;
  margin:10px 0 2px; padding:6px 14px;
  background:rgba(243,234,217,.06); border:1px solid var(--line);
  border-radius:999px; font-family:'Space Mono',monospace; font-size:12px;
  color:var(--cream-dim); letter-spacing:.02em; width:fit-content;
}
.streak-mini:empty{display:none;}
.streak-mini .streak-icon{font-size:14px;}
.streak-mini b{color:var(--neon); font-weight:700;}
@media (max-width:560px){
  .streak-mini{font-size:11px; padding:5px 12px;}
}

/* ===== Zona de participación: encuesta, pulso, mapa ===== */
.participa-grid{
  display:grid;
  grid-template-columns:1.1fr 0.9fr;
  grid-template-areas:"poll pulse" "map map";
  gap:20px;
  margin-top:28px;
}
#participa .card{
  background:var(--ink-2);
  border:1px solid var(--line);
  border-radius:16px;
  padding:22px 22px 20px;
}
#participa .eyebrow{
  display:block; font-family:'Space Mono',monospace; font-size:11px; letter-spacing:.12em;
  text-transform:uppercase; color:var(--amber); margin-bottom:6px;
}
#participa h3{ margin:0 0 8px; font-size:22px; }
#participa .card > p, #participa .poll-head p, #participa .pulse-head p, #participa .map-head p{
  color:var(--cream-dim); font-size:14px; line-height:1.5; margin:0 0 16px;
}

/* Encuesta */
.poll-card{ grid-area:poll; }
.poll-opts{ display:flex; flex-direction:column; gap:10px; }
.poll-opt{
  position:relative; display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 10px;
  width:100%; text-align:left; background:rgba(243,234,217,.04); border:1px solid var(--line);
  border-radius:10px; padding:10px 14px; cursor:pointer; font-family:inherit; color:var(--cream);
  overflow:hidden;
}
.poll-opt:disabled{ cursor:default; }
.poll-opts.is-voted .poll-opt{ cursor:default; }
.poll-opt-label{ font-weight:700; font-size:14.5px; position:relative; z-index:1; }
.poll-opt-ex{ font-size:12px; color:var(--cream-dim); width:100%; position:relative; z-index:1; }
.poll-opt-pct{ margin-left:auto; font-family:'Space Mono',monospace; font-size:13px; color:var(--neon); position:relative; z-index:1; }
.poll-opt-bar{ display:none; }
.poll-opts.is-voted .poll-opt-bar,
.poll-opts.is-voted .poll-opt-fill{ display:block; }
.poll-opt-bar{ position:absolute; inset:0; }
.poll-opt-fill{ height:100%; width:0%; background:rgba(245,196,51,.14); transition:width .6s ease; }
.poll-opt.is-mine{ border-color:var(--neon); }
.poll-foot{ margin:14px 0 0; font-size:12px; color:var(--cream-dim); }

/* La Canción del Mes */
.cancion-card{ grid-area:pulse; }
.cancion-mes-winner{ color:var(--neon); font-size:13px; margin:0 0 14px; }

/* Mapa */
.map-card{ grid-area:map; }
.map-body{ display:grid; grid-template-columns:1.3fr 1fr; gap:20px; align-items:start; }
.map-radar{
  position:relative; aspect-ratio:2/1; width:100%; border-radius:12px;
  background:
    url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDAwIDUwMCI+PHBhdGggZD0iTTMxMS44LDM5OS42TDMxOS4zLDQwMS45TDMxMC43LDQwNC41TDMwMi44LDQwMi45TDMwOS40LDM5Ni4yWk0zMzcuNCwzOTEuOUwzMzcuNCwzOTEuOUwzMzcuNCwzOTEuOVpNNjk1LjIsMzg4LjFMNjk1LjIsMzg4LjFMNjk1LjIsMzg4LjFaTTkwMy45LDM2My4zTDkxMS45LDM2My41TDkxMC45LDM3MEw5MDUuNywzNzFaTTk4MC42LDM2My43TDk4NCwzNjZMOTcwLjQsMzc5LjZMOTY0LDM3NS4zWk05ODUsMzUwLjRMOTk1LjksMzU0LjdMOTg4LjksMzY0LjdMOTgyLjgsMzU5LjdaTTk2NC4yLDMxMS42TDk2NC4yLDMxMS42TDk2NC4yLDMxMS42Wk05OTUuNSwyOTguMkw5OTUuNSwyOTguMkw5OTUuNSwyOTguMlpNMTAwMCwyOTZMOTk4LjIsMjk2LjdMOTk4LjQsMjk1LjVMMTAwMCwyOTQuNkwxMDAwLDI5NlpNMCwyOTQuNkwwLDI5NC42TDAsMjk2TDAsMjk2TDAsMjk2TDAsMjk0LjZaTTk2Ni4yLDI5NS43TDk2Ni4yLDI5NS43TDk2Ni4yLDI5NS43Wk05NjQuMiwyOTEuNUw5NjQuMiwyOTEuNUw5NjQuMiwyOTEuNVpNNjM5LDI4Ny43TDY0MC4yLDI5Mi4zTDYzMC44LDMxOS4zTDYyMi4zLDMxOS40TDYyMC4xLDMxMS4zTDYyMy4zLDMwNS44TDYyMy41LDI5NUw2MzIuNSwyOTAuNUw2MzYuNywyODMuNFpNODk4LjgsMjg4LjJMOTAzLjgsMjkxLjZMOTA2LjYsMzAyLjdMOTI0LjYsMzIwLjJMOTI2LjYsMzI4LjFMOTI0LjcsMzM3LjlMOTE2LjcsMzU0TDkwNi40LDM1OC40TDg5MC43LDM1NS42TDg4Ny43LDM1MC40TDg3Ny43LDM0Ni45TDg3MywzNDAuNkw4NjQuOCwzMzcuNUw4NTAuNCwzMzkuNUw4NDMuNSwzNDQuMUw4MjcuOCwzNDcuNEw4MTkuNSwzNDVMODIxLjcsMzM5LjVMODE1LDMxNy43TDgxNy4xLDMxMC40TDgzNS43LDMwNC43TDg0MS43LDI5NS42TDg1MywyODguNEw4NTYuNiwyOTEuM0w4NjcuNywyODAuOUw4ODAuNCwyODQuM0w4NzYuMiwyOTAuOUw4ODYuOCwyOTguM0w4OTEuMywyOTguMkw4OTUuOSwyNzkuNlpNOTUwLjMsMjc5LjFMOTUwLjMsMjc5LjFMOTUwLjMsMjc5LjFaTTgzNS4zLDI3OC40TDgzNS4zLDI3OC40TDgzNS4zLDI3OC40Wk05NDYuOCwyNzcuNEw5NDYuOCwyNzcuNEw5NDYuOCwyNzcuNFpNOTQ5LjEsMjc2LjdMOTQ5LjEsMjc2LjdMOTQ5LjEsMjc2LjdaTTg0NS43LDI3OC4yTDg0NS43LDI3OC4yTDg0NS43LDI3OC4yWk04MjcuNSwyNzIuNUw4MjcuNSwyNzIuNUw4MjcuNSwyNzIuNVpNODQxLjQsMjcyLjVMODQxLjQsMjcyLjVMODQxLjQsMjcyLjVaTTk0NC4xLDI3My4yTDk0NC4xLDI3My4yTDk0NC4xLDI3My4yWk05MzcuNiwyNzAuNEw5MzcuNiwyNzAuNEw5MzcuNiwyNzAuNFpNODAxLjcsMjY4LjhMODA3LjcsMjY4TDgyMS40LDI3My4zTDgxOC4yLDI3NC4zTDc5Mi43LDI2OVpNODc0LjIsMjY3LjNMODc0LjIsMjY3LjNMODc0LjIsMjY3LjNaTTkzMywyNjguOUw5MzMsMjY4LjlMOTMzLDI2OC45Wk05MjIuMiwyNjUuMkw5MjIuMiwyNjUuMkw5MjIuMiwyNjUuMlpNODUzLjUsMjU5LjZMODUzLjUsMjU5LjZMODUzLjUsMjU5LjZaTTg2Mi40LDI1OC42TDg2Mi40LDI1OC42TDg2Mi40LDI1OC42Wk05MjUuNCwyNjIuNUw5MjUuNCwyNjIuNUw5MjUuNCwyNjIuNVpNODcyLjYsMjUzLjJMODc2LjMsMjU5LjRMODg0LjIsMjU0LjdMOTAxLjYsMjYwLjdMOTEzLjEsMjc1LjNMOTEwLjksMjc4LjFMOTAyLjEsMjcxLjJMODk2LjIsMjc1LjlMODg1LjIsMjcwLjNMODgzLjEsMjY1TDg3MS4zLDI1OS44TDg2Mi42LDI1Mi42Wk04NDcuOSwyNDYuMUw4NDUuNywyNDguOEw4MzMuOCwyNDkuM0w4NDIuMSwyNjQuOEw4MjkuOSwyNTcuOEw4MzUuOCwyNDYuNFpNODU3LjUsMjQ2LjlMODU3LjUsMjQ2LjlMODU3LjUsMjQ2LjlaTTc5My45LDI2Ni4zTDc4NSwyNjEuN0w3NzMuOSwyNDQuOUw3NjQuOSwyMzYuMkw3NzAuOCwyMzUuNEw3ODguNCwyNDkuN0w3OTQuNywyNTguNVpNODI3LjQsMjQ0LjlMODIyLjYsMjYxLjFMODA2LjIsMjU4LjJMODAzLDI1MS4zTDgyNS40LDIzMC44TDgzMS4xLDIzNVpNODUxLDIyNi42TDg0OC4zLDIzNC41TDg0My40LDIyOC4yWk03MjUuNiwyMzIuOEw3MjUuNiwyMzIuOEw3MjUuNiwyMzIuOFpNMzMwLjcsMjIxLjlMMzMwLjcsMjIxLjlMMzMwLjcsMjIxLjlaTTg0NC40LDIyMS40TDg0NC40LDIyMS40TDg0NC40LDIyMS40Wk04MjkuMiwyMjQuMUw4MjkuMiwyMjQuMUw4MjkuMiwyMjQuMVpNODM4LjYsMjE3TDgzOC42LDIxN0w4MzguNiwyMTdaTTg0OC42LDIxNi4yTDg0OC42LDIxNi4yTDg0OC42LDIxNi4yWk04MzcuNiwyMTMuN0w4MzcuNiwyMTMuN0w4MzcuNiwyMTMuN1pNODM3LDE5OC42TDg0MC4zLDIwMi41TDgzOC4xLDIxMC4yTDgzMy41LDIwOC40Wk0zMTcuOCwxOTkuNEwzMTcuOCwxOTkuNEwzMTcuOCwxOTkuNFpNMjg2LjQsMjAwLjRMMjg2LjQsMjAwLjRMMjg2LjQsMjAwLjRaTTI5OC40LDE5NC44TDMxMC4yLDE5OC4zTDMwMC44LDE5OS45Wk04MDYuNSwxOTguMUw4MDYuNSwxOTguMUw4MDYuNSwxOTguMVpNNjcuOSwxOTdMNjcuOSwxOTdMNjcuOSwxOTdaTTY2LjUsMTkyLjdMNjYuNSwxOTIuN0w2Ni41LDE5Mi43Wk02NC42LDE5MS4yTDY0LjYsMTkxLjJMNjQuNiwxOTEuMlpNNjIuMSwxOTAuOEw2Mi4xLDE5MC44TDYyLjEsMTkwLjhaTTU3LjQsMTg4LjlMNTcuNCwxODguOUw1Ny40LDE4OC45Wk0yNzguNywxODYuOEwyOTQsMTkzLjdMMjg0LDE5NC44Wk0yODQuNiwxODRMMjg0LjYsMTg0TDI4NC42LDE4NFpNODM2LjYsMTg2LjdMODM2LjYsMTg2LjdMODM2LjYsMTg2LjdaTTI4My44LDE3Ni4yTDI4My44LDE3Ni4yTDI4My44LDE3Ni4yWk0yODYuMSwxNzYuMUwyODYuMSwxNzYuMUwyODYuMSwxNzYuMVpNODc0LDE1NS4xTDg3NCwxNTUuMUw4NzQsMTU1LjFaTTU5NiwxNTAuOUw1OTYsMTUwLjlMNTk2LDE1MC45Wk01NjUuOCwxNTAuOEw1NjUuOCwxNTAuOEw1NjUuOCwxNTAuOFpNNTQzLjEsMTQzLjhMNTQxLjksMTQ4LjNMNTM0LjUsMTQ1LjVaTTUyNS42LDEzNS41TDUyNS42LDEzNS41TDUyNS42LDEzNS41Wk04OTEuNiwxNDYuOEw4ODkuNiwxNTIuNEw4NjMuOCwxNTUuOUw4NjQuOCwxNjIuNkw4NTkuNSwxNTcuNUw4NjguNCwxNTEuNkw4NzYuOSwxNTEuM0w4ODcuMywxNDMuOEw4ODkuNywxMzUuNkw4OTQuMSwxNDEuMlpNNTI2LjYsMTMyLjlMNTI2LjYsMTMyLjlMNTI2LjYsMTMyLjlaTTg5OS43LDEyNy4zTDkwNC4zLDEyOS44TDg5My40LDEzMS40TDg5NC40LDEyMy41Wk0zMjMuMiwxMjAuN0wzMjMuMiwxMjAuN0wzMjMuMiwxMjAuN1pNMzI4LjMsMTEzLjZMMzI4LjMsMTEzLjZMMzI4LjMsMTEzLjZaTTE1Ni45LDExNS4zTDE1Ni45LDExNS4zTDE1Ni45LDExNS4zWk0zNDQuMSwxMDkuMkwzNTMuOCwxMThMMzM1LjQsMTE3LjhaTTEzMS40LDk5LjlMMTMxLjQsOTkuOUwxMzEuNCw5OS45Wk04OTksMTA5TDg5OC43LDExOS45TDg5NC43LDEyMi4zTDg5Ni4xLDEwMC43Wk00ODEuMSwxMDQuOEw0NzIuMywxMDYuMUw0NzMuMSwxMDAuM0w0ODQuMyw5OC41Wk01MzUuMiw5NS41TDUzNS4yLDk1LjVMNTM1LjIsOTUuNVpNNzUsOTEuM0w3NSw5MS4zTDc1LDkxLjNaTTQ5MS43LDg3LjFMNDk0LjIsOTQuN0w1MDEuMywxMDNMNTAxLjUsMTA5TDQ4NCwxMTAuN0w0ODgsMTA3LjdMNDg5LjksOTguM0w0ODIuOSw5Mi4zWk00MC4xLDgzLjZMNDAuMSw4My42TDQwLjEsODMuNlpNMjc5LjgsNzcuM0wyNzkuOCw3Ny4zTDI3OS44LDc3LjNaTTI3Mi41LDc1LjhMMjcyLjUsNzUuOEwyNzIuNSw3NS44Wk0yMyw3Mi44TDIzLDcyLjhMMjMsNzIuOFpNMjYzLjQsNjcuNkwyNjkuMSw3MS45TDI2Mi40LDc0LjlaTTQ1OS43LDY1LjRMNDYyLjIsNjkuMUw0NDguMiw3My42TDQzMi40LDY3LjdaTTI4OS4zLDYzLjVMMjg5LjMsNjMuNUwyODkuMyw2My41Wk02MzYuNCwxMzUuM0w2MzYuNywxNDUuNkw2NDkuNSwxNDcuM0w2NDcsMTM2LjVMNjUyLDEzNi4yTDYzOS43LDEyNi4xTDY0Ny4zLDEyNC4zTDY0Mi4yLDExOS4zTDYyOS43LDEyNi4xWk0xMDAwLDY5LjVMMTAwMCw2OS41TDk5Mi44LDcwLjVMOTk4LjMsNzVMOTgyLjQsNzguN0w5NzMuMSw4My43TDk2OS4yLDgxLjdMOTU0LjMsODMuN0w5NTAuMyw5Ny42TDk0NS41LDk5TDkzNS41LDEwOC4zTDkzMS44LDk2LjJMOTM5LjksODguN0w5NTQuNiw4MC4yTDk1Ni45LDc2LjJMOTQ0LjgsODEuOEw5MzUuMyw3OS40TDkyOC40LDg0TDg5NSw4Nkw4NzUuMyw5OEw4OTIuNiwxMDIuNUw4ODkuMSwxMTUuNEw4NzQuNiwxMjkuNUw4NjcuNCwxMjkuOEw4NTQuMywxMzkuNkw4NTkuNiwxNDcuOEw4NTguNiwxNTIuNUw4NTEuMywxNTQuNUw4NTAuNSwxNDUuMUw4NDUuMiwxMzkuMUw4MzYuMywxNDJMODM3LjksMTM2LjNMODI2LjUsMTQyLjRMODM2LjQsMTQ4LjJMODMxLDE1M0w4MzguNiwxNjJMODM5LjEsMTY3LjFMODI5LjYsMTgxLjhMODIxLjksMTg2LjdMODA3LjcsMTkwLjZMODAxLjQsMTg5LjdMNzkzLjUsMTk3LjFMODAyLjQsMjA3LjZMODAzLjMsMjE3LjZMNzkyLjEsMjI2LjFMNzkxLjksMjIyLjRMNzc4LDIxMi44TDc3NS40LDIyMi4zTDc3OS4xLDIyOS40TDc4Ny4yLDIzNi41TDc4Ny42LDI0Ni42TDc4MS42LDI0Mi4zTDc3Ni40LDIyOS42TDc3Mi42LDIyNi44TDc3NC4zLDIxOC4yTDc2OS45LDIwM0w3NjEuNiwyMDUuNUw3NjIsMTk5LjRMNzUzLjksMTg2LjhMNzQxLjYsMTkwLjNMNzIzLjEsMjA1LjhMNzIxLjgsMjIxLjJMNzE1LjQsMjI3LjlMNzA0LjMsMjA1LjZMNzAxLjcsMTkwLjdMNjk1LjcsMTkyTDY4NC40LDE3OS40TDY3MC44LDE4MC4zTDY1MiwxNzYuNEw2NDMuMSwxNzIuNkw2MzkuMiwxNjYuM0w2MzMuMywxNjYuN0w2NDMuOSwxODMuM0w2NTYuNywxODAuOEw2NjYuMSwxODhMNjYwLjUsMTk3TDY1My41LDIwMi4xTDYzNS4yLDIxMS4xTDYyMC44LDIxNC45TDYxOC41LDIwMy40TDYwOC43LDE5MC45TDYwOC41LDE4Ny4zTDU5Ny42LDE3Mkw1OTAuOSwxNzAuM0w2MDIuNCwxODguOUw2MDQuMSwxOTguM0w2MDkuMSwyMDUuOEw2MjAuMywyMTUuNkw2MjIuNSwyMjFMNjQyLDIxNi42TDYzNy40LDIzMS4xTDYyOS4zLDI0Mi4xTDYxMS44LDI1Ny4xTDYwNy44LDI2OEw2MTIuNCwyNzkuOUw2MTMuMywyOTAuOEw2MDkuNiwyOTYuNEw1OTYuNiwzMDVMNTk3LjMsMzE4TDU5MS43LDMyMC40TDU5MC4yLDMyOC42TDU3OC40LDM0MUw1NzEuNiwzNDQuM0w1NTQuNSwzNDYuN0w1NDIuMywzMjUuM0w1MzkuNiwzMTEuNEw1MzIuMywyOTYuM0w1MzcuOSwyODMuNEw1MzMuMSwyNjRMNTI0LjQsMjUzLjFMNTI3LjIsMjQxLjVMNTIzLjYsMjM2LjdMNTE2LjQsMjM4LjJMNTEyLDIzMi42TDQ5NC41LDIzNi45TDQ3OS4xLDIzNy45TDQ2NCwyMjguM0w0NTMuOSwyMTYuMkw0NTEsMjA5LjFMNDU0LjMsMjA1LjJMNDUyLjYsMTkxLjdMNDU5LjksMTc3LjFMNDczLjQsMTY2LjlMNDc2LDE1Ny43TDQ4My41LDE1MC43TDQ5NCwxNTIuM0w1MDQuMSwxNDguM0w1MjYuNCwxNDYuMkw1MzAuOSwxNTcuNUw1NDIuMywxNjAuNEw1NTMsMTY1LjlMNTU3LjksMTU5LjFMNTgwLjMsMTY0LjNMNTk1LjIsMTYzLjNMNjAwLjQsMTUwLjVMNTc2LjgsMTQ4LjJMNTcyLjcsMTQwLjRMNTgxLjIsMTM1LjVMNTk3LjcsMTMzLjJMNjA2LjUsMTM2LjNMNjE1LjEsMTMxLjVMNjAxLjksMTI0LjNMNjA4LjcsMTE4LjdMNTkzLjMsMTIyLjZMNTg1LjQsMTIwLjZMNTc2LjksMTMxLjdMNTgwLDEzNkw1NjMuNCwxMzcuNkw1NjYuNywxNDMuOEw1NjAuMiwxNDcuN0w1NTQuMywxMzQuMUw1MzYuNSwxMjNMNTM1LDEyNy41TDU1MSwxMzcuOUw1NDQuNywxNDQuNUw1NDIuOCwxMzguOEw1MjQuNywxMjYuOEw1MTguMSwxMzAuMkw1MDguNiwxMzAuM0w0OTQsMTQ4LjFMNDg1LjEsMTUwLjFMNDc1LjMsMTQ3LjZMNDczLjksMTMwLjVMNDc3LjgsMTI4LjVMNDk0LjcsMTI5LjRMNDk2LjcsMTIyLjJMNDg3LjIsMTE0LjhMNDk1LjUsMTE0LjlMNTEwLjYsMTA2LjZMNTEzLjEsMTAyLjVMNTI0LjQsOTkuOUw1MjMuNyw5MS40TDUyOS40LDg5LjZMNTI2LjgsOTUuOUw1MzAuNCwxMDBMNTM5LjIsMTAwLjdMNTU5LjEsOTYuN0w1NjQuOCw4NS42TDU3Ny43LDg0LjhMNTc4LDgxLjlMNTYzLjUsODMuOEw1NTguNSw3Ni4xTDU3MC41LDY5LjFMNTYxLjYsNjcuNEw1NDkuNiw3NS43TDU1Mi4yLDgzLjFMNTQ0LjEsOTQuMkw1MzYsOTYuMkw1MjguOCw4NC44TDUxNS43LDg3LjNMNTEzLjksNzcuOUw1MjkuMiw3MC45TDU0MSw2MS42TDU1My4zLDU2LjFMNTc4LjIsNTIuM0w1ODMuMyw1NUw2MTEuOSw2MS4zTDYwNi42LDY2LjdMNTk0LjIsNjQuNkw1OTcuMSw3MS4xTDYyMy43LDY0LjZMNjIwLjcsNTkuNUw2MjguNSw2MC40TDYyOC43LDY0LjhMNjQ5LjIsNTguN0w2NjMuMyw1OC43TDY2OC4yLDU2TDY5MC4zLDYwLjlMNjg1LjMsNTIuN0w2OTQuMyw0Ny4xTDcwNC42LDYwTDY5OCw2NS44TDcwOC41LDYxLjhMNzAzLjEsNTEuNUw3MjEuMyw0OS4xTDcyMy42LDQ1LjRMNzQxLjIsNDQuNkw3NDIuMSw0MS4zTDc1OSwzOC44TDc3OS45LDM3LjdMNzgzLjMsMzUuM0w4MDguNSwzNi45TDgxNi4zLDQwLjhMODAzLjksNDMuOUw4NDIuMiw0Ny4zTDg0Mi40LDQ1LjJMODU3LjIsNDcuMUw4NjQuNyw1My40TDg2Ny40LDUwLjVMODg4LjUsNTEuNEw4OTAuMiw0Ny42TDkxNS4zLDQ5LjRMOTI0LjksNTMuMkw5NDEuNyw1My4xTDk0Ny4xLDU3LjFMOTczLjUsNTUuM0w5OTYuMSw1Ny4yTDEwMDAsNTguNEwxMDAwLDY5LjVaTTAsNTguNEwwLDU4LjRMMCw1OC40TDI4LjEsNjYuN0wxNyw3MS40TDAuMyw2N0wwLDY5LjVMMCw2OS41TDAsNTguNFpNMjM0LjMsNThMMjM0LjMsNThMMjM0LjMsNThaTTEwMDAsNTIuM0wxMDAwLDUzLjJMOTk2LjUsNTIuNUwxMDAwLDUxLjNMMTAwMCw1Mi4zWk0wLDUxLjNMMCw1MS4zTDAsNTEuM0wwLDUyLjNMMCw1MS4zWk0wLDUxLjNMMCw1MS4zTDAsNTEuM1pNMjQ4LjUsNTdMMjU3LjQsNjMuM0wyNjIuNCw1NS45TDI3NC4yLDU3LjlMMjczLjksNjMuNkwyNjEuOCw2NS4xTDI0OC44LDcyLjhMMjM4LjIsODAuOEwyMzcsODYuM0wyNDMuNiw5MS40TDI3MS41LDk2LjhMMjczLjksMTA1LjFMMjgxLjcsMTA0TDI3OC4zLDk4LjFMMjg3LjQsOTNMMjgxLjksODYuN0wyODMsNzYuOUwyOTQuOSw3Ni41TDMwNi43LDgwLjRMMzEyLjEsODguM0wzMjAuNiw4Mi40TDMyOC4zLDkzLjVMMzQwLjcsOTguM0wzNDUuMywxMDUuMUwzMzMuMiwxMTAuNEwzMTUuNiwxMTAuNUwzMDIuNSwxMTkuOUwzMTUuMSwxMTMuNUwzMjAuOSwxMjEuNkwzMzMuOSwxMjIuNEwzMTguNCwxMjlMMzE0LDEyNS41TDMwNS4yLDEyOC43TDMwNS43LDEzNC4zTDI5Ny42LDEzNS41TDI4OS43LDE0NC42TDI4OS42LDE1MS4yTDI3My42LDE2NC42TDI3Ny42LDE3NS4zTDI3NC41LDE4MEwyNjcuNSwxNjYuOEwyNTEuMSwxNjYuMkwyNTEuNiwxNjlMMjM3LDE2OC4xTDIyOS41LDE3My45TDIyOC4xLDE4Ny43TDIzNy43LDE5OS42TDI0Ny45LDE5Ni40TDI0OS4yLDE5MS43TDI1OC4yLDE5MC4yTDI1MywyMDUuOUwyNjksMjA4LjNMMjY3LjEsMjE4LjRMMjczLjgsMjI1LjZMMjc5LDIyMy4zTDI4Ni42LDIyNkwyOTAuMywyMjAuNUwzMDAuNywyMTUuNUwzMDEuNywyMTkuNUwzMjguMSwyMjAuMkwzMjYuNywyMjIuNEwzNDEuMywyMzMuNEwzNTMuMSwyMzVMMzY0LjksMjUwLjdMMzc5LjQsMjU2LjZMMzg4LjksMjU4TDQwMi4xLDI2NS4yTDQwMi40LDI3NUwzOTEuOCwyODguM0wzODkuNiwzMDQuNEwzODMuNCwzMTMuOEwzNzAuOSwzMTYuOUwzNjUuMywzMjEuOUwzNjQuMiwzMjkuN0wzNDcuNCwzNDcuMUwzMzcuNSwzNDUuNkwzNDIuMywzNTIuNUwzMzUuNSwzNTcuNkwzMjYuOCwzNTcuOUwzMjcuNCwzNjNMMzE5LjEsMzY0LjFMMzIzLjcsMzY4LjJMMzEyLjMsMzc4LjZMMzE3LjcsMzgxLjJMMzA4LDM5MC45TDMxMC43LDM5NS40TDMwMi44LDM5OS41TDI5MS44LDM5NS4yTDI4OS45LDM3OS42TDI5My41LDM3Mi41TDI5Ni44LDM1My4xTDMwMS42LDM0MC4xTDMwNS4zLDMwOS40TDMwNC41LDMwMUwyODguOSwyOTAuN0wyNzMuOSwyNjMuMkwyNzcuNSwyNDcuOUwyODUuOCwyMzkuM0wyODAuMiwyMjVMMjc3LjgsMjI5TDI2MS43LDIyMS44TDI1Ni41LDIxNC4xTDI0Ni42LDIxMS4zTDIzNywyMDVMMjMxLjgsMjA2LjVMMjEyLjUsMTk5LjJMMjA2LjMsMTkzLjJMMjA1LjUsMTg2LjdMMTg4LjMsMTY5LjZMMTg1LjcsMTYzLjRMMTgxLjUsMTY2LjJMMTk2LjEsMTg1LjFMMTgyLDE3NC42TDE3NC4yLDE1OC4yTDE2NS42LDE1NC4zTDE1Ni4zLDE0MS44TDE1NC4xLDEzMS4yTDE1NCwxMTUuNkwxNTguNCwxMTMuOUwxNDYsMTA4LjhMMTI3LjYsODguNUw5MS40LDgwLjlMNzQuMiw4Ni41TDU5LjksOTQuNUw0MS44LDk4LjRMNjEuOSw5MC4xTDQ1LDgzLjlMMzguNiw3OS4yTDUzLjQsNzBMNDEuOCw3MUwzMyw2Ny42TDQzLjEsNjUuMUw0MC42LDYxTDUwLjMsNTQuNkw2NS4xLDUxLjhMNzcsNTMuOUwxMDEuMSw1NS4xTDEyMC44LDU4LjZMMTQ0LjEsNTQuMkwxODMuNiw2MEwxODQuNyw2MkwyMDUuMSw1OC45TDIxMC4yLDYxLjFMMjM3LDYwLjlMMjMyLDU1LjNMMjM1LjUsNTAuMlpNMTgyLjksNDYuOUwxOTEuNSw0OC43TDIwNy4yLDQ4LjFMMjA5LjgsNTIuOEwyMTkuNSw1NS41TDIxNS41LDU5TDIwNS43LDU3LjhMMTg1LjIsNTkuNkwxNjguMyw1MS4yWk0yMDkuNyw0Ni4xTDIwOS43LDQ2LjFMMjA5LjcsNDYuMVpNMjg3LjksNDYuOUwyODcuOSw0Ni45TDI4Ny45LDQ2LjlaTTI1OS42LDQ2LjhMMjcxLjMsNDUuMUwyNzUuNyw0OS44TDI4My44LDQ3LjlMMzA4LjksNTQuMUwzMDguOSw1OS4xTDMyOC4yLDY0LjNMMzIyLjUsNjkuNEwzMTQuNyw2NS42TDMxOS40LDc1LjlMMzA4LjksNzIuOUwzMDguNyw3Ni45TDI4My42LDY4LjZMMjk0LjYsNjguMkwyOTYuNCw2MC45TDI4MC43LDU1LjFMMjc0LjIsNTYuM0wyNTMuNyw1NC40TDI0OS40LDQ5LjNaTTIyMS4yLDQ0LjlMMjI5LjUsNDUuMUwyMjYuOCw1MkwyMTUuMyw0OC42Wk04OTguOSw0Ni42TDg5OC45LDQ2LjZMODk4LjksNDYuNlpNMjQxLjEsNDcuOUwyMzcuNSw0NC4xTDI0OC42LDQ0LjhaTTE2NS40LDUxLjdMMTUwLjIsNTAuNEwxNTMsNDMuNkwxNzMuNSw0My45TDE3OS4xLDQ1LjlaTTkxOC43LDQxLjRMOTE4LjcsNDEuNEw5MTguNyw0MS40Wk0yNDAsNDEuN0wyNDAsNDEuN0wyNDAsNDEuN1pNOTAzLDQwLjFMODg2LDQyLjdMODgyLDM5Wk0yMjYuNCwzNi45TDIyNy4zLDQxLjdMMjE1LjEsMzhaTTE5OS40LDM4LjNMMjA0LjcsNDEuN0wxODguMyw0My4zTDE4OS41LDQxLjJMMTczLDQxTDE3OS40LDM3LjZMMTk3LDQwLjRaTTY1OS44LDUzLjZMNjQzLjMsNTEuNUw2NTQuNSw0MS40TDY2OS45LDM4LjJMNjg5LjMsMzYuM0w2ODkuNCwzOC4yTDY3MS4xLDQwLjlMNjUzLjksNDlaTTIzNywzNS44TDI1Mi4zLDQwTDI3NC42LDM5LjdMMjcyLjQsNDMuMkwyNDMuMyw0Mi4xWk0xNzcuMiwzNC4zTDE2Ni45LDM4LjdMMTU4LjcsMzguNlpNMjM5LjMsMzQuN0wyMzkuMywzNC43TDIzOS4zLDM0LjdaTTE5My45LDM0LjJMMTkzLjksMzQuMkwxOTMuOSwzNC4yWk01NjguNywzMy43TDU2OC43LDMzLjdMNTY4LjcsMzMuN1pNMTk1LjQsMzEuN0wxOTUuNCwzMS43TDE5NS40LDMxLjdaTTIzMy44LDMzLjJMMjMzLjgsMzMuMkwyMzMuOCwzMy4yWk0yMjIuMSwzMi40TDIyMi4xLDMyLjRMMjIyLjEsMzIuNFpNNzkxLjksMzIuNUw3NzYuMiwzMy42TDc4MS4zLDI5LjlaTTU1MC43LDI4LjZMNTQ3LjYsMzYuNkw1MjksMjguN1pNNTcwLjcsMjYuNkw1NzIsMjkuMUw1NTUuOCwyOUw1NDguMiwyNi45Wk02NDIsMjYuM0w2NDIsMjYuM0w2NDIsMjYuM1pNNzc3LjYsMzAuOUw3NTkuMiwyOS40TDc1My4zLDI2LjhMNzY2LjUsMjQuM0w3NzguMywyOC40Wk0yNTguMywyOC43TDI1Mi43LDMyLjVMMjQyLDMyLjRMMjMxLjQsMjcuM0wyNDMuMywyNC4zWk0zMDkuNywxOS4xTDMyOC4xLDIxLjJMMzAyLjMsMjguM0wyODYuNCwyOS43TDI5MC42LDMxLjlMMjc2LjIsMzguNEwyNTEuNCwzNy42TDI2My42LDI5LjZMMjQ1LjYsMjIuNUwyNzkuNywxOS4xWk00MjQuNywxOEw0NDIuMSwyMC4yTDQxMS40LDIxLjdMNDM1LjYsMjQuNkw0NTYuMiwyMi41TDQ2Ni4xLDI0LjJMNDUwLjcsMjcuNEw0NDUuMywzMS4yTDQ0OC43LDM2LjJMNDQ2LjIsNDMuNkw0MzIuNiw0OC4zTDQzOS42LDUzLjdMNDI5LDUxLjZMNDI2LjgsNTQuOUw0MzcuOSw1NS4yTDQyMi45LDU5LjhMNDExLjcsNjAuOEw0MDUsNjQuOEwzODkuNCw2OC4yTDM4MS4xLDc1LjlMMzc5LjUsODMuMUwzNjUuOSw4MC45TDM1Ni42LDczLjNMMzUwLjEsNjMuNEwzNTguNyw1NS44TDM1MS41LDU3LjVMMzQ0LjksNTFMMzQ4LDQ4LjRMMzM3LjMsNDAuMkwzMjkuOCwzOC42TDMwOS43LDM4LjdMMjk2LjgsMzIuMUwzMTcuNSwyOS41TDMxMSwyNy41TDM0MS4xLDIxLjdMMzcwLjEsMjAuNUw0MDIuNSwxNy43WiIgZmlsbD0iI2M5OGY0YSIgZmlsbC1vcGFjaXR5PSIwLjE2Ii8+PC9zdmc+") center/100% 100% no-repeat,
    radial-gradient(circle at 50% 40%, rgba(245,196,51,.06), transparent 60%),
    repeating-linear-gradient(0deg, rgba(201,143,74,.08) 0, rgba(201,143,74,.08) 1px, transparent 1px, transparent 12.5%),
    repeating-linear-gradient(90deg, rgba(201,143,74,.08) 0, rgba(201,143,74,.08) 1px, transparent 1px, transparent 10%),
    var(--ink);
  border:1px solid var(--line); overflow:hidden;
}
.map-dot{
  position:absolute; width:8px; height:8px; margin:-4px 0 0 -4px; border-radius:50%;
  background:var(--neon); opacity:var(--i,.5);
  box-shadow:0 0 6px 2px rgba(245,196,51,var(--i,.5));
}
.map-pick{ margin-bottom:16px; }
.map-pick-label{ display:block; font-size:12px; color:var(--cream-dim); margin-bottom:6px; }
.map-pick select{
  width:100%; background:var(--ink); color:var(--cream); border:1px solid var(--line);
  border-radius:8px; padding:9px 10px; font-family:inherit; font-size:13.5px; margin-bottom:10px;
}
.btn-map-mark{
  width:100%; background:var(--neon); color:var(--ink); border:none; border-radius:999px;
  padding:10px 14px; font-weight:800; font-size:13.5px; cursor:pointer;
}
.map-pick.is-done .btn-map-mark{ opacity:.5; pointer-events:none; }
.map-pick-note{ font-size:11.5px; color:var(--cream-dim); margin:8px 0 0; }
.map-ranking{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:6px; }
.map-ranking li{
  display:flex; align-items:center; gap:8px; font-size:13px; padding:5px 0;
  border-bottom:1px solid var(--line);
}
.map-rank-flag{ font-size:15px; }
.map-rank-name{ flex:1; color:var(--cream); }
.map-rank-n{ font-family:'Space Mono',monospace; color:var(--neon); font-size:12.5px; }
.map-rank-empty{ color:var(--cream-dim); font-size:12.5px; border:none !important; }

@media (max-width:900px){
  .participa-grid{ grid-template-columns:1fr; grid-template-areas:"poll" "pulse" "map"; }
  .map-body{ grid-template-columns:1fr; }
}
@media (max-width:560px){
  #participa .card{ padding:18px 16px 16px; }
}

/* ===== Zona de participación — dinamismo visual (septiembre 2026) ===== */

#participa{ position:relative; overflow:hidden; isolation:isolate; }
#participa::before,
#participa::after{
  content:""; position:absolute; z-index:0; pointer-events:none; border-radius:50%;
  filter:blur(60px); opacity:.35; background:radial-gradient(circle, rgba(245,196,51,.5), transparent 70%);
  animation:participaFloat 14s ease-in-out infinite;
}
#participa::before{ width:340px; height:340px; top:-120px; left:-100px; }
#participa::after{ width:280px; height:280px; bottom:-100px; right:-80px; animation-delay:-7s; animation-direction:reverse; }
@keyframes participaFloat{
  0%,100%{ transform:translate(0,0) scale(1); }
  50%{ transform:translate(30px,-24px) scale(1.15); }
}
#participa > *{ position:relative; z-index:1; }

#participa .card{
  position:relative; overflow:hidden;
  transition:transform .35s ease, box-shadow .35s ease, border-color .35s ease;
}
#participa .card::before{
  content:""; position:absolute; top:0; left:-40%; width:40%; height:2px;
  background:linear-gradient(90deg, transparent, var(--neon), transparent);
  animation:cardTopSweep 3.6s ease-in-out infinite;
}
@keyframes cardTopSweep{
  0%{ left:-40%; }
  100%{ left:100%; }
}
#participa .card:hover{
  transform:translateY(-4px);
  border-color:rgba(245,196,51,.45);
  box-shadow:0 14px 34px rgba(0,0,0,.35), 0 0 0 1px rgba(245,196,51,.12), 0 0 24px rgba(245,196,51,.15);
}

/* --- Mapa de oyentes: efecto radar / escaneo --- */
.map-radar{ position:relative; isolation:isolate; }
.map-radar::before{
  content:""; position:absolute; inset:-10%; z-index:1; pointer-events:none;
  background:conic-gradient(from 0deg, rgba(245,196,51,.34), rgba(245,196,51,0) 18%, rgba(245,196,51,0) 82%, rgba(245,196,51,.34) 100%);
  mix-blend-mode:screen; animation:radarSweep 5s linear infinite; transform-origin:50% 50%;
}
.map-radar::after{
  content:""; position:absolute; inset:0; z-index:1; pointer-events:none; border-radius:12px;
  box-shadow:inset 0 0 0 0 rgba(245,196,51,.4);
  animation:radarPulseRing 3.2s ease-out infinite;
}
@keyframes radarSweep{ from{ transform:rotate(0deg); } to{ transform:rotate(360deg); } }
@keyframes radarPulseRing{
  0%{ box-shadow:inset 0 0 0 0 rgba(245,196,51,.4); }
  70%{ box-shadow:inset 0 0 26px 4px rgba(245,196,51,0); }
  100%{ box-shadow:inset 0 0 0 0 rgba(245,196,51,0); }
}
@media (prefers-reduced-motion: reduce){
  .map-radar::before,
  .map-radar::after,
  #participa::before,
  #participa::after{ animation:none; }
}

.map-dot{ z-index:2; animation:dotBreathe 2.6s ease-in-out infinite; animation-delay:calc(var(--i,.5) * -2.6s); }
.map-dot::after{
  content:""; position:absolute; inset:-7px; border-radius:50%; pointer-events:none;
  border:1px solid rgba(245,196,51,.55);
  animation:dotRipple 2.6s ease-out infinite; animation-delay:calc(var(--i,.5) * -2.6s);
}
@keyframes dotBreathe{
  0%,100%{ transform:scale(1); }
  50%{ transform:scale(1.6); }
}
@keyframes dotRipple{
  0%{ transform:scale(.3); opacity:.85; }
  100%{ transform:scale(2.4); opacity:0; }
}

/* --- Encuesta mensual --- */
.poll-opt{ position:relative; overflow:hidden; transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease; }
.poll-opt:hover{ transform:translateX(3px); box-shadow:0 4px 14px rgba(245,196,51,.14); }
.poll-opt-fill{
  position:relative; overflow:hidden;
  background:linear-gradient(90deg, rgba(245,196,51,.85), rgba(245,196,51,.55));
  transition:width .8s cubic-bezier(.22,.9,.3,1);
}
.poll-opt-fill::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(120deg, transparent 30%, rgba(255,255,255,.45) 50%, transparent 70%);
  background-size:220% 100%; animation:fillShimmer 2.4s ease-in-out infinite;
}
@keyframes fillShimmer{
  0%{ background-position:150% 0; }
  100%{ background-position:-60% 0; }
}
.poll-opt-pct{ transition:transform .3s cubic-bezier(.34,1.56,.64,1), color .3s ease; }
.poll-opt.voted .poll-opt-pct{ transform:scale(1.15); color:var(--neon); }

/* ===== Zona de participación — títulos más grandes + neón (septiembre 2026) ===== */

#participa .eyebrow{
  font-size:14px; letter-spacing:.18em; font-weight:700;
}

#participa h3{
  font-size:34px; line-height:1.15; margin:0 0 10px;
  color:var(--neon);
  text-shadow:0 0 6px rgba(245,196,51,.85), 0 0 16px rgba(245,196,51,.6), 0 0 34px rgba(245,196,51,.4), 0 0 60px rgba(245,196,51,.2);
  animation:neonFlicker 5s ease-in-out infinite;
}
@keyframes neonFlicker{
  0%, 19%, 21%, 23%, 54%, 56%, 100%{
    text-shadow:0 0 6px rgba(245,196,51,.85), 0 0 16px rgba(245,196,51,.6), 0 0 34px rgba(245,196,51,.4), 0 0 60px rgba(245,196,51,.2);
  }
  20%, 22%, 55%{
    text-shadow:0 0 4px rgba(245,196,51,.6), 0 0 10px rgba(245,196,51,.4), 0 0 20px rgba(245,196,51,.25);
  }
}
@media (prefers-reduced-motion: reduce){
  #participa h3{ animation:none; }
}
@media (max-width:680px){
  #participa h3{ font-size:26px; }
  #participa .eyebrow{ font-size:12.5px; }
}

/* ===== Zona de participación — eyebrows en blanco para contraste (septiembre 2026) ===== */
#participa .eyebrow{ color:#ffffff; }

/* ===== Encuesta mensual — legibilidad del texto sobre la barra de progreso (septiembre 2026) ===== */
.poll-opt-label,
.poll-opt-ex{
  text-shadow:0 1px 2px rgba(0,0,0,1), 0 -1px 2px rgba(0,0,0,1), 1px 0 2px rgba(0,0,0,1), -1px 0 2px rgba(0,0,0,1), 0 0 8px rgba(0,0,0,.9), 0 0 14px rgba(0,0,0,.75), 0 0 22px rgba(0,0,0,.5);
}

/* ===== Zona de participación — cinta de playlists mensuales más grande en escritorio + título de sección (septiembre 2026) ===== */
@media (min-width:681px){
  #playlists .month-badge{ width:180px; }
  #playlists .month-badge .circle{ width:132px; height:132px; border-width:3px; }
  #playlists .month-track{ gap:12px; }
  #playlists .month-badge .lbl{ font-size:13px; }
}

#participa .section-head h2{
  font-size:64px;
  color:var(--neon);
  text-shadow:0 0 6px rgba(245,196,51,.85), 0 0 16px rgba(245,196,51,.6), 0 0 34px rgba(245,196,51,.4), 0 0 60px rgba(245,196,51,.2);
  animation:neonFlicker 5s ease-in-out infinite;
}
@media (prefers-reduced-motion: reduce){
  #participa .section-head h2{ animation:none; }
}
@media (max-width:680px){
  #participa .section-head h2{ font-size:38px; }
}

/* ===================================================
   ACERCA DE — estilos específicos de página
   =================================================== */
@keyframes textGlow{
  0%,100%{text-shadow:0 0 10px rgba(245,196,51,0.25);}
  50%{text-shadow:0 0 22px rgba(245,196,51,0.65), 0 0 6px rgba(245,196,51,0.5);}
}

/* ---------- HERO ---------- */
.ahero{
  position:relative; padding:52px 0 44px; overflow:hidden;
  background:
    radial-gradient(620px 340px at 50% 30%, rgba(224,138,52,0.14), transparent 62%),
    radial-gradient(1100px 460px at 12% -10%, rgba(154,63,39,0.5), transparent 60%),
    radial-gradient(800px 460px at 100% 0%, rgba(245,196,51,0.1), transparent 55%),
    var(--ink);
  border-bottom:1px solid var(--line);
}
.ahero-inner{max-width:820px;}
.ahero h1{font-size:clamp(38px,5.6vw,60px); margin-bottom:16px;}
.ahero h1 em{font-style:normal; color:var(--neon); animation:textGlow 2.4s ease-in-out infinite;}
.ahero-sub{color:var(--cream-dim); font-size:15.5px; max-width:68ch; line-height:1.56;}
.ahero-sub p{margin:0 0 12px; text-align:justify;}
.ahero-sub p:last-child{margin-bottom:0;}

/* ---------- HISTORIA / EQUIPO — texto corrido, sin dramatismo ---------- */
.prose p{font-size:15px; line-height:1.62; color:var(--cream-dim); margin:0 0 15px; text-align:justify;}
.prose p:last-child{margin-bottom:0;}
.prose strong{color:var(--cream); font-weight:700;}
.prose em{font-style:normal; color:var(--neon); animation:textGlow 2.4s ease-in-out infinite;}

/* ---------- FILOSOFÍA ---------- */
.pillars{display:grid; grid-template-columns:repeat(3,1fr); gap:16px;}
@media (max-width:820px){ .pillars{grid-template-columns:1fr;} }
.pillar h3{font-size:19px; display:flex; align-items:center; gap:8px;}
.pillar h3 .ic{
  width:30px;height:30px;border-radius:8px;background:var(--brick-deep);display:flex;align-items:center;justify-content:center;
  font-family:'Space Mono'; font-size:14px; color:var(--neon); flex:none;
}
.pillar p{font-size:13.5px; color:var(--cream-dim); margin:0; line-height:1.55;}
.slogan-block{
  margin-top:26px; text-align:center; padding:24px; border-radius:16px;
  background:linear-gradient(160deg, var(--brick), var(--brick-deep)); border:1px solid var(--line);
}
.slogan-block .sl{font-family:'Bebas Neue'; font-size:clamp(20px,3.2vw,28px); color:var(--cream); letter-spacing:0.02em;}
.slogan-block .sl em{font-style:normal; color:var(--neon); animation:textGlow 2.4s ease-in-out infinite;}

/* ---------- ESTUDIO ---------- */
.studio{display:grid; grid-template-columns:1.05fr 0.95fr; gap:36px; align-items:center;}
@media (max-width:900px){ .studio{grid-template-columns:1fr !important;} }
.studio-photo-wrap{position:relative; border-radius:18px; overflow:hidden; border:1px solid var(--line); box-shadow:0 30px 60px -30px rgba(0,0,0,0.8); line-height:0;}
.studio-photo-wrap img, .studio-photo-wrap video{width:100%; height:auto; display:block;}
.studio-photo-cap{
  position:absolute; left:0; right:0; bottom:0; padding:14px 18px;
  background:linear-gradient(0deg, rgba(20,16,13,0.92), transparent);
  font-family:'Space Mono'; font-size:11px; color:var(--cream-dim); letter-spacing:0.04em;
}
.studio-text p{font-size:14.5px; color:var(--cream-dim); line-height:1.6; margin:0 0 14px;}
.studio-text p:last-child{margin-bottom:0;}
.studio-text strong{color:var(--cream); font-weight:700;}
.brandname{color:var(--neon); font-weight:700; animation:textGlow 2.4s ease-in-out infinite;}
.bio-list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:12px;}
.bio-list li{font-size:14.5px; color:var(--cream-dim); line-height:1.6;}
.bio-list li strong{color:var(--neon); font-weight:700; animation:textGlow 2.4s ease-in-out infinite;}

/* ---------- EQUIPO ---------- */
.team-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px;}
@media (max-width:900px){ .team-grid{grid-template-columns:1fr 1fr;} }
@media (max-width:600px){ .team-grid{grid-template-columns:1fr;} }
.team-card{text-align:center; align-items:center;}
.team-avatar{
  width:88px; height:88px; border-radius:50%; object-fit:cover; margin:0 auto 4px;
  border:2px solid var(--line);
}
.team-avatar-fallback{
  width:88px; height:88px; border-radius:50%; margin:0 auto 4px; display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg, var(--brick), var(--amber)); font-family:'Bebas Neue'; font-size:27px; color:var(--cream);
  border:2px solid var(--line);
}
.team-card h3{font-size:18px; color:var(--cream);}
.team-role{font-family:'Space Mono'; font-size:10.5px; color:var(--amber); letter-spacing:0.06em; margin-top:2px;}
.team-card p.bio{font-size:12.5px; color:var(--cream-dim); line-height:1.5; margin:0;}
.collab-strip{
  margin-top:22px; display:flex; flex-wrap:wrap; gap:8px; justify-content:center;
}
.collab-chip{
  font-family:'Space Mono'; font-size:11.5px; color:var(--cream-dim); border:1px solid var(--line); border-radius:99px;
  padding:7px 14px; display:flex; align-items:center; gap:6px;
}
.collab-chip .flag{font-size:13px;}
.collab-note{text-align:center; font-size:13px; color:var(--cream-dim); margin-top:16px; max-width:60ch; margin-left:auto; margin-right:auto;}

/* ---------- FORMATOS ---------- */
.formats-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px;}
@media (max-width:900px){ .formats-grid{grid-template-columns:1fr 1fr;} }
@media (max-width:600px){ .formats-grid{grid-template-columns:1fr;} }
.format-card h3{font-size:18px; color:var(--cream);}
.format-card .fmt-tag{font-family:'Space Mono'; font-size:10.5px; color:var(--amber); letter-spacing:0.06em;}
.format-card p{font-size:12.5px; color:var(--cream-dim); line-height:1.5; margin:6px 0 0;}

/* ---------- PRENSA (destacada: entrevista en medio importante) ---------- */
.press{text-align:center;}
.press-card{
  position:relative; overflow:hidden;
  max-width:640px; margin:0 auto;
  padding:40px 36px;
  border-radius:18px;
  border:1px solid rgba(245,196,51,.35);
  background:linear-gradient(160deg, rgba(154,63,39,.32), rgba(92,36,22,.5));
  box-shadow:0 16px 44px rgba(0,0,0,.4), 0 0 0 1px rgba(245,196,51,.06);
}
.press-card::before{
  content:""; position:absolute; top:0; left:-60%; width:50%; height:100%;
  background:linear-gradient(90deg, transparent, rgba(245,196,51,0.16), transparent);
  animation:pressSweep 5s ease-in-out infinite;
  pointer-events:none;
}
.press-badge{
  position:relative; z-index:1;
  display:inline-block; margin-bottom:14px; padding:6px 16px; border-radius:99px;
  font-family:'Space Mono',ui-monospace,monospace; font-size:11px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--ink); background:var(--neon);
  animation:pressBadgeGlow 2.6s ease-in-out infinite;
}
.press .eyebrow{
  position:relative; z-index:1;
  font-size:24px; font-family:'Bebas Neue',ui-sans-serif,system-ui,sans-serif;
  letter-spacing:.02em; color:var(--cream); text-transform:none;
  margin-bottom:14px; display:block;
}
.press p{position:relative; z-index:1; color:var(--cream-dim); font-size:14px; max-width:56ch; margin:0 auto;}
.press .thanks{position:relative; z-index:1; font-size:12.5px; color:var(--cream-dim); margin-top:10px; font-style:italic;}
.press a{color:var(--amber); text-decoration:underline; text-decoration-color:rgba(224,138,52,0.4); text-underline-offset:2px; transition:color 0.2s ease;}
.press a:hover{color:var(--neon);}
@keyframes pressSweep{
  0%{left:-60%;}
  100%{left:120%;}
}
@keyframes pressBadgeGlow{
  0%,100%{box-shadow:0 0 14px rgba(245,196,51,.4);}
  50%{box-shadow:0 0 26px rgba(245,196,51,.7);}
}
@media (max-width:600px){
  .press-card{padding:30px 22px;}
  .press .eyebrow{font-size:20px;}
}

/* ---------- HISTORIA (reordenable: título / vídeo / texto en móvil) ---------- */
.historia-grid{
  display:grid;
  grid-template-columns:1.1fr 0.9fr;
  grid-template-areas:
    "head  ."
    "prose video";
  column-gap:36px; row-gap:16px; align-items:start;
}
.historia-head{grid-area:head; font-size:26px; margin:0;}
.historia-grid .studio-photo-wrap{grid-area:video; align-self:start;}
.historia-prose{grid-area:prose;}
@media (max-width:900px){
  .historia-grid{
    grid-template-columns:1fr;
    grid-template-areas:
      "head"
      "video"
      "prose";
  }
}

/* ---------- MÁS AIRE ENTRE SECCIONES (misma convención que Radio) ---------- */
#historia, #pedro-bio, #filosofia, #equipo, #formatos, .press{
  padding:56px 0;
  border-bottom:1px solid var(--line);
}

/* ---------- SLOGAN "UN MEDIO INDEPENDIENTE" — dinamismo ---------- */
.slogan-block{
  position:relative; overflow:hidden;
  background:linear-gradient(160deg, var(--brick), var(--brick-deep));
  background-size:220% 220%;
  animation:sloganShift 7s ease-in-out infinite;
}
.slogan-block::before{
  content:""; position:absolute; top:0; left:-60%; width:55%; height:100%;
  background:linear-gradient(90deg, transparent, rgba(245,196,51,0.16), transparent);
  animation:sloganSweep 4.8s ease-in-out infinite;
  pointer-events:none;
}
.slogan-block .sl{position:relative; z-index:1; display:inline-block; animation:sloganPulse 2.4s ease-in-out infinite;}
@keyframes sloganShift{
  0%,100%{background-position:0% 50%;}
  50%{background-position:100% 50%;}
}
@keyframes sloganSweep{
  0%{left:-60%;}
  100%{left:120%;}
}
@keyframes sloganPulse{
  0%,100%{transform:scale(1);}
  50%{transform:scale(1.015);}
}

/* ---------- FORMATOS — dinamismo visual (son nuestros productos) ---------- */
#formatos .format-card{
  position:relative; overflow:hidden;
  transition:transform .35s ease, box-shadow .35s ease, border-color .35s ease;
}
#formatos .format-card::before{
  content:""; position:absolute; top:0; left:-40%; width:40%; height:2px;
  background:linear-gradient(90deg, transparent, var(--neon), transparent);
  animation:cardTopSweep 3.6s ease-in-out infinite;
}
#formatos .format-card:hover{
  transform:translateY(-6px);
  border-color:rgba(245,196,51,.45);
  box-shadow:0 14px 34px rgba(0,0,0,.35), 0 0 0 1px rgba(245,196,51,.12), 0 0 24px rgba(245,196,51,.15);
}
#formatos .format-card .fmt-tag{
  display:inline-block; padding:3px 10px; border-radius:99px;
  border:1px solid rgba(245,196,51,.35); background:rgba(245,196,51,.08);
}

/* ---------- HERO — ajustado tras quitar el subtítulo ---------- */
.ahero{padding:44px 0 36px;}

/* ---------- SLOGAN duplicado para móvil (romper el muro de texto de la biografía de Pedro) ---------- */
.slogan-block-mobile{ display:none; }
@media (max-width:900px){
  .slogan-block-mobile{ display:block; margin:8px 0 24px; }
  #filosofia .slogan-block{ display:none; }
}

/* ==========================================================
   CONTACTO  (añadido en 1.4.76)
   ========================================================== */

/* ---------- HERO ---------- */
.chero{
  position:relative; padding:44px 0 36px; overflow:hidden;
  background:
    radial-gradient(620px 340px at 50% 30%, rgba(224,138,52,0.14), transparent 62%),
    radial-gradient(1100px 460px at 12% -10%, rgba(154,63,39,0.5), transparent 60%),
    radial-gradient(800px 460px at 100% 0%, rgba(245,196,51,0.1), transparent 55%),
    var(--ink);
  border-bottom:1px solid var(--line);
}
.chero-inner{max-width:820px;}
.chero h1{font-size:clamp(38px,5.6vw,60px); margin-bottom:16px;}
.chero h1 em{font-style:normal; color:var(--neon); animation:textGlow 2.4s ease-in-out infinite;}
.chero-sub{color:var(--cream-dim); font-size:15.5px; max-width:68ch; line-height:1.56; margin:0;}

/* ---------- QUICK NAV (indice de bloques) ---------- */
.quicknav-section{padding:26px 0; border-bottom:1px solid var(--line);}
.quicknav{display:flex; flex-wrap:wrap; column-gap:26px; row-gap:10px;}
.quicknav a{
  font-family:'Bebas Neue',ui-sans-serif,system-ui,sans-serif; font-size:17px; letter-spacing:0.04em; color:var(--neon);
  text-decoration:none; animation:textGlow 2.4s ease-in-out infinite;
  border-bottom:2px solid transparent; transition:border-color 0.2s ease;
}
.quicknav a:hover{border-color:var(--neon);}

/* ---------- BLOQUES DE CONTACTO ---------- */
.contact-block{padding:56px 0; border-bottom:1px solid var(--line); scroll-margin-top:106px;}
.contact-block .section-head h2{color:var(--neon); animation:textGlow 2.4s ease-in-out infinite;}
.contact-copy{max-width:74ch;}

/* ---------- TARJETA GROOVER (prioridad) ---------- */
.priority-card{
  position:relative; overflow:hidden;
  margin:22px 0; padding:24px 26px; border-radius:16px;
  background:linear-gradient(160deg, var(--brick), var(--brick-deep));
  border:1px solid rgba(245,196,51,.35);
  box-shadow:0 18px 38px rgba(0,0,0,.42);
  max-width:74ch;
}
.priority-card::before{
  content:""; position:absolute; top:0; left:-60%; width:50%; height:100%;
  background:linear-gradient(90deg, transparent, rgba(245,196,51,0.16), transparent);
  animation:pressSweep 5s ease-in-out infinite;
  pointer-events:none;
}
.priority-card > *{position:relative; z-index:1;}
.priority-badge{
  display:inline-block; margin-bottom:14px; padding:6px 16px; border-radius:99px;
  font-family:'Space Mono',ui-monospace,monospace; font-size:11px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--ink); background:var(--neon);
  animation:pressBadgeGlow 3s ease-in-out infinite;
}
.priority-card h3{font-size:21px; color:var(--cream); margin-bottom:8px;}
.priority-card p{font-size:14px; color:rgba(243,234,217,0.88); line-height:1.58; margin:0 0 12px;}
.priority-card p:last-of-type{margin-bottom:16px;}
.priority-card .fee{color:var(--neon); font-weight:700;}
.priority-card .btn-solid{box-shadow:0 8px 20px rgba(0,0,0,.35);}
@media (max-width:600px){ .priority-card{padding:20px 18px;} .priority-card h3{font-size:19px;} }

.standard-recep{max-width:74ch; margin:22px 0 0;}
.standard-recep h3{font-size:16px; color:var(--cream); margin-bottom:6px; font-family:'Bebas Neue',ui-sans-serif,system-ui,sans-serif; letter-spacing:0.03em;}
.standard-recep p{font-size:14px; color:var(--cream-dim); line-height:1.58; margin:0;}

/* ---------- ACORDEON DE FORMULARIO ---------- */
.form-accordion{
  margin-top:22px; border:1px solid var(--line); border-radius:16px; overflow:hidden;
  background:linear-gradient(160deg, var(--ink-3), var(--ink-2));
}
.form-accordion summary{
  list-style:none; cursor:pointer; padding:16px 22px; display:flex; align-items:center; justify-content:space-between;
  font-family:'Bebas Neue',ui-sans-serif,system-ui,sans-serif; font-size:17px; letter-spacing:0.04em; color:var(--cream);
}
.form-accordion summary::-webkit-details-marker{display:none;}
.form-accordion summary .chev{color:var(--neon); transition:transform 0.25s ease; font-family:'Space Mono',ui-monospace,monospace; font-size:14px;}
.form-accordion[open] summary .chev{transform:rotate(180deg);}
.form-accordion summary:hover{color:var(--neon);}
.contact-form{padding:4px 22px 26px; display:grid; gap:16px;}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:14px;}
@media (max-width:640px){ .form-row{grid-template-columns:1fr;} .form-field.half-alone{max-width:none !important;} }
.form-field{display:flex; flex-direction:column; gap:6px;}
.form-field.half-alone{max-width:calc(50% - 7px);}
.form-field label{font-family:'Space Mono',ui-monospace,monospace; font-size:11px; letter-spacing:0.05em; color:var(--amber); text-transform:uppercase;}
.form-field .hint{font-size:11.5px; color:var(--cream-dim); font-family:'Karla',ui-sans-serif,system-ui,sans-serif; text-transform:none; letter-spacing:0; margin-top:2px;}
.form-field input[type=text], .form-field input[type=email], .form-field input[type=url], .form-field select, .form-field textarea{
  background:var(--ink); border:1px solid var(--line); border-radius:8px; color:var(--cream);
  font-family:'Karla',ui-sans-serif,system-ui,sans-serif; font-size:14px; padding:10px 12px; width:100%;
}
.form-field select{
  appearance:none; -webkit-appearance:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8'><path d='M1 1l5 5 5-5' stroke='%23e08a34' stroke-width='1.6' fill='none' fill-rule='evenodd'/></svg>");
  background-repeat:no-repeat; background-position:right 12px center; padding-right:32px;
}
.form-field textarea{resize:vertical; min-height:90px;}
.form-field textarea.tall{min-height:120px;}
.form-field input:focus, .form-field select:focus, .form-field textarea:focus{outline:2px solid var(--focus); outline-offset:1px; border-color:transparent;}
.file-drop{
  border:1px dashed var(--line); border-radius:10px; padding:14px; display:flex; flex-direction:column; gap:8px;
}
.file-drop input[type=file]{font-family:'Karla',ui-sans-serif,system-ui,sans-serif; font-size:12.5px; color:var(--cream-dim); max-width:100%;}
.file-drop input[type=file]::file-selector-button{
  font-family:'Space Mono',ui-monospace,monospace; font-size:11px; letter-spacing:0.05em; background:var(--amber); color:var(--ink);
  border:none; border-radius:6px; padding:7px 12px; margin-right:10px; cursor:pointer;
}
.otros-field{display:none;}
.otros-field.show{display:flex;}
.form-submit-row{display:flex; align-items:center; gap:14px; margin-top:4px; flex-wrap:wrap;}
.bm-hp{position:absolute !important; left:-9999px !important; width:1px; height:1px; overflow:hidden;}

/* ---------- AVISOS DE ENVIO ---------- */
.form-note{
  border-radius:12px; padding:14px 18px; margin:0 0 18px;
  font-size:14.5px; line-height:1.55; font-family:'Karla',ui-sans-serif,system-ui,sans-serif;
}
.form-note.ok{background:rgba(245,196,51,0.12); border:1px solid rgba(245,196,51,.45); color:var(--cream);}
.form-note.ko{background:rgba(154,63,39,0.28); border:1px solid rgba(224,138,52,.45); color:var(--cream);}
.form-note strong{color:var(--neon);}
.form-note ul{margin:8px 0 0; padding-left:18px; color:rgba(243,234,217,0.9);}

/* ---------- OTRAS CONSULTAS ---------- */
.otras{text-align:center; padding:56px 0; scroll-margin-top:106px;}
.otras h2{font-size:32px; margin-bottom:14px; color:var(--neon); animation:textGlow 2.4s ease-in-out infinite;}
.otras p{color:var(--cream-dim); font-size:16px; line-height:1.6; max-width:58ch; margin:0 auto 18px;}
.otras .mail-link{
  display:inline-block; font-family:'Space Mono',ui-monospace,monospace; font-size:15px; color:var(--neon);
  border:1px solid var(--neon); border-radius:99px; padding:10px 20px; text-decoration:none;
}
.otras .mail-link:hover{background:rgba(245,196,51,0.1);}

/* ==========================================================
   CONTACTO — corrección de anchos en móvil (1.4.77)
   El input de archivo tiene un ancho mínimo intrínseco que
   ensanchaba la columna del formulario por encima de la tarjeta,
   y el botón de Groover no podía partir de línea.
   ========================================================== */
.contact-form{grid-template-columns:minmax(0,1fr);}
.contact-form > *{min-width:0;}
.form-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr);}
@media (max-width:640px){
  .form-row{grid-template-columns:minmax(0,1fr);}
  .form-field.half-alone{max-width:none !important;}
}
.form-field{min-width:0;}
.file-drop{min-width:0; overflow:hidden;}
.file-drop input[type=file]{width:100%; max-width:100%; box-sizing:border-box;}
.priority-card .btn-solid{white-space:normal; text-align:center; line-height:1.25; max-width:100%;}
.chero-sub .brandname{white-space:nowrap;}

/* ==========================================================
   CONTACTO — campos obligatorios (1.4.78)
   ========================================================== */
.req-star{color:var(--neon); font-weight:700; margin-left:3px;}
.form-legend{
  font-family:'Karla',ui-sans-serif,system-ui,sans-serif; font-size:12.5px; line-height:1.45;
  color:var(--cream-dim); margin:0; padding:0;
}
.contact-form .btn-solid[disabled]{
  background:rgba(245,196,51,.22); color:rgba(243,234,217,.55); cursor:not-allowed;
  transform:none; box-shadow:none;
}
.contact-form .btn-solid[disabled]:hover{background:rgba(245,196,51,.22); transform:none;}
.form-field input:not(:placeholder-shown):invalid, .form-field textarea:not(:placeholder-shown):invalid{
  border-color:rgba(224,138,52,.75);
}

/* ==========================================================
   CONTACTO — títulos en blanco y cada bloque en su recuadro (1.4.81)
   El recuadro es el contenedor de todo el bloque, así que crece
   solo al desplegarse el formulario, sin alturas fijas.
   ========================================================== */
.contact-block{padding:26px 0; border-bottom:none;}
.block-box{
  border:1px solid var(--line);
  border-radius:18px;
  background:linear-gradient(160deg, rgba(39,29,22,.55), rgba(30,23,18,.32));
  box-shadow:0 16px 36px rgba(0,0,0,.26);
  padding:30px 28px;
}
.contact-block .section-head h2{color:var(--cream); animation:none;}
.block-box .form-accordion{background:linear-gradient(160deg, rgba(20,16,13,.55), rgba(30,23,18,.45));}
@media (max-width:640px){
  .contact-block{padding:18px 0;}
  .block-box{padding:22px 16px; border-radius:14px;}
}

/* ==========================================================
   CONTACTO — animación de apertura/cierre del acordeón (1.4.82)
   La altura la anima el JavaScript; aquí solo va la flecha, que
   debe volver a su sitio al empezar a cerrarse, no al terminar.
   ========================================================== */
.form-accordion.closing summary .chev{transform:rotate(0deg);}
.form-accordion summary{transition:color .2s ease;}

/* CONTACTO — titulo del hero en blanco (1.4.83) */
.chero h1 em{color:var(--cream); animation:none; text-shadow:none;}

/* ==========================================================
   CONTACTO — índice de bloques en móvil: píldoras pequeñas (1.4.84)
   Enlaces sueltos con neón y salto de línea irregular se leían
   como un amasijo; en píldoras el flujo se lee como etiquetas.
   ========================================================== */
@media (max-width:640px){
  .quicknav-section{padding:18px 0;}
  .quicknav{gap:8px; justify-content:center;}
  .quicknav a{
    font-size:12px; letter-spacing:0.06em; line-height:1;
    color:var(--cream-dim); animation:none; text-shadow:none;
    border:1px solid var(--line); border-radius:99px;
    padding:8px 13px; background:rgba(39,29,22,0.55);
    transition:color .2s ease, border-color .2s ease, background .2s ease;
  }
  .quicknav a:hover, .quicknav a:active, .quicknav a:focus-visible{
    color:var(--neon); border-color:rgba(245,196,51,.5); background:rgba(245,196,51,0.08);
  }
}

/* ==========================================================
   HOME — logo del hero a todo el ancho de su columna (1.4.85)
   Solo escritorio (>=1180px, que es donde la rejilla ya está a
   su ancho máximo de 1132px y la columna izquierda mide 634px).
   El logo pasa de 535x260 a 634x308; los 48px que crece se le
   suman al margen superior de la playlist (26px -> 74px) para
   que su fondo siga empezando a la misma altura que antes
   respecto al bloque del logo. Móvil sin tocar.
   ========================================================== */
@media (min-width:1180px){
  .hero-horizontal{max-height:none; max-width:100%; width:100%;}
  .hero-right-col .playlist-card{margin-top:74px;}
}

/* HOME — testimonios reales: estado vacío del muro (1.4.86) */
.testi-vacio{color:var(--cream-dim); font-size:14.5px; line-height:1.6; margin:0; padding:4px 2px;}


/* ------------------------------------------------------------------
   1.4.87 — Botones de participación compactos en móvil
   Icono a la izquierda y texto a la derecha: se aprovecha el ancho
   en vez de apilar, y la tarjeta baja de ~230px a ~105px sin perder
   ni una palabra del texto. Solo móvil; en PC no se toca nada.
   ------------------------------------------------------------------ */
@media (max-width:600px){
  .participa-btns{gap:12px;}
  .pbtn{
    display:grid; grid-template-columns:auto minmax(0,1fr); align-items:start;
    column-gap:14px; row-gap:0; padding:14px 16px; border-radius:14px;
  }
  .pbtn-ic{width:38px; height:38px; border-radius:10px; font-size:17px; grid-row:1 / span 3;}
  .pbtn-title{grid-column:2; font-size:20px; line-height:1.05;}
  .pbtn-sub{grid-column:2; font-size:11.5px; line-height:1.32; margin-top:4px;}
  .pbtn-arrow{grid-column:2; margin-top:6px; padding-top:0; font-size:11px;}
}


/* ------------------------------------------------------------------
   1.4.88 — Anclas de secciones: que el título no quede bajo la cabecera
   La cabecera es pegajosa (119px en escritorio, 97px en móvil), así que
   un salto de ancla nativo dejaría el título de la sección escondido
   detrás. Con scroll-margin-top el navegador se detiene más arriba.
   El salto que viene desde otra página lo calcula force-top.js midiendo
   la cabecera en vivo; esto es para los clics dentro de la propia página.
   ------------------------------------------------------------------ */
#encuesta, #mapa-oyentes, #cancion-mes, #programas, #participa, #playlists{
  scroll-margin-top:134px;
}
@media (max-width:900px){
  #encuesta, #mapa-oyentes, #cancion-mes, #programas, #participa, #playlists{
    scroll-margin-top:112px;
  }
}


/* ------------------------------------------------------------------
   1.4.89 — Previos en vivo dentro de los botones de participación
   Cada botón enseña cómo va lo suyo. Es solo resultado: no se vota
   desde el Home, todo el bloque sigue siendo un único enlace.
   ------------------------------------------------------------------ */
.pbtn-prev{
  display:block; position:relative; z-index:1; margin-top:4px;
  padding-top:12px; border-top:1px solid var(--line);
}

/* --- Encuesta: cuatro opciones con su barra --- */
.pbtn-prev-poll .ppoll-row{
  display:grid; grid-template-columns:86px minmax(0,1fr) 34px; align-items:center;
  gap:8px; margin-bottom:6px;
}
.pbtn-prev-poll .ppoll-row:last-child{margin-bottom:0;}
.ppoll-lab{font-size:11px; color:var(--cream-dim); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.ppoll-bar{display:block; height:6px; border-radius:99px; background:rgba(255,255,255,0.07); overflow:hidden;}
.ppoll-fill{display:block; height:100%; background:var(--amber); border-radius:99px; min-width:2px;}
.ppoll-pct{font-family:'Space Mono'; font-size:10.5px; color:var(--amber); text-align:right;}

/* --- Mapa: minimapa a la izquierda, tres países a la derecha --- */
.pbtn-prev-mapa{display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); gap:12px; align-items:center;}
.pmapa-radar{display:block; border-radius:8px;}
.pmapa-radar .map-dot{width:6px; height:6px; margin:-3px 0 0 -3px; box-shadow:0 0 5px 1px rgba(245,196,51,0.55);}
.pmapa-lista{display:flex; flex-direction:column; gap:5px; min-width:0;}
.pmapa-row{display:grid; grid-template-columns:18px minmax(0,1fr) auto; align-items:center; gap:6px;}
.pmapa-flag{font-size:12px; line-height:1;}
.pmapa-name{font-size:11px; color:var(--cream-dim); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.pmapa-n{font-family:'Space Mono'; font-size:10.5px; color:var(--amber);}
.pmapa-vacio{font-size:11px; color:var(--cream-dim); line-height:1.35;}

/* --- Canción del mes: las cinco más votadas --- */
.pbtn-prev-cm{display:flex; flex-direction:column; gap:5px;}
.pcm-row{display:grid; grid-template-columns:14px minmax(0,1fr) auto; align-items:center; gap:7px;}
.pcm-pos{font-family:'Space Mono'; font-size:10px; color:var(--amber); opacity:0.75;}
.pcm-tit{font-size:11px; color:var(--cream-dim); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.pcm-n{font-family:'Space Mono'; font-size:10.5px; color:var(--amber);}
.pcm-vacio{font-size:11px; color:var(--cream-dim); line-height:1.35;}

/* --- Móvil: el previo pasa a ocupar las dos columnas de la tarjeta --- */
@media (max-width:600px){
  .pbtn-prev{grid-column:1 / -1; margin-top:8px; padding-top:10px;}
  .pbtn-prev-poll .ppoll-row{grid-template-columns:80px minmax(0,1fr) 32px;}
}

/* 1.4.91 — con previo delante, la flecha se alinea con él y no con el texto */
@media (max-width:600px){
  .pbtn-prev ~ .pbtn-arrow{grid-column:1 / -1; margin-top:10px;}
}


/* ------------------------------------------------------------------
   1.4.92 — La chapa del pie como icono de los botones de participación
   Se quita el cuadrado de fondo y el cambio de color al pasar el ratón:
   detrás de un PNG quedaban mal. La chapa conserva el latido del icono
   y el giro al pasar por encima.
   ------------------------------------------------------------------ */
/* redondo, no cuadrado: el resplandor del latido sigue la forma de la chapa */
.pbtn-ic{background:none; border-radius:50%;}
.pbtn-chapa{display:block; width:100%; height:100%; object-fit:contain;
  filter:drop-shadow(0 2px 6px rgba(0,0,0,0.45));}
.pbtn:hover .pbtn-ic{background:none; color:inherit;}
.pbtn:hover .pbtn-chapa{filter:drop-shadow(0 3px 10px rgba(245,196,51,0.35));}
@media (max-width:600px){
  .pbtn-ic{width:42px; height:42px;}
}


/* ------------------------------------------------------------------
   1.4.94 — En escritorio, el título va al lado de la chapa
   Antes la chapa iba arriba y el título debajo. Ahora comparten fila,
   como ya pasaba en móvil, y el resto (subtítulo, previo y flecha)
   ocupa las dos columnas. La cuarta fila es 1fr para que la flecha
   siga pegada abajo y las tres tarjetas mantengan la misma altura.
   ------------------------------------------------------------------ */
@media (min-width:601px){
  .pbtn{
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    grid-template-rows:auto auto auto 1fr;
    column-gap:16px; row-gap:14px; align-items:start;
  }
  .pbtn-ic{grid-column:1; grid-row:1; align-self:center;}
  .pbtn-title{grid-column:2; grid-row:1; align-self:center;}
  .pbtn-sub{grid-column:1 / -1; grid-row:2;}
  .pbtn-prev{grid-column:1 / -1; grid-row:3;}
  .pbtn-arrow{grid-column:1 / -1; grid-row:4; align-self:end; margin-top:0;}
}


/* ------------------------------------------------------------------
   1.4.97 — El nombre de quien firma el testimonio, resaltado
   Iba en el mismo gris apagado que el resto y se perdía. Ahora en
   ámbar y con algo más de peso, para que se lea de quién es.
   Se aplica igual en el muro y en el modal de "Ver todos".
   ------------------------------------------------------------------ */
.testimonios .msg .from,
.testi-modal-list .msg .from{
  color:var(--neon); font-weight:700; letter-spacing:0.02em; margin-top:6px;
}


/* ==================================================================
   1.4.99 — LA CANCIÓN DEL MES (sección destacada de /radio/)
   Todo el movimiento se apaga bajo prefers-reduced-motion, al final.
   ================================================================== */
.cdm{
  position:relative; overflow:hidden; isolation:isolate;
  padding:64px 0 72px;
  background:
    radial-gradient(1100px 420px at 50% -10%, rgba(245,196,51,0.10), transparent 70%),
    linear-gradient(180deg, var(--ink-2), var(--ink));
  border-top:1px solid var(--line); border-bottom:1px solid var(--line);
}
/* Halo que respira por detrás de todo */
.cdm::before{
  content:''; position:absolute; z-index:0; inset:auto 0 -40% 0; height:80%;
  background:radial-gradient(closest-side, rgba(154,63,39,0.35), transparent 75%);
  filter:blur(14px); animation:cdmHalo 7s ease-in-out infinite; pointer-events:none;
}
@keyframes cdmHalo{ 0%,100%{opacity:.45; transform:scale(1);} 50%{opacity:.85; transform:scale(1.08);} }

/* Cinta de texto que cruza la sección por detrás */
/* Ceñida al ancho del contenido (1180px), igual que los vúmetros del hero,
   y con los extremos desvanecidos para que no corte en seco. */
.cdm-cinta{
  position:absolute; z-index:0; top:16px; left:0; right:0;
  max-width:1180px; margin:0 auto; padding:0 24px;
  overflow:hidden; pointer-events:none; opacity:.05;
  -webkit-mask-image:linear-gradient(90deg, transparent 0, #000 10%, #000 90%, transparent 100%);
  mask-image:linear-gradient(90deg, transparent 0, #000 10%, #000 90%, transparent 100%);
}
.cdm-cinta-pista{ display:flex; width:max-content; animation:cdmCinta 46s linear infinite; }
.cdm-cinta-pista span{ font-family:'Bebas Neue'; font-size:78px; line-height:1; letter-spacing:.02em; color:var(--cream); white-space:nowrap; }
@keyframes cdmCinta{ from{transform:translateX(0);} to{transform:translateX(-50%);} }

.cdm .wrap{ position:relative; z-index:1; }
.cdm-head h2{ position:relative; display:inline-block; }
.cdm-head h2::after{
  content:''; position:absolute; left:0; right:0; bottom:-8px; height:2px;
  background:linear-gradient(90deg, var(--neon), transparent);
  transform-origin:left; animation:cdmSubrayado 3.2s ease-in-out infinite;
}
@keyframes cdmSubrayado{ 0%,100%{transform:scaleX(.35); opacity:.6;} 50%{transform:scaleX(1); opacity:1;} }

/* ---- La tarjeta ---- */
.cdm-card{
  position:relative; display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);
  gap:34px; align-items:center; margin-top:30px;
  padding:26px; border-radius:22px;
  background:linear-gradient(155deg, rgba(255,255,255,0.045), rgba(255,255,255,0.015));
  border:1px solid var(--line);
  box-shadow:0 26px 60px rgba(0,0,0,.45);
}
/* Borde de luz que gira alrededor de la tarjeta */
.cdm-card::before{
  content:''; position:absolute; inset:-1px; border-radius:23px; padding:1px; z-index:-1;
  background:conic-gradient(from 0deg, transparent 0deg, rgba(245,196,51,.85) 40deg, transparent 120deg, transparent 360deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); mask-composite:exclude;
  animation:cdmGiro 6s linear infinite;
}
@keyframes cdmGiro{ to{ transform:rotate(1turn); } }

/* ---- Vídeo ---- */
.cdm-video{ position:relative; min-width:0; }
.cdm-frame{
  position:relative; aspect-ratio:16/9; border-radius:14px; overflow:hidden;
  background:#000; border:1px solid rgba(245,196,51,.28);
  box-shadow:0 0 0 0 rgba(245,196,51,.35); animation:cdmMarco 3.4s ease-in-out infinite;
}
@keyframes cdmMarco{
  0%,100%{ box-shadow:0 0 0 0 rgba(245,196,51,.30), 0 0 22px rgba(245,196,51,.10); }
  50%{ box-shadow:0 0 0 5px rgba(245,196,51,.08), 0 0 40px rgba(245,196,51,.26); }
}
.cdm-poster{ width:100%; height:100%; object-fit:cover; display:block; opacity:.9; }
.cdm-frame.cargado .cdm-poster,
.cdm-frame.cargado .cdm-play{ display:none; }
.cdm-iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
.cdm-play{
  position:absolute; top:50%; left:50%; width:66px; height:66px; margin:-33px 0 0 -33px;
  border-radius:50%; background:rgba(245,196,51,.92);
  box-shadow:0 0 0 0 rgba(245,196,51,.45); animation:cdmPulso 2s ease-out infinite;
}
.cdm-play::after{
  content:''; position:absolute; top:50%; left:54%; transform:translate(-50%,-50%);
  border-style:solid; border-width:12px 0 12px 19px; border-color:transparent transparent transparent var(--ink);
}
@keyframes cdmPulso{ 0%{box-shadow:0 0 0 0 rgba(245,196,51,.45);} 100%{box-shadow:0 0 0 26px rgba(245,196,51,0);} }

/* Botón de sonido */
.cdm-sound{
  position:absolute; right:12px; bottom:12px; z-index:2;
  display:inline-flex; align-items:center; gap:9px; cursor:pointer;
  padding:9px 14px; border-radius:99px; border:1px solid rgba(245,196,51,.4);
  background:rgba(16,12,9,.78); backdrop-filter:blur(6px);
  font-family:'Space Mono'; font-size:11px; letter-spacing:.04em; color:var(--cream);
  transition:border-color .2s ease, background .2s ease, transform .2s ease;
}
.cdm-sound:hover{ border-color:var(--neon); transform:translateY(-2px); }
.cdm-sound.sonando{ border-color:var(--neon); color:var(--neon); }
.cdm-eq{ display:inline-flex; align-items:flex-end; gap:2px; height:14px; }
.cdm-eq i{ width:3px; height:4px; border-radius:2px; background:var(--amber); display:block; }
.cdm-sound.sonando .cdm-eq i{ background:var(--neon); animation:cdmEq .9s ease-in-out infinite; }
.cdm-sound.sonando .cdm-eq i:nth-child(2){ animation-delay:.15s; }
.cdm-sound.sonando .cdm-eq i:nth-child(3){ animation-delay:.3s; }
.cdm-sound.sonando .cdm-eq i:nth-child(4){ animation-delay:.45s; }
@keyframes cdmEq{ 0%,100%{height:4px;} 50%{height:14px;} }

/* ---- Información ---- */
.cdm-info{ min-width:0; }
.cdm-sello{
  display:inline-flex; align-items:center; gap:8px; margin-bottom:14px;
  padding:7px 14px 7px 10px; border-radius:99px;
  border:1px solid rgba(245,196,51,.45); background:rgba(245,196,51,.09);
  font-family:'Space Mono'; font-size:10.5px; letter-spacing:.09em; text-transform:uppercase; color:var(--neon);
  animation:cdmSello 3s ease-in-out infinite;
}
@keyframes cdmSello{
  0%,100%{ box-shadow:0 0 0 rgba(245,196,51,0); }
  50%{ box-shadow:0 0 20px rgba(245,196,51,.28); }
}
.cdm-trofeo{ font-size:15px; display:inline-block; animation:cdmTrofeo 2.6s ease-in-out infinite; }
@keyframes cdmTrofeo{ 0%,100%{transform:rotate(-8deg) scale(1);} 50%{transform:rotate(8deg) scale(1.16);} }

.cdm-artista{
  font-family:'Bebas Neue'; font-size:clamp(38px,5vw,62px); line-height:.98; margin:0;
  color:var(--cream); letter-spacing:.01em;
  text-shadow:0 0 26px rgba(245,196,51,.18);
}
.cdm-tema{
  font-family:'Bebas Neue'; font-size:clamp(24px,3vw,34px); line-height:1.05; margin:4px 0 12px;
  color:var(--neon); animation:pbtnKwGlow 2.8s ease-in-out infinite;
}
.cdm-meta{ font-family:'Space Mono'; font-size:11px; letter-spacing:.05em; color:var(--cream-dim); margin:0 0 16px; }
.cdm-resena{ font-size:14.5px; line-height:1.62; color:var(--cream-dim); margin:0 0 22px; }
.cdm-resena em{ color:var(--cream); font-style:italic; }

.cdm-acciones{ display:flex; flex-wrap:wrap; align-items:center; gap:14px 20px; }
.cdm-cta{
  display:inline-flex; align-items:center; gap:9px; text-decoration:none;
  padding:13px 24px; border-radius:99px; background:var(--neon); color:var(--ink);
  font-family:'Bebas Neue'; font-size:19px; letter-spacing:.05em;
  transition:transform .2s ease, box-shadow .2s ease, gap .2s ease;
  box-shadow:0 10px 26px rgba(245,196,51,.22);
}
.cdm-cta:hover{ transform:translateY(-3px); gap:14px; box-shadow:0 16px 34px rgba(245,196,51,.34); }
.cdm-cta .arr{ display:inline-block; animation:pbtnArrowNudge 1.6s ease-in-out infinite; }
.cdm-cta:hover .arr{ animation:none; }
.cdm-alt{
  font-family:'Space Mono'; font-size:11.5px; letter-spacing:.04em; color:var(--amber);
  text-decoration:none; border-bottom:1px solid rgba(201,143,74,.4); padding-bottom:2px;
  transition:color .2s ease, border-color .2s ease;
}
.cdm-alt:hover{ color:var(--neon); border-color:var(--neon); }

/* ---- Móvil ---- */
@media (max-width:900px){
  .cdm{ padding:46px 0 52px; }
  .cdm-card{ grid-template-columns:minmax(0,1fr); gap:22px; padding:18px; }
  .cdm-cinta-pista span{ font-size:48px; }
}
@media (max-width:600px){
  .cdm-card{ padding:14px; border-radius:18px; }
  .cdm-sello{ font-size:9.5px; letter-spacing:.07em; }
  .cdm-resena{ font-size:13.5px; }
  .cdm-cta{ width:100%; justify-content:center; }
  .cdm-play{ width:54px; height:54px; margin:-27px 0 0 -27px; }
  .cdm-play::after{ border-width:10px 0 10px 16px; }
}

@media (prefers-reduced-motion: reduce){
  .cdm::before, .cdm-cinta-pista, .cdm-head h2::after, .cdm-card::before,
  .cdm-frame, .cdm-play, .cdm-sello, .cdm-trofeo, .cdm-tema,
  .cdm-sound .cdm-eq i, .cdm-cta .arr{ animation:none !important; }
}


/* ------------------------------------------------------------------
   1.4.99 — Encuesta: la barra deja de pasar POR DETRÁS del texto
   El relleno ámbar se dibujaba detrás de la etiqueta y del ejemplo, y
   ahí el contraste caía a 1,8:1 y 1,05:1 — el texto de la opción
   ganadora era justo el menos legible. Ahora la barra es una línea
   fina DEBAJO del texto, como en el botón del Home.
   ------------------------------------------------------------------ */
.poll-opts.is-voted .poll-opt-bar{
  position:relative; inset:auto; display:block;
  height:6px; margin-top:10px; border-radius:99px;
  background:rgba(255,255,255,0.07); overflow:hidden;
}
.poll-opts.is-voted .poll-opt-fill{
  position:relative; height:100%; border-radius:99px;
  background:linear-gradient(90deg, var(--amber), var(--neon));
  min-width:3px;
}
.poll-opts.is-voted .poll-opt-fill::after{ display:none; }


/* ------------------------------------------------------------------
   1.5.4 — Pinchar el videoclip lleva a nuestro reproductor
   El iframe de YouTube se queda sin eventos de ratón y por encima va
   una capa enlace: así el clic no se lo lleva YouTube, sino la ficha
   del videoclip en la propia web. El botón de sonido va por encima de
   esa capa, así que sigue siendo pulsable.
   ------------------------------------------------------------------ */
.cdm-iframe{ pointer-events:none; }
.cdm-abrir{
  position:absolute; inset:0; z-index:3; display:flex;
  align-items:flex-end; justify-content:center; padding-bottom:20px;
  text-decoration:none; cursor:pointer;
  background:linear-gradient(180deg, transparent 50%, rgba(10,7,5,0.78));
  opacity:0; transition:opacity .25s ease;
}
.cdm-frame:hover .cdm-abrir,
.cdm-abrir:focus-visible{ opacity:1; }
.cdm-abrir-txt{
  display:inline-flex; align-items:center; gap:8px;
  padding:10px 20px; border-radius:99px; background:var(--neon); color:var(--ink);
  font-family:'Bebas Neue'; font-size:17px; letter-spacing:.05em;
  box-shadow:0 8px 22px rgba(0,0,0,.45);
  transform:translateY(6px); transition:transform .25s ease;
}
.cdm-frame:hover .cdm-abrir-txt{ transform:translateY(0); }
.cdm-abrir-txt .arr{ display:inline-block; }
/* En pantallas táctiles no hay hover: se deja visible y más discreto. */
@media (hover:none){
  .cdm-abrir{ opacity:1; background:linear-gradient(180deg, transparent 62%, rgba(10,7,5,0.6)); padding-bottom:14px; }
  .cdm-abrir-txt{ transform:none; font-size:15px; padding:8px 16px; }
}

/* El botón de sonido tiene que quedar por encima de la capa de "Ver en grande":
   .cdm-frame no crea contexto propio, así que su hija con z-index 3 competía
   directamente contra el botón y lo tapaba. */
.cdm-sound{ z-index:4; }

/* Reseña justificada, en bloque. Con guionado activado para que el
   justificado no abra huecos feos entre palabras. */
.cdm-resena{ text-align:justify; text-justify:inter-word; hyphens:auto; -webkit-hyphens:auto; }

/* 1.6.0 — Lema de la zona de participación: las dos llamadas destacadas */
.participa-lema strong{
  color:var(--neon); font-weight:700; letter-spacing:0.01em;
  animation:pbtnKwGlow 2.6s ease-in-out infinite;
}
.participa-lema strong:last-of-type{ animation-delay:1.3s; }

/* 1.6.2 — La barra tiene que ESTIRARSE: el botón de la opción es un flex con
   wrap, así que al pasarla de superpuesta a línea propia se quedaba en 3px
   (su ancho de contenido). Con flex:1 ocupa la fila y el porcentaje queda a
   su derecha. Afectaba a escritorio y a móvil por igual. */
.poll-opts.is-voted .poll-opt-bar{
  flex:1 1 60px; min-width:60px; align-self:center;
}

/* ==========================================================================
   RETOQUES ESTÉTICOS PREVIOS AL BETATEST (Biblia 37)
   Titulares con la palabra clave destacada, profundidad en las tarjetas de
   "Los programas" y el eslogan de "Acerca de" llenando su recuadro.
   ========================================================================== */

/* --- Titulares de sección: palabra clave en ámbar ------------------------- */
.section-head h2 em{
	font-style:normal;
	color:var(--neon);
	animation:pbtnKwGlow 2.4s ease-in-out infinite;
}
@media (prefers-reduced-motion: reduce){
	.section-head h2 em{ animation:none; }
}

/* "Zona de" en crema; el neón parpadeante se queda solo en "participación". */
#participa .section-head h2{
	color:var(--cream);
	animation:none;
	text-shadow:0 0 8px rgba(243,234,217,0.30), 0 0 22px rgba(243,234,217,0.14);
}
#participa .section-head h2 em{
	color:var(--neon);
	text-shadow:0 0 6px rgba(245,196,51,.85), 0 0 16px rgba(245,196,51,.6), 0 0 34px rgba(245,196,51,.4), 0 0 60px rgba(245,196,51,.2);
	animation:neonFlicker 5s ease-in-out infinite;
}
@media (prefers-reduced-motion: reduce){
	#participa .section-head h2 em{ animation:none; }
}

/* --- "Los programas": profundidad y vida --------------------------------- */
.prog-card{
	position:relative;
	background:linear-gradient(160deg, var(--ink-3), var(--ink-2));
	box-shadow:0 10px 22px rgba(0,0,0,0.34), inset 0 1px 0 rgba(255,255,255,0.05);
	transition:border-color .22s ease, transform .22s ease, box-shadow .22s ease;
}
/* Destello diagonal que cruza la tarjeta al pasar por encima. */
.prog-card::after{
	content:"";
	position:absolute;
	inset:0;
	background:linear-gradient(100deg, transparent 38%, rgba(245,196,51,0.10) 50%, transparent 62%);
	transform:translateX(-120%);
	transition:transform .65s ease;
	pointer-events:none;
}
.prog-card:hover::after,
.prog-card:focus-within::after{ transform:translateX(120%); }
.prog-card:hover,
.prog-card:focus-within{
	transform:translateY(-4px);
	border-color:var(--amber);
	box-shadow:0 16px 30px rgba(0,0,0,0.42), 0 0 0 1px rgba(224,138,52,0.35), 0 0 26px rgba(245,196,51,0.16), inset 0 1px 0 rgba(255,255,255,0.07);
}
.prog-card .prog-logo{ transition:transform .22s ease, box-shadow .22s ease; }
.prog-card:hover .prog-logo,
.prog-card:focus-within .prog-logo{
	transform:scale(1.06);
	box-shadow:0 5px 14px rgba(0,0,0,0.45);
}
.prog-card .prog-chevron{ transition:color .22s ease, transform .22s ease; }
.prog-card:hover .prog-chevron,
.prog-card:focus-within .prog-chevron{ color:var(--neon); transform:translateY(2px); }

/* El programa en directo mantiene su ladrillo, pero con el mismo relieve. */
.prog-card.live{
	box-shadow:0 10px 24px rgba(0,0,0,0.38), 0 0 24px rgba(245,196,51,0.14), inset 0 1px 0 rgba(255,255,255,0.07);
}
.prog-card.live:hover,
.prog-card.live:focus-within{
	box-shadow:0 16px 32px rgba(0,0,0,0.44), 0 0 34px rgba(245,196,51,0.26), inset 0 1px 0 rgba(255,255,255,0.09);
}

@media (prefers-reduced-motion: reduce){
	.prog-card,
	.prog-card::after,
	.prog-card .prog-logo,
	.prog-card .prog-chevron{ transition:none; }
	.prog-card:hover,
	.prog-card:focus-within{ transform:none; }
	.prog-card:hover::after,
	.prog-card:focus-within::after{ transform:translateX(-120%); }
}

/* --- Eslogan de "Acerca de": el texto llena el recuadro ------------------- */
/* La declaración en vw se queda arriba como respaldo para navegadores sin
   unidades de contenedor; esta la pisa donde sí se soportan. El tamaño se mide
   contra el ancho del propio recuadro, no contra la ventana, así que llena
   igual en PC que en móvil. */
.slogan-block{ container-type:inline-size; }
.slogan-block .sl{
	display:block;
	font-size:clamp(21px, 4.9cqi, 58px);
	line-height:1.04;
	text-wrap:balance;
}
@media (max-width:680px){
	.slogan-block{ padding:18px 14px; }
}

/* ==========================================================================
   TIPOGRAFÍA EN MÓVIL: MENOS MURO DE TEXTO, MENOS SCROLL (Biblia 37.5)
   Los bloques largos venían con el mismo cuerpo que en PC. En una columna de
   ~330px eso son muchas líneas seguidas: parece un muro y obliga a arrastrar
   mucho. Se baja el cuerpo solo en móvil y se activa la partición de palabras
   en los párrafos justificados.
   ========================================================================== */
@media (max-width:680px){

	.hero-tagblock{ font-size:15px; }
	.hero-tagblock p{ line-height:1.45; margin:0 0 9px; }

	.rhero-sub p{ font-size:14px; line-height:1.4; }

	.prose p{ font-size:14.5px; line-height:1.5; }
	.bio-list li{ font-size:14px; line-height:1.5; }

	.nhero p.tag,
	.mhero p.tag{ font-size:15px; }

	/* El texto justificado en una columna estrecha abre huecos enormes entre
	   palabras ("Para mentes inquietas e      inconformistas."). Con partición
	   automática —la página declara lang="es"— las líneas se llenan bien,
	   desaparecen esos ríos y de paso salen menos líneas. */
	.hero-tagblock p,
	.rhero-sub p,
	.prose p,
	.cdm-resena{
		-webkit-hyphens:auto;
		hyphens:auto;
		overflow-wrap:break-word;
	}
}

/* ---------------------------------------------------------------------------
   Epigrafes (.eyebrow) en movil: menos separacion entre letras y un punto menos
   de cuerpo. En Space Mono y en mayusculas, 0.16em de separacion deja un
   epigrafe largo muy aireado y sin sitio para una sola linea: "Lo que dice la
   gente que pasa por la barra" partia en dos. Con 11px y 0.08em entra entero y
   se ahorran 18px de alto. Escritorio no se toca.
   Los epigrafes con regla propia mas especifica (#participa, .press) mantienen
   su cuerpo a proposito.
--------------------------------------------------------------------------- */
@media (max-width:680px){
  .eyebrow{ font-size:11px; letter-spacing:.08em; }
}

/* La cinta de "Ultimos videoclips" del Home usa ya los datos reales: si un
   videoclip no tiene miniatura de YouTube (o la portada no carga), debajo queda
   el degradado de marca con la inicial de la cancion, exactamente igual que en
   las tarjetas de /media/ (.vclip). */
.clip .thumb.vph{background:linear-gradient(135deg, var(--g1,var(--brick)), var(--g2,var(--brick-deep)));}
.clip .thumb .vinit{position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-family:'Bebas Neue'; font-size:46px; letter-spacing:0.04em; color:rgba(243,234,217,0.16); z-index:0;}


/* ═══ 1.7.0 · Navegación sin recarga ═══════════════════════════════════════
   Hilo de progreso: al pulsar un enlace la página ya no parpadea, así que sin
   esto no habría ninguna señal de que algo está pasando. Aparece solo mientras
   se trae la página nueva. */
.bm-progreso{position:fixed;top:0;left:0;right:0;height:2px;z-index:9999;opacity:0;
  transition:opacity .2s ease;pointer-events:none;overflow:hidden}
.bm-progreso.activo{opacity:1}
.bm-progreso.activo::after{content:"";position:absolute;top:0;left:0;height:100%;width:40%;
  background:linear-gradient(90deg,transparent,#f5c433,#d98a2b,transparent);
  animation:bm-desliza 1s linear infinite}
@keyframes bm-desliza{from{transform:translateX(-100%)}to{transform:translateX(350%)}}
body.admin-bar .bm-progreso{top:32px}
@media (max-width:782px){body.admin-bar .bm-progreso{top:46px}}
@media (prefers-reduced-motion: reduce){
  .bm-progreso.activo::after{animation:none;width:100%;opacity:.45}
}