:root{
  --bg:#050811;--bg2:#0a0f19;--panel:#111728;--panel2:#171a2c;--text:#f9fbff;--muted:#a7b0c8;
  --cyan:#18e7ff;--pink:#ff35cf;--violet:#9a63ff;--blue:#3c8bff;--green:#32f0a1;--line:rgba(255,255,255,.08);
  --shadow:0 25px 70px rgba(0,0,0,.42)
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:linear-gradient(180deg,#07080e,#0b0e18 45%,#080a11);color:var(--text);font-family:Montserrat,Arial,sans-serif;overflow-x:hidden;padding-bottom:92px}
a{text-decoration:none;color:inherit}img{max-width:100%;display:block}button,input,textarea{font:inherit}.container{width:min(1220px,calc(100% - 36px));margin:auto;position:relative;z-index:2}
.bg-grid{position:fixed;inset:0;pointer-events:none;opacity:.13;background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:36px 36px}
.orb{position:fixed;width:340px;height:340px;border-radius:50%;filter:blur(120px);opacity:.1;pointer-events:none}.orb-cyan{background:var(--cyan);left:-120px;top:200px}.orb-pink{background:var(--pink);right:-120px;top:420px}
.site-header{position:sticky;top:0;z-index:80;background:rgba(7,8,14,.92);backdrop-filter:blur(15px);border-bottom:1px solid var(--line)}
.nav-wrap{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:25px}
.brand{display:flex;align-items:center;gap:12px}.brand-mark{width:48px;height:48px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(135deg,var(--cyan),var(--violet),var(--pink));color:#061018;font-family:Orbitron;font-weight:800;box-shadow:0 0 28px rgba(20,232,255,.22)}.brand-copy{display:flex;flex-direction:column}.brand-copy strong{font-family:Orbitron;font-size:.95rem}.brand-copy small{font-size:.55rem;color:var(--muted);letter-spacing:.12em;margin-top:4px}
.main-nav{display:flex;align-items:center;gap:20px}.main-nav a{font-size:.86rem;font-weight:700;color:#dbe0f1;padding:28px 0 24px;border-bottom:3px solid transparent}.main-nav a:hover,.main-nav a.active{color:white;border-bottom-color:var(--cyan)}
.menu-toggle{display:none;background:transparent;border:0}.menu-toggle span{display:block;width:26px;height:2px;background:white;margin:5px}
.home-hero{min-height:610px;position:relative;display:flex;align-items:flex-end;padding:90px 0 70px}.home-hero-bg{position:absolute;inset:0;background-size:cover;background-position:center}.home-hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,8,14,.95),rgba(7,8,14,.58) 52%,rgba(7,8,14,.2)),linear-gradient(0deg,#07080e 0%,transparent 40%)}.home-hero-content{max-width:800px}.hero-kicker,.eyebrow{font-size:.72rem;letter-spacing:.2em;font-weight:800;color:var(--cyan)}.home-hero h1,.page-hero h1{font-family:Orbitron;margin:14px 0;font-size:clamp(3.1rem,8vw,6.8rem);line-height:.96}.home-hero h1 span{background:linear-gradient(90deg,var(--cyan),var(--pink));background-clip:text;color:transparent}.home-hero p,.page-hero p{font-size:1.06rem;line-height:1.8;color:#d4daee;max-width:700px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:25px}
.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:8px;padding:14px 21px;font-weight:800;border:1px solid transparent}.btn-primary{background:linear-gradient(100deg,var(--cyan),#70f0ff 35%,var(--violet));color:#061018}.btn-ghost{background:rgba(255,255,255,.06);border-color:var(--line)}.compact{padding:11px 15px;font-size:.86rem}
.now-strip{position:relative;margin-top:-18px;z-index:5}.now-strip-inner{display:grid;grid-template-columns:82px 1fr auto;gap:18px;align-items:center;background:linear-gradient(90deg,#141928,#19182b);padding:14px 16px;border:1px solid var(--line);box-shadow:var(--shadow)}.now-art,.cover-mini,.big-cover,.history-art{background:linear-gradient(135deg,var(--cyan),var(--pink));background-size:cover;background-position:center}.now-art{width:82px;height:82px}.now-copy{display:flex;flex-direction:column;gap:4px}.now-copy span{font-size:.68rem;color:var(--cyan);font-weight:800;letter-spacing:.14em}.now-copy strong{font-size:1.12rem}.now-copy small{color:var(--muted)}
.section{padding:82px 0}.alt{background:rgba(255,255,255,.018);border-block:1px solid var(--line)}.section-title-row{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:28px}.section-title-row h2,.promo-copy h2,.about-lead h2,.request-intro h2{font-family:Orbitron;font-size:clamp(1.9rem,4vw,3rem);margin:9px 0 0}.text-link{color:var(--cyan);font-weight:800}
.feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.feature-card{padding:26px;min-height:230px;border:1px solid var(--line);background:#111522;position:relative;overflow:hidden}.feature-card:before{content:"";position:absolute;inset:auto -30px -60px auto;width:160px;height:160px;border-radius:50%;filter:blur(50px);opacity:.2}.feature-card.cyan:before{background:var(--cyan)}.feature-card.pink:before{background:var(--pink)}.feature-card.violet:before{background:var(--violet)}.feature-card.blue:before{background:var(--blue)}.feature-card span{font-size:.68rem;letter-spacing:.14em;font-weight:800;color:var(--cyan)}.feature-card h3{font-family:Orbitron;font-size:1.35rem;margin:50px 0 10px}.feature-card p{color:var(--muted);line-height:1.6;margin:0}
.promo-split{display:grid;grid-template-columns:1.1fr .9fr;gap:45px;align-items:center}.promo-media{overflow:hidden;min-height:380px}.promo-media img{width:100%;height:100%;object-fit:cover}.promo-copy p,.about-body p{color:var(--muted);line-height:1.8}.show-slider-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.show-tile{padding:24px;background:#121725;border-top:4px solid var(--pink)}.show-tile span{color:var(--cyan);font-size:.76rem;font-weight:800}.show-tile h3{font-family:Orbitron;font-size:1.05rem;margin:13px 0}.show-tile p{color:var(--muted);line-height:1.6;font-size:.9rem}
.page-hero{position:relative;padding:110px 0 70px;background:radial-gradient(circle at 15% 10%,rgba(20,232,255,.12),transparent 30%),linear-gradient(120deg,#101524,#080a11)}.page-hero.slim{padding:80px 0 60px}.page-hero.slim h1{font-size:clamp(2.8rem,7vw,5.3rem)}.request-hero{background:radial-gradient(circle at 80% 20%,rgba(255,46,196,.16),transparent 30%),linear-gradient(120deg,#101524,#080a11)}.image-page-hero{background-image:linear-gradient(90deg,rgba(7,8,14,.9),rgba(7,8,14,.45)),var(--page-bg);background-size:cover;background-position:center;min-height:430px;display:flex;align-items:flex-end}
.player-layout{display:grid;grid-template-columns:1.2fr .8fr;gap:24px}.big-player{min-height:430px;background:linear-gradient(135deg,#171b2d,#0d111d);border:1px solid var(--line);display:grid;grid-template-columns:42% 58%;overflow:hidden}.big-cover{min-height:430px}.big-player-copy{padding:42px;display:flex;flex-direction:column;justify-content:center}.live-pill{display:inline-flex;align-items:center;gap:8px;font-size:.7rem;font-weight:800;color:var(--green);margin-bottom:30px}.live-pill i,.live-dot{width:9px;height:9px;background:var(--green);border-radius:50%;box-shadow:0 0 12px var(--green)}.big-player-copy small{color:var(--cyan);font-weight:800;letter-spacing:.14em}.big-player-copy h2{font-family:Orbitron;font-size:2rem;margin:12px 0}.big-player-copy p{color:var(--muted)}.big-player-controls{display:flex;align-items:center;gap:24px;margin-top:28px}.big-play,.round-btn{border:0;border-radius:50%;background:white;color:#05070d;cursor:pointer;font-weight:900}.big-play{width:68px;height:68px;font-size:1.3rem}.round-btn{width:48px;height:48px}.equalizer{display:flex;align-items:end;gap:5px;height:45px}.equalizer i{width:5px;background:linear-gradient(var(--cyan),var(--pink));height:15px;animation:eq 1s infinite}.equalizer i:nth-child(2n){animation-delay:.15s}.equalizer i:nth-child(3n){animation-delay:.3s}@keyframes eq{50%{height:42px}}
.radio-info-card{padding:30px;background:#121725;border:1px solid var(--line)}.radio-info-card h3{font-family:Orbitron;font-size:1.6rem}.radio-info-card p{color:var(--muted);line-height:1.7}.radio-info-card dl{display:grid;gap:12px;margin:25px 0}.radio-info-card dt{color:var(--cyan);font-size:.7rem;font-weight:800;text-transform:uppercase}.radio-info-card dd{margin:0;word-break:break-all;color:#dbe0f1;font-size:.88rem}
.history-list{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.history-item{display:flex;gap:12px;align-items:center;background:#121725;padding:12px;border:1px solid var(--line)}.history-art{width:58px;height:58px;flex:0 0 auto}.history-item strong,.history-item span{display:block}.history-item span{color:var(--muted);font-size:.82rem;margin-top:5px}.history-placeholder{color:var(--muted)}
.request-page-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}.request-visual{overflow:hidden}.request-visual img{width:100%}.request-intro p{color:var(--muted);line-height:1.8}.notice-card{margin-top:22px;padding:18px;background:#121725;border-left:4px solid var(--cyan)}.notice-card strong,.notice-card span{display:block}.notice-card span{color:var(--muted);margin-top:7px;line-height:1.6}.embed-shell{background:#111522;border:1px solid var(--line);padding:10px;min-height:720px}.embed-shell iframe{width:100%;height:700px;border:0;background:#0a0d16}.embed-fallback{text-align:center;margin-top:20px;color:var(--muted)}
.schedule-page{display:grid;gap:10px}.schedule-row{display:grid;grid-template-columns:70px 160px 1fr 50px;gap:20px;align-items:center;background:#121725;border:1px solid var(--line);padding:22px}.schedule-index{font-family:Orbitron;font-size:1.4rem;color:#5e6785}.schedule-time{font-weight:800;color:var(--cyan)}.schedule-main h2{font-family:Orbitron;font-size:1.2rem;margin:0 0 6px}.schedule-main p{color:var(--muted);margin:0}.round-arrow{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:white;color:#080a11;font-weight:900}
.dj-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.dj-card{padding:28px;background:#121725;border:1px solid var(--line);min-height:310px}.dj-avatar{width:100px;height:100px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,var(--cyan),var(--pink));color:#071018;font-family:Orbitron;font-weight:800;font-size:1.5rem;margin-bottom:32px}.dj-card span{font-size:.72rem;color:var(--cyan);font-weight:800;letter-spacing:.12em}.dj-card h2{font-family:Orbitron}.dj-card p{color:var(--muted);line-height:1.7}
.about-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:50px}.values-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.values-grid article{padding:28px;background:#121725;border:1px solid var(--line)}.values-grid strong{color:var(--cyan);font-size:.75rem}.values-grid h3{font-family:Orbitron;font-size:1.35rem}.values-grid p{color:var(--muted);line-height:1.7}
.contact-page-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:25px}.contact-panel,.contact-form{background:#121725;border:1px solid var(--line);padding:28px}.contact-panel h2{font-family:Orbitron}.contact-item{padding:18px 0;border-bottom:1px solid var(--line)}.contact-item span{display:block;color:var(--muted);font-size:.75rem;margin-bottom:8px}.green{color:var(--green)}.contact-form{display:grid;gap:14px}.contact-form label{display:grid;gap:7px;font-size:.85rem;font-weight:700}.contact-form input,.contact-form textarea{background:#0b0f1a;border:1px solid var(--line);color:white;padding:13px;outline:none}.contact-form input:focus,.contact-form textarea:focus{border-color:var(--cyan)}
.sticky-player{position:fixed;left:0;right:0;bottom:0;z-index:100;background:rgba(13,16,27,.97);backdrop-filter:blur(16px);border-top:1px solid var(--line);min-height:78px;display:flex;align-items:center;justify-content:space-between;padding:10px max(18px,calc((100vw - 1220px)/2));gap:20px}.sticky-player-info{display:flex;align-items:center;gap:12px;min-width:0}.cover-mini{width:54px;height:54px;flex:0 0 auto}.sticky-copy{min-width:0}.sticky-copy small,.sticky-copy strong,.sticky-copy span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sticky-copy small{font-size:.62rem;color:var(--cyan);font-weight:800;letter-spacing:.1em}.sticky-copy strong{margin:3px 0}.sticky-copy span{color:var(--muted);font-size:.78rem}.sticky-controls{display:flex;align-items:center;gap:14px}.volume-small{display:flex;align-items:center;gap:8px}.volume-small input{width:120px;accent-color:var(--cyan)}
.site-footer{padding:65px 0 35px;background:#05060a;border-top:1px solid var(--line)}.footer-grid{display:grid;grid-template-columns:2fr repeat(3,1fr);gap:35px}.footer-grid strong{font-family:Orbitron}.footer-grid p{color:var(--muted);max-width:330px;line-height:1.6}.footer-grid h4{font-size:.8rem;color:var(--cyan);letter-spacing:.1em}.footer-grid a,.source-label{display:block;color:#cdd3e4;margin:10px 0;font-size:.88rem}.copyright{text-align:center;color:#626a82;margin-top:35px;padding-top:22px;border-top:1px solid var(--line);font-size:.75rem}
@media(max-width:1050px){.feature-grid,.show-slider-grid{grid-template-columns:repeat(2,1fr)}.history-list{grid-template-columns:repeat(2,1fr)}.main-nav{gap:13px}.main-nav a{font-size:.78rem}}
@media(max-width:860px){
 .menu-toggle{display:block}.main-nav{display:none;position:absolute;top:76px;left:18px;right:18px;background:#0d101b;border:1px solid var(--line);flex-direction:column;align-items:stretch;padding:12px}.main-nav.open{display:flex}.main-nav a{padding:12px;border-bottom:1px solid var(--line)}
 .promo-split,.player-layout,.request-page-grid,.about-layout,.contact-page-grid{grid-template-columns:1fr}.big-player{grid-template-columns:1fr}.big-cover{min-height:320px}.dj-grid,.values-grid{grid-template-columns:1fr 1fr}.footer-grid{grid-template-columns:1fr 1fr}
 .schedule-row{grid-template-columns:55px 130px 1fr}.schedule-row .round-arrow{display:none}
}
@media(max-width:600px){
 body{padding-bottom:86px}.container{width:min(100% - 24px,1220px)}.brand-copy small{display:none}.home-hero{min-height:540px;padding-bottom:45px}.home-hero h1{font-size:clamp(2.8rem,16vw,4.5rem)}
 .now-strip-inner{grid-template-columns:64px 1fr}.now-art{width:64px;height:64px}.now-strip .btn{display:none}.feature-grid,.show-slider-grid,.history-list,.dj-grid,.values-grid,.footer-grid{grid-template-columns:1fr}
 .section{padding:64px 0}.section-title-row{align-items:flex-start;flex-direction:column}.page-hero{padding:75px 0 50px}.page-hero h1,.page-hero.slim h1{font-size:clamp(2.5rem,15vw,4rem)}
 .schedule-row{grid-template-columns:1fr;gap:8px}.schedule-index{font-size:.9rem}.big-player-copy{padding:28px}.sticky-player{padding:10px 12px}.volume-small{display:none}.cover-mini{width:48px;height:48px}.embed-shell iframe{height:780px}.embed-shell{min-height:800px}
}


/* ===== V4 player naar meegestuurde radiobalk-opbouw ===== */
body{padding-bottom:104px}
.radio-bar{
  position:fixed;left:0;right:0;bottom:0;z-index:120;
  min-height:94px;background:#f7f9fd;border-top:1px solid #dce3ef;
  box-shadow:0 -10px 35px rgba(10,30,70,.12);color:#11336d
}
.radio-bar-inner{
  width:min(1230px,calc(100% - 28px));min-height:94px;margin:auto;
  display:grid;grid-template-columns:auto auto 1px minmax(210px,1fr) minmax(220px,1fr) auto;
  align-items:center;gap:18px
}
.radio-station-block{display:flex;align-items:center;gap:14px;min-width:270px}
.radio-logo-box{
  display:flex;align-items:center;height:42px;padding:0 9px;background:#fff;
  border:3px solid #1a66cf;border-radius:3px;font-family:Arial,Helvetica,sans-serif;
  font-weight:900;font-size:24px;letter-spacing:-1.5px;line-height:1;white-space:nowrap
}
.logo-main{color:#f22632}.logo-accent{color:#1261cc;margin-left:1px}
.radio-station-copy{display:flex;flex-direction:column;gap:4px;min-width:0}
.radio-station-copy strong{color:#1261cc;font-size:14px;font-weight:800;white-space:nowrap}
.radio-station-copy small{color:#536276;font-size:12px}
.live-badge{
  display:inline-flex;align-items:center;justify-content:center;height:32px;padding:0 15px;
  border:1.5px solid #f42f40;color:#ed2436;background:#fff;border-radius:999px;
  font-size:11px;font-weight:800;white-space:nowrap
}
.radio-controls{display:flex;align-items:center;gap:13px}
.radio-play-btn{
  width:62px;height:62px;border-radius:50%;border:0;background:#1268d2;color:#fff;
  display:grid;place-items:center;font-size:24px;cursor:pointer;
  box-shadow:0 7px 22px rgba(18,104,210,.30);transition:.2s ease
}
.radio-play-btn:hover{transform:translateY(-1px) scale(1.02);background:#0f5fc3}
.radio-volume-icon{font-size:19px}.radio-volume{width:180px;accent-color:#1268d2}
.radio-divider{width:1px;height:64px;background:#dce3ef}
.radio-now,.radio-next{display:flex;align-items:center;gap:11px;min-width:0}
.radio-now-art{
  width:48px;height:48px;border-radius:6px;flex:0 0 auto;
  background:linear-gradient(135deg,#14e8ff,#8d62ff 52%,#ff2ec4);
  background-size:cover;background-position:center;box-shadow:0 3px 10px rgba(0,0,0,.10)
}
.radio-now-copy,.radio-next-copy{min-width:0;display:flex;flex-direction:column;gap:3px}
.radio-now-copy span{
  color:#f22632;font-size:10px;font-weight:900;letter-spacing:.02em;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
.radio-next-copy span{
  color:#173767;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
.radio-now-copy strong,.radio-next-copy strong{
  color:#18386d;font-size:13px;font-weight:800;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis
}
.radio-now-copy small,.radio-next-copy small{
  color:#536276;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
.radio-next-avatar{
  width:48px;height:48px;border-radius:7px;display:grid;place-items:center;flex:0 0 auto;
  color:#fff;font-family:Orbitron,sans-serif;font-size:11px;font-weight:800;
  background:linear-gradient(135deg,#1268d2,#14e8ff)
}
.radio-program-btn{
  min-height:52px;padding:0 20px;border-radius:28px;border:1px solid #cbd7e9;
  background:#fff;color:#1261cc;font-size:12px;font-weight:800;
  display:inline-flex;align-items:center;justify-content:center;gap:18px;white-space:nowrap
}
.radio-program-btn:hover{border-color:#1268d2;box-shadow:0 4px 14px rgba(18,104,210,.10)}
.radio-program-btn span{font-size:20px}
@media(max-width:1160px){
  .radio-bar-inner{grid-template-columns:auto auto 1px minmax(190px,1fr) auto}
  .radio-next{display:none}.radio-volume{width:120px}
}
@media(max-width:900px){
  body{padding-bottom:88px}.radio-bar,.radio-bar-inner{min-height:78px}
  .radio-bar-inner{grid-template-columns:1fr auto;gap:12px;width:min(100% - 18px,900px)}
  .radio-station-block,.radio-divider,.radio-next,.radio-program-btn,.radio-volume-icon,.radio-volume{display:none}
  .radio-controls{order:2}.radio-play-btn{width:52px;height:52px;font-size:19px}
  .radio-now{order:1}.radio-now-art{width:48px;height:48px}
}
@media(max-width:480px){
  .radio-now-copy span{font-size:9px}.radio-now-copy strong,.radio-now-copy small{max-width:210px}
}

/* ===== 404/request repair ===== */
.request-form-local{
  display:grid;gap:15px;margin-top:22px;padding:24px;background:#121725;border:1px solid var(--line)
}
.request-form-local label{display:grid;gap:8px;font-size:.84rem;font-weight:800;color:#e6ebfa}
.request-form-local input,.request-form-local textarea{
  width:100%;padding:14px;background:#0a0e18;border:1px solid var(--line);color:white;outline:none
}
.request-form-local input:focus,.request-form-local textarea:focus{border-color:var(--cyan)}
.request-note{margin-top:16px;padding:17px;border-left:4px solid var(--cyan);background:#121725}
.request-note strong,.request-note span{display:block}.request-note span{color:var(--muted);line-height:1.6;margin-top:6px}
.success-message{margin-top:18px;padding:15px 17px;background:rgba(50,240,161,.10);border:1px solid rgba(50,240,161,.28);color:#8affc4;font-weight:800}
.local-request-list{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.local-request-item{display:flex;gap:14px;padding:20px;background:#121725;border:1px solid var(--line)}
.local-request-item>span{font-size:1.6rem;color:var(--pink)}
.local-request-item strong,.local-request-item small{display:block}
.local-request-item small{color:var(--muted);margin-top:5px}
.local-request-item p{color:#cbd2e7;line-height:1.55;margin:10px 0 0}
.empty-state{padding:24px;background:#121725;border:1px solid var(--line);color:var(--muted)}
@media(max-width:650px){.local-request-list{grid-template-columns:1fr}}


/* ===== V4.3 RadiostuntJager branding in onderste player ===== */
.radio-logo-box.radio-logo-neon{
  height:42px;
  padding:0 12px;
  border:2px solid #6f5cff;
  border-radius:8px;
  background:#0e1220;
  box-shadow:
    0 0 0 1px rgba(20,232,255,.18),
    0 0 18px rgba(111,92,255,.22);
  font-family:Orbitron,Montserrat,sans-serif;
  letter-spacing:-.5px;
  gap:0;
}

.radio-logo-box.radio-logo-neon .logo-main{
  color:#14e8ff;
  font-size:16px;
  font-weight:800;
  text-shadow:0 0 8px rgba(20,232,255,.35);
}

.radio-logo-box.radio-logo-neon .logo-accent{
  color:#ff2ec4;
  margin-left:2px;
  font-size:16px;
  font-weight:800;
  text-shadow:0 0 8px rgba(255,46,196,.35);
}


/* ===== V4.4 strakke transparante onderbalk ===== */
body{
  padding-bottom:112px;
}

.radio-bar{
  left:16px;
  right:16px;
  bottom:14px;
  min-height:88px;
  background:
    linear-gradient(135deg,rgba(14,18,32,.76),rgba(10,14,26,.70));
  border:1px solid rgba(255,255,255,.10);
  border-radius:22px;
  box-shadow:
    0 18px 45px rgba(0,0,0,.35),
    0 0 0 1px rgba(20,232,255,.035),
    inset 0 1px 0 rgba(255,255,255,.04);
  backdrop-filter:blur(20px) saturate(145%);
  -webkit-backdrop-filter:blur(20px) saturate(145%);
  overflow:hidden;
  color:#f7f8ff;
}

.radio-bar::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(90deg,rgba(20,232,255,.10),transparent 26%,transparent 70%,rgba(255,46,196,.10));
  opacity:.75;
}

.radio-bar::after{
  content:"";
  position:absolute;
  left:18px;
  right:18px;
  top:0;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(20,232,255,.45),rgba(141,98,255,.35),rgba(255,46,196,.45),transparent);
}

.radio-bar-inner{
  position:relative;
  z-index:2;
  width:min(1240px,calc(100% - 26px));
  min-height:88px;
  grid-template-columns:auto auto 1px minmax(230px,1.15fr) minmax(220px,.9fr) auto;
  gap:16px;
}

.radio-station-block{
  min-width:250px;
  gap:12px;
}

.radio-logo-box.radio-logo-neon{
  height:44px;
  min-width:150px;
  justify-content:center;
  border:1px solid rgba(20,232,255,.26);
  border-radius:12px;
  background:
    linear-gradient(135deg,rgba(15,20,36,.95),rgba(21,20,42,.92));
  box-shadow:
    0 0 18px rgba(20,232,255,.08),
    inset 0 0 18px rgba(141,98,255,.06);
}

.radio-logo-box.radio-logo-neon .logo-main{
  color:#14e8ff;
  font-size:15px;
}

.radio-logo-box.radio-logo-neon .logo-accent{
  color:#ff2ec4;
  font-size:15px;
}

.radio-station-copy strong{
  color:#f4f7ff;
  font-size:13px;
}

.radio-station-copy small{
  color:#97a2bd;
  font-size:11px;
}

.live-badge{
  height:29px;
  padding:0 12px;
  border:1px solid rgba(255,77,103,.45);
  color:#ff667f;
  background:rgba(255,77,103,.08);
  font-size:10px;
  box-shadow:inset 0 0 12px rgba(255,77,103,.06);
}

.radio-controls{
  gap:11px;
}

.radio-play-btn{
  width:56px;
  height:56px;
  background:linear-gradient(135deg,#14e8ff,#5c7cff 55%,#8d62ff);
  box-shadow:
    0 10px 28px rgba(67,105,255,.24),
    0 0 18px rgba(20,232,255,.12);
  font-size:21px;
  color:white;
}

.radio-play-btn:hover{
  background:linear-gradient(135deg,#35efff,#6f8cff 55%,#9b75ff);
}

.radio-volume-icon{
  color:#dce5ff;
  font-size:17px;
}

.radio-volume{
  width:135px;
  accent-color:#14e8ff;
}

.radio-divider{
  height:52px;
  background:linear-gradient(180deg,transparent,rgba(255,255,255,.14),transparent);
}

.radio-now{
  padding:8px 10px;
  border-radius:14px;
  background:rgba(255,255,255,.025);
  border:1px solid rgba(255,255,255,.045);
}

.radio-now-art{
  width:50px;
  height:50px;
  border-radius:10px;
  box-shadow:
    0 6px 16px rgba(0,0,0,.22),
    0 0 12px rgba(20,232,255,.08);
}

.radio-now-copy span{
  color:#ff5dcf;
  font-size:9px;
  letter-spacing:.08em;
}

.radio-now-copy strong{
  color:#f7f8ff;
  font-size:13px;
}

.radio-now-copy small{
  color:#9fa8bf;
  font-size:10px;
}

.radio-next{
  padding:8px 10px;
  border-radius:14px;
  background:rgba(255,255,255,.018);
}

.radio-next-avatar{
  width:46px;
  height:46px;
  border-radius:11px;
  background:linear-gradient(135deg,#8d62ff,#ff2ec4);
  box-shadow:0 6px 16px rgba(141,98,255,.18);
}

.radio-next-copy span{
  color:#94a4c5;
  font-size:10px;
}

.radio-next-copy strong{
  color:#f3f5ff;
  font-size:12px;
}

.radio-next-copy small{
  color:#7f89a5;
  font-size:10px;
}

.radio-program-btn{
  min-height:46px;
  padding:0 17px;
  border-radius:14px;
  border:1px solid rgba(20,232,255,.20);
  background:
    linear-gradient(135deg,rgba(20,232,255,.08),rgba(141,98,255,.08));
  color:#e8f7ff;
  font-size:11px;
  box-shadow:inset 0 0 14px rgba(20,232,255,.03);
}

.radio-program-btn:hover{
  border-color:rgba(20,232,255,.45);
  background:
    linear-gradient(135deg,rgba(20,232,255,.13),rgba(255,46,196,.10));
  box-shadow:0 6px 18px rgba(20,232,255,.06);
}

@media(max-width:1160px){
  .radio-bar-inner{
    grid-template-columns:auto auto 1px minmax(210px,1fr) auto;
  }
  .radio-next{display:none}
  .radio-volume{width:105px}
}

@media(max-width:900px){
  body{padding-bottom:96px}
  .radio-bar{
    left:8px;
    right:8px;
    bottom:8px;
    min-height:76px;
    border-radius:18px;
  }
  .radio-bar-inner{
    min-height:76px;
    width:calc(100% - 16px);
    grid-template-columns:1fr auto;
    gap:10px;
  }
  .radio-now{
    background:transparent;
    border:0;
    padding:0;
  }
  .radio-now-art{
    width:46px;
    height:46px;
  }
  .radio-play-btn{
    width:48px;
    height:48px;
    font-size:18px;
  }
}

@media(max-width:480px){
  .radio-bar{
    left:6px;
    right:6px;
    bottom:6px;
  }
  .radio-now-copy strong,
  .radio-now-copy small{
    max-width:190px;
  }
}


/* ===== V4.5 onderbalk verfijnd op basis van screenshot ===== */
body{
  padding-bottom:102px;
}

.radio-bar{
  left:0;
  right:0;
  bottom:0;
  min-height:84px;
  border-radius:0;
  background:
    linear-gradient(90deg,rgba(8,19,32,.94),rgba(11,16,29,.94) 55%,rgba(23,10,28,.94));
  border-top:1px solid rgba(255,255,255,.06);
  border-left:0;
  border-right:0;
  border-bottom:0;
  box-shadow:0 -12px 32px rgba(0,0,0,.28);
  backdrop-filter:blur(18px) saturate(135%);
  -webkit-backdrop-filter:blur(18px) saturate(135%);
}

.radio-bar::before{
  opacity:.32;
  background:
    linear-gradient(90deg,rgba(20,232,255,.06),transparent 30%,transparent 72%,rgba(255,46,196,.05));
}

.radio-bar::after{
  left:0;
  right:0;
  background:linear-gradient(90deg,transparent,rgba(20,232,255,.2),rgba(141,98,255,.18),rgba(255,46,196,.16),transparent);
}

.radio-bar-inner{
  width:min(1220px,calc(100% - 26px));
  min-height:84px;
  grid-template-columns: 250px 290px 1px minmax(220px,1fr) minmax(215px,.85fr) 190px;
  gap:16px;
}

.radio-station-block{
  min-width:0;
  display:grid;
  grid-template-columns:150px 1fr;
  grid-template-areas:
    "logo copy"
    "logo badge";
  column-gap:12px;
  row-gap:3px;
  align-items:center;
}

.radio-logo-box.radio-logo-neon{
  grid-area:logo;
  width:150px;
  min-width:150px;
  height:43px;
  border-radius:11px;
  padding:0 10px;
}

.radio-station-copy{
  grid-area:copy;
  gap:1px;
  align-self:end;
}

.radio-station-copy strong{
  font-size:12px;
  line-height:1.15;
}

.radio-station-copy small{
  font-size:10px;
  line-height:1.2;
}

.live-badge{
  grid-area:badge;
  justify-self:start;
  align-self:start;
  height:24px;
  padding:0 9px;
  font-size:9px;
  margin-top:0;
}

.radio-controls{
  gap:12px;
  justify-content:flex-start;
}

.radio-play-btn{
  width:58px;
  height:58px;
  font-size:20px;
}

.radio-volume-icon{
  font-size:15px;
  width:18px;
  text-align:center;
}

.radio-volume{
  width:135px;
}

.radio-divider{
  height:48px;
  opacity:.75;
}

.radio-now{
  min-width:0;
  padding:7px 10px;
  gap:10px;
  border-radius:13px;
  background:rgba(255,255,255,.028);
  border:1px solid rgba(255,255,255,.045);
}

.radio-now-art{
  width:48px;
  height:48px;
  border-radius:9px;
}

.radio-now-copy{
  gap:2px;
}

.radio-now-copy span{
  font-size:9px;
  line-height:1.15;
}

.radio-now-copy strong{
  font-size:12px;
  line-height:1.2;
}

.radio-now-copy small{
  font-size:10px;
  line-height:1.2;
}

.radio-next{
  min-width:0;
  gap:10px;
  padding:7px 9px;
  border-radius:13px;
  background:rgba(255,255,255,.018);
  border:1px solid rgba(255,255,255,.025);
}

.radio-next-avatar{
  width:46px;
  height:46px;
  border-radius:10px;
}

.radio-next-copy{
  gap:2px;
}

.radio-next-copy span{
  font-size:9px;
  line-height:1.15;
}

.radio-next-copy strong{
  font-size:12px;
  line-height:1.2;
}

.radio-next-copy small{
  font-size:10px;
  line-height:1.2;
}

.radio-program-btn{
  min-height:46px;
  height:46px;
  width:190px;
  padding:0 16px;
  border-radius:14px;
  justify-content:space-between;
  font-size:11px;
}

.radio-program-btn span{
  font-size:17px;
}

@media(max-width:1180px){
  .radio-bar-inner{
    grid-template-columns:240px 260px 1px minmax(200px,1fr) 180px;
  }
  .radio-next{display:none}
  .radio-program-btn{width:180px}
  .radio-volume{width:110px}
}

@media(max-width:920px){
  body{padding-bottom:88px}
  .radio-bar{
    min-height:76px;
  }
  .radio-bar-inner{
    min-height:76px;
    width:calc(100% - 16px);
    grid-template-columns:1fr auto;
  }
  .radio-station-block,
  .radio-divider,
  .radio-next,
  .radio-program-btn,
  .radio-volume-icon,
  .radio-volume{
    display:none;
  }
  .radio-now{
    padding:0;
    border:0;
    background:transparent;
  }
  .radio-now-art{
    width:46px;
    height:46px;
  }
  .radio-play-btn{
    width:48px;
    height:48px;
  }
}

@media(max-width:480px){
  .radio-now-copy strong,
  .radio-now-copy small{
    max-width:185px;
  }
}


/* ===== RadiostuntJager rebrand ===== */
body{
  background:
    radial-gradient(circle at 14% 10%, rgba(24,231,255,.09), transparent 24%),
    radial-gradient(circle at 85% 12%, rgba(255,53,207,.10), transparent 25%),
    radial-gradient(circle at 60% 78%, rgba(154,99,255,.07), transparent 26%),
    linear-gradient(180deg,#050811,#090d18 44%,#060912);
}

.site-header{
  background:rgba(5,8,17,.88);
  border-bottom:1px solid rgba(255,255,255,.06);
}

.brand.brand-rsj{
  gap:14px;
  max-width:480px;
}

.brand-mark.brand-mark-image{
  width:88px;
  height:58px;
  border-radius:14px;
  background-size:cover;
  background-position:center;
  box-shadow:
    0 0 0 1px rgba(24,231,255,.16),
    0 10px 26px rgba(0,0,0,.26),
    0 0 18px rgba(255,53,207,.10);
}

.brand-copy strong{
  color:#ffffff;
  text-shadow:0 0 10px rgba(24,231,255,.12);
}

.brand-copy small{
  color:#c7cde2;
}

.main-nav a.active,
.main-nav a:hover{
  color:#ffffff;
  border-bottom-color:var(--pink);
}

.home-hero-overlay{
  background:
    linear-gradient(90deg,rgba(5,8,17,.92),rgba(5,8,17,.58) 48%,rgba(5,8,17,.34)),
    linear-gradient(0deg,rgba(5,8,17,.92),rgba(5,8,17,.10) 42%);
}

.home-hero h1 span,
.page-hero h1 span{
  background:linear-gradient(90deg,var(--cyan),#ffffff 45%,var(--pink));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.feature-card,
.show-tile,
.radio-info-card,
.big-player,
.contact-panel,
.contact-form,
.schedule-row,
.dj-card,
.values-grid article{
  background:
    linear-gradient(180deg, rgba(17,23,40,.92), rgba(11,15,27,.94));
  border:1px solid rgba(255,255,255,.06);
  box-shadow:0 18px 40px rgba(0,0,0,.18);
}

.now-strip-inner{
  background:
    linear-gradient(90deg, rgba(15,20,34,.95), rgba(20,18,36,.92));
  border:1px solid rgba(255,255,255,.07);
}

.btn-primary{
  background:linear-gradient(100deg,var(--cyan),var(--violet) 48%,var(--pink));
  color:#071019;
  box-shadow:0 10px 30px rgba(24,231,255,.14);
}

.btn-ghost{
  background:rgba(255,255,255,.04);
  border-color:rgba(255,255,255,.08);
  color:#eef2ff;
}

.text-link,
.eyebrow,
.hero-kicker,
.radio-next-copy span,
.schedule-time,
.show-tile span{
  color:var(--cyan);
}

.radio-logo-box.radiostuntjager-logo-box{
  min-width:172px;
  padding:0 12px;
  border:1px solid rgba(24,231,255,.28);
  box-shadow:
    0 0 0 1px rgba(24,231,255,.12),
    inset 0 0 22px rgba(255,53,207,.06),
    0 0 18px rgba(24,231,255,.10);
}

.radio-logo-box.radiostuntjager-logo-box .logo-main{
  color:var(--cyan);
}

.radio-logo-box.radiostuntjager-logo-box .logo-accent{
  color:var(--pink);
}

.radio-bar{
  background:
    linear-gradient(90deg,rgba(5,10,18,.95),rgba(11,14,27,.94) 55%,rgba(22,8,24,.93));
}

.radio-now-copy span{
  color:var(--pink);
}

.radio-play-btn{
  background:linear-gradient(135deg,var(--cyan),#4a82ff 55%,var(--violet));
}

.radio-play-btn:hover{
  background:linear-gradient(135deg,#42efff,#6390ff 55%,#af7bff);
}

.radio-program-btn{
  background:linear-gradient(135deg,rgba(24,231,255,.09),rgba(255,53,207,.10));
  border-color:rgba(24,231,255,.20);
  color:#eef4ff;
}

.promo-media img,
.request-visual img{
  object-fit:cover;
  max-height:420px;
  width:100%;
}

.big-cover,
.cover-mini,
.now-art,
.radio-now-art,
.history-art{
  background-image:url('../img/radiostuntjager-logo-crop.jpg');
  background-size:cover;
  background-position:center;
}

.big-cover.has-art,
.cover-mini.has-art,
.now-art.has-art,
.radio-now-art.has-art,
.history-art.has-art{
  background-image:unset;
}

footer.site-footer{
  background:#04060c;
}


/* =========================================================
   RadiostuntJager V2 - radio portal indeling
   ========================================================= */
.section-label{
  display:inline-block;
  color:var(--pink);
  font-size:.68rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  font-weight:900;
}
.compact-section{padding-top:58px}
.section-soft{
  background:linear-gradient(180deg,rgba(255,255,255,.017),rgba(255,255,255,.008));
  border-block:1px solid rgba(255,255,255,.05);
}
.section-head-inline{
  display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:28px
}
.section-head-inline h2{
  font-family:Orbitron,sans-serif;font-size:clamp(1.8rem,4vw,2.8rem);margin:8px 0 0
}
.section-head-inline.mini-head{margin-bottom:18px}
.arrow-link{color:var(--cyan);font-weight:800;font-size:.86rem}
.rsj-live-hero{
  position:relative;min-height:535px;display:flex;align-items:flex-end;padding:85px 0 58px;overflow:hidden
}
.rsj-live-bg{position:absolute;inset:0;background-size:cover;background-position:center 45%;filter:saturate(1.1)}
.rsj-live-overlay{
  position:absolute;inset:0;background:
  linear-gradient(90deg,rgba(4,7,15,.97),rgba(4,7,15,.73) 48%,rgba(4,7,15,.26)),
  linear-gradient(0deg,#050811 0%,rgba(5,8,17,.18) 48%,rgba(5,8,17,.16))
}
.rsj-live-grid{display:grid;grid-template-columns:1fr 370px;gap:55px;align-items:end}
.rsj-live-copy h1{
  font-family:Orbitron,sans-serif;font-size:clamp(3rem,7vw,5.6rem);line-height:.98;margin:14px 0 14px
}
.hero-dj{font-size:1.05rem;color:#d8ddef;margin:0}.hero-time{color:var(--cyan);font-weight:800}
.hero-brand-card{
  padding:12px;border:1px solid rgba(255,255,255,.08);background:rgba(7,10,19,.52);
  backdrop-filter:blur(12px);box-shadow:0 24px 55px rgba(0,0,0,.3)
}
.hero-brand-card img{width:100%;aspect-ratio:16/8;object-fit:cover}
.today-radio-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.today-show-card{background:#101522;border:1px solid var(--line);overflow:hidden;transition:.2s}
.today-show-card:hover{transform:translateY(-3px);border-color:rgba(24,231,255,.28)}
.today-show-image{height:145px;overflow:hidden}.today-show-image img{width:100%;height:100%;object-fit:cover}
.today-show-copy{padding:18px}.today-show-copy span{color:var(--pink);font-size:.72rem;font-weight:900}
.today-show-copy h3{font-family:Orbitron;font-size:1.03rem;margin:10px 0 6px}.today-show-copy p{color:var(--muted);margin:0;font-size:.85rem}
.highlight-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.highlight-card h3{font-family:Orbitron;font-size:1rem;margin:14px 0 6px}.highlight-card p{color:var(--muted);margin:0}
.highlight-thumb{height:220px;position:relative;overflow:hidden;background:#111522}.highlight-thumb img{width:100%;height:100%;object-fit:cover;transition:.3s}.highlight-card:hover img{transform:scale(1.035)}
.duration{position:absolute;bottom:10px;left:10px;background:#050811;color:#fff;padding:6px 8px;font-size:.72rem;font-weight:800}
.play-overlay{position:absolute;inset:0;display:grid;place-items:center;font-size:2rem;color:white;text-shadow:0 3px 20px #000}
.event-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.event-card{padding:26px;min-height:215px;background:linear-gradient(135deg,#101726,#171328);border:1px solid var(--line);display:flex;flex-direction:column}
.event-card>span{color:var(--cyan);font-size:.7rem;font-weight:900;letter-spacing:.1em}.event-card h3{font-family:Orbitron;font-size:1.1rem;line-height:1.4}.event-card p{color:var(--muted)}.event-card a{margin-top:auto;color:var(--pink);font-weight:800;font-size:.82rem}
.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.news-card{background:#101522;border:1px solid var(--line);overflow:hidden}.news-card>img{width:100%;height:205px;object-fit:cover}.news-copy{padding:18px}.news-copy span{color:var(--pink);font-size:.7rem;font-weight:900}.news-copy h3{font-family:Orbitron;font-size:1rem;line-height:1.45;margin:10px 0}.news-copy p{color:var(--muted);font-size:.8rem;margin:0}
.page-grid{grid-template-columns:repeat(3,1fr)}
.split-home{display:grid;grid-template-columns:1fr 1fr;gap:42px}.ranking-list{display:grid;gap:1px}.ranking-item{display:grid;grid-template-columns:52px 1fr;gap:14px;padding:17px;background:#101522;border-bottom:1px solid var(--line);align-items:center}.ranking-item>strong{font-family:Orbitron;font-size:1.6rem;color:var(--cyan)}.ranking-item h3{font-family:Orbitron;font-size:.95rem;margin:0 0 5px}.ranking-item p{color:var(--muted);font-size:.8rem;margin:0}
.now-playing-home{display:flex;align-items:center;gap:16px;padding:18px;background:#101522;border:1px solid var(--line)}.np-cover{width:88px;height:88px;background:url('../img/radiostuntjager-logo-crop.jpg') center/cover}.now-playing-home strong,.now-playing-home span{display:block}.now-playing-home strong{font-family:Orbitron}.now-playing-home span{color:var(--muted);margin-top:7px}
.recent-home{margin-top:14px;padding:18px;background:#0d121e;border:1px solid var(--line)}.recent-home h3{font-family:Orbitron;font-size:.85rem;margin:0 0 12px}.mini-history{display:grid;gap:9px;margin-bottom:12px}.mini-history-row{display:flex;justify-content:space-between;gap:12px;border-bottom:1px solid var(--line);padding-bottom:8px}.mini-history-row strong{font-size:.84rem}.mini-history-row span{color:var(--muted);font-size:.78rem;text-align:right}
.top30-home{display:grid;grid-template-columns:.75fr 1.25fr;gap:50px;align-items:start}.top30-title h2{font-family:Orbitron;font-size:2.5rem}.top30-title p{color:var(--muted);line-height:1.6}.top30-list{display:grid}.top30-row{display:grid;grid-template-columns:50px 1fr 40px;gap:14px;align-items:center;padding:13px 15px;border-bottom:1px solid var(--line);background:#101522}.top30-row>strong{font-family:Orbitron;font-size:1.3rem;color:var(--cyan)}.top30-row h3{font-size:.92rem;margin:0 0 3px}.top30-row span{color:var(--muted);font-size:.78rem}.trend{text-align:center}
.app-social-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.app-card,.social-card{min-height:280px;padding:32px;background:linear-gradient(135deg,#101726,#171126);border:1px solid var(--line)}.app-card h2,.social-card h2{font-family:Orbitron;font-size:2rem}.app-card p,.social-card p{color:var(--muted);line-height:1.7}.social-buttons{display:flex;gap:10px;flex-wrap:wrap}.social-buttons a{padding:11px 14px;border:1px solid var(--line);background:rgba(255,255,255,.03);font-weight:800;font-size:.8rem}
.day-tabs{display:flex;gap:8px;overflow:auto;margin-bottom:24px;padding-bottom:4px}.day-tabs button{border:1px solid var(--line);background:#101522;color:#dbe1f2;padding:11px 15px;white-space:nowrap;font-weight:800}.day-tabs button.active{background:linear-gradient(90deg,var(--cyan),var(--violet));color:#061018}
.program-card-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.program-big-card{display:grid;grid-template-columns:190px 1fr;background:#101522;border:1px solid var(--line);overflow:hidden}.program-big-card>img{width:100%;height:100%;object-fit:cover}.program-big-card>div{padding:22px}.program-big-card span{color:var(--pink);font-size:.7rem;font-weight:900}.program-big-card h2{font-family:Orbitron;font-size:1.15rem;margin:9px 0}.program-big-card strong{font-size:.84rem}.program-big-card p{color:var(--muted);font-size:.84rem;line-height:1.6}
.chart-list{display:grid}.chart-row{display:grid;grid-template-columns:60px 70px 1fr auto;gap:16px;align-items:center;padding:12px 16px;background:#101522;border-bottom:1px solid var(--line)}.chart-pos{font-family:Orbitron;font-size:1.5rem;color:var(--cyan)}.chart-cover img{width:62px;height:62px;object-fit:cover}.chart-copy h3{font-family:Orbitron;font-size:.94rem;margin:0 0 5px}.chart-copy span,.chart-status{color:var(--muted);font-size:.8rem}

/* Player V2 - dezelfde player, strakker ingedeeld */
.radio-bar-inner{
  width:min(1260px,calc(100% - 22px));
  grid-template-columns:245px 260px 1px minmax(235px,1.1fr) minmax(205px,.85fr) 176px;
  gap:14px;
}
.radio-station-block{
  grid-template-columns:165px 1fr;
  column-gap:10px;
}
.radio-logo-box.radiostuntjager-logo-box{
  width:165px;min-width:165px;height:42px;padding:0 10px
}
.radio-logo-box.radiostuntjager-logo-box .logo-main,
.radio-logo-box.radiostuntjager-logo-box .logo-accent{font-size:14px}
.radio-station-copy strong{font-size:11px}.radio-station-copy small{font-size:9px}
.live-badge{height:22px;padding:0 8px;font-size:8px}
.radio-controls{gap:10px}.radio-play-btn{width:54px;height:54px}.radio-volume{width:122px}
.radio-now{padding:6px 9px}.radio-now-art{width:46px;height:46px}.radio-now-copy strong{font-size:11.5px}.radio-now-copy small{font-size:9.5px}
.radio-next{padding:6px 8px}.radio-next-avatar{width:44px;height:44px}.radio-next-copy strong{font-size:11px}.radio-next-copy small{font-size:9px}
.radio-program-btn{width:176px;min-height:44px;height:44px;padding:0 14px;font-size:10px}

@media(max-width:1080px){
 .today-radio-grid{grid-template-columns:repeat(2,1fr)}
 .rsj-live-grid{grid-template-columns:1fr 300px}
 .radio-bar-inner{grid-template-columns:230px 240px 1px minmax(200px,1fr) 160px}
 .radio-next{display:none}.radio-program-btn{width:160px}
}
@media(max-width:820px){
 .rsj-live-grid,.split-home,.top30-home,.app-social-grid,.program-card-grid{grid-template-columns:1fr}
 .hero-brand-card{display:none}.highlight-grid,.event-grid,.news-grid,.page-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:580px){
 .today-radio-grid,.highlight-grid,.event-grid,.news-grid,.page-grid{grid-template-columns:1fr}
 .section-head-inline{align-items:flex-start;flex-direction:column}
 .rsj-live-hero{min-height:500px;padding:70px 0 42px}
 .rsj-live-copy h1{font-size:clamp(2.6rem,15vw,4rem)}
 .program-big-card{grid-template-columns:110px 1fr}
 .chart-row{grid-template-columns:40px 54px 1fr}.chart-status{display:none}
}


/* ==========================================================
   RADIOSTUNTJAGER V3 ULTRA PRO
   Premium polish layer
   ========================================================== */

:root{
  --rsj-surface:#0b101c;
  --rsj-surface-2:#101726;
  --rsj-surface-3:#141c2d;
  --rsj-border:rgba(255,255,255,.075);
  --rsj-cyan:#19e7ff;
  --rsj-pink:#ff35cf;
  --rsj-violet:#9b63ff;
  --rsj-soft:#aeb8d0;
  --rsj-shadow:0 24px 70px rgba(0,0,0,.38);
}

body{
  background:
    radial-gradient(circle at 12% 0%,rgba(25,231,255,.065),transparent 26%),
    radial-gradient(circle at 90% 4%,rgba(255,53,207,.06),transparent 24%),
    linear-gradient(180deg,#050811 0%,#070b14 28%,#080c15 64%,#05070d 100%);
  letter-spacing:-.01em;
}

body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-1;
  opacity:.18;
  background-image:
    radial-gradient(circle at 20% 15%,rgba(255,255,255,.15) 0 1px,transparent 1.5px),
    radial-gradient(circle at 70% 45%,rgba(255,255,255,.12) 0 1px,transparent 1.5px);
  background-size:90px 90px,130px 130px;
}

.premium-header{
  background:rgba(5,8,16,.82);
  border-bottom:1px solid rgba(255,255,255,.055);
  backdrop-filter:blur(22px) saturate(145%);
  -webkit-backdrop-filter:blur(22px) saturate(145%);
  box-shadow:0 12px 34px rgba(0,0,0,.16);
}

.premium-nav-wrap{
  min-height:82px;
}

.brand.brand-rsj{
  gap:12px;
}

.brand-mark.brand-mark-image{
  width:74px;
  height:50px;
  border-radius:12px;
}

.brand-copy strong{
  font-size:.94rem;
  letter-spacing:-.02em;
}

.main-nav{
  gap:22px;
}

.main-nav a{
  font-size:.81rem;
  font-weight:800;
  opacity:.92;
  transition:.2s ease;
}

.main-nav a:hover,
.main-nav a.active{
  opacity:1;
  color:#fff;
}

.rsj-live-hero{
  min-height:610px;
  padding:120px 0 72px;
}

.rsj-live-overlay{
  background:
    linear-gradient(90deg,rgba(4,7,15,.98) 0%,rgba(4,7,15,.78) 45%,rgba(4,7,15,.34) 78%),
    linear-gradient(0deg,#050811 0%,rgba(5,8,17,.18) 48%,rgba(5,8,17,.08));
}

.rsj-live-copy{
  max-width:760px;
}

.rsj-live-copy .section-label{
  padding:8px 12px;
  border:1px solid rgba(255,53,207,.28);
  border-radius:999px;
  background:rgba(255,53,207,.07);
  box-shadow:inset 0 0 18px rgba(255,53,207,.03);
}

.rsj-live-copy h1{
  max-width:760px;
  font-size:clamp(3.6rem,8vw,6.9rem);
  letter-spacing:-.055em;
  text-wrap:balance;
}

.hero-dj{
  font-size:1.12rem;
}

.hero-brand-card{
  border-radius:20px;
  overflow:hidden;
  padding:8px;
  border-color:rgba(255,255,255,.09);
  background:rgba(7,10,19,.58);
  box-shadow:0 26px 70px rgba(0,0,0,.35);
}

.hero-brand-card img{
  border-radius:14px;
}

.btn{
  min-height:48px;
  border-radius:12px;
  padding:0 20px;
  transition:.2s ease;
}

.btn:hover{
  transform:translateY(-1px);
}

.btn-primary{
  box-shadow:
    0 12px 28px rgba(25,231,255,.10),
    0 0 0 1px rgba(255,255,255,.05) inset;
}

.btn-ghost{
  border-color:rgba(255,255,255,.10);
  backdrop-filter:blur(10px);
}

/* Premium status bar */
.premium-status-strip{
  position:relative;
  z-index:8;
  margin-top:-22px;
}

.premium-status-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr) auto;
  align-items:center;
  background:linear-gradient(90deg,rgba(15,21,36,.96),rgba(14,18,31,.96));
  border:1px solid rgba(255,255,255,.075);
  border-radius:18px;
  box-shadow:0 24px 55px rgba(0,0,0,.26);
  overflow:hidden;
}

.premium-status-item{
  min-height:86px;
  display:flex;
  align-items:center;
  gap:14px;
  padding:0 24px;
  border-right:1px solid rgba(255,255,255,.055);
}

.premium-status-item .status-icon{
  width:36px;
  height:36px;
  border-radius:50%;
  display:grid;
  place-items:center;
  color:var(--rsj-cyan);
  background:rgba(25,231,255,.07);
  border:1px solid rgba(25,231,255,.12);
  font-size:.85rem;
}

.premium-status-item .status-icon.live{
  color:#ff627f;
  background:rgba(255,78,107,.08);
  border-color:rgba(255,78,107,.15);
}

.premium-status-item small,
.premium-status-item strong{
  display:block;
}

.premium-status-item small{
  font-size:.62rem;
  color:#74809a;
  font-weight:900;
  letter-spacing:.13em;
}

.premium-status-item strong{
  margin-top:4px;
  font-size:.88rem;
}

.premium-status-cta{
  height:86px;
  padding:0 26px;
  display:flex;
  align-items:center;
  gap:18px;
  color:white;
  font-weight:900;
  font-size:.84rem;
  background:
    linear-gradient(135deg,rgba(25,231,255,.08),rgba(155,99,255,.08),rgba(255,53,207,.07));
}

.premium-status-cta:hover{
  background:
    linear-gradient(135deg,rgba(25,231,255,.13),rgba(155,99,255,.11),rgba(255,53,207,.10));
}

/* Global sections */
.section{
  padding:94px 0;
}

.section-soft{
  background:
    linear-gradient(180deg,rgba(255,255,255,.014),rgba(255,255,255,.007));
}

.section-head-inline{
  margin-bottom:34px;
}

.section-head-inline h2{
  letter-spacing:-.04em;
}

.section-label{
  letter-spacing:.18em;
}

/* Cards */
.today-show-card,
.highlight-card,
.event-card,
.news-card,
.ranking-item,
.now-playing-home,
.recent-home,
.top30-row,
.program-big-card,
.dj-card,
.chart-row{
  border-radius:16px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.065);
  box-shadow:0 12px 35px rgba(0,0,0,.13);
}

.today-show-card,
.news-card,
.highlight-card,
.event-card,
.program-big-card,
.dj-card{
  transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease;
}

.today-show-card:hover,
.news-card:hover,
.highlight-card:hover,
.event-card:hover,
.program-big-card:hover,
.dj-card:hover{
  transform:translateY(-4px);
  border-color:rgba(25,231,255,.18);
  box-shadow:0 20px 42px rgba(0,0,0,.20);
}

.today-show-image{
  height:165px;
}

.today-show-copy{
  padding:20px;
}

.today-show-copy h3{
  font-size:1.08rem;
  line-height:1.4;
}

.highlight-thumb{
  height:245px;
}

.event-card{
  min-height:235px;
  padding:28px;
}

.news-card>img{
  height:225px;
}

.news-copy{
  padding:20px;
}

.news-copy h3{
  font-size:1.06rem;
}

.ranking-item{
  margin-bottom:8px;
  border-bottom:1px solid rgba(255,255,255,.06);
}

.now-playing-home{
  padding:20px;
}

.np-cover{
  width:96px;
  height:96px;
  border-radius:14px;
  box-shadow:0 12px 26px rgba(0,0,0,.25);
}

.recent-home{
  border-radius:16px;
}

.top30-row{
  margin-bottom:7px;
}

.top30-title h2{
  letter-spacing:-.045em;
}

/* Premium feature section */
.premium-feature-section{
  padding-top:40px;
  padding-bottom:100px;
}

.premium-feature{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  min-height:470px;
  background:
    linear-gradient(135deg,rgba(16,23,38,.97),rgba(10,13,23,.98));
  border:1px solid rgba(255,255,255,.075);
  border-radius:24px;
  overflow:hidden;
  box-shadow:0 30px 80px rgba(0,0,0,.28);
}

.premium-feature-media{
  position:relative;
  min-height:470px;
  overflow:hidden;
}

.premium-feature-media::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,transparent 70%,rgba(10,13,23,.72)),
    linear-gradient(0deg,rgba(5,8,17,.30),transparent 45%);
}

.premium-feature-media img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.premium-feature-badge{
  position:absolute;
  top:22px;
  left:22px;
  z-index:2;
  padding:9px 12px;
  border-radius:999px;
  font-size:.66rem;
  font-weight:900;
  letter-spacing:.14em;
  color:white;
  background:rgba(5,8,17,.66);
  border:1px solid rgba(255,255,255,.13);
  backdrop-filter:blur(10px);
}

.premium-feature-copy{
  padding:58px 46px;
  align-self:center;
}

.premium-feature-copy h2{
  font-family:Orbitron,sans-serif;
  font-size:clamp(2.2rem,4.5vw,3.5rem);
  line-height:1.1;
  margin:14px 0 20px;
  letter-spacing:-.045em;
}

.premium-feature-copy p{
  color:var(--rsj-soft);
  line-height:1.82;
  font-size:1rem;
}

.premium-feature-actions{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:26px;
}

/* Program cards */
.program-card-grid{
  gap:22px;
}

.program-big-card{
  min-height:220px;
}

.program-big-card>div{
  padding:26px;
}

/* DJ cards */
.dj-grid.page-grid{
  gap:22px;
}

.dj-card{
  min-height:350px;
  padding:30px;
  background:linear-gradient(180deg,#111827,#0e1421);
}

.dj-avatar{
  box-shadow:0 15px 35px rgba(155,99,255,.18);
}

/* Chart */
.chart-row{
  margin-bottom:8px;
  background:linear-gradient(90deg,#101522,#0e1420);
}

/* Footer */
.premium-footer{
  background:
    linear-gradient(180deg,#05070d,#030409);
  border-top:1px solid rgba(255,255,255,.055);
}

.premium-footer-grid{
  gap:48px;
}

.premium-footer-grid h4{
  font-size:.72rem;
  letter-spacing:.14em;
}

.premium-footer-grid a{
  transition:.2s ease;
}

.premium-footer-grid a:hover{
  color:var(--rsj-cyan);
  transform:translateX(2px);
}

/* PLAYER - final pro alignment */
.radio-bar{
  min-height:86px;
  background:
    linear-gradient(90deg,rgba(7,13,23,.965),rgba(10,14,25,.965) 55%,rgba(21,8,24,.955));
  border-top:1px solid rgba(255,255,255,.055);
  box-shadow:
    0 -18px 42px rgba(0,0,0,.26),
    inset 0 1px 0 rgba(255,255,255,.025);
}

.radio-bar-inner{
  min-height:86px;
  width:min(1280px,calc(100% - 24px));
  grid-template-columns:250px 250px 1px minmax(250px,1.15fr) minmax(220px,.9fr) 170px;
  gap:13px;
}

.radio-station-block{
  grid-template-columns:170px 1fr;
  column-gap:10px;
}

.radio-logo-box.radiostuntjager-logo-box{
  width:170px;
  min-width:170px;
  height:44px;
  border-radius:12px;
  background:
    linear-gradient(135deg,rgba(11,17,30,.98),rgba(18,14,31,.98));
}

.radio-station-copy{
  gap:2px;
}

.radio-station-copy strong{
  font-size:11px;
  line-height:1.15;
}

.radio-station-copy small{
  font-size:9px;
}

.live-badge{
  height:22px;
  font-size:8px;
}

.radio-controls{
  gap:10px;
}

.radio-play-btn{
  width:56px;
  height:56px;
  box-shadow:
    0 12px 28px rgba(56,99,255,.22),
    0 0 20px rgba(25,231,255,.08);
}

.radio-volume{
  width:118px;
}

.radio-divider{
  height:46px;
}

.radio-now{
  border-radius:13px;
  padding:7px 9px;
}

.radio-now-art{
  width:48px;
  height:48px;
}

.radio-now-copy span{
  font-size:8.8px;
}

.radio-now-copy strong{
  font-size:11.6px;
}

.radio-now-copy small{
  font-size:9.2px;
}

.radio-next{
  border-radius:13px;
  padding:7px 9px;
}

.radio-next-avatar{
  width:44px;
  height:44px;
}

.radio-program-btn{
  width:170px;
  min-height:44px;
  height:44px;
  border-radius:12px;
}

@media(max-width:1180px){
  .premium-status-grid{
    grid-template-columns:repeat(3,1fr);
  }
  .premium-status-cta{
    grid-column:1/-1;
    height:58px;
    justify-content:center;
  }
  .radio-bar-inner{
    grid-template-columns:230px 230px 1px minmax(210px,1fr) 155px;
  }
  .radio-next{display:none}
  .radio-program-btn{width:155px}
}

@media(max-width:900px){
  .premium-feature{
    grid-template-columns:1fr;
  }
  .premium-feature-media{
    min-height:360px;
  }
  .premium-feature-copy{
    padding:38px 28px;
  }
  .premium-status-grid{
    grid-template-columns:1fr 1fr;
  }
  .premium-status-item:nth-child(3){
    border-top:1px solid rgba(255,255,255,.055);
  }
}

@media(max-width:640px){
  .section{padding:72px 0}
  .premium-status-strip{margin-top:0}
  .premium-status-grid{
    grid-template-columns:1fr;
    border-radius:14px;
  }
  .premium-status-item{
    min-height:68px;
    border-right:0;
    border-bottom:1px solid rgba(255,255,255,.055);
  }
  .premium-status-cta{
    grid-column:auto;
  }
  .premium-feature{
    border-radius:16px;
  }
  .premium-feature-media{
    min-height:270px;
  }
}


/* ==========================================================
   V4 extra stationgerichte afbeeldingen
   ========================================================== */
.station-visuals-grid{
  display:grid;
  grid-template-columns:1.4fr .8fr .8fr;
  gap:18px;
}
.station-visual-main,
.station-visual-side{
  position:relative;
  overflow:hidden;
  border-radius:18px;
  min-height:260px;
  border:1px solid rgba(255,255,255,.07);
  box-shadow:0 18px 48px rgba(0,0,0,.22);
}
.station-visual-main{
  min-height:390px;
}
.station-visual-main img,
.station-visual-side img,
.studio-hero-banner img,
.listen-side-image img,
.dj-banner img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.station-visual-overlay{
  position:absolute;
  inset:auto 0 0 0;
  padding:26px;
  background:linear-gradient(0deg,rgba(5,8,17,.92),rgba(5,8,17,.10));
}
.station-visual-overlay h3,
.station-visual-side-copy h3,
.studio-gallery-copy h3,
.studio-hero-copy h2{
  font-family:Orbitron,sans-serif;
}
.station-visual-overlay p,
.station-visual-side-copy span,
.studio-gallery-copy span,
.studio-hero-copy p{
  color:var(--muted);
}
.station-visual-side-copy{
  position:absolute;
  left:0; right:0; bottom:0;
  padding:18px;
  background:linear-gradient(0deg,rgba(5,8,17,.93),rgba(5,8,17,.18));
}
.station-visual-side-copy span{
  display:block;
  font-size:.72rem;
  color:var(--cyan);
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
  margin-bottom:8px;
}
.studio-hero-banner{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  min-height:370px;
  overflow:hidden;
  border-radius:22px;
  background:linear-gradient(135deg,#111827,#0e1321);
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 24px 58px rgba(0,0,0,.25);
}
.studio-hero-copy{
  padding:42px;
  align-self:center;
}
.studio-hero-copy h2{
  font-size:clamp(2rem,4vw,3.2rem);
  margin:14px 0 16px;
}
.studio-gallery-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}
.studio-gallery-card{
  overflow:hidden;
  border-radius:18px;
  background:#101522;
  border:1px solid rgba(255,255,255,.07);
  box-shadow:0 16px 42px rgba(0,0,0,.20);
  transition:transform .22s ease,border-color .22s ease;
}
.studio-gallery-card:hover{
  transform:translateY(-4px);
  border-color:rgba(25,231,255,.16);
}
.studio-gallery-card img{
  width:100%;
  height:240px;
  object-fit:cover;
  display:block;
}
.studio-gallery-copy{
  padding:18px;
}
.studio-gallery-copy span{
  display:block;
  color:var(--cyan);
  font-size:.72rem;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
  margin-bottom:10px;
}
.studio-gallery-copy h3{
  margin:0;
  font-size:1rem;
  line-height:1.55;
}
.dj-card-image{
  padding:0;
}
.dj-banner{
  height:180px;
  overflow:hidden;
}
.dj-content-wrap{
  padding:24px 26px 28px;
}
.listen-side-image{
  height:180px;
  border-radius:16px;
  overflow:hidden;
  margin-bottom:18px;
}
.listen-side-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
@media(max-width:980px){
  .station-visuals-grid,
  .studio-hero-banner{
    grid-template-columns:1fr;
  }
  .station-visual-main{
    min-height:320px;
  }
  .studio-gallery-grid{
    grid-template-columns:1fr 1fr;
  }
}
@media(max-width:620px){
  .studio-gallery-grid{
    grid-template-columns:1fr;
  }
}
\n/* V5 functional fixes */\n.hp-field{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0!important}\n.error-message{margin:14px 0;padding:14px 16px;background:rgba(255,74,102,.10);border:1px solid rgba(255,74,102,.30);color:#ff91a4;font-weight:800;border-radius:10px}\n.social-placeholder{color:var(--muted);font-size:.85rem}\n

/* =========================================================
   V6 Pro: theme admin, lightning, ticker, weather, request queue
   ========================================================= */
body{background-color:var(--bg)!important;color:var(--text)}
.feature-card,.show-tile,.news-card,.event-card,.dj-card,.program-big-card,.pro-panel,.today-news-row{background-color:var(--rsj-surface)!important}
.section-label,.eyebrow,.arrow-link{color:var(--cyan)}
.btn-primary{background:linear-gradient(100deg,var(--cyan),var(--violet) 52%,var(--pink))}
.main-nav a:hover,.main-nav a.active{border-bottom-color:var(--pink)}

.news-ticker{
  height:40px;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  background:linear-gradient(90deg,#070b14,#0b1020 55%,#12091a);
  border-bottom:1px solid rgba(255,255,255,.06);
  color:#dfe6fa;
  overflow:hidden;
  position:relative;
  z-index:75;
}
.ticker-label{
  height:40px;display:grid;place-items:center;padding:0 18px;
  font-size:.68rem;font-weight:900;letter-spacing:.14em;color:#061018;
  background:linear-gradient(90deg,var(--cyan),var(--violet));
}
.ticker-window{overflow:hidden;white-space:nowrap}
.ticker-track{
  display:inline-flex;align-items:center;min-width:max-content;
  animation:ticker-scroll 70s linear infinite;
}
.ticker-track:hover{animation-play-state:paused}
.ticker-track a{padding:0 28px;color:#e8edfc;font-size:.78rem}
.ticker-source{color:var(--pink);font-weight:900;margin-right:8px}
.ticker-more{padding:0 16px;font-size:.72rem;font-weight:900;color:var(--cyan)}
@keyframes ticker-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}

.rsj-live-hero,.page-hero,.lightning-banner{isolation:isolate;overflow:hidden}
.rsj-live-hero::after,.page-hero::after,.lightning-banner::after{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:3;
  opacity:0;background:
   linear-gradient(112deg,transparent 0 46%,rgba(255,255,255,.95) 47%,rgba(25,231,255,.75) 47.5%,transparent 49%),
   linear-gradient(72deg,transparent 0 62%,rgba(255,255,255,.75) 63%,rgba(155,99,255,.65) 63.6%,transparent 65%);
  mix-blend-mode:screen;
}
.lightning-flash::after{animation:lightning-flash .18s ease-out}
@keyframes lightning-flash{
  0%{opacity:0}20%{opacity:.95;filter:brightness(1.8)}45%{opacity:.12}70%{opacity:.7}100%{opacity:0}
}
.lightning-enabled .rsj-live-overlay{opacity:var(--banner-overlay)}

.weather-news-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.pro-panel{
  border:1px solid rgba(255,255,255,.07);border-radius:20px;
  box-shadow:0 20px 55px rgba(0,0,0,.22);overflow:hidden
}
.weather-card{position:relative;min-height:390px}
.weather-card-bg{position:absolute;inset:0;background-image:var(--weather-bg);background-size:cover;background-position:center;opacity:.26}
.weather-card::after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(5,8,17,.94),rgba(7,12,23,.62))}
.weather-card-content{position:relative;z-index:2;padding:30px}
.weather-main{display:flex;align-items:center;gap:22px;margin:34px 0}
.weather-main>strong{font-family:Orbitron,sans-serif;font-size:5rem;line-height:1;background:linear-gradient(90deg,var(--cyan),#fff,var(--pink));background-clip:text;color:transparent}
.weather-main h2{font-family:Orbitron,sans-serif;font-size:1.8rem;margin:0 0 8px}.weather-main p{color:var(--muted);margin:0}
.weather-days{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.weather-days>div{padding:13px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.055);border-radius:12px}
.weather-days span,.weather-days strong,.weather-days small{display:block}.weather-days span{font-size:.68rem;color:var(--cyan);font-weight:900}.weather-days strong{font-size:1.15rem;margin:6px 0}.weather-days small{font-size:.68rem;color:var(--muted);line-height:1.35}

.live-news-card{padding:28px}.live-news-list{display:grid}.live-news-list a{display:grid;grid-template-columns:54px 1fr;gap:12px;padding:13px 0;border-bottom:1px solid rgba(255,255,255,.06)}
.live-news-list time{color:var(--pink);font-family:Orbitron,sans-serif;font-size:.75rem}.live-news-list strong,.live-news-list span{display:block}.live-news-list strong{font-size:.9rem;line-height:1.45}.live-news-list span{font-size:.7rem;color:var(--muted);margin-top:4px}

.today-news-layout{display:grid;grid-template-columns:1fr 320px;gap:28px}.today-news-main{display:grid;gap:12px}.today-news-row{display:grid;grid-template-columns:70px 1fr;gap:18px;padding:24px;border:1px solid rgba(255,255,255,.07);border-radius:16px}
.today-news-row.featured{border-color:rgba(25,231,255,.18);background:linear-gradient(135deg,rgba(25,231,255,.05),rgba(255,53,207,.04))}
.today-news-time{font-family:Orbitron,sans-serif;color:var(--pink);font-size:.88rem}.today-news-copy>span{font-size:.66rem;color:var(--cyan);font-weight:900;letter-spacing:.12em}
.today-news-copy h2{font-family:Orbitron,sans-serif;font-size:1.15rem;line-height:1.45;margin:8px 0}.today-news-copy p{color:var(--muted);line-height:1.6}.today-news-copy a{color:var(--cyan);font-size:.8rem;font-weight:900}
.today-news-sidebar{display:grid;align-content:start;gap:15px}.today-news-sidebar .pro-panel{padding:22px}.today-news-sidebar h3{font-family:Orbitron,sans-serif}.today-news-sidebar p{color:var(--muted);line-height:1.65}

.request-system-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:22px;align-items:start}.request-form-pro,.request-queue{padding:28px}.request-form-pro h2,.request-queue h2{font-family:Orbitron,sans-serif}
.request-form-local{grid-template-columns:1fr 1fr}.request-form-local .full{grid-column:1/-1}.hp-field{position:absolute!important;left:-9999px!important}
.request-queue-list{display:grid;gap:10px}.request-queue-item{padding:16px;border:1px solid rgba(255,255,255,.06);background:rgba(255,255,255,.025);border-radius:13px}
.request-queue-item strong,.request-queue-item small{display:block}.request-queue-item small{color:var(--muted);margin-top:5px}.request-queue-item p{color:#cbd3e8;margin:8px 0 0;font-size:.82rem}
.queue-status{display:inline-block;padding:5px 8px;margin-bottom:9px;border-radius:999px;font-size:.58rem;font-weight:900;letter-spacing:.1em}
.queue-status.approved{background:rgba(25,231,255,.1);color:var(--cyan)}.queue-status.played{background:rgba(50,240,161,.1);color:#6dffc0}

.admin-image-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:16px}.admin-image-strip figure{margin:0;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:12px;overflow:hidden}.admin-image-strip img{width:100%;height:110px;object-fit:cover}.admin-image-strip figcaption{padding:7px;font-size:.7rem;color:var(--muted)}
.check-row{display:flex!important;grid-template-columns:none!important;align-items:center;gap:9px;margin:12px 0}.check-row input{width:auto!important}

.queue-actions{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end}.queue-btn{border:1px solid var(--line);background:#10182a;color:white;padding:8px 10px;border-radius:9px;font-size:.72rem;font-weight:800;cursor:pointer}.queue-btn.approve{color:var(--cyan);border-color:rgba(25,231,255,.25)}.queue-btn.played{color:#6dffc0;border-color:rgba(50,240,161,.24)}.queue-btn.reject{color:#ff7890}.admin-status{display:inline-block;font-size:.6rem;letter-spacing:.1em;color:var(--cyan);margin-bottom:8px}

@media(max-width:920px){
 .weather-news-grid,.today-news-layout,.request-system-grid{grid-template-columns:1fr}
 .today-news-sidebar{grid-template-columns:1fr 1fr}.weather-days{grid-template-columns:repeat(2,1fr)}
 .admin-image-strip{grid-template-columns:1fr 1fr}
}
@media(max-width:620px){
 .news-ticker{grid-template-columns:auto 1fr}.ticker-more{display:none}.ticker-label{padding:0 11px}
 .weather-main>strong{font-size:4rem}.weather-days{grid-template-columns:1fr 1fr}
 .today-news-row{grid-template-columns:1fr}.today-news-time{font-size:.7rem}.today-news-sidebar{grid-template-columns:1fr}
 .request-form-local{grid-template-columns:1fr}.request-form-local .full{grid-column:auto}
}


/* =========================================================
   V7 - Bewegende speakers + chat pagina
   ========================================================= */
.hero-speaker-system{
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
}
.hero-speaker{
  position:absolute;
  top:50%;
  width:180px;
  height:310px;
  transform:translateY(-50%);
  opacity:.58;
  filter:drop-shadow(0 25px 45px rgba(0,0,0,.48));
}
.hero-speaker-left{left:2.2%}
.hero-speaker-right{right:2.2%;transform:translateY(-50%) scaleX(-1)}
.speaker-shell{
  position:relative;
  width:100%;
  height:100%;
  border-radius:28px;
  background:
    linear-gradient(145deg,rgba(14,20,34,.96),rgba(5,8,15,.98));
  border:1px solid rgba(255,255,255,.08);
  box-shadow:
    inset 0 0 45px rgba(25,231,255,.035),
    0 0 30px rgba(155,99,255,.07);
}
.speaker-shell::before{
  content:"";
  position:absolute;
  inset:10px;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.035);
}
.speaker-driver{
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  border-radius:50%;
  display:grid;
  place-items:center;
  background:
    radial-gradient(circle at center,#080b12 0 16%,#171f2d 17% 30%,#05070d 31% 39%,#202b3d 40% 64%,#05070d 65%);
  box-shadow:
    inset 0 0 18px rgba(0,0,0,.9),
    0 0 0 2px rgba(25,231,255,.045),
    0 0 26px rgba(25,231,255,.05);
}
.speaker-driver span{
  width:28%;
  height:28%;
  border-radius:50%;
  background:radial-gradient(circle,#293448,#05070d);
  box-shadow:0 0 16px rgba(255,53,207,.10);
}
.speaker-driver-top{top:34px;width:72px;height:72px}
.speaker-driver-main{
  bottom:38px;
  width:132px;
  height:132px;
  animation:speaker-bass 1.05s ease-in-out infinite;
}
.speaker-led{
  position:absolute;
  left:50%;
  bottom:12px;
  width:5px;
  height:5px;
  transform:translateX(-50%);
  border-radius:50%;
  background:var(--cyan);
  box-shadow:0 0 10px var(--cyan);
  animation:speaker-led 1.1s ease-in-out infinite;
}
.hero-speaker-right .speaker-driver-main{animation-delay:.18s}
.hero-speaker-right .speaker-led{animation-delay:.24s}

@keyframes speaker-bass{
  0%,100%{transform:translateX(-50%) scale(1);filter:brightness(.95)}
  45%{transform:translateX(-50%) scale(1.045);filter:brightness(1.14)}
  55%{transform:translateX(-50%) scale(.985)}
  72%{transform:translateX(-50%) scale(1.025)}
}
@keyframes speaker-led{
  0%,100%{opacity:.45;box-shadow:0 0 7px var(--cyan)}
  50%{opacity:1;box-shadow:0 0 18px var(--pink)}
}

.hero-speaker-system.intensity-subtle .speaker-driver-main{animation-duration:1.55s}
.hero-speaker-system.intensity-subtle .hero-speaker{opacity:.42}
.hero-speaker-system.intensity-strong .speaker-driver-main{animation-duration:.65s}
.hero-speaker-system.intensity-strong .hero-speaker{opacity:.72}

.rsj-live-grid{
  position:relative;
  z-index:4;
}

/* Chat */
.chat-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr) 330px;
  gap:24px;
  align-items:start;
}
.chat-main-column{
  display:grid;
  gap:22px;
}
.chat-intro-card,
.chat-rules-card,
.chat-info-card{
  padding:30px;
}
.chat-intro-card h2,
.chat-rules-card h2,
.chat-info-card h3{
  font-family:Orbitron,sans-serif;
}
.chat-intro-card>p,
.chat-rules-card>p,
.chat-info-card p{
  color:var(--muted);
  line-height:1.75;
}
.chat-features-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
  margin:28px 0;
}
.chat-features-grid>div{
  padding:18px;
  background:rgba(255,255,255,.025);
  border:1px solid rgba(255,255,255,.06);
  border-radius:15px;
}
.chat-features-grid span{
  display:block;
  font-size:1.45rem;
  margin-bottom:12px;
}
.chat-features-grid strong{
  display:block;
  margin-bottom:8px;
}
.chat-features-grid p{
  margin:0;
  color:var(--muted);
  font-size:.82rem;
  line-height:1.6;
}
.chat-launch-box{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:24px;
  padding:22px;
  margin-top:22px;
  border-radius:16px;
  background:
    linear-gradient(135deg,rgba(25,231,255,.06),rgba(155,99,255,.08),rgba(255,53,207,.06));
  border:1px solid rgba(25,231,255,.13);
}
.chat-launch-box h3{
  font-family:Orbitron,sans-serif;
  margin:8px 0 6px;
}
.chat-launch-box p{
  color:var(--muted);
  margin:0;
}
.chat-launch-btn{
  white-space:nowrap;
}
.chat-rules-list{
  list-style:none;
  padding:0;
  margin:26px 0 0;
  display:grid;
  gap:10px;
}
.chat-rules-list li{
  display:grid;
  grid-template-columns:42px 1fr;
  gap:14px;
  align-items:start;
  padding:14px 16px;
  border-radius:13px;
  background:rgba(255,255,255,.025);
  border:1px solid rgba(255,255,255,.055);
}
.chat-rules-list li>span{
  width:34px;
  height:34px;
  border-radius:50%;
  display:grid;
  place-items:center;
  color:#071018;
  font-family:Orbitron,sans-serif;
  font-size:.72rem;
  background:linear-gradient(135deg,var(--cyan),var(--violet));
}
.chat-rules-list p{
  margin:5px 0 0;
  color:#d6dced;
  line-height:1.55;
}
.chat-side-column{
  display:grid;
  gap:15px;
  position:sticky;
  top:130px;
}
.chat-info-card .btn{
  margin-top:10px;
}

@media(max-width:1200px){
  .hero-speaker{
    width:145px;
    height:260px;
    opacity:.42;
  }
  .speaker-driver-main{
    width:108px;
    height:108px;
  }
}
@media(max-width:920px){
  .hero-speaker-system{display:none}
  .chat-layout{grid-template-columns:1fr}
  .chat-side-column{
    position:static;
    grid-template-columns:repeat(3,1fr);
  }
}
@media(max-width:720px){
  .chat-features-grid,
  .chat-side-column{
    grid-template-columns:1fr;
  }
  .chat-launch-box{
    align-items:flex-start;
    flex-direction:column;
  }
}

/* V8 COMPACT - minder scroll */
.compact-main-nav{gap:12px;flex-wrap:wrap;justify-content:flex-end}.compact-main-nav a{font-size:.73rem}
.secondary-nav{display:flex;justify-content:flex-end;gap:12px;padding:5px 0 7px;border-top:1px solid rgba(255,255,255,.035)}.secondary-nav a{font-size:.67rem;color:#8f9bb6;font-weight:800}.secondary-nav a:hover{color:var(--cyan)}
.compact-home-hero{min-height:420px!important;padding:70px 0 40px!important}.compact-hero-grid{grid-template-columns:1fr 270px!important;gap:28px!important}.compact-home-hero .rsj-live-copy h1{font-size:clamp(3rem,7vw,5.2rem)!important;margin-bottom:10px!important}.compact-brand-card{max-width:270px;justify-self:end}
.compact-dashboard-section{padding:20px 0 14px}.compact-dashboard-grid{display:grid;grid-template-columns:1fr 1fr 1.2fr;gap:12px}.compact-dashboard-grid>.pro-panel{min-height:150px;padding:16px}.compact-now-row{display:flex;gap:11px;align-items:center;margin:12px 0 9px}.compact-np-cover{width:56px!important;height:56px!important;border-radius:10px}.compact-now-row strong,.compact-now-row span{display:block}.compact-now-row strong{font-size:.86rem}.compact-now-row span{font-size:.7rem;color:var(--muted);margin-top:4px}
.compact-weather-row{display:flex;align-items:center;gap:12px;margin-top:15px}.compact-weather-row>strong{font-family:Orbitron;font-size:2.8rem;color:var(--cyan)}.compact-weather-row h3{font-family:Orbitron;font-size:.86rem;margin:0 0 4px}.compact-weather-row span{font-size:.7rem;color:var(--muted)}
.compact-news-list{display:grid;gap:6px;margin:9px 0}.compact-news-list a{display:grid;grid-template-columns:40px 1fr;gap:7px;border-bottom:1px solid rgba(255,255,255,.05);padding-bottom:5px}.compact-news-list time{font-size:.64rem;color:var(--pink)}.compact-news-list strong{font-size:.7rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.quick-nav-section{padding:14px 0 30px}.quick-nav-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.quick-nav-grid a{display:grid;grid-template-columns:32px 1fr;grid-template-areas:"icon title" "icon sub";column-gap:9px;align-items:center;min-height:68px;padding:12px;border-radius:12px;background:linear-gradient(145deg,#101726,#0b111d);border:1px solid rgba(255,255,255,.06)}.quick-nav-grid span{grid-area:icon;font-size:1.15rem}.quick-nav-grid strong{grid-area:title;font-size:.76rem}.quick-nav-grid small{grid-area:sub;color:var(--muted);font-size:.64rem}
.micro-hero{min-height:205px!important;padding:58px 0 32px!important}.micro-hero h1{font-size:clamp(2rem,5vw,3.4rem)!important;margin:7px 0!important}.micro-hero p{margin:0!important}
.compact-page-section{padding:34px 0 46px!important}.compact-two-col{display:grid;grid-template-columns:1fr 1fr;gap:16px}.page-panel{padding:22px}.playlist-now{display:flex;gap:15px;align-items:center;margin-top:16px}.playlist-cover{width:100px!important;height:100px!important;border-radius:13px}.playlist-now h2{font-family:Orbitron;font-size:1rem;margin:0 0 6px}.playlist-now p{margin:0;color:var(--muted)}
.action-compact-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.compact-action-card{min-height:190px;padding:20px;display:flex;flex-direction:column;border-radius:14px;background:linear-gradient(145deg,#101726,#121120);border:1px solid rgba(255,255,255,.06)}.compact-action-card>span{color:var(--pink);font-size:.63rem;font-weight:900}.compact-action-card h2{font-family:Orbitron;font-size:.95rem;margin:10px 0 7px}.compact-action-card p{color:var(--muted);font-size:.75rem}.compact-action-card a{margin-top:auto;color:var(--cyan);font-size:.72rem;font-weight:900}
.compact-media-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.compact-media-grid article{border-radius:13px;overflow:hidden;border:1px solid rgba(255,255,255,.06);background:#101522}.compact-media-grid img{width:100%;height:170px;object-fit:cover}.compact-media-grid span{display:block;padding:10px 12px;font-size:.73rem;font-weight:800}
.page-hero.slim{min-height:220px!important;padding:62px 0 34px!important}.section{padding:56px 0}.program-big-card{min-height:165px!important}.program-big-card>div{padding:17px!important}.dj-card{min-height:275px!important}.dj-banner{height:135px!important}.news-card>img{height:155px!important}.highlight-thumb{height:165px!important}.studio-gallery-card img{height:170px!important}.today-news-row{padding:14px 16px!important}.chat-intro-card,.chat-rules-card,.chat-info-card{padding:20px!important}.chat-features-grid{margin:16px 0!important}.chat-rules-list{gap:6px!important;margin-top:16px!important}.chat-rules-list li{padding:9px 11px!important}
@media(max-width:1080px){.compact-dashboard-grid{grid-template-columns:1fr 1fr}.compact-dashboard-grid .compact-news-card{grid-column:1/-1}.quick-nav-grid{grid-template-columns:repeat(2,1fr)}.action-compact-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:820px){.secondary-nav{overflow:auto;justify-content:flex-start}.compact-hero-grid{grid-template-columns:1fr!important}.compact-brand-card{display:none}.compact-dashboard-grid,.compact-two-col{grid-template-columns:1fr}.compact-dashboard-grid .compact-news-card{grid-column:auto}.compact-media-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.quick-nav-grid,.action-compact-grid,.compact-media-grid{grid-template-columns:1fr}.compact-home-hero{min-height:380px!important}}

/* =========================================================
   V9 PRO MASTER POLISH
   ========================================================= */
:root{--neon-glow:0 0 18px rgba(25,231,255,.10)}
body{padding-bottom:98px}
.compact-main-nav a{display:inline-flex;align-items:center;gap:5px;padding:7px 2px}.compact-main-nav a>span{font-size:.72rem;color:var(--cyan);opacity:.9}
.secondary-nav{border-radius:0 0 12px 12px}
.btn-chat{background:linear-gradient(100deg,rgba(255,53,207,.14),rgba(155,99,255,.17));border:1px solid rgba(255,53,207,.30);color:#fff}
.hero-live-dj{margin-top:15px;font-size:.78rem;color:#d8def0}.live-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#ff496d;box-shadow:0 0 12px #ff496d;margin-right:6px;animation:livepulse 1.2s infinite}@keyframes livepulse{50%{opacity:.35;transform:scale(.8)}}
.pro-panel,.feature-card,.news-card,.event-card,.dj-card,.program-big-card,.compact-action-card,.compact-media-grid article,.today-news-row,.request-admin-item{
 border-color:color-mix(in srgb,var(--cyan) 24%,rgba(255,255,255,.06))!important;
 box-shadow:0 18px 40px rgba(0,0,0,.18),0 0 16px color-mix(in srgb,var(--cyan) 10%,transparent)!important
}
body:has(.dummy-never){display:block}
.greet-bar{height:37px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;background:linear-gradient(90deg,#0b101d,#101126,#0b101d);border-bottom:1px solid color-mix(in srgb,var(--pink) 22%,transparent);overflow:hidden}
.greet-label{height:37px;display:grid;place-items:center;padding:0 15px;background:linear-gradient(90deg,var(--pink),var(--violet));color:#fff;font-weight:900;font-size:.65rem;letter-spacing:.13em}
.greet-window{overflow:hidden;white-space:nowrap}.greet-track{display:inline-flex;min-width:max-content;animation:greet-scroll 56s linear infinite}.greet-track span{padding:0 28px;font-size:.75rem;color:#e5eaf8}.greet-track strong{color:var(--cyan)}.greet-action{padding:0 14px;font-size:.68rem;color:var(--pink);font-weight:900}@keyframes greet-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.compact-form-wrap{max-width:750px}.full{grid-column:1/-1}

/* Completely rebuilt bottom player */
.radio-bar{min-height:82px;background:rgba(7,11,20,.96);border-top:1px solid color-mix(in srgb,var(--cyan) 22%,transparent);box-shadow:0 -18px 45px rgba(0,0,0,.34);backdrop-filter:blur(22px)}
.pro-player-inner{width:min(1320px,calc(100% - 24px));min-height:82px;display:grid!important;grid-template-columns:235px 215px minmax(260px,1fr) 200px 145px!important;gap:12px!important;align-items:center}
.player-brand{display:flex;align-items:center;gap:10px;min-width:0}.player-brand-logo{width:138px;height:42px;border:1px solid color-mix(in srgb,var(--cyan) 30%,transparent);border-radius:11px;display:flex;align-items:center;justify-content:center;gap:2px;background:#0c1220;flex:0 0 auto}.player-brand-logo span{color:var(--cyan);font-family:Orbitron;font-size:12px;font-weight:800}.player-brand-logo strong{color:var(--pink);font-family:Orbitron;font-size:12px}.player-brand-meta{min-width:0}.player-brand-meta b{display:block;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.player-brand-meta small{display:flex;align-items:center;gap:5px;font-size:8px;color:#ff6e86;margin-top:4px}.player-brand-meta i{width:6px;height:6px;border-radius:50%;background:#ff4a68;box-shadow:0 0 8px #ff4a68}
.player-main-controls{display:flex;align-items:center;gap:12px}.player-volume-wrap{display:flex;align-items:center;gap:7px;min-width:0}.player-volume-wrap span{font-size:13px}.player-volume-wrap .radio-volume{width:105px}
.pro-now{min-width:0;background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.05);border-radius:12px;padding:7px 9px}.pro-now .radio-now-copy{min-width:0}.pro-now strong,.pro-now small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.player-next-pro{min-width:0;padding-left:8px}.player-next-pro span,.player-next-pro strong,.player-next-pro small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.player-next-pro span{font-size:8px;color:var(--pink);font-weight:900}.player-next-pro strong{font-size:10px;margin:4px 0}.player-next-pro small{font-size:8px;color:var(--muted)}
.radio-program-btn{width:145px!important;min-width:145px;height:42px!important;min-height:42px!important;padding:0 12px!important}
@media(max-width:1100px){.pro-player-inner{grid-template-columns:210px 190px minmax(220px,1fr) 135px!important}.player-next-pro{display:none}.radio-program-btn{width:135px!important;min-width:135px}.player-brand-logo{width:125px}.player-volume-wrap .radio-volume{width:80px}}
@media(max-width:820px){body{padding-bottom:82px}.pro-player-inner{grid-template-columns:1fr 58px!important;min-height:72px}.player-brand,.player-next-pro,.radio-program-btn,.player-volume-wrap{display:none}.player-main-controls{grid-column:2;grid-row:1;justify-content:flex-end}.pro-now{grid-column:1;grid-row:1;background:transparent;border:0}.radio-play-btn{width:48px!important;height:48px!important}}
.dj-card.dj-is-live{border-color:#ff4d70!important;box-shadow:0 0 28px rgba(255,77,112,.14)!important}.dj-live-strip{padding:7px 12px;font-size:.62rem;font-weight:900;color:#8190ac;background:rgba(255,255,255,.025)}.dj-is-live .dj-live-strip{color:#ff6c85;background:rgba(255,77,112,.08)}


/* =========================================================
   V9.1 CLEAN HEADER / MENU
   ========================================================= */
.premium-header{
  background:rgba(4,8,15,.94);
  border-bottom:1px solid rgba(255,255,255,.055);
  box-shadow:0 8px 28px rgba(0,0,0,.18);
}

.clean-header-wrap{
  min-height:76px;
  display:grid;
  grid-template-columns:auto 1fr;
  gap:34px;
  align-items:center;
}

.brand.brand-rsj{
  min-width:310px;
  max-width:340px;
  gap:12px;
}

.brand-mark.brand-mark-image{
  width:62px;
  height:46px;
  border-radius:11px;
}

.brand-copy{
  min-width:0;
}

.brand-copy strong{
  font-size:.9rem;
  line-height:1.15;
  white-space:nowrap;
}

.brand-copy small{
  display:block;
  margin-top:3px;
  font-size:.62rem;
  color:#8e9ab4;
  white-space:nowrap;
}

.premium-main-nav{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:5px;
  flex-wrap:nowrap;
  min-width:0;
}

.premium-main-nav>a,
.more-nav-btn{
  height:40px;
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:0 10px;
  border:0;
  border-radius:10px;
  background:transparent;
  color:#aeb8ce;
  font-size:.72rem;
  font-weight:800;
  cursor:pointer;
  white-space:nowrap;
  transition:.18s ease;
  position:relative;
}

.premium-main-nav>a::after{
  content:"";
  position:absolute;
  left:10px;
  right:10px;
  bottom:3px;
  height:2px;
  border-radius:4px;
  transform:scaleX(0);
  transform-origin:center;
  background:linear-gradient(90deg,var(--cyan),var(--pink));
  transition:.18s ease;
}

.premium-main-nav>a:hover,
.premium-main-nav>a.active,
.more-nav-btn:hover{
  color:#fff;
  background:rgba(255,255,255,.035);
}

.premium-main-nav>a:hover::after,
.premium-main-nav>a.active::after{
  transform:scaleX(1);
}

.nav-icon{
  color:var(--cyan);
  font-size:.67rem;
  line-height:1;
  opacity:.95;
}

.premium-main-nav>a.active .nav-icon{
  color:var(--pink);
}

.more-nav{
  position:relative;
}

.more-nav-btn .chev{
  margin-left:2px;
  color:#75829e;
  font-size:.72rem;
}

.more-nav-menu{
  position:absolute;
  top:calc(100% + 8px);
  right:0;
  min-width:190px;
  padding:8px;
  border-radius:14px;
  background:rgba(10,15,26,.98);
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 18px 45px rgba(0,0,0,.35),0 0 18px rgba(25,231,255,.06);
  backdrop-filter:blur(18px);
  opacity:0;
  visibility:hidden;
  transform:translateY(-5px);
  transition:.18s ease;
  z-index:120;
}

.more-nav:hover .more-nav-menu,
.more-nav:focus-within .more-nav-menu{
  opacity:1;
  visibility:visible;
  transform:translateY(0);
}

.more-nav-menu::before{
  content:"";
  position:absolute;
  right:20px;
  top:-5px;
  width:10px;
  height:10px;
  background:rgba(10,15,26,.98);
  border-left:1px solid rgba(255,255,255,.08);
  border-top:1px solid rgba(255,255,255,.08);
  transform:rotate(45deg);
}

.more-nav-menu a{
  display:flex;
  align-items:center;
  min-height:36px;
  padding:0 11px;
  border-radius:9px;
  color:#aeb8ce;
  font-size:.72rem;
  font-weight:800;
  transition:.16s ease;
}

.more-nav-menu a:hover{
  background:rgba(25,231,255,.055);
  color:#fff;
  padding-left:14px;
}

.secondary-nav{
  display:none!important;
}

/* Keep ticker/greet bars visually separate from header */
.news-ticker{
  border-top:0;
}
.greet-bar{
  border-top:1px solid rgba(255,255,255,.025);
}

/* Tablet */
@media(max-width:1180px){
  .clean-header-wrap{
    gap:20px;
  }
  .brand.brand-rsj{
    min-width:260px;
  }
  .premium-main-nav>a,
  .more-nav-btn{
    padding:0 8px;
    font-size:.68rem;
  }
}

/* Compact laptop */
@media(max-width:1020px){
  .brand-copy small{
    display:none;
  }
  .brand.brand-rsj{
    min-width:205px;
  }
  .premium-main-nav>a span:not(.nav-icon){
    display:none;
  }
  .premium-main-nav>a{
    width:40px;
    justify-content:center;
    padding:0;
  }
  .more-nav-btn span:not(.nav-icon):not(.chev){
    display:none;
  }
  .more-nav-btn{
    width:44px;
    justify-content:center;
    padding:0;
  }
  .more-nav-btn .chev{
    display:none;
  }
}

/* Mobile */
@media(max-width:820px){
  .clean-header-wrap{
    grid-template-columns:1fr;
    gap:8px;
    padding-top:10px;
    padding-bottom:10px;
  }
  .brand.brand-rsj{
    min-width:0;
    max-width:none;
  }
  .premium-main-nav{
    justify-content:flex-start;
    overflow-x:auto;
    padding-bottom:3px;
    scrollbar-width:none;
  }
  .premium-main-nav::-webkit-scrollbar{display:none}
  .premium-main-nav>a{
    flex:0 0 auto;
  }
  .more-nav-menu{
    position:fixed;
    left:12px;
    right:12px;
    top:112px;
    min-width:0;
  }
}

/* =========================================================
   V10 PRO - MOBILE + ZERO CROP MEDIA + RESPONSIVE BANNERS
   ========================================================= */

/* Alle echte <img>-afbeeldingen tonen volledig */
img{
  max-width:100%;
  height:auto;
}
.news-card>img,
.highlight-thumb img,
.today-show-image img,
.program-big-card>img,
.dj-banner img,
.studio-gallery-card img,
.compact-media-grid img,
.chart-cover img,
.promo-media img,
.request-visual img,
.hero-brand-card img,
.station-visual-main img,
.station-visual-side img,
.studio-hero-banner img,
.listen-side-image img,
.admin-image-strip img{
  object-fit:contain!important;
  object-position:center!important;
  background:var(--bg)!important;
}

/* Vaste mediavakken krijgen ruimte i.p.v. afsnijden */
.news-card>img{height:200px!important}
.highlight-thumb{height:210px!important;background:var(--bg)}
.today-show-image{height:175px!important;background:var(--bg)}
.program-big-card>img{min-height:170px!important;height:100%!important;background:var(--bg)}
.dj-banner{height:180px!important;background:var(--bg)}
.studio-gallery-card img{height:210px!important}
.compact-media-grid img{height:210px!important}
.chart-cover img{width:58px!important;height:58px!important}
.hero-brand-card img{aspect-ratio:auto!important;max-height:280px!important}

/* Hoofdbanner: altijd volledige banner tonen */
.rsj-live-hero{
  background:var(--bg);
}
.rsj-live-bg{
  background-size:contain!important;
  background-repeat:no-repeat!important;
  background-position:center!important;
  filter:none!important;
}
.rsj-live-bg::before{
  content:"";
  position:absolute;
  inset:-30px;
  background:inherit;
  background-size:cover!important;
  background-position:center!important;
  filter:blur(24px) brightness(.36);
  opacity:.55;
  transform:scale(1.05);
  z-index:-1;
}

/* Pagina-banners met achtergrondvariabele */
.page-hero[style*="--page-bg"],
.request-hero{
  background-color:var(--bg)!important;
  background-size:contain!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
}

/* Meer professionele blokken */
.pro-panel,
.news-card,
.highlight-card,
.program-big-card,
.dj-card,
.compact-action-card,
.studio-gallery-card,
.compact-media-grid article,
.today-news-row{
  border-radius:16px!important;
  overflow:hidden;
}

.section-head-inline h2,
.page-hero h1,
.rsj-live-copy h1{
  text-wrap:balance;
}

/* Tablet */
@media(max-width:1024px){
  .container{width:min(94%,1000px)}
  .premium-main-nav{gap:2px}
  .compact-dashboard-grid{grid-template-columns:1fr 1fr!important}
  .quick-nav-grid{grid-template-columns:repeat(2,1fr)!important}
  .program-card-grid{grid-template-columns:1fr!important}
  .page-grid{grid-template-columns:1fr 1fr!important}
  .studio-gallery-grid{grid-template-columns:1fr 1fr!important}
  .station-visuals-grid{grid-template-columns:1fr 1fr!important}
  .station-visual-main{grid-column:1/-1}
}

/* Mobiel */
@media(max-width:720px){
  body{overflow-x:hidden}
  .container{width:calc(100% - 24px)!important}
  .premium-header{position:sticky;top:0;z-index:150}
  .clean-header-wrap{min-height:auto!important}
  .brand.brand-rsj{max-width:100%!important}
  .brand-mark.brand-mark-image{width:54px!important;height:42px!important}
  .brand-copy strong{font-size:.84rem!important}
  .brand-copy small{display:none!important}
  .premium-main-nav{width:100%;overflow-x:auto;padding:4px 0 6px;gap:4px}
  .premium-main-nav>a,.more-nav-btn{height:38px;min-width:38px}
  .news-ticker{height:36px}
  .ticker-label{height:36px}
  .greet-bar{height:34px}
  .greet-label{height:34px}
  .greet-action{display:none}
  .rsj-live-hero{min-height:390px!important;padding:54px 0 30px!important}
  .rsj-live-bg{background-size:contain!important}
  .rsj-live-copy h1{font-size:clamp(2.45rem,12vw,3.8rem)!important}
  .hero-actions{display:grid!important;grid-template-columns:1fr!important;width:100%;max-width:320px}
  .hero-actions .btn{width:100%;justify-content:center}
  .compact-dashboard-grid,
  .compact-two-col,
  .weather-news-grid,
  .request-system-grid,
  .chat-layout,
  .split-home,
  .top30-home,
  .app-social-grid,
  .studio-hero-banner{
    grid-template-columns:1fr!important;
  }
  .page-grid,
  .news-grid,
  .highlight-grid,
  .event-grid,
  .studio-gallery-grid,
  .station-visuals-grid{
    grid-template-columns:1fr!important;
  }
  .quick-nav-grid{grid-template-columns:1fr 1fr!important}
  .action-compact-grid{grid-template-columns:1fr!important}
  .compact-media-grid{grid-template-columns:1fr!important}
  .program-big-card{grid-template-columns:1fr!important}
  .program-big-card>img{height:210px!important}
  .today-news-sidebar{grid-template-columns:1fr!important}
  .weather-days{grid-template-columns:1fr 1fr!important}
  .chat-features-grid{grid-template-columns:1fr!important}
  .chart-row{grid-template-columns:38px 52px 1fr!important}
  .chart-status{display:none!important}
  .radio-bar{left:0!important;right:0!important;bottom:0!important;border-radius:0!important}
}

/* Kleine telefoon */
@media(max-width:430px){
  .quick-nav-grid{grid-template-columns:1fr!important}
  .weather-days{grid-template-columns:1fr 1fr!important}
  .premium-main-nav>a{padding:0 7px!important}
  .more-nav-menu{left:8px!important;right:8px!important}
}

/* Veilige viewport voor banners */
.banner-safe,
.hero-brand-card,
.studio-hero-banner,
.station-visual-main,
.station-visual-side{
  background:linear-gradient(135deg,#07101c,#110a19);
}


/* =========================================================
   V10.2 HERO BANNER FIX
   Grote banner volledig vullen + kleine afbeelding volledig zichtbaar
   ========================================================= */

/* Grote achtergrondbanner: hero altijd volledig gevuld */
.rsj-live-hero{
  min-height: 520px !important;
  background: #050811 !important;
  overflow: hidden;
}

.rsj-live-bg{
  inset: 0 !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  filter: none !important;
  transform: none !important;
}

/* Geen contain meer op de grote banner */
.rsj-live-bg::before{
  content: none !important;
}

/* Overlay iets rustiger zodat beeld beter zichtbaar blijft */
.rsj-live-overlay{
  background:
    linear-gradient(90deg,rgba(4,7,15,.88) 0%,rgba(4,7,15,.50) 46%,rgba(4,7,15,.22) 78%,rgba(4,7,15,.32) 100%),
    linear-gradient(0deg,rgba(5,8,17,.80) 0%,rgba(5,8,17,.05) 52%,rgba(5,8,17,.12) 100%) !important;
}

/* Kleine afbeelding rechts: niet afsnijden */
.hero-brand-card{
  width: 265px !important;
  max-width: 265px !important;
  padding: 8px !important;
  border-radius: 18px !important;
  background:
    linear-gradient(145deg,rgba(8,12,22,.96),rgba(14,10,24,.94)) !important;
  display:flex !important;
  align-items:center;
  justify-content:center;
  overflow:hidden !important;
}

.hero-brand-card img{
  width: 100% !important;
  height: auto !important;
  max-height: 150px !important;
  object-fit: contain !important;
  object-position: center !important;
  background: transparent !important;
  border-radius: 12px !important;
}

/* Klein beeld minder dominant */
.compact-brand-card{
  width: 245px !important;
  max-width: 245px !important;
  justify-self:end !important;
}

/* Tekst leesbaar houden over volledig gevulde banner */
.rsj-live-copy{
  position:relative;
  z-index:5;
  text-shadow:0 2px 22px rgba(0,0,0,.45);
}

/* Tablet */
@media(max-width:1024px){
  .rsj-live-hero{
    min-height: 480px !important;
  }
  .hero-brand-card,
  .compact-brand-card{
    width: 225px !important;
    max-width: 225px !important;
  }
  .hero-brand-card img{
    max-height: 130px !important;
  }
}

/* Mobiel: grote banner blijft cover, klein kaartje weg om ruimte te sparen */
@media(max-width:820px){
  .rsj-live-hero{
    min-height: 430px !important;
  }
  .rsj-live-bg{
    background-size: cover !important;
    background-position: center center !important;
  }
  .hero-brand-card,
  .compact-brand-card{
    display:none !important;
  }
}

/* Kleine telefoon: focus iets hoger zodat logo/tekst van banner beter blijft staan */
@media(max-width:520px){
  .rsj-live-bg{
    background-position: 52% center !important;
  }
}


/* =========================================================
   V10.3 DEFINITIEVE HERO FIX
   Geen zoom/crop op hoofdbanner + kleiner kaartje rechts
   ========================================================= */

.rsj-live-hero,
.compact-home-hero{
  min-height: 500px !important;
  position: relative !important;
  overflow: hidden !important;
  background: #050811 !important;
}

/*
 * De hoofdafbeelding wordt bewust over het hele bannervlak getrokken.
 * Zo blijft de VOLLEDIGE afbeelding zichtbaar en wordt niets afgesneden.
 */
.rsj-live-bg{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  background-size:100% 100% !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
  filter:none !important;
  transform:none !important;
  opacity:1 !important;
}

.rsj-live-bg::before,
.rsj-live-bg::after{
  content:none !important;
  display:none !important;
}

/* Overlay alleen voor leesbaarheid, niet voor extra zoom */
.rsj-live-overlay{
  inset:0 !important;
  background:
    linear-gradient(90deg,
      rgba(3,7,14,.86) 0%,
      rgba(3,7,14,.60) 27%,
      rgba(3,7,14,.20) 54%,
      rgba(3,7,14,.14) 72%,
      rgba(3,7,14,.40) 100%
    ),
    linear-gradient(0deg,
      rgba(4,8,16,.66) 0%,
      rgba(4,8,16,.05) 48%,
      rgba(4,8,16,.10) 100%
    ) !important;
}

/* Content blijft netjes boven de banner */
.rsj-live-grid,
.compact-hero-grid{
  position:relative !important;
  z-index:5 !important;
  grid-template-columns:minmax(0,1fr) 220px !important;
  align-items:center !important;
  gap:28px !important;
}

/* Kleine afbeelding rechts volledig zichtbaar en uit het hoofdlogo weg */
.hero-brand-card,
.compact-brand-card{
  width:220px !important;
  max-width:220px !important;
  min-height:125px !important;
  padding:8px !important;
  margin:0 !important;
  justify-self:end !important;
  align-self:center !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  overflow:hidden !important;
  border-radius:16px !important;
  background:rgba(6,10,18,.92) !important;
  border:1px solid rgba(255,255,255,.10) !important;
  box-shadow:
    0 15px 35px rgba(0,0,0,.35),
    0 0 18px color-mix(in srgb,var(--cyan) 10%,transparent) !important;
}

.hero-brand-card img,
.compact-brand-card img{
  display:block !important;
  width:100% !important;
  height:auto !important;
  max-width:100% !important;
  max-height:112px !important;
  object-fit:contain !important;
  object-position:center center !important;
  background:transparent !important;
  border-radius:10px !important;
  transform:none !important;
}

/* Hoofdtekst iets compacter zodat het beeld zelf meer ruimte krijgt */
.rsj-live-copy{
  max-width:760px !important;
}
.rsj-live-copy h1{
  font-size:clamp(3rem,6.6vw,5.7rem) !important;
  line-height:.96 !important;
}

/* Desktop extra breed */
@media(min-width:1400px){
  .rsj-live-hero,
  .compact-home-hero{
    min-height:520px !important;
  }
  .rsj-live-grid,
  .compact-hero-grid{
    grid-template-columns:minmax(0,1fr) 230px !important;
  }
  .hero-brand-card,
  .compact-brand-card{
    width:230px !important;
    max-width:230px !important;
  }
}

/* Tablet */
@media(max-width:1024px){
  .rsj-live-hero,
  .compact-home-hero{
    min-height:455px !important;
  }

  .rsj-live-bg{
    background-size:100% 100% !important;
  }

  .rsj-live-grid,
  .compact-hero-grid{
    grid-template-columns:minmax(0,1fr) 185px !important;
    gap:18px !important;
  }

  .hero-brand-card,
  .compact-brand-card{
    width:185px !important;
    max-width:185px !important;
    min-height:105px !important;
  }

  .hero-brand-card img,
  .compact-brand-card img{
    max-height:92px !important;
  }
}

/* Mobiel: volledige banner blijft zichtbaar; klein duplicaat verdwijnt */
@media(max-width:820px){
  .rsj-live-hero,
  .compact-home-hero{
    min-height:410px !important;
  }

  .rsj-live-bg{
    background-size:100% 100% !important;
    background-position:center center !important;
  }

  .rsj-live-grid,
  .compact-hero-grid{
    grid-template-columns:1fr !important;
  }

  .hero-brand-card,
  .compact-brand-card{
    display:none !important;
  }

  .rsj-live-overlay{
    background:
      linear-gradient(90deg,rgba(3,7,14,.80),rgba(3,7,14,.30)),
      linear-gradient(0deg,rgba(4,8,16,.68),rgba(4,8,16,.05)) !important;
  }
}

@media(max-width:520px){
  .rsj-live-hero,
  .compact-home-hero{
    min-height:390px !important;
  }

  .rsj-live-copy h1{
    font-size:clamp(2.5rem,12vw,3.5rem) !important;
  }
}


/* =========================================================
   V10.4 NIEUWE RADIOSTUNTJAGER HERO BANNER
   ========================================================= */

.rsj-live-hero,
.compact-home-hero{
  min-height: 470px !important;
  position: relative !important;
  overflow: hidden !important;
  background: #050811 !important;
}

/* Nieuwe 3:1 banner strak, zonder vervormen */
.rsj-live-bg{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
  filter:none !important;
  transform:none !important;
}

/* rustiger overlay zodat de banner zichtbaar blijft */
.rsj-live-overlay{
  background:
    linear-gradient(90deg,
      rgba(3,7,14,.74) 0%,
      rgba(3,7,14,.42) 28%,
      rgba(3,7,14,.10) 54%,
      rgba(3,7,14,.08) 72%,
      rgba(3,7,14,.24) 100%
    ),
    linear-gradient(0deg,
      rgba(4,8,16,.52) 0%,
      rgba(4,8,16,.00) 55%,
      rgba(4,8,16,.05) 100%
    ) !important;
}

/* content niet over hoofdlogo heen */
.rsj-live-grid,
.compact-hero-grid{
  grid-template-columns: 1fr !important;
  align-items:center !important;
  min-height:470px !important;
}

.rsj-live-copy{
  max-width: 560px !important;
  margin-left: 0 !important;
  padding-top: 20px !important;
}

/* hoofdnaam op home compacter, omdat merk al in banner staat */
.rsj-live-copy h1{
  font-size: clamp(2.6rem, 5vw, 4.6rem) !important;
  line-height: .98 !important;
  max-width: 540px !important;
}

.hero-dj{
  max-width: 520px !important;
}

/* geen dubbel bannerkaartje meer */
.hero-brand-card,
.compact-brand-card{
  display:none !important;
}

/* desktop extra breed */
@media(min-width:1400px){
  .rsj-live-hero,
  .compact-home-hero{
    min-height:500px !important;
  }

  .rsj-live-grid,
  .compact-hero-grid{
    min-height:500px !important;
  }
}

/* tablet */
@media(max-width:1024px){
  .rsj-live-hero,
  .compact-home-hero{
    min-height:420px !important;
  }

  .rsj-live-grid,
  .compact-hero-grid{
    min-height:420px !important;
  }

  .rsj-live-bg{
    background-size:cover !important;
    background-position:center center !important;
  }

  .rsj-live-copy{
    max-width:500px !important;
  }
}

/* mobiel: banner blijft leesbaar en niet uitgerekt */
@media(max-width:820px){
  .rsj-live-hero,
  .compact-home-hero{
    min-height:390px !important;
  }

  .rsj-live-grid,
  .compact-hero-grid{
    min-height:390px !important;
  }

  .rsj-live-bg{
    background-size:cover !important;
    background-position:center center !important;
  }

  .rsj-live-overlay{
    background:
      linear-gradient(90deg,rgba(3,7,14,.82),rgba(3,7,14,.30)),
      linear-gradient(0deg,rgba(4,8,16,.54),rgba(4,8,16,.03)) !important;
  }

  .rsj-live-copy{
    max-width:100% !important;
    padding-top:0 !important;
  }
}

/* kleine telefoon */
@media(max-width:520px){
  .rsj-live-hero,
  .compact-home-hero{
    min-height:370px !important;
  }

  .rsj-live-grid,
  .compact-hero-grid{
    min-height:370px !important;
  }

  .rsj-live-bg{
    background-position: 52% center !important;
  }

  .rsj-live-copy h1{
    font-size:clamp(2.2rem,11vw,3.2rem) !important;
  }
}


/* =========================================================
   V10.5 CLEAN HERO LAYOUT
   Bannertekst vrijhouden + acties apart onder de banner
   ========================================================= */

/* Oude extra speakers en overlay content uitschakelen in de nieuwe hero */
.clean-station-hero .hero-speaker-system,
.clean-station-hero .rsj-live-grid,
.clean-station-hero .rsj-live-copy,
.clean-station-hero .hero-brand-card{
  display:none !important;
}

/* Pure banner zonder extra tekst erover */
.clean-station-hero{
  position:relative !important;
  width:100% !important;
  min-height:0 !important;
  height:auto !important;
  aspect-ratio:3 / 1 !important;
  max-height:610px !important;
  overflow:hidden !important;
  background:#050811 !important;
  margin:0 !important;
  padding:0 !important;
}

.clean-station-hero .rsj-live-bg{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
  transform:none !important;
  filter:none !important;
}

/* Banner zelf voldoende zichtbaar houden */
.clean-station-hero .rsj-live-overlay{
  position:absolute !important;
  inset:0 !important;
  background:
    linear-gradient(90deg,rgba(3,7,14,.10),rgba(3,7,14,.02) 45%,rgba(3,7,14,.03) 70%,rgba(3,7,14,.12)),
    linear-gradient(0deg,rgba(4,8,16,.10),transparent 40%) !important;
  pointer-events:none !important;
}

/* Actiebalk onder de banner */
.hero-action-dock{
  position:relative;
  z-index:8;
  background:
    linear-gradient(90deg,rgba(7,12,22,.98),rgba(11,14,27,.98) 55%,rgba(20,8,23,.98));
  border-top:1px solid rgba(255,255,255,.055);
  border-bottom:1px solid rgba(255,255,255,.055);
  box-shadow:0 14px 40px rgba(0,0,0,.20);
}

.hero-action-dock-inner{
  min-height:92px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
}

.hero-live-info{
  display:flex;
  align-items:center;
  gap:13px;
  min-width:0;
}

.hero-live-info .live-dot{
  width:11px;
  height:11px;
  flex:0 0 auto;
  border-radius:50%;
  background:#ff4f70;
  box-shadow:0 0 14px rgba(255,79,112,.75);
  animation:hero-live-pulse 1.2s ease-in-out infinite;
}

@keyframes hero-live-pulse{
  50%{opacity:.42;transform:scale(.82)}
}

.hero-live-info div{
  min-width:0;
}

.hero-live-info small,
.hero-live-info strong,
.hero-live-info span{
  display:block;
}

.hero-live-info small{
  color:var(--pink);
  font-size:.62rem;
  line-height:1;
  font-weight:900;
  letter-spacing:.13em;
}

.hero-live-info strong{
  margin-top:5px;
  color:#fff;
  font-family:Orbitron,sans-serif;
  font-size:.9rem;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.hero-live-info span{
  margin-top:4px;
  color:var(--muted);
  font-size:.7rem;
}

.hero-action-buttons{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  justify-content:flex-end;
}

.hero-action-buttons .btn{
  min-height:44px;
  padding:0 17px;
  border-radius:11px;
  font-size:.78rem;
}

/* Dashboard direct na dock iets dichter laten aansluiten */
.hero-action-dock + .compact-dashboard-section{
  padding-top:18px !important;
}

/* Desktop */
@media(min-width:1500px){
  .clean-station-hero{
    max-height:640px !important;
  }
}

/* Laptop / tablet */
@media(max-width:1100px){
  .hero-action-dock-inner{
    min-height:86px;
    gap:18px;
  }
  .hero-live-info span{
    display:none;
  }
  .hero-action-buttons .btn{
    padding:0 14px;
    font-size:.73rem;
  }
}

/* Mobiel */
@media(max-width:760px){
  .clean-station-hero{
    aspect-ratio:16 / 9 !important;
    max-height:none !important;
  }

  .clean-station-hero .rsj-live-bg{
    background-size:cover !important;
    background-position:center center !important;
  }

  .hero-action-dock-inner{
    min-height:auto;
    padding-top:14px;
    padding-bottom:14px;
    flex-direction:column;
    align-items:stretch;
    gap:12px;
  }

  .hero-live-info{
    justify-content:flex-start;
  }

  .hero-action-buttons{
    display:grid;
    grid-template-columns:1fr 1fr;
    width:100%;
  }

  .hero-action-buttons .btn{
    width:100%;
    justify-content:center;
  }

  .hero-action-buttons .btn-chat{
    grid-column:1 / -1;
  }
}

/* Kleine mobiel */
@media(max-width:430px){
  .clean-station-hero{
    aspect-ratio:4 / 3 !important;
  }

  .hero-action-buttons{
    grid-template-columns:1fr;
  }

  .hero-action-buttons .btn-chat{
    grid-column:auto;
  }
}


/* =========================================================
   V10.6 SMALLER BANNER HEIGHT
   Banner minder hoog / strakker
   ========================================================= */

.clean-station-hero{
  aspect-ratio: 4.25 / 1 !important;
  max-height: 430px !important;
}

.hero-action-dock-inner{
  min-height: 82px !important;
}

@media(min-width:1500px){
  .clean-station-hero{
    aspect-ratio: 4.35 / 1 !important;
    max-height: 450px !important;
  }
}

@media(max-width:1100px){
  .clean-station-hero{
    aspect-ratio: 3.6 / 1 !important;
    max-height: 380px !important;
  }
}

@media(max-width:760px){
  .clean-station-hero{
    aspect-ratio: 16 / 8 !important;
    max-height: none !important;
  }

  .hero-action-dock-inner{
    min-height: auto !important;
  }
}

@media(max-width:430px){
  .clean-station-hero{
    aspect-ratio: 16 / 9 !important;
  }
}


/* =========================================================
   V10.7 BUTTONS IN BANNER
   Chat + luister + verzoek direct in banner
   ========================================================= */

.hero-action-dock{
  display:none !important;
}

/* Banner krijgt een nette overlay met live status en 3 knoppen */
.clean-station-hero{
  position:relative !important;
}

.hero-banner-ui{
  position:absolute;
  left:0;
  right:0;
  bottom:18px;
  z-index:8;
  pointer-events:none;
}

.hero-banner-panel{
  width:min(1180px, calc(100% - 34px));
  margin:0 auto;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:24px;
  pointer-events:auto;
}

.hero-banner-status{
  display:flex;
  align-items:center;
  gap:10px;
  min-height:46px;
  padding:10px 16px;
  border-radius:14px;
  background:linear-gradient(145deg, rgba(7,12,22,.92), rgba(19,10,25,.88));
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 12px 30px rgba(0,0,0,.28), 0 0 18px rgba(25,231,255,.06);
  backdrop-filter:blur(14px);
}

.hero-banner-status small{
  color:var(--pink);
  font-size:.63rem;
  font-weight:900;
  letter-spacing:.14em;
  line-height:1;
}

.hero-banner-status strong{
  color:#fff;
  font-family:Orbitron,sans-serif;
  font-size:.88rem;
  white-space:nowrap;
}

.hero-banner-buttons{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  justify-content:flex-end;
}

.hero-banner-buttons .btn{
  min-height:48px;
  padding:0 18px;
  border-radius:13px;
  font-size:.8rem;
  box-shadow:0 12px 28px rgba(0,0,0,.24);
}

.hero-banner-buttons .btn-chat{
  background:linear-gradient(135deg, rgba(26,18,41,.92), rgba(38,19,52,.90));
  border:1px solid rgba(255,53,207,.28);
}

.hero-banner-buttons .btn-primary{
  background:linear-gradient(90deg, var(--cyan), var(--pink));
  color:#06101c;
  border:0;
  font-weight:900;
}

.hero-banner-buttons .btn-ghost{
  background:rgba(10,16,28,.88);
  border:1px solid rgba(255,255,255,.10);
  color:#fff;
}

/* Zorg dat dashboard mooi aansluit nu actiebalk weg is */
.clean-station-hero + .compact-dashboard-section{
  padding-top:18px !important;
}

/* Tablet */
@media(max-width:1100px){
  .hero-banner-panel{
    width:min(100%, calc(100% - 26px));
    gap:16px;
  }

  .hero-banner-buttons .btn{
    min-height:44px;
    padding:0 15px;
    font-size:.76rem;
  }

  .hero-banner-status strong{
    font-size:.8rem;
  }
}

/* Mobiel */
@media(max-width:760px){
  .hero-banner-ui{
    bottom:12px;
  }

  .hero-banner-panel{
    width:calc(100% - 20px);
    flex-direction:column;
    align-items:stretch;
    gap:10px;
  }

  .hero-banner-status{
    justify-content:flex-start;
    min-height:auto;
    padding:9px 12px;
  }

  .hero-banner-status strong{
    font-size:.78rem;
    white-space:normal;
  }

  .hero-banner-buttons{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
    width:100%;
  }

  .hero-banner-buttons .btn{
    width:100%;
    justify-content:center;
    min-height:42px;
    padding:0 10px;
    font-size:.74rem;
  }

  .hero-banner-buttons .btn-chat{
    grid-column:1 / -1;
  }
}

@media(max-width:430px){
  .hero-banner-buttons{
    grid-template-columns:1fr;
  }

  .hero-banner-buttons .btn-chat{
    grid-column:auto;
  }
}

/* =========================================================
   V11 PRO MASTER
   ========================================================= */

/* Bliksem volledig uit */
.lightning-enabled .rsj-live-overlay,
.lightning-flash::after,
.rsj-live-hero::after,
.page-hero::after,
.lightning-banner::after{
  animation:none!important;
  opacity:0!important;
  display:none!important;
}

/* Bass speakers in vaste player */
:root{--bass-level:.03}
.player-bass-speaker{
  width:46px;height:46px;flex:0 0 46px;border-radius:13px;
  display:grid;place-items:center;
  background:linear-gradient(145deg,#080d17,#111929);
  border:1px solid color-mix(in srgb,var(--cyan) 24%,rgba(255,255,255,.06));
  box-shadow:inset 0 0 18px rgba(0,0,0,.75),0 0 calc(7px + var(--bass-level)*15px) color-mix(in srgb,var(--cyan) 18%,transparent);
  overflow:hidden;
}
.player-bass-speaker::before{
  content:"";width:31px;height:31px;border-radius:50%;
  background:radial-gradient(circle,#111725 0 18%,#03050a 20% 33%,#202b3b 35% 60%,#05070c 63%);
  transform:scale(calc(.92 + var(--bass-level)*.10));
  transition:transform .08s linear;
  box-shadow:0 0 calc(5px + var(--bass-level)*12px) color-mix(in srgb,var(--pink) 20%,transparent);
}
.player-bass-speaker span{display:none}
.audio-playing .player-bass-speaker{border-color:color-mix(in srgb,var(--pink) 26%,var(--cyan))}
.pro-player-inner{
  grid-template-columns:46px 235px 215px minmax(240px,1fr) 190px 46px 145px!important;
}
@media(max-width:1180px){
  .pro-player-inner{grid-template-columns:42px 210px 190px minmax(220px,1fr) 42px 135px!important}
  .player-next-pro{display:none!important}
  .player-bass-speaker{width:42px;height:42px}
}
@media(max-width:820px){
  .player-bass-speaker{display:none!important}
  .pro-player-inner{grid-template-columns:1fr 58px!important}
}

/* Artiesten Home */
.birthday-spotlight-section{padding:26px 0 10px}
.birthday-spotlight{display:grid;grid-template-columns:210px 1fr;gap:28px;align-items:center;padding:20px;border-radius:20px;background:linear-gradient(135deg,rgba(25,231,255,.05),rgba(255,53,207,.07));border:1px solid rgba(255,255,255,.08);box-shadow:0 20px 55px rgba(0,0,0,.2)}
.birthday-art{height:180px;border-radius:15px;overflow:hidden;background:#070b14}.birthday-art img{width:100%;height:100%;object-fit:contain;background:#070b14}.birthday-copy h2{font-family:Orbitron,sans-serif;font-size:1.65rem;margin:10px 0}.birthday-copy p{color:var(--muted);line-height:1.65}
.artist-upcoming-home{padding:12px 0 20px}.artist-upcoming-inner{padding:18px 20px;display:grid;grid-template-columns:auto 1fr auto;gap:24px;align-items:center}.artist-upcoming-inner h2{font-family:Orbitron,sans-serif;font-size:1rem;margin:7px 0 0}.artist-upcoming-list{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.artist-upcoming-list a{padding:10px 12px;border-radius:10px;background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.05)}.artist-upcoming-list strong,.artist-upcoming-list span{display:block}.artist-upcoming-list strong{font-size:.76rem}.artist-upcoming-list span{font-size:.65rem;color:var(--muted);margin-top:4px}

/* Artiesten pagina */
.artist-layout{display:grid;grid-template-columns:1fr 280px;gap:22px}.artist-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.artist-card{display:grid;grid-template-columns:145px 1fr;min-height:190px}.artist-card-img{background:#070b14}.artist-card-img img{width:100%;height:100%;object-fit:contain}.artist-card-copy{padding:18px}.artist-card-copy>span{font-size:.64rem;color:var(--pink);font-weight:900}.artist-card-copy h2{font-family:Orbitron,sans-serif;font-size:1rem;margin:8px 0}.artist-card-copy small{color:var(--cyan)}.artist-card-copy p{color:var(--muted);font-size:.78rem;line-height:1.5}.artist-birthday-sidebar{padding:20px;align-self:start;position:sticky;top:110px}.artist-birthday-sidebar h2{font-family:Orbitron,sans-serif}.artist-birthday-sidebar a{display:block;padding:11px 0;border-bottom:1px solid rgba(255,255,255,.06)}.artist-birthday-sidebar strong,.artist-birthday-sidebar span{display:block}.artist-birthday-sidebar strong{font-size:.8rem}.artist-birthday-sidebar span{font-size:.68rem;color:var(--muted);margin-top:4px}
.artist-detail-hero{padding:58px 0 68px}.artist-detail-grid{display:grid;grid-template-columns:360px 1fr;gap:38px;align-items:center}.artist-detail-photo{height:430px;border-radius:20px;overflow:hidden;background:#070b14;border:1px solid rgba(255,255,255,.07)}.artist-detail-photo img{width:100%;height:100%;object-fit:contain}.artist-detail-copy h1{font-family:Orbitron,sans-serif;font-size:clamp(2.6rem,6vw,5rem);margin:10px 0}.artist-detail-copy>p{color:var(--muted);line-height:1.8}.artist-birthday-pill{display:inline-block;padding:9px 12px;border-radius:999px;background:rgba(255,53,207,.08);border:1px solid rgba(255,53,207,.18);margin:10px 0 16px;color:#ffd7f5}

/* Nonstop AzuraCast verzoek */
.nonstop-request-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:20px;align-items:start}.nonstop-request-info,.nonstop-request-frame{padding:24px}.nonstop-request-info h2{font-family:Orbitron,sans-serif}.nonstop-request-info p,.nonstop-request-info li{color:var(--muted);line-height:1.7}.nonstop-request-frame iframe{width:100%;height:650px;border:0;border-radius:12px;background:#fff}

/* Pro details hele site */
.pro-panel,.artist-card,.nonstop-request-info,.nonstop-request-frame{border:1px solid color-mix(in srgb,var(--cyan) 20%,rgba(255,255,255,.06));box-shadow:0 18px 45px rgba(0,0,0,.18),0 0 15px color-mix(in srgb,var(--cyan) 7%,transparent)}
.page-hero{background:linear-gradient(135deg,#080d17,#130a19)!important}
.page-hero h1{letter-spacing:-.045em}

/* Responsive */
@media(max-width:980px){
 .artist-layout,.artist-detail-grid,.nonstop-request-layout{grid-template-columns:1fr}.artist-birthday-sidebar{position:static}.artist-upcoming-inner{grid-template-columns:1fr}.artist-upcoming-list{grid-template-columns:1fr 1fr}.birthday-spotlight{grid-template-columns:150px 1fr}.artist-detail-photo{height:330px}
}
@media(max-width:720px){
 .artist-grid{grid-template-columns:1fr}.artist-card{grid-template-columns:115px 1fr}.artist-upcoming-list{grid-template-columns:1fr}.birthday-spotlight{grid-template-columns:1fr}.birthday-art{height:240px}.artist-detail-photo{height:300px}.nonstop-request-frame iframe{height:560px}
}


/* =========================================================
   V11.1 SPEAKERS NAAR BANNER
   ========================================================= */

/* Onderbar player weer strak zonder speakers */
.player-bass-speaker{
  display:none !important;
}
.pro-player-inner{
  grid-template-columns:235px 215px minmax(240px,1fr) 190px 145px !important;
}
@media(max-width:1180px){
  .pro-player-inner{
    grid-template-columns:210px 190px minmax(220px,1fr) 135px !important;
  }
}
@media(max-width:820px){
  .pro-player-inner{
    grid-template-columns:1fr 58px !important;
  }
}

/* Banner-speakers die op de muziek reageren */
.banner-speaker-visual{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:108px;
  height:250px;
  border-radius:26px;
  z-index:4;
  background:
    linear-gradient(145deg, rgba(7,12,22,.84), rgba(13,18,32,.80));
  border:1px solid color-mix(in srgb,var(--cyan) 22%,rgba(255,255,255,.08));
  box-shadow:
    inset 0 0 30px rgba(0,0,0,.55),
    0 0 calc(8px + var(--bass-level) * 18px) color-mix(in srgb,var(--pink) 14%, transparent),
    0 18px 40px rgba(0,0,0,.26);
  overflow:hidden;
  backdrop-filter:blur(8px);
  opacity:.72;
  pointer-events:none;
}

.banner-speaker-visual.left{ left:26px; }
.banner-speaker-visual.right{ right:26px; }

.banner-speaker-visual::before,
.banner-speaker-visual::after{
  content:"";
  position:absolute;
  left:50%;
  transform:translateX(-50%) scale(calc(.96 + var(--bass-level)*.14));
  border-radius:50%;
  transition:transform .08s linear, box-shadow .08s linear;
}

.banner-speaker-visual::before{
  top:24px;
  width:48px;
  height:48px;
  background:
    radial-gradient(circle,#0c1320 0 17%,#05070b 19% 31%,#202b3d 33% 63%,#080b12 65%);
  box-shadow:
    0 0 calc(5px + var(--bass-level) * 10px) color-mix(in srgb,var(--cyan) 18%, transparent);
}

.banner-speaker-visual::after{
  bottom:28px;
  width:74px;
  height:74px;
  background:
    radial-gradient(circle,#101826 0 18%,#05070b 20% 31%,#283448 33% 62%,#080b12 64%);
  box-shadow:
    0 0 calc(8px + var(--bass-level) * 14px) color-mix(in srgb,var(--pink) 18%, transparent);
}

.banner-speaker-visual span{
  position:absolute;
  left:50%;
  top:50%;
  width:18px;
  height:18px;
  transform:translate(-50%,-50%);
  border-radius:50%;
  background:linear-gradient(135deg,var(--cyan),var(--pink));
  box-shadow:0 0 calc(8px + var(--bass-level) * 10px) color-mix(in srgb,var(--cyan) 38%, transparent);
  opacity:.85;
}

/* Hero content erboven */
.clean-station-hero .hero-banner-ui{
  z-index:8;
}

/* Banner zelf ruimte geven voor speakers */
.clean-station-hero{
  overflow:hidden !important;
}

/* Tablet */
@media(max-width:1200px){
  .banner-speaker-visual{
    width:92px;
    height:220px;
  }
  .banner-speaker-visual.left{ left:18px; }
  .banner-speaker-visual.right{ right:18px; }
}

/* Laptop/smaller desktop */
@media(max-width:980px){
  .banner-speaker-visual{
    width:78px;
    height:195px;
    opacity:.62;
  }
  .banner-speaker-visual::before{
    width:40px;
    height:40px;
    top:22px;
  }
  .banner-speaker-visual::after{
    width:62px;
    height:62px;
    bottom:24px;
  }
}

/* Mobiel: speakers uit, om banner schoon en bruikbaar te houden */
@media(max-width:760px){
  .banner-speaker-visual{
    display:none !important;
  }
}


/* =========================================================
   V11.2 HEADER FIX + ADMIN BUTTON
   ========================================================= */

.premium-header{
  min-height:88px;
  display:block;
}

.clean-header-wrap{
  min-height:88px !important;
  display:grid !important;
  grid-template-columns:minmax(260px, 360px) minmax(0,1fr) !important;
  gap:28px !important;
  align-items:center !important;
}

.header-brand{
  min-width:0 !important;
  max-width:360px !important;
  display:grid !important;
  grid-template-columns:64px minmax(0,1fr) !important;
  gap:12px !important;
  align-items:center !important;
}

.header-brand .brand-mark.brand-mark-image{
  width:64px !important;
  height:52px !important;
  flex:0 0 auto !important;
}

.header-brand .brand-copy{
  min-width:0 !important;
}

.header-brand .brand-copy strong{
  display:block !important;
  font-size:.98rem !important;
  line-height:1.1 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

.header-brand .brand-copy small{
  display:block !important;
  margin-top:5px !important;
  max-width:260px !important;
  font-size:.62rem !important;
  line-height:1.25 !important;
  color:#8794ae !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

.premium-main-nav{
  min-width:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:3px !important;
  flex-wrap:nowrap !important;
}

.premium-main-nav>a,
.more-nav-btn,
.admin-top-link{
  height:40px !important;
  padding:0 9px !important;
  border-radius:10px !important;
  font-size:.69rem !important;
  white-space:nowrap !important;
}

.admin-top-link{
  display:inline-flex !important;
  align-items:center !important;
  gap:6px !important;
  color:#fff !important;
  text-decoration:none !important;
  background:
    linear-gradient(135deg,rgba(25,231,255,.10),rgba(155,99,255,.13),rgba(255,53,207,.11)) !important;
  border:1px solid rgba(25,231,255,.18) !important;
  box-shadow:0 0 16px rgba(25,231,255,.04) !important;
}

.admin-top-link:hover{
  border-color:rgba(255,53,207,.30) !important;
  background:
    linear-gradient(135deg,rgba(25,231,255,.15),rgba(155,99,255,.17),rgba(255,53,207,.15)) !important;
}

.admin-top-link .nav-icon{
  color:var(--pink) !important;
}

/* voorkom dat menu-item teksten tegen elkaar aanlopen */
.premium-main-nav>a span:last-child,
.more-nav-btn span:nth-child(2),
.admin-top-link span:last-child{
  line-height:1 !important;
}

/* brede laptop */
@media(max-width:1280px){
  .clean-header-wrap{
    grid-template-columns:minmax(235px,300px) minmax(0,1fr) !important;
    gap:18px !important;
  }

  .header-brand{
    grid-template-columns:56px minmax(0,1fr) !important;
  }

  .header-brand .brand-mark.brand-mark-image{
    width:56px !important;
    height:46px !important;
  }

  .header-brand .brand-copy small{
    max-width:210px !important;
    font-size:.58rem !important;
  }

  .premium-main-nav>a,
  .more-nav-btn,
  .admin-top-link{
    padding:0 7px !important;
    font-size:.65rem !important;
  }
}

/* compact laptop / tablet */
@media(max-width:1080px){
  .clean-header-wrap{
    grid-template-columns:220px minmax(0,1fr) !important;
  }

  .header-brand .brand-copy small{
    display:none !important;
  }

  .premium-main-nav>a span:not(.nav-icon),
  .more-nav-btn span:not(.nav-icon):not(.chev),
  .admin-top-link span:last-child{
    display:none !important;
  }

  .premium-main-nav>a,
  .more-nav-btn,
  .admin-top-link{
    width:38px !important;
    min-width:38px !important;
    padding:0 !important;
    justify-content:center !important;
  }

  .more-nav-btn .chev{
    display:none !important;
  }
}

/* mobiel */
@media(max-width:820px){
  .premium-header{
    min-height:auto !important;
  }

  .clean-header-wrap{
    grid-template-columns:1fr !important;
    gap:8px !important;
    min-height:auto !important;
    padding-top:10px !important;
    padding-bottom:10px !important;
  }

  .header-brand{
    max-width:100% !important;
    grid-template-columns:54px minmax(0,1fr) !important;
  }

  .header-brand .brand-copy small{
    display:block !important;
    max-width:230px !important;
    white-space:nowrap !important;
  }

  .premium-main-nav{
    justify-content:flex-start !important;
    overflow-x:auto !important;
    width:100% !important;
    padding-bottom:4px !important;
    scrollbar-width:none !important;
  }

  .premium-main-nav::-webkit-scrollbar{
    display:none !important;
  }

  .premium-main-nav>a,
  .more-nav-btn,
  .admin-top-link{
    flex:0 0 auto !important;
  }

  .admin-top-link span:last-child{
    display:inline !important;
  }

  .admin-top-link{
    width:auto !important;
    min-width:auto !important;
    padding:0 10px !important;
  }
}


/* V11.3 DJ PHOTO + LIVE PHOTO */
.hero-live-dj-photo{
  position:absolute;
  right:28px;
  top:20px;
  z-index:9;
  display:flex;
  align-items:center;
  gap:10px;
  padding:8px 11px;
  border-radius:14px;
  background:rgba(7,11,20,.88);
  border:1px solid rgba(255,255,255,.09);
  box-shadow:0 14px 32px rgba(0,0,0,.26),0 0 18px rgba(25,231,255,.06);
  backdrop-filter:blur(12px);
}
.hero-live-dj-photo img{
  width:54px!important;
  height:54px!important;
  object-fit:contain!important;
  object-position:center!important;
  border-radius:11px;
  background:#070b14;
}
.hero-live-dj-photo span,
.hero-live-dj-photo strong{
  display:block;
}
.hero-live-dj-photo span{
  color:var(--pink);
  font-size:.58rem;
  font-weight:900;
  letter-spacing:.12em;
}
.hero-live-dj-photo strong{
  margin-top:4px;
  font-family:Orbitron,sans-serif;
  font-size:.78rem;
  color:#fff;
}
.dj-photo-public{
  height:165px;
  background:#070b14;
  overflow:hidden;
}
.dj-photo-public img{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
}
@media(max-width:760px){
  .hero-live-dj-photo{
    right:12px;
    top:12px;
    padding:6px 8px;
  }
  .hero-live-dj-photo img{
    width:44px!important;
    height:44px!important;
  }
  .hero-live-dj-photo strong{font-size:.68rem}
}


/* =========================================================
   V11.4 PRO HEADER / DJ BUTTON / WHOLE SITE POLISH
   ========================================================= */

.dj-top-link,
.admin-top-link{
  height:40px !important;
  display:inline-flex !important;
  align-items:center !important;
  gap:6px !important;
  padding:0 10px !important;
  border-radius:10px !important;
  color:#fff !important;
  text-decoration:none !important;
  white-space:nowrap !important;
  font-size:.68rem !important;
  font-weight:850 !important;
  border:1px solid rgba(255,255,255,.08) !important;
  transition:.18s ease !important;
}

.dj-top-link{
  background:linear-gradient(135deg,rgba(25,231,255,.10),rgba(91,116,255,.13)) !important;
  border-color:rgba(25,231,255,.18) !important;
}

.admin-top-link{
  background:linear-gradient(135deg,rgba(155,99,255,.12),rgba(255,53,207,.12)) !important;
  border-color:rgba(255,53,207,.18) !important;
}

.dj-top-link:hover,
.admin-top-link:hover{
  transform:translateY(-1px);
  border-color:rgba(255,255,255,.18) !important;
  box-shadow:0 8px 22px rgba(0,0,0,.18);
}

.dj-top-link .nav-icon{color:var(--cyan)!important}
.admin-top-link .nav-icon{color:var(--pink)!important}

/* Consistent pro cards */
.pro-panel,
.news-card,
.highlight-card,
.event-card,
.program-big-card,
.dj-card,
.artist-card,
.compact-action-card,
.studio-gallery-card,
.compact-media-grid article,
.today-news-row,
.nonstop-request-info,
.nonstop-request-frame{
  background:
    linear-gradient(180deg,color-mix(in srgb,var(--rsj-surface) 94%,#ffffff 2%),var(--rsj-surface)) !important;
  border:1px solid color-mix(in srgb,var(--cyan) 14%,rgba(255,255,255,.06)) !important;
  box-shadow:0 16px 38px rgba(0,0,0,.17),0 0 15px color-mix(in srgb,var(--cyan) 5%,transparent) !important;
}

/* Strakkere pagina hero's */
.page-hero,
.micro-hero{
  border-bottom:1px solid rgba(255,255,255,.05);
  box-shadow:inset 0 -1px 0 rgba(25,231,255,.03);
}

/* Tablet: account buttons compact */
@media(max-width:1180px){
  .dj-top-link,
  .admin-top-link{
    width:38px !important;
    min-width:38px !important;
    padding:0 !important;
    justify-content:center !important;
  }
  .dj-top-link span:last-child,
  .admin-top-link span:last-child{
    display:none !important;
  }
}

/* Mobile keeps labels because login destination matters */
@media(max-width:820px){
  .dj-top-link,
  .admin-top-link{
    width:auto !important;
    min-width:auto !important;
    padding:0 9px !important;
  }
  .dj-top-link span:last-child,
  .admin-top-link span:last-child{
    display:inline !important;
  }
}


/* =========================================================
   V11.5 HEADER RESPONSIVE REBUILD
   Desktop / Tablet / Mobiel apart
   ========================================================= */

.premium-header{
  background:rgba(4,8,15,.97)!important;
  border-bottom:1px solid rgba(255,255,255,.055)!important;
}

.header-layout-v115{
  min-height:82px!important;
  display:grid!important;
  grid-template-columns:300px minmax(0,1fr) auto!important;
  gap:22px!important;
  align-items:center!important;
  padding-top:0!important;
  padding-bottom:0!important;
}

/* BRAND ZONE */
.header-layout-v115 .header-brand{
  min-width:0!important;
  max-width:300px!important;
  display:grid!important;
  grid-template-columns:58px minmax(0,1fr)!important;
  gap:12px!important;
  align-items:center!important;
}

.header-layout-v115 .header-brand .brand-mark{
  width:58px!important;
  height:50px!important;
  border-radius:12px!important;
}

.header-layout-v115 .brand-copy{
  min-width:0!important;
  overflow:hidden!important;
}

.header-layout-v115 .brand-copy strong{
  display:block!important;
  font-size:.95rem!important;
  line-height:1.05!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

.header-layout-v115 .brand-copy small{
  display:block!important;
  margin-top:5px!important;
  max-width:220px!important;
  font-size:.59rem!important;
  line-height:1.2!important;
  color:#8591aa!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

/* NAV ZONE */
.header-nav-zone{
  min-width:0;
  display:flex;
  justify-content:center;
}

.header-layout-v115 .premium-main-nav{
  width:100%;
  min-width:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:2px!important;
  flex-wrap:nowrap!important;
}

.header-layout-v115 .premium-main-nav>a,
.header-layout-v115 .more-nav-btn{
  height:38px!important;
  min-height:38px!important;
  padding:0 8px!important;
  border-radius:9px!important;
  font-size:.65rem!important;
  line-height:1!important;
  gap:5px!important;
}

.header-layout-v115 .nav-icon{
  font-size:.62rem!important;
}

/* ACCOUNT ZONE */
.header-account-zone{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:7px;
  white-space:nowrap;
}

.header-account-zone .dj-top-link,
.header-account-zone .admin-top-link{
  height:38px!important;
  min-height:38px!important;
  padding:0 10px!important;
  font-size:.65rem!important;
  border-radius:10px!important;
}

/* WIDE DESKTOP */
@media(min-width:1450px){
  .header-layout-v115{
    grid-template-columns:320px minmax(0,1fr) auto!important;
    gap:26px!important;
  }

  .header-layout-v115 .premium-main-nav>a,
  .header-layout-v115 .more-nav-btn{
    padding:0 10px!important;
    font-size:.68rem!important;
  }
}

/* NORMAL DESKTOP / SMALL LAPTOP */
@media(max-width:1280px){
  .header-layout-v115{
    grid-template-columns:250px minmax(0,1fr) auto!important;
    gap:14px!important;
  }

  .header-layout-v115 .header-brand{
    max-width:250px!important;
    grid-template-columns:52px minmax(0,1fr)!important;
    gap:9px!important;
  }

  .header-layout-v115 .header-brand .brand-mark{
    width:52px!important;
    height:44px!important;
  }

  .header-layout-v115 .brand-copy small{
    max-width:175px!important;
    font-size:.54rem!important;
  }

  .header-layout-v115 .premium-main-nav>a,
  .header-layout-v115 .more-nav-btn{
    padding:0 6px!important;
    font-size:.61rem!important;
  }

  .header-account-zone .dj-top-link,
  .header-account-zone .admin-top-link{
    padding:0 8px!important;
    font-size:.61rem!important;
  }
}

/* TABLET LANDSCAPE */
@media(max-width:1080px){
  .header-layout-v115{
    grid-template-columns:210px minmax(0,1fr) auto!important;
    gap:10px!important;
  }

  .header-layout-v115 .brand-copy small{
    display:none!important;
  }

  .header-layout-v115 .premium-main-nav>a span:not(.nav-icon),
  .header-layout-v115 .more-nav-btn span:not(.nav-icon):not(.chev){
    display:none!important;
  }

  .header-layout-v115 .premium-main-nav>a,
  .header-layout-v115 .more-nav-btn{
    width:36px!important;
    min-width:36px!important;
    padding:0!important;
    justify-content:center!important;
  }

  .header-layout-v115 .more-nav-btn .chev{
    display:none!important;
  }

  .header-account-zone .dj-top-link,
  .header-account-zone .admin-top-link{
    width:38px!important;
    min-width:38px!important;
    padding:0!important;
    justify-content:center!important;
  }

  .header-account-zone .dj-top-link span:last-child,
  .header-account-zone .admin-top-link span:last-child{
    display:none!important;
  }
}

/* TABLET PORTRAIT + MOBILE */
@media(max-width:820px){
  .premium-header{
    position:sticky!important;
    top:0!important;
    z-index:170!important;
  }

  .header-layout-v115{
    min-height:auto!important;
    grid-template-columns:1fr auto!important;
    grid-template-areas:
      "brand accounts"
      "nav nav"!important;
    gap:8px 10px!important;
    padding-top:9px!important;
    padding-bottom:8px!important;
  }

  .header-layout-v115 .header-brand{
    grid-area:brand;
    max-width:100%!important;
    grid-template-columns:48px minmax(0,1fr)!important;
  }

  .header-layout-v115 .header-brand .brand-mark{
    width:48px!important;
    height:42px!important;
  }

  .header-layout-v115 .brand-copy strong{
    font-size:.86rem!important;
  }

  .header-layout-v115 .brand-copy small{
    display:block!important;
    max-width:205px!important;
    font-size:.53rem!important;
  }

  .header-account-zone{
    grid-area:accounts;
    gap:6px;
  }

  .header-account-zone .dj-top-link,
  .header-account-zone .admin-top-link{
    width:auto!important;
    min-width:auto!important;
    padding:0 9px!important;
  }

  .header-account-zone .dj-top-link span:last-child,
  .header-account-zone .admin-top-link span:last-child{
    display:inline!important;
  }

  .header-nav-zone{
    grid-area:nav;
    width:100%;
    min-width:0;
    overflow:hidden;
  }

  .header-layout-v115 .premium-main-nav{
    justify-content:flex-start!important;
    overflow-x:auto!important;
    width:100%!important;
    gap:4px!important;
    padding-bottom:3px!important;
    scrollbar-width:none!important;
  }

  .header-layout-v115 .premium-main-nav::-webkit-scrollbar{
    display:none!important;
  }

  .header-layout-v115 .premium-main-nav>a,
  .header-layout-v115 .more-nav-btn{
    width:auto!important;
    min-width:auto!important;
    flex:0 0 auto!important;
    padding:0 9px!important;
  }

  .header-layout-v115 .premium-main-nav>a span:not(.nav-icon),
  .header-layout-v115 .more-nav-btn span:not(.nav-icon):not(.chev){
    display:inline!important;
  }

  .header-layout-v115 .more-nav-btn .chev{
    display:inline!important;
  }

  .more-nav-menu{
    position:fixed!important;
    left:12px!important;
    right:12px!important;
    top:116px!important;
    min-width:0!important;
    max-height:60vh!important;
    overflow:auto!important;
  }
}

/* SMALL PHONE */
@media(max-width:520px){
  .header-layout-v115{
    grid-template-columns:minmax(0,1fr) auto!important;
  }

  .header-layout-v115 .brand-copy small{
    display:none!important;
  }

  .header-account-zone .dj-top-link span:last-child,
  .header-account-zone .admin-top-link span:last-child{
    display:none!important;
  }

  .header-account-zone .dj-top-link,
  .header-account-zone .admin-top-link{
    width:38px!important;
    min-width:38px!important;
    padding:0!important;
    justify-content:center!important;
  }

  .header-layout-v115 .premium-main-nav>a,
  .header-layout-v115 .more-nav-btn{
    padding:0 8px!important;
    font-size:.62rem!important;
  }
}


/* =========================================================
   V11.7 MOBILE MENU FREEZE FIX
   ========================================================= */

.mobile-menu-toggle{
  display:none;
  width:46px;
  height:42px;
  border-radius:11px;
  border:1px solid rgba(25,231,255,.18);
  background:linear-gradient(145deg,rgba(9,16,28,.96),rgba(16,10,25,.96));
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:5px;
  cursor:pointer;
  z-index:190;
}

.mobile-menu-toggle span{
  width:19px;
  height:2px;
  border-radius:3px;
  background:linear-gradient(90deg,var(--cyan),var(--pink));
  transition:.2s ease;
}

.mobile-menu-toggle.is-open span:nth-child(1){
  transform:translateY(7px) rotate(45deg);
}
.mobile-menu-toggle.is-open span:nth-child(2){
  opacity:0;
}
.mobile-menu-toggle.is-open span:nth-child(3){
  transform:translateY(-7px) rotate(-45deg);
}

.mobile-nav-drawer{
  display:contents;
}

@media(max-width:820px){
  body.mobile-menu-open{
    overflow:hidden !important;
    touch-action:none;
  }

  .header-layout-v115{
    grid-template-columns:minmax(0,1fr) auto auto !important;
    grid-template-areas:"brand toggle accounts" !important;
    align-items:center !important;
  }

  .mobile-menu-toggle{
    display:flex !important;
    grid-area:toggle;
  }

  .header-account-zone{
    grid-area:accounts;
  }

  .mobile-nav-drawer{
    position:fixed !important;
    top:0 !important;
    right:0 !important;
    width:min(86vw,360px) !important;
    height:100dvh !important;
    max-height:100dvh !important;
    display:flex !important;
    flex-direction:column !important;
    background:
      linear-gradient(180deg,rgba(8,13,24,.995),rgba(10,14,26,.995)) !important;
    border-left:1px solid rgba(25,231,255,.13) !important;
    box-shadow:-24px 0 50px rgba(0,0,0,.45) !important;
    transform:translateX(105%) !important;
    opacity:0 !important;
    visibility:hidden !important;
    pointer-events:none !important;
    transition:transform .24s ease,opacity .2s ease,visibility .2s ease !important;
    z-index:180 !important;
    padding:96px 18px 24px !important;
    overflow-y:auto !important;
    overscroll-behavior:contain !important;
    -webkit-overflow-scrolling:touch !important;
  }

  .mobile-nav-drawer::before{
    content:"";
    position:fixed;
    inset:0;
    right:min(86vw,360px);
    background:rgba(0,0,0,.56);
    opacity:0;
    pointer-events:none;
    transition:.2s ease;
  }

  .mobile-nav-drawer.is-open{
    transform:translateX(0) !important;
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
  }

  .mobile-nav-drawer.is-open::before{
    opacity:1;
    pointer-events:auto;
  }

  .mobile-nav-drawer .header-nav-zone{
    width:100% !important;
    overflow:visible !important;
    display:block !important;
  }

  .mobile-nav-drawer .premium-main-nav{
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    justify-content:flex-start !important;
    gap:6px !important;
    width:100% !important;
    overflow:visible !important;
    padding:0 !important;
  }

  .mobile-nav-drawer .premium-main-nav>a,
  .mobile-nav-drawer .more-nav-btn{
    width:100% !important;
    min-width:0 !important;
    height:48px !important;
    padding:0 14px !important;
    justify-content:flex-start !important;
    font-size:.82rem !important;
    border-radius:11px !important;
  }

  .mobile-nav-drawer .premium-main-nav>a span:not(.nav-icon),
  .mobile-nav-drawer .more-nav-btn span:not(.nav-icon):not(.chev){
    display:inline !important;
  }

  .mobile-nav-drawer .more-nav{
    width:100% !important;
  }

  .mobile-nav-drawer .more-nav-menu{
    position:static !important;
    inset:auto !important;
    width:100% !important;
    min-width:0 !important;
    margin-top:6px !important;
    opacity:1 !important;
    visibility:visible !important;
    transform:none !important;
    display:grid !important;
    gap:3px !important;
    padding:7px !important;
    background:rgba(255,255,255,.02) !important;
    border:1px solid rgba(255,255,255,.04) !important;
    box-shadow:none !important;
  }

  .mobile-nav-drawer .more-nav-menu::before{
    display:none !important;
  }

  .mobile-nav-drawer .more-nav-menu a{
    min-height:40px !important;
  }

  .mobile-nav-drawer .header-account-zone{
    display:none !important;
  }
}

/* op desktop/tablet-landscape blijft normale header actief */
@media(min-width:821px){
  .mobile-menu-toggle{
    display:none !important;
  }
  .mobile-nav-drawer{
    display:contents !important;
  }
}


/* =========================================================
   V11.8 ECHTE MOBILE DRAWER FIX
   Dit blok overschrijft alle oudere mobiele menu-regels.
   ========================================================= */

.mobile-drawer-head,
.mobile-menu-backdrop{
  display:none;
}

@media(max-width:820px){

  /* Site mag alleen blokkeren als het menu ECHT open staat */
  body:not(.mobile-menu-open){
    overflow-x:hidden !important;
    overflow-y:auto !important;
    touch-action:auto !important;
  }

  body.mobile-menu-open{
    overflow:hidden !important;
    touch-action:none !important;
  }

  /* Header blijft normaal zichtbaar */
  .header-layout-v115{
    grid-template-columns:minmax(0,1fr) auto auto !important;
    grid-template-areas:"brand toggle accounts" !important;
  }

  /* Het echte navigatieblok is de drawer */
  .header-layout-v115 .header-nav-zone.mobile-nav-drawer{
    position:fixed !important;
    display:block !important;
    top:0 !important;
    right:0 !important;
    bottom:0 !important;
    left:auto !important;
    width:min(86vw,360px) !important;
    height:100vh !important;
    height:100dvh !important;
    max-height:100dvh !important;
    margin:0 !important;
    padding:0 18px 26px !important;
    overflow-x:hidden !important;
    overflow-y:auto !important;
    background:linear-gradient(180deg,#080d18 0%,#0a0f1c 100%) !important;
    border-left:1px solid rgba(25,231,255,.14) !important;
    box-shadow:-28px 0 58px rgba(0,0,0,.50) !important;
    z-index:260 !important;

    /* ABSOLUUT DICHT BIJ INLADEN */
    transform:translate3d(110%,0,0) !important;
    opacity:0 !important;
    visibility:hidden !important;
    pointer-events:none !important;

    transition:
      transform .24s cubic-bezier(.22,.8,.25,1),
      opacity .18s ease,
      visibility 0s linear .24s !important;
    will-change:transform;
  }

  .header-layout-v115 .header-nav-zone.mobile-nav-drawer.is-open{
    transform:translate3d(0,0,0) !important;
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
    transition:
      transform .24s cubic-bezier(.22,.8,.25,1),
      opacity .18s ease,
      visibility 0s linear 0s !important;
  }

  .mobile-drawer-head{
    position:sticky;
    top:0;
    z-index:3;
    min-height:82px;
    margin:0 -18px 14px;
    padding:14px 16px;
    display:flex !important;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    background:rgba(8,13,24,.98);
    border-bottom:1px solid rgba(255,255,255,.06);
    backdrop-filter:blur(14px);
  }

  .mobile-drawer-head span,
  .mobile-drawer-head strong{
    display:block;
  }

  .mobile-drawer-head span{
    color:var(--cyan);
    font-size:.58rem;
    font-weight:900;
    letter-spacing:.14em;
  }

  .mobile-drawer-head strong{
    margin-top:4px;
    font-family:Orbitron,sans-serif;
    font-size:.86rem;
  }

  #mobileDrawerClose{
    width:40px;
    height:40px;
    border-radius:10px;
    border:1px solid rgba(255,53,207,.18);
    background:rgba(255,53,207,.07);
    color:#fff;
    font-size:1.45rem;
    line-height:1;
  }

  .mobile-menu-backdrop{
    position:fixed !important;
    inset:0 !important;
    z-index:250 !important;
    display:block !important;
    background:rgba(0,0,0,.58) !important;
    opacity:0 !important;
    visibility:hidden !important;
    pointer-events:none !important;
    transition:opacity .18s ease,visibility 0s linear .18s !important;
  }

  .mobile-menu-backdrop.is-open{
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
    transition:opacity .18s ease,visibility 0s linear 0s !important;
  }

  .header-layout-v115 .mobile-nav-drawer .premium-main-nav{
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    justify-content:flex-start !important;
    width:100% !important;
    gap:5px !important;
    padding:0 !important;
    overflow:visible !important;
  }

  .header-layout-v115 .mobile-nav-drawer .premium-main-nav>a,
  .header-layout-v115 .mobile-nav-drawer .more-nav-btn{
    width:100% !important;
    min-width:0 !important;
    height:47px !important;
    padding:0 13px !important;
    justify-content:flex-start !important;
    gap:10px !important;
    border-radius:11px !important;
    font-size:.80rem !important;
    flex:0 0 auto !important;
  }

  .header-layout-v115 .mobile-nav-drawer .premium-main-nav>a span:not(.nav-icon),
  .header-layout-v115 .mobile-nav-drawer .more-nav-btn span:not(.nav-icon):not(.chev){
    display:inline !important;
  }

  .header-layout-v115 .mobile-nav-drawer .more-nav{
    width:100% !important;
  }

  .header-layout-v115 .mobile-nav-drawer .more-nav-menu{
    position:static !important;
    display:grid !important;
    width:100% !important;
    min-width:0 !important;
    max-height:none !important;
    margin:5px 0 0 !important;
    padding:6px !important;
    gap:2px !important;
    opacity:1 !important;
    visibility:visible !important;
    transform:none !important;
    background:rgba(255,255,255,.022) !important;
    border:1px solid rgba(255,255,255,.045) !important;
    box-shadow:none !important;
  }

  .header-layout-v115 .mobile-nav-drawer .more-nav-menu::before{
    display:none !important;
  }

  /* Accounts blijven gewoon bovenaan in header, niet in drawer */
  .header-account-zone{
    grid-area:accounts !important;
    display:flex !important;
  }

  .mobile-menu-toggle{
    grid-area:toggle !important;
    display:flex !important;
    position:relative !important;
    z-index:270 !important;
  }
}

@media(min-width:821px){
  .mobile-menu-backdrop,
  .mobile-drawer-head{
    display:none !important;
  }

  .header-layout-v115 .header-nav-zone.mobile-nav-drawer{
    display:flex !important;
    position:static !important;
    width:auto !important;
    height:auto !important;
    max-height:none !important;
    padding:0 !important;
    overflow:visible !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    transform:none !important;
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
  }
}

/* =========================================================
   V12.0 STRAK-IN-PAK — WHOLE SITE DENSITY + AUDIO HERO FX
   Eén consistente eindlaag voor alle publieke pagina's.
   ========================================================= */

:root{
  --page-max:1360px;
  --page-gap:18px;
  --card-radius:18px;
  --bass-level:.03;
  --beat-level:.06;
}

/* Breder en voller, maar nog steeds rustig leesbaar */
.container{
  width:min(var(--page-max),calc(100% - 40px)) !important;
}

main{
  position:relative;
  z-index:1;
}

main > .section,
main > .compact-page-section,
main > .birthday-spotlight-section,
main > .artist-upcoming-home,
main > .compact-dashboard-section,
main > .quick-nav-section{
  padding-top:54px !important;
  padding-bottom:54px !important;
}

/* Algemene secties voelen als één professioneel systeem */
.section > .container,
.compact-page-section > .container,
.birthday-spotlight-section > .container,
.artist-upcoming-home > .container,
.compact-dashboard-section > .container,
.quick-nav-section > .container{
  position:relative;
}

.section > .container::before,
.compact-page-section > .container::before{
  content:"";
  position:absolute;
  top:-14px;
  left:0;
  width:64px;
  height:2px;
  border-radius:99px;
  background:linear-gradient(90deg,var(--cyan),var(--violet),var(--pink));
  opacity:.72;
  pointer-events:none;
}

/* Alle hoofdkaarten dezelfde afwerking */
.pro-panel,
.news-card,
.highlight-card,
.event-card,
.program-big-card,
.dj-card,
.artist-card,
.compact-action-card,
.studio-gallery-card,
.compact-media-grid article,
.today-news-row,
.nonstop-request-info,
.nonstop-request-frame,
.request-form-pro,
.contact-panel,
.radio-info-card,
.schedule-row,
.history-item,
.quick-nav-grid > a,
.chat-features-grid > *,
.chat-launch-box,
.playlist-now{
  border-radius:var(--card-radius) !important;
  overflow:hidden;
}

.pro-panel,
.news-card,
.highlight-card,
.event-card,
.program-big-card,
.dj-card,
.artist-card,
.compact-action-card,
.studio-gallery-card,
.compact-media-grid article,
.today-news-row,
.nonstop-request-info,
.nonstop-request-frame,
.request-form-pro,
.contact-panel,
.radio-info-card,
.schedule-row,
.history-item,
.chat-features-grid > *,
.chat-launch-box,
.playlist-now{
  position:relative;
  background:
    linear-gradient(145deg,rgba(255,255,255,.035),transparent 36%),
    linear-gradient(180deg,color-mix(in srgb,var(--rsj-surface) 96%,#ffffff 2%),color-mix(in srgb,var(--rsj-surface) 92%,#000 8%)) !important;
  border:1px solid color-mix(in srgb,var(--cyan) 13%,rgba(255,255,255,.07)) !important;
  box-shadow:0 16px 40px rgba(0,0,0,.20),inset 0 1px 0 rgba(255,255,255,.035) !important;
}

.pro-panel::after,
.news-card::after,
.highlight-card::after,
.event-card::after,
.program-big-card::after,
.dj-card::after,
.artist-card::after,
.compact-action-card::after,
.studio-gallery-card::after,
.compact-media-grid article::after,
.today-news-row::after,
.request-form-pro::after,
.contact-panel::after{
  content:"";
  position:absolute;
  inset:0 auto auto 0;
  width:100%;
  height:1px;
  background:linear-gradient(90deg,transparent,var(--cyan),var(--violet),var(--pink),transparent);
  opacity:.28;
  pointer-events:none;
}

/* Paginabanners compacter + voller */
.page-hero,
.page-hero.slim,
.page-hero.micro-hero{
  min-height:210px !important;
  padding:46px 0 42px !important;
  display:flex;
  align-items:center;
  background:
    radial-gradient(circle at 14% 15%,color-mix(in srgb,var(--cyan) 13%,transparent),transparent 34%),
    radial-gradient(circle at 86% 30%,color-mix(in srgb,var(--pink) 10%,transparent),transparent 30%),
    linear-gradient(120deg,#0d1421,#070b13 58%,#0c101b) !important;
}

.page-hero h1,
.page-hero.slim h1,
.page-hero.micro-hero h1{
  font-size:clamp(2.2rem,5vw,4.3rem) !important;
  line-height:.98 !important;
  margin:8px 0 10px !important;
}

.page-hero p{
  margin:0;
  max-width:820px;
  line-height:1.65;
}

/* Dichtheid en ruimtevulling over alle grids */
.compact-dashboard-grid,
.quick-nav-grid,
.program-card-grid,
.dj-grid,
.news-grid,
.highlight-grid,
.values-grid,
.studio-gallery-grid,
.compact-media-grid,
.action-compact-grid,
.artist-grid,
.history-list{
  gap:var(--page-gap) !important;
}

.compact-dashboard-grid{
  grid-template-columns:1.05fr .8fr 1.15fr !important;
}

.quick-nav-grid{
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
}

.quick-nav-grid > a{
  min-height:128px;
  padding:22px !important;
  background:linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.018)) !important;
  border:1px solid rgba(255,255,255,.07) !important;
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.quick-nav-grid > a:hover{
  transform:translateY(-3px);
  border-color:color-mix(in srgb,var(--cyan) 32%,rgba(255,255,255,.08)) !important;
  box-shadow:0 14px 30px rgba(0,0,0,.22),0 0 24px color-mix(in srgb,var(--cyan) 7%,transparent);
}

.program-card-grid,
.dj-grid,
.artist-grid,
.news-grid,
.highlight-grid,
.compact-media-grid,
.studio-gallery-grid{
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
}

.values-grid,
.action-compact-grid{
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
}

/* Twee-koloms pagina's benutten de breedte beter */
.player-layout,
.request-system-grid,
.chat-layout,
.about-layout,
.contact-page-grid,
.today-news-layout,
.nonstop-request-layout,
.artist-layout,
.compact-two-col{
  gap:24px !important;
}

.player-layout{grid-template-columns:minmax(0,1.35fr) minmax(320px,.65fr) !important;}
.request-system-grid{grid-template-columns:minmax(0,1.06fr) minmax(320px,.94fr) !important;}
.chat-layout{grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr) !important;}
.about-layout{grid-template-columns:minmax(300px,.72fr) minmax(0,1.28fr) !important;}
.contact-page-grid{grid-template-columns:minmax(300px,.72fr) minmax(0,1.28fr) !important;}
.today-news-layout{grid-template-columns:minmax(0,1.4fr) minmax(300px,.6fr) !important;}
.nonstop-request-layout{grid-template-columns:minmax(300px,.7fr) minmax(0,1.3fr) !important;}
.compact-two-col{grid-template-columns:minmax(300px,.75fr) minmax(0,1.25fr) !important;}

/* Lijsten minder iel */
.schedule-row,
.chart-row,
.today-news-row{
  min-height:92px;
}

.history-item{
  min-height:82px;
  padding:14px !important;
}

/* ================================================
   HOME HERO — PLAYER-GESTUURDE VISUALS IN SITEKLEUR
   ================================================ */
.rsj-live-hero.clean-station-hero{
  isolation:isolate;
  min-height:clamp(420px,52vw,620px) !important;
  overflow:hidden;
  border-bottom:1px solid rgba(255,255,255,.07);
  box-shadow:inset 0 -60px 90px rgba(3,7,14,.50);
}

.rsj-live-hero .rsj-live-bg{
  transform:scale(1.015);
  filter:saturate(1.05) contrast(1.04) brightness(.78);
}

.rsj-live-overlay{
  background:
    linear-gradient(90deg,rgba(5,10,18,.88),rgba(5,10,18,.40) 45%,rgba(5,10,18,.74)),
    linear-gradient(0deg,rgba(5,8,15,.90),transparent 48%,rgba(5,8,15,.25)) !important;
}

.hero-audio-fx{
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  overflow:hidden;
}

.hero-audio-fx::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 18% 50%,color-mix(in srgb,var(--cyan) calc(6% + var(--bass-level)*12%),transparent),transparent 25%),
    radial-gradient(circle at 82% 50%,color-mix(in srgb,var(--pink) calc(5% + var(--bass-level)*10%),transparent),transparent 25%);
  opacity:.9;
  transition:opacity .12s linear;
}

.hero-spectrum{
  position:absolute;
  bottom:0;
  width:34%;
  height:42%;
  display:flex;
  gap:clamp(3px,.5vw,8px);
  align-items:flex-end;
  opacity:.35;
  filter:drop-shadow(0 0 10px color-mix(in srgb,var(--cyan) 28%,transparent));
  mask-image:linear-gradient(to top,#000 30%,transparent 100%);
}
.hero-spectrum-left{left:0;justify-content:flex-start;padding-left:3%;}
.hero-spectrum-right{right:0;justify-content:flex-end;padding-right:3%;transform:scaleX(-1);}
.hero-spectrum i{
  display:block;
  flex:1 1 0;
  max-width:14px;
  min-width:4px;
  height:calc(10% + var(--bass-level) * 62%);
  border-radius:8px 8px 0 0;
  transform-origin:bottom;
  background:linear-gradient(to top,var(--cyan),var(--violet) 58%,var(--pink));
  transition:height .09s linear,opacity .2s ease;
}
.hero-spectrum i:nth-child(2n){height:calc(18% + var(--bass-level) * 42%);}
.hero-spectrum i:nth-child(3n){height:calc(8% + var(--bass-level) * 72%);}
.hero-spectrum i:nth-child(4n){height:calc(24% + var(--bass-level) * 32%);}

.audio-playing .hero-spectrum i{
  animation:heroEq .62s ease-in-out infinite alternate;
}
.audio-playing .hero-spectrum i:nth-child(2n){animation-duration:.46s;animation-delay:-.12s;}
.audio-playing .hero-spectrum i:nth-child(3n){animation-duration:.73s;animation-delay:-.26s;}
.audio-playing .hero-spectrum i:nth-child(4n){animation-duration:.54s;animation-delay:-.18s;}
@keyframes heroEq{
  from{transform:scaleY(.52 + var(--bass-level));opacity:.52;}
  to{transform:scaleY(1.02);opacity:.95;}
}

.hero-sound-ring{
  position:absolute;
  width:180px;
  aspect-ratio:1;
  border:1px solid color-mix(in srgb,var(--cyan) 32%,transparent);
  border-radius:50%;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%) scale(calc(.75 + var(--bass-level)*.34));
  opacity:calc(.08 + var(--bass-level)*.18);
  box-shadow:0 0 28px color-mix(in srgb,var(--cyan) 10%,transparent),inset 0 0 20px color-mix(in srgb,var(--violet) 8%,transparent);
}
.hero-sound-ring.ring-two{width:300px;border-color:color-mix(in srgb,var(--violet) 25%,transparent);}
.hero-sound-ring.ring-three{width:440px;border-color:color-mix(in srgb,var(--pink) 19%,transparent);}
.audio-playing .hero-sound-ring{animation:ringPulse 1.75s ease-out infinite;}
.audio-playing .hero-sound-ring.ring-two{animation-delay:.38s;}
.audio-playing .hero-sound-ring.ring-three{animation-delay:.76s;}
@keyframes ringPulse{
  0%{transform:translate(-50%,-50%) scale(.72);opacity:.25;}
  100%{transform:translate(-50%,-50%) scale(1.22);opacity:0;}
}

.hero-scanline{
  position:absolute;
  left:-10%;
  right:-10%;
  top:50%;
  height:1px;
  background:linear-gradient(90deg,transparent,var(--cyan),var(--violet),var(--pink),transparent);
  opacity:.12;
  box-shadow:0 0 16px color-mix(in srgb,var(--cyan) 18%,transparent);
}
.audio-playing .hero-scanline{animation:scanDrift 4.8s ease-in-out infinite alternate;}
@keyframes scanDrift{from{transform:translateY(-60px)}to{transform:translateY(70px)}}

.banner-speaker-visual{
  z-index:2 !important;
  filter:drop-shadow(0 18px 35px rgba(0,0,0,.45));
  transform:scale(calc(.98 + var(--bass-level)*.055));
  transition:transform .08s linear,filter .12s ease;
}
.audio-playing .banner-speaker-visual{
  filter:
    drop-shadow(0 18px 35px rgba(0,0,0,.45))
    drop-shadow(0 0 calc(8px + var(--bass-level)*16px) color-mix(in srgb,var(--cyan) 20%,transparent));
}

.hero-banner-ui,
.hero-live-dj-photo{
  z-index:4 !important;
}

.hero-banner-panel{
  width:min(760px,calc(100vw - 48px)) !important;
  padding:18px 20px !important;
  border-radius:18px !important;
  background:linear-gradient(135deg,rgba(8,14,25,.74),rgba(13,16,30,.60)) !important;
  border:1px solid rgba(255,255,255,.10) !important;
  backdrop-filter:blur(16px) saturate(135%);
  box-shadow:0 20px 50px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.04);
}

.hero-banner-buttons{
  gap:10px !important;
}
.hero-banner-buttons .btn{
  min-height:46px;
  padding:0 18px !important;
  border-radius:12px !important;
}

/* Footer ook voller, zelfde gridritme */
.premium-footer-grid{
  grid-template-columns:1.45fr repeat(3,minmax(150px,.55fr)) !important;
  gap:28px !important;
}

@media(max-width:1120px){
  .program-card-grid,.dj-grid,.artist-grid,.news-grid,.highlight-grid,.compact-media-grid,.studio-gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  .quick-nav-grid{grid-template-columns:repeat(4,minmax(0,1fr)) !important;}
  .compact-dashboard-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  .compact-dashboard-grid > :last-child{grid-column:1/-1;}
}

@media(max-width:820px){
  .container{width:min(100% - 24px,var(--page-max)) !important;}
  main > .section,main > .compact-page-section,main > .birthday-spotlight-section,main > .artist-upcoming-home,main > .compact-dashboard-section,main > .quick-nav-section{padding-top:38px !important;padding-bottom:38px !important;}
  .page-hero,.page-hero.slim,.page-hero.micro-hero{min-height:180px !important;padding:34px 0 30px !important;}
  .player-layout,.request-system-grid,.chat-layout,.about-layout,.contact-page-grid,.today-news-layout,.nonstop-request-layout,.artist-layout,.compact-two-col{grid-template-columns:1fr !important;}
  .quick-nav-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  .values-grid,.action-compact-grid,.compact-dashboard-grid{grid-template-columns:1fr !important;}
  .compact-dashboard-grid > :last-child{grid-column:auto;}
  .premium-footer-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  .rsj-live-hero.clean-station-hero{min-height:460px !important;}
  .hero-spectrum{width:44%;height:34%;opacity:.23;}
  .hero-sound-ring.ring-three{width:330px;}
  .hero-banner-panel{width:calc(100vw - 24px) !important;padding:14px !important;}
  .hero-banner-buttons{display:grid !important;grid-template-columns:1fr 1fr;}
  .hero-banner-buttons .btn-chat{grid-column:1/-1;}
}

@media(max-width:560px){
  .program-card-grid,.dj-grid,.artist-grid,.news-grid,.highlight-grid,.compact-media-grid,.studio-gallery-grid,.history-list{grid-template-columns:1fr !important;}
  .quick-nav-grid{grid-template-columns:1fr 1fr !important;gap:10px !important;}
  .quick-nav-grid > a{min-height:112px;padding:17px !important;}
  .premium-footer-grid{grid-template-columns:1fr !important;}
  .hero-spectrum{display:none;}
  .hero-banner-buttons{grid-template-columns:1fr !important;}
  .hero-banner-buttons .btn-chat{grid-column:auto;}
}

/* =========================================================
   V12.1 HERO SMALLER + ONDERBALK STRAKKER INGEDEELD
   ========================================================= */

/* Hoofdbanner compacter maken zonder rommelig te worden */
.rsj-live-hero.clean-station-hero{
  min-height:clamp(340px,34vw,455px) !important;
  padding:48px 0 24px !important;
}

.clean-station-hero .rsj-live-bg{
  background-position:center center !important;
  filter:saturate(1.05) contrast(1.04) brightness(.76) !important;
}

.clean-station-hero .hero-banner-ui{
  bottom:14px !important;
  padding:0 18px !important;
}

.hero-banner-panel{
  width:min(930px,calc(100vw - 52px)) !important;
  display:grid !important;
  grid-template-columns:minmax(250px,1fr) minmax(360px,460px) !important;
  align-items:center !important;
  gap:14px !important;
  padding:14px 16px !important;
  border-radius:18px !important;
}

.hero-banner-status{
  min-height:52px !important;
  padding:12px 14px !important;
  border-radius:14px !important;
}

.hero-banner-status strong{
  font-size:.9rem !important;
}

.hero-banner-buttons{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:10px !important;
  width:100% !important;
  justify-content:stretch !important;
}

.hero-banner-buttons .btn{
  width:100% !important;
  min-height:44px !important;
  padding:0 14px !important;
  font-size:.78rem !important;
}

.hero-banner-buttons .btn-chat{
  grid-column:1 / -1 !important;
}

/* Onderste playerbar netter indelen */
body{
  padding-bottom:118px !important;
}

.radio-bar{
  left:14px !important;
  right:14px !important;
  bottom:12px !important;
  min-height:92px !important;
  border-radius:20px !important;
  background:linear-gradient(135deg,rgba(8,12,22,.94),rgba(13,18,32,.92)) !important;
  border:1px solid rgba(255,255,255,.09) !important;
  box-shadow:0 18px 46px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.03) !important;
}

.pro-player-inner{
  width:min(1380px,calc(100% - 24px)) !important;
  min-height:92px !important;
  display:grid !important;
  grid-template-columns:minmax(200px,230px) minmax(170px,215px) minmax(260px,1fr) minmax(150px,185px) auto !important;
  gap:14px !important;
  align-items:center !important;
}

.player-brand,
.player-main-controls,
.pro-now,
.player-next-pro{
  min-height:58px;
  display:flex;
  align-items:center;
  border-radius:14px;
  background:rgba(255,255,255,.028);
  border:1px solid rgba(255,255,255,.065);
  padding:10px 14px;
}

.player-brand{
  gap:12px;
  min-width:0;
}

.player-brand-logo{
  width:132px;
  height:40px;
  flex:0 0 auto;
}

.player-brand-meta b{
  font-size:11px;
}

.player-brand-meta small{
  font-size:8px;
}

.player-main-controls{
  justify-content:center;
  gap:12px;
}

.player-volume-wrap{
  gap:8px;
}

.player-volume-wrap .radio-volume{
  width:118px;
}

.pro-now{
  gap:12px;
  min-width:0;
}

.pro-now .radio-now-copy span{
  font-size:10px;
}

.pro-now .radio-now-copy strong{
  font-size:13px;
}

.pro-now .radio-now-copy small{
  font-size:11px;
}

.player-next-pro{
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  gap:4px;
  padding:10px 14px !important;
}

.player-next-pro span{
  font-size:8px;
}

.player-next-pro strong{
  font-size:11px;
  margin:0;
}

.player-next-pro small{
  font-size:9px;
}

.radio-program-btn{
  width:160px !important;
  min-width:160px !important;
  height:58px !important;
  min-height:58px !important;
  border-radius:14px !important;
  padding:0 16px !important;
  background:linear-gradient(135deg,rgba(14,18,31,.92),rgba(26,19,44,.92)) !important;
  border:1px solid rgba(20,232,255,.18) !important;
  color:#fff !important;
  box-shadow:0 12px 26px rgba(0,0,0,.22) !important;
}

.radio-program-btn span{
  color:var(--cyan);
}

@media(max-width:1260px){
  .pro-player-inner{
    grid-template-columns:minmax(190px,220px) minmax(165px,205px) minmax(250px,1fr) auto !important;
  }

  .player-next-pro{
    display:none !important;
  }
}

@media(max-width:1100px){
  .rsj-live-hero.clean-station-hero{
    min-height:410px !important;
    padding:44px 0 22px !important;
  }

  .hero-banner-panel{
    width:min(900px,calc(100vw - 34px)) !important;
    grid-template-columns:minmax(220px,1fr) minmax(330px,420px) !important;
  }

  .pro-player-inner{
    grid-template-columns:minmax(180px,215px) minmax(150px,190px) minmax(220px,1fr) auto !important;
  }

  .player-volume-wrap .radio-volume{
    width:88px;
  }

  .radio-program-btn{
    width:148px !important;
    min-width:148px !important;
  }
}

@media(max-width:920px){
  .hero-banner-panel{
    grid-template-columns:1fr !important;
  }

  .pro-player-inner{
    grid-template-columns:minmax(210px,1fr) minmax(190px,220px) auto !important;
  }

  .player-brand{
    display:none !important;
  }
}

@media(max-width:820px){
  body{
    padding-bottom:90px !important;
  }

  .radio-bar{
    left:0 !important;
    right:0 !important;
    bottom:0 !important;
    border-radius:0 !important;
  }

  .pro-player-inner{
    grid-template-columns:1fr 58px !important;
    min-height:76px !important;
  }

  .player-brand,
  .player-next-pro,
  .radio-program-btn,
  .player-volume-wrap{
    display:none !important;
  }

  .player-main-controls,
  .pro-now{
    background:transparent !important;
    border:0 !important;
    padding:0 !important;
    min-height:auto !important;
  }
}

@media(max-width:760px){
  .rsj-live-hero.clean-station-hero{
    min-height:385px !important;
    padding:42px 0 18px !important;
  }

  .clean-station-hero .hero-banner-ui{
    bottom:12px !important;
    padding:0 10px !important;
  }

  .hero-banner-panel{
    width:calc(100% - 20px) !important;
    padding:12px !important;
    gap:10px !important;
  }

  .hero-banner-status{
    min-height:auto !important;
    padding:10px 12px !important;
  }

  .hero-banner-status strong{
    font-size:.78rem !important;
  }
}

@media(max-width:560px){
  .rsj-live-hero.clean-station-hero{
    min-height:360px !important;
  }

  .hero-banner-buttons{
    grid-template-columns:1fr !important;
  }

  .hero-banner-buttons .btn-chat{
    grid-column:auto !important;
  }
}

/* =========================================================
   V12.2 BARPLAYER TERUG NAAR VORIGE STIJL + LAGER IN HOOGTE
   ========================================================= */

body{
  padding-bottom:104px !important;
}

.radio-bar{
  left:16px !important;
  right:16px !important;
  bottom:14px !important;
  min-height:78px !important;
  border-radius:22px !important;
  background:linear-gradient(135deg,rgba(14,18,32,.76),rgba(10,14,26,.70)) !important;
  border:1px solid rgba(255,255,255,.10) !important;
  box-shadow:
    0 18px 45px rgba(0,0,0,.35),
    0 0 0 1px rgba(20,232,255,.035),
    inset 0 1px 0 rgba(255,255,255,.04) !important;
  backdrop-filter:blur(20px) saturate(145%) !important;
  -webkit-backdrop-filter:blur(20px) saturate(145%) !important;
  color:#f7f8ff !important;
}

.radio-bar::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(90deg,rgba(20,232,255,.10),transparent 26%,transparent 70%,rgba(255,46,196,.10));
  opacity:.75;
}

.radio-bar::after{
  content:"";
  position:absolute;
  left:18px;
  right:18px;
  top:0;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(20,232,255,.45),rgba(141,98,255,.35),rgba(255,46,196,.45),transparent);
}

.pro-player-inner{
  position:relative;
  z-index:2;
  width:min(1320px,calc(100% - 24px)) !important;
  min-height:78px !important;
  display:grid !important;
  grid-template-columns:230px 198px minmax(250px,1fr) 178px 138px !important;
  gap:12px !important;
  align-items:center !important;
}

.player-brand,
.player-main-controls,
.player-next-pro{
  background:transparent !important;
  border:0 !important;
  padding:0 !important;
  min-height:auto !important;
}

.player-brand{display:flex;align-items:center;gap:10px;min-width:0;}
.player-brand-logo{
  width:132px !important;
  height:38px !important;
  border:1px solid color-mix(in srgb,var(--cyan) 30%,transparent) !important;
  border-radius:11px !important;
  display:flex;align-items:center;justify-content:center;gap:2px;
  background:#0c1220 !important;
  flex:0 0 auto;
}
.player-brand-logo span{color:var(--cyan);font-family:Orbitron;font-size:12px;font-weight:800}
.player-brand-logo strong{color:var(--pink);font-family:Orbitron;font-size:12px}
.player-brand-meta{min-width:0}
.player-brand-meta b{display:block;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.player-brand-meta small{display:flex;align-items:center;gap:5px;font-size:8px;color:#ff6e86;margin-top:4px}
.player-brand-meta i{width:6px;height:6px;border-radius:50%;background:#ff4a68;box-shadow:0 0 8px #ff4a68}

.player-main-controls{display:flex;align-items:center;gap:12px;justify-content:flex-start}
.radio-play-btn{
  width:50px !important;
  height:50px !important;
  border-radius:50% !important;
  font-size:19px !important;
}
.player-volume-wrap{display:flex;align-items:center;gap:7px;min-width:0}
.player-volume-wrap span{font-size:12px}
.player-volume-wrap .radio-volume{width:96px !important}

.pro-now{
  min-width:0;
  min-height:56px !important;
  display:flex;
  align-items:center;
  gap:10px;
  padding:7px 9px !important;
  background:rgba(255,255,255,.025) !important;
  border:1px solid rgba(255,255,255,.05) !important;
  border-radius:12px !important;
}
.pro-now .radio-now-art{
  width:44px !important;
  height:44px !important;
}
.pro-now .radio-now-copy{min-width:0}
.pro-now .radio-now-copy span{font-size:10px !important}
.pro-now .radio-now-copy strong,
.pro-now .radio-now-copy small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pro-now .radio-now-copy strong{font-size:12px !important}
.pro-now .radio-now-copy small{font-size:10px !important}

.player-next-pro{
  min-width:0;
  padding-left:8px !important;
  display:block;
}
.player-next-pro span,
.player-next-pro strong,
.player-next-pro small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.player-next-pro span{font-size:8px;color:var(--pink);font-weight:900}
.player-next-pro strong{font-size:10px;margin:4px 0;color:#fff}
.player-next-pro small{font-size:8px;color:var(--muted)}

.radio-program-btn{
  width:138px !important;
  min-width:138px !important;
  height:44px !important;
  min-height:44px !important;
  padding:0 12px !important;
  border-radius:14px !important;
  background:rgba(255,255,255,.04) !important;
  border:1px solid rgba(255,255,255,.10) !important;
  color:#fff !important;
  box-shadow:none !important;
}
.radio-program-btn:hover{border-color:rgba(20,232,255,.26) !important;box-shadow:0 6px 18px rgba(0,0,0,.18) !important}
.radio-program-btn span{font-size:18px !important;color:var(--cyan)}

@media(max-width:1100px){
  .pro-player-inner{
    grid-template-columns:210px 182px minmax(220px,1fr) 132px !important;
  }
  .player-next-pro{display:none !important}
  .player-brand-logo{width:125px !important}
  .player-volume-wrap .radio-volume{width:80px !important}
  .radio-program-btn{width:132px !important;min-width:132px !important}
}

@media(max-width:820px){
  body{padding-bottom:82px !important}
  .radio-bar{
    left:0 !important;
    right:0 !important;
    bottom:0 !important;
    min-height:72px !important;
    border-radius:0 !important;
  }
  .pro-player-inner{
    grid-template-columns:1fr 58px !important;
    min-height:72px !important;
  }
  .player-brand,
  .player-next-pro,
  .radio-program-btn,
  .player-volume-wrap{display:none !important}
  .player-main-controls{grid-column:2;grid-row:1;justify-content:flex-end}
  .pro-now{grid-column:1;grid-row:1;background:transparent !important;border:0 !important;padding:0 !important;min-height:auto !important}
  .radio-play-btn{width:48px !important;height:48px !important;font-size:18px !important}
}

/* =========================================================
   V12.3 MOBIEL READY / GEEN OVERFLOW NAAR BUITEN
   ========================================================= */

html,body{
  max-width:100%;
  overflow-x:hidden !important;
}

main,
section,
article,
.container,
.pro-panel,
.page-panel,
.hero-banner-panel,
.pro-player-inner,
.compact-dashboard-grid > *,
.quick-nav-grid > *,
.premium-footer-grid > *,
.player-layout > *,
.request-system-grid > *,
.chat-layout > *,
.about-layout > *,
.contact-page-grid > *,
.today-news-layout > *,
.nonstop-request-layout > *,
.artist-layout > *,
.compact-two-col > *{
  min-width:0 !important;
  max-width:100%;
}

img,
video,
iframe,
embed,
object{
  max-width:100% !important;
}

h1,h2,h3,h4,p,strong,small,span,a,button,li,dd,dt{
  overflow-wrap:anywhere;
}

.more-nav-menu,
.hero-live-dj-photo,
.hero-banner-status,
.pro-now,
.player-next-pro,
.contact-panel,
.contact-form,
.notice-card,
.embed-shell,
.nonstop-request-frame,
.nonstop-request-info,
.birthday-spotlight,
.artist-upcoming-inner,
.compact-news-card,
.compact-now-card,
.compact-weather-card{
  max-width:100% !important;
}

@media(max-width:900px){
  .container{
    width:min(100% - 22px,var(--page-max,1220px)) !important;
  }

  .site-header,
  .news-ticker,
  .greet-bar,
  .site-footer,
  .radio-bar{
    overflow-x:hidden !important;
  }

  .compact-dashboard-grid,
  .quick-nav-grid,
  .action-compact-grid,
  .compact-media-grid,
  .program-card-grid,
  .studio-gallery-grid,
  .highlight-grid,
  .event-grid,
  .news-grid,
  .artist-grid,
  .dj-grid,
  .values-grid,
  .history-list,
  .footer-grid,
  .premium-footer-grid{
    grid-template-columns:1fr !important;
  }

  .page-panel,
  .pro-panel,
  .contact-panel,
  .contact-form,
  .nonstop-request-info,
  .nonstop-request-frame,
  .artist-birthday-sidebar,
  .birthday-spotlight,
  .artist-upcoming-inner{
    padding:16px !important;
  }

  .compact-news-list a,
  .today-news-row,
  .history-item,
  .local-request-item,
  .schedule-row,
  .chart-row{
    grid-template-columns:1fr !important;
    gap:8px !important;
  }

  .compact-news-list strong,
  .radio-now-copy strong,
  .radio-now-copy small,
  .player-next-pro strong,
  .player-next-pro small,
  .hero-banner-status strong,
  .artist-card-copy p,
  .schedule-main p,
  .today-news-row p{
    white-space:normal !important;
  }

  .hero-live-dj-photo{
    max-width:calc(100% - 24px) !important;
  }

  .hero-banner-panel{
    width:calc(100% - 20px) !important;
  }

  .hero-banner-buttons{
    grid-template-columns:1fr 1fr !important;
  }
}

@media(max-width:640px){
  .container{
    width:calc(100% - 18px) !important;
  }

  .clean-header-wrap{
    gap:10px !important;
    padding-top:10px !important;
    padding-bottom:10px !important;
  }

  .brand.brand-rsj{
    width:100% !important;
  }

  .brand-copy strong{
    white-space:normal !important;
  }

  .premium-main-nav{
    width:100% !important;
    padding-bottom:4px !important;
    gap:6px !important;
  }

  .premium-main-nav > a,
  .more-nav-btn{
    flex:0 0 auto;
    max-width:none;
  }

  .news-label,
  .greet-label{
    padding:0 10px !important;
    font-size:.58rem !important;
  }

  .compact-news-list a{
    padding-bottom:8px !important;
  }

  .quick-nav-grid{
    grid-template-columns:1fr 1fr !important;
    gap:10px !important;
  }

  .quick-nav-grid a{
    min-height:98px !important;
    padding:14px !important;
  }

  .playlist-now,
  .compact-now-row,
  .radio-now,
  .artist-card,
  .birthday-spotlight,
  .artist-detail-grid{
    grid-template-columns:1fr !important;
    display:grid !important;
  }

  .playlist-cover,
  .compact-np-cover,
  .radio-now-art,
  .birthday-art,
  .artist-card-img{
    justify-self:start;
  }

  .embed-shell,
  .nonstop-request-frame{
    padding:8px !important;
  }

  .embed-shell iframe,
  .nonstop-request-frame iframe{
    height:520px !important;
  }
}

@media(max-width:480px){
  body{
    padding-bottom:80px !important;
  }

  .rsj-live-hero.clean-station-hero{
    min-height:340px !important;
  }

  .hero-banner-buttons,
  .quick-nav-grid,
  .weather-days{
    grid-template-columns:1fr !important;
  }

  .hero-banner-panel,
  .hero-banner-status,
  .pro-now,
  .compact-dashboard-grid > .pro-panel,
  .page-panel,
  .pro-panel,
  .contact-panel,
  .contact-form{
    border-radius:14px !important;
  }

  .page-hero h1,
  .page-hero.slim h1,
  .home-hero h1,
  .compact-home-hero .rsj-live-copy h1{
    font-size:clamp(1.9rem,11vw,2.9rem) !important;
    line-height:1.02 !important;
  }

  .hero-live-dj-photo{
    right:10px !important;
    left:auto !important;
    top:10px !important;
    padding:6px 8px !important;
  }

  .hero-live-dj-photo img{
    width:40px !important;
    height:40px !important;
  }

  .pro-player-inner{
    width:min(100% - 16px,1320px) !important;
  }
}

/* =========================================================
   V12.4 MOBIEL OVERLAYMENU — ALTIJD BOVEN DE HELE SITE
   ========================================================= */
@media(max-width:820px){
  /* De header vormt een stacking-context. Daarom moet de HELE header
     bij open menu boven player, hero, tickers en overige pagina-inhoud staan. */
  body.mobile-menu-open .site-header{
    z-index:10000 !important;
    isolation:isolate !important;
  }

  body.mobile-menu-open .header-layout-v115{
    z-index:10001 !important;
  }

  /* Volledig scherm donker maken achter de drawer. */
  .mobile-menu-backdrop{
    position:fixed !important;
    inset:0 !important;
    width:100vw !important;
    height:100vh !important;
    height:100dvh !important;
    z-index:10010 !important;
    background:rgba(2,5,10,.78) !important;
    backdrop-filter:blur(4px) !important;
    -webkit-backdrop-filter:blur(4px) !important;
  }

  /* Drawer altijd boven backdrop en alle overige onderdelen. */
  .header-layout-v115 .header-nav-zone.mobile-nav-drawer{
    z-index:10020 !important;
    width:min(88vw,360px) !important;
    max-width:calc(100vw - 18px) !important;
    height:100vh !important;
    height:100dvh !important;
    max-height:100dvh !important;
    background:linear-gradient(180deg,#070c16 0%,#0a0f1c 100%) !important;
    box-shadow:-30px 0 65px rgba(0,0,0,.72) !important;
    overflow-x:hidden !important;
    overflow-y:auto !important;
    overscroll-behavior:contain !important;
  }

  .mobile-drawer-head{
    z-index:10022 !important;
    background:#080d18 !important;
  }

  #mobileDrawerClose{
    position:relative !important;
    z-index:10024 !important;
  }

  /* Hamburger blijft bereikbaar terwijl drawer geopend is. */
  .mobile-menu-toggle{
    z-index:10030 !important;
  }

  /* De vaste onderplayer mag nooit over het mobiele menu heen komen. */
  body.mobile-menu-open .radio-bar,
  body.mobile-menu-open .sticky-player{
    z-index:50 !important;
    pointer-events:none !important;
  }

  /* Ook hero/tickers/content expliciet onder het overlaymenu houden. */
  body.mobile-menu-open .news-ticker,
  body.mobile-menu-open .greet-bar,
  body.mobile-menu-open main,
  body.mobile-menu-open .site-footer{
    position:relative;
    z-index:1 !important;
  }

  /* Geen horizontale verschuiving als het menu opent. */
  body.mobile-menu-open{
    width:100% !important;
    max-width:100% !important;
    overflow:hidden !important;
  }

  .header-layout-v115 .mobile-nav-drawer .premium-main-nav,
  .header-layout-v115 .mobile-nav-drawer .more-nav,
  .header-layout-v115 .mobile-nav-drawer .more-nav-menu,
  .header-layout-v115 .mobile-nav-drawer .premium-main-nav > a,
  .header-layout-v115 .mobile-nav-drawer .more-nav-btn{
    max-width:100% !important;
    box-sizing:border-box !important;
  }
}

@media(max-width:430px){
  .header-layout-v115 .header-nav-zone.mobile-nav-drawer{
    width:min(92vw,345px) !important;
    max-width:calc(100vw - 10px) !important;
    padding-left:14px !important;
    padding-right:14px !important;
  }

  .mobile-drawer-head{
    margin-left:-14px !important;
    margin-right:-14px !important;
  }
}

/* =========================================================
   V12.5 VOLLEDIG NIEUW MOBIEL MENU
   Oude mobiele navigatie is uit de header verwijderd.
   Deze drawer staat los van desktop-menu en playerbar.
   ========================================================= */
.rsj-mobile-toggle,
.rsj-mobile-menu,
.rsj-mobile-backdrop{
  display:none;
}

@media(max-width:820px){
  /* Mobiel: desktopnavigatie en losse accountknoppen verdwijnen volledig. */
  .desktop-nav-zone,
  .header-layout-v115 > .header-account-zone{
    display:none !important;
  }

  .premium-header{
    position:sticky !important;
    top:0 !important;
    z-index:400 !important;
  }

  .header-layout-v115{
    min-height:68px !important;
    grid-template-columns:minmax(0,1fr) 48px !important;
    grid-template-areas:"brand toggle" !important;
    gap:10px !important;
    padding:8px 0 !important;
  }

  .header-layout-v115 .header-brand{
    grid-area:brand !important;
    max-width:100% !important;
    min-width:0 !important;
    grid-template-columns:46px minmax(0,1fr) !important;
    gap:10px !important;
  }

  .header-layout-v115 .header-brand .brand-mark{
    width:46px !important;
    height:44px !important;
    border-radius:12px !important;
  }

  .header-layout-v115 .brand-copy strong{
    font-size:.88rem !important;
    white-space:nowrap !important;
  }

  .header-layout-v115 .brand-copy small{
    display:block !important;
    max-width:210px !important;
    font-size:.50rem !important;
  }

  .rsj-mobile-toggle{
    grid-area:toggle;
    width:46px;
    height:44px;
    display:flex !important;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    padding:0;
    border-radius:13px;
    border:1px solid rgba(25,231,255,.20);
    background:linear-gradient(145deg,rgba(10,18,31,.98),rgba(22,11,31,.98));
    box-shadow:0 8px 24px rgba(0,0,0,.26),inset 0 1px 0 rgba(255,255,255,.04);
    cursor:pointer;
    position:relative;
    z-index:520;
  }

  .rsj-mobile-toggle span{
    display:block;
    width:20px;
    height:2px;
    border-radius:99px;
    background:linear-gradient(90deg,var(--cyan),var(--violet),var(--pink));
    box-shadow:0 0 8px rgba(25,231,255,.18);
    transition:transform .2s ease,opacity .16s ease;
  }

  .rsj-mobile-toggle.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .rsj-mobile-toggle.is-open span:nth-child(2){opacity:0}
  .rsj-mobile-toggle.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

  .rsj-mobile-backdrop{
    display:block !important;
    position:fixed;
    inset:0;
    z-index:19990;
    width:100%;
    height:100vh;
    height:100dvh;
    background:rgba(1,4,10,.80);
    backdrop-filter:blur(5px);
    -webkit-backdrop-filter:blur(5px);
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:opacity .2s ease,visibility 0s linear .2s;
  }

  .rsj-mobile-backdrop.is-open{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transition:opacity .2s ease,visibility 0s linear 0s;
  }

  .rsj-mobile-menu{
    display:flex !important;
    position:fixed;
    top:0;
    right:0;
    bottom:0;
    z-index:20000;
    width:min(92vw,390px);
    max-width:calc(100vw - 10px);
    height:100vh;
    height:100dvh;
    flex-direction:column;
    overflow-x:hidden;
    overflow-y:auto;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    color:#fff;
    background:
      radial-gradient(circle at 100% 0%,rgba(255,53,207,.13),transparent 28%),
      radial-gradient(circle at 0% 38%,rgba(25,231,255,.10),transparent 26%),
      linear-gradient(180deg,#070c16 0%,#0a101d 52%,#080c16 100%);
    border-left:1px solid rgba(25,231,255,.17);
    box-shadow:-34px 0 70px rgba(0,0,0,.68);
    transform:translate3d(105%,0,0);
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:transform .27s cubic-bezier(.2,.8,.25,1),opacity .18s ease,visibility 0s linear .27s;
  }

  .rsj-mobile-menu::before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    bottom:0;
    width:2px;
    background:linear-gradient(180deg,var(--cyan),var(--violet),var(--pink),transparent 92%);
    opacity:.75;
    pointer-events:none;
  }

  .rsj-mobile-menu.is-open{
    transform:translate3d(0,0,0);
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transition:transform .27s cubic-bezier(.2,.8,.25,1),opacity .18s ease,visibility 0s linear 0s;
  }

  .rsj-mobile-menu-head{
    position:sticky;
    top:0;
    z-index:5;
    min-height:78px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:12px 14px;
    background:rgba(7,12,22,.96);
    border-bottom:1px solid rgba(255,255,255,.07);
    backdrop-filter:blur(18px) saturate(140%);
    -webkit-backdrop-filter:blur(18px) saturate(140%);
  }

  .rsj-mobile-menu-brand{
    min-width:0;
    display:grid;
    grid-template-columns:48px minmax(0,1fr);
    gap:10px;
    align-items:center;
  }

  .rsj-mobile-menu-logo{
    width:48px;
    height:48px;
    display:block;
    border-radius:12px;
    background-size:cover;
    background-position:center;
    border:1px solid rgba(25,231,255,.22);
    box-shadow:0 0 18px rgba(25,231,255,.09);
  }

  .rsj-mobile-menu-brand > span:last-child{min-width:0}
  .rsj-mobile-menu-brand small,
  .rsj-mobile-menu-brand strong,
  .rsj-mobile-menu-brand em{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .rsj-mobile-menu-brand small{font-size:.54rem;font-weight:900;letter-spacing:.15em;color:var(--cyan)}
  .rsj-mobile-menu-brand strong{margin-top:3px;font:800 .88rem/1.15 Orbitron,Montserrat,sans-serif;color:#fff}
  .rsj-mobile-menu-brand em{margin-top:3px;font-style:normal;font-size:.55rem;color:#8995ae}

  #rsjMobileMenuClose{
    width:42px;
    height:42px;
    flex:0 0 auto;
    border-radius:12px;
    border:1px solid rgba(255,53,207,.20);
    background:linear-gradient(145deg,rgba(255,53,207,.09),rgba(155,99,255,.07));
    color:#fff;
    font-size:1.55rem;
    line-height:1;
    cursor:pointer;
  }

  .rsj-mobile-live-card{
    margin:14px 14px 9px;
    min-height:64px;
    display:grid;
    grid-template-columns:12px minmax(0,1fr) auto;
    gap:10px;
    align-items:center;
    padding:11px 12px;
    border-radius:15px;
    background:linear-gradient(135deg,rgba(20,232,255,.07),rgba(155,99,255,.07) 52%,rgba(255,53,207,.08));
    border:1px solid rgba(25,231,255,.15);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.03),0 12px 30px rgba(0,0,0,.18);
  }

  .rsj-mobile-live-dot{
    width:9px;height:9px;border-radius:50%;background:#ff4b78;box-shadow:0 0 12px #ff4b78;
    animation:rsjMobileLive 1.45s ease-in-out infinite;
  }
  @keyframes rsjMobileLive{50%{opacity:.42;transform:scale(.82)}}
  .rsj-mobile-live-card small,.rsj-mobile-live-card strong{display:block}
  .rsj-mobile-live-card small{font-size:.52rem;color:var(--pink);font-weight:900;letter-spacing:.12em}
  .rsj-mobile-live-card strong{margin-top:3px;font-size:.72rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .rsj-mobile-live-card a{height:36px;display:inline-flex;align-items:center;padding:0 10px;border-radius:10px;background:linear-gradient(90deg,var(--cyan),var(--pink));color:#061019;font-size:.64rem;font-weight:900;white-space:nowrap}

  .rsj-mobile-links{
    display:grid;
    gap:5px;
    padding:5px 14px 10px;
  }

  .rsj-mobile-links > a{
    min-width:0;
    min-height:55px;
    display:grid;
    grid-template-columns:34px minmax(0,1fr) 18px;
    gap:10px;
    align-items:center;
    padding:8px 11px;
    border-radius:13px;
    color:#dce4f5;
    background:rgba(255,255,255,.022);
    border:1px solid rgba(255,255,255,.048);
    transition:background .16s ease,border-color .16s ease,transform .16s ease;
  }

  .rsj-mobile-links > a i{
    width:34px;height:34px;border-radius:10px;display:grid;place-items:center;font-style:normal;font-size:.8rem;color:var(--cyan);
    background:linear-gradient(145deg,rgba(20,232,255,.07),rgba(155,99,255,.06));
    border:1px solid rgba(20,232,255,.10);
  }
  .rsj-mobile-links > a span{min-width:0}
  .rsj-mobile-links > a strong,.rsj-mobile-links > a small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .rsj-mobile-links > a strong{font-size:.76rem;color:#f7f9ff}
  .rsj-mobile-links > a small{margin-top:3px;font-size:.56rem;color:#8490aa}
  .rsj-mobile-links > a b{font-size:1.1rem;color:#53617b;text-align:right}
  .rsj-mobile-links > a.active{
    background:linear-gradient(90deg,rgba(20,232,255,.09),rgba(155,99,255,.07),rgba(255,53,207,.07));
    border-color:rgba(20,232,255,.20);
    box-shadow:0 0 18px rgba(20,232,255,.045);
  }
  .rsj-mobile-links > a.active i{color:var(--pink);border-color:rgba(255,53,207,.16)}

  .rsj-mobile-more{padding:2px 14px 12px}
  .rsj-mobile-section-title{display:flex;align-items:center;gap:10px;margin:5px 0 9px;color:#78849d;font-size:.53rem;font-weight:900;letter-spacing:.14em}
  .rsj-mobile-section-title::after{content:"";height:1px;flex:1;background:linear-gradient(90deg,rgba(25,231,255,.20),transparent)}
  .rsj-mobile-more-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}
  .rsj-mobile-more-grid a{min-height:39px;display:flex;align-items:center;padding:0 10px;border-radius:10px;color:#b9c4d9;background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.045);font-size:.63rem;font-weight:750}

  .rsj-mobile-account-links{
    margin-top:auto;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px;
    padding:12px 14px calc(16px + env(safe-area-inset-bottom));
    border-top:1px solid rgba(255,255,255,.06);
    background:rgba(5,9,17,.74);
  }
  .rsj-mobile-account-links a{height:42px;display:flex;align-items:center;justify-content:center;border-radius:11px;color:#eef3ff;font-size:.66rem;font-weight:850;border:1px solid rgba(25,231,255,.12);background:rgba(255,255,255,.025)}
  .rsj-mobile-account-links a:last-child{border-color:rgba(255,53,207,.14)}

  body.rsj-mobile-menu-open{
    overflow:hidden !important;
    touch-action:none;
  }

  body.rsj-mobile-menu-open .radio-bar,
  body.rsj-mobile-menu-open .sticky-player{
    z-index:80 !important;
    pointer-events:none !important;
  }
}

@media(max-width:430px){
  .rsj-mobile-menu{width:94vw;max-width:calc(100vw - 6px)}
  .rsj-mobile-menu-head{padding-left:12px;padding-right:12px}
  .rsj-mobile-live-card{margin-left:12px;margin-right:12px}
  .rsj-mobile-links,.rsj-mobile-more{padding-left:12px;padding-right:12px}
  .rsj-mobile-account-links{padding-left:12px;padding-right:12px}
  .rsj-mobile-live-card a{padding:0 8px;font-size:.60rem}
}

@media(min-width:821px){
  .rsj-mobile-toggle,
  .rsj-mobile-menu,
  .rsj-mobile-backdrop{display:none !important}
}