/* Site enhancements: mobile hero fix, go-to-top, hamburger morph, popup menu redesign */

/* ---------- 1. Mobile hero fix (homepage only, elementor-432) ---------- */
@media (max-width: 767px) {
  .elementor-432 .elementor-element.elementor-element-64e67d8b {
    --min-height: 100vh !important;
  }
  @supports (min-height: 100svh) {
    .elementor-432 .elementor-element.elementor-element-64e67d8b {
      --min-height: 100svh !important;
    }
  }

  .elementor-432 .elementor-element.elementor-element-7abfcb9a:not(.elementor-motion-effects-element-type-background),
  .elementor-432 .elementor-element.elementor-element-7abfcb9a > .elementor-motion-effects-container > .elementor-motion-effects-layer {
    background-size: cover !important;
  }

  .elementor-432 .elementor-element.elementor-element-3ced15a2 {
    --justify-content: center !important;
  }
}

/* ---------- 2. Go-to-top circular progress button ---------- */
.back-to-top {
  position: fixed;
  right: 20px;
  bottom: 20px;
  width: 44px;
  height: 44px;
  padding: 0;
  border: none;
  border-radius: 50%;
  background: #fff;
  color: var(--e-global-color-primary, #202323);
  box-shadow: 0 2px 10px rgba(0, 0, 0, .18);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: opacity .25s ease, transform .25s ease, visibility .25s;
  z-index: 900;
}
.back-to-top.is-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
/* Override the theme's generic button:focus/button:hover{background-color:#c36} default,
   which otherwise persists as a red background after a click leaves the button focused. */
.back-to-top:focus,
.back-to-top:hover {
  background: #fff !important;
  color: var(--e-global-color-primary, #202323) !important;
}
.back-to-top svg {
  position: absolute;
}
.back-to-top-track {
  stroke: #e5e5e5;
}
.back-to-top-progress {
  stroke: var(--e-global-color-primary, #202323);
  transition: stroke-dashoffset .1s linear;
}
.back-to-top-arrow {
  position: absolute;
}
/* Keep the go-to-top button out of the way while the full-screen menu is open */
body.menu-open .back-to-top {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
  .back-to-top {
    transition: none;
  }
}

/* ---------- 3. Hamburger <-> X icon ---------- */
/* One size in every state — hero, pinned pill and open panel. The pill used to
   shrink the icon to fit its padding, which made the icon read as smaller once
   it gained a background; the padding is tightened instead (see below) so the
   drawn glyph is identical with and without the black pill. */
.jkit-hamburger-menu .hamburger-icon {
  position: relative;
  /* block, not inline-block: as an inline box it sat on the text baseline and
     added ~7px of descender space below the glyph, making the pill taller than
     its padding implied and pushing the icon off-center inside it. */
  display: block;
  width: 30px;
  height: 20px;
}
/* Two WebKit-on-iOS behaviours, both only reachable once the button is pinned
   (position:fixed), which is why the bare icon over the hero never showed them:
   a fixed element's hit area lags its painted position until scrolling settles,
   so the first tap after a scroll lands behind the button; and without an
   explicit touch-action the engine holds the tap back while it waits to see
   whether a double-tap zoom is coming. Promoting the button to its own
   compositing layer keeps its hit area in sync, and manipulation opts out of
   the double-tap wait. */
.jkit-hamburger-menu {
  touch-action: manipulation;
}
.jkit-hamburger-menu .hamburger-bar {
  position: absolute;
  left: 0;
  width: 100%;
  height: 2px;
  background: currentColor;
  border-radius: 2px;
  transition: transform .3s ease, opacity .3s ease, top .3s ease;
}
/* Positioned proportionally, not at fixed pixel offsets: the icon is resized
   between the hero/scrolled/open states, and fixed offsets kept the 8px gaps
   while the box shrank, so the bars read as a different icon at each size.
   The 2px bar thickness is deliberately NOT scaled — it matches the
   stroke-width:2 used by every other icon on the site. */
.hamburger-bar-top { top: 0; }
.hamburger-bar-mid { top: calc(50% - 1px); }
.hamburger-bar-bottom { top: calc(100% - 2px); }

/* Hero (default) state: bare icon, no background, brand-black, sized near the logo */
body:not(.scrolled) .elementor-670 .elementor-element.elementor-element-511e1bb4 .jeg-elementor-kit.jkit-nav-menu .jkit-hamburger-menu {
  background: none !important;
  border: none !important;
  padding: 0 !important;
  width: auto !important;
  color: var(--e-global-color-primary, #202323);
}
/* Neutralize the theme's generic button:focus/button:hover color takeover
   (background-color:#c36 in one rule, var(--e-global-color-secondary) in
   another) which otherwise flashes red/green once the button retains focus
   after a click — most visible now that it's a large, fixed, always-onscreen
   element rather than a small transient pill. */
body:not(.scrolled) .elementor-670 .elementor-element.elementor-element-511e1bb4 .jeg-elementor-kit.jkit-nav-menu .jkit-hamburger-menu:focus,
body:not(.scrolled) .elementor-670 .elementor-element.elementor-element-511e1bb4 .jeg-elementor-kit.jkit-nav-menu .jkit-hamburger-menu:hover {
  background: none !important;
  color: var(--e-global-color-primary, #202323) !important;
}

/* Scrolled state: the header itself is sticky (see section 3b), so the button
   travels with it and stays in normal flow. It previously floated on its own
   as position:fixed at top:16px, which sat inside the strip iOS reserves for
   re-showing a collapsed URL bar — the first tap there restored the browser
   chrome instead of reaching the button, which is the "twitch, then it works
   on the second tap" that only ever happened once scrolled. */
body.scrolled .elementor-670 .elementor-element.elementor-element-511e1bb4 .jeg-elementor-kit.jkit-nav-menu .jkit-hamburger-menu {
  background: none !important;
  border: none !important;
  width: auto !important;
  padding: 0 !important;
  color: var(--e-global-color-primary, #202323);
}
/* The header's inner container is position:relative with z-index:99, so it
   opens a stacking context and every z-index above is resolved *inside* it —
   the button's 100001 competes as 99 against the August promo overlay's 99999.
   The pinned hamburger was therefore drawn under that overlay and, since the
   overlay closes on backdrop click, the first tap only dismissed the promo
   (releasing the scroll it held, which read as the page jumping) and a second
   tap was needed to open the menu. Lift the container itself past the overlay;
   the values inside it are already ordered correctly. Scoped to the states
   where the hamburger is pinned, so normal page stacking is untouched.

   body.promo-visible covers the case this first missed: back at the top of the
   page the .scrolled class is gone, so the container dropped to 99 again and
   the overlay recaptured the tap — which is what "scroll down, scroll back up,
   tap the menu" hits. The class is set from JS rather than :has() so it does
   not depend on selector support. */
body.scrolled .elementor-670 .elementor-element.elementor-element-34e86e79,
body.menu-open .elementor-670 .elementor-element.elementor-element-34e86e79,
body.promo-visible .elementor-670 .elementor-element.elementor-element-34e86e79 {
  z-index: 100000 !important;
}
body.scrolled .elementor-670 .elementor-element.elementor-element-511e1bb4 .jeg-elementor-kit.jkit-nav-menu .jkit-hamburger-menu:focus,
body.scrolled .elementor-670 .elementor-element.elementor-element-511e1bb4 .jeg-elementor-kit.jkit-nav-menu .jkit-hamburger-menu:hover {
  background: none !important;
  color: var(--e-global-color-primary, #202323) !important;
}

/* ---------- 3b. Sticky header (the 4nerd pattern) ----------
   Transparent over the hero, solid once scrolled, so the logo and the menu
   button ride along with the page instead of the button floating on its own.
   Scoped to the drawer breakpoints; the desktop header is left alone. */
@media (max-width: 1024px) {
  header.elementor-location-header {
    position: sticky !important;
    top: 0;
    z-index: 100000;
  }
  .elementor-670 .elementor-element.elementor-element-34e86e79 {
    /* The bar ships with padding-bottom:0, which was invisible while it was
       transparent and left the logo sitting on the edge once it gained a
       background. Matching the top padding also pushes the button further from
       the top edge, which is where the browser reclaims taps to restore a
       collapsed URL bar. */
    --padding-bottom: 20px;
    transition: background-color .25s ease, box-shadow .25s ease;
  }
  body.scrolled .elementor-670 .elementor-element.elementor-element-34e86e79 {
    background-color: #fff !important;
    box-shadow: 0 1px 12px rgba(32, 35, 35, .10);
  }
  /* The drawer covers the viewport, so the bar behind it should not show. */
  body.menu-open .elementor-670 .elementor-element.elementor-element-34e86e79 {
    background-color: transparent !important;
    box-shadow: none !important;
  }
}

/* Open (X) state */
.jkit-hamburger-menu.is-open .hamburger-bar-top {
  top: calc(50% - 1px);
  transform: rotate(45deg);
}
.jkit-hamburger-menu.is-open .hamburger-bar-mid {
  opacity: 0;
}
.jkit-hamburger-menu.is-open .hamburger-bar-bottom {
  top: calc(50% - 1px);
  transform: rotate(-45deg);
}

@media (prefers-reduced-motion: reduce) {
  .jkit-hamburger-menu .hamburger-bar {
    transition: none;
  }
}

/* =====================================================================
   4. Popup menu — full-screen overlay (pattern ported from 4nerd.com.br,
      recolored to our white/brand palette, our own typography kept)

   Scope note: .jkit-menu-wrapper doubles as BOTH the desktop horizontal
   nav row AND the mobile/tablet drawer. Elementor swaps between them via
   a data-elementor-device-mode attribute on <body> whose thresholds are
   mobile <=767 and tablet <=1024 — i.e. exactly the range this media
   query covers. Scoping the whole block in one @media keeps the desktop
   nav untouched without repeating three body[...] selectors per rule.
   ===================================================================== */
@media (max-width: 1024px) {

  /* ---- Panel: full-viewport, opacity fade (no slide) ---- */
  .jkit-menu-wrapper {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    background-color: #fff !important;
    max-width: none !important;
    width: 100% !important;
    left: 0 !important;
    top: 0;
    height: 100% !important;
    padding: 0 !important;
    overflow: hidden !important;
    opacity: 0;
    visibility: hidden;
    box-shadow: none !important;
    transition: opacity .3s cubic-bezier(.4, 0, .2, 1), visibility .3s !important;
    /* Must clear the promo overlay's 99999 too, or the panel opens behind it
       and the menu appears not to have opened at all. */
    z-index: 100000 !important;
  }
  .jkit-menu-wrapper.active {
    opacity: 1;
    visibility: visible;
  }

  /* Accent sweep across the top edge on open (4nerd's yellow stripe, in our green) */
  .jkit-menu-wrapper::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    height: 3px;
    width: 0;
    background: var(--e-global-color-secondary, #6CC964);
    transition: width .5s cubic-bezier(.4, 0, .2, 1) .05s;
    z-index: 2;
  }
  body.menu-open .jkit-menu-wrapper::before {
    width: 100%;
  }

  /* ---- Explicit vertical order (source order is social, CTA, nav, topbar) ---- */
  .jkit-menu-wrapper .jkit-nav-identity-panel { order: 1; flex: 0 0 auto; }
  .jkit-menu-wrapper .jkit-menu-container     { order: 2; flex: 1 1 auto; min-height: 0; }
  .jkit-menu-wrapper .jkit-drawer-cta         { order: 3; flex: 0 0 auto; }
  .jkit-menu-wrapper .jkit-menu-social        { order: 4; flex: 0 0 auto; }

  /* ---- Topbar: logo left, close right ---- */
  .jkit-menu-wrapper .jkit-nav-identity-panel {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    padding: 18px 24px !important;
    border-bottom: 1px solid rgba(32, 35, 35, .08);
    opacity: 0;
    transform: translateY(-16px);
    transition: opacity .3s ease .08s, transform .3s ease .08s;
  }
  body.menu-open .jkit-menu-wrapper .jkit-nav-identity-panel {
    opacity: 1;
    transform: translateY(0);
  }
  .jkit-menu-wrapper .jkit-nav-site-title {
    margin: 0 !important;
    line-height: 0;
  }
  /* The bundled CSS gives the logo anchor `margin:10px 0 0 15px` + `padding:5px`,
     which pushed it ~20px right of the nav items below it. Zero it out so the
     logo's left edge lines up with the menu labels. */
  .jkit-menu-wrapper .jkit-nav-identity-panel .jkit-nav-site-title .jkit-nav-logo {
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
    line-height: 0;
  }
  .jkit-menu-wrapper .jkit-nav-logo-mark {
    width: 40px;
    height: 40px;
  }
  /* The panel's own × is replaced by the hamburger itself, which stays on top
     of the panel and morphs bars->X in place (see the .menu-open rule below). */
  .jkit-menu-wrapper .jkit-close-menu {
    display: none !important;
  }

  /* ---- Nav area: the only scrollable region ---- */
  .jkit-menu-wrapper .jkit-menu-container {
    height: auto !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    /* Keeps a scroll that runs past the end of this list from being handed to
       the page behind it, which is what the body lock used to prevent. */
    overscroll-behavior: contain;
    padding: 8px 0;
  }
  /* The bundled CSS makes the <ul> itself `height:100%; overflow-y:auto`, which
     turned it into a second, broken scroller — its content spilled out behind
     the CTA/social instead of scrolling. Let the container be the only scroller. */
  .jkit-menu-wrapper > .jkit-menu-container > .jkit-menu {
    height: auto !important;
    overflow: visible !important;
  }

  /* ---- Top-level items ---- */
  .jkit-menu-wrapper .jkit-menu > li {
    border-bottom: 1px solid rgba(32, 35, 35, .06);
    opacity: 0;
    transform: translateX(-20px);
    transition: opacity .32s ease, transform .32s ease;
  }
  body.menu-open .jkit-menu-wrapper .jkit-menu > li {
    opacity: 1;
    transform: translateX(0);
  }
  .jkit-menu-wrapper .jkit-menu > li:nth-child(1) { transition-delay: .10s; }
  .jkit-menu-wrapper .jkit-menu > li:nth-child(2) { transition-delay: .14s; }
  .jkit-menu-wrapper .jkit-menu > li:nth-child(3) { transition-delay: .18s; }
  .jkit-menu-wrapper .jkit-menu > li:nth-child(4) { transition-delay: .22s; }
  .jkit-menu-wrapper .jkit-menu > li:nth-child(5) { transition-delay: .26s; }
  .jkit-menu-wrapper .jkit-menu > li:nth-child(6) { transition-delay: .30s; }
  .jkit-menu-wrapper .jkit-menu > li:nth-child(7) { transition-delay: .34s; }

  /* The bundled CSS forces `display:block!important; width:auto` on these
     anchors at a specificity we can't beat without an absurd selector, so
     the chevron is positioned absolutely rather than laid out with flex. */
  .jkit-menu-wrapper > .jkit-menu-container > .jkit-menu > li > a {
    position: relative;
    margin: 0 !important;
    padding: 13px 48px 13px 24px !important;
    font-size: clamp(18px, 4.8vw, 22px) !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    letter-spacing: -0.01em !important;
    color: var(--e-global-color-primary, #202323) !important;
    background: none !important;
  }
  /* Arrows are drawn as masked SVG rather than Unicode glyphs (›, ⌄, ↗), which
     came from unrelated glyph families and so never matched each other in
     weight or size. All three below share the site's existing arrow spec —
     24x24 box, stroke-width 2, round caps and joins — and take their color
     from currentColor via the mask. */
  .jkit-menu-wrapper > .jkit-menu-container > .jkit-menu > li > a::after {
    content: '';
    position: absolute;
    right: 24px;
    top: 50%;
    width: 20px;
    height: 20px;
    transform: translateY(-50%);
    background-color: currentColor;
    opacity: .35;
    transition: transform .3s ease;
  }
  /* chevron right */
  .jkit-menu-wrapper > .jkit-menu-container > .jkit-menu > li:not(.menu-item-has-children) > a::after {
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;
  }
  /* chevron down — same family as the one above, just rotated 90deg in the path */
  .jkit-menu-wrapper > .jkit-menu-container > .jkit-menu > li.menu-item-has-children > a::after {
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") center/contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") center/contain no-repeat;
  }
  /* Rotate the chevron while its own submenu is expanded. The widget's JS
     toggles .dropdown-open on the <ul>, not on the <li>/<a>, so :has() is
     what links the two; where unsupported the chevron simply stays put. */
  .jkit-menu-wrapper .jkit-menu > li.menu-item-has-children:has(> .sub-menu.dropdown-open) > a::after {
    transform: translateY(-50%) rotate(180deg);
  }

  /* ---- Submenu: real accordion, collapsed by default ----
     The bundled CSS ships display:none + a 5s max-height transition and
     ~20-40px paddings, which is what made this look broken and slow.
     Keep it displayed and animate max-height/opacity instead so the
     open/close actually eases. */
  .jkit-menu-wrapper .jkit-menu li .sub-menu {
    display: block !important;
    position: static !important;
    margin: 0 !important;
    padding: 0 !important;
    /* !important throughout: the bundled rules that set max-height:2500px and
       visibility carry a much higher specificity (body[data-elementor-device-mode]
       .jeg-elementor-kit.jkit-nav-menu.break-point-tablet ...), and without this
       the collapsed submenu still reserved ~160px of dead space in the panel. */
    max-height: 0 !important;
    opacity: 0 !important;
    visibility: visible !important;
    overflow: hidden !important;
    background: rgba(32, 35, 35, .025) !important;
    box-shadow: none !important;
    min-width: 0 !important;
    border-radius: 0 !important;
    transition: max-height .35s cubic-bezier(.4, 0, .2, 1),
                opacity .25s ease,
                padding .35s cubic-bezier(.4, 0, .2, 1) !important;
  }
  .jkit-menu-wrapper .jkit-menu li .sub-menu.dropdown-open {
    max-height: 420px !important;
    opacity: 1 !important;
    padding: 2px 0 !important;
  }
  .jkit-menu-wrapper .jkit-menu .sub-menu li {
    border-bottom: none;
    opacity: 1;
    transform: none;
  }
  .jkit-menu-wrapper .jkit-menu .sub-menu li > a {
    position: relative;
    margin: 0 !important;
    padding: 10px 48px 10px 40px !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 1.4 !important;
    color: rgba(32, 35, 35, .82) !important;
    background: none !important;
  }
  /* Reuses the exact path the site's own buttons use for their up-right arrow
     ("Schedule a FREE Trial"), so the drawer matches the rest of the site. */
  .jkit-menu-wrapper .jkit-menu .sub-menu li > a::after {
    content: '';
    position: absolute;
    right: 24px;
    top: 50%;
    width: 16px;
    height: 16px;
    transform: translateY(-50%);
    background-color: currentColor;
    opacity: .35;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17L17 7M17 7H7M17 7V17'/%3E%3C/svg%3E") center/contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17L17 7M17 7H7M17 7V17'/%3E%3C/svg%3E") center/contain no-repeat;
  }
  .jkit-menu-wrapper .jkit-menu .sub-menu li > a svg {
    fill: var(--e-global-color-primary, #202323) !important;
  }

  /* ---- CTA ---- */
  .jkit-drawer-cta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin: 16px 24px;
    padding: 15px 20px;
    border-radius: 8px;
    background: var(--e-global-color-primary, #202323);
    color: #fff !important;
    font-size: 16px;
    font-weight: 700;
    text-decoration: none;
    opacity: 0;
    transform: translateY(16px);
    transition: opacity .3s ease .36s, transform .3s ease .36s;
  }
  .jkit-drawer-cta svg {
    flex-shrink: 0;
  }
  body.menu-open .jkit-drawer-cta {
    opacity: 1;
    transform: translateY(0);
  }

  /* ---- Social strip: pinned to the bottom edge ---- */
  .jkit-menu-social {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 16px 24px calc(16px + env(safe-area-inset-bottom, 0px));
    border-top: 1px solid rgba(32, 35, 35, .08);
    opacity: 0;
    transform: translateY(16px);
    transition: opacity .3s ease .42s, transform .3s ease .42s;
  }
  body.menu-open .jkit-menu-social {
    opacity: 1;
    transform: translateY(0);
  }
  .jkit-menu-social a {
    font-size: 14px;
    font-weight: 500;
    color: rgba(32, 35, 35, .6) !important;
    text-decoration: none;
    transition: color .2s ease;
  }
  .jkit-menu-social a:hover {
    color: var(--e-global-color-primary, #202323) !important;
  }

  /* The hamburger IS the close button: rather than hiding it behind the panel
     and showing a separate ×, it stays above the panel and morphs bars->X in
     place. Its own click handler already toggles both ways.

     The header has to be fixed while the drawer is open. Sticky needs a
     scrollport to stick to, and the scroll lock puts overflow:hidden on the
     root, which takes that away — the bar then falls back to its natural place
     in the document, hundreds of pixels above the viewport, taking the close
     button off-screen with it. */
  body.menu-open header.elementor-location-header {
    position: fixed !important;
    top: 0;
    left: 0;
    right: 0;
  }
  /* The drawer draws its own logo in the same corner, so the header's would
     sit on top of it. */
  body.menu-open .elementor-670 .elementor-element.elementor-element-29c7ca8f {
    opacity: 0;
    pointer-events: none;
  }
  body.menu-open .elementor-670 .elementor-element.elementor-element-511e1bb4 .jeg-elementor-kit.jkit-nav-menu .jkit-hamburger-menu {
    position: relative;
    z-index: 100002; /* above the open panel, which is above the promo overlay */
    width: auto !important;
    padding: 0 !important;
    background: none !important;
    border: none !important;
    color: var(--e-global-color-primary, #202323) !important;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }

  @media (prefers-reduced-motion: reduce) {
    .jkit-menu-wrapper .jkit-nav-identity-panel,
    .jkit-menu-wrapper .jkit-menu > li,
    .jkit-drawer-cta,
    .jkit-menu-social {
      transition: none;
      opacity: 1;
      transform: none;
    }
    .jkit-menu-wrapper::before {
      transition: none;
    }
  }
}

/* The CTA is drawer-only markup; keep it out of the desktop nav row. */
@media (min-width: 1025px) {
  .jkit-drawer-cta,
  .jkit-menu-social {
    display: none !important;
  }
}

/* Backdrop + body scroll lock */
.jkit-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, .5);
  opacity: 0;
  visibility: hidden;
  transition: opacity .3s ease, visibility .3s;
  z-index: 999;
}
body.menu-open .jkit-overlay {
  opacity: 1;
  visibility: visible;
}

/* ---------- 7. Stroke-drawn icons must not be filled ---------- */
/* The theme ships `.elementor-element svg{fill:currentColor}`, and a CSS
   declaration beats the fill="none" presentation attribute on the element, so
   every icon drawn as an open stroked path was being flood-filled as well as
   stroked. A checkmark came out as a solid wedge; the up-right arrows in the
   trial buttons were filled triangles. 69 of the 71 inline icons across the
   site were affected — all of them inherited from the icon-font removal.
   `:not([fill])` leaves any child that declares its own fill alone. */
.elementor-element svg[fill="none"],
.elementor-element svg[fill="none"] :not([fill]) {
  fill: none;
}