/* ---------- Option B: mega menu (index.html) ---------- */
.has-sub.mega{position:static}
.mega-panel{
  position:absolute;top:calc(100% + 12px);left:50%;width:min(1080px,calc(100% - 56px));
  padding:26px 28px 18px;background:#0b0b14;
  border:1px solid var(--line);border-radius:16px;box-shadow:0 24px 60px rgba(0,0,0,.55);z-index:60;
  opacity:0;visibility:hidden;transform:translate(-50%,-6px);
  transition:opacity .2s,transform .2s,visibility 0s linear .2s;
}
.mega-panel::before{content:"";position:absolute;left:0;right:0;top:-44px;height:44px}
.has-sub.mega:hover .mega-panel,.has-sub.mega.open .mega-panel{
  opacity:1;visibility:visible;transform:translate(-50%,0);transition-delay:0s;
}
.has-sub.mega.open .sub-toggle{color:var(--text);background:rgba(255,255,255,.055)}
.has-sub.mega.open .caret{transform:rotate(180deg)}
.mega-grid{display:grid;gap:34px}
.mega-what{grid-template-columns:1.35fr .8fr 1fr}
.mega-res{grid-template-columns:1fr 1fr 1fr 1.15fr}
.mega-label{margin:0 0 10px;font:500 11px/1.2 'JetBrains Mono',ui-monospace,monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--dim)}
.mega-label.c{color:var(--cyan)}
.links .mega-panel a{display:block;margin:0 -10px;padding:7px 10px;font-size:14px;color:var(--muted);white-space:normal}
.links .mega-panel a:hover{color:var(--text);background:rgba(255,255,255,.06)}
.links .mega-panel a::after{display:none}
.links .mega-panel a.mega-item{padding:9px 10px}
.mega-item .mt{display:flex;align-items:center;gap:9px;color:var(--text);font-size:14.5px;font-weight:500}
.mega-item .md{display:block;margin:2px 0 0 17px;font-size:12.8px;line-height:1.45;color:var(--dim)}
.mdot{width:8px;height:8px;border-radius:50%;flex:0 0 auto}
.mega-sub{margin-top:10px;padding-top:8px;border-top:1px solid var(--line)}
.links .mega-panel a.mega-feat{
  display:flex;flex-direction:column;gap:6px;margin:0;padding:20px;border-radius:13px;align-self:start;
  background:linear-gradient(160deg,rgba(123,92,240,.26),rgba(34,211,238,.09));border:1px solid rgba(255,255,255,.12);
  transition:border-color .2s,transform .2s;
}
.links .mega-panel a.mega-feat:hover{border-color:rgba(123,92,240,.55);transform:translateY(-2px);background:linear-gradient(160deg,rgba(123,92,240,.32),rgba(34,211,238,.12))}
.mega-feat .mega-label{margin:0 0 2px}
.mega-feat .ft{font-size:16px;font-weight:500;color:var(--text)}
.mega-feat .fd{font-size:13px;line-height:1.5;color:var(--muted)}
.mega-feat .fl{margin-top:auto;padding-top:8px;font-size:13px;color:var(--cyan)}
.mega-foot{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:20px;padding-top:14px;border-top:1px solid var(--line)}
.mega-foot-l{display:flex;gap:22px;align-items:center}
.links .mega-foot a{margin:0;padding:4px 0;font-size:13px}
.links .mega-foot a:hover{background:none}
.mega-link{display:inline-flex;align-items:center;gap:7px;font:inherit;font-size:13px;color:var(--muted);background:none;border:0;padding:4px 0;cursor:pointer}
.mega-link:hover{color:var(--text)}
.mega-link.c{color:var(--cyan);font-weight:500}
.mega-link svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linejoin:round}
.nav-util{font-size:13.5px;color:var(--muted);text-decoration:none;padding:8px 6px;white-space:nowrap}
.nav-util:hover{color:var(--text)}
@media(max-width:860px){.nav-util{display:none}}
/* mobile drawer accordions */
.drawer .dgroup{border-bottom:1px solid var(--line)}
.drawer .dgroup summary{
  list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;
  color:var(--text);font-size:20px;font-weight:500;letter-spacing:-.02em;padding:17px 0;
}
.drawer .dgroup summary::-webkit-details-marker{display:none}
.drawer .dgroup .caret{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .22s}
.drawer .dgroup[open] .caret{transform:rotate(180deg)}
.drawer .dgroup a.drawer-sub{border-bottom:0;padding:9px 0 9px 16px;color:var(--muted)}
.drawer .dgroup .drawer-label{margin:12px 0 2px 16px}
.drawer .dgroup a:last-of-type{padding-bottom:18px}
.drawer .btn svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.8}
/* current page */
.links .mega-panel a.active{color:var(--text);background:rgba(123,92,240,.14)}
.links .mega-panel a.mega-feat.active{border-color:rgba(123,92,240,.55)}
.drawer .dgroup a.drawer-sub.active{color:var(--text)}
.links .mega-foot a.mega-link{display:inline-flex;align-items:center;gap:7px}