/* ==========================================================================
   Atimi global header (Theme Builder template 726), 2026-09-23
   Source of truth: Atimi-website-design-system.md sections 7.3, 11, 12, 13
   plus Global shell/Atimi_global_shell.html for surface, CTA and menu styling.
   The shell file pins its frame to calc(100vw - 160px) at every width, which
   puts the mobile logo 80px in from the edge and overlaps the CTA at 390px.
   Design system 7.3 wins: 80px / 48px / 24px gutters.
   Structure: #atimiHeader > .e-con-inner > [#atimiLogo] [nav-menu] [button]
   Mobile menu: Elementor's dropdown, restyled as a full-screen overlay.
   Behaviour (compact on scroll, scroll lock, Escape, CTA) lives in snippet 735.
   ========================================================================== */

#atimiHeader {
  --hdr-frame: min(1280px, calc(100vw - 160px));
  --hdr-h: 88px;
  --hdr-h-compact: 64px;
  --logo-w: 168px;
  --logo-scale: 0.7381;   /* 124 / 168 */
  --nav-gap: clamp(18px, 1.7vw, 28px);
  --group-gap: 24px;
  --cta-pad-x: 20px;
  --line: rgba(255, 255, 255, 0.13);
  position: fixed !important;
  /* Explicit top: with top:auto a fixed element sits at its 'static position', which iOS Safari
     recalculated mid-page on About (header floated ~650px down). Offsets for the admin bar when shown. */
  top: var(--wp-admin--admin-bar--height, 0px) !important;
  left: 0; right: 0;
  z-index: 1100 !important; /* above all page content: sticky case-study title (50), tech tiles/tooltips (50/100), values head/footer (1000) */
  min-height: 0 !important;
  padding: 8px 0 !important;
  background-color: rgba(2, 9, 15, 0) !important;
  transition: background-color .45s ease, backdrop-filter .45s ease, -webkit-backdrop-filter .45s ease;
}
#atimiHeader.is-compact {
  background-color: rgba(2, 9, 15, .76) !important;
  -webkit-backdrop-filter: blur(18px) saturate(135%);
  backdrop-filter: blur(18px) saturate(135%);
}
.elementor-location-header { position: relative; z-index: 1100; }

#atimiHeader > .e-con-inner {
  width: var(--hdr-frame) !important;
  max-width: 1280px !important;
  height: var(--hdr-h);
  min-height: 0 !important;
  margin-inline: auto !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 0 !important;
  box-sizing: border-box;
  transition: height .45s cubic-bezier(.22, 1, .36, 1);
}
#atimiHeader.is-compact > .e-con-inner { height: var(--hdr-h-compact); }

/* Logo: fixed box, image scales inside it so nothing in the row reflows */
#atimiHeader #atimiLogo {
  order: 1;
  flex: 0 0 var(--logo-w) !important;
  width: var(--logo-w) !important;
  max-width: var(--logo-w) !important;
  margin: 0 !important;
}
#atimiHeader #atimiLogo a { display: block; line-height: 0; }
#atimiHeader #atimiLogo img {
  display: block !important;
  width: var(--logo-w) !important;
  max-width: none !important;
  height: auto !important;
  max-height: none !important;
  object-fit: contain;
  transform-origin: left center !important;
  transition: transform .4s ease !important;
  backface-visibility: hidden;
}
#atimiHeader.is-compact #atimiLogo img { transform: scale(var(--logo-scale)) !important; }

