/* VentureFrame unified nav dropdown — 2026-11-06. Namespaced vfm- to avoid
   collisions with the per-page inline nav styles. Links are real HTML so they
   stay crawlable for AEO; only the panel's visibility is scripted. */
.vfm{position:relative;display:inline-block;margin-left:auto;font-family:inherit}
.vfm-btn{display:inline-flex;align-items:center;gap:7px;background:transparent;
  border:1px solid var(--border,#2a2a2a);color:var(--text2,#cfcfcf);
  font:500 14px/1 inherit;font-family:inherit;padding:9px 14px;border-radius:6px;
  cursor:pointer;white-space:nowrap}
.vfm-btn:hover{color:var(--text,#fff);border-color:var(--border2,#3a3a3a)}
.vfm-car{font-size:10px;transition:transform .15s ease}
.vfm-btn[aria-expanded="true"] .vfm-car{transform:rotate(180deg)}
.vfm-panel{position:absolute;right:0;top:calc(100% + 10px);z-index:999;
  min-width:260px;max-width:min(92vw,320px);padding:14px 6px 8px;
  background:var(--bg2,#131313);border:1px solid var(--border,#2a2a2a);
  border-radius:10px;box-shadow:0 18px 44px rgba(0,0,0,.55);
  max-height:min(78vh,620px);overflow-y:auto;text-align:left}
.vfm-panel[hidden]{display:none}
.vfm-grp{padding:0 0 10px}
.vfm-grp + .vfm-grp{border-top:1px solid var(--border,#2a2a2a);padding-top:10px}
.vfm-h{display:block;padding:0 14px 6px;font-size:11px;letter-spacing:.09em;
  text-transform:uppercase;color:var(--muted,#8a8a8a)}
.vfm-panel a{display:block;padding:8px 14px;font-size:14.5px;line-height:1.35;
  color:var(--text2,#cfcfcf);text-decoration:none;border-radius:6px}
.vfm-panel a:hover{background:rgba(255,255,255,.055);color:var(--text,#fff)}
.vfm-panel a.vfm-cta{margin:8px 8px 2px;padding:11px 14px;text-align:center;
  background:var(--accent,#1FE38B);color:#0b0b0b;font-weight:600}
.vfm-panel a.vfm-cta:hover{background:var(--accent,#1FE38B);filter:brightness(1.07)}
/* One menu everywhere: retire the legacy link lists and burger panels, but
   never the header CTA buttons - those stay visible for conversion. */
nav .nav-links,nav .nav-burger,nav .nav-burger-fn,
#nav-mobile,#nav-mobile-main,.vfm-legacy-hide,
nav .nav-tab,
nav a[data-cta="nav-intake"],nav a[data-cta="nav-owners"],
nav a[data-cta="nav-dashboard"],nav a[data-cta="nav-pricing"],
nav a[data-cta="nav-diagnostic"],nav a[data-cta="nav-agencies"]{display:none !important}
nav .nav-desk{gap:12px !important}
/* --- Mobile nav fix, 2026-11-08 -----------------------------------------
   The per-page inline nav kept desktop padding (32-40px) and a 20-32px gap at
   every width. At 375px the row needed 467px: the header CTA ran 72px
   off-screen (untappable, nothing scrolled) and the right-anchored 300px
   panel landed at left:-28px, clipping every label. Fixed here in the one
   shared stylesheet all 63 pages load, not in 63 inline <style> blocks.
   The panel is anchored to the viewport instead of to the button, so it
   cannot clip again if any nav item changes width later. */
@media (max-width:720px){
  nav .nav-inner{padding:0 14px !important;gap:10px !important}
  nav .nav-logo{font-size:19px !important}
  nav .vfm-btn{padding:8px 11px;font-size:13px}
  nav a[data-cta="nav-owner-try"]{font-size:13px !important;padding:9px 12px !important}
  .vfm-panel{position:fixed;top:calc(var(--nh,68px) + 6px);left:10px;right:10px;
    width:auto !important;min-width:0 !important;max-width:none !important;
    max-height:calc(100vh - var(--nh,68px) - 20px);
    max-height:calc(100dvh - var(--nh,68px) - 20px)}
  .vfm-panel a{padding:7px 13px;font-size:14px}
  .vfm-grp{padding-bottom:7px}
  .vfm-grp + .vfm-grp{padding-top:7px}
}
@media (max-width:380px){
  nav .nav-inner{padding:0 10px !important;gap:7px !important}
  nav .nav-logo{font-size:17px !important}
  nav .vfm-btn{padding:7px 9px;font-size:12.5px}
  nav a[data-cta="nav-owner-try"]{font-size:12px !important;padding:8px 10px !important}
}
@media (max-width:344px){
  nav .nav-inner{padding:0 8px !important;gap:6px !important}
  nav .nav-logo{font-size:16px !important}
  nav .vfm-btn{padding:7px 8px;font-size:12px}
  nav a[data-cta="nav-owner-try"]{font-size:11.5px !important;padding:8px 9px !important}
}
/* 2026-11-08 (b): a full 62-page sweep at 375px found the header CTA
   off-screen on 17 pages - every comparison and insights article. Those
   pages use a.nav-cta, which the rule above never targeted, and their label
   ("Start the free diagnostic") cannot fit on one line beside the logo and
   Menu at phone width. Let it wrap to two lines instead of cutting copy. */
@media (max-width:720px){
  nav a.nav-cta, nav a[data-cta="nav-owner-try"]{white-space:normal !important;
    line-height:1.15 !important;text-align:center !important;flex-shrink:1 !important;
    min-width:0 !important;max-width:44vw !important}
  nav a.nav-cta{font-size:12px !important;padding:7px 10px !important}
  nav .nav-logo{flex-shrink:0}
}
