/* AEYSA Radio band (v28, 11 Nov 2026). Uses the design system tokens of aeysa-system-v17.css. */
.radio{position:relative;display:block;overflow:hidden;border:1px solid var(--card-line);background:#02040a;color:var(--text);text-decoration:none}
.radio-media{position:relative;aspect-ratio:1280/540;background:#02040a}
.radio-media video,.radio-media img{position:absolute;top:0;left:-7%;width:107%;height:100%;object-fit:cover;object-position:38% 50%}
.radio-media video{opacity:0;transition:opacity .6s}
.radio-media video.is-on{opacity:1}
.radio-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(2,4,10,0) 40%,rgba(2,4,10,.82) 66%,rgba(2,4,10,.94) 100%);pointer-events:none}
.radio-copy{position:absolute;right:0;top:0;bottom:0;width:min(35%,392px);display:flex;flex-direction:column;justify-content:center;padding:0 clamp(20px,3vw,40px) 0 0}
.radio-copy .eyebrow{display:flex;align-items:center;gap:10px;margin-bottom:14px;font-size:max(12px,.75rem)}
.radio-dot{width:7px;height:7px;border-radius:50%;background:var(--blue);flex:none}
.radio-copy h2{font-size:clamp(1.5rem,2.5vw,2.1rem)}
.radio-copy p:not(.eyebrow){margin-top:14px;max-width:26rem}
.radio-copy .btn{align-self:flex-start;margin-top:24px}
.radio:hover .btn-ghost,.radio:focus-visible .btn-ghost{background:var(--blue-soft);border-color:var(--blue);color:#fff}
.radio:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
@media(prefers-reduced-motion:no-preference){.radio-dot{animation:radio-pulse 2.4s ease-in-out infinite}}
@keyframes radio-pulse{0%,100%{opacity:1}50%{opacity:.35}}
@media(max-width:760px){
  .radio-media{aspect-ratio:4/3}
  .radio-media video,.radio-media img{left:0;width:100%;object-position:30% 50%}
  .radio-shade{background:linear-gradient(180deg,rgba(2,4,10,0) 55%,rgba(2,4,10,.85) 100%)}
  .radio-copy{position:static;width:auto;padding:22px 20px 26px;border-top:1px solid var(--hair);background:var(--card)}
  .radio-copy .btn{align-self:stretch}
}
