/* =========================================================
   MULTIRÁDIO V20 — HOME / HERO 2.0
   Refinamento visual sem alterar o player das páginas de rádio.
========================================================= */
.v20-hero{position:relative;overflow:hidden;min-height:520px;display:flex;align-items:center;padding:105px 0 55px;background:radial-gradient(circle at 76% 20%,rgba(16,185,129,.12),transparent 34%),radial-gradient(circle at 18% 34%,rgba(20,88,110,.12),transparent 30%),#070b12;border-bottom:1px solid rgba(255,255,255,.06)}
.v20-hero-content{position:relative;z-index:2;max-width:900px;margin:0 auto;text-align:center}
.v20-hero-badge{margin-bottom:22px!important;padding:8px 14px!important;border-color:rgba(25,210,124,.25)!important;background:rgba(16,185,129,.08)!important;color:#6ee7b7!important;box-shadow:0 10px 35px rgba(16,185,129,.06)}
.v20-hero h1{max-width:900px;margin:0 auto;font-size:clamp(42px,6vw,76px)!important;line-height:.98!important;letter-spacing:-.045em!important;font-weight:850!important;color:#f8fafc!important}
.v20-hero h1 span{color:#19d27c}
.v20-hero p{max-width:720px;margin:22px auto 28px!important;font-size:16px!important;line-height:1.75!important;color:#94a3b8!important}
.v20-hero-search{height:64px!important;max-width:720px!important;margin:0 auto!important;padding:0 8px 0 20px!important;display:flex!important;align-items:center!important;gap:10px!important;border-radius:18px!important;background:#0d1420!important;border:1px solid rgba(25,210,124,.30)!important;box-shadow:0 0 0 4px rgba(25,210,124,.035),0 18px 55px rgba(0,0,0,.28)!important}
.v20-hero-search>i{position:static!important;transform:none!important;flex:0 0 auto!important;font-size:18px!important;color:#19d27c!important}
.v20-hero-search input{flex:1 1 auto!important;min-width:0!important;width:auto!important;height:100%!important;padding:0 4px!important;font-size:15px!important;color:#fff!important}
.v20-hero-search button{height:48px;border:0;border-radius:13px;padding:0 17px;display:inline-flex;align-items:center;gap:8px;background:#19c879;color:#03130b;font-weight:800;cursor:pointer;transition:.2s ease}
.v20-hero-search button:hover{transform:translateY(-1px);filter:brightness(1.07)}
.v20-quick-links{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;margin:16px auto 0;color:#64748b;font-size:12px}
.v20-quick-links button{border:1px solid rgba(255,255,255,.07);background:rgba(15,23,35,.78);color:#cbd5e1;border-radius:999px;padding:7px 11px;cursor:pointer;transition:.2s ease}
.v20-quick-links button:hover{border-color:rgba(25,210,124,.35);color:#19d27c;background:rgba(25,210,124,.07)}
.v20-stats{display:flex;justify-content:center;align-items:stretch;max-width:720px;margin:30px auto 0;padding-top:20px;border-top:1px solid rgba(255,255,255,.07)}
.v20-stats>div{flex:1;padding:0 18px;border-right:1px solid rgba(255,255,255,.07)}
.v20-stats>div:last-child{border-right:0}
.v20-stats strong{display:block;color:#fff;font-size:19px;font-weight:800;line-height:1.1}
.v20-stats span{display:block;margin-top:5px;color:#64748b;font-size:10px;text-transform:uppercase;letter-spacing:.09em}
.v20-hero-glow{position:absolute;width:420px;height:420px;border-radius:50%;filter:blur(80px);opacity:.16;pointer-events:none}
.v20-glow-a{right:-140px;top:50px;background:#19d27c}.v20-glow-b{left:-190px;bottom:-180px;background:#0ea5e9}
@media(max-width:767.98px){
 .v20-hero{min-height:0;padding:90px 16px 38px}
 .v20-hero h1{font-size:clamp(38px,12vw,54px)!important}
 .v20-hero p{font-size:14px!important;line-height:1.6!important;margin:18px auto 22px!important}
 .v20-hero-search{height:58px!important;padding:0 6px 0 15px!important;gap:8px!important}
 .v20-hero-search button{width:46px;min-width:46px;padding:0;justify-content:center}.v20-hero-search button span{display:none}
 .v20-quick-links{justify-content:flex-start;overflow:hidden;flex-wrap:nowrap;white-space:nowrap;margin-left:0;margin-right:0;padding-bottom:3px}
 .v20-quick-links span{flex:0 0 auto}.v20-quick-links button{flex:0 0 auto}
 .v20-stats{margin-top:23px;padding-top:16px}
 .v20-stats>div{padding:0 7px}.v20-stats strong{font-size:16px}.v20-stats span{font-size:8px;letter-spacing:.05em}
 .v20-hero-glow{width:260px;height:260px;filter:blur(60px)}
}

/* =========================================================
   V20.2 — CABEÇALHO FIXO
   Mantém a navegação da Home sempre visível durante a rolagem.
========================================================= */
.rd-navbar{
  position:fixed!important;
  top:0!important;
  left:0!important;
  right:0!important;
  width:100%!important;
  z-index:2000!important;
}
body{
  padding-top:78px!important;
}
@media(max-width:767.98px){
  body{padding-top:66px!important;}
}

/* =========================================================
   V20.6 — CABEÇALHO FIXO ROBUSTO
   Reforço para evitar que regras de versões anteriores façam o
   cabeçalho voltar a acompanhar a rolagem.
========================================================= */
html{scroll-padding-top:78px;}
.rd-navbar#mainNavbar{
  position:fixed!important;
  top:0!important;
  left:0!important;
  right:0!important;
  width:100%!important;
  margin:0!important;
  z-index:2000!important;
}
body{padding-top:78px!important;}
@media(max-width:767.98px){
  html{scroll-padding-top:66px;}
  body{padding-top:66px!important;}
}

/* =========================================================
   V20.4 — SUGESTÕES DE RÁDIOS COMPACTAS
   Visual inspirado no modelo compacto: 10 rádios em uma única
   linha no desktop, sem cartões altos e sem rolagem horizontal.
========================================================= */
.recomendadas-scroll{
  display:grid!important;
  grid-template-columns:repeat(10,minmax(0,1fr))!important;
  gap:10px!important;
  width:100%!important;
  max-width:100%!important;
  overflow:visible!important;
  padding:6px 0 4px!important;
  box-sizing:border-box!important;
  align-items:start!important;
}
.recomendadas-card{
  min-width:0!important;
  width:100%!important;
  max-width:none!important;
  padding:2px 4px 8px!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  transform:none!important;
  box-sizing:border-box!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
}
.recomendadas-card:hover{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  transform:none!important;
}
.recomendadas-card img{
  width:82px!important;
  height:82px!important;
  max-width:100%!important;
  border-radius:16px!important;
  object-fit:contain!important;
  background:#fff!important;
  padding:4px!important;
  margin:0 auto!important;
  box-shadow:0 0 0 3px rgba(25,210,124,.9),0 8px 24px rgba(16,185,129,.13)!important;
  transition:transform .2s ease!important;
}
.recomendadas-card:hover img{transform:translateY(-2px)!important;}
.recomendadas-card .text-white{
  width:100%!important;
  margin-top:10px!important;
  font-size:12px!important;
  line-height:1.25!important;
  font-weight:700!important;
  text-align:center!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.recomendadas-card .btn-ouvir-radio{
  width:100%!important;
  max-width:108px!important;
  min-height:36px!important;
  margin-top:8px!important;
  padding:7px 10px!important;
  border:0!important;
  border-radius:999px!important;
  background:#19c879!important;
  color:#03130b!important;
  font-size:12px!important;
  font-weight:800!important;
  line-height:1!important;
  box-shadow:none!important;
}
.recomendadas-card .btn-ouvir-radio:hover{
  filter:brightness(1.06)!important;
  transform:translateY(-1px)!important;
}
@media(max-width:1199.98px){
  .recomendadas-scroll{grid-template-columns:repeat(5,minmax(0,1fr))!important;}
}
@media(max-width:767.98px){
  .recomendadas-scroll{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:12px 8px!important;}
  .recomendadas-card img{width:76px!important;height:76px!important;}
}
@media(max-width:479.98px){
  .recomendadas-scroll{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:14px 8px!important;}
}

/* =========================================================
   V20.9 — MARCA DO PORTAL COM MAIS DESTAQUE
   Logo transparente + nome e subtítulo maiores no cabeçalho.
========================================================= */
.rd-navbar#mainNavbar .rd-nav-inner{
  min-height:82px!important;
}
.rd-navbar#mainNavbar .rd-brand{
  min-width:245px!important;
  gap:14px!important;
}
.rd-navbar#mainNavbar .rd-brand-mark{
  width:60px!important;
  height:60px!important;
  border-radius:16px!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  overflow:visible!important;
}
.rd-navbar#mainNavbar .rd-brand-mark img{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  padding:0!important;
  margin:0!important;
  background:transparent!important;
  border-radius:0!important;
  mix-blend-mode:normal!important;
}
.rd-navbar#mainNavbar .rd-brand-copy{
  line-height:1.08!important;
}
.rd-navbar#mainNavbar .rd-brand-copy strong{
  font-size:21px!important;
  font-weight:850!important;
  letter-spacing:.2px!important;
  color:#ffffff!important;
}
.rd-navbar#mainNavbar .rd-brand-copy small{
  margin-top:6px!important;
  font-size:11px!important;
  letter-spacing:.18em!important;
  color:#9fb0c4!important;
  font-weight:800!important;
}
@media(max-width:767.98px){
  .rd-navbar#mainNavbar .rd-nav-inner{min-height:70px!important;}
  .rd-navbar#mainNavbar .rd-brand{min-width:auto!important;gap:10px!important;}
  .rd-navbar#mainNavbar .rd-brand-mark{width:50px!important;height:50px!important;}
  .rd-navbar#mainNavbar .rd-brand-copy strong{font-size:17px!important;}
  .rd-navbar#mainNavbar .rd-brand-copy small{font-size:8px!important;margin-top:4px!important;}
}
@media(max-width:420px){
  .rd-navbar#mainNavbar .rd-brand-copy{display:flex!important;}
  .rd-navbar#mainNavbar .rd-brand-copy strong{font-size:15px!important;}
  .rd-navbar#mainNavbar .rd-brand-copy small{display:none!important;}
}

/* =========================================================
   V21.0 — MENUS MAIORES + LOGO DA RÁDIO PULSANTE AO TOCAR
========================================================= */
/* Mais destaque para os nomes do menu principal */
.rd-navbar#mainNavbar .rd-nav-links{
  gap:6px!important;
}
.rd-navbar#mainNavbar .rd-nav-link{
  font-size:15px!important;
  font-weight:800!important;
  padding:12px 15px!important;
  gap:8px!important;
  letter-spacing:.01em!important;
}
.rd-navbar#mainNavbar .rd-nav-link i{
  font-size:14px!important;
}
.rd-navbar#mainNavbar .rd-nav-link:hover,
.rd-navbar#mainNavbar .rd-nav-link.active{
  background:rgba(32,212,125,.10)!important;
  box-shadow:inset 0 -2px 0 #20d47d,0 5px 18px rgba(32,212,125,.07)!important;
}

/* O efeito pulsante do V21 foi removido do player fixo do rodapé.
   O destaque da reprodução agora fica exclusivamente na logo da rádio
   dentro da página individual (radio.php). */

/* Evita excesso de largura em telas intermediárias */
@media(max-width:1280px) and (min-width:1101px){
  .rd-navbar#mainNavbar .rd-nav-link{font-size:13px!important;padding:11px 10px!important;gap:6px!important;}
  .rd-navbar#mainNavbar .rd-nav-link i{font-size:12px!important;}
}

/* Respeita usuários que preferem menos animações */
@media(prefers-reduced-motion:reduce){
  .v11-player-shell.playing .v11-player-avatar,
  .v11-radio-footer-player.playing .v11-player-avatar,
  .v11-player-shell.playing .v11-player-live-dot,
  .v11-radio-footer-player.playing .v11-player-live-dot{animation:none!important;}
  .v11-player-shell.playing .v11-player-art-wrap::before,
  .v11-radio-footer-player.playing .v11-player-art-wrap::before{display:none!important;}
}