/* Cache-busted hero overrides for production hosting. */
.site-header .nav{
  min-height:64px !important;
}

.hero .hero-grid{
  display:grid !important;
  grid-template-columns:minmax(520px,.96fr) minmax(540px,1.04fr) !important;
  gap:28px !important;
  align-items:start !important;
  padding:24px 0 42px !important;
}

.hero .hero-copy{
  padding-top:0 !important;
}

.hero h1{
  max-width:820px !important;
  font-size:clamp(34px,3.05vw,46px) !important;
  line-height:1.08 !important;
  margin-bottom:16px !important;
}

.hero .hero-lead{
  max-width:780px !important;
  font-size:17px !important;
  line-height:1.56 !important;
}

.hero .hero-actions{
  margin:20px 0 0 !important;
}

.hero .hero-facts{
  margin-top:24px !important;
}

.hero .hero-visual{
  display:grid !important;
  grid-template-columns:minmax(300px,1.1fr) minmax(240px,.9fr) !important;
  gap:16px !important;
  align-items:start !important;
  padding-top:0 !important;
}

.hero .dashboard,
.hero .route-panel{
  border:1px solid rgba(128,205,255,.22) !important;
  background:rgba(4,24,52,.76) !important;
  border-radius:8px !important;
  box-shadow:0 30px 90px rgba(0,0,0,.24) !important;
  padding:18px !important;
}

.hero .dash-metrics{
  grid-template-columns:repeat(2,1fr) !important;
  margin:14px 0 !important;
}

.hero .dash-metrics strong{
  font-size:26px !important;
}

.hero .chart{
  height:170px !important;
}

.hero .route-panel{
  display:grid !important;
  gap:12px !important;
}

.hero .route-kicker{
  display:block !important;
  color:#8adfff !important;
  font-weight:850 !important;
  font-size:15px !important;
}

.hero .route-step{
  position:relative !important;
  border:1px solid rgba(143,203,255,.16) !important;
  border-radius:8px !important;
  padding:13px 13px 13px 42px !important;
  background:rgba(255,255,255,.045) !important;
}

.hero .route-step:before{
  content:"" !important;
  position:absolute !important;
  left:14px !important;
  top:18px !important;
  width:12px !important;
  height:12px !important;
  border-radius:50% !important;
  background:#20c7ff !important;
  box-shadow:0 0 0 5px rgba(32,199,255,.12) !important;
}

.hero .route-step:after{
  content:"" !important;
  position:absolute !important;
  left:19px !important;
  top:33px !important;
  bottom:-15px !important;
  width:2px !important;
  background:rgba(32,199,255,.24) !important;
}

.hero .route-step:last-child:after{
  display:none !important;
}

.hero .route-step strong{
  display:block !important;
  color:#fff !important;
  font-size:17px !important;
  line-height:1.2 !important;
  margin-bottom:5px !important;
}

.hero .route-step span{
  display:block !important;
  color:rgba(255,255,255,.76) !important;
  font-size:14px !important;
  line-height:1.42 !important;
}

.hero .route-step.active{
  border-color:rgba(32,199,255,.38) !important;
  background:rgba(32,199,255,.08) !important;
}

@media(max-width:1180px){
  .hero .hero-grid{
    grid-template-columns:1fr !important;
    padding:22px 0 40px !important;
  }

  .hero .hero-visual{
    grid-template-columns:minmax(0,1.15fr) minmax(260px,.85fr) !important;
  }
}

@media(max-width:820px){
  .hero .hero-visual{
    grid-template-columns:1fr !important;
  }

  .hero .route-panel{
    grid-template-columns:repeat(2,1fr) !important;
  }

  .hero .route-kicker{
    grid-column:1/-1 !important;
  }
}

@media(max-width:720px){
  .site-header .nav{
    min-height:58px !important;
  }

  .hero .hero-grid{
    padding:20px 0 34px !important;
  }

  .hero h1{
    font-size:clamp(29px,8vw,36px) !important;
  }

  .hero .route-panel{
    grid-template-columns:1fr !important;
  }
}