/* Desktop navigation */
#atimiHeader .elementor-widget-nav-menu {
  order: 2;
  flex: 0 0 auto !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 var(--group-gap) 0 auto !important;
  --e-nav-menu-horizontal-menu-item-margin: var(--nav-gap);
}
#atimiHeader .elementor-nav-menu--main .elementor-nav-menu > li > a.elementor-item {
  position: relative;
  padding: 0 !important;
  font-family: var(--font-body) !important;
  font-size: var(--type-ui) !important;
  font-weight: 500 !important;
  line-height: 1.3 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  white-space: nowrap;
  color: #AECBDE !important;
  transition: color .25s ease;
}
#atimiHeader .elementor-nav-menu--main .elementor-item:hover,
#atimiHeader .elementor-nav-menu--main .elementor-item:focus-visible,
#atimiHeader .elementor-nav-menu--main .elementor-item.elementor-item-active { color: #FFFFFF !important; }
#atimiHeader .elementor-nav-menu--main .elementor-item::after {
  content: "";
  position: absolute;
  left: 0; right: 100%; bottom: -8px;
  height: 1px;
  background: linear-gradient(90deg, #32C0E9, #0BD3C5);
  opacity: 1 !important;
  transition: right .3s cubic-bezier(.22, 1, .36, 1);
}
#atimiHeader .elementor-nav-menu--main .elementor-item:hover::after,
#atimiHeader .elementor-nav-menu--main .elementor-item:focus-visible::after,
#atimiHeader .elementor-nav-menu--main .elementor-item.elementor-item-active::after { right: 0; }


/* Item spacing: Elementor splits its own 52px margin across both sides of each link; replace it with the shell gap */
#atimiHeader .elementor-nav-menu--main .elementor-nav-menu > li > a.elementor-item { margin-inline: 0 !important; }
#atimiHeader .elementor-nav-menu--main .elementor-nav-menu > li:not(:first-child) > a.elementor-item { margin-inline-start: var(--nav-gap) !important; }

/* Contact us: header / compact CTA, design system 11.1 + 11.2 */
#atimiHeader .elementor-widget-button {
  order: 3;
  flex: 0 0 auto !important;
  width: auto !important;
  margin: 0 !important;
}
#atimiHeader .elementor-widget-button .elementor-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0 !important;
  min-height: 44px !important;
  padding: 10px var(--cta-pad-x) !important;
  border: 0 !important;
  border-radius: 999px !important;
  font-family: var(--font-body) !important;
  font-size: var(--type-ui) !important;
  font-weight: 500 !important;
  line-height: 1.3 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  white-space: nowrap !important;
  color: #FFFFFF !important;
  background-color: transparent !important;
  background-image: linear-gradient(110deg, #006DA6 0%, #007FA0 42%, #00819A 70%, #73518E 100%) !important;
  box-shadow: none !important;
  transform: none !important;
  transition: box-shadow .32s ease !important;
}
#atimiHeader .elementor-widget-button .elementor-button:hover,
#atimiHeader .elementor-widget-button .elementor-button:focus-visible {
  background-image: linear-gradient(110deg, #73518E 0%, #00819A 30%, #007FA0 58%, #006DA6 100%) !important;
  box-shadow: 0 0 8px rgb(50 192 233 / .16), 0 8px 16px rgb(11 211 197 / .20) !important;
  transform: none !important;
}
#atimiHeader .elementor-widget-button .elementor-button:focus-visible { outline: 2px solid #32C0E9; outline-offset: 3px; }
#atimiHeader .elementor-widget-button .elementor-button::after,
#atimiHeader .elementor-widget-button .elementor-button-icon { content: none !important; display: none !important; }

/* Hamburger (hidden above 820px) */
#atimiHeader .elementor-menu-toggle { display: none !important; }

/* ---- Frame: 761-1439px, design system 7.3 ---- */
@media (max-width: 1439px) {
  #atimiHeader { --hdr-frame: min(1280px, calc(100% - 96px)); }
}

/* ---- Tablet with full nav: 821-1180px (shell) ---- */
@media (max-width: 1180px) {
  #atimiHeader { --logo-w: 150px; --logo-scale: 0.7867; --nav-gap: 18px; --group-gap: 18px; --cta-pad-x: 17px; }
}
/* Elementor collapses the menu at its tablet breakpoint (1024); keep the full nav down to 821px */
@media (min-width: 821px) and (max-width: 1024px) {
  #atimiHeader .elementor-nav-menu--main { display: block !important; }
  /* 2026-10-14: was .elementor-nav-menu--dropdown, which also matched the desktop Services sub-menu and kept it hidden on tablet */
  #atimiHeader nav.elementor-nav-menu--dropdown { display: none !important; }
}

