:root{
  --gr-header-h:clamp(56px,3.2vw,68px);
  --gr-navy:#0b2a66;
  --gr-red:#ff3d55;
}

/* V47: exact GALAXISRADIO header artwork + real HTML navigation. */
.site-header{
  width:100vw!important;
  height:var(--gr-header-h)!important;
  min-height:0!important;
  margin:0!important;
  padding:0!important;
  position:sticky!important;
  top:0!important;
  z-index:100!important;
  display:block!important;
  overflow:visible!important;
  background:url("assets/v47-header-full.webp?v=881") center/100% 100% no-repeat!important;
  border:0!important;
  box-shadow:none!important;
}

.site-header .brand{
  position:absolute!important;
  left:10.35%!important;
  top:0!important;
  width:17.4%!important;
  height:100%!important;
  display:block!important;
  opacity:.001!important;
  z-index:3!important;
}

.site-header .brand img{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
}

.site-header .nav{
  position:absolute!important;
  left:38.5%!important;
  top:0!important;
  width:34.4%!important;
  height:100%!important;
  margin:0!important;
  padding:0!important;
  display:flex!important;
  align-items:stretch!important;
  justify-content:space-between!important;
  gap:0!important;
  background:transparent!important;
  box-shadow:none!important;
  opacity:1!important;
  z-index:4!important;
}

.site-header .nav a{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:1 1 auto!important;
  min-width:0!important;
  height:100%!important;
  padding:0 clamp(2px,.30vw,6px)!important;
  color:#0b2a66!important;
  text-decoration:none!important;
  white-space:nowrap!important;
  background:transparent!important;
  border:0!important;
  font-family:Arial,"Helvetica Neue",sans-serif!important;
  font-size:clamp(9px,.70vw,13px)!important;
  line-height:1!important;
  font-weight:900!important;
}

.site-header .nav a.active{
  color:var(--gr-red)!important;
}

.site-header .nav a.active::after{
  content:"";
  position:absolute;
  left:14%;
  right:14%;
  bottom:8px;
  height:3px;
  border-radius:999px;
  background:var(--gr-red);
}

.site-header .search-button{
  position:absolute!important;
  left:73.25%!important;
  top:0!important;
  width:3.0%!important;
  height:100%!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  opacity:.001!important;
  cursor:pointer!important;
  z-index:5!important;
}

.site-header .live-button{
  position:absolute!important;
  left:76.0%!important;
  top:10%!important;
  width:11.8%!important;
  height:72%!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:999px!important;
  background:transparent!important;
  opacity:.001!important;
  pointer-events:auto!important;
  cursor:pointer!important;
  z-index:6!important;
}

.site-header .nav-toggle{
  display:none!important;
}

@media(max-width:1199px){
  .site-header{
    width:calc(100vw - 10px)!important;
    height:64px!important;
    min-height:64px!important;
    margin:0 auto!important;
    padding:0 14px!important;
    display:flex!important;
    align-items:center!important;
    gap:12px!important;
    background:#fff!important;
  }

  .site-header .brand{
    position:static!important;
    left:auto!important;
    top:auto!important;
    width:auto!important;
    height:auto!important;
    margin-right:auto!important;
    opacity:1!important;
  }

  .site-header .brand img{
    width:220px!important;
    max-width:52vw!important;
    height:auto!important;
  }

  .site-header .nav-toggle{
    display:block!important;
    order:4!important;
    border:0!important;
    background:transparent!important;
    color:var(--gr-navy)!important;
    font-size:25px!important;
    line-height:1!important;
    cursor:pointer!important;
  }

  .site-header .nav{
    display:none!important;
    position:absolute!important;
    left:0!important;
    right:0!important;
    top:64px!important;
    width:auto!important;
    height:auto!important;
    padding:8px 16px 12px!important;
    flex-direction:column!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    background:#fff!important;
    box-shadow:0 14px 26px rgba(10,44,96,.12)!important;
    z-index:120!important;
  }

  .site-header .nav.open{
    display:flex!important;
  }

  .site-header .nav a{
    flex:0 0 auto!important;
    justify-content:flex-start!important;
    height:auto!important;
    padding:10px 2px!important;
    color:var(--gr-navy)!important;
    font-size:14px!important;
  }

  .site-header .nav a.active{
    color:var(--gr-red)!important;
  }

  .site-header .nav a.active::after{
    display:none!important;
  }

  .site-header .search-button,
  .site-header .live-button{
    display:none!important;
  }
}

