/* ============================================================
   NOWILLS GROUP — Mega-menu (namespaced .nmm-*)
   White premium panel · gold top accent · navy featured card
   Loaded after app.css; scoped to avoid any style conflicts.
   ============================================================ */

/* ---------- Desktop trigger ---------- */
.nmm-item{position:static} /* panel anchors to the fixed #site-header */
.nmm-trigger{position:relative;display:inline-flex;align-items:center;gap:.25rem;
  padding:.7rem .3rem .85rem;border-bottom:2px solid transparent;margin-bottom:-2px;
  transition:border-color .18s ease, color .18s ease}
.nmm-trigger .nmm-chevron{transition:transform .22s ease;opacity:.75}
.nmm-trigger:hover,.nmm-item.is-open .nmm-trigger{border-bottom-color:#e9b433}
.nmm-trigger.nmm-active{border-bottom-color:#e9b433}
.nmm-item.is-open .nmm-trigger .nmm-chevron{transform:rotate(180deg);opacity:1}

/* ---------- Panel shell ---------- */
.nmm-panel{position:absolute;left:50%;top:100%;z-index:90;
  width:min(calc(100vw - 2.5rem), 80rem);
  background:#fff;border:1px solid rgba(0,48,112,.10);border-radius:14px;
  box-shadow:0 24px 48px -12px rgba(2,16,42,.20), 0 4px 12px rgba(2,16,42,.08);
  opacity:0;visibility:hidden;transform:translate(-50%,-8px);
  transition:opacity .2s ease, transform .2s ease, visibility 0s linear .2s;
  max-height:calc(100vh - 140px);overflow-y:auto;overflow-x:hidden}
.nmm-panel::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;
  border-radius:14px 14px 0 0;background:linear-gradient(90deg,#b98514,#e9b433 35%,#f5d06b 60%,#b98514)}
.nmm-item.is-open .nmm-panel{opacity:1;visibility:visible;transform:translate(-50%,0);
  transition:opacity .2s ease, transform .2s ease, visibility 0s}

/* ---------- Panel inner layout ---------- */
.nmm-inner{display:grid;grid-template-columns:300px 1fr;gap:2rem;align-items:start;
  padding:1.75rem 2rem 2rem}

/* ---------- Featured card (navy) ---------- */
.nmm-featured{display:flex;flex-direction:column;gap:.65rem;min-height:100%;
  padding:1.6rem 1.5rem;border-radius:10px;text-decoration:none;
  background:linear-gradient(160deg,#003070 0%,#021c49 70%,#02162e 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);transition:filter .18s ease}
.nmm-featured:hover{filter:brightness(1.09)}
.nmm-featured:focus-visible{outline:2px solid #e9b433;outline-offset:2px}
.nmm-eyebrow{display:flex;align-items:center;gap:.5rem;color:#eec85b;
  font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.nmm-heading{font-family:Manrope,Sora,Inter,system-ui,sans-serif;font-weight:800;
  font-size:1.3rem;line-height:1.22;color:#fff;letter-spacing:-.02em}
.nmm-desc{font-size:13px;line-height:1.55;color:rgba(255,255,255,.78)}
.nmm-cta{margin-top:auto;padding-top:.9rem;display:inline-flex;align-items:center;gap:.45rem;
  color:#eec85b;font-size:13px;font-weight:600}
.nmm-cta .nmm-cta-arrow{transition:transform .2s ease}
.nmm-featured:hover .nmm-cta-arrow{transform:translateX(4px)}

/* ---------- Link columns ---------- */
.nmm-cols{display:grid;gap:1.5rem}
.nmm-cols--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.nmm-cols--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.nmm-col-title{margin:0 0 .55rem .65rem;font-size:11px;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;color:#94a3b8}
.nmm-list{margin:0;padding:0;list-style:none}
.nmm-list li{margin:0}
.nmm-link{position:relative;display:flex;align-items:flex-start;gap:.7rem;
  padding:.55rem .65rem;border-radius:8px;text-decoration:none;
  transition:background-color .16s ease}
.nmm-link::before{content:"";position:absolute;left:0;top:22%;bottom:22%;width:2.5px;
  border-radius:2px;background:#e9b433;transform:scaleY(0);transition:transform .18s ease}
.nmm-link:hover,.nmm-link:focus-visible{background:rgba(21,101,255,.06)}
.nmm-link:hover::before,.nmm-link:focus-visible::before{transform:scaleY(1)}
.nmm-link-icon{flex-shrink:0;margin-top:1px;display:inline-flex;color:#1565ff;
  transition:color .16s ease}
.nmm-ic-orange{color:#f26b21}
.nmm-ic-gold{color:#b98514}
.nmm-ic-ghana-green{color:#059669}
.nmm-link:hover .nmm-link-icon,.nmm-link:focus-visible .nmm-link-icon{color:#b98514}
.nmm-link-body{display:flex;flex-direction:column;gap:2px;min-width:0}
.nmm-link-label{font-size:13.5px;font-weight:600;line-height:1.35;color:#0b1f44;
  transition:color .16s ease}
.nmm-link:hover .nmm-link-label,.nmm-link:focus-visible .nmm-link-label{color:#003070}
.nmm-link-desc{font-size:12px;line-height:1.45;color:#64748b}

/* Dark site mode keeps the panel a white surface (explicit colours above) */
.dark .nmm-panel{background:#fff}

/* ---------- Smaller desktop widths ---------- */
@media (max-width:1439px){
  .nmm-inner{grid-template-columns:272px 1fr;gap:1.4rem;padding:1.5rem 1.5rem 1.75rem}
  .nmm-cols{gap:1rem}
  .nmm-heading{font-size:1.18rem}
}

/* ---------- Mobile accordion (inside existing drawer) ---------- */
.nmm-acc{border-bottom:1px solid rgba(255,255,255,.07)}
.nmm-acc-btn{display:flex;width:100%;min-height:48px;align-items:center;justify-content:space-between;
  gap:.75rem;padding:.8rem .25rem;color:#fff;font-size:15px;font-weight:600;text-align:left;
  border-radius:8px;cursor:pointer}
.nmm-acc-btn .nmm-acc-chevron{flex-shrink:0;opacity:.7;transition:transform .22s ease}
.nmm-acc-btn[aria-expanded="true"] .nmm-acc-chevron{transform:rotate(180deg);opacity:1}
.nmm-acc-btn:hover{color:#eec85b}
.nmm-acc-active > .nmm-acc-btn{color:#eec85b}
.nmm-acc-panel{padding:.25rem 0 .9rem}
.nmm-acc-featured{display:flex;flex-direction:column;gap:.5rem;margin-bottom:.9rem;
  padding:1rem 1.1rem;border-radius:10px;text-decoration:none;
  background:linear-gradient(160deg,rgba(0,48,112,.55),rgba(2,22,73,.55));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.nmm-acc-featured .nmm-heading{font-size:1.02rem}
.nmm-acc-featured .nmm-cta{margin-top:.35rem;padding-top:0}
.nmm-acc-group-title{margin:.85rem 0 .3rem;font-size:11px;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;color:#94a3b8}
.nmm-acc-list{margin:0;padding:0;list-style:none}
.nmm-acc-link{display:flex;flex-direction:column;justify-content:center;min-height:48px;
  padding:.55rem .75rem;border-radius:8px;text-decoration:none}
.nmm-acc-link:hover,.nmm-acc-link:focus-visible{background:rgba(255,255,255,.06)}
.nmm-acc-link-label{font-size:14px;font-weight:500;color:rgba(255,255,255,.92)}
.nmm-acc-link:hover .nmm-acc-link-label{color:#eec85b}
.nmm-acc-link-desc{margin-top:2px;font-size:12px;color:#94a3b8}
.nmm-acc-all{display:block;margin-top:.9rem;padding:.6rem .75rem;border-radius:8px;
  font-size:12.5px;font-weight:600;color:#eec85b;text-decoration:none}
.nmm-acc-all:hover{background:rgba(255,255,255,.06)}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce){
  .nmm-panel,.nmm-trigger .nmm-chevron,.nmm-link::before,.nmm-cta-arrow,
  .nmm-acc-btn .nmm-acc-chevron{transition:none}
  .nmm-panel{transform:translate(-50%,0)}
  .nmm-item.is-open .nmm-panel{transform:translate(-50%,0)}
}
html.reduced-motion .nmm-panel,
html.reduced-motion .nmm-trigger .nmm-chevron,
html.reduced-motion .nmm-link::before{transition:none}
