/* WingZ nav + footer fixes layered over the Framer nav.
   The link rewrites (Blog -> Home, ordering, footer pruning) happen in
   wingz-nav.js; this file holds the rules that must win over Framer's inline
   styles (so they survive re-renders) and hide the dead menu items with no flash.
   Brand orange #F96029. */

/* 1) Hide the desktop nav menu items for pages we don't have.
      Each Framer menu item carries a unique hashed class:
        framer-12sdsb8 = Changelog   framer-14ucord = Careers
      (Blog is repurposed to Home, About + Pricing are kept, in wingz-nav.js.) */
nav .framer-12sdsb8,
nav .framer-14ucord {
  display: none !important;
}

/* 2) Login link sizing. The other nav links render at ~14px / 500, but the
      login preset comes through at 16px / 400, so it looks oversized and light,
      most visibly in the compact scrolled pill. Match it to the other links. */
nav a[data-wz-login],
nav a[href="./login"] {
  font-size: 14px !important;
  font-weight: 500 !important;
}

/* 2b) "Get started" CTA. They share the framer-VRbK8 button class but carry
       different Framer names: the DESKTOP nav-bar button is "Secondary" (only
       renders on desktop), the MOBILE burger-menu button is "Accent | Regular"
       (only renders on mobile). The mobile one came through teal originally. */

/* Mobile burger-menu CTA stays brand orange. */
a.framer-VRbK8[data-framer-name="Accent | Regular"] {
  background-color: #F96029 !important;
  --border-color: #F96029 !important;
}
/* Desktop nav-bar CTA -> dark button (desktop-only, since "Secondary" doesn't
   render on mobile). The inset ring keeps it legible both over the orange hero
   (transparent bar) and on the dark scrolled bar (~#121212), where a flat dark
   fill would otherwise disappear. No border-width change -> no layout shift. */
a.framer-VRbK8[data-framer-name="Secondary"] {
  background-color: #181818 !important;
  --border-color: rgba(255, 255, 255, 0.16) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.16) !important;
}
a.framer-VRbK8[data-framer-name="Secondary"]:hover {
  background-color: #2a2a2a !important;
}
/* White label on both. */
a.framer-VRbK8[data-framer-name="Secondary"] .framer-text,
a.framer-VRbK8[data-framer-name="Secondary"] p,
a.framer-VRbK8[data-framer-name="Accent | Regular"] .framer-text,
a.framer-VRbK8[data-framer-name="Accent | Regular"] p {
  --framer-text-color: #ffffff !important;
  color: #ffffff !important;
}

/* 3) Keep the bar legible whenever the page is scrolled. Framer's runtime drops
      the nav background when scrolling back up, so over light sections (e.g. the
      benchmarks panel) the white text becomes unreadable. Force the scrolled
      background past the hero; at the very top it stays transparent.
      Values match Framer's own "Scroll" variant so down-scroll is unchanged. */
/* Keep Framer's original nav WIDTH system untouched (full-width header on scroll-up,
   compact pill on scroll-down). The scroll-up block was just too TALL and ran to the
   screen's top edge, so match the compact pill's HEIGHT + top inset (width unchanged).
   Inset is done with margins (not min-height) so it can animate smoothly. */
html.wz-nav-solid nav [data-framer-name="Header"] {
  background-color: rgba(18, 18, 18, 0.85) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  backdrop-filter: blur(10px) !important;
  padding-top: 13px !important;     /* compact ~57px bar instead of the 91px block */
  padding-bottom: 13px !important;
  margin-top: 18px !important;      /* inset from the top edge, like the pill */
  margin-bottom: 18px !important;
  border-radius: 10px !important;
}
/* At the very top (not scrolled), force the bar transparent + un-blurred regardless
   of which variant Framer is in. Framer's own "Scroll" variant also paints the 0.85
   background, so without this the bar could stay opaque at the top instead of fading. */
html:not(.wz-nav-solid) nav [data-framer-name="Header"] {
  background-color: transparent !important;
  -webkit-backdrop-filter: blur(0px) !important;
  backdrop-filter: blur(0px) !important;
}
/* Smoothly fade the bar in/out instead of snapping the instant you reach the top.
   Framer drives width/transform itself (via JS, with transition:all 0s), so we only
   transition the bar's own look: background, blur, height (padding), inset, radius. */
nav [data-framer-name="Header"] {
  transition: background-color 0.3s ease, -webkit-backdrop-filter 0.3s ease, backdrop-filter 0.3s ease,
              padding-top 0.3s ease, padding-bottom 0.3s ease, margin-top 0.3s ease, margin-bottom 0.3s ease,
              border-radius 0.3s ease !important;
}
