.hero{padding:clamp(36px,6vw,80px) 0 clamp(48px,6vw,90px);position:relative;overflow:hidden}
.hero::before{content:"";position:absolute;width:680px;height:680px;right:-180px;top:-220px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb, var(--lantern) 35%, transparent),color-mix(in srgb, var(--lantern) 0%, transparent) 65%);pointer-events:none}
.hero .container{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(28px,4vw,64px);align-items:center;position:relative}
@media (min-width:901px){.hero--split .container,.hero--estimate .container,.hero--stats .container{grid-template-columns:minmax(0,1.02fr) minmax(0,1fr)}}
.hero h1 .hl{position:relative;white-space:nowrap}
.hero h1 .hl::after{content:"";position:absolute;left:-.06em;right:-.06em;bottom:.06em;height:.32em;background:var(--lantern);border-radius:6px;z-index:-1;transform-origin:left;transition:transform .9s .3s var(--ease)}
.js .hero h1 .hl::after{transform:scaleX(0)}
.js .hero.on h1 .hl::after{transform:scaleX(1)}
.hero h1{position:relative;z-index:0}
.hero .ctas{display:flex;flex-wrap:wrap;gap:12px;margin:28px 0 22px}
.hero .assure{display:flex;flex-wrap:wrap;gap:8px 18px;font-size:.9rem;color:var(--muted);list-style:none;padding:0;margin:0}
.hero .assure li{display:flex;align-items:center;gap:6px}
.hero .assure svg{width:16px;height:16px;color:var(--sage-ink)}
.hero-app{background:var(--ink);color:var(--paper);border-radius:var(--r-l);padding:clamp(18px,2.2vw,26px);box-shadow:0 40px 80px -40px color-mix(in srgb, var(--ink) 70%, transparent),0 0 0 1px color-mix(in srgb, var(--white) 4%, transparent) inset;position:relative}
.app-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.app-top .meta{font-size:.78rem;color:var(--on-dark-muted);line-height:1.35}
.app-top .meta b{display:block;color:var(--paper);font:700 1rem var(--f-d)}
.onair{width:clamp(96px,11vw,128px);flex:none}
.onair .glass{transition:filter .4s}
.onair .halo{animation:flick 4.2s ease-in-out infinite}
.onair:hover .halo{opacity:1}
@keyframes flick{0%,100%{opacity:.9}42%{opacity:.75}45%{opacity:.95}70%{opacity:.82}}
.rec-row{display:flex;align-items:center;gap:10px;font-size:.82rem;color:var(--on-dark-muted);margin-bottom:10px}
.rec-dot{width:10px;height:10px;border-radius:50%;background:var(--coral);animation:pulse 1.6s ease-in-out infinite}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 color-mix(in srgb, var(--coral) 55%, transparent)}50%{box-shadow:0 0 0 7px color-mix(in srgb, var(--coral) 0%, transparent)}}
.rec-row .time{font-variant-numeric:tabular-nums;color:var(--paper);font-weight:600}
.wave-box{background:var(--ink-deep);border-radius:18px;padding:10px;position:relative}
#wave{width:100%;height:clamp(110px,14vw,150px)}
.captions{min-height:3.4em;margin-top:12px;font:650 clamp(1.15rem,1.6vw,1.45rem)/1.3 var(--f-d);letter-spacing:-.01em}
.captions .w{display:inline-block;margin-right:.26em;transition:opacity .25s,transform .35s var(--ease),color .3s}
.js .captions .w{opacity:.18;transform:translateY(.25em)}
.js .captions .w.on{opacity:1;transform:none}
.captions .w.now{color:var(--lantern)}
.cap-meta{display:flex;justify-content:space-between;font-size:.74rem;color:var(--on-dark-faint);margin-top:6px}
.tracks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:14px}
.trk{background:color-mix(in srgb, var(--white) 6%, transparent);border-radius:12px;padding:8px 10px;font-size:.78rem}
.trk b{display:block;font-weight:600;color:var(--paper)}
.trk .lvl{height:6px;border-radius:4px;background:color-mix(in srgb, var(--white) 12%, transparent);margin-top:6px;overflow:hidden}
.trk .lvl i{display:block;height:100%;width:40%;background:linear-gradient(90deg,var(--sage),var(--lantern));border-radius:4px;transform-origin:left;transition:width .12s linear}
.hero-app .rec-spec{margin-left:auto}