/* ---- Mobile header: 820px and below ---- */
@media (max-width: 820px) {
  #atimiHeader { --hdr-h: 82px; --logo-w: 132px; --logo-scale: 0.8485; }
  #atimiHeader .elementor-nav-menu--main { display: none !important; }
  /* Contact us sits next to the hamburger, not in the middle */
  #atimiHeader .elementor-widget-button { order: 2; margin-left: auto !important; }
  #atimiHeader .elementor-widget-nav-menu { order: 3; margin: 0 0 0 10px !important; }

  #atimiHeader .elementor-menu-toggle {
    display: flex !important;
    position: relative;
    align-items: center; justify-content: center;
    width: 44px !important; height: 44px !important;
    min-width: 44px; padding: 0 !important; margin: 0 !important;
    border: 1px solid var(--line) !important;
    border-radius: 50% !important;
    background: rgba(255, 255, 255, .06) !important;
    color: #FFFFFF !important;
    cursor: pointer;
    box-sizing: border-box;
    font-size: 0 !important;
  }
  #atimiHeader .elementor-menu-toggle > * { display: none !important; }
  #atimiHeader .elementor-menu-toggle::before,
  #atimiHeader .elementor-menu-toggle::after {
    content: "";
    position: absolute;
    left: 50%; top: 50%;
    width: 16px; height: 1.5px;
    margin: -0.75px 0 0 -8px;
    border-radius: 4px;
    background: currentColor;
    transition: transform .28s ease, box-shadow .28s ease, opacity .28s ease;
  }
  #atimiHeader .elementor-menu-toggle::before { box-shadow: 0 -5.5px 0 currentColor, 0 5.5px 0 currentColor; }
  #atimiHeader .elementor-menu-toggle::after { opacity: 0; }
  #atimiHeader .elementor-menu-toggle.elementor-active::before { box-shadow: 0 0 0 transparent, 0 0 0 transparent; transform: rotate(45deg); }
  #atimiHeader .elementor-menu-toggle.elementor-active::after { opacity: 1; transform: rotate(-45deg); }
  #atimiHeader .elementor-menu-toggle:focus-visible { outline: 2px solid #32C0E9; outline-offset: 3px; }

  /* Full-screen overlay. It sits under the logo, CTA and toggle (z-index -1 inside
     the header's stacking context) and above the page. */
  #atimiHeader .elementor-nav-menu--dropdown.elementor-nav-menu__container {
    position: fixed !important;
    inset: 0 !important;
    top: 0 !important; left: 0 !important;
    width: 100% !important;
    height: 100vh !important; height: 100dvh !important;
    max-height: none !important;
    margin: 0 !important;
    z-index: -1 !important;
    display: flex !important;
    flex-direction: column;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    box-sizing: border-box;
    padding: 124px max(24px, calc((100% - 680px) / 2 + 24px)) 40px !important;
    /* QA 2026-09-25 v2: page must be unreadable behind the menu. Near-solid tint + heavy blur. */
    background: rgba(3, 10, 17, .97) !important;
    -webkit-backdrop-filter: blur(64px) saturate(120%);
    backdrop-filter: blur(64px) saturate(120%);
    overscroll-behavior: contain;
    border: 0 !important;
    box-shadow: none !important;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(-14px) !important;
    transform-origin: top center;
    transition: opacity .28s ease, visibility .28s ease, transform .38s cubic-bezier(.22, 1, .36, 1) !important;
  }
  #atimiHeader .elementor-menu-toggle.elementor-active + .elementor-nav-menu__container {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: none !important;
  }
  #atimiHeader .elementor-nav-menu--dropdown .elementor-nav-menu {
    display: flex !important;
    flex-direction: column;
    flex: 0 0 auto;
    width: 100%;
    margin: 0; padding: 0;
  }
  #atimiHeader .elementor-nav-menu--dropdown .elementor-nav-menu > li { border: 0 !important; }
  #atimiHeader .elementor-nav-menu--dropdown a.elementor-item {
    display: flex !important;
    align-items: center;
    min-height: 68px;
    padding: 14px 0 !important;
    border: 0 !important;
    border-bottom: 1px solid var(--line) !important;
    background: transparent !important;
    color: #FFFFFF !important;
    font-family: var(--font-body) !important;
    font-size: var(--type-ui) !important;
    font-weight: 500 !important;
    line-height: 1.3 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    transition: color .22s ease, padding-left .28s cubic-bezier(.22, 1, .36, 1);
  }
  #atimiHeader .elementor-nav-menu--dropdown .elementor-nav-menu > li:last-child > a.elementor-item { border-bottom: 0 !important; }
  #atimiHeader .elementor-nav-menu--dropdown a.elementor-item:hover,
  #atimiHeader .elementor-nav-menu--dropdown a.elementor-item:focus-visible { color: #32C0E9 !important; padding-left: 8px !important; }
  #atimiHeader .elementor-nav-menu--dropdown a.elementor-item.elementor-item-active { color: #32C0E9 !important; }
  #atimiHeader .elementor-nav-menu--dropdown a.elementor-item::after { display: none !important; }

  /* Bottom CTA, added by snippet 735 */
  #atimiHeader .atimi-menu-cta {
    display: inline-flex;
    align-items: center; justify-content: center;
    width: 100%;
    min-height: 56px;
    margin-top: auto;
    padding: 15px 28px;
    box-sizing: border-box;
    border-radius: 999px;
    font-family: var(--font-body);
    font-size: 18px;
    font-weight: 500;
    line-height: 1.3;
    color: #FFFFFF !important;
    text-decoration: none;
    background-image: linear-gradient(110deg, #006DA6 0%, #007FA0 42%, #00819A 70%, #73518E 100%);
    transition: box-shadow .32s ease;
  }
  #atimiHeader .elementor-nav-menu--dropdown .elementor-nav-menu + .atimi-menu-cta { margin-top: auto; }
  #atimiHeader .atimi-menu-cta:hover,
  #atimiHeader .atimi-menu-cta:focus-visible {
    background-image: linear-gradient(110deg, #73518E 0%, #00819A 30%, #007FA0 58%, #006DA6 100%);
    box-shadow: 0 0 8px rgb(50 192 233 / .16), 0 8px 16px rgb(11 211 197 / .20);
  }

  /* Open state: backdrop-filter on the header would make it the containing block
     for the fixed overlay (clipping it to the header bar), so drop it while open. */
  body.atimi-menu-open #atimiHeader {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    background-color: transparent !important;
  }
  html.atimi-menu-open, body.atimi-menu-open { overflow: hidden !important; }
}

