:root{
    --clr-dark:#0f1224; --clr-accent:#ff6b00; --border:#e7ebf3;
    --bg-header:rgba(255,255,255,.92);
  }
  

  .mnav-header{
    position:sticky; top:0; z-index:50;
    background:var(--bg-header);
    backdrop-filter:blur(10px);
    border-bottom:1px solid var(--border);
  }
  .mnav-bar{
    width:min(1180px,92%); margin-inline:auto;
    display:flex; align-items:center; justify-content:space-between;
    padding:12px 0;
  }
  .mnav-brand img{ display:block; height:42px }
  

  .mnav-desktop{
    display:none; gap:22px; align-items:center;
  }
  .mnav-desktop a{
    color:var(--clr-dark); text-decoration:none; font-weight:600; position:relative;
  }
  .mnav-desktop a::after{
    content:""; position:absolute; left:0; bottom:-6px; height:2px; width:0;
    background:var(--clr-accent); transition:width .2s;
  }
  .mnav-desktop a:hover::after, .mnav-desktop a.active::after{ width:100% }
  
  .mnav-cta{
    border:1px solid var(--border);
    background:var(--clr-accent); color:#fff;
    text-decoration:none; border-radius:12px; padding:8px 14px; font-weight:600;
  }
  .mnav-toggle{
    display:grid; place-items:center;
    width:44px; height:44px; border-radius:10px;
    border:1px solid var(--border); background:#fff; color:var(--clr-dark);
    cursor:pointer;
  }
  
  .mnav-overlay{
    position:fixed; inset:0; background:rgba(15,18,36,.55);
    opacity:0; transition:opacity .2s ease; z-index:49;
  }
  .mnav-overlay[hidden]{ display:block; opacity:0; pointer-events:none; }
  
  .mnav-panel{
    position:fixed; top:0; right:0; z-index:50;
    height:100svh; width:min(86vw,360px);
    background:#fff; border-left:1px solid var(--border);
    transform:translateX(100%); transition:transform .25s ease-out; will-change:transform;
    display:flex; flex-direction:column; padding:82px 18px 18px;
    box-shadow:-5px 0 25px rgba(0,0,0,.08);
    overflow-y:auto; -webkit-overflow-scrolling:touch;
  }
  .mnav-panel[hidden]{ display:block; } 
  .mnav-list{ list-style:none; margin:0; padding:0; display:grid; gap:16px; }
  .mnav-list a{
    display:block; padding:10px 6px; color:#0f1224; font-weight:600; text-decoration:none;
  }
  .mnav-list a:active{ transform:translateY(1px) }
  html.mnav-open, body.mnav-open{ overflow:hidden; }
  body.mnav-open{ padding-right:var(--scrollbar,0px); } 
  .mnav-overlay.is-open{ opacity:1; }
  .mnav-panel.is-open{ transform:translateX(0); }
  
 
  @media (min-width:993px){
    .mnav-toggle{ display:none; }
    .mnav-desktop{ display:flex; }
    .mnav-panel, .mnav-overlay{ display:none !important; }
  }

  @media (prefers-reduced-motion:reduce){
    *{ animation:none!important; transition:none!important; }
  }
  .to-top {
    position: fixed;
    right: 20px;
    bottom: 20px;
    width: 48px;
    height: 48px;
    border: none;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: var(--clr-accent);
    color: #fff;
    box-shadow: 0 10px 24px rgba(255, 107, 0, .35);
    opacity: 0;
    visibility: hidden;
    transition: .2s;
    z-index: 50
  }

  .to-top.show {
    opacity: 1;
    visibility: visible
  }