/*
Theme Name: WHCH Theme
Version: Production Stable Build 2
*/


/* ===== RESET ===== */

*{
box-sizing:border-box;
}

html,body{
margin:0;
padding:0;
background:#ffffff;
color:#153e7a;
font-family:Arial, Helvetica, sans-serif;
overflow-x:hidden;
}

body{
padding-bottom:140px;
}

a{
color:#0b4ea2;
text-decoration:none;
}

a:hover{
color:#153e7a;
}

img{
max-width:100%;
height:auto;
}

ul{
margin:0;
padding:0;
}


/* ===== NAV ===== */

.site-header{
background:#ffffff;
border-bottom:2px solid #c8102e;
}

.main-menu{
list-style:none;
text-align:center;
padding:15px 0;
}

.main-menu li{
display:inline-block;
margin:0 25px;
}

.main-menu a{
color:#153e7a;
font-weight:bold;
letter-spacing:2px;
text-transform:uppercase;
font-size:15px;
}


/* ===== TICKER ===== */

.wmom-top-ticker{
background:#ffffff;
border-top:1px solid #c8102e;
border-bottom:2px solid #c8102e;
height:40px;
display:flex;
align-items:center;
overflow:hidden;
position:relative;
}

.wmom-top-ticker:before{
content:"";
position:absolute;
left:0;
top:0;
height:100%;
width:60px;
background:linear-gradient(to right,#ffffff,transparent);
z-index:2;
}

.wmom-top-ticker:after{
content:"";
position:absolute;
right:0;
top:0;
height:100%;
width:60px;
background:linear-gradient(to left,#ffffff,transparent);
z-index:2;
}

.ticker-wrap{
width:100%;
overflow:hidden;
}

.ticker-move{
display:flex;
white-space:nowrap;
animation:tickerMove 20s linear infinite;
}

.ticker-content{
display:flex;
}

.ticker-content a{
color:#153e7a;
margin-right:70px;
font-size:14px;
font-weight:bold;
}

.ticker-content a:after{
content:" ● ";
color:#0b4ea2;
margin-left:25px;
}

@keyframes tickerMove{
0%{
transform:translateX(0);
}
100%{
transform:translateX(-50%);
}
}


/* ===== NOW PLAYING ===== */

.now-playing-panel{
background:#ffffff;
border-bottom:2px solid #c8102e;
padding:40px 20px;
text-align:center;
}

.np-card{
max-width:700px;
margin:auto;
background:linear-gradient(180deg,#ffffff,#f2f6fb);
border-radius:16px;
padding:35px;
border:1px solid #c8102e;
box-shadow:0 0 35px rgba(11,78,162,.18);
transition:.4s;
}

.np-card:hover{
box-shadow:0 0 55px rgba(11,78,162,.28);
transform:translateY(-2px);
}

.np-header{
color:#0b4ea2;
letter-spacing:5px;
font-size:13px;
margin-bottom:12px;
}

.np-artist{
font-size:34px;
font-weight:800;
margin-top:5px;
}

.np-title{
font-size:22px;
color:#425466;
margin-top:6px;
}


/* ===== LIVE DOT ===== */

.live-dot{
display:inline-block;
width:10px;
height:10px;
background:#c8102e;
border-radius:50%;
margin-left:8px;
animation:livePulse 1.5s infinite;
}

@keyframes livePulse{
0%{
box-shadow:0 0 0 0 rgba(11,78,162,.35);
}
70%{
box-shadow:0 0 0 10px rgba(11,78,162,0);
}
100%{
box-shadow:0 0 0 0 rgba(11,78,162,0);
}
}


/* ===== EQUALIZER ===== */

.equalizer{
margin-top:15px;
}

.equalizer span{
display:inline-block;
width:6px;
margin:0 3px;
background:#0b4ea2;
}

.equalizer span:nth-child(1){animation:eq1 1.1s infinite;}
.equalizer span:nth-child(2){animation:eq2 .9s infinite;}
.equalizer span:nth-child(3){animation:eq3 1.3s infinite;}
.equalizer span:nth-child(4){animation:eq4 .8s infinite;}
.equalizer span:nth-child(5){animation:eq5 1.2s infinite;}
.equalizer span:nth-child(6){animation:eq6 1s infinite;}
.equalizer span:nth-child(7){animation:eq7 .95s infinite;}
.equalizer span:nth-child(8){animation:eq8 1.25s infinite;}

@keyframes eq1{0%{height:8px;}50%{height:26px;}100%{height:8px;}}
@keyframes eq2{0%{height:18px;}50%{height:10px;}100%{height:18px;}}
@keyframes eq3{0%{height:6px;}50%{height:30px;}100%{height:6px;}}
@keyframes eq4{0%{height:20px;}50%{height:8px;}100%{height:20px;}}
@keyframes eq5{0%{height:10px;}50%{height:24px;}100%{height:10px;}}
@keyframes eq6{0%{height:16px;}50%{height:28px;}100%{height:16px;}}
@keyframes eq7{0%{height:7px;}50%{height:22px;}100%{height:7px;}}
@keyframes eq8{0%{height:12px;}50%{height:26px;}100%{height:12px;}}


/* ===== HERO ===== */

.home-hero{
text-align:center;
padding:60px 20px;
background:#ffffff;
}

.home-logo{
max-width:500px;
width:100%;
height:auto;
display:block;
margin:0 auto 20px auto;
}

.hero-tagline{
font-size:28px;
font-weight:bold;
color:#153e7a;
}


/* ===== PLAYER BAR ===== */

#wmom-player-bar{
position:fixed;
left:0;
right:0;
bottom:0;
z-index:9999;
background:#f7f9fc;
border-top:2px solid #c8102e;
box-shadow:0 0 20px rgba(255,0,76,.2);
}

#wmom-player-inner{
max-width:1200px;
margin:0 auto;
padding:10px 20px;
}


/* LISTEN LIVE BUTTON */

.listen-now-wrap{
text-align:center;
margin-top:15px;
margin-bottom:0;
}

.listen-now-button{
display:inline-block;
background:#c8102e;
color:#153e7a;
padding:12px 34px;
border-radius:30px;
font-weight:bold;
letter-spacing:1px;
transition:.25s;
box-shadow:0 0 15px rgba(11,78,162,.18);
}

.listen-now-button:hover{
background:#0b4ea2;
box-shadow:0 0 30px rgba(11,78,162,.28);
transform:translateY(-2px);
}


/* ===== MOBILE ===== */

@media(max-width:800px){

.main-menu{
display:grid;
grid-template-columns:1fr 1fr;
padding:0;
}

.main-menu li{
margin:0;
border:1px solid #111;
}

.main-menu a{
display:block;
padding:14px 0;
}

.np-artist{
font-size:26px;
}

.np-title{
font-size:18px;
}

.hero-tagline{
font-size:22px;
}

body{
padding-bottom:180px;
}

}
/* homepage listen button spacing fix */

.home-hero{

margin-top:25px;

border-top:1px solid #dbe5f1;

padding-top:25px;

}
/* HOMEPAGE CONTENT BLOCKS */

.home-content{
max-width:1200px;
margin:40px auto;
padding:0 20px;
}

.featured-story{
background:#0a0a0a;
border:1px solid #c8102e;
border-radius:16px;
padding:40px;
margin-bottom:30px;
box-shadow:0 0 25px rgba(255,0,76,.2);
font-size:28px;
font-weight:bold;
text-align:center;
}

.music-row{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:25px;
margin-bottom:30px;
}

.music-story{
background:#ffffff;
border-radius:14px;
padding:25px;
border:1px solid #dbe5f1;
box-shadow:0 0 18px rgba(255,0,76,.15);
min-height:140px;
}

.entertainment-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:20px;
margin-bottom:40px;
}