/* ---- 760px and below: 24px gutters ---- */
@media (max-width: 760px) {
  #atimiHeader { --hdr-frame: calc(100% - 48px); }
  #atimiHeader .atimi-menu-cta { min-height: 52px; padding: 13px 24px; font-size: 16px; }
}

/* ---- Very narrow ---- */
@media (max-width: 420px) {
  #atimiHeader { --logo-w: 122px; --logo-scale: 0.8689; }
  #atimiHeader .elementor-widget-nav-menu { margin-left: 8px !important; }
  #atimiHeader .elementor-menu-toggle { width: 42px !important; height: 42px !important; min-width: 42px; }
  #atimiHeader .elementor-nav-menu--dropdown.elementor-nav-menu__container { padding-top: 112px !important; padding-bottom: 32px !important; }
  #atimiHeader .elementor-nav-menu--dropdown a.elementor-item { min-height: 64px; }
}

@media (prefers-reduced-motion: reduce) {
  #atimiHeader, #atimiHeader > .e-con-inner, #atimiHeader #atimiLogo img,
  #atimiHeader .elementor-menu-toggle::before, #atimiHeader .elementor-menu-toggle::after,
  #atimiHeader .elementor-nav-menu--dropdown.elementor-nav-menu__container,
  #atimiHeader .elementor-nav-menu--dropdown a.elementor-item { transition: none !important; }
}
/* <=600px the WP admin bar is position:absolute and scrolls away, so the header pins to 0. */
@media (max-width: 600px) { #atimiHeader { top: 0 !important; } }

/* 2026-09-29 iOS Safari fix, option A (QA: header floated to the bottom of the About hero on iOS 26 Safari; second occurrence).
   Give the header its own compositing layer so Safari keeps it pinned to the viewport. A transform makes the header the
   containing block for its position:fixed children, which would clip the full-screen mobile menu to the header bar, so
   the layer is dropped while the menu is open (same pattern as backdrop-filter below). */
#atimiHeader:not(.elementor-sticky__spacer){-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);will-change:transform;-webkit-backface-visibility:hidden;backface-visibility:hidden}
html.atimi-menu-open #atimiHeader,body.atimi-menu-open #atimiHeader{-webkit-transform:none!important;transform:none!important;will-change:auto!important}

/* 2026-09-29: nav hover/active colour. The base link rule (#atimiHeader ... .elementor-nav-menu > li > a.elementor-item, colour !important)
   out-specified the hover rule, so only the underline showed on hover and the active page stayed #AECBDE. Same selector depth here so white wins. */
#atimiHeader .elementor-nav-menu--main .elementor-nav-menu > li > a.elementor-item:hover,
#atimiHeader .elementor-nav-menu--main .elementor-nav-menu > li > a.elementor-item:focus-visible,
#atimiHeader .elementor-nav-menu--main .elementor-nav-menu > li > a.elementor-item.elementor-item-active,
#atimiHeader .elementor-nav-menu--main .elementor-nav-menu > li.current-menu-item > a.elementor-item,
#atimiHeader .elementor-nav-menu--main .elementor-nav-menu > li.current-menu-ancestor > a.elementor-item,
#atimiHeader .elementor-nav-menu--main .elementor-nav-menu > li:hover > a.elementor-item{color:#FFFFFF !important}
#atimiHeader .elementor-nav-menu--main .elementor-nav-menu > li:hover > a.elementor-item::after,
#atimiHeader .elementor-nav-menu--main .elementor-nav-menu > li.current-menu-ancestor > a.elementor-item::after{right:0}

/* 2026-09-29 (Ron): desktop Services dropdown attaches to the bottom edge of the header bar instead of
   floating 40px above it, with a bit more padding. Nav links are vertically centred in the bar, so the gap
   from the link's li to the bar's edge is (bar height - 24px link) / 2 + 8px header padding:
   88px bar -> 40px, 64px compact bar -> 28px. The ::before bridge fills that gap so the menu does not
   close while the pointer travels down to it. Also: the panel was a fixed 156px, so
   "Mobile App Development" ran past its right edge; it now sizes to its longest item. */
#atimiHeader .elementor-nav-menu--main .sub-menu{
  top:calc(100% + 40px)!important;
  margin-top:0!important;
  width:max-content!important;
  min-width:240px!important;
  max-width:none!important;
  padding:8px 0!important;
}
#atimiHeader.is-compact .elementor-nav-menu--main .sub-menu{top:calc(100% + 28px)!important}
#atimiHeader .elementor-nav-menu--main .sub-menu::before{content:"";position:absolute;left:0;right:0;bottom:100%;height:40px}
#atimiHeader.is-compact .elementor-nav-menu--main .sub-menu::before{height:28px}
#atimiHeader .elementor-nav-menu--main .sub-menu a{padding:16px 28px!important;white-space:nowrap!important}#atimiHeader .elementor-nav-menu--main .sub-menu{transition:top .45s cubic-bezier(.22,1,.36,1)}

