/* MU (mobile drawer) - non-destructive, only adds behavior on small screens */
:root{
  --mu-bg:#0b1220;
  --mu-card:#121a2b;
  --mu-text:#e8eefc;
  --mu-accent:#f4b000; /* golden to match logo */
}
.site-header{position:sticky;top:0;z-index:20;background:#fff;border-bottom:1px solid #eef2f7}
.mu-btn{
  display:none;align-items:center;gap:.5rem;
  border:1px solid #e6e8ef;border-radius:.75rem;padding:.5rem .75rem;
  background:#fff;box-shadow:0 2px 6px rgba(2,9,20,.06);cursor:pointer;
}
.mu-btn .bars{display:inline-block;width:20px;height:14px;position:relative}
.mu-btn .bars:before,.mu-btn .bars:after,.mu-btn .bars i{
  content:"";position:absolute;left:0;right:0;height:2px;background:#222;border-radius:2px
}
.mu-btn .bars i{top:6px}
.mu-btn .bars:before{top:0}
.mu-btn .bars:after{bottom:0}

.mu-backdrop{position:fixed;inset:0;background:rgba(2,10,24,.55);backdrop-filter:saturate(120%) blur(4px);
  opacity:0;pointer-events:none;transition:opacity .2s ease;z-index:49}
.mu-drawer{position:fixed;inset:0;background:var(--mu-bg);color:var(--mu-text);
  transform:translateY(-2%);opacity:0;pointer-events:none;transition:transform .22s ease,opacity .22s ease;
  z-index:50;display:flex;flex-direction:column}
.mu-drawer .head{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid #1f2740}
.mu-drawer .brand{display:flex;align-items:center;gap:.6rem}
.mu-drawer .brand img{width:28px;height:28px;border-radius:.4rem}
.mu-drawer a{display:block;color:var(--mu-text);text-decoration:none;border-bottom:1px solid #1a2236;padding:14px 18px;font-weight:600}
.mu-drawer a:hover{background:#111a2d}
.mu-close{border:1px solid #2a3557;border-radius:.65rem;padding:.4rem .65rem;background:#0e1730;color:#fff;cursor:pointer}

.mu-open .mu-backdrop{opacity:1;pointer-events:auto}
.mu-open .mu-drawer{transform:translateY(0);opacity:1;pointer-events:auto}

/* Mobile behavior */
@media (max-width: 900px){
  .site-header nav{display:none !important;}
  .mu-btn{display:flex;}
}

/* Keep desktop pristine */
@media (min-width: 901px){
  .mu-drawer,.mu-backdrop{display:none !important;}
}