/*
 * upradios-v3.css
 * Design travado: identidade navy+laranja do UpRadios + espaçamento e
 * tipografia inspirados no TuneIn. Ver histórico de protótipos aprovados.
 */
:root{
  --navy-1:#021f39; --navy-2:#0a3d6b; --orange:#ff9900; --orange-dark:#e68a00;
  --bg:#fafbfc; --card:#ffffff; --ink:#0f1b2d; --ink-soft:#4b5b70; --ink-faint:#8695a8;
  --line:#eaeef2; --radius-lg:18px; --radius-md:12px;
}
body.dark{
  --bg:#0a1424; --card:#111f34; --ink:#eef2f7; --ink-soft:#a9b8cc; --ink-faint:#71829a; --line:#1d3350;
}
*{box-sizing:border-box;}
body{
  margin:0; font-family:'Inter',system-ui,sans-serif; background:var(--bg); color:var(--ink);
  transition:background .3s,color .3s; padding-bottom:96px; -webkit-font-smoothing:antialiased;
}
h1,h2,h3,.disp{font-family:'Poppins',sans-serif;}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}

/* Header */
.site-header{
  background:var(--navy-1); color:#fff; padding:0 32px; position:sticky; top:0; z-index:30;
  display:flex; align-items:center; gap:36px; height:66px;
}
.brand{display:flex; align-items:center; gap:10px; font-family:'Poppins',sans-serif; font-weight:800; font-size:19px; white-space:nowrap; flex-shrink:0;}
.brand .dot{width:8px;height:8px;border-radius:50%;background:var(--orange);flex-shrink:0;}
.main-nav{display:flex; gap:20px; font-size:13.5px; font-weight:500; white-space:nowrap;}
.main-nav a{opacity:.72;}
.main-nav a:hover, .main-nav a.active{opacity:1;}
.header-right{margin-left:auto; display:flex; align-items:center; gap:14px; flex-shrink:0;}
.icon-btn{width:36px;height:36px;border-radius:50%;border:none;background:rgba(255,255,255,.08);color:#fff;cursor:pointer;font-size:15px;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.btn-orange{background:var(--orange);color:#1c1204;border:none;padding:9px 20px;border-radius:22px;font-size:13.5px;font-weight:700;cursor:pointer;flex-shrink:0;white-space:nowrap;}
.btn-orange:hover{background:var(--orange-dark);}

/* Search band */
.search-band{padding:52px 32px 40px; max-width:1180px; margin:0 auto;}
.search-band .eyebrow{font-size:12.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--orange-dark);margin-bottom:10px;}
.search-band h1{margin:0 0 10px;font-size:38px;font-weight:800;letter-spacing:-.02em;line-height:1.08;max-width:640px;}
.search-band p{margin:0 0 26px;font-size:15px;color:var(--ink-soft);max-width:520px;}
.search-box{display:flex;gap:10px;max-width:680px;flex-wrap:wrap;background:var(--card);padding:8px;border-radius:16px;border:1px solid var(--line);box-shadow:0 8px 24px rgba(2,31,57,.06);}
.search-box input,.search-box select{border:none;padding:12px 14px;font-size:14.5px;font-family:inherit;background:transparent;color:var(--ink);flex:1;min-width:140px;outline:none;}
.search-box select{color:var(--ink-soft);border-left:1px solid var(--line);border-radius:0;}
.search-box button{background:var(--navy-1);border:none;color:#fff;font-weight:700;padding:12px 24px;border-radius:11px;cursor:pointer;font-size:14px;}

main{padding:0 32px 20px; max-width:1180px; margin:0 auto;}

/* Category rows */
.cat-row{margin:40px 0;}
.cat-row__head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:18px;}
.cat-row__head h2{font-size:20px;margin:0;font-weight:700;letter-spacing:-.01em;}
.cat-row__see-all{font-size:12.5px;color:var(--orange-dark);font-weight:700;}
.cat-row__scroll{display:flex;gap:20px;overflow-x:auto;padding:4px 4px 14px;scrollbar-width:none;-ms-overflow-style:none;}
.cat-row__scroll::-webkit-scrollbar{display:none;height:0;}

