/* HAL SUPREME Radio — black / gold / cyan broadcast room */
.radio-body{--gold:#f2c46d;--gold-2:#ffdf9e;--cyan:#55dff5;--ink:#07080b;background:radial-gradient(1100px 620px at 78% -10%,rgba(242,196,109,.16),transparent 62%),radial-gradient(900px 640px at -10% 30%,rgba(85,223,245,.12),transparent 64%),radial-gradient(700px 500px at 90% 95%,rgba(168,135,255,.10),transparent 70%),var(--ink)}
.rd-shell{max-width:1240px;margin:0 auto;padding:clamp(18px,4vw,48px) clamp(16px,4vw,40px) 64px}
.rd-stage{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr);gap:clamp(24px,5vw,72px);align-items:center;min-height:min(78vh,820px)}
.rd-kicker{display:inline-flex;align-items:center;gap:10px;padding:7px 14px 7px 10px;border:1px solid rgba(242,196,109,.35);border-radius:999px;background:linear-gradient(90deg,rgba(242,196,109,.12),rgba(85,223,245,.06));font:600 12px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--gold-2)}
.rd-dot{width:9px;height:9px;border-radius:50%;background:#7b8494;box-shadow:0 0 0 0 rgba(255,59,59,.6)}
[data-live=live] .rd-dot{background:#ff3b3b;animation:rdPulse 1.6s ease-out infinite}
@keyframes rdPulse{0%{box-shadow:0 0 0 0 rgba(255,59,59,.65)}100%{box-shadow:0 0 0 12px rgba(255,59,59,0)}}
.rd-copy h1{margin:22px 0 14px;font-size:clamp(44px,7.4vw,96px);line-height:.92;letter-spacing:-.045em;font-weight:800;background:linear-gradient(100deg,#fff 0%,#f6efe0 38%,var(--gold) 62%,var(--cyan) 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.rd-copy h1 em{font-style:italic;font-weight:300;letter-spacing:-.02em}
.rd-lede{max-width:56ch;color:#b9c1cc;font-size:clamp(16px,1.6vw,19px);margin:0 0 26px}
.rd-label{display:block;font:600 11px/1 var(--mono);letter-spacing:.18em;text-transform:uppercase;color:var(--gold)}
.rd-now{position:relative;overflow:hidden;padding:20px 22px 18px;border-radius:18px;border:1px solid rgba(255,255,255,.09);background:linear-gradient(160deg,rgba(18,21,26,.92),rgba(10,12,16,.92));box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 30px 80px -40px rgba(242,196,109,.35)}
.rd-now::before{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1px;background:linear-gradient(120deg,rgba(242,196,109,.6),transparent 40%,rgba(85,223,245,.5));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.rd-now strong{display:block;margin:10px 0 4px;font-size:clamp(19px,2.2vw,25px);line-height:1.2;letter-spacing:-.01em}
.rd-meta{color:var(--muted);font:500 13px/1.4 var(--mono)}
.rd-eq{position:absolute;right:20px;top:20px;display:flex;gap:3px;align-items:flex-end;height:22px}
.rd-eq i{width:3px;height:30%;border-radius:2px;background:linear-gradient(var(--gold-2),var(--cyan));opacity:.4}
[data-live=live] .rd-eq i{opacity:1;animation:rdEq 1.1s ease-in-out infinite}
.rd-eq i:nth-child(2){animation-delay:-.3s}.rd-eq i:nth-child(3){animation-delay:-.7s}.rd-eq i:nth-child(4){animation-delay:-.15s}.rd-eq i:nth-child(5){animation-delay:-.5s}.rd-eq i:nth-child(6){animation-delay:-.9s}.rd-eq i:nth-child(7){animation-delay:-.4s}
@keyframes rdEq{0%,100%{height:22%}50%{height:100%}}
.rd-actions{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0}
.rd-btn{display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border-radius:12px;border:1px solid rgba(255,255,255,.14);color:var(--text);text-decoration:none;font-weight:600;font-size:14.5px;background:rgba(255,255,255,.03);transition:transform .18s ease,border-color .18s ease,background .18s ease}
.rd-btn:hover{transform:translateY(-1px);border-color:rgba(242,196,109,.55)}
.rd-btn.primary{color:#120d02;border-color:transparent;background:linear-gradient(135deg,var(--gold-2),var(--gold) 55%,#d99a2b);box-shadow:0 12px 30px -12px rgba(242,196,109,.7)}
.rd-btn.ghost{border-style:dashed}
.rd-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;margin:6px 0 0;border:1px solid rgba(255,255,255,.08);border-radius:14px;overflow:hidden;background:rgba(255,255,255,.08)}
.rd-facts div{padding:12px 14px;background:rgba(9,11,14,.94)}
.rd-facts dt{font:600 10.5px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:#7f8996}
.rd-facts dd{margin:6px 0 0;font-size:13.5px;color:#dfe5ec}
.rd-phone{margin:0;justify-self:center;width:min(380px,100%)}
.rd-frame{position:relative;aspect-ratio:9/16;border-radius:34px;overflow:hidden;background:#000;border:1px solid rgba(255,255,255,.12);box-shadow:0 0 0 9px #0b0d11,0 0 0 10px rgba(242,196,109,.35),0 50px 120px -30px rgba(85,223,245,.35),0 40px 90px -40px rgba(242,196,109,.5)}
.rd-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.rd-poster{all:unset;cursor:pointer;position:absolute;inset:0;display:grid;place-items:center}
.rd-poster img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(1.15) contrast(1.05);transform:scale(1.02);transition:transform .6s ease}
.rd-poster:hover img{transform:scale(1.06)}
.rd-poster::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.05),rgba(0,0,0,.55))}
.rd-play{position:relative;z-index:1;width:76px;height:76px;border-radius:50%;display:grid;place-items:center;background:rgba(242,196,109,.92);box-shadow:0 0 0 10px rgba(242,196,109,.18),0 18px 40px rgba(0,0,0,.5)}
.rd-play svg{width:30px;height:30px;fill:#120d02;margin-left:4px}
.rd-poster-tag{position:absolute;z-index:1;bottom:22px;font:600 12px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:#fff}
.rd-poster:focus-visible{outline:3px solid var(--cyan);outline-offset:-3px}
.rd-phone figcaption{margin-top:16px;text-align:center;color:#7f8996;font-size:12.5px}
.rd-gallery{margin-top:clamp(40px,7vw,90px)}
.rd-gallery-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:18px}
.rd-gallery h2{margin:8px 0 0;font-size:clamp(28px,3.6vw,42px);letter-spacing:-.03em}
.rd-filter{display:inline-flex;padding:4px;border-radius:12px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.03)}
.rd-filter button{all:unset;cursor:pointer;padding:8px 14px;border-radius:9px;font-weight:600;font-size:13.5px;color:#aab3bf}
.rd-filter button[aria-pressed=true]{color:#120d02;background:linear-gradient(135deg,var(--gold-2),var(--gold))}
.rd-filter button:focus-visible{outline:2px solid var(--cyan)}
.rd-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(176px,1fr));gap:16px}
.rd-card a{display:block;position:relative;aspect-ratio:9/16;border-radius:18px;overflow:hidden;color:#fff;text-decoration:none;border:1px solid rgba(255,255,255,.08);background:#0d1014;animation:rdIn .5s ease both;animation-delay:calc(var(--i) * 40ms)}
.rd-card a{aspect-ratio:4/5}
@keyframes rdIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.rd-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .45s ease}
.rd-card a::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(0,0,0,.88))}
.rd-card a:hover img{transform:scale(1.05)}
.rd-card a:hover{border-color:rgba(242,196,109,.5)}
.rd-card a:focus-visible{outline:3px solid var(--cyan);outline-offset:2px}
.rd-card-meta{position:absolute;z-index:1;left:12px;right:12px;bottom:12px}
.rd-card-meta strong{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:14.5px;line-height:1.25}
.rd-card-meta small{display:block;margin-top:5px;font:500 11px/1.3 var(--mono);color:var(--gold-2);letter-spacing:.04em}
.rd-skel{aspect-ratio:9/16;border-radius:18px;background:linear-gradient(100deg,#0e1115 30%,#171b21 50%,#0e1115 70%);background-size:200% 100%;animation:rdSk 1.4s linear infinite}
@keyframes rdSk{to{background-position:-200% 0}}
.rd-empty,.rd-fine{color:#7f8996;font-size:13px}
.rd-fine a{color:var(--gold-2)}
@media (max-width:860px){.rd-stage{grid-template-columns:1fr;min-height:0}.rd-phone{order:-1;width:min(330px,86vw)}.rd-facts{grid-template-columns:1fr}.rd-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
