/* =========================================================
   NEXGEN GROWTH — FINAL MOBILE EXPERIENCE
   ========================================================= */

:root{
  --nx-mobile-bar-bg:rgba(5,12,23,.94);
  --nx-mobile-line:rgba(255,255,255,.10);
  --nx-mobile-text:#f4f8ff;
  --nx-mobile-muted:#94a8c1;
  --nx-mobile-accent:#56ead8;
}

*{
  box-sizing:border-box;
}

html,
body{
  max-width:100%;
  overflow-x:hidden;
}

img,
video,
svg,
canvas{
  max-width:100%;
}

a,
button,
input,
select,
textarea{
  touch-action:manipulation;
}

:focus-visible{
  outline:2px solid var(--nx-mobile-accent);
  outline-offset:3px;
}

/* Desktop: final mobile navigation stays invisible */
.nx-final-mobile-nav,
.nx-final-mobile-more{
  display:none;
}

@media (max-width:820px){

  body{
    padding-bottom:
      calc(82px + env(safe-area-inset-bottom));
  }

  /* Compact premium header */
  header{
    min-height:56px!important;
  }

  header nav{
    min-height:56px!important;
  }

  header img{
    max-height:38px;
    width:auto;
  }

  /* Prevent desktop dropdowns from creating horizontal overflow */
  header,
  header nav,
  header > div{
    max-width:100%;
  }

  /* Bottom dock */
  .nx-final-mobile-nav{
    position:fixed;
    left:10px;
    right:10px;
    bottom:
      calc(8px + env(safe-area-inset-bottom));
    z-index:10000;

    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));

    min-height:62px;
    padding:6px;

    border:1px solid var(--nx-mobile-line);
    border-radius:21px;

    background:var(--nx-mobile-bar-bg);

    box-shadow:
      0 22px 60px rgba(0,0,0,.48),
      inset 0 1px 0 rgba(255,255,255,.04);

    backdrop-filter:blur(22px);
    -webkit-backdrop-filter:blur(22px);
  }

  .nx-final-mobile-nav a,
  .nx-final-mobile-nav button{
    appearance:none;
    border:0;
    min-width:0;
    min-height:50px;
    margin:0;
    padding:5px 2px;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:4px;

    border-radius:14px;
    background:transparent;

    color:var(--nx-mobile-muted);
    text-decoration:none;

    font:inherit;
    font-size:10px;
    font-weight:750;

    cursor:pointer;
  }

  .nx-final-mobile-nav .nx-icon{
    display:block;
    font-size:18px;
    line-height:1;
  }

  .nx-final-mobile-nav a[aria-current="page"]{
    background:
      linear-gradient(
        180deg,
        rgba(86,234,216,.13),
        rgba(86,234,216,.06)
      );

    color:#fff;

    box-shadow:
      inset 0 0 0 1px rgba(86,234,216,.09);
  }

  .nx-final-mobile-nav button[aria-expanded="true"]{
    background:rgba(255,255,255,.07);
    color:#fff;
  }

  /* More sheet */
  .nx-final-mobile-more{
    position:fixed;
    left:12px;
    right:12px;
    bottom:
      calc(82px + env(safe-area-inset-bottom));

    z-index:9999;

    padding:12px;

    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;

    border:1px solid var(--nx-mobile-line);
    border-radius:22px;

    background:rgba(5,12,23,.975);

    box-shadow:
      0 25px 80px rgba(0,0,0,.58);

    backdrop-filter:blur(24px);
    -webkit-backdrop-filter:blur(24px);
  }

  .nx-final-mobile-more[data-open="1"]{
    display:grid;
  }

  .nx-final-mobile-more a{
    display:flex;
    min-height:48px;
    align-items:center;

    padding:11px 13px;

    border:1px solid rgba(255,255,255,.075);
    border-radius:14px;

    background:rgba(255,255,255,.035);

    color:var(--nx-mobile-text);
    text-decoration:none;

    font-size:13px;
    font-weight:700;
  }

  .nx-final-mobile-more a:active{
    transform:scale(.985);
  }

  /* Disable legacy duplicate docks */
  .nx-elite-dock:not(.nx-final-mobile-nav),
  .nx-bottom-nav,
  .nx-mobile-bottom,
  .mobile-bottom-nav,
  .bottom-mobile-nav{
    display:none!important;
  }

  main,
  section,
  article,
  footer{
    max-width:100%;
  }

  section{
    scroll-margin-top:76px;
  }
}

@media (max-width:380px){
  .nx-final-mobile-nav{
    left:6px;
    right:6px;
  }

  .nx-final-mobile-nav a,
  .nx-final-mobile-nav button{
    font-size:9px;
  }

  .nx-final-mobile-nav .nx-icon{
    font-size:17px;
  }
}

@media (prefers-reduced-motion:reduce){
  *,
  *::before,
  *::after{
    scroll-behavior:auto!important;
    transition-duration:.001ms!important;
    animation-duration:.001ms!important;
    animation-iteration-count:1!important;
  }
}

/* Real static navigation anchors */
.nx-anchor-target{
  display:block;
  width:0;
  height:0;
  overflow:hidden;
  scroll-margin-top:92px;
}


/* NX-MOBILE-HEADER-BRAND-CONSISTENCY-2026
   Keep the shared shell-v2 .nx-brand shine.
   This block only normalizes mobile header geometry and prevents
   page-local typography/effects from replacing the shared brand effect.
*/
@media (max-width:820px){

  header.nx-header,
  #nx-global-header.nx-header{
    min-height:50px!important;
    height:50px!important;
    padding-top:0!important;
    padding-bottom:0!important;
    display:flex!important;
    align-items:center!important;
  }

  #nx-global-header .nx-shell,
  #nx-global-header .nx-header-inner,
  #nx-global-header .nx-header-wrap{
    min-height:50px!important;
  }

  #nx-global-header .nx-brand{
    line-height:1!important;
    margin-top:0!important;
    margin-bottom:0!important;

    /* reuse canonical shell-v2 brand shine */
    background:linear-gradient(
      90deg,
      #fff,
      #00f5ff,
      #fff,
      #a84cff,
      #00f5ff
    )!important;
    background-size:320%!important;
    -webkit-background-clip:text!important;
    background-clip:text!important;
    color:transparent!important;
    -webkit-text-fill-color:transparent!important;
    animation:nxLogoGlow 6s linear infinite!important;
  }
}

@media (max-width:380px){
  header.nx-header,
  #nx-global-header.nx-header{
    min-height:48px!important;
    height:48px!important;
  }

  #nx-global-header .nx-shell,
  #nx-global-header .nx-header-inner,
  #nx-global-header .nx-header-wrap{
    min-height:48px!important;
  }
}

