
:root{
--bg:#050608;
--text:#f4f7fb;
--muted:#aab7c7;
--blue:#1d69ff;
--line:rgba(255,255,255,.12);
--radius:22px;
--shadow:0 24px 70px rgba(0,0,0,.52);
}

*{
box-sizing:border-box;
}

body{
margin:0;
font-family:Arial,Helvetica,sans-serif;
color:var(--text);

background:
radial-gradient(circle at top left,
rgba(29,105,255,.28),
transparent 45rem),

radial-gradient(circle at top right,
rgba(29,105,255,.20),
transparent 40rem),

radial-gradient(circle at center,
rgba(29,105,255,.10),
transparent 55rem),

linear-gradient(
180deg,
#08101a 0%,
#060b12 50%,
#030507 100%
);
}

body::before{
content:"";
position:fixed;
inset:0;
pointer-events:none;
background-image:
linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),
linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
background-size:44px 44px;
mask-image:linear-gradient(to bottom, black, transparent 72%);
}

.site-shell{
width:min(1120px, calc(100% - 32px));
margin:auto;
padding:24px 0 30px;
}

.hero{
text-align:center;
padding:25px 20px 35px;
border:1px solid var(--line);
border-radius:0 0 22px 22px;
background:rgba(5,8,12,.78);
box-shadow:var(--shadow);
}

.logo{
width:min(1050px,99%);
height:auto;
display:block;
margin:0 auto 15px;
filter:drop-shadow(0 18px 18px rgba(0,0,0,.6));
}

.player-card{
max-width:760px;
margin:auto;
padding:18px;
border:0;
border-radius:var(--radius);
background:rgba(8,12,18,.82);
}

.blue-divider{
height:4px;
width:85%;
margin:35px auto;
border-radius:999px;

background:linear-gradient(
90deg,
transparent,
#1d69ff,
#65a4ff,
#1d69ff,
transparent
);

box-shadow:
0 0 10px #1d69ff,
0 0 20px #1d69ff,
0 0 35px rgba(29,105,255,.6);
}

.widget-grid{
display:grid;
grid-template-columns:repeat(3, minmax(0, 1fr));
gap:22px;
align-items:start;
}

.card{
padding:26px;
border:1px solid var(--line);
border-radius:var(--radius);
background:rgba(16,23,33,.9);
box-shadow:var(--shadow);
}

.card h2{
margin-top:0;
}

.widget-slot{
display:grid;
place-items:center;
min-height:150px;
margin-top:18px;
border:none;
border-radius:18px;
background:rgba(29,105,255,.08);
}

.map-slot{
min-height:300px;
}

.facebook-slot {
    min-height: 600px;
    padding: 0;
    overflow: hidden;
}

.fb-page,
.fb-page span,
.fb-page iframe {
    width: 100% !important;
}

.site-footer{
width:min(1120px, calc(100% - 32px));
margin:20px auto;
text-align:center;
color:var(--muted);
}

@media(max-width:760px){
.widget-grid{
grid-template-columns:1fr;
}

.logo{
width:99%;
}
}


.listen-message{
margin:14px 0 0;
text-align:center;
color:#b8c7df;
font-size:1rem;
font-weight:500;
}

.stream-links{
margin:12px 0 0;
display:flex;
flex-wrap:wrap;
justify-content:center;
gap:10px;
}

.stream-links a{
display:inline-flex;
align-items:center;
justify-content:center;
min-height:42px;
padding:0 18px;
border:1px solid rgba(255,255,255,.18);
border-radius:8px;
color:#ffffff;
background:#1d69ff;
font-weight:700;
text-decoration:none;
}

.stream-links a:hover{
background:#3b7dff;
}


.facebook-card{
align-self:start;
}

.facebook-slot{
display:block !important;
padding:0;
margin-top:10px;
min-height:600px;
height:600px;
background:transparent;
overflow:hidden;
}

.fb-page,
.fb-page span,
.fb-page iframe{
width:100% !important;
max-width:100% !important;
display:block;
}
