.material-symbols-outlined{
  font-variation-settings:'FILL' 0,'wght' 400,'GRAD' 0,'opsz' 24;
  vertical-align:middle
}
body{font-family:'Inter',sans-serif;background:#0b1326;color:#dae2fd}
h1,h2,h3,h4,.font-headline{font-family:'Space Grotesk',sans-serif}
.landing-shell{
  background:
    radial-gradient(circle at top right,rgba(78,222,163,.09),transparent 28%),
    radial-gradient(circle at 15% 15%,rgba(183,200,225,.08),transparent 22%),
    linear-gradient(180deg,#060e20 0%,#0b1326 18%,#0b1326 100%)
}
.glass-panel{
  background:rgba(45,52,73,.65);
  backdrop-filter:blur(20px);
  box-shadow:0 0 0 1px rgba(183,200,225,.06)
}
.hero-stage::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(6,14,32,.94) 0%,rgba(11,19,38,.8) 28%,rgba(11,19,38,.15) 48%,transparent 60%,transparent 100%);
  z-index:1
}
.hero-stage::after{
  content:"";
  position:absolute;
  inset:auto 0 0 0;
  height:4rem;
  background:linear-gradient(180deg,rgba(11,19,38,0),#0b1326 82%);
  z-index:1
}
.metric-card{
  background:rgba(23,31,51,.82);
  backdrop-filter:blur(16px);
  box-shadow:0 24px 44px rgba(0,0,0,.22),0 0 0 1px rgba(78,222,163,.06)
}
.landing-card{
  box-shadow:0 24px 40px rgba(0,0,0,.16);
  transition:transform .18s ease,background-color .18s ease,box-shadow .18s ease
}
.landing-card:hover{
  transform:translateY(-2px);
  box-shadow:0 32px 56px rgba(0,0,0,.22)
}
.signal-bar{
  background:linear-gradient(90deg,#4edea3 0%,#10b981 100%)
}
.cta-sheen{
  position:relative;
  overflow:hidden
}
.cta-sheen::after{
  content:"";
  position:absolute;
  inset:-40% auto -40% -20%;
  width:30%;
  transform:skewX(-24deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.18),transparent);
  opacity:0;
  transition:transform .45s ease,opacity .45s ease
}
.cta-sheen:hover::after{
  opacity:1;
  transform:translateX(220%) skewX(-24deg)
}
.section-glow{
  background:
    radial-gradient(circle at top,rgba(78,222,163,.08),transparent 32%),
    linear-gradient(180deg,rgba(19,27,46,.92),rgba(11,19,38,.96))
}
@media (max-width:1023px){
  .hero-stage::before{
    background:
      linear-gradient(180deg,rgba(6,14,32,.56) 0%,rgba(11,19,38,.72) 48%,rgba(11,19,38,.94) 100%)
  }
}
@media (max-width:767px){
  .mobile-nav-open{overflow:hidden}
}