.rcard{flex:0 0 168px; display:block; position:relative;}
.rcard__logo{width:100%;aspect-ratio:1/1;border-radius:var(--radius-md);overflow:hidden;background:var(--navy-2);margin-bottom:12px;position:relative;box-shadow:0 6px 18px rgba(15,27,45,.10);transition:transform .18s,box-shadow .18s;}
.rcard:hover .rcard__logo{transform:translateY(-4px);box-shadow:0 14px 28px rgba(15,27,45,.16);}
.rcard__logo img{width:100%;height:100%;object-fit:cover;}
.rcard__name{font-size:14px;font-weight:700;line-height:1.3;margin-bottom:3px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color:var(--ink);}
.rcard__loc{font-size:12px;color:var(--ink-faint);}
.rcard__rating{display:flex;align-items:center;gap:5px;margin-top:3px;}
.rcard__stars{color:var(--orange);font-size:11.5px;letter-spacing:1px;}
.rcard__rating-count{font-size:10.5px;color:var(--ink-faint);}
.rcard__freq{position:absolute;top:9px;right:9px;background:rgba(2,31,57,.72);color:#fff;font-size:10.5px;font-weight:700;padding:3px 8px;border-radius:8px;font-family:'Poppins',sans-serif;}
.rcard__play{position:absolute;bottom:9px;right:9px;width:34px;height:34px;border-radius:50%;background:var(--orange);border:none;display:flex;align-items:center;justify-content:center;opacity:0;transform:scale(.75);transition:opacity .15s,transform .15s;cursor:pointer;box-shadow:0 4px 12px rgba(0,0,0,.3);}
.rcard:hover .rcard__play{opacity:1;transform:scale(1);}
.rcard.is-playing .rcard__logo{box-shadow:0 0 0 3px var(--orange),0 10px 24px rgba(255,153,0,.25);}
.rcard.is-playing .rcard__play{opacity:1;transform:scale(1);background:var(--navy-1);}

/* Detail / hero */
.back-link{font-size:13.5px;color:var(--ink-faint);display:inline-flex;gap:6px;align-items:center;margin:24px 0 0;font-weight:600;}
.hero-banner{position:relative;height:200px;border-radius:var(--radius-lg);overflow:hidden;margin-top:16px;background:linear-gradient(120deg,var(--navy-1),var(--navy-2));}
.hero-banner img.bg{width:100%;height:100%;object-fit:cover;opacity:.55;filter:blur(1px) saturate(1.1);}
.hero-banner .fade{position:absolute;inset:0;background:linear-gradient(0deg,rgba(2,31,57,.9),rgba(2,31,57,.15));}
.hero-content{display:flex;align-items:flex-end;gap:22px;margin-top:-64px;padding:0 8px 8px;position:relative;z-index:2;flex-wrap:wrap;}
.hero-logo{width:128px;height:128px;border-radius:var(--radius-md);overflow:hidden;flex-shrink:0;border:4px solid var(--bg);background:var(--navy-2);box-shadow:0 12px 28px rgba(0,0,0,.25);}
.hero-logo img{width:100%;height:100%;object-fit:cover;}
.hero-text h1{font-size:30px;font-weight:800;margin:0 0 6px;letter-spacing:-.02em;color:#fff;text-shadow:0 2px 12px rgba(0,0,0,.35);}
.hero-text .sub{font-size:13.5px;color:#dbe6f2;font-weight:500;}
body:not(.dark) .hero-text h1{ color:var(--navy-1); text-shadow:none; }
body:not(.dark) .hero-text .sub{ color:var(--navy-2); }
.action-row{display:flex;align-items:center;gap:14px;margin:26px 0 8px;flex-wrap:wrap;}
.play-circle{width:58px;height:58px;border-radius:50%;background:var(--orange);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 8px 20px rgba(255,153,0,.35);}
.play-circle:hover{background:var(--orange-dark);}
.icon-round{width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--ink-soft);flex-shrink:0;}
.icon-round.liked{color:var(--orange);}
.tag{display:inline-flex;align-items:center;font-size:12px;padding:6px 13px;border-radius:20px;background:rgba(255,153,0,.12);color:var(--orange-dark);font-weight:700;}
.desc{font-size:14.5px;color:var(--ink-soft);line-height:1.6;max-width:640px;margin:18px 0 6px;}
.empty{padding:50px 10px;text-align:center;color:var(--ink-faint);font-size:14px;}

/* Cities */
.cities{margin:48px 0 20px;padding:28px;border-radius:var(--radius-lg);background:var(--card);border:1px solid var(--line);}
.cities h3{margin:0 0 14px;font-size:15px;font-weight:700;}
.cities .chips{display:flex;flex-wrap:wrap;gap:9px;}
.cities .chip{font-size:12.5px;padding:7px 14px;border-radius:18px;background:var(--bg);border:1px solid var(--line);cursor:pointer;font-weight:500;}

/* Player bar */
.player-bar{position:fixed;bottom:0;left:0;right:0;z-index:60;background:var(--card);color:var(--ink);border-top:1px solid var(--line);padding:12px 32px;display:flex;align-items:center;gap:18px;transform:translateY(110%);transition:transform .4s cubic-bezier(.2,.9,.3,1);}
.player-bar.active{transform:translateY(0);}
.p-logo{width:48px;height:48px;border-radius:10px;overflow:hidden;background:var(--navy-2);flex-shrink:0;}
.p-logo img{width:100%;height:100%;object-fit:cover;}
.p-info{min-width:0;width:220px;}
.p-info .name{font-weight:700;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.p-info .status{font-size:12px;color:var(--ink-faint);display:flex;align-items:center;gap:6px;margin-top:1px;}
.live-dot{width:6px;height:6px;border-radius:50%;background:#ff4747;}
.live-dot.buffering{background:var(--ink-faint);animation:blink 1s infinite;}
@keyframes blink{50%{opacity:.2;}}
.p-play{width:44px;height:44px;border-radius:50%;background:var(--orange);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 4px 14px rgba(255,153,0,.35);}
.bars{display:flex;gap:2px;align-items:flex-end;height:16px;flex-shrink:0;}
.bars span{width:3px;background:var(--orange);border-radius:2px;height:4px;}
.player-bar.playing .bars span{animation:eq 1s infinite ease-in-out;}
.bars span:nth-child(1){animation-delay:0s;} .bars span:nth-child(2){animation-delay:.15s;}
.bars span:nth-child(3){animation-delay:.3s;} .bars span:nth-child(4){animation-delay:.45s;}
@keyframes eq{0%,100%{height:4px;} 50%{height:14px;}}
.format-badge{font-size:10px;padding:4px 9px;border-radius:6px;background:var(--bg);border:1px solid var(--line);font-family:'Poppins',sans-serif;letter-spacing:.03em;flex-shrink:0;color:var(--ink-soft);font-weight:600;}
.player-right{display:flex;align-items:center;gap:8px;margin-left:auto;flex-shrink:0;}
.vol-wrap{position:relative;}
.vol-popup{position:absolute;bottom:52px;left:50%;transform:translateX(-50%);background:var(--card);border:1px solid var(--line);border-radius:12px;padding:14px 0 10px;width:38px;height:120px;display:none;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 8px 24px rgba(2,31,57,.15);}
.vol-wrap.open .vol-popup{display:flex;}
.vol-popup input[type=range]{-webkit-appearance:none;appearance:none;width:90px;height:4px;border-radius:4px;background:var(--line);accent-color:var(--orange);transform:rotate(-90deg);}

@media (max-width:760px){
  .player-bar{ padding:9px 12px; gap:9px; }
  .p-logo{ width:38px; height:38px; }
  .p-info{ width:auto; flex:1; min-width:0; }
  .p-play{ width:38px; height:38px; flex-shrink:0; }
  .player-bar .bars{ display:none; }
  .player-bar .format-badge{ display:none; }
  .player-right{ gap:2px; flex-shrink:0; }
  .main-nav{display:none;}
  .search-band h1{font-size:28px;}
}

/* Ad overlay */
.ad-overlay{position:fixed;inset:0;z-index:100;background:rgba(2,10,20,.85);display:none;align-items:center;justify-content:center;}
.ad-overlay.show{display:flex;}
.ad-box{background:#111f34;color:#fff;border-radius:18px;padding:32px;width:330px;text-align:center;}
.ad-box .ad-label{font-size:10.5px;letter-spacing:.12em;color:#9fb4cc;text-transform:uppercase;font-weight:700;}
.ad-box .ad-title{font-family:'Poppins',sans-serif;font-size:18px;font-weight:700;margin:10px 0 4px;}
.ad-box .ad-sub{font-size:13px;color:#9fb4cc;margin-bottom:18px;}
.ad-progress{height:4px;background:rgba(255,255,255,.12);border-radius:4px;overflow:hidden;margin-bottom:16px;}
.ad-progress-fill{height:100%;background:var(--orange);width:0%;transition:width .2s linear;}
.ad-skip{font-size:12.5px;padding:9px 18px;border-radius:9px;border:1px solid rgba(255,255,255,.2);display:inline-block;color:#9fb4cc;font-weight:600;}
.ad-skip.enabled{color:var(--orange);border-color:var(--orange);cursor:pointer;}

.toast{position:fixed;top:16px;left:50%;transform:translateX(-50%);background:var(--navy-1);color:#fff;padding:11px 20px;border-radius:11px;font-size:13.5px;font-weight:500;z-index:200;opacity:0;pointer-events:none;transition:opacity .3s,transform .3s;}
.toast.show{opacity:1;transform:translateX(-50%) translateY(6px);}

/* fade entre paginas (navegacao AJAX) */
.page-fade{animation:fadeIn .3s ease;}
@keyframes fadeIn{from{opacity:0;transform:translateY(6px);} to{opacity:1;transform:translateY(0);}}

/* ===================== Menu responsivo (hamburger) ===================== */
.theme-toggle-btn{ position:relative; }
.mobile-menu-btn{
  display:none; width:36px; height:36px; border-radius:10px; border:none; background:rgba(255,255,255,.08);
  color:#fff; cursor:pointer; align-items:center; justify-content:center;
}
.mobile-menu-panel{
  display:none; flex-direction:column; background:var(--navy-1); position:sticky; top:66px; z-index:29;
  padding:6px 20px 14px; box-shadow:0 12px 20px rgba(2,31,57,.2);
}
.mobile-menu-panel a{ color:#fff; padding:13px 4px; font-size:14.5px; font-weight:500; border-bottom:1px solid rgba(255,255,255,.08); }
.mobile-menu-panel a:last-child{ border-bottom:none; }
.mobile-menu-panel.open{ display:flex; }
@media (max-width:1150px){
  .main-nav{ display:none; }
  .mobile-menu-btn{ display:flex; }
}
@media (max-width:560px){
  .site-header{ padding:0 14px; gap:10px; }
  .brand{ font-size:15px; gap:7px; }
  .header-right{ gap:8px; }
  .header-right > .btn-orange{ display:none; }
}

/* ===================== Setas de navegação nas fileiras ===================== */
.cat-row__wrap{ position:relative; }
.cat-row__nav{
  position:absolute; top:50%; transform:translateY(-50%); z-index:6;
  width:36px; height:36px; border-radius:50%; border:none; cursor:pointer;
  background:var(--card); box-shadow:0 4px 16px rgba(2,31,57,.2); color:var(--ink);
  display:flex; align-items:center; justify-content:center;
  opacity:0; transition:opacity .15s, transform .15s;
}
.cat-row__wrap:hover .cat-row__nav{ opacity:1; }
.cat-row__nav:hover{ transform:translateY(-50%) scale(1.08); }
.cat-row__nav.prev{ left:-16px; }
.cat-row__nav.next{ right:-16px; }
@media (max-width:900px){
  .cat-row__nav{ opacity:1; }
  .cat-row__nav.prev{ left:-6px; }
  .cat-row__nav.next{ right:-6px; }
}

/* ===================== Ranking Top 15 ===================== */
.rank-section{ margin-top:44px; }
.rank-list{ display:flex; flex-direction:column; background:var(--card); border:1px solid var(--line); border-radius:16px; overflow:hidden; }

.rank-row{
  display:flex; align-items:center; gap:14px; padding:12px 18px; border-bottom:1px solid var(--line);
  color:var(--ink);
}
.rank-row:last-child{ border-bottom:none; }
.rank-row:hover{ background:var(--bg); }
.rank-row.is-playing{ background:rgba(255,153,0,.08); }

.rank-row__num{
  width:26px; flex-shrink:0; text-align:center; font-family:'Poppins',sans-serif; font-weight:800;
  font-size:15px; color:var(--ink-faint);
}
.rank-row__num.top{ color:var(--orange); font-size:17px; }

.rank-row__logo{ position:relative; width:46px; height:46px; border-radius:10px; overflow:hidden; flex-shrink:0; background:var(--navy-2); }
.rank-row__logo img{ width:100%; height:100%; object-fit:cover; }
.rank-row__play{
  position:absolute; inset:0; width:100%; height:100%; border:none; border-radius:10px;
  background:rgba(2,8,18,.55); display:flex; align-items:center; justify-content:center;
  opacity:0; transition:opacity .15s; cursor:pointer;
}
.rank-row:hover .rank-row__play, .rank-row.is-playing .rank-row__play{ opacity:1; }
.rank-row.is-playing .rank-row__play svg polygon{ fill:var(--orange); }

.rank-row__info{ flex:1; min-width:0; display:flex; flex-direction:column; gap:1px; }
.rank-row__name{ font-size:13.5px; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.rank-row__loc{ font-size:11.5px; color:var(--ink-faint); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

.rank-row__stars{ flex-shrink:0; display:flex; align-items:center; gap:5px; }
.rank-row__stars .stars-glyphs{ color:var(--orange); font-size:12px; letter-spacing:1px; }
.rank-row__stars .count{ font-size:10.5px; color:var(--ink-faint); }

@media (max-width:640px){
  .rank-row{ padding:10px 12px; gap:10px; }
  .rank-row__num{ width:20px; font-size:13px; }
  .rank-row__logo{ width:40px; height:40px; }
  .rank-row__stars .count{ display:none; }
}
@media (max-width:420px){
  .rank-row__stars{ display:none; }
}

/* ===================== Rodapé ===================== */
.site-footer{
  margin-top:64px; background:var(--navy-1); color:#cfe0f2; padding:48px 32px 24px;
}
.site-footer__grid{
  max-width:1180px; margin:0 auto; display:grid; grid-template-columns:repeat(3, 1fr); gap:32px; padding-bottom:32px;
}
.site-footer__col h4{ color:#fff; font-size:13px; text-transform:uppercase; letter-spacing:.08em; margin:0 0 16px; }
.site-footer__col a{ display:block; color:#a9c1db; font-size:13.5px; padding:6px 0; }
.site-footer__col a:hover{ color:#fff; }
.site-footer__bottom{
  max-width:1180px; margin:0 auto; border-top:1px solid rgba(255,255,255,.1); padding-top:20px;
  display:flex; flex-wrap:wrap; gap:16px; justify-content:space-between; align-items:center;
  font-size:12.5px; color:#8ba0ba;
}
.site-footer__legal{ display:flex; gap:14px; flex-wrap:wrap; }
.site-footer__legal a{ color:#8ba0ba; }
.site-footer__legal a:hover{ color:#fff; }
@media (max-width:700px){ .site-footer__grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:460px){ .site-footer__grid{ grid-template-columns:1fr; } }

/* ===================== Favoritos — botão flutuante + painel (playlist) ===================== */
.fav-fab{
  position:fixed; right:22px; bottom:106px; z-index:55; width:52px; height:52px; border-radius:50%;
  background:var(--navy-1); color:var(--orange); border:none; cursor:pointer;
  display:flex; align-items:center; justify-content:center; box-shadow:0 8px 20px rgba(2,31,57,.35);
}
.fav-fab__count{
  position:absolute; top:-4px; right:-4px; background:var(--orange); color:#1c1204; font-size:10.5px; font-weight:800;
  min-width:18px; height:18px; border-radius:9px; display:flex; align-items:center; justify-content:center; padding:0 4px;
}
.fav-panel{
  position:fixed; right:22px; bottom:170px; z-index:55; width:320px; max-height:60vh;
  background:var(--card); border:1px solid var(--line); border-radius:16px; box-shadow:0 16px 40px rgba(2,31,57,.3);
  display:none; flex-direction:column; overflow:hidden;
}
.fav-panel.open{ display:flex; }
.fav-panel__head{ display:flex; align-items:center; justify-content:space-between; padding:14px 16px; border-bottom:1px solid var(--line); }
.fav-panel__head h3{ margin:0; font-size:14.5px; }
.fav-panel__head button{ background:none; border:none; cursor:pointer; color:var(--ink-faint); font-size:16px; }
.fav-panel__list{ overflow-y:auto; padding:6px; }
.fav-panel__empty{ padding:30px 16px; text-align:center; color:var(--ink-faint); font-size:13px; }
.fav-item{ display:flex; align-items:center; gap:10px; padding:8px; border-radius:10px; cursor:pointer; }
.fav-item__remove{
  flex-shrink:0; width:28px; height:28px; border-radius:50%; border:none; background:transparent;
  color:var(--ink-faint); display:flex; align-items:center; justify-content:center; cursor:pointer;
}
.fav-item__remove:hover{ background:rgba(255,87,87,.12); color:#c1272d; }
.fav-item:hover{ background:var(--bg); }
.fav-item img{ width:40px; height:40px; border-radius:8px; object-fit:cover; flex-shrink:0; }
.fav-item .fav-item__name{ font-size:13px; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.fav-item .fav-item__loc{ font-size:11px; color:var(--ink-faint); }
@media (max-width:480px){
  .fav-panel{ right:10px; left:10px; width:auto; bottom:170px; }
  .fav-fab{ right:14px; bottom:96px; }
}

/* ===================== Widget de curtir (página de detalhe) ===================== */
.rating-widget{
  display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin:22px 0 8px;
  padding:14px 18px; border-radius:14px; background:var(--card); border:1px solid var(--line);
}
.rating-widget__stars{ color:var(--orange); font-size:19px; letter-spacing:2px; }
.rating-widget__label{ font-size:12.5px; color:var(--ink-faint); margin-right:auto; }
.rating-widget__vote{
  display:inline-flex; align-items:center; gap:6px; background:var(--bg); border:1px solid var(--line);
  color:var(--ink-soft); font-size:12.5px; font-weight:600; padding:8px 14px; border-radius:20px; cursor:pointer; transition:all .15s;
}
.rating-widget__vote:hover{ background:var(--line); }
.rating-widget__vote.up.voted{ border-color:#3ecf6e; color:#3ecf6e; background:rgba(62,207,110,.08); }
.rating-widget__vote.down.voted{ border-color:#ff5757; color:#ff5757; background:rgba(255,87,87,.08); }

/* ===================== Páginas institucionais / listagem por país ===================== */
.page-hero{ padding:36px 0 8px; max-width:720px; }
.page-hero h1{ font-size:28px; font-weight:800; margin:0 0 8px; letter-spacing:-.01em; }
.page-hero p{ color:var(--ink-soft); font-size:14.5px; margin:0; }

.country-chip-grid{ display:flex; flex-wrap:wrap; gap:10px; margin:24px 0 8px; }
.country-chip{
  padding:9px 16px; border-radius:20px; background:var(--card); border:1px solid var(--line);
  font-size:13px; font-weight:600; color:var(--ink);
}
.country-chip.active{ background:var(--orange); border-color:var(--orange); color:#1c1204; }

.stat-cards{ display:grid; grid-template-columns:repeat(auto-fit, minmax(180px, 1fr)); gap:16px; margin:24px 0 40px; }
.stat-card{ background:var(--card); border:1px solid var(--line); border-radius:16px; padding:22px; }
.stat-card .num{ font-family:'Poppins',sans-serif; font-size:30px; font-weight:800; color:var(--navy-1); }
body.dark .stat-card .num{ color:var(--orange); }
.stat-card .label{ font-size:12.5px; color:var(--ink-faint); margin-top:4px; }

.stat-table{ width:100%; border-collapse:collapse; margin:20px 0 40px; font-size:13.5px; }
.stat-table th{ text-align:left; padding:10px 12px; color:var(--ink-faint); font-size:11.5px; text-transform:uppercase; letter-spacing:.04em; border-bottom:1px solid var(--line); }
.stat-table td{ padding:12px; border-bottom:1px solid var(--line); }
.stat-table tr:hover td{ background:var(--card); }
.stat-table img{ width:32px; height:32px; border-radius:7px; object-fit:cover; vertical-align:middle; margin-right:10px; }

.contact-form{ max-width:560px; margin:24px 0 40px; }
.contact-form label{ display:block; font-size:12.5px; font-weight:700; color:var(--ink-soft); margin:16px 0 6px; }
.contact-form input, .contact-form textarea{
  width:100%; padding:12px 14px; border-radius:10px; border:1px solid var(--line); background:var(--card); color:var(--ink);
  font-size:14px; font-family:inherit; box-sizing:border-box;
}
.contact-form textarea{ resize:vertical; }

/* ===================== Paginação compacta ===================== */
.pagination{ display:flex; align-items:center; gap:6px; justify-content:center; margin-top:32px; flex-wrap:wrap; }
.pagination__num{
  min-width:36px; height:36px; padding:0 8px; border-radius:9px; display:flex; align-items:center; justify-content:center;
  font-size:13px; font-weight:600; background:var(--card); border:1px solid var(--line); color:var(--ink);
}
.pagination__num.active{ background:var(--orange); border-color:var(--orange); color:#1c1204; }
.pagination__nav{
  padding:0 14px; height:36px; border-radius:9px; display:flex; align-items:center; justify-content:center;
  font-size:13px; font-weight:700; background:var(--navy-1); color:#fff;
}
.pagination__ellipsis{ color:var(--ink-faint); padding:0 4px; font-size:13px; }

/* ===================== Modal de reportar problema ===================== */
.report-modal{ position:fixed; inset:0; z-index:100; background:rgba(2,10,20,.6); display:none; align-items:center; justify-content:center; padding:20px; }
.report-modal.open{ display:flex; }
.report-modal__box{ background:var(--card); border-radius:16px; padding:26px; width:100%; max-width:380px; }
.report-modal__box h3{ margin:0 0 4px; font-size:16px; }
.report-modal__box p{ margin:0 0 16px; font-size:12.5px; color:var(--ink-faint); }
.report-modal__box label{ display:block; font-size:12px; font-weight:700; color:var(--ink-soft); margin:12px 0 6px; }
.report-modal__box select, .report-modal__box textarea{
  width:100%; padding:10px 12px; border-radius:9px; border:1px solid var(--line); background:var(--bg); color:var(--ink);
  font-size:13.5px; font-family:inherit; box-sizing:border-box;
}
.report-modal__box textarea{ resize:vertical; }
.report-modal__actions{ display:flex; justify-content:flex-end; gap:10px; margin-top:18px; }
.report-modal__actions button{ padding:9px 18px; border-radius:9px; font-size:13px; font-weight:700; }

/* ===================== Mapa de rádios ===================== */
.stations-map{ height:420px; border-radius:16px; overflow:hidden; border:1px solid var(--line); z-index:1; background:#0a1424; }
/* o estilo escuro gratuito do CartoDB é neutro (cinza); esse filtro tinge
   só a camada de ladrilhos de azul-marinho — os marcadores (outra camada)
   não são afetados, continuam laranja */
.stations-map .leaflet-tile-pane{ filter: sepia(0.55) hue-rotate(178deg) saturate(2.4) brightness(0.72) contrast(1.05); }
.map-pin span{
  display:block; width:14px; height:14px; border-radius:50%; background:var(--orange);
  border:2px solid #0a1424; box-shadow:0 0 0 2px rgba(255,153,0,.35), 0 2px 6px rgba(0,0,0,.5);
}
.map-popup{ display:flex; gap:10px; align-items:center; min-width:180px; }
.map-popup img{ width:44px; height:44px; border-radius:8px; object-fit:cover; flex-shrink:0; }
.map-popup b{ font-size:13px; color:#fff; }
.map-popup span{ font-size:11.5px; color:#9fb4cc; }
.map-popup a{ font-size:12px; font-weight:700; color:var(--orange); }
.leaflet-popup-content-wrapper{ border-radius:12px; background:#0d1b30; color:#fff; }
.leaflet-popup-tip{ background:#0d1b30; }
.leaflet-container{ background:#0a1424; }
.leaflet-control-attribution{ background:rgba(10,20,36,.75) !important; color:#8ba0ba !important; }
.leaflet-control-attribution a{ color:#cfe0f2 !important; }
.leaflet-control-zoom a{ background:#0d1b30 !important; color:#fff !important; border-color:rgba(255,255,255,.1) !important; }
.leaflet-control-zoom a:hover{ background:#16283f !important; }

/* clusters no laranja da marca, em vez do verde/amarelo padrão do plugin */
.marker-cluster-small, .marker-cluster-medium, .marker-cluster-large{
  background:rgba(255,153,0,.25) !important;
}
.marker-cluster-small div, .marker-cluster-medium div, .marker-cluster-large div{
  background:var(--orange) !important; color:#1c1204 !important; font-weight:700;
}

/* ===================== Seção de Destaques (patrocinado) ===================== */
.featured-section{
  margin:40px 0; padding:24px 24px 20px; border-radius:20px;
  background:linear-gradient(135deg, rgba(255,153,0,.10), rgba(10,61,107,.06));
  border:1px solid rgba(255,153,0,.25);
}
.featured-section .cat-row__head h2{
  display:flex; align-items:center; gap:8px; color:var(--orange-dark);
}
body.dark .featured-section .cat-row__head h2{ color:var(--orange); }
.featured-section .cat-row__head h2 svg{ flex-shrink:0; fill:var(--orange); }

.rcard__sponsored{
  position:absolute; top:9px; left:9px; z-index:2; background:var(--orange); color:#1c1204;
  font-size:9.5px; font-weight:800; letter-spacing:.03em; text-transform:uppercase;
  padding:3px 8px; border-radius:7px; box-shadow:0 2px 6px rgba(0,0,0,.25);
}
.featured-section .rcard__logo{ box-shadow:0 6px 20px rgba(255,153,0,.18); }
.featured-section .rcard:hover .rcard__logo{ box-shadow:0 14px 28px rgba(255,153,0,.28); }

/* ===================== Hero com carrossel ao lado ===================== */
.search-band__grid{ display:flex; align-items:center; gap:48px; max-width:1180px; margin:0 auto; }
.search-band__text{ flex:1; min-width:0; }
.hero-carousel{ flex:0 0 320px; }
.hero-carousel__label{ font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--orange-dark); font-weight:700; margin-bottom:10px; }

.hero-feature{
  display:flex; flex-direction:row; align-items:center; text-align:left; gap:18px;
  transition:opacity .3s ease;
}
.hero-feature__img{
  width:110px; height:110px; border-radius:16px; overflow:hidden; background:var(--navy-2);
  box-shadow:0 10px 24px rgba(2,31,57,.18); flex-shrink:0;
}
.hero-feature__img img{ width:100%; height:100%; object-fit:cover; }
.hero-feature__info{ min-width:0; }
.hero-feature__name{ font-size:16px; font-weight:800; letter-spacing:-.01em; }
.hero-feature__loc{ font-size:12.5px; color:var(--ink-faint); margin-top:2px; margin-bottom:10px; }
.hero-feature__play{
  display:inline-flex; align-items:center; gap:7px; background:var(--orange); color:#1c1204; border:none;
  padding:11px 22px; border-radius:22px; font-size:13.5px; font-weight:700; cursor:pointer;
  box-shadow:0 6px 16px rgba(255,153,0,.3);
}
.hero-feature__play:hover{ background:var(--orange-dark); }

@media (max-width:900px){
  .search-band__grid{ flex-direction:column; align-items:stretch; gap:24px; }
  .hero-carousel{ flex:none; }
}
@media (max-width:520px){
  .hero-carousel{ display:none; }
}

/* ===================== Ouça em qualquer lugar ===================== */
.platforms-section{ margin:36px 0 44px; padding:28px 30px; border-radius:20px; background:var(--card); border:1px solid var(--line); }
.platforms-section .eyebrow{ font-size:11.5px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--orange-dark); margin-bottom:8px; }
.platforms-section h2{ font-size:21px; font-weight:800; margin:0 0 10px; letter-spacing:-.01em; max-width:560px; }
.platforms-section p{ font-size:14px; color:var(--ink-soft); line-height:1.6; max-width:640px; margin:0 0 20px; }
.platforms-section p a{ color:var(--orange-dark); font-weight:700; }
.platforms-section__badges{ display:flex; flex-wrap:wrap; gap:12px; }
.platform-badge{
  display:flex; align-items:center; gap:9px; padding:11px 16px; border-radius:12px; background:var(--bg);
  border:1px solid var(--line); font-size:13px; font-weight:600; color:var(--ink);
}
.platform-badge svg{ flex-shrink:0; color:var(--orange-dark); }
.platform-badge--soon{ opacity:.75; }
.platform-badge--soon span{ font-size:10px; font-weight:700; text-transform:uppercase; background:var(--line); padding:2px 7px; border-radius:6px; margin-left:2px; }