/* 2026-09-29: skip link. Hello Elementor's link stayed clipped even when focused, so Tab never showed it.
   Visible on keyboard focus, top-left, above the header. Target is set in js/atimi-skip-link.js. */
.skip-link.screen-reader-text:focus,
.skip-link.screen-reader-text:focus-visible{
  position:fixed!important;top:calc(var(--wp-admin--admin-bar--height,0px) + 16px)!important;left:16px!important;
  z-index:100000!important;width:auto!important;height:auto!important;margin:0!important;
  clip:auto!important;clip-path:none!important;overflow:visible!important;white-space:nowrap;
  display:inline-flex!important;align-items:center;min-height:44px;padding:10px 20px!important;
  border-radius:999px!important;background:#FFFFFF!important;color:#030B12!important;
  font:600 16px/1.2 var(--font-body,'Inter',sans-serif)!important;text-decoration:none!important;
  outline:2px solid #32C0E9!important;outline-offset:3px!important;box-shadow:0 8px 24px rgba(0,0,0,.35)!important;
}
[id="main-content"]:focus,[tabindex="-1"]:focus{outline:none}

/* 2026-10-01: "All services" (menu item 1081, class atimi-menu-mobile-only) shows in the mobile menu only. */
#atimiHeader nav.elementor-nav-menu--main .atimi-menu-mobile-only { display: none !important; }

