.fancynav {
  --fn-nav-color: #334155;
  --fn-nav-hover: var(--fn-nav-color);
  --fn-nav-active: var(--fn-nav-color);
  --fn-nav-open-color: var(--fn-nav-color);
  --fn-nav-hover-bg: #f8fafc;
  --fn-nav-active-bg: #f1f5f9;
  --fn-nav-gap: 8px;
  --fn-nav-py: 12px;
  --fn-nav-px: 14px;
  --fn-nav-radius: 6px;
  --fn-align: flex-start;
  --fn-duration: 180ms;
  --fn-dropdown-width: 340px;
  --fn-dropdown-bg: #fff;
  --fn-dropdown-offset: 10px;
  --fn-dropdown-gap: 4px;
  --fn-pointer-display: block;
  --fn-pointer-color: var(--fn-dropdown-bg);
  --fn-pointer-size: 8px;
  --fn-title-color: #0f172a;
  --fn-title-hover: var(--fn-title-color);
  --fn-description-color: #64748b;
  --fn-description-hover: var(--fn-description-color);
  --fn-item-radius: 5px;
  --fn-item-hover-bg: #f8fafc;
  --fn-item-active-bg: #f1f5f9;
  --fn-dot-display: block;
  --fn-dot-color: #2563eb;
  --fn-dot-size: 6px;
  --fn-arrow-display: block;
  --fn-arrow-color: #64748b;
  --fn-arrow-hover: #0f172a;
  --fn-arrow-size: 18px;
  --fn-arrow-move: 3px;
  --fn-chevron-color: currentColor;
  --fn-chevron-hover: currentColor;
  --fn-chevron-size: 16px;
  --fn-chevron-gap: 0px;
  --fn-cta-color: #fff;
  --fn-cta-hover-color: var(--fn-cta-color);
  --fn-cta-bg: #0f172a;
  --fn-cta-hover-bg: #334155;
  --fn-cta-gap: 20px;
  --fn-toggle-color: #334155;
  --fn-toggle-hover: var(--fn-toggle-color);
  --fn-toggle-bg: transparent;
  --fn-toggle-hover-bg: #f1f5f9;
  --fn-toggle-icon-size: 24px;
  --fn-toggle-size: 44px;
  --fn-mobile-bg: #fff;
  --fn-mobile-color: #334155;
  --fn-mobile-width: 360px;
  --fn-mobile-hover-color: var(--fn-mobile-color);
  --fn-mobile-active-color: var(--fn-mobile-color);
  --fn-mobile-open-color: var(--fn-mobile-color);
  --fn-mobile-hover-bg: #f8fafc;
  --fn-mobile-active-bg: #f1f5f9;
  --fn-mobile-gap: 4px;
  --fn-mobile-divider: #e2e8f0;
  --fn-mobile-description: #64748b;
  --fn-mobile-submenu-bg: transparent;
  --fn-mobile-indent: 12px;
  --fn-mobile-child-gap: 4px;
  display: flex;
  justify-content: var(--fn-align);
  position: relative;
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  color: var(--fn-nav-color);
  font-family: inherit;
  font-size: 16px;
  line-height: 1.5;
  text-align: start;
}
.fancynav *, .fancynav *::before, .fancynav *::after { box-sizing: border-box; }
.fancynav [hidden] { display: none !important; }
.fancynav .fancynav__menu, .fancynav .fancynav__dropdown {
  display: block; position: static; float: none; width: auto; height: auto; min-width: 0;
  list-style: none; margin: 0; padding: 0; border: 0; background: none; text-indent: 0;
  box-shadow: none; visibility: visible; opacity: 1; transform: none;
}
.fancynav .fancynav__item { position: relative; display: block; float: none; width: auto; margin: 0; padding: 0; min-width: 0; max-width: 100%; list-style: none; border: 0; background: none; }
.fancynav .fancynav__desktop { display: var(--fn-desktop-display, flex); align-items: center; justify-content: var(--fn-align); gap: var(--fn-cta-gap); width: 100%; min-width: 0; flex-wrap: wrap; }
.fancynav .fancynav__desktop > .fancynav__menu { display: flex; flex-wrap: wrap; align-items: center; gap: var(--fn-nav-gap); min-width: 0; max-width: 100%; }
.fancynav .fancynav__row { display: flex; align-items: stretch; width: 100%; min-width: 0; color: var(--fn-row-color, inherit); border-radius: var(--fn-nav-radius); transition: background-color var(--fn-duration), color var(--fn-duration); }
.fancynav .fancynav__link { display: flex; align-items: center; gap: 12px; flex: 1; min-width: 0; padding: var(--fn-nav-py) var(--fn-nav-px); color: inherit; text-decoration: none; font: inherit; min-height: 44px; border-radius: inherit; box-shadow: none; margin: 0; border: 0; background: transparent; white-space: normal; text-transform: inherit; letter-spacing: inherit; }
.fancynav .fancynav__row > .fancynav__link:is(:link, :visited, :hover, :focus, :active) { color: inherit; text-decoration: none; background: transparent; }
.fancynav .fancynav__item-copy { display: block; flex: 1; min-width: 0; overflow-wrap: anywhere; }
.fancynav .fancynav__item-title { display: block; }
.fancynav .fancynav__item-description { display: block; margin-top: 3px; font-size: .8125rem; line-height: 1.5; font-weight: 400; color: var(--fn-description-color); }
/* State colors apply to the owning row, never to another navigation mode. */
.fancynav .fancynav__desktop > .fancynav__menu > .fancynav__item > .fancynav__row { --fn-row-color: var(--fn-nav-color); }
.fancynav .fancynav__desktop > .fancynav__menu > .fancynav__item > .fancynav__row:hover { --fn-row-color: var(--fn-nav-hover); background: var(--fn-nav-hover-bg); }
.fancynav .fancynav__desktop > .fancynav__menu > :is(.current-menu-item, .current-menu-parent, .current-menu-ancestor) > .fancynav__row { --fn-row-color: var(--fn-nav-active); background: var(--fn-nav-active-bg); }
.fancynav .fancynav__desktop > .fancynav__menu > .is-open > .fancynav__row { background: var(--fn-nav-active-bg); }
.fancynav .fancynav__desktop > .fancynav__menu > .is-open:not(.current-menu-item):not(.current-menu-parent):not(.current-menu-ancestor) > .fancynav__row { --fn-row-color: var(--fn-nav-open-color); }
.fancynav .fancynav__submenu-toggle, .fancynav .fancynav__mobile-toggle {
  appearance: none; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto;
  font: inherit; box-shadow: none; text-shadow: none; cursor: pointer; min-width: 44px; min-height: 44px;
  padding: 8px; margin: 0; border: 0; border-radius: var(--fn-nav-radius); background: transparent; color: inherit;
}
.fancynav .fancynav__submenu-toggle { margin-inline-start: max(0px, var(--fn-chevron-gap)); color: var(--fn-chevron-color); }
.fancynav .fancynav__submenu-toggle:hover { color: var(--fn-chevron-hover); background: transparent; }
/* Remove inner label padding; the spacing control now measures the actual icon box gap.
   Desktop uses a compact >=24px target; mobile/coarse pointers retain >=44px targets. */
