@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{--bg:#070707;--panel:#101010;--panel2:#151515;--text:#f4f2ed;--muted:#aaa79f;--purple:#8f1fe7;--orange:#ff7600;--line:#292929;--max:1240px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 75% 15%,#1a0828 0,transparent 28%),var(--bg);color:var(--text);font-family:"Space Grotesk",Arial,sans-serif;line-height:1.5}a{color:inherit;text-decoration:none}.noise{position:fixed;inset:0;pointer-events:none;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");z-index:20}.site-header{height:88px;display:flex;align-items:center;justify-content:space-between;max-width:var(--max);margin:auto;padding:0 28px;border-bottom:1px solid var(--line)}.brand img{width:108px;height:64px;object-fit:contain}.nav{display:flex;align-items:center;gap:30px;font-size:14px;text-transform:uppercase;letter-spacing:.08em}.nav a{color:#bbb;transition:.25s}.nav a:hover,.nav .active{color:#fff}.nav-live{border:1px solid #555;padding:11px 15px;border-radius:999px;color:#fff!important}.nav-live span{display:inline-block;width:7px;height:7px;background:#ff3c3c;border-radius:50%;margin-left:7px;box-shadow:0 0 12px #ff3c3c}.menu-toggle{display:none;background:none;border:0;color:#fff;font-size:25px}.hero{max-width:var(--max);margin:auto;min-height:650px;padding:70px 28px;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:30px}.eyebrow{font:500 12px "DM Mono",monospace;letter-spacing:.18em;color:#d0cec8}.pulse,.live-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#ff4141;box-shadow:0 0 14px #ff4141;margin-right:8px}.hero h1{font-size:clamp(54px,7vw,104px);line-height:.92;letter-spacing:-.06em;margin:18px 0 28px}.hero h1 em,.page-head em,.listen-hero em{font-style:normal;color:var(--purple)}.lede{font-size:18px;color:var(--muted);max-width:590px}.hero-actions{display:flex;gap:13px;flex-wrap:wrap;margin-top:34px}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 21px;border-radius:5px;font-weight:700;font-size:13px;text-transform:uppercase;letter-spacing:.08em;transition:transform .2s,box-shadow .2s}.btn:hover{transform:translateY(-2px)}.btn-primary{background:var(--orange);color:#090909;box-shadow:0 8px 35px #ff760022}.btn-ghost{border:1px solid #4a4a4a}.hero-art{position:relative;min-height:500px;display:grid;place-items:center}.hero-logo{width:min(460px,82%);position:relative;z-index:2;filter:drop-shadow(0 0 35px #8f1fe733)}.ring{position:absolute;border:1px solid #55216d;border-radius:50%;width:420px;height:420px}.ring-a{animation:spin 20s linear infinite;border-style:dashed}.ring-b{width:510px;height:510px;opacity:.4;animation:spin 28s linear reverse infinite}.equalizer{position:absolute;bottom:60px;display:flex;align-items:end;gap:7px;height:100px;opacity:.65}.equalizer i{width:5px;background:var(--purple);border-radius:4px;animation:bounce 1.1s ease-in-out infinite}.equalizer i:nth-child(2n){animation-delay:-.3s}.equalizer i:nth-child(3n){animation-delay:-.6s}.equalizer i:nth-child(1){height:28px}.equalizer i:nth-child(2){height:60px}.equalizer i:nth-child(3){height:42px}.equalizer i:nth-child(4){height:80px}.equalizer i:nth-child(5){height:32px}.equalizer i:nth-child(6){height:70px}.equalizer i:nth-child(7){height:46px}.equalizer i:nth-child(8){height:88px}.equalizer i:nth-child(9){height:36px}.equalizer i:nth-child(10){height:65px}.equalizer i:nth-child(11){height:50px}.equalizer i:nth-child(12){height:78px}@keyframes bounce{50%{transform:scaleY(.35)}}@keyframes spin{to{transform:rotate(360deg)}}.now{max-width:var(--max);margin:0 auto 70px;padding:24px 28px;border:1px solid var(--line);background:linear-gradient(100deg,#101010,#0b0b0b);display:grid;grid-template-columns:1fr auto 230px;align-items:center;gap:30px}.now h2{margin:4px 0;font-size:30px}.muted{color:var(--muted)}.play-orb{width:70px;height:70px;border-radius:50%;display:grid;place-items:center;background:var(--purple);font-size:22px;box-shadow:0 0 40px #8f1fe733;transition:.2s}.play-orb:hover{transform:scale(1.07)}.meter{display:flex;gap:4px;align-items:center;height:50px}.meter span{height:20px;width:4px;background:var(--orange);animation:bounce 1s infinite}.meter span:nth-child(2n){height:36px;animation-delay:-.2s}.meter span:nth-child(3n){height:15px;animation-delay:-.4s}.feature-grid{max-width:var(--max);margin:0 auto 100px;padding:0 28px;display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line)}.feature-card{background:#0b0b0b;padding:34px;min-height:240px;position:relative}.feature-card.featured{background:linear-gradient(145deg,#17101e,#0b0b0b)}.card-no,.tag{font:500 11px "DM Mono",monospace;color:#777;letter-spacing:.12em}.feature-card h3{font-size:28px;margin:55px 0 10px}.feature-card p{color:var(--muted);max-width:330px}.feature-card a{display:inline-block;margin-top:18px;color:var(--orange);font-weight:700}.page{max-width:var(--max);margin:auto;padding:80px 28px 110px}.page-head{max-width:780px;margin-bottom:60px}.page-head h1{font-size:clamp(52px,7vw,92px);line-height:.95;letter-spacing:-.06em;margin:15px 0}.page-head>p:last-child{color:var(--muted);font-size:18px}.dj-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.dj-card{background:var(--panel);border:1px solid var(--line);overflow:hidden}.dj-avatar{height:250px;background:radial-gradient(circle,#8f1fe755,#101010 65%);display:grid;place-items:center;font:500 50px "DM Mono",monospace}.dj-avatar.alt{background:radial-gradient(circle,#ff760055,#101010 65%)}.dj-body{padding:25px}.dj-body h2{font-size:31px;margin:8px 0}.dj-body p{color:var(--muted)}.socials{display:flex;gap:14px;margin-top:20px;font:11px "DM Mono",monospace;text-transform:uppercase}.socials a{color:#fff}.cta-strip{margin-top:70px;padding:30px;border:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:20px}.cta-strip h2{margin:6px 0 0;font-size:32px}.schedule{border-top:1px solid var(--line)}.day{border-bottom:1px solid var(--line);display:grid;grid-template-columns:220px 1fr;min-height:120px}.day.highlight{background:linear-gradient(90deg,#170e1e,transparent)}.day-title{padding:30px 20px 30px 0;display:flex;flex-direction:column;justify-content:center}.day-title span{font:11px "DM Mono",monospace;color:var(--purple);letter-spacing:.16em}.day-title strong{font-size:28px}.show{border-left:1px solid var(--line);padding:25px 25px;display:grid;grid-template-columns:100px 1fr 30px;align-items:center;gap:20px}.show+ .show{border-top:1px solid var(--line)}.show time{font:12px "DM Mono",monospace;color:var(--orange)}.show h3{margin:0;font-size:21px}.show p{margin:3px 0 0;color:#858585;font-size:14px}.show b{color:var(--purple)}.listen-hero{display:grid;grid-template-columns:1fr 320px;gap:50px;align-items:center;margin-bottom:60px}.listen-hero h1{font-size:clamp(60px,8vw,110px);line-height:.9;letter-spacing:-.06em;margin:15px 0 25px}.listen-hero p{color:var(--muted);font-size:18px;max-width:700px}.listen-disc{width:300px;height:300px;border-radius:50%;background:radial-gradient(circle,#8f1fe755,#0c0c0c 68%);display:grid;place-items:center;border:1px solid #54236a;box-shadow:0 0 70px #8f1fe722}.listen-disc img{width:75%}.player-panel{border:1px solid var(--line);background:#0b0b0b}.player-head{height:62px;padding:0 20px;display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--line);font:12px "DM Mono",monospace}.player-head .muted{margin-left:auto;font-size:10px}.player-frame{position:relative;min-height:500px}.player-frame iframe{width:100%;height:520px;border:0;background:#fff}.frame-fallback{display:none;text-align:center;padding:40px;background:#111}.frame-fallback a{color:var(--orange);font-weight:700}.listen-notes{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);margin-top:40px}.listen-notes article{background:#0c0c0c;padding:25px}.listen-notes span{font:11px "DM Mono",monospace;color:var(--orange)}.listen-notes h3{font-size:22px;margin:35px 0 7px}.listen-notes p{color:var(--muted);margin:0}footer{max-width:var(--max);margin:auto;border-top:1px solid var(--line);padding:30px 28px;display:flex;justify-content:space-between;gap:20px;color:#777;font-size:12px}footer strong{color:#fff;letter-spacing:.08em;margin-right:15px}.footer-links{display:flex;gap:20px}.footer-links a:hover{color:#fff}@media(max-width:850px){.site-header{height:74px;padding:0 18px}.brand img{width:95px}.menu-toggle{display:block}.nav{display:none;position:absolute;top:74px;left:0;right:0;background:#090909;border-bottom:1px solid var(--line);padding:18px;z-index:30;flex-direction:column;align-items:stretch}.nav.open{display:flex}.nav a{padding:10px}.hero{grid-template-columns:1fr;padding-top:45px;min-height:auto}.hero-art{min-height:370px;order:-1}.hero-logo{width:290px}.ring{width:280px;height:280px}.ring-b{width:340px;height:340px}.now{grid-template-columns:1fr auto;margin-bottom:45px}.meter{display:none}.feature-grid,.dj-grid,.listen-notes{grid-template-columns:1fr}.page{padding-top:55px}.day{grid-template-columns:100px 1fr}.day-title strong{font-size:19px}.show{grid-template-columns:75px 1fr 20px;padding:20px 12px}.listen-hero{grid-template-columns:1fr}.listen-disc{width:220px;height:220px;margin:auto}.player-frame iframe{height:500px}.cta-strip{align-items:flex-start;flex-direction:column}footer{flex-direction:column}.footer-links{flex-wrap:wrap}}@media(max-width:480px){.hero{padding-left:18px;padding-right:18px}.hero h1{font-size:55px}.hero-art{min-height:300px}.hero-logo{width:245px}.ring{width:235px;height:235px}.ring-b{width:290px;height:290px}.now,.feature-grid,.page{margin-left:0;margin-right:0;padding-left:18px;padding-right:18px}.now{padding:20px}.show time{font-size:10px}.show h3{font-size:17px}.day{grid-template-columns:78px 1fr}}

.show small{font-size:.65em;color:#999;font-weight:500}
.show .recurrence{display:inline-block;margin-left:8px;padding:3px 7px;border:1px solid #3b2a45;border-radius:999px;color:#b77bdc;font:10px "DM Mono",monospace;text-transform:uppercase;letter-spacing:.04em}
.show.overnight{background:linear-gradient(90deg,#110d13,transparent)}
@media(max-width:850px){.show .recurrence{margin:6px 0 0;display:table}}

/* REBUILT SCHEDULE */
.schedule-page{max-width:1180px;margin:0 auto;padding:72px 28px 100px}
.schedule-intro{display:flex;align-items:end;justify-content:space-between;gap:40px;padding-bottom:42px;border-bottom:1px solid var(--line)}
.schedule-intro h1{font-size:clamp(56px,7vw,94px);line-height:.9;letter-spacing:-.065em;margin:14px 0 20px}
.schedule-intro h1 em{font-style:normal;color:var(--purple)}
.schedule-lead{max-width:680px;color:var(--muted);font-size:17px;margin:0}
.schedule-lead strong{color:#ddd;font-weight:500}
.schedule-listen{display:flex;align-items:center;gap:13px;border:1px solid #383838;background:#0e0e0e;padding:12px 18px;border-radius:6px;min-width:175px;transition:.2s}
.schedule-listen:hover{border-color:#714087;transform:translateY(-2px)}
.schedule-listen b{display:block;font:600 11px "DM Mono",monospace;letter-spacing:.12em}
.schedule-listen small{display:block;color:#777;margin-top:3px}
.listen-icon{width:35px;height:35px;border-radius:50%;display:grid;place-items:center;background:var(--orange);color:#090909;font-size:12px}
.schedule-key{display:flex;align-items:center;gap:25px;padding:18px 0 28px;color:#888;font:10px "DM Mono",monospace;text-transform:uppercase;letter-spacing:.07em}
.schedule-key span{display:flex;align-items:center;gap:7px}
.key-dot{width:7px;height:7px;border-radius:50%;background:var(--purple);display:inline-block}
.key-dot.special{background:var(--orange)}
.schedule-zone{margin-left:auto;color:#aaa}
.week-grid{display:flex;flex-direction:column;gap:18px}
.schedule-day{background:linear-gradient(120deg,#101010,#0b0b0b);border:1px solid #242424;border-radius:8px;overflow:hidden;box-shadow:0 12px 35px #00000020}
.schedule-day:hover{border-color:#353535}
.schedule-day-head{display:grid;grid-template-columns:58px auto 1fr;align-items:center;gap:18px;padding:20px 24px;background:#0d0d0d;border-bottom:1px solid #252525}
.day-number{font:500 11px "DM Mono",monospace;color:var(--orange);letter-spacing:.12em}
.schedule-day-head>div:nth-child(2)>span{font:10px "DM Mono",monospace;color:#777;letter-spacing:.2em}
.schedule-day-head h2{margin:2px 0 0;font-size:27px;letter-spacing:-.03em}
.day-line{height:1px;background:linear-gradient(90deg,#3a3a3a,transparent);margin-left:8px}
.shows{display:flex;flex-direction:column}
.schedule-show{display:grid;grid-template-columns:190px minmax(0,1fr);align-items:center;min-height:76px;padding:12px 24px;border-bottom:1px solid #1d1d1d;transition:background .2s,padding .2s}
.schedule-show:last-child{border-bottom:0}
.schedule-show:hover{background:#141014;padding-left:28px}
.schedule-show time{font:11px "DM Mono",monospace;color:#a7a7a7;letter-spacing:.01em}
.schedule-show time b{color:#555;font-weight:400;margin:0 4px}
.show-info h3{font-size:17px;margin:0;font-weight:600;color:#f2f0eb;line-height:1.25}
.show-info p{margin:4px 0 0;color:#777;font-size:13px}
.show-info p span{display:inline-block;margin-left:9px;padding:3px 7px;border:1px solid #4b2d18;border-radius:999px;color:#d88a4c;background:#1b120c;font:9px "DM Mono",monospace;text-transform:uppercase;letter-spacing:.04em;vertical-align:middle}
.schedule-show.recurring{box-shadow:inset 3px 0 0 var(--orange)}
.schedule-show.overnight{background:linear-gradient(90deg,#120e14,#0b0b0b)}
.schedule-show.overnight:hover{background:#171118}
.schedule-footer-card{margin-top:28px;padding:30px 32px;border:1px solid #292929;border-radius:8px;background:radial-gradient(circle at 85% 30%,#281033 0,transparent 38%),#0d0d0d;display:flex;align-items:center;justify-content:space-between;gap:25px}
.schedule-footer-card h2{font-size:31px;margin:6px 0}
.schedule-footer-card p:last-child{color:#777;margin:0}
@media(max-width:800px){
  .schedule-page{padding:48px 18px 70px}
  .schedule-intro{display:block}
  .schedule-intro h1{font-size:58px}
  .schedule-listen{margin-top:28px;width:max-content}
  .schedule-key{flex-wrap:wrap;gap:12px 20px}
  .schedule-zone{width:100%;margin-left:0}
  .schedule-day-head{grid-template-columns:40px 1fr;padding:18px}
  .day-line{display:none}
  .schedule-show{grid-template-columns:1fr;gap:6px;padding:16px 18px}
  .schedule-show:hover{padding-left:21px}
  .schedule-show time{font-size:10px;color:var(--orange)}
  .show-info h3{font-size:16px}
  .show-info p{font-size:12px}
  .show-info p span{margin-left:0;margin-top:7px}
  .schedule-footer-card{display:block;padding:25px}
  .schedule-footer-card .btn{margin-top:18px}
}
@media(max-width:420px){
  .schedule-intro h1{font-size:50px}
  .schedule-day-head h2{font-size:23px}
}


.dj-avatar img{width:100%;height:100%;object-fit:contain;padding:18px;display:block}
.dj-avatar{overflow:hidden}
.dj-body p:not(.tag){line-height:1.7}
@media (max-width: 1050px){.dj-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width: 700px){.dj-grid{grid-template-columns:1fr}.dj-avatar{height:230px}}

/* DJ logo containment: artwork fills the card without cropping or distortion */
.dj-avatar {
  height: 250px;
  min-height: 250px;
  padding: 16px;
  overflow: hidden;
}
.dj-avatar img {
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  object-position: center;
  display: block;
}
@media (max-width: 480px) {
  .dj-avatar { height: 220px; min-height: 220px; padding: 14px; }
}

/* UNIFORM DJ LOGO FRAMES */
.dj-avatar{
  height:250px;
  min-height:250px;
  padding:22px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  position:relative;
}
.dj-avatar img{
  display:block;
  width:100%;
  height:100%;
  max-width:210px;
  max-height:190px;
  margin:auto;
  object-fit:contain;
  object-position:center center;
  flex:0 0 auto;
}
@media(max-width:850px){
  .dj-avatar{height:250px;min-height:250px;padding:24px;}
  .dj-avatar img{max-width:220px;max-height:190px;}
}
@media(max-width:480px){
  .dj-avatar{height:230px;min-height:230px;padding:24px;}
  .dj-avatar img{max-width:205px;max-height:175px;}
}

/* MERCH PAGE */
.feature-grid-four{grid-template-columns:repeat(4,1fr)}
.merch-head{margin-bottom:44px}
.merch-head .btn{margin-top:20px}
.merch-panel{border:1px solid var(--line);background:#0b0b0b;overflow:hidden}
.merch-panel-head{padding:25px 28px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:20px}
.merch-panel-head h2{font-size:30px;margin:6px 0 0}
.shop-frame-wrap{position:relative;min-height:720px;background:#111}
.shop-frame{width:100%;height:720px;border:0;display:block;background:#fff}
.shop-fallback{display:none;position:absolute;inset:0;place-items:center;text-align:center;padding:40px;background:radial-gradient(circle at 50% 30%,#24102f,#0b0b0b 58%)}
.shop-fallback h3{font-size:34px;max-width:600px;margin:10px auto}
.shop-fallback p:not(.eyebrow){color:var(--muted);max-width:570px;margin:0 auto 22px}
.merch-strip{margin-top:28px;padding:32px;border:1px solid var(--line);background:radial-gradient(circle at 85% 30%,#281033 0,transparent 38%),#0d0d0d;display:flex;align-items:center;justify-content:space-between;gap:25px}
.merch-strip h2{font-size:31px;margin:6px 0}.merch-strip p{color:#777;margin:0;max-width:650px}
@media(max-width:1050px){.feature-grid-four{grid-template-columns:repeat(2,1fr)}}
@media(max-width:800px){.merch-panel-head{align-items:flex-start;flex-direction:column}.shop-frame-wrap,.shop-frame{height:620px;min-height:620px}.merch-strip{display:block}.merch-strip .btn{margin-top:20px}}
@media(max-width:700px){.feature-grid-four{grid-template-columns:1fr}}

/* LIVE FOURTHWALL MERCH */
.merch-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border-top:1px solid var(--line)}
.merch-card{background:#0c0c0c;display:flex;flex-direction:column;min-width:0;transition:transform .2s,background .2s;position:relative;overflow:hidden}
.merch-card:hover{background:#121212;transform:translateY(-3px);z-index:2}
.merch-card-media{height:320px;background:radial-gradient(ellipse at 50% 60%,#1a1a1a 0%,#0e0e0e 70%);display:grid;place-items:center;overflow:hidden;position:relative;padding:18px 14px 8px}
.merch-card-media img{max-width:88%;max-height:100%;width:auto;height:auto;object-fit:contain;display:block;transition:transform .35s;filter:drop-shadow(0 12px 28px rgba(0,0,0,.55))}
.merch-card:hover .merch-card-media img{transform:scale(1.04)}
.merch-card-body{padding:20px 21px 23px;display:grid;gap:6px}
.merch-card-body span{font:500 10px "DM Mono",monospace;color:#777;letter-spacing:.14em}
.merch-card-body h3{font-size:21px;line-height:1.15;margin:4px 0}
.merch-card-body strong{color:var(--orange);font:700 15px "DM Mono",monospace}
.merch-card-body small{color:#777;margin-top:8px}
.merch-card-live{background:radial-gradient(circle at 75% 20%,#281033 0,transparent 55%),#0c0c0c}
.merch-card-live-inner{min-height:410px;padding:28px;display:flex;flex-direction:column;justify-content:center}
.merch-card-live h3{font-size:28px;line-height:1.05;margin:18px 0 12px}
.merch-card-live p:not(.eyebrow){color:#888;font-size:14px}
.merch-card-live .btn{margin-top:18px}

.merch-live-note{margin:0;padding:17px 22px;color:#666;font:11px/1.6 "DM Mono",monospace;border-top:1px solid var(--line)}
.merch-live-note a{color:#aaa;text-decoration:underline}
@media(max-width:1050px){.merch-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.merch-grid{grid-template-columns:1fr}.merch-card-media{height:340px}}


/* Live Fourthwall product previews */

.merch-live-product{position:relative;background:radial-gradient(circle at 50% 35%,#242424 0,#101010 55%,#090909 100%);display:flex;align-items:center;justify-content:center;min-height:360px;overflow:hidden}
.merch-live-product:before{content:"";position:absolute;inset:14%;border:1px solid rgba(255,255,255,.08);transform:rotate(-2deg)}
.merch-live-product-art{width:62%;aspect-ratio:4/5;border:1px solid #333;background:linear-gradient(145deg,#181818,#090909);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:7px;box-shadow:0 20px 45px rgba(0,0,0,.5);transform:rotate(-2deg)}
.merch-live-product-art span{font:700 12px "DM Mono",monospace;letter-spacing:.18em;color:#999}.merch-live-product-art b{font:900 30px/1 Arial,sans-serif;letter-spacing:-.04em;color:#eee}.merch-live-product-art small{font:500 9px "DM Mono",monospace;letter-spacing:.16em;color:var(--orange)}
.merch-live-badge{position:absolute;top:18px;right:18px;font:700 9px "DM Mono",monospace;letter-spacing:.12em;color:#111;background:var(--orange);padding:7px 9px}
@media(max-width:700px){.merch-live-product{min-height:330px}.merch-live-product-art{width:58%}}


/* HOME SOCIALS */
.social-section{max-width:var(--max);margin:0 auto 100px;padding:0 28px;position:relative}
.social-section:before{content:"";display:block;height:1px;background:var(--line);margin-bottom:76px}
.social-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:40px;margin-bottom:34px}
.social-section-head h2{font-size:clamp(38px,5vw,64px);line-height:.95;letter-spacing:-.04em;margin:8px 0 0}
.social-section-head h2 em{color:var(--orange);font-style:normal}
.socials-intro{max-width:430px;color:#777;line-height:1.7;margin:0 0 3px}
.social-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.social-card{min-height:210px;padding:25px 27px;background:#0b0b0b;display:flex;flex-direction:column;position:relative;overflow:hidden;text-decoration:none;transition:transform .25s ease,background .25s ease,border-color .25s ease}
.social-card:before{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--orange);transform:scaleX(0);transform-origin:left;transition:transform .3s ease}
.social-card:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 100% 0%,rgba(143,31,231,.12),transparent 42%);opacity:0;transition:opacity .3s ease;pointer-events:none}
.social-card:hover{background:#111;transform:translateY(-4px);z-index:2}
.social-card:hover:before{transform:scaleX(1)}
.social-card:hover:after{opacity:1}
.social-index{font:500 10px "DM Mono",monospace;color:#555;letter-spacing:.12em;position:relative;z-index:1}
.social-icon{width:45px;height:45px;margin:26px 0 19px;border:1px solid #3a3a3a;border-radius:8px;display:grid;place-items:center;font:500 27px/1 Arial,sans-serif;color:#eee;transition:border-color .25s,transform .25s,box-shadow .25s;position:relative;z-index:1}
.social-icon-play{font-size:15px;padding-left:2px}
.social-icon-fb{font:bold 30px/1 Arial,sans-serif}
.social-card:hover .social-icon{border-color:var(--orange);transform:translateY(-2px) rotate(-4deg);box-shadow:0 0 24px rgba(255,118,0,.12)}
.social-name{font-size:23px;font-weight:700;color:#f2f0eb;letter-spacing:-.02em;position:relative;z-index:1}
.social-handle{margin-top:5px;color:#777;font:11px "DM Mono",monospace;position:relative;z-index:1}
.social-arrow{position:absolute;right:25px;bottom:24px;color:#666;font-size:20px;transition:color .25s,transform .25s;z-index:1}
.social-card:hover .social-arrow{color:var(--orange);transform:translate(3px,-3px)}
@media(max-width:850px){
  .social-section{margin-bottom:70px;padding:0 18px}
  .social-section:before{margin-bottom:58px}
  .social-section-head{display:block;margin-bottom:26px}
  .socials-intro{margin-top:18px}
  .social-grid{grid-template-columns:1fr}
  .social-card{min-height:180px}
}

/* HOME SOCIALS — polished to match the existing BKR card system */
.social-section{max-width:var(--max);margin:0 auto 100px;padding:0 28px}
.social-section:before{content:"";display:block;height:1px;background:var(--line);margin:0 0 62px}
.social-section-head{display:flex;align-items:end;justify-content:space-between;gap:40px;margin-bottom:28px}
.social-section-head h2{margin:9px 0 0;font-size:clamp(38px,5vw,64px);line-height:.94;letter-spacing:-.055em}
.social-section-head h2 em{font-style:normal;color:var(--purple)}
.socials-intro{max-width:410px;margin:0 0 3px;color:var(--muted);font-size:15px;line-height:1.65}
.social-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.social-card{min-height:205px;padding:27px;background:#0b0b0b;position:relative;display:flex;flex-direction:column;overflow:hidden;transition:background .25s ease,transform .25s ease}
.social-card:before{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--orange);transform:scaleX(0);transform-origin:left;transition:transform .3s ease}
.social-card:after{content:"";position:absolute;width:180px;height:180px;right:-80px;top:-90px;border-radius:50%;background:var(--purple);opacity:.07;filter:blur(8px);transition:opacity .3s ease}
.social-card:hover{background:#111;transform:translateY(-3px);z-index:2}
.social-card:hover:before{transform:scaleX(1)}
.social-card:hover:after{opacity:.15}
.social-index{font:500 10px "DM Mono",monospace;letter-spacing:.13em;color:#666}
.social-icon{width:44px;height:44px;margin:25px 0 18px;border:1px solid #3a3a3a;border-radius:7px;display:grid;place-items:center;color:#eee;position:relative;z-index:1;transition:border-color .25s ease,box-shadow .25s ease,transform .25s ease}
.social-card:hover .social-icon{border-color:var(--orange);box-shadow:0 0 22px rgba(255,118,0,.13);transform:translateY(-2px)}
.social-icon-instagram:before{content:"";width:21px;height:21px;border:2px solid currentColor;border-radius:6px;position:absolute}
.social-icon-instagram:after{content:"";width:7px;height:7px;border:2px solid currentColor;border-radius:50%;position:absolute}
.social-icon-instagram span{width:3px;height:3px;background:currentColor;border-radius:50%;position:absolute;top:10px;right:10px}
.social-icon-youtube{font:700 12px/1 Arial,sans-serif;padding-left:2px}
.social-icon-facebook{font:bold 29px/1 Arial,sans-serif;align-items:end;padding-bottom:2px}
.social-name{font-size:22px;font-weight:700;letter-spacing:-.025em}
.social-handle{margin-top:4px;color:#777;font:11px "DM Mono",monospace}
.social-arrow{position:absolute;right:26px;bottom:23px;color:#666;font-size:20px;transition:color .25s ease,transform .25s ease}
.social-card:hover .social-arrow{color:var(--orange);transform:translate(3px,-3px)}
@media(max-width:850px){
  .social-section{margin-bottom:70px;padding:0 18px}
  .social-section:before{margin-bottom:48px}
  .social-section-head{display:block;margin-bottom:25px}
  .socials-intro{margin-top:17px}
  .social-grid{grid-template-columns:1fr}
  .social-card{min-height:175px}
}

/* SCHEDULE — LOCAL TIME + LIVE NOW */
.schedule-zone{display:flex;flex-direction:column;align-items:flex-end;gap:4px;text-align:right}
.schedule-zone b{color:#aaa;font:600 10px "DM Mono",monospace;letter-spacing:.08em}
.schedule-zone small{color:var(--purple);font:500 9px "DM Mono",monospace;letter-spacing:.08em;text-transform:uppercase}
.schedule-show time{display:flex;flex-wrap:wrap;align-items:center;gap:0 3px}
.schedule-show time .local-day-note{display:block;width:100%;margin-top:5px;color:#555;font:9px "DM Mono",monospace;letter-spacing:.05em;text-transform:uppercase}
.schedule-show.is-live{background:radial-gradient(circle at 100% 50%,rgba(112,45,145,.22),transparent 55%),#151015;box-shadow:inset 3px 0 0 var(--orange), inset 0 1px 0 rgba(255,255,255,.025)}
.schedule-show.is-live time{color:#eee}
.schedule-show.is-live .show-info h3{color:#fff}
.schedule-show.is-live .show-info h3:after{content:"LIVE NOW";display:inline-block;margin-left:10px;vertical-align:middle;padding:5px 7px;border-radius:2px;background:var(--orange);color:#111;font:700 8px "DM Mono",monospace;letter-spacing:.08em}
.schedule-show.is-live:before{content:"";position:absolute;left:10px;width:6px;height:6px;border-radius:50%;background:#ff4545;box-shadow:0 0 12px #ff4545}
.schedule-show{position:relative}










@keyframes scheduleLivePulse{50%{opacity:.4;transform:scale(.82)}}
@media(max-width:700px){
  .schedule-zone{width:100%;align-items:flex-start;text-align:left}
  
  
  .schedule-show.is-live:before{left:7px}
}
@media(prefers-reduced-motion:reduce){}

/* CLEAN SCHEDULE TIMEZONE PANEL */
.schedule-key{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
  padding:20px 0 30px;
}
.schedule-legend{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:12px 24px;
}
.schedule-zone{
  display:flex;
  align-items:stretch;
  justify-content:flex-end;
  gap:16px;
  margin-left:auto;
  padding:10px 14px;
  border:1px solid #242424;
  border-radius:6px;
  background:#0c0c0c;
}
.schedule-zone .zone-item{
  display:flex;
  flex-direction:column;
  gap:3px;
  min-width:120px;
}
.schedule-zone .zone-label{
  color:#666;
  font:600 9px "DM Mono",monospace;
  letter-spacing:.12em;
}
.schedule-zone .zone-item strong{
  color:#ddd;
  font:500 10px "DM Mono",monospace;
  letter-spacing:.06em;
  white-space:nowrap;
}
.schedule-zone .viewer-zone{
  color:var(--purple)!important;
}
.zone-divider{
  width:1px;
  background:#292929;
}
.schedule-show time .local-day-note{margin-top:4px}
@media(max-width:800px){
  .schedule-key{display:block;padding-bottom:24px}
  .schedule-legend{margin-bottom:14px}
  .schedule-zone{width:max-content;max-width:100%;margin-left:0;justify-content:flex-start}
}
@media(max-width:520px){
  .schedule-zone{width:100%;gap:10px;padding:10px 12px}
  .schedule-zone .zone-item{min-width:0;flex:1}
  .schedule-zone .zone-item strong{white-space:normal;line-height:1.35}
}

/* DJ page refinements */
.dj-card.kateon-card .dj-avatar { padding: 4px; }
.dj-card.kateon-card .dj-avatar .kateon-logo { width: 100%; height: 100%; max-width: none; max-height: none; padding: 0; object-fit: contain; transform: scale(1.18); }
.cta-strip { border: 1px solid #3a3a3a; border-radius: 6px; background: radial-gradient(circle at 85% 30%, #281033 0, transparent 38%), #0d0d0d; min-height: 116px; box-shadow: inset 0 0 0 1px #171717, 0 12px 35px #00000022; }
.cta-strip .eyebrow { margin: 0; }
.cta-strip h2 { margin: 6px 0 0; }
@media(max-width:850px){ .dj-card.kateon-card .dj-avatar .kateon-logo { transform: scale(1.12); } }

/* ========== Persistent sticky player ========== */
body {
  padding-bottom: 78px;
}
.sticky-player {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 100;
  display: flex;
  align-items: center;
  gap: 14px;
  height: 68px;
  padding: 0 20px;
  background: linear-gradient(180deg, #121212 0%, #0a0a0a 100%);
  border-top: 1px solid #2a2a2a;
  box-shadow: 0 -8px 32px rgba(0,0,0,.45);
  font-family: "Space Grotesk", Arial, sans-serif;
}
.sticky-player .player-play {
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 50%;
  background: var(--purple);
  color: #fff;
  font-size: 16px;
  cursor: pointer;
  display: grid;
  place-items: center;
  transition: transform .15s, background .2s, box-shadow .2s;
  box-shadow: 0 0 0 0 rgba(143,31,231,.4);
}
.sticky-player .player-play:hover {
  transform: scale(1.06);
  background: #9d3aef;
}
.sticky-player .player-play.playing {
  background: var(--orange);
  box-shadow: 0 0 18px rgba(255,118,0,.35);
}
.sticky-player .player-play.playing:hover {
  background: #ff8a1f;
}
.sticky-player .player-info {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
  line-height: 1.25;
}
.sticky-player .player-live {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font: 600 10px "DM Mono", monospace;
  letter-spacing: .14em;
  color: #ff5a5a;
  text-transform: uppercase;
}
.sticky-player .player-info strong {
  font-size: 14px;
  font-weight: 600;
  color: #f4f2ed;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sticky-player .player-status {
  font-size: 12px;
  color: var(--muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sticky-player .player-controls {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
}
.sticky-player .player-volume {
  width: 90px;
  height: 4px;
  -webkit-appearance: none;
  appearance: none;
  background: #333;
  border-radius: 2px;
  outline: none;
  cursor: pointer;
}
.sticky-player .player-volume::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #fff;
  cursor: pointer;
  box-shadow: 0 0 6px rgba(0,0,0,.4);
}
.sticky-player .player-volume::-moz-range-thumb {
  width: 14px;
  height: 14px;
  border: 0;
  border-radius: 50%;
  background: #fff;
  cursor: pointer;
}
.sticky-player .player-full {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border-radius: 8px;
  border: 1px solid #333;
  color: #bbb;
  font-size: 15px;
  transition: .2s;
}
.sticky-player .player-full:hover {
  border-color: var(--purple);
  color: #fff;
  background: #1a1a1a;
}
@media (max-width: 600px) {
  body { padding-bottom: 72px; }
  .sticky-player {
    height: 64px;
    padding: 0 12px;
    gap: 10px;
  }
  .sticky-player .player-play {
    width: 40px;
    height: 40px;
    font-size: 14px;
  }
  .sticky-player .player-volume {
    width: 60px;
  }
  .sticky-player .player-info strong {
    font-size: 13px;
  }
  .sticky-player .player-status {
    font-size: 11px;
  }
}

/* ============================================================
   MOTION + ROLLOVER LAYER
   Layout unchanged. Interactions only.
   ============================================================ */

:root {
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --spring: cubic-bezier(0.34, 1.4, 0.64, 1);
  --purple-glow: rgba(143, 31, 231, 0.35);
  --orange-glow: rgba(255, 118, 0, 0.3);
}

/* --- Brand / Logo --- */
.brand {
  transition: transform 0.35s var(--ease);
}
.brand:hover {
  transform: scale(1.05);
}
.brand img {
  transition: filter 0.4s var(--ease);
}
.brand:hover img {
  filter: drop-shadow(0 0 14px var(--purple-glow));
}

/* --- Nav underlines that draw --- */
.nav a {
  position: relative;
  transition: color 0.25s ease !important;
}
.nav a:not(.nav-live)::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 100%;
  height: 1.5px;
  background: var(--purple);
  transform: scaleX(0);
  transform-origin: right center;
  transition: transform 0.35s var(--ease);
}
.nav a:not(.nav-live):hover::after,
.nav a.active:not(.nav-live)::after {
  transform: scaleX(1);
  transform-origin: left center;
}
.nav-live {
  transition: border-color 0.3s, background 0.3s, box-shadow 0.3s, transform 0.25s var(--ease) !important;
}
.nav-live:hover {
  border-color: var(--purple) !important;
  background: rgba(143, 31, 231, 0.1);
  box-shadow: 0 0 18px var(--purple-glow);
  transform: translateY(-1px);
}
.nav-live span {
  animation: liveBeat 1.5s ease-in-out infinite;
}
@keyframes liveBeat {
  0%, 100% { opacity: 1; transform: scale(1); box-shadow: 0 0 12px #ff3c3c; }
  50% { opacity: 0.5; transform: scale(0.7); box-shadow: 0 0 6px #ff3c3c; }
}

/* --- Hero logo float + rings --- */
.hero-logo {
  transition: transform 0.5s var(--ease), filter 0.5s var(--ease);
  animation: floatY 5.5s ease-in-out infinite;
}
.hero-art:hover .hero-logo {
  transform: scale(1.06);
  filter: drop-shadow(0 14px 40px var(--purple-glow));
}
@keyframes floatY {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-8px); }
}
.ring {
  transition: border-color 0.4s;
}
.hero-art:hover .ring-a {
  border-color: rgba(143, 31, 231, 0.4);
}
.hero-art:hover .ring-b {
  border-color: rgba(255, 118, 0, 0.25);
}

/* Equalizer – stronger pulse */
.equalizer i {
  transform-origin: center bottom;
  animation: eqPulse 1.05s ease-in-out infinite !important;
}
@keyframes eqPulse {
  0%, 100% { transform: scaleY(0.45); opacity: 0.55; }
  50% { transform: scaleY(1); opacity: 1; }
}

/* --- Buttons --- */
.btn,
.btn-primary,
.btn-ghost,
a.btn {
  transition: transform 0.3s var(--ease), box-shadow 0.3s, background 0.25s, border-color 0.25s, color 0.25s !important;
}
.btn-primary:hover,
a.btn-primary:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 28px var(--purple-glow);
}
.btn-ghost:hover,
a.btn-ghost:hover {
  transform: translateY(-3px);
  border-color: var(--purple);
  box-shadow: 0 8px 20px rgba(0,0,0,0.3);
}

/* --- Play orb --- */
.play-orb {
  transition: transform 0.35s var(--spring), box-shadow 0.35s, background 0.25s !important;
}
.play-orb:hover {
  transform: scale(1.12) !important;
  box-shadow: 0 0 50px var(--purple-glow) !important;
  background: #9d35f0;
}

/* Meter bars */
.meter span {
  transform-origin: center bottom;
  animation: eqPulse 0.95s ease-in-out infinite !important;
}

/* --- Now strip --- */
.now {
  transition: border-color 0.35s, box-shadow 0.35s;
}
.now:hover {
  border-color: #3a2a4a;
  box-shadow: 0 10px 32px rgba(143, 31, 231, 0.08);
}

/* --- Feature cards --- */
.feature-card {
  transition: background 0.35s, transform 0.4s var(--ease) !important;
}
.feature-card:hover {
  background: #121212 !important;
  transform: translateY(-4px);
  z-index: 2;
}
.feature-card.featured:hover {
  background: linear-gradient(145deg, #1c1226, #0e0e0e) !important;
}
.feature-card .card-no {
  transition: color 0.3s;
}
.feature-card:hover .card-no {
  color: var(--purple);
}
.feature-card a {
  transition: gap 0.3s, color 0.25s, letter-spacing 0.25s;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.feature-card a:hover {
  gap: 10px;
  color: #ff8a1f;
}

/* --- DJ cards --- */
.dj-card {
  transition: border-color 0.35s, transform 0.4s var(--ease), box-shadow 0.4s !important;
}
.dj-card:hover {
  border-color: #3a2a4a !important;
  transform: translateY(-5px);
  box-shadow: 0 18px 40px rgba(0,0,0,0.4);
}
.dj-avatar {
  position: relative;
}
.dj-avatar img {
  transition: transform 0.45s var(--ease), filter 0.4s ease !important;
  transform-origin: center center;
  will-change: transform, filter;
}
.dj-card:hover .dj-avatar img {
  filter: drop-shadow(0 0 20px rgba(143, 31, 231, 0.5)) brightness(1.1);
  animation: djLogoRock 2.2s ease-in-out infinite;
}
@keyframes djLogoRock {
  0%   { transform: scale(1.1) rotate(-4deg); }
  50%  { transform: scale(1.14) rotate(4deg); }
  100% { transform: scale(1.1) rotate(-4deg); }
}
@media (prefers-reduced-motion: reduce) {
  .dj-card:hover .dj-avatar img {
    animation: none;
    transform: scale(1.1);
    filter: drop-shadow(0 0 14px rgba(143, 31, 231, 0.4));
  }
}

/* --- Merch cards --- */
.merch-card,
article.merch-card {
  transition: border-color 0.35s, transform 0.4s var(--ease), box-shadow 0.4s !important;
}
.merch-card:hover,
article.merch-card:hover {
  border-color: #3a2a4a !important;
  transform: translateY(-6px);
  box-shadow: 0 20px 44px rgba(0,0,0,0.4);
}
.merch-img img,
.merch-card img {
  transition: transform 0.55s var(--ease) !important;
}
.merch-card:hover img {
  transform: scale(1.07);
}

/* --- Social cards --- */
.social-card {
  transition: border-color 0.35s, transform 0.4s var(--ease), background 0.35s, box-shadow 0.4s !important;
}
.social-card:hover {
  border-color: var(--purple) !important;
  transform: translateY(-5px);
  background: #121212;
  box-shadow: 0 14px 36px rgba(143, 31, 231, 0.12);
}
.social-icon {
  transition: border-color 0.3s, transform 0.35s var(--spring), box-shadow 0.3s, background 0.3s !important;
}
.social-card:hover .social-icon {
  border-color: var(--purple) !important;
  transform: translateY(-3px) rotate(-4deg) !important;
  box-shadow: 0 0 22px var(--purple-glow);
  background: rgba(143, 31, 231, 0.1);
}
.social-arrow {
  transition: color 0.3s, transform 0.35s var(--ease) !important;
}
.social-card:hover .social-arrow {
  color: var(--purple) !important;
  transform: translate(4px, -4px);
}

/* --- Schedule --- */
.schedule-day {
  transition: border-color 0.35s, box-shadow 0.35s !important;
}
.schedule-day:hover {
  border-color: #3a3a3a !important;
  box-shadow: 0 14px 36px rgba(0,0,0,0.3);
}
.show {
  transition: background 0.25s !important;
}
.show:hover {
  background: rgba(143, 31, 231, 0.05) !important;
}
.schedule-listen {
  transition: border-color 0.3s, transform 0.3s var(--ease), box-shadow 0.3s !important;
}
.schedule-listen:hover {
  border-color: #714087 !important;
  transform: translateY(-3px);
  box-shadow: 0 10px 26px rgba(143, 31, 231, 0.15);
}
.listen-icon {
  transition: transform 0.3s var(--spring) !important;
}
.schedule-listen:hover .listen-icon {
  transform: scale(1.12);
}

/* --- Listen page --- */
.player-frame {
  transition: border-color 0.3s, box-shadow 0.3s !important;
}
.player-frame:hover {
  border-color: #3a2a4a;
  box-shadow: 0 12px 36px rgba(0,0,0,0.3);
}
.listen-notes article {
  transition: border-color 0.3s, transform 0.35s var(--ease) !important;
}
.listen-notes article:hover {
  border-color: #3a2a4a;
  transform: translateY(-4px);
}
.listen-disc img {
  animation: floatY 6.5s ease-in-out infinite;
  transition: filter 0.4s;
}
.listen-disc:hover img {
  filter: drop-shadow(0 12px 32px var(--purple-glow));
}

/* --- CTA strip --- */
.cta-strip {
  transition: border-color 0.35s, box-shadow 0.35s !important;
}
.cta-strip:hover {
  border-color: #4a2a5a;
  box-shadow: inset 0 0 0 1px #1a1a1a, 0 14px 36px rgba(143, 31, 231, 0.1);
}

/* --- Footer links --- */
.footer-links a {
  transition: color 0.25s !important;
}
.footer-links a:hover {
  color: var(--purple) !important;
}

/* --- Sticky player --- */
.sticky-player .player-play {
  transition: transform 0.2s var(--spring), background 0.25s, box-shadow 0.25s !important;
}
.sticky-player .player-play:hover {
  transform: scale(1.1) !important;
  box-shadow: 0 0 22px var(--purple-glow);
}
.sticky-player .player-play.playing {
  animation: playPulse 2s ease-in-out infinite;
}
@keyframes playPulse {
  0%, 100% { box-shadow: 0 0 14px var(--orange-glow); }
  50% { box-shadow: 0 0 26px rgba(255, 118, 0, 0.55); }
}
.sticky-player .player-full {
  transition: border-color 0.25s, color 0.25s, background 0.25s, transform 0.25s var(--ease) !important;
}
.sticky-player .player-full:hover {
  border-color: var(--purple) !important;
  color: #fff !important;
  background: #1a1a1a;
  transform: translateY(-1px);
}
.sticky-player .player-volume::-webkit-slider-thumb {
  transition: transform 0.15s;
}
.sticky-player .player-volume::-webkit-slider-thumb:hover {
  transform: scale(1.25);
}

/* --- Focus visibility (keyboard) --- */
a:focus-visible,
button:focus-visible {
  outline: 2px solid var(--purple);
  outline-offset: 3px;
}

/* ============================================================
   SPICE LAYER — more motion, still layout-safe
   ============================================================ */

/* Rings actually spin */
.ring-a {
  animation: spinCW 32s linear infinite;
}
.ring-b {
  animation: spinCCW 48s linear infinite;
}
@keyframes spinCW {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}
@keyframes spinCCW {
  from { transform: rotate(0deg); }
  to { transform: rotate(-360deg); }
}
.hero-art:hover .ring-a {
  animation-duration: 12s;
}
.hero-art:hover .ring-b {
  animation-duration: 18s;
}

/* Live dot + pulse already exist — tighten the beat */
.pulse,
.live-dot {
  animation: liveBeat 1.4s ease-in-out infinite !important;
}

/* Hero entrance (CSS only, respects reduced-motion) */
@media (prefers-reduced-motion: no-preference) {
  .hero-copy .eyebrow {
    animation: fadeUp 0.6s var(--ease) both;
  }
  .hero-copy h1 {
    animation: fadeUp 0.7s var(--ease) 0.08s both;
  }
  .hero-copy .lede {
    animation: fadeUp 0.7s var(--ease) 0.16s both;
  }
  .hero-actions {
    animation: fadeUp 0.7s var(--ease) 0.24s both;
  }
  .hero-art {
    animation: fadeIn 0.9s var(--ease) 0.12s both;
  }
}
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(18px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes fadeIn {
  from { opacity: 0; transform: scale(0.96); }
  to { opacity: 1; transform: scale(1); }
}

/* Stronger primary button press feel */
.btn-primary:active,
a.btn-primary:active {
  transform: translateY(-1px) scale(0.98);
}

/* Feature card edge flash on hover */
.feature-card::after {
  content: "";
  position: absolute;
  inset: 0;
  border: 1px solid transparent;
  pointer-events: none;
  transition: border-color 0.35s;
}
.feature-card:hover::after {
  border-color: rgba(143, 31, 231, 0.25);
}

/* DJ card tag color kick */
.dj-body .tag {
  transition: color 0.3s, letter-spacing 0.3s;
}
.dj-card:hover .dj-body .tag {
  color: var(--purple);
  letter-spacing: 0.18em;
}
.dj-body h2 {
  transition: color 0.3s;
}
.dj-card:hover .dj-body h2 {
  color: #fff;
}

/* Merch price / link energy */
.merch-body .price,
.merch-price {
  transition: color 0.25s;
}
.merch-card:hover .price,
.merch-card:hover .merch-price {
  color: #ff8a1f;
}
.merch-body a {
  transition: gap 0.3s, color 0.25s, transform 0.3s var(--ease) !important;
}
.merch-card:hover .merch-body a {
  transform: translateX(4px);
}

/* Social index number reacts */
.social-index {
  transition: color 0.3s;
}
.social-card:hover .social-index {
  color: var(--purple);
}
.social-name {
  transition: color 0.3s;
}
.social-card:hover .social-name {
  color: #fff;
}

/* Schedule day head accent */
.schedule-day-head {
  transition: background 0.3s;
}
.schedule-day:hover .schedule-day-head {
  background: #111;
}
.day-number {
  transition: color 0.3s, letter-spacing 0.3s;
}
.schedule-day:hover .day-number {
  color: #ff8a1f;
  letter-spacing: 0.18em;
}

/* Show time highlights when row hovered */
.show time {
  transition: color 0.25s;
}
.show:hover time {
  color: var(--purple);
}
.show strong {
  transition: color 0.25s;
}
.show:hover strong {
  color: #fff;
}

/* Sticky player — live label pulse when playing */
.sticky-player .player-play.playing ~ .player-info .player-live,
.sticky-player:has(.player-play.playing) .player-live {
  animation: liveBeat 1.2s ease-in-out infinite;
}

/* Volume track fills a bit more character */
.sticky-player .player-volume {
  transition: background 0.2s;
}
.sticky-player .player-volume:hover {
  background: #4a4a4a;
}

/* Menu toggle spin on open (mobile) */
.menu-toggle {
  transition: transform 0.3s var(--ease), color 0.2s !important;
}
.nav.open ~ .menu-toggle,
.menu-toggle:hover {
  color: var(--purple);
}

/* Footer brand weight */
footer strong {
  transition: color 0.25s;
}
footer:hover strong {
  color: #eee;
}

/* Respect reduced motion — kill the extra spice */
@media (prefers-reduced-motion: reduce) {
  .ring-a, .ring-b,
  .hero-logo, .listen-disc img,
  .equalizer i, .meter span,
  .pulse, .live-dot,
  .sticky-player .player-play.playing {
    animation: none !important;
  }
  .hero-copy .eyebrow,
  .hero-copy h1,
  .hero-copy .lede,
  .hero-actions,
  .hero-art {
    animation: none !important;
  }
}

/* ============================================================
   SCHEDULE PAGE — fancy hover / rollover layer
   Layout unchanged
   ============================================================ */

.schedule-day {
  transition: border-color 0.35s, box-shadow 0.4s, transform 0.4s var(--ease) !important;
}
.schedule-day:hover {
  border-color: #3a2a4a !important;
  box-shadow: 0 16px 42px rgba(0, 0, 0, 0.4), 0 0 0 1px rgba(143, 31, 231, 0.08);
  transform: translateY(-3px);
}

.schedule-day-head {
  transition: background 0.35s, border-color 0.35s !important;
  position: relative;
}
.schedule-day-head::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 0;
  height: 2px;
  background: linear-gradient(90deg, var(--purple), var(--orange), transparent);
  transition: width 0.45s var(--ease);
}
.schedule-day:hover .schedule-day-head {
  background: #121212 !important;
}
.schedule-day:hover .schedule-day-head::after {
  width: 100%;
}
.schedule-day-head h2 {
  transition: color 0.3s, letter-spacing 0.3s;
}
.schedule-day:hover .schedule-day-head h2 {
  color: #fff;
  letter-spacing: -0.01em;
}
.day-number {
  transition: color 0.3s, letter-spacing 0.3s, text-shadow 0.3s !important;
}
.schedule-day:hover .day-number {
  color: #ff8a1f !important;
  letter-spacing: 0.2em !important;
  text-shadow: 0 0 12px rgba(255, 118, 0, 0.4);
}
.day-line {
  transition: opacity 0.35s, background 0.35s;
}
.schedule-day:hover .day-line {
  background: linear-gradient(90deg, rgba(143, 31, 231, 0.5), transparent);
  opacity: 1;
}

/* Individual show rows */
.schedule-show {
  transition: background 0.28s, padding-left 0.35s var(--ease), border-color 0.28s !important;
  position: relative;
  border-left: 2px solid transparent;
}
.schedule-show:hover {
  background: linear-gradient(90deg, rgba(143, 31, 231, 0.08), #141014 40%) !important;
  padding-left: 30px !important;
  border-left-color: var(--purple);
}
.schedule-show time {
  transition: color 0.28s, letter-spacing 0.28s !important;
}
.schedule-show:hover time {
  color: var(--purple) !important;
  letter-spacing: 0.04em;
}
.schedule-show time b {
  transition: color 0.28s;
}
.schedule-show:hover time b {
  color: rgba(143, 31, 231, 0.6);
}
.show-info h3 {
  transition: color 0.28s, transform 0.3s var(--ease) !important;
}
.schedule-show:hover .show-info h3 {
  color: #fff !important;
  transform: translateX(3px);
}
.show-info p {
  transition: color 0.28s !important;
}
.schedule-show:hover .show-info p {
  color: #aaa !important;
}
.show-info p span,
.show-info small {
  transition: border-color 0.28s, color 0.28s, background 0.28s !important;
}
.schedule-show:hover .show-info p span,
.schedule-show:hover .show-info small {
  border-color: rgba(143, 31, 231, 0.45) !important;
  color: #c9a0f0 !important;
  background: rgba(143, 31, 231, 0.12) !important;
}

/* Recurring / overnight accent on hover */
.schedule-show.recurring:hover {
  background: linear-gradient(90deg, rgba(255, 118, 0, 0.07), #141014 45%) !important;
  border-left-color: var(--orange);
}
.schedule-show.recurring:hover time {
  color: var(--orange) !important;
}
.schedule-show.overnight:hover {
  background: linear-gradient(90deg, rgba(143, 31, 231, 0.1), #110d13 50%) !important;
}

/* Listen Live chip on schedule intro */
.schedule-listen {
  transition: border-color 0.3s, transform 0.35s var(--ease), box-shadow 0.35s, background 0.3s !important;
}
.schedule-listen:hover {
  border-color: var(--purple) !important;
  transform: translateY(-4px) !important;
  box-shadow: 0 12px 28px rgba(143, 31, 231, 0.2);
  background: #121212;
}
.listen-icon {
  transition: transform 0.35s var(--spring), background 0.3s, box-shadow 0.3s !important;
}
.schedule-listen:hover .listen-icon {
  transform: scale(1.14) !important;
  background: var(--purple) !important;
  color: #fff !important;
  box-shadow: 0 0 16px rgba(143, 31, 231, 0.45);
}

/* Legend dots */
.key-dot {
  transition: transform 0.3s var(--spring), box-shadow 0.3s;
}
.schedule-legend span:hover .key-dot {
  transform: scale(1.35);
  box-shadow: 0 0 10px currentColor;
}

/* Footer CTA card on schedule */
.schedule-footer-card {
  transition: border-color 0.35s, box-shadow 0.4s, transform 0.35s var(--ease) !important;
}
.schedule-footer-card:hover {
  border-color: #4a2a5a !important;
  box-shadow: 0 16px 40px rgba(143, 31, 231, 0.12);
  transform: translateY(-3px);
}

/* Zone labels subtle react */
.zone-item strong,
.viewer-zone {
  transition: color 0.3s;
}
.schedule-zone:hover .viewer-zone,
.schedule-zone:hover .zone-item strong {
  color: #ddd;
}

@media (prefers-reduced-motion: reduce) {
  .schedule-day:hover,
  .schedule-show:hover .show-info h3,
  .schedule-listen:hover {
    transform: none !important;
  }
}


}

/* Alive purple pulse + wave background */
body {
  background:
    radial-gradient(ellipse 90% 55% at 78% 10%, rgba(143, 31, 231, 0.11) 0%, transparent 55%),
    radial-gradient(ellipse 70% 50% at 12% 88%, rgba(143, 31, 231, 0.055) 0%, transparent 50%),
    radial-gradient(ellipse 50% 40% at 50% 50%, rgba(255, 118, 0, 0.02) 0%, transparent 60%),
    var(--bg) !important;
}

/* Layer 1 — slow breath / pulse */
body::before {
  content: "";
  position: fixed;
  inset: -12%;
  pointer-events: none;
  z-index: 0;
  background:
    radial-gradient(circle at 70% 15%, rgba(143, 31, 231, 0.18), transparent 38%),
    radial-gradient(circle at 15% 85%, rgba(143, 31, 231, 0.11), transparent 36%),
    radial-gradient(circle at 55% 45%, rgba(168, 85, 247, 0.06), transparent 48%);
  animation: pulseA 9s ease-in-out infinite;
  will-change: opacity, transform;
}

/* Layer 2 — drifting wave (offset phase) */
body::after {
  content: "";
  position: fixed;
  inset: -15%;
  pointer-events: none;
  z-index: 0;
  background:
    radial-gradient(ellipse 55% 40% at 30% 30%, rgba(143, 31, 231, 0.12), transparent 55%),
    radial-gradient(ellipse 45% 35% at 80% 70%, rgba(168, 85, 247, 0.09), transparent 50%),
    radial-gradient(ellipse 40% 30% at 50% 90%, rgba(255, 118, 0, 0.04), transparent 55%);
  animation: waveDrift 14s ease-in-out infinite;
  will-change: opacity, transform;
  mix-blend-mode: screen;
  opacity: 0.7;
}

@keyframes pulseA {
  0%, 100% {
    opacity: 0.45;
    transform: scale(1) translate(0, 0);
  }
  40% {
    opacity: 0.95;
    transform: scale(1.07) translate(-1.5%, 1%);
  }
  70% {
    opacity: 0.65;
    transform: scale(1.03) translate(1%, -0.8%);
  }
}

@keyframes waveDrift {
  0%, 100% {
    opacity: 0.4;
    transform: scale(1) translate(0, 0) rotate(0deg);
  }
  33% {
    opacity: 0.85;
    transform: scale(1.1) translate(3%, -2%) rotate(1.2deg);
  }
  66% {
    opacity: 0.55;
    transform: scale(1.05) translate(-2.5%, 2.5%) rotate(-0.8deg);
  }
}

main, .page, .schedule-page, footer, .hero, .feature-grid, .social-section {
  position: relative;
  z-index: 1;
}
.noise {
  z-index: 2;
}
.site-header {
  z-index: 30;
}
.sticky-player {
  position: fixed !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  z-index: 100 !important;
}

@media (prefers-reduced-motion: reduce) {
  body::before,
  body::after {
    animation: none !important;
    opacity: 0.55;
    transform: none;
  }
  body::after { mix-blend-mode: normal; }
}

/* ============================================================
   REFINED INTERACTIONS + SCHEDULE DJ AVATARS
   Simple, clean, presentable — no excess
   ============================================================ */

/* --- Schedule show layout with avatar --- */
.schedule-show {
  display: grid;
  grid-template-columns: 190px minmax(0, 1fr);
  align-items: center;
  min-height: 76px;
  padding: 12px 24px;
  border-bottom: 1px solid #1d1d1d;
  transition: background 0.22s ease, padding 0.22s ease, border-color 0.22s ease;
  position: relative;
}

.schedule-show:hover {
  background: #141014;
  padding-left: 28px;
}

.schedule-show .show-info {
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
}

.show-avatar {
  width: 44px;
  height: 44px;
  border-radius: 8px;
  object-fit: contain;
  background: #0c0c0c;
  border: 1px solid #2a2a2a;
  flex-shrink: 0;
  transition: border-color 0.22s ease, transform 0.22s ease, box-shadow 0.22s ease;
}

.show-avatar.placeholder {
  background: linear-gradient(145deg, #161616, #0e0e0e);
  border: 1px solid #222;
}

.schedule-show:hover .show-avatar:not(.placeholder) {
  border-color: #4a2a6a;
  transform: scale(1.06);
  box-shadow: 0 4px 14px rgba(143, 31, 231, 0.18);
}

.show-info h3 {
  margin: 0 0 2px;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1.25;
}

.show-info h3 small {
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.06em;
  color: var(--orange);
  margin-left: 6px;
  vertical-align: middle;
  text-transform: uppercase;
}

.show-info p {
  margin: 0;
  font-size: 13px;
  color: var(--muted);
  line-height: 1.3;
}

.show-info p span {
  display: inline-block;
  margin-left: 6px;
  font-size: 11px;
  color: #777;
  font-family: "DM Mono", monospace;
  letter-spacing: 0.02em;
}

/* Live state stays strong */
.schedule-show.is-live .show-avatar {
  border-color: var(--orange);
  box-shadow: 0 0 12px rgba(255, 118, 0, 0.25);
}

/* --- Day card hover polish --- */
.schedule-day {
  transition: border-color 0.25s ease, box-shadow 0.25s ease;
}

.schedule-day:hover {
  border-color: #353535;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.35);
}

/* --- DJ cards: clean lift + glow --- */
.dj-card {
  transition: transform 0.28s ease, border-color 0.28s ease, box-shadow 0.28s ease;
}

.dj-card:hover {
  transform: translateY(-4px);
  border-color: #3a2a4a;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.4), 0 0 0 1px rgba(143, 31, 231, 0.12);
}

.dj-avatar {
  transition: background 0.28s ease;
}

.dj-card:hover .dj-avatar {
  background: #121212;
}

.dj-card:hover .dj-avatar img {
  transform: scale(1.03);
}

.dj-avatar img {
  transition: transform 0.35s ease;
}

/* --- Feature cards --- */
.feature-card {
  transition: transform 0.25s ease, border-color 0.25s ease, background 0.25s ease;
}

.feature-card:hover {
  transform: translateY(-3px);
  border-color: #3a3a3a;
  background: #141414;
}

.feature-card a {
  transition: color 0.2s ease, letter-spacing 0.2s ease;
}

.feature-card:hover a {
  color: var(--purple);
  letter-spacing: 0.03em;
}

/* --- Buttons --- */
.btn {
  transition: transform 0.2s ease, background 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

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

.btn-primary:hover {
  box-shadow: 0 6px 20px rgba(143, 31, 231, 0.35);
}

.btn-ghost:hover {
  border-color: #666;
  background: rgba(255, 255, 255, 0.03);
}

/* --- Nav --- */
.nav a {
  position: relative;
  transition: color 0.22s ease;
}

.nav a:not(.nav-live)::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -6px;
  height: 1px;
  background: var(--purple);
  transform: scaleX(0);
  transform-origin: center;
  transition: transform 0.22s ease;
}

.nav a:not(.nav-live):hover::after,
.nav a.active:not(.nav-live)::after {
  transform: scaleX(1);
}

.nav-live {
  transition: border-color 0.22s ease, background 0.22s ease, box-shadow 0.22s ease;
}

.nav-live:hover {
  border-color: #888;
  background: rgba(255, 255, 255, 0.04);
  box-shadow: 0 0 16px rgba(255, 60, 60, 0.15);
}

/* --- Play orb / meter on home --- */
.play-orb {
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.play-orb:hover {
  transform: scale(1.08);
  box-shadow: 0 0 28px rgba(143, 31, 231, 0.4);
}

/* --- Schedule listen CTA --- */
.schedule-listen {
  transition: transform 0.22s ease, border-color 0.22s ease, background 0.22s ease;
}

.schedule-listen:hover {
  transform: translateY(-2px);
  border-color: #555;
  background: #141014;
}

/* --- Sticky player subtle feedback --- */
.player-play {
  transition: transform 0.2s ease, background 0.2s ease;
}

.player-play:hover {
  transform: scale(1.08);
}

/* --- Mobile schedule avatar --- */
@media (max-width: 700px) {
  .schedule-show {
    grid-template-columns: 1fr;
    gap: 8px;
    padding: 16px 18px;
  }

  .schedule-show:hover {
    padding-left: 21px;
  }

  .show-avatar {
    width: 38px;
    height: 38px;
  }

  .show-info h3 {
    font-size: 14px;
  }

  .show-info p {
    font-size: 12px;
  }
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  .schedule-show,
  .dj-card,
  .feature-card,
  .btn,
  .nav a::after,
  .play-orb,
  .show-avatar,
  .dj-avatar img {
    transition: none !important;
  }

  .dj-card:hover,
  .feature-card:hover,
  .btn:hover,
  .play-orb:hover {
    transform: none !important;
  }
}

/* ============================================================
   Day headers — no date-like numbers
   ============================================================ */
.schedule-day-head {
  display: flex !important;
  align-items: center;
  gap: 18px;
  padding: 18px 24px !important;
  background: #0d0d0d;
  border-bottom: 1px solid #252525;
  grid-template-columns: unset !important;
}

.schedule-day-head .day-label {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.schedule-day-head .day-label > span {
  font: 10px "DM Mono", monospace;
  color: #777;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.schedule-day-head .day-label h2,
.schedule-day-head h2 {
  margin: 0 !important;
  font-size: 26px !important;
  letter-spacing: -0.03em;
  line-height: 1.15;
}

.schedule-day-head .day-line {
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, #3a3a3a, transparent);
  margin-left: 4px;
}

/* Hide any leftover day-number elements */
.day-number {
  display: none !important;
}

@media (max-width: 700px) {
  .schedule-day-head {
    padding: 16px 18px !important;
  }
  .schedule-day-head .day-label h2,
  .schedule-day-head h2 {
    font-size: 22px !important;
  }
  .schedule-day-head .day-line {
    display: none;
  }
}

/* KateON schedule logo – tighter crop already applied; slight scale for legibility */
.show-avatar.kateon {
  object-fit: contain;
  padding: 2px;
  transform: scale(1.12);
}
.schedule-show:hover .show-avatar.kateon {
  transform: scale(1.18);
}

/* Keep the Guest DJs intro typography aligned with the Residents page heading. */
.guest-dj-head h2{font-size:clamp(52px,7vw,92px);line-height:.95;letter-spacing:-.06em;margin:15px 0}
.guest-dj-head>p:last-child{font-size:18px;color:var(--muted)}


/* Keep the Residents page headline on one line across screen sizes. */
.page-head h1{white-space:nowrap; font-size:clamp(38px,7vw,92px); letter-spacing:-.065em;}
@media(max-width:600px){.page-head h1{font-size:clamp(29px,8.3vw,48px); white-space:nowrap; letter-spacing:-.07em;}}


/* Homepage feature cards: icons, clear headings and animated arrows */
.feature-grid-four{grid-template-columns:repeat(4,minmax(0,1fr));gap:1px}
.feature-card{padding:30px 28px 32px;min-height:260px;overflow:hidden}
.feature-card .feature-icon{display:flex;align-items:center;justify-content:center;width:42px;height:42px;border:1px solid rgba(190,117,255,.38);border-radius:12px;background:rgba(137,66,180,.12);color:#d8a4ff;font-size:23px;line-height:1;margin:0 0 28px;transition:transform .28s ease,border-color .28s ease,background .28s ease}
.feature-card h3{font-size:clamp(20px,1.7vw,25px);line-height:1.15;margin:0 0 12px;letter-spacing:-.025em}
.feature-card p{font-size:15px;line-height:1.65;margin:0;min-height:74px}
.feature-card a{display:inline-flex;align-items:center;gap:10px;margin-top:22px;color:var(--orange);font-weight:700}
.feature-arrow{display:inline-block;font-size:19px;transform:translate(0,0);transition:transform .25s ease}
.feature-card:hover .feature-icon{transform:translateY(-3px) rotate(-4deg);border-color:rgba(216,164,255,.8);background:rgba(137,66,180,.22)}
.feature-card:hover .feature-arrow{transform:translate(5px,-3px)}
.feature-card.featured{background:linear-gradient(145deg,#17101e,#0b0b0b)}
@media(max-width:1050px){.feature-grid-four{grid-template-columns:repeat(2,minmax(0,1fr))}.feature-card h3{font-size:24px}}
@media(max-width:700px){.feature-grid-four{grid-template-columns:1fr}.feature-card{min-height:0;padding:25px 24px}.feature-card .feature-icon{margin-bottom:20px}.feature-card p{min-height:0}.feature-card a{margin-top:16px}}
@media(prefers-reduced-motion:reduce){.feature-card .feature-icon,.feature-arrow{transition:none!important}.feature-card:hover .feature-icon,.feature-card:hover .feature-arrow{transform:none!important}}


/* HOME SOCIAL CARDS — no numbered corners; clear labels and lively arrows */
.social-index{font:600 9px "DM Mono",monospace;letter-spacing:.11em;text-transform:uppercase;color:var(--purple);position:relative;z-index:1}
.social-description{display:block;max-width:85%;margin-top:8px;color:#888;font-size:13px;line-height:1.5;position:relative;z-index:1}
.social-arrow{font-size:22px;transition:color .25s ease,transform .25s ease}
.social-card:hover .social-arrow{color:var(--orange);transform:translate(5px,-5px)}
@media(prefers-reduced-motion:reduce){.social-card,.social-card:before,.social-card:after,.social-icon,.social-arrow{transition:none!important}}


/* =========================================================
   RESPONSIVE FINISHING PASS — desktop, tablet, mobile & TV
   Keeps the existing Be Kind Radio visual identity intact.
   ========================================================= */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { min-width: 320px; overflow-wrap: anywhere; }
img, video, iframe, canvas, svg { max-width: 100%; }
img { height: auto; }
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a, button { touch-action: manipulation; }
:focus-visible { outline: 2px solid var(--orange); outline-offset: 4px; }
.site-header, .hero, .now, .feature-grid, .page, .schedule-page,
.social-section, footer { min-width: 0; }
.hero > *, .now > *, .feature-grid > *, .dj-grid > *,
.listen-hero > *, .listen-notes > *, .day > *, .show > *,
.social-grid > *, .merch-grid > *, .feature-grid-four > * { min-width: 0; }
.nav a, .footer-links a { min-height: 40px; display: inline-flex; align-items: center; }
.menu-toggle { min-width: 44px; min-height: 44px; cursor: pointer; }
.feature-card, .dj-card, .social-card, .merch-card { min-width: 0; }
.feature-card h3, .dj-body h2, .show h3, .cta-strip h2 { overflow-wrap: anywhere; }
.player-frame, .shop-frame-wrap { min-width: 0; max-width: 100%; }
.player-frame iframe, .shop-frame { display: block; max-width: 100%; }
.schedule-zone { max-width: 100%; }
.schedule-show, .show { min-width: 0; }
footer { align-items: flex-start; }
.footer-links { flex-wrap: wrap; }

/* Large desktop / living-room TVs */
@media (min-width: 1600px) {
  :root { --max: 1480px; }
  body { font-size: 17px; }
  .site-header { padding-left: 36px; padding-right: 36px; height: 100px; }
  .brand img { width: 124px; height: 74px; }
  .nav { gap: 36px; font-size: 15px; }
  .hero { min-height: min(780px, 76vh); gap: clamp(36px, 4vw, 76px); padding-top: 85px; padding-bottom: 85px; }
  .hero h1 { font-size: clamp(88px, 6.2vw, 124px); }
  .lede, .page-head > p:last-child, .listen-hero p { font-size: 20px; }
  .feature-grid-four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .feature-card { padding: 38px; }
  .feature-card h3 { font-size: 30px; }
  .page, .schedule-page { padding-top: 92px; }
  .dj-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
  .dj-avatar { height: 290px; }
  .dj-body { padding: 30px; }
  .schedule-show, .show { padding-top: 30px; padding-bottom: 30px; }
  footer { font-size: 14px; }
}
@media (min-width: 2200px) {
  :root { --max: 1680px; }
  body { font-size: 19px; }
  .site-header, footer { padding-left: 44px; padding-right: 44px; }
  .hero { min-height: 820px; }
  .hero h1 { font-size: clamp(110px, 5.8vw, 150px); }
  .page-head h1 { font-size: clamp(96px, 5.2vw, 126px); }
  .feature-card { min-height: 280px; padding: 44px; }
  .feature-card h3 { font-size: 34px; }
}

/* Tablet landscape / smaller laptops */
@media (min-width: 851px) and (max-width: 1199px) {
  .site-header { padding-left: 22px; padding-right: 22px; }
  .nav { gap: clamp(12px, 1.8vw, 24px); font-size: 12px; }
  .hero { padding-left: 22px; padding-right: 22px; gap: 18px; }
  .hero h1 { font-size: clamp(52px, 6.4vw, 78px); }
  .ring-b { width: min(40vw, 460px); height: min(40vw, 460px); }
  .ring { width: min(34vw, 390px); height: min(34vw, 390px); }
  .now { margin-left: 22px; margin-right: 22px; }
  .feature-grid, .social-section { margin-left: auto; margin-right: auto; }
  .feature-card { padding: 26px; }
  .feature-card h3 { font-size: 23px; }
  .page, .schedule-page { padding-left: 22px; padding-right: 22px; }
  .dj-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .listen-hero { grid-template-columns: minmax(0, 1fr) 240px; gap: 28px; }
  .listen-disc { width: 230px; height: 230px; }
  .show { grid-template-columns: 90px minmax(0, 1fr) 24px; gap: 14px; }
}

/* Tablet portrait */
@media (max-width: 850px) {
  .site-header { position: relative; z-index: 40; }
  .nav { max-height: calc(100dvh - 74px); overflow-y: auto; }
  .hero, .listen-hero { min-width: 0; }
  .hero-art { width: 100%; overflow: hidden; }
  .now { grid-template-columns: minmax(0, 1fr) auto; }
  .feature-grid-four { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .social-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .schedule-page { padding-left: 22px; padding-right: 22px; }
  .schedule-head, .schedule-topline { flex-wrap: wrap; }
  .schedule-listen { max-width: 100%; }
  .listen-notes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .merch-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .shop-frame-wrap, .shop-frame { height: min(70vh, 620px); min-height: 420px; }
}

/* Mobile phones */
@media (max-width: 600px) {
  body { font-size: 15px; }
  .site-header { padding-left: 16px; padding-right: 12px; }
  .brand img { width: 88px; max-height: 58px; }
  .hero { padding: 30px 18px 38px; gap: 8px; }
  .hero-art { min-height: clamp(230px, 68vw, 300px); }
  .hero h1 { font-size: clamp(42px, 12vw, 58px); }
  .lede { font-size: 16px; }
  .hero-actions { gap: 10px; }
  .btn { min-height: 46px; padding: 0 15px; font-size: 12px; }
  .ring, .ring-b { max-width: 90vw; max-height: 90vw; }
  .now { grid-template-columns: minmax(0, 1fr) auto; gap: 12px; margin: 0 14px 36px; padding: 17px; }
  .now h2 { font-size: 23px; }
  .play-orb { width: 52px; height: 52px; }
  .feature-grid, .feature-grid-four, .social-section { margin-bottom: 56px; }
  .feature-grid-four, .social-grid, .listen-notes, .merch-grid { grid-template-columns: minmax(0, 1fr); }
  .feature-card { padding: 24px 21px; }
  .feature-card h3 { margin-top: 20px; font-size: 23px; }
  .page, .schedule-page { padding: 42px 18px 65px; }
  .page-head { margin-bottom: 38px; }
  .page-head h1 { font-size: clamp(37px, 10vw, 54px); white-space: normal; overflow-wrap: normal; }
  .page-head > p:last-child { font-size: 16px; }
  .dj-grid { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .dj-avatar { height: 220px; }
  .dj-body { padding: 21px; }
  .cta-strip { padding: 22px; margin-top: 42px; }
  .cta-strip h2 { font-size: 26px; }
  .day { grid-template-columns: 1fr; }
  .day-title { padding: 18px 16px; }
  .day-title strong { font-size: 22px; }
  .show { grid-template-columns: 76px minmax(0, 1fr); gap: 12px; padding: 17px 14px; }
  .show > :last-child { display: none; }
  .show h3 { font-size: 17px; line-height: 1.3; }
  .show p { font-size: 13px; }
  .listen-hero { gap: 24px; margin-bottom: 36px; }
  .listen-hero h1 { font-size: clamp(48px, 13vw, 68px); }
  .listen-hero p { font-size: 16px; }
  .listen-disc { width: min(64vw, 220px); height: min(64vw, 220px); }
  .player-head { padding: 0 12px; font-size: 10px; }
  .player-frame { min-height: 380px; }
  .player-frame iframe { height: 420px; }
  .listen-notes article { padding: 21px; }
  .listen-notes h3 { margin-top: 20px; }
  .shop-frame-wrap, .shop-frame { height: 520px; min-height: 420px; }
  .merch-card-media { height: 300px; }
  .merch-strip { padding: 22px; }
  .merch-strip h2 { font-size: 26px; }
  .social-section { padding-left: 18px; padding-right: 18px; }
  .social-card { padding: 22px; }
  .social-icon { margin-top: 18px; }
  footer { padding: 24px 18px; gap: 14px; }
  .footer-links { gap: 8px 16px; }
}

/* Very narrow phones */
@media (max-width: 380px) {
  .hero h1 { font-size: 40px; }
  .hero-actions { align-items: stretch; flex-direction: column; }
  .hero-actions .btn { width: 100%; }
  .now { grid-template-columns: minmax(0, 1fr); }
  .play-orb { display: none; }
  .show { grid-template-columns: 1fr; gap: 6px; }
  .show time { font-size: 11px; }
  .schedule-zone { flex-wrap: wrap; }
  .schedule-zone .zone-item { flex-basis: 100%; }
  .player-head .muted { display: none; }
}

/* Landscape phones / TV browser viewports */
@media (max-height: 500px) and (orientation: landscape) {
  .site-header { height: 64px; }
  .nav { top: 64px; }
  .hero { min-height: 0; padding-top: 24px; padding-bottom: 24px; }
  .hero-art { min-height: 220px; }
  .hero-logo { max-height: 50vh; width: auto; }
}

/* Avoid forced animation for users who prefer less motion */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}


/* Current track artwork and live metadata in the persistent player */
.sticky-player .player-cover {
  width: 46px;
  height: 46px;
  flex: 0 0 46px;
  object-fit: cover;
  border-radius: 7px;
  border: 1px solid rgba(255,255,255,.12);
  background: #171717;
}
.sticky-player .player-now-label {
  margin-left: 7px;
  color: var(--purple);
  letter-spacing: .08em;
}
.sticky-player #player-track {
  max-width: min(52vw, 680px);
}
@media (max-width: 600px) {
  .sticky-player { gap: 9px; padding: 0 10px; }
  .sticky-player .player-cover { width: 38px; height: 38px; flex-basis: 38px; }
  .sticky-player .player-controls { gap: 8px; }
  .sticky-player .player-volume { width: 58px; }
  .sticky-player .player-now-label { display: none; }
  .sticky-player #player-track { max-width: 43vw; font-size: 12px; }
  .sticky-player .player-status { font-size: 10px; }
}

/* Live Citrus3 connections in the persistent player */
.sticky-player .player-listeners { display:flex; align-items:center; gap:7px; flex-shrink:0; color:#eee; font-size:12px; font-weight:700; white-space:nowrap; padding:7px 10px; border:1px solid rgba(163,107,226,.3); background:rgba(111,54,155,.13); border-radius:999px; font-variant-numeric:tabular-nums; }
.sticky-player .listener-pulse { width:7px; height:7px; border-radius:50%; background:#40d68a; box-shadow:0 0 8px rgba(64,214,138,.6); }
.sticky-player .listener-label { color:#bdb5c8; font-weight:500; }
@media (max-width:600px) { .sticky-player .player-listeners { gap:5px; padding:6px 7px; font-size:11px; } .sticky-player .listener-label { display:none; } }

/* Phase 2 · Live station dashboard */
.station-dashboard{margin:clamp(32px,6vw,80px) auto;padding:clamp(22px,3vw,40px);border:1px solid rgba(255,255,255,.12);border-radius:24px;background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.012));}
.station-dashboard-head,.station-history-head,.station-panel-top{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.station-dashboard-head h2{margin:.3em 0 .9em;font-size:clamp(1.65rem,3vw,2.6rem)}
.station-dashboard-link{color:inherit;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:3px}
.station-dashboard-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:16px}
.station-panel,.station-history{border:1px solid rgba(255,255,255,.12);background:rgba(0,0,0,.18);border-radius:18px;padding:clamp(18px,2.4vw,28px);min-width:0}
.station-kicker{font-size:.72rem;letter-spacing:.14em;font-weight:800;color:#b8e8ba}
.station-timezone,.station-subtle{color:#aeb0bd;font-size:.86rem}
.station-show-content{display:flex;align-items:center;gap:20px;margin-top:22px}
.station-show-content img{width:96px;height:96px;object-fit:contain;background:rgba(255,255,255,.05);border-radius:14px;flex-shrink:0}
.station-panel h3{font-size:clamp(1.15rem,2vw,1.7rem);line-height:1.2;margin:12px 0 8px;overflow-wrap:anywhere}
.station-panel p{margin:6px 0}.station-countdown{display:inline-block;margin-top:20px;padding:8px 12px;border-radius:999px;background:rgba(130,225,145,.12);color:#b8e8ba;font-size:.85rem}
.station-history{margin-top:16px}.station-history-head h3{margin:6px 0 18px;font-size:1.35rem}
.station-track-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 22px}
.station-track-list li{padding:13px 0;border-top:1px solid rgba(255,255,255,.09);display:flex;gap:15px;align-items:flex-start;overflow-wrap:anywhere;font-size:.93rem}
.station-track-index{color:#b8e8ba;font-weight:800;font-size:.8rem;flex-shrink:0}
@media(max-width:760px){.station-dashboard-grid,.station-track-list{grid-template-columns:1fr}.station-dashboard{padding:18px;border-radius:18px}.station-show-content{gap:14px}.station-show-content img{width:74px;height:74px}.station-dashboard-head h2{margin-bottom:10px}}
@media(prefers-reduced-motion:reduce){.station-dashboard *{animation:none!important;transition:none!important}}

/* Cross-device hardening: narrow phones, touch tablets, desktop, TV remote focus */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { max-width: 100%; }
main, section, article, nav { min-width: 0; }
.sticky-player { max-width: 100%; }
.sticky-player button, .sticky-player input { touch-action: manipulation; }
.station-dashboard-grid > *, .station-show-content > *, .station-track-list > * { min-width: 0; }
@media (max-width: 600px) {
  .station-dashboard { max-width: calc(100% - 24px); margin-left: auto; margin-right: auto; }
  .station-dashboard-head { flex-wrap: wrap; }
  .station-show-content { min-width: 0; }
  .sticky-player { padding-bottom: max(8px, env(safe-area-inset-bottom)); }
}
@media (hover: none) and (pointer: coarse) {
  .nav a, .footer-links a, .btn, .menu-toggle { min-height: 44px; }
}
@media (min-width: 1920px) {
  :focus-visible { outline-width: 4px; outline-offset: 5px; }
  .nav a:focus-visible, .btn:focus-visible, button:focus-visible { border-radius: 5px; }
}

/* Phase 3: DJ Directory — visual enhancements scoped to directory */
.directory-heading{max-width:880px}.directory-tools{background:linear-gradient(125deg,rgba(117,54,171,.19),rgba(241,128,45,.08));border:1px solid rgba(255,255,255,.13);border-radius:20px;padding:22px;margin:28px 0 36px;display:flex;align-items:center;flex-wrap:wrap;gap:12px}.directory-tools label{font-weight:700}.directory-tools input{background:#15121c;color:#fff;border:1px solid rgba(255,255,255,.28);border-radius:12px;padding:13px 16px;min-height:48px;flex:1 1 260px;min-width:0;font:inherit}.directory-tools input:focus-visible,.directory-filter:focus-visible,.directory-links a:focus-visible{outline:3px solid #f5a35c;outline-offset:3px}.directory-filters{display:flex;gap:8px;flex-wrap:wrap}.directory-filter{cursor:pointer;border:1px solid rgba(255,255,255,.22);border-radius:100px;background:#211a2b;color:#fff;padding:11px 16px;font:inherit;font-weight:700;min-height:44px}.directory-filter.is-active{background:#e98a3d;color:#170e1d;border-color:#e98a3d}.directory-count{width:100%;margin:0;opacity:.78;font-size:.9rem}.directory-section{margin:28px 0 52px}.directory-section-head{display:flex;align-items:end;justify-content:space-between;gap:12px;margin-bottom:22px}.directory-section-head h2{font-size:clamp(1.5rem,3vw,2.4rem);margin:4px 0 0}.directory-section-count{color:#d9c6eb;white-space:nowrap}.directory-grid{align-items:stretch}.directory-card{display:flex;flex-direction:column;min-width:0;overflow:hidden;transition:transform .2s ease,border-color .2s ease}.directory-card:hover{transform:translateY(-3px);border-color:rgba(235,143,67,.55)}.directory-art{display:flex;align-items:center;justify-content:center;min-height:190px;max-height:240px;padding:22px;background:radial-gradient(circle at 50% 38%,rgba(132,66,189,.24),rgba(12,10,17,.35) 70%)}.directory-art img{width:100%;height:175px;object-fit:contain;display:block}.directory-card .dj-body{display:flex;flex:1;flex-direction:column}.directory-card h3{font-size:1.3rem;margin:6px 0 10px}.directory-bio{line-height:1.65;overflow-wrap:anywhere}.directory-links{display:flex;flex-wrap:wrap;gap:7px;margin-top:auto;padding-top:16px}.directory-links a{color:#f7bd86;border:1px solid rgba(247,189,134,.32);border-radius:7px;padding:7px 10px;font-size:.78rem;text-decoration:none;overflow-wrap:anywhere}.directory-links a:hover{background:rgba(247,189,134,.13)}.directory-empty{padding:24px;border:1px dashed rgba(255,255,255,.3);border-radius:14px}.directory-card[hidden],.directory-section[hidden],.directory-empty[hidden]{display:none!important}@media(max-width:640px){.directory-tools{padding:16px}.directory-tools input{flex-basis:100%}.directory-section-head{align-items:center}.directory-art{min-height:160px}.directory-art img{height:145px}}@media(prefers-reduced-motion:reduce){.directory-card{transition:none}.directory-card:hover{transform:none}}

/* Homepage social cards: clean four-across neon layout */
.social-section{position:relative;isolation:isolate;overflow:hidden;padding-top:8px;padding-bottom:18px}
.social-section:before{margin-bottom:44px;background:linear-gradient(90deg,transparent,rgba(166,35,255,.55),rgba(255,35,202,.35),transparent)}
.social-section-head{align-items:center;gap:36px;margin-bottom:34px}
.social-section-head .eyebrow{letter-spacing:.22em}
.social-section-head h2{font-size:clamp(38px,5.2vw,66px);line-height:1.02;letter-spacing:-.06em}
.social-section-head h2 em{background:linear-gradient(100deg,#ef24db,#8b28ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.socials-intro{max-width:420px;color:#b8b5c6;font-size:15px;line-height:1.7}
.social-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;background:transparent;border:0;align-items:stretch}
.social-card{min-width:0;min-height:340px;padding:25px 24px 26px;border:1px solid rgba(255,255,255,.15);border-radius:20px;background:linear-gradient(145deg,rgba(22,16,38,.96),rgba(8,10,19,.98) 72%);box-shadow:inset 0 1px 0 rgba(255,255,255,.035);transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}
.social-card:before{height:4px;transform:scaleX(1);opacity:.65;background:var(--social-accent,#9b2cff)}
.social-card:after{width:190px;height:190px;right:-80px;top:auto;bottom:-115px;background:var(--social-accent,#9b2cff);opacity:.22;filter:blur(28px)}
.social-card:nth-child(1){--social-accent:#ff19b8;border-color:rgba(255,25,184,.65);background:linear-gradient(145deg,rgba(68,10,59,.55),rgba(9,10,21,.97) 70%)}
.social-card:nth-child(2){--social-accent:#ff233f;border-color:rgba(255,35,63,.65);background:linear-gradient(145deg,rgba(65,12,24,.6),rgba(9,10,21,.97) 70%)}
.social-card:nth-child(3){--social-accent:#078dff;border-color:rgba(7,141,255,.65);background:linear-gradient(145deg,rgba(7,34,70,.65),rgba(9,10,21,.97) 70%)}
.social-card:nth-child(4){--social-accent:#a326ff;border-color:rgba(163,38,255,.7);background:linear-gradient(145deg,rgba(47,12,83,.65),rgba(9,10,21,.97) 70%)}
.social-card:nth-child(5){--social-accent:#9146ff;border-color:rgba(145,70,255,.7);background:linear-gradient(145deg,rgba(54,23,97,.65),rgba(9,10,21,.97) 70%)}
.social-icon-twitch svg{display:block;width:34px;height:34px;fill:currentColor}
.social-card:hover{transform:translateY(-5px);border-color:var(--social-accent);box-shadow:0 15px 38px color-mix(in srgb,var(--social-accent) 16%,transparent)}
.social-card:before{background:linear-gradient(90deg,var(--social-accent),transparent)}
.social-index{font-size:9px;letter-spacing:.12em;color:var(--social-accent);line-height:1.5}
.social-icon{width:68px;height:68px;flex:0 0 68px;margin:25px 0 19px;border-radius:50%;border:0;background:var(--social-accent);color:white;box-shadow:0 0 25px color-mix(in srgb,var(--social-accent) 24%,transparent);font-size:24px}
.social-icon-instagram:before{width:29px;height:29px;border-width:3px;border-radius:9px}.social-icon-instagram:after{width:10px;height:10px;border-width:3px}.social-icon-instagram span{width:4px;height:4px;top:17px;right:17px}
.social-icon-youtube{font-size:22px}.social-icon-facebook{font-size:40px;padding-bottom:3px}
.social-name{font-size:clamp(20px,1.7vw,27px);margin-bottom:8px;overflow-wrap:anywhere}
.social-description{font-size:14px;line-height:1.55;color:#c3c1ce;max-width:250px}
.social-handle{font-size:12px;color:var(--social-accent);margin-top:10px;overflow-wrap:anywhere;line-height:1.5}
.social-arrow{width:42px;height:42px;display:grid;place-items:center;border:2px solid var(--social-accent);border-radius:50%;right:22px;bottom:20px;color:#fff;font-size:21px;background:rgba(5,5,12,.3)}
.social-card:hover .social-arrow{color:#fff;transform:translate(3px,-2px)}
@media(max-width:1050px){.social-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.social-card{min-height:300px}.social-name{font-size:25px}}
@media(max-width:600px){.social-section-head{display:block}.socials-intro{margin-top:18px}.social-grid{grid-template-columns:minmax(0,1fr);gap:13px}.social-card{min-height:260px;padding:23px}.social-icon{margin-top:20px}.social-name{font-size:24px}.social-section:before{margin-bottom:36px}}
@media(prefers-reduced-motion:reduce){.social-card,.social-card:before,.social-card:after,.social-icon,.social-arrow{transition:none!important}.social-card:hover{transform:none}}

/* Homepage feature cards: bring the main navigation cards in line with the neon social section */
.feature-grid-four{
  gap:18px!important;background:transparent!important;align-items:stretch;
  margin-top:8px;margin-bottom:100px;
}
.feature-grid-four .feature-card{
  --feature-accent:#a326ff;position:relative;isolation:isolate;overflow:hidden;min-width:0;
  display:flex;flex-direction:column;align-items:flex-start;min-height:310px;
  padding:27px 25px 25px;border:1px solid color-mix(in srgb,var(--feature-accent) 62%,transparent);
  border-radius:20px;
  background:linear-gradient(145deg,color-mix(in srgb,var(--feature-accent) 15%,#100c19),#080a13 72%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 8px 28px rgba(0,0,0,.14);
  transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease;
}
.feature-grid-four .feature-card:nth-child(1){--feature-accent:#b6f23a}
.feature-grid-four .feature-card:nth-child(2){--feature-accent:#ffb347}
.feature-grid-four .feature-card:nth-child(3){--feature-accent:#26e0c2}
.feature-grid-four .feature-card:nth-child(4){--feature-accent:#f4dc55}
.feature-grid-four .feature-card::before{
  content:"";position:absolute;z-index:-1;top:0;left:0;right:0;height:4px;
  background:linear-gradient(90deg,var(--feature-accent),transparent);opacity:.9;
}
.feature-grid-four .feature-card::after{
  content:"";position:absolute;z-index:-1;width:190px;height:190px;right:-85px;bottom:-125px;
  border-radius:50%;background:var(--feature-accent);opacity:.2;filter:blur(32px);
  transition:opacity .25s ease,transform .25s ease;
}
.feature-grid-four .feature-card:hover{
  transform:translateY(-5px);border-color:var(--feature-accent);
  box-shadow:0 16px 38px color-mix(in srgb,var(--feature-accent) 17%,transparent),inset 0 1px 0 rgba(255,255,255,.06);
}
.feature-grid-four .feature-card:hover::after{opacity:.34;transform:scale(1.12)}
.feature-grid-four .feature-card .feature-icon{
  width:58px;height:58px;flex:0 0 58px;margin:0 0 24px;border-radius:16px;
  border:1px solid color-mix(in srgb,var(--feature-accent) 70%,transparent);
  background:color-mix(in srgb,var(--feature-accent) 16%,#0b0b12);color:var(--feature-accent);
  box-shadow:0 0 25px color-mix(in srgb,var(--feature-accent) 19%,transparent);font-size:26px;
}
.feature-grid-four .feature-card:hover .feature-icon{transform:translateY(-2px);background:color-mix(in srgb,var(--feature-accent) 24%,#0b0b12)}
.feature-grid-four .feature-card h3{font-size:clamp(21px,1.7vw,27px);line-height:1.12;margin:0 0 12px;letter-spacing:-.035em}
.feature-grid-four .feature-card p{font-size:14px;line-height:1.65;color:#c3c1ce;min-height:70px;margin:0;max-width:290px}
.feature-grid-four .feature-card a{display:inline-flex;align-items:center;gap:10px;margin-top:auto;padding-top:22px;color:var(--feature-accent);font-size:13px;font-weight:700}
.feature-grid-four .feature-card .feature-arrow{display:inline-grid;place-items:center;width:32px;height:32px;border:1px solid var(--feature-accent);border-radius:50%;color:#fff;font-size:17px;transition:transform .2s ease,background .2s ease}
.feature-grid-four .feature-card a:hover .feature-arrow{transform:translate(3px,-2px);background:color-mix(in srgb,var(--feature-accent) 20%,transparent)}
@media(max-width:1050px){.feature-grid-four{grid-template-columns:repeat(2,minmax(0,1fr));gap:15px!important}.feature-grid-four .feature-card{min-height:285px}}
@media(max-width:600px){.feature-grid-four{grid-template-columns:minmax(0,1fr);gap:13px!important;margin-bottom:65px}.feature-grid-four .feature-card{min-height:245px;padding:23px}.feature-grid-four .feature-card .feature-icon{margin-bottom:20px}.feature-grid-four .feature-card p{min-height:0;margin-bottom:18px}}
@media(prefers-reduced-motion:reduce){.feature-grid-four .feature-card,.feature-grid-four .feature-card::after,.feature-grid-four .feature-icon,.feature-grid-four .feature-arrow{transition:none!important}.feature-grid-four .feature-card:hover{transform:none}}

/* DJ directory: consistent icon-only social buttons */
.directory-links{gap:9px;align-items:center}
.directory-links a.directory-social-icon{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;min-width:42px;padding:0;border-radius:50%;color:#f4edf9;background:rgba(133,74,179,.18);border:1px solid rgba(220,178,245,.35);transition:background .18s ease,transform .18s ease,border-color .18s ease}
.directory-links a.directory-social-icon svg{display:block;width:21px;height:21px;flex:none}
.directory-links a.directory-social-icon:hover{background:rgba(166,71,224,.38);border-color:#df9bff;transform:translateY(-2px)}
.directory-links a.directory-social-icon:focus-visible{outline:3px solid #f5a35c;outline-offset:3px}
@media(prefers-reduced-motion:reduce){.directory-links a.directory-social-icon{transition:none}.directory-links a.directory-social-icon:hover{transform:none}}

/* Branded colors for DJ directory social links */
.directory-links a.directory-social-icon.social-facebook{background:#1877F2;color:#fff;border-color:transparent}
.directory-links a.directory-social-icon.social-facebook:hover{background:#1877F2;color:#fff;border-color:rgba(255,255,255,.65);filter:brightness(1.15)}
.directory-links a.directory-social-icon.social-instagram{background:#C13584;color:#fff;border-color:transparent}
.directory-links a.directory-social-icon.social-instagram:hover{background:#C13584;color:#fff;border-color:rgba(255,255,255,.65);filter:brightness(1.15)}
.directory-links a.directory-social-icon.social-youtube{background:#FF0033;color:#fff;border-color:transparent}
.directory-links a.directory-social-icon.social-youtube:hover{background:#FF0033;color:#fff;border-color:rgba(255,255,255,.65);filter:brightness(1.15)}
.directory-links a.directory-social-icon.social-twitch{background:#9146FF;color:#fff;border-color:transparent}
.directory-links a.directory-social-icon.social-twitch:hover{background:#9146FF;color:#fff;border-color:rgba(255,255,255,.65);filter:brightness(1.15)}
.directory-links a.directory-social-icon.social-mixcloud{background:#F77E0B;color:#fff;border-color:transparent}
.directory-links a.directory-social-icon.social-mixcloud:hover{background:#F77E0B;color:#fff;border-color:rgba(255,255,255,.65);filter:brightness(1.15)}
.directory-links a.directory-social-icon.social-soundcloud{background:#FF5500;color:#fff;border-color:transparent}
.directory-links a.directory-social-icon.social-soundcloud:hover{background:#FF5500;color:#fff;border-color:rgba(255,255,255,.65);filter:brightness(1.15)}
.directory-links a.directory-social-icon.social-tiktok{background:#17171B;color:#fff;border-color:transparent}
.directory-links a.directory-social-icon.social-tiktok:hover{background:#17171B;color:#fff;border-color:rgba(255,255,255,.65);filter:brightness(1.15)}
.directory-links a.directory-social-icon.social-linktree{background:#43E660;color:#102318;border-color:transparent}
.directory-links a.directory-social-icon.social-linktree:hover{background:#43E660;color:#102318;border-color:rgba(255,255,255,.65);filter:brightness(1.15)}
.directory-links a.directory-social-icon.social-website{background:#3566BC;color:#fff;border-color:transparent}
.directory-links a.directory-social-icon.social-website:hover{background:#3566BC;color:#fff;border-color:rgba(255,255,255,.65);filter:brightness(1.15)}
.directory-links a.directory-social-icon.social-twitter{background:#1DA1F2;color:#fff;border-color:transparent}
.directory-links a.directory-social-icon.social-twitter:hover{background:#1DA1F2;color:#fff;border-color:rgba(255,255,255,.65);filter:brightness(1.15)}
.directory-links a.directory-social-icon.social-x{background:#17171B;color:#fff;border-color:transparent}
.directory-links a.directory-social-icon.social-x:hover{background:#17171B;color:#fff;border-color:rgba(255,255,255,.65);filter:brightness(1.15)}
.directory-links a.directory-social-icon.social-bandcamp{background:#1DA0C3;color:#fff;border-color:transparent}
.directory-links a.directory-social-icon.social-bandcamp:hover{background:#1DA0C3;color:#fff;border-color:rgba(255,255,255,.65);filter:brightness(1.15)}
.directory-links a.directory-social-icon.social-spotify{background:#1DB954;color:#101c13;border-color:transparent}
.directory-links a.directory-social-icon.social-spotify:hover{background:#1DB954;color:#101c13;border-color:rgba(255,255,255,.65);filter:brightness(1.15)}
 .directory-links a.directory-social-icon{box-shadow:0 3px 12px rgba(0,0,0,.22)}

/* Promotional flyer: hidden until JavaScript explicitly opens it. */
.promo-overlay[hidden]{display:none!important}
.promo-overlay{position:fixed;inset:0;z-index:10000;display:grid;place-items:center;padding:16px;background:rgba(0,0,0,.84);backdrop-filter:blur(5px)}
.promo-dialog{position:relative;max-width:min(440px,calc(100vw - 32px));max-height:calc(100dvh - 32px);display:flex;align-items:center;justify-content:center}
.promo-flyer{display:block;width:auto;max-width:100%;height:auto;max-height:calc(100dvh - 32px);object-fit:contain;border-radius:8px;box-shadow:0 18px 65px #000a}
.promo-close{position:absolute;top:10px;right:10px;z-index:1;display:grid;place-items:center;width:44px;height:44px;border:1px solid #ffffffa6;border-radius:50%;background:#171020e8;color:#fff;font:700 28px/1 Arial,sans-serif;cursor:pointer;box-shadow:0 2px 12px #0009}
.promo-close:hover,.promo-close:focus-visible{background:#63268b;outline:2px solid #fff;outline-offset:2px}
@media(max-width:480px){.promo-overlay{padding:10px}.promo-dialog{max-width:calc(100vw - 20px);max-height:calc(100dvh - 20px)}.promo-flyer{max-height:calc(100dvh - 20px)}}

/* Published host / schedule notes: distinct from recurrence badges. */
.schedule-show .show-info > div { min-width: 0; flex: 1 1 auto; }
.schedule-show .show-info h3 { overflow-wrap: break-word; }
.schedule-show .show-info .published-schedule-notes {
  display: block; margin: 7px 0 0; color: #d6c4e8;
  font-size: 12px; line-height: 1.45; font-weight: 500;
  overflow-wrap: anywhere; white-space: normal;
}
.schedule-show .show-info .published-schedule-notes::before {
  content: 'SCHEDULE NOTE'; display: inline-block; margin-right: 8px;
  color: #b98bea; font: 700 9px 'DM Mono', monospace;
  letter-spacing: .07em; vertical-align: baseline;
}

/* BKR compact, stationary playback state badge */
.sticky-player .player-live { display: none; }
.sticky-player .player-status {
  display: inline-flex; align-items: center; align-self: flex-start;
  gap: 6px; max-width: 100%; width: max-content;
  padding: 4px 9px; border-radius: 999px;
  font: 600 11px/1.2 "DM Mono", monospace;
  letter-spacing: 0; white-space: nowrap; overflow: visible;
  text-overflow: clip; animation: none !important; transform: none !important;
  background: #29292d; color: #d6d6d8;
}
.sticky-player .player-status-icon { font-size: 12px; line-height: 1; animation: none !important; }
.sticky-player .player-status--live { background: #0c2a1a; color: #38df81; }
.sticky-player .player-status--paused { background: #29292d; color: #d6d6d8; }
.sticky-player .player-status--connecting,
.sticky-player .player-status--reconnecting { background: #36210e; color: #ffa047; }
.sticky-player .player-status--offline { background: #35191d; color: #ff6974; }
@media (max-width: 600px) {
  .sticky-player .player-status { font-size: 10px; padding: 3px 7px; }
}

/* Homepage Follow cards: center Instagram, Facebook and Twitch glyphs inside their color discs. */
.social-card .social-icon-instagram,.social-card .social-icon-facebook,.social-card .social-icon-twitch{display:grid;place-items:center;align-items:center;justify-items:center;padding:0;line-height:1;box-sizing:border-box}
.social-card .social-icon-instagram::before,.social-card .social-icon-instagram::after{top:50%;left:50%;right:auto;bottom:auto;transform:translate(-50%,-50%);box-sizing:border-box}
.social-card .social-icon-instagram span{position:absolute;top:calc(50% - 9px);left:calc(50% + 9px);right:auto;bottom:auto;transform:translate(-50%,-50%)}
.social-card .social-icon-facebook{font-family:Arial,sans-serif;font-weight:700;font-size:40px;line-height:1;align-items:center;padding:0;text-indent:0}
.social-card .social-icon-twitch svg{display:block;width:34px;height:34px;margin:auto;flex:none}