/* MUVAL Radio · Hero EVA */
.hero{
  min-height:680px;
  grid-template-columns:minmax(0,1fr) minmax(430px,.92fr);
  gap:clamp(28px,4vw,70px);
  padding-top:64px;
  padding-bottom:32px;
  overflow:hidden;
  background:
    radial-gradient(circle at 83% 22%,rgba(230,38,122,.09),transparent 24%),
    radial-gradient(circle at 94% 67%,rgba(242,145,37,.07),transparent 22%),
    linear-gradient(180deg,#fff 0%,#fff 74%,#fffafb 100%);
}
.hero-copy{position:relative;z-index:5}
.hero-copy>p{max-width:520px}
.eva-stage{
  min-height:590px;
  align-items:flex-end;
  isolation:isolate;
  overflow:visible;
}
.eva-halo{
  width:510px;
  height:510px;
  top:54px;
  z-index:0;
  background:radial-gradient(circle,rgba(230,38,122,.12) 0%,rgba(152,26,128,.07) 38%,rgba(242,145,37,.05) 56%,transparent 72%);
  animation:haloBreathe 4.8s ease-in-out infinite;
}
.eva-radio{
  z-index:2;
  width:min(470px,91%);
  max-height:590px;
  object-fit:contain;
  object-position:center bottom;
  filter:drop-shadow(0 26px 30px rgba(34,20,81,.14));
  transform-origin:center bottom;
  animation:evaFloat 5.4s ease-in-out infinite;
}
.sound-wave{
  z-index:1;
  opacity:.68;
  gap:7px;
  pointer-events:none;
}
.sound-wave i{
  transform-origin:center;
  animation:wavePulse 1.25s ease-in-out infinite;
  box-shadow:0 7px 22px rgba(230,38,122,.12);
}
.sound-wave i:nth-child(2){animation-delay:.12s}
.sound-wave i:nth-child(3){animation-delay:.24s}
.sound-wave i:nth-child(4){animation-delay:.36s}
.sound-wave i:nth-child(5){animation-delay:.48s}
.wave-left{left:0;top:44%}
.wave-right{right:1%;top:51%;transform:scale(.78)}
.hero-play-orbit{
  position:absolute;
  right:8%;
  top:22%;
  z-index:4;
  width:68px;
  height:68px;
  display:grid;
  place-items:center;
  border-radius:50%;
  color:#fff;
  background:linear-gradient(145deg,var(--pink),var(--orange));
  box-shadow:0 16px 38px rgba(230,38,122,.24);
  animation:playFloat 3.2s ease-in-out infinite;
}
.hero-play-orbit span{font-size:1.05rem;margin-left:4px;position:relative;z-index:2}
.hero-play-orbit::after{
  content:"";
  position:absolute;
  inset:-1px;
  border:2px solid rgba(230,38,122,.32);
  border-radius:inherit;
  animation:playRing 2.2s ease-out infinite;
}
.hero-play-orbit:hover{box-shadow:0 20px 46px rgba(230,38,122,.31)}
@keyframes wavePulse{
  0%,100%{transform:scaleY(.52);opacity:.35}
  50%{transform:scaleY(1.08);opacity:1}
}
@keyframes evaFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-7px)}
}
@keyframes haloBreathe{
  0%,100%{transform:scale(.96);opacity:.72}
  50%{transform:scale(1.04);opacity:1}
}
@keyframes playFloat{
  0%,100%{transform:translateY(0) scale(1)}
  50%{transform:translateY(-8px) scale(1.045)}
}
@keyframes playRing{
  0%{transform:scale(.78);opacity:.48}
  78%,100%{transform:scale(1.75);opacity:0}
}
@media(max-width:980px){
  .hero{grid-template-columns:1fr;min-height:auto;gap:10px;padding-bottom:0}
  .eva-stage{min-height:520px;margin-top:8px}
  .eva-radio{width:min(430px,82%);max-height:520px}
  .eva-halo{width:450px;height:450px;top:38px}
  .hero-play-orbit{right:16%;top:18%}
  .wave-left{left:9%;top:44%}
  .wave-right{right:9%;top:52%}
}
@media(max-width:640px){
  .hero{padding-top:48px;gap:2px}
  .eva-stage{min-height:420px;margin-top:10px}
  .eva-radio{width:min(335px,88%);max-height:420px}
  .eva-halo{width:340px;height:340px;top:44px}
  .hero-play-orbit{width:56px;height:56px;right:7%;top:15%}
  .wave-left{left:-22px;top:48%;transform:scale(.72)}
  .wave-right{right:-22px;top:55%;transform:scale(.6)}
}
@media(prefers-reduced-motion:reduce){
  .eva-radio,.eva-halo,.sound-wave i,.hero-play-orbit,.hero-play-orbit::after{animation:none!important}
}
