*{margin:0;padding:0;box-sizing:border-box}

body{
font-family:Arial;
background:#0e0e11;
color:#fff;
}

.container{
max-width:1200px;
margin:auto;
padding:20px;
}

.header{
background:#111;
border-bottom:1px solid #222;
}

.header-flex{
display:flex;
justify-content:space-between;
align-items:center;
}

.logo{
font-size:22px;
font-weight:bold;
}

nav a{
color:#fff;
margin:0 10px;
text-decoration:none;
font-weight:bold;
}

nav a:hover{
color:#ff2e2e;
}

.radio-player{
background:#000;
padding:10px;
display:flex;
justify-content:center;
}

.player-box{
display:flex;
align-items:center;
gap:15px;
background:#1a1a1f;
padding:8px 15px;
border-radius:30px;
}

.player-box button{
background:#ff2e2e;
border:none;
color:#fff;
padding:10px 15px;
border-radius:50%;
cursor:pointer;
font-size:16px;
}

.hero{
background:linear-gradient(45deg,#ff0000,#660000);
text-align:center;
padding:80px 20px;
}

.hero h1{
font-size:40px;
}

section{
margin-top:40px;
}

.player iframe{
width:100%;
height:420px;
border-radius:10px;
border:none;
}

.grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
gap:20px;
}

.card{
background:#1a1a1f;
padding:15px;
border-radius:10px;
}

.card img{
width:100%;
border-radius:8px;
}

iframe{
width:100%;
height:180px;
border:none;
border-radius:8px;
}

.footer{
background:#000;
text-align:center;
padding:40px;
margin-top:50px;
}
.radio-player{
background:#111;
color:#fff;
padding:25px;
text-align:center;
border-bottom:3px solid #ff0000;
}

.radio-status{
font-size:14px;
margin-bottom:10px;
font-weight:bold;
letter-spacing:1px;
}

.live-dot{
width:10px;
height:10px;
background:red;
border-radius:50%;
display:inline-block;
margin-right:6px;
animation:pulse 1s infinite;
}

@keyframes pulse{
0%{opacity:1}
50%{opacity:.3}
100%{opacity:1}
}

.radio-controls{
display:flex;
justify-content:center;
}

.radio-play{
width:70px;
height:70px;
border-radius:50%;
border:none;
background:linear-gradient(45deg,#ff0000,#ff3b3b);
color:#fff;
font-size:26px;
cursor:pointer;
box-shadow:0 5px 15px rgba(0,0,0,.4);
transition:0.2s;
}

.radio-play:hover{
transform:scale(1.08);
}
.radio-player{
background:#111;
padding:12px 20px;
display:flex;
align-items:center;
justify-content:space-between;
color:#fff;
border-bottom:2px solid #ff0000;
}

.radio-left{
display:flex;
gap:10px;
align-items:center;
}

.radio-live{
background:red;
padding:4px 8px;
border-radius:4px;
font-size:12px;
}

.radio-name{
font-weight:bold;
}

.radio-controls{
display:flex;
gap:10px;
align-items:center;
}

.radio-controls button{
background:#ff0000;
border:none;
color:#fff;
padding:10px 14px;
border-radius:50%;
font-size:16px;
cursor:pointer;
}
.social-icons{
display:flex;
gap:15px;
margin-top:20px;
}

.social-icons a{
font-size:24px;
width:45px;
height:45px;
display:flex;
align-items:center;
justify-content:center;
border-radius:50%;
color:#fff;
}

.facebook{
background:#1877f2;
}

.instagram{
background:#e4405f;
}

.youtube{
background:#ff0000;
}

.whatsapp{
background:#25d366;
}
.radio-player-modern{

background:#121212;
color:#fff;
padding:15px 20px;

display:flex;
justify-content:space-between;
align-items:center;

border-bottom:3px solid #ff0000;

}

.radio-info{
display:flex;
align-items:center;
gap:15px;
}

.radio-logo{
font-size:30px;
}

.radio-title{
font-weight:bold;
font-size:16px;
}

.radio-status{
font-size:12px;
color:#ff0000;
}

.radio-controls{
display:flex;
align-items:center;
gap:15px;
}

.play-btn{

width:55px;
height:55px;

border-radius:50%;
border:none;

background:linear-gradient(45deg,#ff0000,#ff5e00);

color:#fff;
font-size:18px;

cursor:pointer;

box-shadow:0 0 15px rgba(255,0,0,0.6);

transition:0.3s;

}

.play-btn:hover{
transform:scale(1.1);
}

#volume{
width:120px;
}
.wave{
display:flex;
align-items:flex-end;
gap:3px;
height:25px;
}

.wave span{
width:4px;
height:8px;
background:#ff0000;
border-radius:2px;
animation:none;
}

/* animação quando tocar */

.wave.playing span{
animation:wave 1s infinite ease-in-out;
}

.wave.playing span:nth-child(2){
animation-delay:0.2s;
}

.wave.playing span:nth-child(3){
animation-delay:0.4s;
}

.wave.playing span:nth-child(4){
animation-delay:0.6s;
}

@keyframes wave{

0%{
height:8px;
}

50%{
height:22px;
}

100%{
height:8px;
}

}
.container{
max-width:1200px;
margin:auto;
padding:20px;
}

.tv-grid{
display:grid;
grid-template-columns:2fr 1fr;
gap:30px;
}

.ads-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
gap:20px;
}

.news-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
gap:20px;
}

.news-card{
background:#1a1a1f;
padding:15px;
border-radius:10px;
}

.news-card img{
width:100%;
border-radius:6px;
}

.videos-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
gap:20px;
}

iframe{
width:100%;
height:200px;
border:none;
}

.ad{
width:100%;
}