.ent-story{
background:#0d0d0d;
border-radius:12px;
padding:20px;
border:1px solid #dbe5f1;
min-height:110px;
}

.music-story:hover,
.ent-story:hover,
.featured-story:hover{
box-shadow:0 0 35px rgba(11,78,162,.18);
transform:translateY(-3px);
transition:.25s;
}

@media(max-width:900px){

.music-row{
grid-template-columns:1fr;
}

.entertainment-grid{
grid-template-columns:1fr 1fr;
}

}
/* STORY TEXT STYLING */

.featured-story h2{
font-size:32px;
margin-top:15px;
margin-bottom:10px;
}

.featured-story p{
color:#425466;
font-size:18px;
line-height:1.5;
}

.music-story h3{
margin-top:10px;
margin-bottom:8px;
font-size:20px;
}

.music-story p{
color:#425466;
font-size:15px;
line-height:1.4;
}

.ent-story h4{
margin-top:10px;
font-size:16px;
color:#ddd;
}

/* CLICKABLE CARD EFFECT */

.featured-story,
.music-story,
.ent-story{
cursor:pointer;
transition:.25s;
}

.featured-story:hover,
.music-story:hover,
.ent-story:hover{
border-color:#c8102e;
}
/* PLAYER CLEARANCE FIX */

.home-content{
padding-bottom:180px;
}

body{
padding-bottom:240px;
}
/* MOBILE PLAYER CLEARANCE */

@media(max-width:768px){

body{
padding-bottom:320px;
}

.home-content{
padding-bottom:220px;
}

}

/* MOBILE PLAYER CLEARANCE FIX */
@media(max-width:768px){

body{
padding-bottom:400px; /* Further increase to fix player overlap */
}

.home-content{
padding-bottom:300px; /* Ensure enough space for content */
}

.listen-now-wrap {
    position: relative;
    z-index: 100;
}
}