/* ============================================================
   Light nav, for pages that open on a light surface.
   Opt in with <body class="nav-light"> and link this sheet after
   mb-flank-v2.webflow.css. The bar takes the page's own surface:
   #f9f9f9 by default (the light .ph-hero), or white with
   nav-light--white (legal pages, 404).
   Most colour comes from the .nav_wrap tokens; the rest overrides
   hard-coded white in the nav's inline embeds.
   ============================================================ */
body.nav-light { --nav-light-bg: #f9f9f9; }
body.nav-light.nav-light--white { --nav-light-bg: #fff; }

.nav-light .nav_wrap {
  --surface--background: var(--nav-light-bg);
  --text--primary: #0f1010;
  --text--secondary: #5c5c5c;
  --border--primary: #e6e6e6;
  --button-primary--bg: #0f1010;
  --button-primary--text: #fff;
  --button-secondary--bg: #ececec;
  --button-secondary--text: #0f1010;
  --button-outline--border: #d4d4d4;
  --button-outline--bg: transparent;
  --button-outline--text: #0f1010;
  color: #0f1010;
}
.nav-light .nav_wrap .nav_link:hover .nav_link_text,
.nav-light .nav_wrap .fn-item:hover .fn-item-title { text-decoration-color: #0f1010; }
.nav-light .nav_wrap .button_wrap.outline.is-nav:hover { color: #0f1010; border-color: #0f1010; }
.nav-light .nav_menu_btn { color: #0f1010; }

/* dropdown panels */
.nav-light .fn-panel-card { background: #fff; border-color: #e6e6e6; box-shadow: 0 24px 64px rgba(15,16,16,.12), 0 12px 40px rgba(143,135,255,.10); }
.nav-light .fn-item:hover { background: rgba(15,16,16,.04); }
.nav-light .fn-item-title,
.nav-light .fn-feature-title { color: #0f1010; }
.nav-light .fn-item-desc { color: #6b6b6b; }
.nav-light .fn-col-h { color: #9f9f9f; }
.nav-light .fn-new { color: #fff; background: #5a4fe0; }
.nav-light .fn-feature { background: rgba(143,135,255,.06); border-color: rgba(143,135,255,.3); }
.nav-light .fn-feature:hover { border-color: #8F87FF; }
.nav-light .fn-feature-tile { background: radial-gradient(circle at 70% 20%, rgba(143,135,255,.22), transparent 70%), #f0f0f4; border-color: #ebebeb; }
.nav-light .fn-feature-spark { color: #5a4fe0; }

@media (max-width: 767px) {
  .nav-light .nav_menu > .nav_link,
  .nav-light .fn-dd > .nav_link { border-bottom-color: #e6e6e6; }
  .nav-light .fn-panel-card { background: transparent; box-shadow: none; }
}
