/* nav-fix.css : additive fixes only */

/* prevent horizontal shift */
body { overflow-x: hidden; }

/* navbar base */
.navbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  background:#000;
  padding:1em;
}

.hamburger{
  display:none;
  flex-direction:column;
  gap:6px;
  cursor:pointer;
}
.hamburger span{
  width:26px;height:3px;background:#fff;display:block;
}

.nav-menu{
  display:flex;
  gap:2em;
  list-style:none;
  margin:0;padding:0;
}

.nav-right .desktop-cta,
.mobile-cta{
  background:#fcd34d;border:none;border-radius:4px;
  padding:0.5em 1.2em;font-weight:700;color:#000;cursor:pointer;
}

/* overlay */
.nav-overlay{
  position:fixed;inset:0;
  background:rgba(0,0,0,.6);
  opacity:0;pointer-events:none;
  transition:opacity .3s ease;
  z-index:900;
}

/* mobile */
@media (max-width:768px){
  .hamburger{display:flex}
  .nav-right{display:none}

  .nav-menu{
    position:fixed;
    top:0; right:0;
    width:260px;height:100vh;
    background:#000;
    display:flex;flex-direction:column;gap:20px;
    padding:120px 20px 20px;
    transform:translateX(100%);
    transition:transform .3s ease;
    z-index:1000;
  }
}

/* single state */
body.menu-open .nav-menu{ transform:translateX(0); }
body.menu-open .nav-overlay{ opacity:1; pointer-events:auto; }
body.menu-open{ overflow:hidden; }

@media (min-width:769px){
  .mobile-only{display:none}
}