#S-NET{
  position:relative;z-index:1;
  height:100vh;min-height:700px;
  margin-top:0;
  background:transparent;
  overflow:hidden;
  pointer-events:none;
}
#S-NET .NV-HELIA-BOX{pointer-events:auto}
#S-NET canvas{position:absolute;inset:0;z-index:1}

/* HELIA Core — translucent product-card slider · focus stays on the agents */
.NV-HELIA-CENTER{
  position:absolute;
  left:50%;top:50%;
  transform:translate(-50%,-50%);
  z-index:12;
  width:178px;height:200px;
  pointer-events:none;
}

.NV-HELIA-SIGNAL{
  position:absolute;inset:0;
  border-radius:20px;
  border:1px solid rgba(167,139,250,.36);
  pointer-events:none;
  animation:heliaSignal 3.6s ease-out infinite;
  will-change:transform,opacity;
}
.NV-HELIA-SIGNAL-2{animation-delay:1.2s}
.NV-HELIA-SIGNAL-3{animation-delay:2.4s}
@keyframes heliaSignal{
  0%   {transform:scale(1);   opacity:.42; border-color:rgba(167,139,250,.36)}
  70%  {opacity:.08}
  100% {transform:scale(1.55);opacity:0;   border-color:rgba(167,139,250,0)}
}

/* Translucent glass — apps + agents bleed through subtly */
.NV-HELIA-BOX{
  position:absolute;inset:0;
  z-index:2;
  border-radius:20px;
  background:linear-gradient(155deg, rgba(255,255,255,.32) 0%, rgba(244,242,236,.18) 100%);
  backdrop-filter:blur(18px) saturate(140%);
  -webkit-backdrop-filter:blur(18px) saturate(140%);
  box-shadow:
    0 18px 50px -14px rgba(167,139,250,.18),
    0 6px 18px rgba(12,11,8,.22),
    inset 0 1px 0 rgba(255,255,255,.55),
    inset 0 0 0 1px rgba(167,139,250,.22);
  overflow:hidden;
  pointer-events:auto;cursor:pointer;
  animation:heliaPulse 5s ease-in-out infinite;
}
@keyframes heliaPulse{
  0%,100%{box-shadow:0 18px 50px -14px rgba(167,139,250,.18),0 6px 18px rgba(12,11,8,.22),inset 0 1px 0 rgba(255,255,255,.55),inset 0 0 0 1px rgba(167,139,250,.22)}
  50%    {box-shadow:0 22px 70px -12px rgba(167,139,250,.32),0 6px 18px rgba(12,11,8,.22),inset 0 1px 0 rgba(255,255,255,.65),inset 0 0 0 1px rgba(167,139,250,.38)}
}
.NV-HB-GLINT{
  position:absolute;
  top:-30%;left:-20%;
  width:70%;height:55%;
  background:linear-gradient(135deg,rgba(255,255,255,.42) 0%,transparent 60%);
  transform:rotate(-12deg);
  pointer-events:none;
  z-index:1;
}

/* ── Product slider ── */
.NV-HS-TRACK{
  position:absolute;
  inset:0;
  z-index:2;
}
.NV-HS-SLIDE{
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:5px;
  padding:14px 14px 24px;
  opacity:0;
  transform:translateX(36px) scale(.97);
  filter:blur(2px);
  transition:opacity .75s cubic-bezier(.22,1,.36,1),
             transform .85s cubic-bezier(.22,1,.36,1),
             filter .55s cubic-bezier(.22,1,.36,1);
  pointer-events:none;
}
.NV-HS-SLIDE.active{
  opacity:1;
  transform:translateX(0) scale(1);
  filter:blur(0);
}
.NV-HS-SLIDE.exit{
  opacity:0;
  transform:translateX(-36px) scale(.97);
  filter:blur(2px);
  transition:opacity .65s cubic-bezier(.22,1,.36,1),
             transform .75s cubic-bezier(.22,1,.36,1),
             filter .45s cubic-bezier(.22,1,.36,1);
}

/* Tier label — gives it product-vibes (like an SKU/edition tag) */
.NV-HS-TIER{
  font-family:var(--M);
  font-size:8.5px;
  font-weight:600;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:rgba(196,181,253,.95);
  padding:3px 10px;
  border:1px solid rgba(167,139,250,.4);
  border-radius:100px;
  background:rgba(76,29,149,.22);
  margin-bottom:2px;
}

.NV-HS-IMG{
  width:62px;
  height:62px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin:2px 0 4px;
  filter:drop-shadow(0 8px 16px rgba(167,139,250,.35));
}
.NV-HS-IMG svg{ width:100%; height:100% }

.NV-HB-LOGO{
  font-family:var(--S);
  font-weight:700;
  font-size:15px;
  letter-spacing:.3em;
  color:#fff;
  text-shadow:0 1px 2px rgba(12,11,8,.35);
}
.NV-HS-SPEC{
  font-family:var(--M);
  font-size:8.5px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:rgba(244,242,236,.7);
  margin-top:1px;
  text-align:center;
  line-height:1.4;
}

.NV-HS-DOTS{
  position:absolute;
  bottom:9px;
  left:50%;
  transform:translateX(-50%);
  display:flex;
  gap:5px;
  z-index:3;
}
.NV-HS-DOTS span{
  width:4px;height:4px;
  border-radius:50%;
  background:rgba(244,242,236,.22);
  transition:all .55s cubic-bezier(.22,1,.36,1);
}
.NV-HS-DOTS span.active{
  width:16px;
  border-radius:100px;
  background:rgba(244,242,236,.78);
}

@media(max-width:768px){
  #S-NET{height:100%;min-height:460px}
  .NV-HELIA-CENTER{width:158px;height:178px}
  .NV-HELIA-SIGNAL{border-radius:16px}
  .NV-HELIA-BOX{border-radius:16px}
  .NV-HS-IMG{ width:54px;height:54px }
  .NV-HB-LOGO{font-size:13px;letter-spacing:.26em}
  .NV-HS-SPEC{font-size:8px}
  .NV-HS-TIER{font-size:7.5px;padding:2px 8px}
}