.fancynav .fancynav__desktop > .fancynav__menu > .fancynav__has-children > .fancynav__row > .fancynav__link { padding-inline-end: 0; }
.fancynav .fancynav__desktop > .fancynav__menu > .fancynav__item > .fancynav__row > .fancynav__submenu-toggle {
  justify-content: flex-start; min-width: max(24px, calc(var(--fn-chevron-size) + var(--fn-nav-px)));
  padding: 0; padding-inline-end: var(--fn-nav-px);
}
.fancynav .fancynav__chevron { display: block; width: var(--fn-chevron-size); height: var(--fn-chevron-size); transition: transform var(--fn-duration); }
.fancynav .fancynav__submenu-toggle[aria-expanded="true"] .fancynav__chevron { transform: rotate(180deg); }
.fancynav svg { display: block; width: 100%; height: 100%; }
.fancynav a:focus-visible, .fancynav button:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; position: relative; z-index: 2; }
.fancynav .fancynav__desktop .fancynav__dropdown {
  width: var(--fn-dropdown-width); max-width: calc(100vw - 24px); padding: 8px;
  border: 1px solid #e2e8f0; border-radius: 8px; background: var(--fn-dropdown-bg);
  box-shadow: 0 12px 32px rgb(15 23 42 / 12%); color: var(--fn-title-color);
}
.fancynav .fancynav__desktop > .fancynav__menu > .fancynav__item > .fancynav__dropdown {
  position: absolute; top: calc(100% + var(--fn-dropdown-offset)); left: var(--fn-shift, 0px); z-index: 1000;
}
.fancynav .fancynav__desktop > .fancynav__menu > .fancynav__item > .fancynav__dropdown::before {
  content: ''; position: absolute; bottom: 100%; left: 0; width: 100%; height: var(--fn-dropdown-offset);
}
.fancynav .fancynav__desktop > .fancynav__menu > .fancynav__item > .fancynav__dropdown::after {
  content: ''; display: var(--fn-pointer-display); position: absolute; top: calc(-1 * var(--fn-pointer-size));
  left: var(--fn-pointer-left, 24px); border-left: var(--fn-pointer-size) solid transparent; border-right: var(--fn-pointer-size) solid transparent; border-bottom: var(--fn-pointer-size) solid var(--fn-pointer-color);
}
.fancynav .fancynav__desktop .fancynav__dropdown .fancynav__dropdown {
  position: static; width: auto; max-width: 100%; margin: 4px 0 4px 12px; box-shadow: none;
}
.fancynav .fancynav__desktop .fancynav__dropdown > .fancynav__item + .fancynav__item { margin-top: var(--fn-dropdown-gap); }
.fancynav .fancynav__dropdown .fancynav__row { --fn-row-color: var(--fn-title-color); border-radius: var(--fn-item-radius); }
.fancynav .fancynav__dropdown .fancynav__link { padding: 12px; }
.fancynav .fancynav__dropdown .fancynav__item-title { color: inherit; font-weight: 600; }
.fancynav .fancynav__dropdown .fancynav__row:hover { --fn-row-color: var(--fn-title-hover); background: var(--fn-item-hover-bg); }
.fancynav .fancynav__desktop .fancynav__dropdown .fancynav__row:hover .fancynav__item-description { color: var(--fn-description-hover); }
.fancynav .fancynav__dropdown .current-menu-item > .fancynav__row,
.fancynav .fancynav__dropdown .current-menu-parent > .fancynav__row,
.fancynav .fancynav__dropdown .current-menu-ancestor > .fancynav__row,
.fancynav .fancynav__dropdown .is-open > .fancynav__row { background: var(--fn-item-active-bg); }
.fancynav .fancynav__dot { display: var(--fn-dot-display); align-self: flex-start; margin-top: max(0px, calc((1.5em - var(--fn-dot-size)) / 2)); width: var(--fn-dot-size); height: var(--fn-dot-size); flex: 0 0 var(--fn-dot-size); border-radius: 50%; background: var(--fn-dot-color); }
.fancynav .fancynav__arrow { display: var(--fn-arrow-display); align-self: flex-start; margin-top: max(0px, calc((1.5em - var(--fn-arrow-size)) / 2)); width: var(--fn-arrow-size); height: var(--fn-arrow-size); flex: 0 0 var(--fn-arrow-size); color: var(--fn-arrow-color); transition: transform var(--fn-duration), color var(--fn-duration); }
.fancynav .fancynav__link:hover .fancynav__arrow { transform: translateX(var(--fn-arrow-move)); color: var(--fn-arrow-hover); }
.fancynav:dir(rtl) .fancynav__arrow { rotate: 180deg; }
.fancynav .fancynav__cta { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; max-width: 100%; padding: 11px 18px; border: 1px solid transparent; border-radius: 6px; background: var(--fn-cta-bg); color: var(--fn-cta-color); text-decoration: none; font-weight: 600; text-align: center; overflow-wrap: anywhere; transition: background-color var(--fn-duration), color var(--fn-duration); }
.fancynav .fancynav__cta:hover { color: var(--fn-cta-hover-color); background: var(--fn-cta-hover-bg); }
.fancynav .fancynav__mobile-toggle {
  display: var(--fn-toggle-display, none); width: var(--fn-toggle-size); height: var(--fn-toggle-size); color: var(--fn-toggle-color); background: var(--fn-toggle-bg); border: 1px solid #e2e8f0; border-radius: 6px;
}
.fancynav .fancynav__mobile-toggle:hover { color: var(--fn-toggle-hover); background: var(--fn-toggle-hover-bg); }
.fancynav .fancynav__toggle-open, .fancynav .fancynav__toggle-close { width: var(--fn-toggle-icon-size); height: var(--fn-toggle-icon-size); max-width: 100%; }
.fancynav .fancynav__toggle-close, .fancynav .fancynav__mobile-toggle[aria-expanded="true"] .fancynav__toggle-open { display: none; }
.fancynav .fancynav__mobile-toggle[aria-expanded="true"] .fancynav__toggle-close { display: block; }
.fancynav .fancynav__mobile {
  display: block; position: absolute; top: 100%; left: var(--fn-panel-left, 0px); z-index: 1000;
  min-width: 0; width: var(--fn-mobile-width); max-width: calc(100vw - 16px); max-height: var(--fn-panel-height, 75vh); overflow-y: auto; overscroll-behavior: contain;
  padding: 12px; border: 1px solid var(--fn-mobile-divider); border-radius: 8px; box-shadow: 0 12px 32px rgb(15 23 42 / 12%); background: var(--fn-mobile-bg); color: var(--fn-mobile-color);
}
.fancynav[data-panel="full"] .fancynav__mobile { width: var(--fn-viewport-width, 100%); max-width: var(--fn-viewport-width, 100%); }
.fancynav .fancynav__mobile > .fancynav__menu > .fancynav__item + .fancynav__item { border-top: 1px solid var(--fn-mobile-divider); margin-top: var(--fn-mobile-gap); }
.fancynav .fancynav__mobile .fancynav__dropdown { position: static; inset: auto; width: auto; max-width: 100%; border: 0; box-shadow: none; background: var(--fn-mobile-submenu-bg); padding: 4px; margin-inline-start: min(var(--fn-mobile-indent), 10%); }
.fancynav .fancynav__mobile .fancynav__dropdown > .fancynav__item + .fancynav__item { margin-top: var(--fn-mobile-child-gap); }
.fancynav .fancynav__mobile .fancynav__row { --fn-row-color: var(--fn-mobile-color); }
.fancynav .fancynav__mobile .fancynav__row:hover { --fn-row-color: var(--fn-mobile-hover-color); background: var(--fn-mobile-hover-bg); }
.fancynav .fancynav__mobile :is(.current-menu-item, .current-menu-parent, .current-menu-ancestor) > .fancynav__row { --fn-row-color: var(--fn-mobile-active-color); background: var(--fn-mobile-active-bg); }
.fancynav .fancynav__mobile .is-open > .fancynav__row { background: var(--fn-mobile-active-bg); }
.fancynav .fancynav__mobile .is-open:not(.current-menu-item):not(.current-menu-parent):not(.current-menu-ancestor) > .fancynav__row { --fn-row-color: var(--fn-mobile-open-color); }
.fancynav .fancynav__mobile .fancynav__link { padding: 12px; gap: 10px; }
.fancynav .fancynav__mobile .fancynav__submenu-toggle { width: 44px; min-width: 44px; margin-inline-start: 0; align-self: flex-start; }
.fancynav .fancynav__mobile .fancynav__item-title { color: inherit; }
.fancynav .fancynav__mobile .fancynav__item-description { color: var(--fn-mobile-description); }
.fancynav .fancynav__mobile .fancynav__cta { display: flex; width: 100%; margin-top: var(--fn-cta-gap); }
.fancynav .fancynav__editor-message { margin: 0; padding: 16px; border: 1px dashed #64748b; color: var(--fn-nav-color); }
@media (pointer: coarse) {
  .fancynav .fancynav__desktop > .fancynav__menu > .fancynav__item > .fancynav__row > .fancynav__submenu-toggle { min-width: 44px; }
}
@media (prefers-reduced-motion: reduce) {
  .fancynav *, .fancynav *::before, .fancynav *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}
