/* Beacon global shared overrides - unified support-page header/button system */

:root{
  --text:#EAF0FF;
  --muted:#A9B4D0;
  --blue:#2B6BFF;
  --cyan:#00B3FF;
  --yellow:#FFEB00;
}

/* Header / nav unified to support page style */
.topbar{
  position: sticky !important;
  top: 0 !important;
  z-index: 50 !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  background: rgba(5,8,18,.65) !important;
  border-bottom: 1px solid rgba(255,255,255,.08) !important;
}
.nav{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:16px !important;
  padding:14px 0 !important;
}
.brand img{
  width:192px !important;
  height:auto !important;
}
.navlinks{
  display:flex !important;
  gap:18px !important;
  align-items:center !important;
  justify-content:center !important;
  flex-wrap:wrap !important;
}
.navlinks a{
  color: rgba(234,240,255,.86) !important;
  font-weight: 800 !important;
  font-size: 14px !important;
  padding: 10px 10px !important;
  border-radius: 999px !important;
  border: 1px solid transparent !important;
  background: transparent !important;
}
.navlinks a:hover{
  border-color: rgba(0,179,255,.25) !important;
  background: rgba(255,255,255,.05) !important;
  color: var(--text, #EAF0FF) !important;
}
.navlinks a.active{
  border-color: rgba(0,179,255,.35) !important;
  background: rgba(0,179,255,.08) !important;
  color: var(--text, #EAF0FF) !important;
}
.navcta{
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
  min-width:auto !important;
  justify-content:flex-end !important;
}

/* Buttons unified to support page style */
.btn{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
  padding:12px 18px !important;
  border-radius:999px !important;
  border:1px solid rgba(255,255,255,.13) !important;
  background: rgba(255,255,255,.07) !important;
  color:var(--text, #EAF0FF) !important;
  font-weight:900 !important;
  font-size:13px !important;
  letter-spacing: .1px !important;
  cursor:pointer !important;
  transition: transform .15s, background .15s, border-color .15s, filter .15s !important;
  white-space: nowrap !important;
  text-shadow: none !important;
}
.btn:hover,
.btn:focus-visible{
  transform: translateY(-2px) !important;
  background: rgba(255,255,255,.11) !important;
  border-color: rgba(0,179,255,.35) !important;
  color: var(--text, #EAF0FF) !important;
  filter: none !important;
  opacity: 1 !important;
}
.btn-primary{
  background: linear-gradient(90deg, var(--blue, #2B6BFF), var(--cyan, #00B3FF)) !important;
  border-color: rgba(0,179,255,.35) !important;
  color:#071023 !important;
  box-shadow: 0 18px 45px rgba(43,107,255,.25) !important;
}
.btn-primary:hover,
.btn-primary:focus-visible{
  transform: translateY(-2px) !important;
  background: linear-gradient(90deg, var(--blue, #2B6BFF), var(--cyan, #00B3FF)) !important;
  border-color: rgba(0,179,255,.35) !important;
  color:#071023 !important;
  filter: brightness(1.07) !important;
  opacity: 1 !important;
}
.call-btn,
.btn-yellow,
.btn-phone{
  background: var(--yellow, #FFEB00) !important;
  color:#0b1230 !important;
  border:0 !important;
  box-shadow: 0 14px 34px rgba(255,235,0,.35) !important;
}
.call-btn:hover,
.call-btn:focus-visible,
.btn-yellow:hover,
.btn-yellow:focus-visible,
.btn-phone:hover,
.btn-phone:focus-visible{
  transform: translateY(-2px) !important;
  background: var(--yellow, #FFEB00) !important;
  border-color: transparent !important;
  color:#0b1230 !important;
  filter: brightness(1.05) !important;
  opacity: 1 !important;
}

/* Legacy X5 buttons */
#imHeader_imObjectButton_03_button:hover,
#imStickyBar_imObjectButton_03_button:hover,
[id^="imObjectButton_"][id$="_button"]:hover{
  transform: translateY(-2px) !important;
  filter: brightness(1.05) !important;
  opacity: 1 !important;
}

/* Mobile menu / hamburger */
.hamburger{
  width:44px !important;
  height:44px !important;
  border-radius:12px !important;
  border:1px solid rgba(255,255,255,.13) !important;
  background: rgba(255,255,255,.07) !important;
}
.hamburger span{
  background: rgba(234,240,255,.9) !important;
}
@media(max-width: 980px){
  .navlinks{ display:none !important; }
  .hamburger{ display:inline-flex !important; align-items:center !important; justify-content:center !important; }
}
.mobilemenu a{
  font-weight:900 !important;
  color: rgba(234,240,255,.88) !important;
}
.mobilemenu a:hover{
  background: rgba(255,255,255,.06) !important;
  color: var(--text, #EAF0FF) !important;
}

/* Index hero readability restore - scoped only to the homepage video hero */
.hero.hero-video-section::before{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(90deg, rgba(3,8,18,.88) 0%, rgba(3,8,18,.78) 38%, rgba(3,8,18,.58) 68%, rgba(3,8,18,.28) 100%) !important;
  z-index:0;
}
.hero.hero-video-section > *,
.hero.hero-video-section .container,
.hero.hero-video-section .content,
.hero.hero-video-section .hero-content{
  position: relative;
  z-index: 1;
}
.hero.hero-video-section .content,
.hero.hero-video-section .hero-content,
.hero.hero-video-section .container.hero-content{
  display: inline-block;
  max-width: 980px;
  padding: 28px 30px 22px !important;
  border-radius: 24px;
  background: linear-gradient(180deg, rgba(7,12,22,.54), rgba(7,12,22,.38)) !important;
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 24px 60px rgba(0,0,0,.34);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.hero.hero-video-section .kicker{
  background: rgba(0,0,0,.52) !important;
  border: 1px solid rgba(255,255,255,.26) !important;
  color: rgba(255,255,255,.95) !important;
  box-shadow: 0 8px 22px rgba(0,0,0,.30);
}
.hero.hero-video-section .h1,
.hero.hero-video-section h1{
  color:#FFFFFF !important;
  text-shadow: 0 10px 30px rgba(0,0,0,.88) !important;
}
.hero.hero-video-section .lead,
.hero.hero-video-section p.lead{
  color: rgba(255,255,255,.96) !important;
  text-shadow: 0 3px 16px rgba(0,0,0,.92) !important;
  font-weight: 500;
  max-width: 760px;
}
.hero.hero-video-section .stats .stat,
.hero.hero-video-section .feature-card,
.hero.hero-video-section .value{
  background: rgba(5,10,18,.78) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  box-shadow: 0 16px 36px rgba(0,0,0,.26);
}
.hero.hero-video-section .stats .stat span,
.hero.hero-video-section .feature-card p,
.hero.hero-video-section .value span{
  color: rgba(255,255,255,.92) !important;
}
.hero.hero-video-section .btn{
  background: rgba(0,0,0,.46) !important;
  border-color: rgba(255,255,255,.24) !important;
  text-shadow: none !important;
}
.hero.hero-video-section .btn-primary{
  background: linear-gradient(90deg, rgba(43,107,255,1), rgba(0,179,255,.92)) !important;
  color: #071023 !important;
  border-color: rgba(43,107,255,.45) !important;
}



/* Restore slightly larger logo across pages */
.brand img{
  width: 210px !important;
  height: auto !important;
}



/* =========================
   Index hero main area restore
   ========================= */
.hero.hero-video-section{
  position: relative !important;
  min-height: 820px !important;
  overflow: hidden !important;
}
.hero.hero-video-section #heroVideo,
.hero.hero-video-section video{
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}
.hero.hero-video-section .hero-overlay{
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(90deg, rgba(3,8,18,.82) 0%, rgba(3,8,18,.68) 42%, rgba(3,8,18,.42) 72%, rgba(3,8,18,.16) 100%) !important;
  z-index: 0 !important;
}
.hero.hero-video-section .container.hero-content{
  position: relative !important;
  z-index: 2 !important;
  display: inline-block !important;
  max-width: 980px !important;
  margin: 86px 0 44px 72px !important;
  padding: 30px 32px 24px !important;
  border-radius: 24px !important;
  background: linear-gradient(180deg, rgba(7,12,22,.60), rgba(7,12,22,.42)) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  box-shadow: 0 26px 70px rgba(0,0,0,.38) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
}
.hero.hero-video-section .kicker{
  display: inline-flex !important;
  margin-bottom: 18px !important;
}
.hero.hero-video-section .h1,
.hero.hero-video-section h1{
  font-size: clamp(46px, 5.6vw, 78px) !important;
  line-height: 1.02 !important;
  margin: 0 0 18px !important;
}
.hero.hero-video-section .lead,
.hero.hero-video-section p.lead{
  font-size: 18px !important;
  line-height: 1.72 !important;
  margin: 0 0 24px !important;
}
.hero.hero-video-section .hero-actions{
  display:flex !important;
  gap:12px !important;
  flex-wrap:wrap !important;
  margin-bottom: 26px !important;
}
.hero.hero-video-section .stats{
  display:grid !important;
  grid-template-columns: repeat(3, minmax(0,1fr)) !important;
  gap:14px !important;
  max-width: 900px !important;
}
.hero.hero-video-section .stat{
  padding: 18px 18px 16px !important;
  border-radius: 18px !important;
}
.hero.hero-video-section .stat strong{
  display:block !important;
  margin-bottom: 6px !important;
}
@media (max-width: 980px){
  .hero.hero-video-section{
    min-height: auto !important;
    padding-bottom: 40px !important;
  }
  .hero.hero-video-section .container.hero-content{
    display:block !important;
    margin: 78px 24px 30px !important;
    max-width: none !important;
  }
  .hero.hero-video-section .stats{
    grid-template-columns: 1fr !important;
  }
}



/* Index hero left-justified readability fix */
.hero.hero-video-section{
  position: relative !important;
  min-height: 820px !important;
  overflow: hidden !important;
}
.hero.hero-video-section .container.content.hero-content{
  position: relative !important;
  z-index: 2 !important;
  display: block !important;
  width: min(980px, calc(100% - 96px)) !important;
  max-width: 980px !important;
  margin: 92px 0 44px 72px !important;
  padding: 30px 32px 24px !important;
  text-align: left !important;
  border-radius: 24px !important;
  background: linear-gradient(180deg, rgba(7,12,22,.68), rgba(7,12,22,.50)) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  box-shadow: 0 26px 70px rgba(0,0,0,.42) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
}
.hero.hero-video-section .kicker,
.hero.hero-video-section .h1,
.hero.hero-video-section h1,
.hero.hero-video-section .lead,
.hero.hero-video-section p.lead,
.hero.hero-video-section .hero-actions,
.hero.hero-video-section .stats{
  text-align: left !important;
}
.hero.hero-video-section .h1,
.hero.hero-video-section h1{
  max-width: 12ch !important;
  font-size: clamp(54px, 5.8vw, 82px) !important;
  line-height: 0.98 !important;
  margin: 0 0 18px !important;
}
.hero.hero-video-section .lead,
.hero.hero-video-section p.lead{
  max-width: 700px !important;
  font-size: 18px !important;
  line-height: 1.7 !important;
  margin: 0 0 22px !important;
}
.hero.hero-video-section .hero-actions{
  display: flex !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  margin: 0 0 26px !important;
}
.hero.hero-video-section .stats{
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0,1fr)) !important;
  gap: 14px !important;
  max-width: 860px !important;
}
.hero.hero-video-section .stat{
  min-height: 110px !important;
}
.hero.hero-video-section .hero-overlay{
  background: linear-gradient(90deg, rgba(3,8,18,.84) 0%, rgba(3,8,18,.70) 40%, rgba(3,8,18,.44) 72%, rgba(3,8,18,.18) 100%) !important;
}
@media (max-width: 980px){
  .hero.hero-video-section .container.content.hero-content{
    width: auto !important;
    max-width: none !important;
    margin: 78px 24px 30px !important;
    padding: 24px 22px 22px !important;
  }
  .hero.hero-video-section .h1,
  .hero.hero-video-section h1{
    max-width: none !important;
    font-size: clamp(40px, 10vw, 62px) !important;
  }
  .hero.hero-video-section .stats{
    grid-template-columns: 1fr !important;
  }
}


/* Jail feature icon cleanup: use complete white-on-blue replacement assets for the icons that were rendering dark.
   The rest of the feature images remain the original artwork. */
.features .feat img{
  object-fit: contain;
}