/* 2026-10-01: service sub-items render as stored (sentence case). Overrides the nav-menu widget's capitalize typography in post-726.css. */
#atimiHeader .elementor-nav-menu .elementor-sub-item { text-transform: none !important; }


/* 2026-10-09 DWR-513: parent item active on its child pages. WordPress marks a menu page's ancestor with
   current-page-ancestor (not current-menu-ancestor, which needs the child in the menu), so Case studies stayed
   grey on /case-studies/raymond-james/ etc. Same white text + full underline as the current page. */
#atimiHeader .elementor-nav-menu--main .elementor-nav-menu > li.current-page-ancestor > a.elementor-item{color:#FFFFFF !important}
#atimiHeader .elementor-nav-menu--main .elementor-nav-menu > li.current-page-ancestor > a.elementor-item::after{right:0}
@media (max-width:1024px){
  #atimiHeader nav.elementor-nav-menu--dropdown .elementor-nav-menu > li.current-page-ancestor > a.elementor-item{color:#32C0E9 !important}
}

/* ==========================================================================
   DWR-508, 2026-10-13: "Contact us" current-page (on) state on Contact (827).
   Solid #0BD3C5 fill. Gradients cannot transition, so the fill is a ::before
   layer whose opacity animates: fades in on arrival, holds on hover.
   Rollback: delete this block (backup global-header.css.bak-20261013-dwr508).
   ========================================================================== */
@keyframes atimi-cta-on { from { opacity: 0; } to { opacity: 1; } }
body.page-id-827 #atimiHeader .elementor-widget-button .elementor-button,
body.page-id-827 #atimiHeader .atimi-menu-cta {
  position: relative;
  isolation: isolate;
}
body.page-id-827 #atimiHeader .elementor-widget-button .elementor-button::before,
body.page-id-827 #atimiHeader .atimi-menu-cta::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  background: #0BD3C5;
  opacity: 1;
  pointer-events: none;
  animation: atimi-cta-on .5s ease both;
}
body.page-id-827 #atimiHeader .elementor-widget-button .elementor-button:hover,
body.page-id-827 #atimiHeader .elementor-widget-button .elementor-button:focus-visible,
body.page-id-827 #atimiHeader .atimi-menu-cta:hover,
body.page-id-827 #atimiHeader .atimi-menu-cta:focus-visible {
  box-shadow: 0 0 8px rgb(11 211 197 / .22), 0 8px 16px rgb(11 211 197 / .24) !important;
}
@media (prefers-reduced-motion: reduce) {
  body.page-id-827 #atimiHeader .elementor-widget-button .elementor-button::before,
  body.page-id-827 #atimiHeader .atimi-menu-cta::before { animation: none; }
}
/* DWR-508 text, 2026-10-13: on-state label #030A11. The label fades with the fill.
   The wrapper span is coloured (not the <a>, whose colour is !important, which
   would block the animation). The mobile menu CTA has no wrapper; it opens later,
   so it simply takes the colour. */
@keyframes atimi-cta-on-text { from { color: #FFFFFF; } to { color: #030A11; } }
body.page-id-827 #atimiHeader .elementor-widget-button .elementor-button .elementor-button-content-wrapper {
  color: #030A11;
  animation: atimi-cta-on-text .5s ease both;
}
body.page-id-827 #atimiHeader .atimi-menu-cta { color: #030A11 !important; }
@media (prefers-reduced-motion: reduce) {
  body.page-id-827 #atimiHeader .elementor-widget-button .elementor-button .elementor-button-content-wrapper { animation: none; }
}

/* 2026-10-14: on tablet (821-1024px) the desktop Services dropdown also shows "All services", since the first tap on Services only opens the dropdown. */
@media (min-width: 821px) and (max-width: 1024px) {
  #atimiHeader nav.elementor-nav-menu--main li.atimi-menu-mobile-only { display: list-item !important; }
}