@media(max-width:520px){
  .site-header .brand img{
    width:190px!important;
  }
}


/* V49 – room for Shop in the desktop navigation */
@media(min-width:1200px){
  .site-header .nav{
    left:36.8%!important;
    width:36.0%!important;
  }
  .site-header .nav a{
    font-size:clamp(8px,.64vw,12px)!important;
    padding:0 clamp(1px,.20vw,4px)!important;
  }
}

/* V79: keep live playback accessible between phone and desktop layouts. */
@media (min-width:768px) and (max-width:1199px){
  .site-header .live-button{
    display:inline-flex!important;
    position:static!important;
    inset:auto!important;
    order:3!important;
    flex:0 0 auto!important;
    align-items:center!important;
    justify-content:center!important;
    gap:8px!important;
    width:auto!important;
    min-width:142px!important;
    height:44px!important;
    margin:0!important;
    padding:0 18px!important;
    opacity:1!important;
    visibility:visible!important;
    background:var(--gr-red,#ff3d55)!important;
    color:#fff!important;
    font:700 15px/1 Arial,sans-serif!important;
    white-space:nowrap!important;
    cursor:pointer!important;
  }
  .site-header .live-button:focus-visible{
    outline:3px solid var(--gr-navy,#0b2a66);
    outline-offset:3px;
  }
}

/* V80: explicit tablet control, including narrower iPad window layouts. */
@media (min-width:600px) and (max-width:1199px){
  .site-header #galaxis-live-control{
    display:inline-flex!important;
    position:static!important;
    inset:auto!important;
    order:3!important;
    flex:0 0 auto!important;
    align-items:center!important;
    justify-content:center!important;
    gap:8px!important;
    width:auto!important;
    min-width:142px!important;
    height:44px!important;
    margin:0!important;
    padding:0 18px!important;
    opacity:1!important;
    visibility:visible!important;
    background:var(--gr-red,#ff3d55)!important;
    color:#fff!important;
    font:700 15px/1 Arial,sans-serif!important;
    white-space:nowrap!important;
    cursor:pointer!important;
  }
  .site-header #galaxis-live-control:focus-visible{
    outline:3px solid var(--gr-navy,#0b2a66);
    outline-offset:3px;
  }
}


/* V55: crisp Listen Live button with real hover state */
.site-header #galaxis-live-control,
.site-header .live-button{
  -webkit-font-smoothing:antialiased!important;
  text-rendering:geometricPrecision!important;
}
.site-header #galaxis-live-control .play-symbol,
.site-header .live-button .play-symbol{
  display:inline-grid!important;
  place-items:center!important;
  width:24px!important;
  height:24px!important;
  flex:0 0 24px!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.15)!important;
  font-size:13px!important;
  line-height:1!important;
  transform:translateX(1px)!important;
}
.site-header #galaxis-live-control .play-label,
.site-header .live-button .play-label{
  display:inline-block!important;
  font-weight:900!important;
  letter-spacing:.01em!important;
}
@media (min-width:1200px){
  .site-header #galaxis-live-control,
  .site-header .live-button{
    display:inline-flex!important;
    position:absolute!important;
    left:75.95%!important;
    top:12%!important;
    width:auto!important;
    min-width:162px!important;
    height:60%!important;
    margin:0!important;
    padding:0 18px!important;
    border:1px solid rgba(255,255,255,.34)!important;
    border-radius:999px!important;
    opacity:1!important;
    visibility:visible!important;
    align-items:center!important;
    justify-content:center!important;
    gap:10px!important;
    background:linear-gradient(180deg,#ff5568 0%,#ff314b 100%)!important;
    color:#fff!important;
    font:900 clamp(12px,.78vw,15px)/1 Arial,sans-serif!important;
    box-shadow:0 8px 18px rgba(255,61,85,.24), inset 0 1px 0 rgba(255,255,255,.32)!important;
    cursor:pointer!important;
    transition:transform .16s ease, box-shadow .16s ease, background .16s ease, filter .16s ease!important;
    z-index:6!important;
  }
  .site-header #galaxis-live-control:hover,
  .site-header .live-button:hover{
    transform:translateY(-1px)!important;
    background:linear-gradient(180deg,#ff6475 0%,#ff3851 100%)!important;
    box-shadow:0 12px 22px rgba(255,61,85,.30), inset 0 1px 0 rgba(255,255,255,.42)!important;
    filter:saturate(1.03)!important;
  }
  .site-header #galaxis-live-control:active,
  .site-header .live-button:active{
    transform:translateY(0)!important;
    box-shadow:0 6px 12px rgba(255,61,85,.22), inset 0 1px 0 rgba(255,255,255,.24)!important;
  }
  .site-header #galaxis-live-control:focus-visible,
  .site-header .live-button:focus-visible{
    outline:3px solid rgba(11,42,102,.82)!important;
    outline-offset:3px!important;
  }
}
@media (min-width:600px) and (max-width:1199px){
  .site-header #galaxis-live-control,
  .site-header .live-button{
    border:1px solid rgba(255,255,255,.34)!important;
    border-radius:999px!important;
    background:linear-gradient(180deg,#ff5568 0%,#ff314b 100%)!important;
    box-shadow:0 8px 18px rgba(255,61,85,.22), inset 0 1px 0 rgba(255,255,255,.3)!important;
    transition:transform .16s ease, box-shadow .16s ease, background .16s ease, filter .16s ease!important;
  }
  .site-header #galaxis-live-control:hover,
  .site-header .live-button:hover{
    transform:translateY(-1px)!important;
    background:linear-gradient(180deg,#ff6475 0%,#ff3851 100%)!important;
    box-shadow:0 12px 22px rgba(255,61,85,.28), inset 0 1px 0 rgba(255,255,255,.4)!important;
  }
}


/* V56: one crisp desktop Listen Live button; fully covers the button baked into header artwork */
@media (min-width:1200px){
  .site-header #galaxis-live-control,
  .site-header .live-button{
    left:75.95%!important;
    top:7%!important;
    width:12.15%!important;
    min-width:0!important;
    height:86%!important;
    padding:0 clamp(14px,1vw,20px)!important;
    border:1px solid rgba(255,255,255,.52)!important;
    border-radius:999px!important;
    background:#ff3d55!important;
    opacity:1!important;
    visibility:visible!important;
    color:#fff!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.34),0 3px 8px rgba(11,42,102,.12)!important;
    filter:none!important;
    transform:none!important;
    overflow:hidden!important;
    isolation:isolate!important;
  }
  .site-header #galaxis-live-control::before,
  .site-header .live-button::before{
    content:""!important;
    position:absolute!important;
    inset:0!important;
    border-radius:inherit!important;
    background:linear-gradient(180deg,#ff5267 0%,#ff3d55 48%,#f92e49 100%)!important;
    z-index:-1!important;
    transition:background .16s ease!important;
  }
  .site-header #galaxis-live-control:hover,
  .site-header .live-button:hover{
    transform:translateY(-1px)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 7px 14px rgba(255,61,85,.22)!important;
    filter:none!important;
  }
  .site-header #galaxis-live-control:hover::before,
  .site-header .live-button:hover::before{
    background:linear-gradient(180deg,#ff6577 0%,#ff475d 48%,#ff3651 100%)!important;
  }
  .site-header #galaxis-live-control .play-symbol,
  .site-header .live-button .play-symbol{
    width:auto!important;
    height:auto!important;
    flex:0 0 auto!important;
    display:inline-block!important;
    border-radius:0!important;
    background:transparent!important;
    font-size:14px!important;
    line-height:1!important;
    color:#fff!important;
    text-shadow:none!important;
    transform:none!important;
  }
  .site-header #galaxis-live-control .play-label,
  .site-header .live-button .play-label{
    font-family:Arial,"Helvetica Neue",sans-serif!important;
    font-size:clamp(12px,.79vw,15px)!important;
    line-height:1!important;
    font-weight:900!important;
    letter-spacing:.015em!important;
    color:#fff!important;
    text-shadow:none!important;
    white-space:nowrap!important;
  }
}


/* V88.1 – header logo removed only. */
.site-header .brand{display:none!important;}
@media(max-width:1199px){
  .site-header .nav-toggle{margin-left:auto!important;}
}
@media(min-width:600px) and (max-width:1199px){
  .site-header .live-button,
  .site-header #galaxis-live-control{margin-left:auto!important;}
  .site-header .nav-toggle{margin-left:0!important;}
}