/* Byte Core V15 — focused fixes: globe placement, visible tunnel, mobile product motion, Lab particles */

/* 1) Hero: keep the globe on the right on desktop. The WebGL position is handled in webgl.js;
      these layers only preserve a clean composition above it. */
.hero-copy-wrap{max-width:760px!important}
@media(min-width:901px){
  .hero-copy-wrap{width:min(740px,50vw)!important}
  .hero-data-cloud{right:4.2vw!important}
}

/* 2) Immersion: WebGL must be visible THROUGH the section. The previous opaque section background
      was literally covering the fixed WebGL canvas. */
.transit{
  height:182svh!important;
  min-height:0!important;
  background:transparent!important;
  overflow:clip!important;
  isolation:isolate;
}
.transit:before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    radial-gradient(circle at 50% 50%,rgba(255,255,255,0) 0 25%,rgba(255,249,244,.08) 52%,rgba(255,255,255,.28) 90%),
    linear-gradient(180deg,rgba(255,255,255,.26),rgba(255,249,244,.10) 46%,rgba(255,255,255,.30));
}
.transit-sticky{
  top:68px!important;
  height:calc(100svh - 68px)!important;
  min-height:590px!important;
  padding:clamp(36px,5vh,66px) var(--pad)!important;
  overflow:hidden!important;
  perspective:150px!important;
  background:transparent!important;
}
.transit-sticky:after{
  background:radial-gradient(circle at 50% 50%,rgba(255,255,255,0) 0 30%,rgba(255,251,248,.03) 55%,rgba(255,255,255,.10) 87%,rgba(255,255,255,.18) 100%)!important;
}
.transit-copy{z-index:5!important;transform-style:preserve-3d!important}
.transit-title,.transit-line{transform-style:preserve-3d!important}
.transit-hud{z-index:5!important}

/* 3) Product scene: allow motion on mobile too. */
@media(max-width:900px){
  .product-orbit{
    transform:perspective(1200px)
      rotateX(var(--mobile-float-rot,0deg))
      translate3d(0,calc(var(--mobile-float-y,0px) + var(--show-lift,0px)),0)!important;
    transform-style:preserve-3d!important;
    will-change:transform!important;
  }
  .panel-dashboard,.panel-tablet,.panel-phone,.orbit-one,.orbit-two{will-change:transform!important}
}

/* 4) Dedicated orange star field for Byte Core Lab only. */
.lab{isolation:isolate!important;overflow:hidden!important}
.lab-particles{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  z-index:2;
  pointer-events:none;
  opacity:.82;
  mix-blend-mode:multiply;
}
.lab-copy,.lab-readout{position:relative;z-index:5!important}
.lab-overlay{z-index:1!important;pointer-events:none}

@media(max-width:900px){
  .transit{height:172svh!important}
  .transit-sticky{min-height:540px!important;padding:46px var(--pad) 34px!important;align-content:center!important}
  .lab-particles{opacity:.72}
}
@media(max-width:560px){
  .transit{height:166svh!important}
  .transit-sticky{min-height:510px!important;padding-top:38px!important;padding-bottom:30px!important}
  .lab-particles{opacity:.64}
}

@media(prefers-reduced-motion:reduce){
  .transit{height:auto!important;min-height:92svh!important}
  .transit-sticky{position:relative!important;top:auto!important;height:auto!important;min-height:92svh!important}
  .product-orbit{transform:none!important}
  .lab-particles{opacity:.46}
}