/* RadioBeats Halloween 2026 — indexH.html — fond propre sans UI imprimée */
:root{--r:#ff1728}
.hero{
  height:782px;
  background:#090000 url("radiobeats-halloween-hero.png") center center/cover no-repeat !important;
  border-bottom:1px solid #3b0b0e;
}
.hero:before{background:linear-gradient(180deg,rgba(0,0,0,.01),rgba(0,0,0,.05)) !important}
.bg-cover,.mega-rb,.content>h2,.content>.label,.content>.party,.divider{display:none!important}
.party-level{
  left:5.5%!important;top:590px!important;width:500px!important;
  padding:7px 10px 8px;background:rgba(0,0,0,.30);backdrop-filter:blur(2px);
}
.onair{
  left:5.5%!important;top:642px!important;width:610px!important;
  padding:6px 10px;background:rgba(0,0,0,.26);backdrop-filter:blur(2px);
}
.party-level,.onair{position:absolute!important;z-index:4!important}
.side{background:linear-gradient(180deg,#070707,#030303)}
.player{background:#050505}
@media(max-width:1050px){
  .hero{height:760px;background-position:center center!important;background-size:cover!important}
  .party-level{left:4%!important;top:570px!important;width:480px!important}
  .onair{left:4%!important;top:620px!important;width:590px!important}
}
@media(max-width:700px){
  .hero{height:760px!important;min-height:760px!important;background-position:center center!important;background-size:cover!important}
  .party-level{left:16px!important;top:505px!important;width:calc(100% - 32px)!important;background:rgba(0,0,0,.38)}
  .onair{left:16px!important;top:555px!important;width:calc(100% - 32px)!important;background:rgba(0,0,0,.38)}
}

/* v2.3 — correction mobile portrait seulement.
   Desktop/tablette paysage inchangés. Le fond Halloween est légèrement dézoomé
   pour montrer davantage le logo et du décor, tandis que Party Level / En ondes
   restent les vrais éléments dynamiques du site. */
@media screen and (orientation:portrait) and (max-width:700px){
  .hero{
    height:700px!important;
    min-height:700px!important;
    background-size:auto 620px!important;
    background-position:50% 18px!important;
    background-repeat:no-repeat!important;
    background-color:#050000!important;
  }
  .party-level{
    left:16px!important;
    top:515px!important;
    width:calc(100% - 32px)!important;
  }
  .onair{
    left:16px!important;
    top:565px!important;
    width:calc(100% - 32px)!important;
  }
}
@media screen and (orientation:portrait) and (max-width:430px){
  .hero{
    height:680px!important;
    min-height:680px!important;
    background-size:auto 600px!important;
    background-position:50% 14px!important;
  }
  .party-level{top:500px!important}
  .onair{top:550px!important}
}