/* ===== V15 MOBILE HEADER / HERO HARD FIX ===== */
@media(max-width:980px){
  header,.header,.site-header{position:relative!important;z-index:5000!important}
  .nav,.navbar,.nav-inner,.header-inner{overflow:visible!important}
  .menu-toggle,.mobile-toggle,.hamburger,[class*="menu-toggle"]{
    position:relative!important;z-index:5100!important;pointer-events:auto!important;cursor:pointer!important
  }
  nav,.navlinks,.nav-links,.main-nav{
    z-index:5050!important
  }
}
@media(max-width:768px){
  html,body{max-width:100%!important;overflow-x:hidden!important}
  .wrap,.container{width:100%!important;max-width:100%!important;padding-left:16px!important;padding-right:16px!important}

  /* hero must stack on mobile instead of overlapping */
  .n4-product-hero{padding:42px 0 34px!important;min-height:0!important;overflow:hidden!important}
  .n4-hero-grid{display:flex!important;flex-direction:column!important;gap:24px!important;align-items:stretch!important}
  .n4-hero-copy{width:100%!important;max-width:100%!important;position:relative!important;z-index:5!important}
  .n4-hero-eyebrow{font-size:8px!important;letter-spacing:1.5px!important;margin-bottom:15px!important}
  .n4-hero-copy h1{
    max-width:100%!important;
    font-size:clamp(38px,12vw,52px)!important;
    line-height:.94!important;
    letter-spacing:-1px!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
  }
  .n4-hero-copy>p{font-size:13px!important;line-height:1.7!important;margin:18px 0!important;max-width:100%!important}
  .n4-hero-copy ul{display:grid!important;grid-template-columns:1fr!important;gap:8px!important;margin-bottom:20px!important}
  .n4-hero-actions{display:grid!important;grid-template-columns:1fr!important;gap:9px!important}
  .n4-primary-btn,.n4-secondary-btn{width:100%!important;min-height:48px!important}

  /* 3D server is now below copy, never on top of heading/text */
  .n4-hero-visual{
    order:2!important;width:100%!important;height:285px!important;min-height:285px!important;
    margin:0 auto!important;overflow:hidden!important;position:relative!important
  }
  .n4-server-stack{
    width:158px!important;height:184px!important;padding:20px 17px!important;
    transform:perspective(700px) rotateY(-7deg) rotateX(3deg)!important;
    margin:auto!important
  }
  .n4-server-stack i{height:35px!important;margin-bottom:9px!important}
  .n4-server-stack i:after{width:45px!important}
  .n4-orbit-one{width:220px!important;height:220px!important}
  .n4-orbit-two{width:270px!important;height:165px!important}
  .n4-float-card{min-width:96px!important;max-width:118px!important;padding:9px 10px!important}
  .n4-float-card b{font-size:14px!important}.n4-float-card span{font-size:8px!important}
  .n4-fc1{left:2%!important;top:30px!important}.n4-fc2{right:1%!important;top:90px!important}.n4-fc3{left:7%!important;bottom:7px!important}

  /* remove any desktop sticky price bar collision */
  [class*="sticky-price"],[class*="hero-price-bar"],.mobile-price-bar{
    position:relative!important;left:auto!important;right:auto!important;bottom:auto!important;width:100%!important
  }
}
@media(max-width:390px){
  .n4-product-hero{padding-top:34px!important}
  .n4-hero-copy h1{font-size:37px!important}
  .n4-hero-visual{height:260px!important;min-height:260px!important}
}

/* universal mobile drawer fallback */
@media(max-width:980px){
  body.n4-menu-open{overflow:hidden!important}
  .n4-mobile-open{
    display:flex!important;visibility:visible!important;opacity:1!important;pointer-events:auto!important;
    position:absolute!important;top:100%!important;left:0!important;right:0!important;
    width:100%!important;max-height:calc(100vh - 70px)!important;overflow-y:auto!important;
    flex-direction:column!important;align-items:stretch!important;gap:0!important;
    padding:12px 16px 22px!important;background:var(--bg,#0b0e11)!important;
    border-top:1px solid var(--line,#30353a)!important;box-shadow:0 24px 45px #0007!important;z-index:5050!important
  }
  .n4-mobile-open>a,.n4-mobile-open>.dropdown>.dropbtn,.n4-mobile-open>.dropdown>a{
    display:flex!important;width:100%!important;min-height:48px!important;align-items:center!important;
    justify-content:space-between!important;padding:0 5px!important
  }
  .n4-mobile-open .dropdown{width:100%!important}
  .n4-mobile-open .dropdown>.drop{position:static!important;width:100%!important;box-shadow:none!important;margin:0!important}
}