/* ==== MOBILE MENU (Fullscreen Navigation + Accordion) — t294-m2 ==== */
/* Chỉ hiện ở breakpoint mobile; desktop giữ nguyên header hiện tại */
.mnav-overlay,.mnav{ display:none; }
@media (max-width:1299px){
  /* Khoá tràn ngang toàn site → nút menu góc phải KHÔNG bị vuốt ra khỏi màn hình */
  html, body{ overflow-x:hidden; max-width:100vw; }

  .mnav-overlay{
    display:block; position:fixed; inset:0; z-index:400;
    background:rgba(20,23,51,.35);
    backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
    opacity:0; visibility:hidden; pointer-events:none;
    transition:opacity .3s ease, visibility .3s ease;
  }
  .mnav-overlay.is-open{ opacity:1; visibility:visible; pointer-events:auto; }

  .mnav{
    display:flex; flex-direction:column;
    position:fixed; top:0; left:0; bottom:0; z-index:401;
    width:min(84vw,320px); background:#ffffff;
    box-shadow:24px 0 60px -10px rgba(20,23,51,.18);
    transform:translateX(-100%);
    transition:transform .38s cubic-bezier(.32,0,.15,1);
    overflow-y:auto; -webkit-overflow-scrolling:touch;
    color:#141733;
  }
  .mnav.is-open{ transform:translateX(0); }

  .mnav-head{
    display:flex; align-items:center; justify-content:space-between;
    padding:12px 16px 10px;
    border-bottom:1px solid rgba(20,23,51,.06);
    flex:none; position:sticky; top:0; background:#fff; z-index:2;
  }
  .mnav-logo{ height:26px; display:block; }
  .mnav-close{
    width:32px; height:32px; border-radius:50%;
    border:1px solid rgba(20,23,51,.10); background:transparent;
    display:grid; place-items:center; cursor:pointer; color:#141733;
    transition:background .2s, transform .18s;
    -webkit-tap-highlight-color:transparent;
  }
  .mnav-close:hover{ background:rgba(20,23,51,.05); }
  .mnav-close:active{ transform:scale(.94); }
  .mnav-close svg{ width:14px; height:14px; }

  .mnav-list{ display:flex; flex-direction:column; padding:4px 0 6px; flex:1; }

  .mnav-item{ border-bottom:1px solid rgba(20,23,51,.05); }
  .mnav-item:last-child{ border-bottom:none; }

  .mnav-row{
    display:flex; align-items:center; justify-content:space-between;
    padding:0 16px;
  }
  .mnav-link{
    flex:1; display:flex; align-items:center; gap:12px;
    padding:18px 0; color:#141733; font-weight:600; font-size:16px;
    text-decoration:none; letter-spacing:-.005em;
    transition:color .2s;
    -webkit-tap-highlight-color:transparent;
  }
  .mnav-link .mi,
  .mnav-link .mlink-ic{ width:20px; height:20px; flex:none; color:#137EE8; }
  .mnav-link:hover,
  .mnav-item.is-open  > .mnav-row > .mnav-link,
  .mnav-item.is-current > .mnav-row > .mnav-link{ color:#137EE8; }

  .mnav-toggle{
    width:28px; height:28px; border-radius:50%;
    border:1px solid rgba(20,23,51,.08); background:transparent;
    display:grid; place-items:center; cursor:pointer; color:#6b7280;
    flex:none; transition:background .2s, color .2s, border-color .2s;
    -webkit-tap-highlight-color:transparent; margin-left:10px;
  }
  .mnav-toggle:hover{ background:rgba(20,23,51,.05); color:#141733; }
  .mnav-toggle svg{ width:10px; height:10px; transition:transform .3s ease; }
  .mnav-item.is-open .mnav-toggle{ color:#137EE8; border-color:rgba(19,126,232,.25); background:rgba(19,126,232,.06); }
  .mnav-item.is-open .mnav-toggle svg{ transform:rotate(180deg); }

  .mnav-sub{
    max-height:0; overflow:hidden;
    transition:max-height .42s cubic-bezier(.4,0,.2,1);
    border-left:2px solid #eef1f6;
    margin:0 16px 0 34px;
  }
  .mnav-item.is-open .mnav-sub{ max-height:600px; }
  .mnav-sub-inner{ padding:2px 0 10px; display:flex; flex-direction:column; }
  .mnav-sub a{
    padding:12px 14px; color:#4b5470; font-size:14.5px; font-weight:500;
    text-decoration:none; border-radius:8px; margin:1px 0;
    transition:background .18s, color .18s;
    -webkit-tap-highlight-color:transparent;
  }
  .mnav-sub a:hover, .mnav-sub a:active{
    background:rgba(19,126,232,.07); color:#137EE8;
  }

  .mnav-cta{
    margin:10px 16px 18px; display:flex; align-items:center; justify-content:center; gap:8px;
    background:#137EE8; color:#fff; font-weight:700; font-size:13.5px;
    border-radius:12px; padding:12px 16px; text-decoration:none;
    box-shadow:0 10px 26px -10px rgba(19,126,232,.5);
    transition:background .2s, transform .15s, box-shadow .2s;
    -webkit-tap-highlight-color:transparent;
  }
  .mnav-cta:hover{ background:#0f6bcc; }
  .mnav-cta:active{ transform:scale(.98); }
  .mnav-cta svg{ width:16px; height:16px; }

  body.mnav-open{ overflow:hidden; }

  /* Ẩn cấu trúc drawer/mega mobile cũ để KHÔNG lộn xộn với menu mới */
  .m-drawer, .m-drawer-overlay{ display:none !important; }
  .menu.mobile-open{ display:none !important; }
}