  :root{
    --white:#ffffff;
    --black:#111111;
    --red:#e2231a;
    --red-dark:#a3140c;
    --gold:#f2b705;
    --gray:#6b6b6b;
    --line:#e7e3df;
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{
    background:var(--white);
    color:var(--black);
    font-family:'Work Sans', sans-serif;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  h1,h2,h3, .display{
    font-family:'Anton', sans-serif;
    text-transform:uppercase;
    letter-spacing:0.5px;
    line-height:0.95;
  }
  .script{
    font-family:'Caveat', cursive;
  }
  a{color:inherit; text-decoration:none;}
  img,svg{display:block; max-width:100%;}
  .wrap{max-width:1180px; margin:0 auto; padding:0 28px;}
  section{position:relative;}

  /* ===== HEADER ===== */
  header{
    position:fixed; top:0; left:0; right:0; z-index:100;
    background:var(--black);
    border-bottom:4px solid var(--red);
  }
  .nav-inner{
    max-width:1180px; margin:0 auto; padding:0 28px;
    height:70px; display:flex; align-items:center; justify-content:space-between;
  }
  .brand{display:flex; align-items:center; gap:10px;}
  .brand-mark{width:34px; height:34px; flex-shrink:0;}
  .brand-text{
    font-family:'Anton', sans-serif;
    color:var(--white);
    font-size:20px;
    letter-spacing:0.5px;
  }
  .brand-logo-img{
  width:38px; height:38px;
  border-radius:8px;
  object-fit:cover;
  flex-shrink:0;
}
  .brand-text span{color:var(--red);}
  nav ul{display:flex; gap:34px; list-style:none;}
  nav a{
    color:var(--white); font-weight:600; font-size:14px;
    text-transform:uppercase; letter-spacing:1px;
    position:relative; padding:4px 0;
    transition:color .2s;
  }
  nav a::after{
    content:''; position:absolute; left:0; bottom:-2px; width:0; height:2px;
    background:var(--red); transition:width .25s;
  }
  nav a:hover{color:var(--gold);}
  nav a:hover::after{width:100%;}
  .burger{display:none; flex-direction:column; gap:5px; cursor:pointer; background:none; border:none;}
  .burger span{width:26px; height:2px; background:var(--white);}

  /* ===== HERO ===== */
  .hero{
  padding:150px 0 90px;
  position:relative;
  overflow:hidden;
  background:var(--white);
}
.hero-video{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
  z-index:0;
}
.hero-overlay{
  position:absolute; inset:0;
  z-index:1;
  background:linear-gradient(to bottom, rgba(0,0,0,.45), rgba(0,0,0,.65));
}

.hero-clock{
  position:absolute; top:100px; right:40px; z-index:3;
  display:flex; align-items:center; gap:18px;
  background:rgba(0,0,0,.4);
  backdrop-filter:blur(8px);
  border:1px solid rgba(226,35,26,.4);
  border-radius:16px;
  padding:16px 26px 16px 20px;
}
.clock-analog svg{width:70px; height:70px;}
.clock-digital{text-align:left;}
.clock-time{
  font-family:'Anton', sans-serif;
  font-size:38px;
  color:var(--white);
  letter-spacing:2px;
  line-height:1;
}
.clock-time .sec{color:var(--red);}
.clock-date{
  font-size:12px; letter-spacing:1.5px; text-transform:uppercase;
  color:#ccc; margin-top:8px;
}

@media (max-width:860px){
  .hero-clock{
    position:static; margin:0 auto 30px;
    transform:none;
    justify-content:center;
    top:auto; left:auto;
  }
  .clock-time{font-size:30px;}
  .clock-analog svg{width:60px; height:60px;}
}
  
  .hero-particles{
  position:absolute;
  top:0; left:0;
  width:100%; height:100%;
  z-index:1;
  pointer-events:none;
}
  .hero-inner{position:relative; z-index:2; text-align:center;}
  .eyebrow{
    display:inline-flex; align-items:center; gap:8px;
    font-size:13px; font-weight:700; letter-spacing:3px;
    text-transform:uppercase; color:var(--red-dark);
    margin-bottom:22px;
  }
  .hero .eyebrow{color:var(--white);}
  .eyebrow .dot{width:8px; height:8px; border-radius:50%; background:var(--red); animation:pulse 1.6s infinite;}
  @keyframes pulse{0%,100%{opacity:1; transform:scale(1);} 50%{opacity:.4; transform:scale(1.3);}}
  .hero h1{
  font-size:clamp(64px, 13vw, 148px);
  color:var(--white);
}
.hero h1 .fuego{
  color:var(--red);
  -webkit-text-stroke:2px var(--white);
  display:block;
}
  .hero-tagline{
    font-family:'Caveat', cursive;
    font-size:clamp(28px,4vw,42px);
    color:var(--red-dark);
    margin-top:10px;
    font-weight:700;
  }
  .hero-sub{
  margin-top:22px;
  font-size:17px;
  color:#ddd;
  font-weight:500;
  letter-spacing:0.5px;
}
.hero-sub b{color:var(--white);}
  .hero-cta{
    margin-top:38px;
    display:flex; gap:16px; justify-content:center; flex-wrap:wrap;
  }
  .btn{
    display:inline-flex; align-items:center; gap:10px;
    padding:16px 34px;
    font-weight:800; font-size:14px; text-transform:uppercase; letter-spacing:1.5px;
    border-radius:2px; cursor:pointer; border:2px solid transparent;
    transition:transform .18s ease, box-shadow .18s ease;
  }
  .btn:hover{transform:translateY(-3px);}
  .btn-primary{background:var(--red); color:var(--white); box-shadow:0 8px 0 var(--red-dark);}
  .btn-primary:hover{box-shadow:0 10px 0 var(--red-dark);}
  .btn-outline{background:transparent; color:var(--white); border-color:var(--white);}
.btn-outline:hover{background:var(--white); color:var(--black);}

  /* ===== LIVE STRIP ===== */
  .live-strip{
    background:var(--black);
    color:var(--white);
    padding:22px 0;
    border-top:4px solid var(--red);
    border-bottom:4px solid var(--red);
  }
  .live-inner{
    max-width:1180px; margin:0 auto; padding:0 28px;
    display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap;
  }
  .live-left{display:flex; align-items:center; gap:16px;}
  .onair-badge{
    background:var(--red); color:var(--white); font-weight:800; font-size:12px;
    letter-spacing:2px; padding:6px 12px; display:flex; align-items:center; gap:8px;
  }
  .onair-badge .dot{width:7px; height:7px; border-radius:50%; background:var(--white); animation:pulse 1.4s infinite;}
  .live-show{font-weight:700; font-size:16px;}
  .live-show span{display:block; font-size:12px; color:#bdbdbd; font-weight:500; margin-top:2px;}
  .play-btn{
    width:52px; height:52px; border-radius:50%;
    background:var(--red); display:flex; align-items:center; justify-content:center;
    cursor:pointer; border:none; flex-shrink:0;
    transition:background .2s;
  }
  .play-btn:hover{background:var(--gold);}
  .play-btn svg{width:18px; height:18px; fill:var(--white); margin-left:2px;}

  /* ===== SECTION LABELS ===== */
  .section-head{text-align:center; margin-bottom:52px;}
  .section-head .eyebrow{color:var(--red-dark);}
  .section-head h2{font-size:clamp(38px,6vw,58px);}
  .section-head p{color:var(--gray); max-width:520px; margin:14px auto 0; font-size:15px;}

  /* ===== PROGRAMACION ===== */
  .programacion{padding:110px 0 100px; background:var(--white);}
  .day-tabs{
    display:flex; justify-content:center; gap:10px; margin-bottom:44px; flex-wrap:wrap;
  }
  .day-tab{
    padding:10px 22px; border:2px solid var(--black); background:transparent;
    font-weight:700; font-size:13px; text-transform:uppercase; letter-spacing:1px;
    cursor:pointer; transition:all .2s;
  }
  .day-tab.active, .day-tab:hover{background:var(--black); color:var(--white);}
  .schedule{
    max-width:760px; margin:0 auto;
    border-top:2px solid var(--black);
  }
  .schedule-list{display:none;}
  .schedule-list.active{display:block;}
  .slot{
    display:flex; align-items:center; gap:24px;
    padding:20px 4px;
    border-bottom:1px solid var(--line);
  }
  .slot-time{
    font-family:'Anton', sans-serif;
    color:var(--red);
    font-size:18px;
    min-width:130px;
    letter-spacing:0.5px;
  }
  .slot-info h3{
    font-family:'Work Sans', sans-serif;
    text-transform:none;
    font-weight:700;
    font-size:16px;
    letter-spacing:0;
  }
  .slot-info p{font-size:13px; color:var(--gray); margin-top:3px;}

  /* ===== RANKING ===== */
  .ranking{
    padding:100px 0 110px;
    background:var(--white);
    border-top:1px solid var(--line);
  }
  .rank-list{
    max-width:760px; margin:0 auto;
    display:flex; flex-direction:column;
  }
  .rank-item{
    display:flex; align-items:center; gap:22px;
    padding:18px 6px;
    border-bottom:1px solid var(--line);
  }
  .rank-item:first-child{
    background:var(--black);
    border-bottom:none;
    margin-bottom:2px;
    padding:22px 20px;
  }
  .rank-item:first-child .rank-num{color:var(--gold); -webkit-text-stroke:0;}
  .rank-item:first-child .rank-song, .rank-item:first-child .rank-artist{color:var(--white);}
  .rank-item:first-child .rank-artist{color:#bbb;}
  .rank-num{
    font-family:'Anton', sans-serif;
    font-size:34px;
    color:var(--white);
    -webkit-text-stroke:1.5px var(--black);
    width:52px;
    min-width:52px;
    text-align:center;
    flex-shrink:0;
  }
  .rank-song{font-weight:700; font-size:15.5px;}
  .rank-artist{font-size:13px; color:var(--gray); margin-top:2px;}
  .rank-info{flex:1; min-width:0;}
  .rank-play{
    width:44px; height:44px; border-radius:50%; flex-shrink:0;
    background:var(--red); border:none; cursor:pointer;
    display:flex; align-items:center; justify-content:center;
    transition:background .2s, transform .15s;
  }
  .rank-play:hover{background:var(--gold); transform:scale(1.08);}
  .rank-play svg{width:15px; height:15px; fill:var(--white); margin-left:2px;}
  .rank-item:first-child .rank-play{background:var(--gold);}
  .rank-item:first-child .rank-play:hover{background:var(--red);}
  .rank-trend{
    display:flex; align-items:center; justify-content:center; gap:5px;
    font-size:12px; font-weight:700; letter-spacing:0.5px;
    padding:5px 10px; border-radius:20px;
    width:130px; min-width:130px; flex-shrink:0;
    white-space:nowrap;
  }
  .rank-trend.up{color:#1a7a2e; background:#e7f6ea;}
  .rank-trend.down{color:var(--red-dark); background:#fbeae9;}
  .rank-trend.same{color:var(--gray); background:#f0f0f0;}
  .rank-trend.new{background:#fdecc8; color:#8a5c00;}
  .rank-trend svg{width:11px; height:11px;}
  .rank-note{
    text-align:center; margin-top:34px; font-size:13px; color:var(--gray);
  }

  /* Responsive: en móvil, badge más compacto */
  @media (max-width:520px){
    .rank-item{gap:14px;}
    .rank-num{width:38px; min-width:38px; font-size:28px;}
    .rank-trend{width:auto; min-width:auto; padding:5px 9px;}
    .rank-play{width:40px; height:40px;}
  }

  /* ===== FLAME DIVIDER ===== */
  .flame-divider{
    width:100%; height:70px; display:block;
  }
  .flame-divider path{fill:var(--black);}

  /* ===== NOSOTROS (black) ===== */
  .nosotros{
    background:var(--black);
    color:var(--white);
    padding:20px 0 110px;
  }
  .nosotros-inner{
    display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center;
  }
  .nosotros h2{font-size:clamp(34px,5vw,52px); color:var(--white);}
  .nosotros h2 span{color:var(--red);}
  .nosotros p{color:#c9c9c9; margin-top:20px; line-height:1.75; font-size:15.5px;}
  .stats{display:flex; gap:40px; margin-top:36px; flex-wrap:wrap;}
  .stat b{font-family:'Anton', sans-serif; font-size:36px; color:var(--gold); display:block;}
  .stat span{font-size:12px; letter-spacing:1.5px; text-transform:uppercase; color:#999;}
  .nosotros-visual{
    position:relative; aspect-ratio:1/1; border:3px solid var(--red);
    display:flex; align-items:center; justify-content:center;
    background:linear-gradient(135deg, rgba(226,35,26,0.12), rgba(242,183,5,0.08));
  }
  .nosotros-visual .flame-big{width:60%; height:60%;}

  /* ===== CONTACTO ===== */
  .contacto{padding:110px 0 100px; background:var(--white);}
  .contact-grid{
    display:grid; grid-template-columns:1.1fr 0.9fr; gap:60px;
  }
  .contact-card{
    border:2px solid var(--black); padding:40px;
  }
  .contact-card h3{
    font-size:24px; margin-bottom:22px;
  }
  .contact-row{
    display:flex; gap:16px; align-items:flex-start; margin-bottom:20px;
  }
  .contact-row svg{width:22px; height:22px; fill:var(--red); flex-shrink:0; margin-top:2px;}
  .contact-row b{display:block; font-size:15px;}
  .contact-row span{font-size:13.5px; color:var(--gray);}
  .socials{display:flex; gap:14px; margin-top:26px;}
  .social-btn{
    width:46px; height:46px; border-radius:50%;
    background:var(--black); display:flex; align-items:center; justify-content:center;
    transition:background .2s;
  }
  .social-btn:hover{background:var(--red);}
  .social-btn svg{width:20px; height:20px; fill:var(--white);}
  .map-box{
    background:var(--black); color:var(--white);
    display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center;
    padding:40px; gap:16px;
  }
  .map-box svg{width:44px; height:44px; fill:var(--gold);}
  .map-box b{font-family:'Anton', sans-serif; font-size:22px; letter-spacing:0.5px;}
  .map-box span{color:#bbb; font-size:14px;}

  /* ===== FOOTER ===== */
footer{
  background:var(--black); color:#999;
  padding:60px 0 28px;
  border-top:4px solid var(--red);
  font-size:14px;
  position:relative;
  overflow:hidden;
}
.footer-particles{
  position:absolute; inset:0;
  z-index:0; pointer-events:none;
}
footer .wrap{position:relative; z-index:1;}
.footer-grid{
  display:grid;
  grid-template-columns:1.6fr 1fr 1fr 1.4fr;
  gap:40px;
  padding-bottom:44px;
  border-bottom:1px solid #2a2a2a;
}
.footer-col h4{
  font-family:'Anton', sans-serif;
  color:var(--white); font-size:18px; letter-spacing:0.5px;
  margin-bottom:20px;
}
.footer-brand{
  display:flex; align-items:center; gap:10px; margin-bottom:16px;
}
.footer-brand span{
  font-family:'Anton', sans-serif; color:var(--white); font-size:20px; letter-spacing:0.5px;
}
.footer-brand b{color:var(--red);}
.footer-desc{color:#9a9a9a; line-height:1.7; font-size:14px; margin-bottom:22px; max-width:300px;}
.footer-freq{
  display:inline-flex; align-items:center; gap:12px;
  border:2px solid var(--red); padding:10px 18px;
}
.footer-freq b{font-family:'Anton', sans-serif; color:var(--gold); font-size:30px; line-height:1;}
.footer-freq span{color:#bbb; font-size:11px; letter-spacing:1px; text-transform:uppercase; line-height:1.3;}
.footer-links{list-style:none;}
.footer-links li{margin-bottom:11px;}
.footer-links a{color:#9a9a9a; font-size:14px; transition:color .2s, padding-left .2s;}
.footer-links a:hover{color:var(--gold); padding-left:5px;}
.footer-contact{list-style:none;}
.footer-contact li{
  display:flex; align-items:flex-start; gap:10px;
  color:#9a9a9a; font-size:13.5px; margin-bottom:14px; line-height:1.5;
}
.footer-contact svg{width:17px; height:17px; fill:var(--red); flex-shrink:0; margin-top:1px;}
.footer-contact a{color:#9a9a9a; transition:color .2s;}
.footer-contact a:hover{color:var(--gold);}
.footer-socials{display:flex; gap:12px; margin-top:20px;}
.footer-socials a{
  width:40px; height:40px; border-radius:50%;
  background:#222; display:flex; align-items:center; justify-content:center;
  transition:background .2s, transform .15s;
}
.footer-socials a:hover{background:var(--red); transform:translateY(-3px);}
.footer-socials svg{width:18px; height:18px; fill:var(--white);}
.footer-bottom{
  display:flex; justify-content:space-between; align-items:center;
  padding-top:24px; gap:14px; flex-wrap:wrap;
}
.footer-bottom p{font-size:13px; color:#888;}
.footer-bottom b{color:var(--white);}
.footer-credit{color:#777;}

@media (max-width:860px){
  .footer-grid{grid-template-columns:1fr 1fr; gap:32px;}
  .footer-brand-col{grid-column:1 / -1;}
}
@media (max-width:520px){
  .footer-grid{grid-template-columns:1fr;}
  .footer-bottom{flex-direction:column; text-align:center;}
}
  /* ===== RESPONSIVE ===== */
  @media (max-width:860px){
    nav ul{display:none;}
    .burger{display:flex;}
    .nosotros-inner{grid-template-columns:1fr;}
    .nosotros-visual{order:-1; max-width:320px; margin:0 auto 20px;}
    .contact-grid{grid-template-columns:1fr;}
    .hero-flame{width:420px; height:420px; top:-60px; right:-140px;}
  }
  @media (max-width:520px){
    .slot{gap:14px;}
    .slot-time{min-width:96px; font-size:15px;}
    .contact-card{padding:26px;}
  }
  @media (prefers-reduced-motion: reduce){
    *{animation:none !important; transition:none !important;}
  }

  /* Botón de play en cada fila del ranking */
.rank-play{
  width:40px; height:40px; border-radius:50%; flex-shrink:0;
  background:var(--red); border:none; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  transition:background .2s, transform .15s;
}
.rank-play:hover{background:var(--gold); transform:scale(1.08);}
.rank-play svg{width:15px; height:15px; fill:var(--white); margin-left:2px;}
.rank-item:first-child .rank-play{background:var(--gold);}
.rank-item:first-child .rank-play:hover{background:var(--red);}

/* Modal reproductor */
.player-modal{
  position:fixed; inset:0; z-index:200;
  display:none; align-items:center; justify-content:center; padding:20px;
}
.player-modal.open{display:flex;}
.player-backdrop{
  position:absolute; inset:0; background:rgba(0,0,0,0.72);
  backdrop-filter:blur(3px);
}
.player-box{
  position:relative; z-index:2;
  background:var(--black); color:var(--white);
  border:3px solid var(--red); border-radius:4px;
  width:100%; max-width:420px; padding:34px 30px 30px;
  text-align:center;
  animation:playerIn .25s ease;
}
@keyframes playerIn{from{opacity:0; transform:translateY(16px) scale(.97);} to{opacity:1; transform:none;}}
.player-close{
  position:absolute; top:12px; right:16px;
  background:none; border:none; color:var(--white);
  font-size:30px; line-height:1; cursor:pointer; opacity:.7;
}
.player-close:hover{opacity:1; color:var(--red);}
.player-art{
  width:120px; height:120px; margin:0 auto 20px;
  border:2px solid var(--red); border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg, rgba(226,35,26,.15), rgba(242,183,5,.1));
  animation:spin 8s linear infinite;
}
.player-art svg{width:62%; height:62%;}
@keyframes spin{to{transform:rotate(360deg);}}
.player-label{
  font-size:11px; letter-spacing:2px; text-transform:uppercase;
  color:var(--red); font-weight:700; margin-bottom:8px;
}
.player-box h3{font-size:22px; margin-bottom:4px;}
.player-meta p{color:#bbb; font-size:14px; margin-bottom:20px;}
.player-box audio{width:100%; margin-top:6px;}
.player-note{
  color:#888; font-size:12.5px; margin-top:16px; line-height:1.5;
}
@media (prefers-reduced-motion: reduce){
  .player-art{animation:none;}
}

/* ===== Ondas sonoras del reproductor ===== */
.wave-player{
  position:relative;
  width:100%;
  height:90px;
  border-radius:8px;
  overflow:hidden;
  background:linear-gradient(135deg, rgba(226,35,26,.12), rgba(242,183,5,.08));
  border:1px solid rgba(226,35,26,.25);
  display:flex; align-items:center; justify-content:center;
}
.wave-bars{
  display:flex; align-items:center; gap:5px; height:56px;
}
.wave-bars span{
  display:block;
  width:5px;
  border-radius:3px;
  background:linear-gradient(to top, #e2231a, #f2b705);
  animation:waveMove 1s ease-in-out infinite;
}
.wave-bars span:nth-child(1){animation-delay:-1.0s;}
.wave-bars span:nth-child(2){animation-delay:-0.8s;}
.wave-bars span:nth-child(3){animation-delay:-0.6s;}
.wave-bars span:nth-child(4){animation-delay:-0.4s;}
.wave-bars span:nth-child(5){animation-delay:-0.2s;}
.wave-bars span:nth-child(6){animation-delay:-0.9s;}
.wave-bars span:nth-child(7){animation-delay:-0.7s;}
.wave-bars span:nth-child(8){animation-delay:-0.5s;}
.wave-bars span:nth-child(9){animation-delay:-0.3s;}
.wave-bars span:nth-child(10){animation-delay:-0.1s;}
.wave-bars span:nth-child(11){animation-delay:-0.85s;}
.wave-bars span:nth-child(12){animation-delay:-0.65s;}
.wave-bars span:nth-child(13){animation-delay:-0.45s;}
.wave-bars span:nth-child(14){animation-delay:-0.25s;}
.wave-bars span:nth-child(15){animation-delay:-0.05s;}
@keyframes waveMove{
  0%,100%{height:12px;}
  50%{height:52px;}
}
/* El iframe de YouTube: presente para el audio, invisible para el ojo */
.yt-hidden{
  position:absolute;
  width:1px; height:1px;
  opacity:0; pointer-events:none;
  bottom:0; left:0;
}
@media (prefers-reduced-motion: reduce){
  .wave-bars span{animation:none; height:32px;}
}

/* ===== NOTICIAS (carrusel) ===== */
.noticias{padding:100px 0 110px; background:var(--white); border-top:1px solid var(--line);}
.noticias-carrusel{
  position:relative;
  max-width:1180px; margin:0 auto;
  padding:0 60px; /* espacio para las flechas a los lados */
}
.noticias-track{
  display:flex; gap:22px; overflow-x:auto; scroll-behavior:smooth;
  padding:8px 4px 20px;
  scroll-snap-type:x mandatory;
  -ms-overflow-style:none;
  scrollbar-width:none;
}
.noticias-track::-webkit-scrollbar{display:none;}
.noticias-track::-webkit-scrollbar-track{background:#eee; border-radius:10px;}
.noticias-track::-webkit-scrollbar-thumb{background:var(--red); border-radius:10px;}
.noticia-card{
  flex:0 0 320px; scroll-snap-align:start;
  background:var(--white); border:1px solid var(--line); border-radius:10px;
  overflow:hidden; display:flex; flex-direction:column;
  transition:transform .2s, box-shadow .2s;
}
.noticia-card:hover{transform:translateY(-5px); box-shadow:0 14px 34px rgba(0,0,0,.1);}
.noticia-card.destacada{border-color:var(--red); border-width:2px;}
.noticia-img{position:relative; aspect-ratio:16/10; overflow:hidden; background:#f4f4f4;}
.noticia-img img{width:100%; height:100%; object-fit:cover; transition:transform .3s;}
.noticia-card:hover .noticia-img img{transform:scale(1.05);}
.noticia-img-fallback{
  width:100%; height:100%; display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg, rgba(226,35,26,.1), rgba(242,183,5,.08));
}
.noticia-img-fallback svg{width:56px; height:56px; opacity:.5;}
.noticia-badge{
  position:absolute; top:12px; left:12px;
  background:var(--red); color:#fff; font-size:11px; font-weight:700;
  text-transform:uppercase; letter-spacing:.5px; padding:5px 12px; border-radius:20px;
}
.noticia-body{padding:22px 22px 26px; flex:1; display:flex; flex-direction:column;}
.noticia-fecha{
  font-size:12px; font-weight:700; color:var(--red);
  text-transform:uppercase; letter-spacing:1px; margin-bottom:10px;
}
.noticia-body h3{
  font-family:'Work Sans', sans-serif; font-weight:800; font-size:18px;
  line-height:1.3; text-transform:none; letter-spacing:0; margin-bottom:10px;
}
.noticia-body p{font-size:14px; color:var(--gray); line-height:1.6;}

/* Flechas flotando por fuera del track */
.carrusel-nav{
  position:absolute; top:38%; transform:translateY(-50%);
  width:46px; height:46px; border-radius:50%;
  background:var(--black); color:#fff; border:none; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  z-index:5; transition:background .2s, transform .15s;
}
.carrusel-nav.prev{left:0;}
.carrusel-nav.next{right:0;}
.carrusel-nav:hover{background:var(--red); transform:translateY(-50%) scale(1.08);}
.carrusel-nav svg{width:20px; height:20px;}
@media (max-width:600px){
  .carrusel-nav{display:none;} /* en móvil se desliza con el dedo */
  .noticia-card{flex:0 0 82%;}
}
/* ===== Reproductor personalizado ===== */
.custom-player{width:100%;}
.cp-waves{
  display:flex; align-items:center; justify-content:center; gap:4px;
  height:44px; margin-bottom:18px;
}
.cp-waves span{
  display:block; width:4px; height:8px; border-radius:3px;
  background:linear-gradient(to top, #e2231a, #f2b705);
  transition:height .1s;
}
.cp-waves.playing span{animation:cpWave 0.9s ease-in-out infinite;}
.cp-waves span:nth-child(1){animation-delay:-0.9s;}
.cp-waves span:nth-child(2){animation-delay:-0.8s;}
.cp-waves span:nth-child(3){animation-delay:-0.7s;}
.cp-waves span:nth-child(4){animation-delay:-0.6s;}
.cp-waves span:nth-child(5){animation-delay:-0.5s;}
.cp-waves span:nth-child(6){animation-delay:-0.4s;}
.cp-waves span:nth-child(7){animation-delay:-0.3s;}
.cp-waves span:nth-child(8){animation-delay:-0.2s;}
.cp-waves span:nth-child(9){animation-delay:-0.1s;}
.cp-waves span:nth-child(10){animation-delay:0s;}
.cp-waves span:nth-child(11){animation-delay:-0.85s;}
.cp-waves span:nth-child(12){animation-delay:-0.75s;}
.cp-waves span:nth-child(13){animation-delay:-0.65s;}
.cp-waves span:nth-child(14){animation-delay:-0.55s;}
.cp-waves span:nth-child(15){animation-delay:-0.45s;}
.cp-waves span:nth-child(16){animation-delay:-0.35s;}
.cp-waves span:nth-child(17){animation-delay:-0.25s;}
.cp-waves span:nth-child(18){animation-delay:-0.15s;}
.cp-waves span:nth-child(19){animation-delay:-0.05s;}
.cp-waves span:nth-child(20){animation-delay:-0.95s;}
@keyframes cpWave{0%,100%{height:8px;}50%{height:38px;}}

.cp-controls{
  display:flex; align-items:center; justify-content:center; gap:16px;
}
.cp-play{
  width:52px; height:52px; border-radius:50%; flex-shrink:0;
  background:var(--red); border:none; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  transition:background .2s, transform .15s;
}
.cp-play:hover{background:var(--gold); transform:scale(1.06);}
.cp-play svg{width:22px; height:22px; fill:#fff;}
.cp-icon-play{margin-left:3px;}
.cp-bar-wrap{flex:1; display:flex; align-items:center; gap:10px;}
.cp-time{font-size:12px; color:#bbb; min-width:34px; font-variant-numeric:tabular-nums;}
.cp-bar{
  flex:1; height:6px; background:rgba(255,255,255,.15); border-radius:10px;
  cursor:pointer; position:relative;
}
.cp-fill{
  height:100%; width:0%; border-radius:10px;
  background:linear-gradient(90deg, var(--red), var(--gold));
}