/* AnoProxy unified site navigation v5
   One header system for pricing, affiliate, blog and tools pages.
   The resource dropdown intentionally contains only Blog and Tools. */

:root{
  --nav-v5-bg:#040b19;
  --nav-v5-panel:#07162e;
  --nav-v5-line:rgba(126,169,231,.18);
  --nav-v5-text:#c7d5e8;
  --nav-v5-white:#f7fbff;
  --nav-v5-blue:#1f6fff;
}

/* Dark header on all major inner pages. */
.pricing-page .site-header,
.product-pricing-page .site-header,
.affiliate-page .site-header,
.resource-page .site-header,
.blog-page .site-header{
  width:100%;
  height:80px;
  margin:0;
  padding:0 max(28px,calc((100vw - 1480px)/2));
  background:
    radial-gradient(circle at 78% -80%,rgba(55,116,255,.24),transparent 45%),
    linear-gradient(100deg,#030916 0%,#07162f 58%,#092550 100%)!important;
  border-bottom:1px solid var(--nav-v5-line)!important;
  box-shadow:0 14px 38px rgba(1,10,29,.24)!important;
  color:var(--nav-v5-white);
}

.pricing-page .site-header .brand,
.product-pricing-page .site-header .brand,
.affiliate-page .site-header .brand,
.resource-page .site-header .brand,
.blog-page .site-header .brand{
  color:var(--nav-v5-white)!important;
  gap:11px;
  font-size:21px;
}

.pricing-page .site-header .brand-mark,
.product-pricing-page .site-header .brand-mark,
.affiliate-page .site-header .brand-mark,
.resource-page .site-header .brand-mark,
.blog-page .site-header .brand-mark{
  width:42px;
  height:42px;
  border-radius:10px;
  overflow:visible;
  background:transparent!important;
  box-shadow:none!important;
}

.pricing-page .site-header .brand-mark img,
.product-pricing-page .site-header .brand-mark img,
.affiliate-page .site-header .brand-mark img,
.resource-page .site-header .brand-mark img,
.blog-page .site-header .brand-mark img{
  width:100%;
  height:100%;
  object-fit:contain;
  transform:none!important;
  filter:drop-shadow(0 8px 16px rgba(24,102,255,.32));
}

.pricing-page .desktop-nav,
.product-pricing-page .desktop-nav,
.affiliate-page .desktop-nav,
.resource-page .desktop-nav,
.blog-page .desktop-nav{
  gap:5px;
  align-items:center;
}

.pricing-page .desktop-nav>a,
.product-pricing-page .desktop-nav>a,
.affiliate-page .desktop-nav>a,
.resource-page .desktop-nav>a,
.blog-page .desktop-nav>a,
.pricing-page .nav-dropdown-trigger,
.product-pricing-page .nav-dropdown-trigger,
.affiliate-page .nav-dropdown-trigger,
.resource-page .nav-dropdown-trigger,
.blog-page .nav-dropdown-trigger{
  min-width:auto;
  height:38px;
  display:flex;
  align-items:center;
  padding:0 13px;
  border:0;
  border-radius:9px;
  background:transparent;
  color:var(--nav-v5-text)!important;
  font:500 14px "Noto Sans SC",sans-serif;
  line-height:1;
  cursor:pointer;
  text-decoration:none;
  transition:color .18s ease,background .18s ease;
}

.pricing-page .desktop-nav>a:after,
.product-pricing-page .desktop-nav>a:after,
.affiliate-page .desktop-nav>a:after,
.resource-page .desktop-nav>a:after,
.blog-page .desktop-nav>a:after{display:none!important}

.pricing-page .desktop-nav>a:hover,
.product-pricing-page .desktop-nav>a:hover,
.affiliate-page .desktop-nav>a:hover,
.resource-page .desktop-nav>a:hover,
.blog-page .desktop-nav>a:hover,
.pricing-page .nav-dropdown-trigger:hover,
.product-pricing-page .nav-dropdown-trigger:hover,
.affiliate-page .nav-dropdown-trigger:hover,
.resource-page .nav-dropdown-trigger:hover,
.blog-page .nav-dropdown-trigger:hover,
.site-header .desktop-nav>a.current,
.site-header .desktop-nav>a.pricing-current,
.site-header .nav-dropdown-trigger.current{
  color:#fff!important;
  background:rgba(255,255,255,.065)!important;
}

.pricing-page .header-actions .login,
.pricing-page .header-actions .lang,
.product-pricing-page .header-actions .login,
.product-pricing-page .header-actions .lang,
.affiliate-page .header-actions .login,
.affiliate-page .header-actions .lang,
.resource-page .header-actions .login,
.resource-page .header-actions .lang,
.blog-page .header-actions .login,
.blog-page .header-actions .lang{color:var(--nav-v5-text)!important}

.pricing-page .header-actions .button.small,
.product-pricing-page .header-actions .button.small,
.affiliate-page .header-actions .button.small,
.resource-page .header-actions .button.small,
.blog-page .header-actions .button.small{
  color:#fff!important;
  background:linear-gradient(135deg,#114fe9,#1784ff)!important;
  border:1px solid rgba(114,178,255,.4);
  box-shadow:0 10px 24px rgba(17,91,242,.25);
}

.pricing-page .menu-toggle span,
.product-pricing-page .menu-toggle span,
.affiliate-page .menu-toggle span,
.resource-page .menu-toggle span,
.blog-page .menu-toggle span{background:#fff!important}

/* Resource menu v5: exactly two top-level choices. */
.resource-nav-v6{position:relative}
.resource-nav-v6 .resource-compact-menu{
  position:absolute;
  z-index:120;
  top:calc(100% + 12px);
  right:-22px;
  left:auto;
  width:392px;
  min-height:0;
  padding:10px;
  border:1px solid rgba(115,161,228,.22)!important;
  border-radius:18px;
  background:rgba(5,16,36,.98)!important;
  box-shadow:0 28px 70px rgba(0,8,25,.46)!important;
  backdrop-filter:blur(24px) saturate(125%);
  overflow:visible;
}
.resource-nav-v6 .resource-compact-menu:before{display:none!important}
.resource-nav-v6 .resource-menu-list{display:grid;gap:7px}
.resource-nav-v6 .resource-menu-entry{
  min-height:76px;
  display:grid!important;
  grid-template-columns:45px 1fr 20px!important;
  gap:13px;
  align-items:center;
  padding:12px 13px!important;
  border:1px solid transparent!important;
  border-radius:13px;
  background:transparent!important;
  color:#eff6ff!important;
  cursor:pointer;
  text-decoration:none;
  transition:background .18s,border-color .18s;
}
.resource-nav-v6 .resource-menu-entry:after{display:none!important}
.resource-nav-v6 .resource-menu-entry:hover,
.resource-nav-v6 .resource-menu-entry:focus-visible,
.resource-nav-v6 .resource-menu-entry.active,
.resource-nav-v6 .resource-tools-entry.active>summary{
  transform:none!important;
  background:rgba(44,104,202,.14)!important;
  border-color:rgba(92,151,240,.22)!important;
}
.resource-nav-v6 .resource-entry-icon{
  width:45px;
  height:45px;
  display:grid;
  place-items:center;
  border-radius:12px;
  font-style:normal;
  font-size:18px;
}
.resource-nav-v6 .blog-icon{background:rgba(50,102,255,.18);color:#72a8ff}
.resource-nav-v6 .tools-icon{background:rgba(28,201,220,.14);color:#55dceb}
.resource-nav-v6 .resource-entry-copy{display:block;min-width:0}
.resource-nav-v6 .resource-entry-copy small,
.resource-nav-v6 .resource-entry-copy b,
.resource-nav-v6 .resource-entry-copy em{display:block}
.resource-nav-v6 .resource-entry-copy small{
  color:#607ca5;
  font:600 8px "Plus Jakarta Sans",sans-serif;
  letter-spacing:.15em;
}
.resource-nav-v6 .resource-entry-copy b{margin:2px 0;color:#f4f8ff;font-size:15px;line-height:1.35}
.resource-nav-v6 .resource-entry-copy em{
  overflow:hidden;
  color:#8fa4c2;
  font-size:10px;
  font-style:normal;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.resource-nav-v6 .resource-menu-entry>i{color:#7890b3;font-size:13px;font-style:normal;text-align:center}
.resource-nav-v6 .resource-tools-entry{border-radius:13px}
.resource-nav-v6 .resource-tools-entry>summary{list-style:none}
.resource-nav-v6 .resource-tools-entry>summary::-webkit-details-marker{display:none}
.resource-nav-v6 .resource-tool-chevron{transition:transform .2s}
.resource-nav-v6 .resource-tools-entry[open] .resource-tool-chevron{transform:rotate(180deg)}
.resource-nav-v6 .resource-tools-list{
  max-height:360px;
  margin:2px 7px 8px 65px;
  padding:8px;
  overflow:auto;
  border:1px solid rgba(105,146,207,.16);
  border-radius:12px;
  background:rgba(255,255,255,.035)!important;
}
.resource-nav-v6 .resource-tools-list>a{
  display:grid!important;
  grid-template-columns:30px 1fr 15px!important;
  gap:9px;
  align-items:center;
  padding:9px!important;
  border:0!important;
  border-radius:9px;
  color:#dce9fb!important;
  text-decoration:none;
  transition:background .16s;
}
.resource-nav-v6 .resource-tools-list>a:after{display:none!important}
.resource-nav-v6 .resource-tools-list>a:hover{padding-left:9px!important;background:rgba(255,255,255,.055)!important}
.resource-nav-v6 .resource-tools-list>a>span:first-child{
  width:29px;
  height:29px;
  display:grid;
  place-items:center;
  border:1px solid rgba(107,151,216,.18);
  border-radius:8px;
  background:rgba(35,79,148,.2);
  color:#74aaff;
  font:600 9px "Plus Jakarta Sans",sans-serif;
}
.resource-nav-v6 .resource-tools-list>a>span:nth-child(2) b,
.resource-nav-v6 .resource-tools-list>a>span:nth-child(2) small{display:block}
.resource-nav-v6 .resource-tools-list>a>span:nth-child(2) b{color:#e8f1ff;font-size:11px}
.resource-nav-v6 .resource-tools-list>a>span:nth-child(2) small{
  overflow:hidden;
  color:#7289aa;
  font-size:8px;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.resource-nav-v6 .resource-tools-list>a>i{color:#637b9f;font-size:10px;font-style:normal}
.resource-nav-v6 .resource-tools-list .resource-all-tools{
  grid-template-columns:1fr 16px!important;
  margin-bottom:4px;
  padding:8px 10px!important;
  border-bottom:1px solid rgba(111,151,207,.14)!important;
  border-radius:0;
  color:#69a5ff!important;
  font-size:10px;
  font-weight:600;
}
.resource-nav-v6 .resource-all-tools b{text-align:right}

/* Existing dropdown visibility logic retained, with a consistent animation. */
.resource-nav-v6 .resource-compact-menu{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(9px);
  transition:opacity .18s ease,visibility .18s ease,transform .18s ease;
}
.resource-nav-v6.is-open .resource-compact-menu,
.resource-nav-v6.hover-open .resource-compact-menu{
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
  transform:translateY(0)!important;
}

@media(max-width:1180px){
  .pricing-page .site-header,
  .product-pricing-page .site-header,
  .affiliate-page .site-header,
  .resource-page .site-header,
  .blog-page .site-header{padding:0 24px}
  .pricing-page .desktop-nav>a,
  .product-pricing-page .desktop-nav>a,
  .affiliate-page .desktop-nav>a,
  .resource-page .desktop-nav>a,
  .blog-page .desktop-nav>a,
  .pricing-page .nav-dropdown-trigger,
  .product-pricing-page .nav-dropdown-trigger,
  .affiliate-page .nav-dropdown-trigger,
  .resource-page .nav-dropdown-trigger,
  .blog-page .nav-dropdown-trigger{padding:0 9px;font-size:13px}
}

@media(max-width:980px){
  .pricing-page .site-header,
  .product-pricing-page .site-header,
  .affiliate-page .site-header,
  .resource-page .site-header,
  .blog-page .site-header{height:72px;padding:0 18px}

  .pricing-page .site-header.open .desktop-nav,
  .product-pricing-page .site-header.open .desktop-nav,
  .affiliate-page .site-header.open .desktop-nav,
  .resource-page .site-header.open .desktop-nav,
  .blog-page .site-header.open .desktop-nav{
    top:72px;
    background:rgba(4,14,32,.985)!important;
    border:1px solid rgba(112,155,218,.18)!important;
    box-shadow:0 24px 55px rgba(0,8,24,.42)!important;
  }
  .pricing-page .site-header.open .desktop-nav>a,
  .product-pricing-page .site-header.open .desktop-nav>a,
  .affiliate-page .site-header.open .desktop-nav>a,
  .resource-page .site-header.open .desktop-nav>a,
  .blog-page .site-header.open .desktop-nav>a{color:#c7d5e8!important}

  .resource-nav-v6 .resource-compact-menu{
    position:static;
    width:100%;
    margin-top:8px;
    padding:7px;
    transform:none!important;
    border-radius:13px;
    box-shadow:none!important;
  }
  .resource-nav-v6 .resource-menu-entry{min-height:68px}
  .resource-nav-v6 .resource-tools-list{margin:2px 5px 7px 58px}
  .site-header.open .desktop-nav .resource-nav-v6{width:100%}
}

@media(max-width:620px){
  .pricing-page .site-header .brand,
  .product-pricing-page .site-header .brand,
  .affiliate-page .site-header .brand,
  .resource-page .site-header .brand,
  .blog-page .site-header .brand{font-size:19px}
  .pricing-page .site-header .brand-mark,
  .product-pricing-page .site-header .brand-mark,
  .affiliate-page .site-header .brand-mark,
  .resource-page .site-header .brand-mark,
  .blog-page .site-header .brand-mark{width:37px;height:37px}
  .resource-nav-v6 .resource-tools-list{margin-left:0}
  .resource-nav-v6 .resource-entry-copy em{white-space:normal}
}


/* --------------------------------------------------------------------------
   Resource navigation v6 — stable pointer hover and nested tools flyout
   -------------------------------------------------------------------------- */
@media (min-width:981px){
  .resource-nav-v6{
    position:relative;
    isolation:isolate;
  }

  /* The old 438px-wide hover corridor covered neighbouring navigation items and
     opened Resources when the pointer moved down from Pricing or Solutions.
     The JS close delay already bridges the small visual gap safely. */
  .resource-nav-v6::before{
    display:none!important;
    pointer-events:none!important;
  }

  .resource-nav-v6 .resource-compact-menu{
    top:calc(100% + 8px);
    transition:opacity .18s ease, visibility .18s ease, transform .18s ease;
    will-change:opacity,transform;
  }

  .resource-nav-v6.hover-open .resource-compact-menu,
  .resource-nav-v6.is-open .resource-compact-menu{
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:translateY(0)!important;
  }

  /* Keep the trigger highlighted while the pointer is inside the panel. */
  .resource-nav-v6.hover-open>.nav-dropdown-trigger,
  .resource-nav-v6.is-open>.nav-dropdown-trigger{
    color:#f5f8ff!important;
  }

  .resource-nav-v6.hover-open>.nav-dropdown-trigger>span,
  .resource-nav-v6.is-open>.nav-dropdown-trigger>span{
    transform:rotate(180deg)!important;
  }

  /* The tools group also opens by hover, with JS providing a short close delay. */
  .resource-nav-v6 .resource-tools-entry{
    position:relative;
  }
  .resource-nav-v6 .resource-tools-entry.hover-open>summary,
  .resource-nav-v6 .resource-tools-entry:focus-within>summary{
    background:rgba(44,104,202,.14)!important;
    border-color:rgba(92,151,240,.22)!important;
  }
  .resource-nav-v6 .resource-tools-entry.hover-open .resource-tool-chevron,
  .resource-nav-v6 .resource-tools-entry:focus-within .resource-tool-chevron{
    transform:rotate(180deg);
  }

  /* Do not let legacy :hover rules reveal the menu while the page is scrolling. */
  .resource-nav-v6:not(.hover-open):not(.is-open) .resource-compact-menu{
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    transform:translateY(9px)!important;
  }
  .resource-nav-v6:not(.hover-open):not(.is-open)>.nav-dropdown-trigger>span{
    transform:none!important;
  }
}

@media (max-width:980px){
  /* Mobile remains click-driven, so no invisible desktop hover corridor. */
  .resource-nav-v6::before{display:none!important}
  .resource-nav-v6 .resource-compact-menu{top:auto}
}

/* v7: solutions page navigation parity
   solutions.css previously defined its own brighter header gradient.
   Keep the solutions page on the exact same navigation system as the other inner pages. */
.solutions-page .site-header{
  width:100%;
  height:80px;
  margin:0;
  padding:0 max(28px,calc((100vw - 1480px)/2))!important;
  background:
    radial-gradient(circle at 78% -80%,rgba(55,116,255,.24),transparent 45%),
    linear-gradient(100deg,#030916 0%,#07162f 58%,#092550 100%)!important;
  border:0!important;
  border-bottom:1px solid var(--nav-v5-line)!important;
  border-radius:0!important;
  box-shadow:0 14px 38px rgba(1,10,29,.24)!important;
  color:var(--nav-v5-white)!important;
}
.solutions-page .site-header .brand{
  color:var(--nav-v5-white)!important;
  gap:11px;
  font-size:21px;
}
.solutions-page .site-header .brand-mark{
  width:42px;
  height:42px;
  border-radius:10px;
  overflow:visible;
  background:transparent!important;
  box-shadow:none!important;
}
.solutions-page .site-header .brand-mark img{
  width:100%;
  height:100%;
  object-fit:contain;
  transform:none!important;
  filter:drop-shadow(0 8px 16px rgba(24,102,255,.32));
}
.solutions-page .desktop-nav{
  gap:5px;
  align-items:center;
}
.solutions-page .desktop-nav>a,
.solutions-page .nav-dropdown-trigger{
  min-width:auto;
  height:38px;
  display:flex;
  align-items:center;
  padding:0 13px;
  border:0;
  border-radius:9px;
  background:transparent;
  color:var(--nav-v5-text)!important;
  font:500 14px "Noto Sans SC",sans-serif;
  line-height:1;
  cursor:pointer;
  text-decoration:none;
  transition:color .18s ease,background .18s ease;
}
.solutions-page .desktop-nav>a:after{display:none!important}
.solutions-page .desktop-nav>a:hover,
.solutions-page .nav-dropdown-trigger:hover,
.solutions-page .desktop-nav>a.current{
  color:#fff!important;
  background:rgba(255,255,255,.065)!important;
}
.solutions-page .header-actions .login,
.solutions-page .header-actions .lang{color:var(--nav-v5-text)!important}
.solutions-page .header-actions .button.small{
  color:#fff!important;
  background:linear-gradient(135deg,#114fe9,#1784ff)!important;
  border:1px solid rgba(114,178,255,.4)!important;
  box-shadow:0 10px 24px rgba(17,91,242,.25)!important;
}
.solutions-page .menu-toggle span{background:#fff!important}

@media(max-width:1180px){
  .solutions-page .site-header{padding:0 24px!important}
  .solutions-page .desktop-nav>a,
  .solutions-page .nav-dropdown-trigger{padding:0 9px;font-size:13px}
}
@media(max-width:980px){
  .solutions-page .site-header{height:72px;padding:0 18px!important}
  .solutions-page .site-header.open .desktop-nav{
    top:72px;
    background:rgba(4,11,25,.985)!important;
    border:1px solid rgba(126,169,231,.18)!important;
    box-shadow:0 24px 54px rgba(0,7,24,.42)!important;
  }
  .solutions-page .site-header.open .desktop-nav>a,
  .solutions-page .site-header.open .nav-dropdown-trigger{color:#c7d5e8!important}
  .solutions-page .site-header .brand{font-size:19px}
  .solutions-page .site-header .brand-mark{width:37px;height:37px}
}
