/* ===== MMR mega-menu header (Claude Design tokens) ===== */
.nav-mega { display:flex; align-items:stretch; gap:2px; }
/* Audience segmented toggle (Patients / Providers / Organizations) */
.aud-pill { padding:5px 13px; border-radius:999px; font-size:12px; font-weight:500; color:var(--ink-3); white-space:nowrap; transition:color .18s ease, background .18s ease; }
.aud-pill:hover { color:var(--ink); }
.aud-pill.aud-active { font-weight:600; color:var(--ink); background:var(--surface-2); }
/* nav bar is the containing block so every dropdown anchors to ONE shared
   position (centered under the bar) instead of shifting under each item. */
#nav-bar { position:relative; }
.navc { position:static; display:flex; align-items:center; }
.navt { display:inline-flex; align-items:center; gap:5px; padding:8px 13px; border-radius:9px; font-size:14px; font-weight:500; color:var(--ink-2); cursor:pointer; white-space:nowrap; transition:background .2s, color .2s; }
.navc:hover .navt, .navc:focus-within .navt { background:var(--surface); color:var(--ink); }
.navcaret { opacity:.55; transition:transform .25s ease; }
.navc:hover .navcaret, .navc:focus-within .navcaret { transform:rotate(180deg); }
/* full-width overlay anchored to the bar; the visible panel is centered inside
   it, so the panel position is identical for every menu. The full width also
   keeps the menu open while the mouse travels down from any item. */
/* top pulled up 12px so the hover area overlaps the nav bar's bottom padding
   (no dead zone between the item and the panel); padding-top keeps the visible
   panel 14px below. A close-delay lets the cursor cross the gap. */
.navmega { position:absolute; top:calc(100% - 12px); left:0; right:0; padding-top:26px; display:flex; justify-content:center; opacity:0; visibility:hidden; pointer-events:none; transform:translateY(8px); transition:opacity .18s ease .12s, transform .18s ease .12s, visibility 0s linear .3s; z-index:70; }
.navc:hover .navmega, .navc:focus-within .navmega { opacity:1; visibility:visible; pointer-events:auto; transform:translateY(0); transition-delay:0s; }
.navmega-in { display:grid; grid-template-columns:1.55fr 1fr; gap:10px; width:740px; max-width:calc(100vw - 48px); padding:14px; border:1px solid var(--border-strong); border-radius:18px; background:var(--card-bg), var(--bg-2); box-shadow:var(--shadow-card); }
.navmega-links { display:grid; grid-template-columns:1fr 1fr; gap:4px; }
.megaitem { display:flex; align-items:flex-start; gap:11px; padding:11px 12px; border-radius:12px; transition:background .18s ease; }
.megaitem:hover { background:var(--surface-2); }
.megaico { flex-shrink:0; width:34px; height:34px; display:grid; place-items:center; border-radius:9px; background:var(--surface-2); border:1px solid var(--border); color:var(--blue-500); }
.megaico svg { width:18px; height:18px; }
.megaitem b { display:block; font-size:13.5px; font-weight:600; color:var(--ink); letter-spacing:-0.01em; }
.megaitem i { display:block; font-size:12px; font-style:normal; color:var(--ink-3); margin-top:2px; line-height:1.35; }
.navmega-promo { display:flex; flex-direction:column; justify-content:flex-end; gap:8px; padding:18px; border-radius:14px; background:var(--grad-brand); color:#fff; overflow:hidden; }
.navmega-promo-eyebrow { font-size:11px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; opacity:.85; }
.navmega-promo-title { font-family:var(--font-heading); font-size:19px; line-height:1.15; font-weight:500; }
.navmega-promo-cta { display:inline-flex; align-items:center; gap:6px; font-size:13px; font-weight:600; margin-top:2px; }
.navmega-promo:hover .navmega-promo-cta { gap:9px; }
.nav-burger { display:none; }
.nav-drawer-cta { display:none; }
@media (max-width: 1000px) {
  .nav-audience { display:none !important; }
  .nav-cta { display:none !important; }
  #nav-bar.nav-open .nav-drawer-cta { display:inline-flex; align-items:center; justify-content:center; gap:7px; margin:14px 4px 4px; padding:13px 20px; border-radius:999px; background:var(--grad-brand); color:#fff; font-weight:600; font-size:15px; }
  .nav-mega { display:none; }
  .nav-burger { display:inline-flex; flex-direction:column; justify-content:center; gap:5px; width:42px; height:42px; padding:9px; border:1px solid var(--border); border-radius:10px; background:transparent; cursor:pointer; flex-shrink:0; }
  .nav-burger span { display:block; width:22px; height:2px; background:var(--ink-2); border-radius:2px; transition:transform .25s ease, opacity .2s ease; }
  #nav-bar.nav-open { flex-wrap:wrap; row-gap:8px; }
  #nav-bar.nav-open .nav-mega { display:flex !important; flex-direction:column; align-items:stretch; width:100%; flex:0 0 100%; order:5; gap:0; max-height:72vh; overflow-y:auto; border-top:1px solid var(--border); margin-top:4px; padding-top:6px; }
  #nav-bar.nav-open .navc { display:block; width:100%; }
  #nav-bar.nav-open .navt { font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-3); padding:14px 4px 4px; pointer-events:none; }
  #nav-bar.nav-open .navcaret { display:none; }
  #nav-bar.nav-open .navmega { position:static !important; opacity:1 !important; visibility:visible !important; pointer-events:auto !important; transform:none !important; display:block !important; padding:0 0 4px; }
  #nav-bar.nav-open .navmega-in { display:block !important; width:auto; max-width:none; padding:0; background:none; border:0; box-shadow:none; }
  #nav-bar.nav-open .navmega-links { display:block !important; }
  #nav-bar.nav-open .megaitem { padding:9px 8px !important; background:none !important; border:0 !important; }
  #nav-bar.nav-open .megaico, #nav-bar.nav-open .megaitem i { display:none !important; }
  #nav-bar.nav-open .megaitem b { font-weight:500; font-size:15px; }
  #nav-bar.nav-open .navmega-promo { display:none !important; }
  #nav-bar.nav-open .nav-burger span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
  #nav-bar.nav-open .nav-burger span:nth-child(2) { opacity:0; }
  #nav-bar.nav-open .nav-burger span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }
}
