/* =====================================================================
   XENN — menu mobile untuk situs xenn.net
   Dipakai oleh includes/header.php (tombol) + includes/footer.php (skrip).
   Desktop TIDAK terpengaruh: tombol hanya muncul di layar <= 850px.
   ===================================================================== */

/* tombol menu: tersembunyi di desktop */
.nav-toggle{
  display:none;align-items:center;justify-content:center;
  width:42px;height:42px;padding:0;flex:none;
  background:rgba(255,255,255,.02);border:1px solid #293544;border-radius:4px;
  color:#dbe8f2;cursor:pointer;transition:.2s;
}
.nav-toggle:hover{background:rgba(255,255,255,.06);border-color:#3a4a5c}
.nav-toggle svg{display:block}
.nav-toggle .x{display:none}
.site-header.menu-open .nav-toggle .garis{display:none}
.site-header.menu-open .nav-toggle .x{display:block}

@media(max-width:850px){
  .nav-toggle{display:inline-flex}

  /* brand jangan sampai terbelah dua baris saat tombol menu muncul */
  .brand{white-space:nowrap;font-size:20px;letter-spacing:.06em}
  .brand img{width:24px;height:24px}

  /* menu terbuka: panel turun penuh di bawah header */
  .site-header.menu-open nav{
    display:flex;flex-direction:column;gap:0;
    position:absolute;top:100%;left:0;right:0;
    background:#070a10;border-top:1px solid #1c2733;border-bottom:1px solid #1c2733;
    box-shadow:0 18px 40px rgba(0,0,0,.55);
    max-height:calc(100vh - 90px);overflow-y:auto;
  }
  .site-header.menu-open nav a{
    padding:15px 24px;font-size:15px;color:#dbe8f2;
    border-bottom:1px solid rgba(255,255,255,.05);
  }
  .site-header.menu-open nav a:last-child{border-bottom:0}
  .site-header.menu-open nav a:active{background:rgba(97,231,255,.06)}

  /* tombol ajakan tetap terlihat (dan tetap bisa diklik), lebih rapat lagi */
  .nav-cta{padding:8px 10px;font-size:11px}
}