/* V76 — Stable rich neon navigation.
   Purpose: keep the neon active page state, but completely remove the layout drift caused by v71–v75 grid/width experiments. */
:root{
  --envia-neon-cyan:#58eaff;
  --envia-neon-violet:#a85cff;
  --envia-neon-blue:#42a5ff;
}

@media (min-width:981px){
  /* Put the header back into a predictable 3-part flex row. */
  .site-header{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:28px!important;
    padding-left:48px!important;
    padding-right:48px!important;
    overflow:visible!important;
  }

  .site-header .brand{
    flex:0 0 210px!important;
    width:210px!important;
    min-width:210px!important;
    max-width:210px!important;
    margin:0!important;
    padding:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    position:relative!important;
    z-index:10!important;
    overflow:visible!important;
  }

  .site-header .brand-logo{
    width:178px!important;
    max-width:178px!important;
    height:auto!important;
    display:block!important;
    position:relative!important;
    z-index:11!important;
  }

  .site-header .desktop-nav{
    flex:1 1 auto!important;
    min-width:0!important;
    width:auto!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:28px!important;
    position:relative!important;
    z-index:6!important;
    overflow:visible!important;
  }

  .site-header .desktop-nav a{
    position:relative!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    flex:0 0 auto!important;
    white-space:nowrap!important;
    min-width:0!important;
    margin:0!important;
    padding:8px 0 13px!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
    overflow:visible!important;
    isolation:isolate!important;
    font-size:15px!important;
    line-height:1!important;
  }

  .site-header .header-actions{
    flex:0 0 auto!important;
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    margin:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:16px!important;
    position:relative!important;
    z-index:12!important;
    overflow:visible!important;
  }

  .site-header .header-actions a,
  .site-header .header-actions .btn{
    flex:0 0 auto!important;
    white-space:nowrap!important;
  }

  /* Rich neon active state, contained to the text/underline. No large glowing pill can overlap the logo. */
  .site-header .desktop-nav a.active,
  .site-header .desktop-nav a[aria-current="page"],
  .site-header .desktop-nav a.is-neon-active{
    color:#fff!important;
    text-shadow:
      0 0 8px rgba(88,234,255,.95),
      0 0 18px rgba(168,92,255,.72),
      0 0 30px rgba(66,165,255,.45)!important;
    background:transparent!important;
    box-shadow:none!important;
  }

  .site-header .desktop-nav a.active::before,
  .site-header .desktop-nav a[aria-current="page"]::before,
  .site-header .desktop-nav a.is-neon-active::before{
    content:""!important;
    position:absolute!important;
    left:50%!important;
    right:auto!important;
    bottom:0!important;
    width:54px!important;
    height:2px!important;
    transform:translateX(-50%)!important;
    border-radius:999px!important;
    display:block!important;
    background:linear-gradient(90deg,var(--envia-neon-cyan),var(--envia-neon-violet),var(--envia-neon-cyan))!important;
    box-shadow:
      0 0 10px rgba(88,234,255,.95),
      0 0 22px rgba(168,92,255,.80),
      0 0 34px rgba(66,165,255,.40)!important;
    opacity:1!important;
    pointer-events:none!important;
    z-index:2!important;
  }

  .site-header .desktop-nav a.active::after,
  .site-header .desktop-nav a[aria-current="page"]::after,
  .site-header .desktop-nav a.is-neon-active::after{
    content:""!important;
    position:absolute!important;
    left:50%!important;
    bottom:-5px!important;
    width:74px!important;
    height:22px!important;
    transform:translateX(-50%)!important;
    border-radius:999px!important;
    background:radial-gradient(ellipse at center,rgba(88,234,255,.26),rgba(168,92,255,.16) 45%,transparent 75%)!important;
    filter:blur(7px)!important;
    opacity:.82!important;
    pointer-events:none!important;
    z-index:-1!important;
  }

  .site-header .desktop-nav a:hover:not(.active):not([aria-current="page"]):not(.is-neon-active){
    color:#fff!important;
    text-shadow:0 0 8px rgba(88,234,255,.42)!important;
  }

  /* Do not let Watch Film / Start Free Trial inherit nav neon. */
  .site-header .header-actions a.active,
  .site-header .header-actions a[aria-current="page"],
  .site-header .header-actions a.is-neon-active{
    text-shadow:none!important;
    background:inherit!important;
    box-shadow:inherit!important;
  }
  .site-header .header-actions a::before,
  .site-header .header-actions a::after{display:none!important;content:none!important;}
}

@media (min-width:981px) and (max-width:1280px){
  .site-header{gap:20px!important;padding-left:36px!important;padding-right:36px!important;}
  .site-header .brand{flex-basis:188px!important;width:188px!important;min-width:188px!important;max-width:188px!important;}
  .site-header .brand-logo{width:158px!important;max-width:158px!important;}
  .site-header .desktop-nav{gap:18px!important;}
  .site-header .desktop-nav a{font-size:13px!important;}
  .site-header .header-actions{gap:10px!important;}
}

@media (min-width:981px) and (max-width:1120px){
  .site-header{gap:14px!important;padding-left:28px!important;padding-right:28px!important;}
  .site-header .brand{flex-basis:168px!important;width:168px!important;min-width:168px!important;max-width:168px!important;}
  .site-header .brand-logo{width:142px!important;max-width:142px!important;}
  .site-header .desktop-nav{gap:12px!important;}
  .site-header .desktop-nav a{font-size:12px!important;}
}

/* Mobile keeps a neon underline without changing menu layout. */
.mobile-menu a.active,
.mobile-menu a[aria-current="page"],
.mobile-menu a.is-neon-active{
  color:#fff!important;
  text-shadow:0 0 8px rgba(88,234,255,.9),0 0 18px rgba(168,92,255,.65)!important;
}
.mobile-menu a.active::before,
.mobile-menu a[aria-current="page"]::before,
.mobile-menu a.is-neon-active::before{
  content:""!important;
  position:absolute!important;
  left:18px!important;
  right:18px!important;
  bottom:5px!important;
  height:2px!important;
  border-radius:999px!important;
  background:linear-gradient(90deg,var(--envia-neon-cyan),var(--envia-neon-violet),var(--envia-neon-cyan))!important;
  box-shadow:0 0 10px rgba(88,234,255,.9),0 0 18px rgba(168,92,255,.65)!important;
}
