/* jx-sticky-nav — sitewide sticky header. Injected last; re-run: python3 scripts/inject-sticky-nav.py */

/* overflow-x:hidden on body creates a scroll containment and breaks position:sticky.
   clip does not. */
html {
  overflow-x: clip;
}
body,
body.body {
  overflow-x: clip !important;
  overflow-y: visible !important;
}

/* Known Webflow wrappers that nest the navbar on some templates */
body > .section.blog-light,
body > .section,
body > .hero-section,
body > .hero-section.pages-section,
body > .hero-section.light-green,
body > .hero-section.light-green.with-mockup,
body > .hero-section.light-green.with-mockup.get-demo,
body > .short-hero,
.page-wrapper,
.jx-root,
.jx-stage,
.jx-page {
  overflow: visible !important;
  overflow-x: visible !important;
  overflow-y: visible !important;
  transform: none !important;
  filter: none !important;
  perspective: none !important;
  contain: none !important;
}

/* Force sticky on every viewport — overrides earlier shell position:relative !important */
.navbar,
.navbar.w-nav,
.navbar.in-lock,
.hero-section.pages-section > .navbar,
.hero-section.pages-section > .navbar.w-nav,
.section.blog-light > .navbar,
.section.blog-light > .navbar.w-nav,
.hero-section > .navbar,
.hero-section > .navbar.w-nav {
  position: sticky !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  max-width: 100vw !important;
  z-index: 10050 !important;
  inset: 0% 0% auto !important;
}

@media screen and (max-width: 991px) {
  .navbar,
  .navbar.w-nav,
  .navbar.in-lock {
    position: sticky !important;
    top: 0 !important;
    z-index: 10050 !important;
  }
}

/* jx-align: shared 1120px column. Logo, page titles, hero images and body text start on the
   same left edge (column + clamp(20px..40px) gutter). Standing rule; measure with x-align QA. */
:root { --jx-col: 1120px; --jx-gutter: clamp(20px, 4vw, 40px); }
.hero-section > .container {
  max-width: var(--jx-col) !important; width: 100% !important;
  margin-left: auto !important; margin-right: auto !important;
  padding-left: var(--jx-gutter) !important; padding-right: var(--jx-gutter) !important;
  box-sizing: border-box !important;
}
.hero-section > .container:has(> .page-tittle) { padding-left: 0 !important; padding-right: 0 !important; }
.hero-section > .container > .page-tittle { padding-left: var(--jx-gutter) !important; padding-right: var(--jx-gutter) !important; box-sizing: border-box !important; }