.elementor-1785 .elementor-element.elementor-element-b25273b{--display:flex;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}/* Start custom CSS for urane_header, class: .elementor-element-277af22 */@media (max-width:1023px){

  /* Make the header wrapper stable */
  .container.nav-box.d-flex.justify-content-between.align-items-center{
    position: relative !important;
    min-height: 86px !important;
    padding: 10px 15px !important;
    overflow: visible !important;
  }

  /* Convert navbar-header into a 3-column grid */
  .navbar-header{
    width: 100% !important;
    display: grid !important;
    grid-template-columns: 44px 1fr 44px !important; /* left icon | center logo | spacer */
    align-items: center !important;
    position: relative !important;
  }

  /* Hamburger stays left */
  .navbar-toggle{
    grid-column: 1 !important;
    justify-self: start !important;
    position: relative !important;
    left: auto !important;
    top: auto !important;
    transform: none !important;
    z-index: 1000000 !important;
    margin: 0 !important;
  }

  /* Logo perfectly centered */
  a.navbar-brand{
    grid-column: 2 !important;
    justify-self: center !important;

    position: relative !important;
    left: auto !important;
    top: auto !important;
    transform: none !important;

    width: 220px !important;     /* adjust 180–240 */
    max-width: 70vw !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 0 !important;
    z-index: 999999 !important;
  }

  a.navbar-brand img{
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    display: block !important;
    object-fit: contain !important;
  }
}

/*..............................................HIDING THE MAIN LOGO WHEN HAMBURGER IS CLICKED...........*/
@media (max-width:1023px){

  /* When hamburger menu is OPEN, hide the HEADER logo only */
  .overlay-screen.opened ~ nav.navbar.validnavs .navbar-header .navbar-brand,
  .overlay-screen.opened ~ nav.navbar.validnavs .navbar-header img.logo,
  nav.navbar.validnavs:has(.navbar-collapse.collapse.show) .navbar-header .navbar-brand{
    display: none !important;
  }

  /* Make sure the MENU logo continues to show */
  nav.navbar.validnavs .navbar-collapse.collapse.show img{
    display: inline-block !important;
  }
}

/*.................after hinding main logo and showing mobile logo making it center aligned..............*/
@media (max-width:1023px){

  /* WHEN MENU IS OPEN: hide the main header logo (keep menu logo) */
  .overlay-screen.opened ~ nav.navbar.validnavs .navbar-header .navbar-brand{
    display: none !important;
  }

  /* OPEN MENU PANEL -> GRID HEADER ROW + MENU ROW */
  nav.navbar.validnavs .navbar-collapse.collapse.collapse-mobile.show{
    display: grid !important;
    grid-template-columns: 44px 1fr 44px !important;  /* left | center | spacer */
    grid-template-rows: auto 1fr !important;          /* header row | menu row */
    align-items: center !important;
  }

  /* MENU LOGO (the one inside the open menu) -> centered in header row */
  nav.navbar.validnavs .navbar-collapse.collapse.collapse-mobile.show > img{
    grid-column: 2 !important;
    grid-row: 1 !important;
    justify-self: center !important;
    margin: 12px 0 10px 0 !important;
    display: block !important;
    width: 220px !important;          /* adjust if needed */
    max-width: 70vw !important;
    height: auto !important;
  }

  /* CLOSE BUTTON (X) -> left in header row */
  nav.navbar.validnavs .navbar-collapse.collapse.collapse-mobile.show > .navbar-toggle{
    grid-column: 1 !important;
    grid-row: 1 !important;
    justify-self: start !important;
    margin-left: 15px !important;
    z-index: 5 !important;
  }

  /* MENU LIST -> full width on second row */
  nav.navbar.validnavs .navbar-collapse.collapse.collapse-mobile.show .menu-primary-menu-container{
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    width: 100% !important;
    padding-top: 10px !important;
  }

}

/*...............to remove extra scroll bar after fixing the center aligned mobile header ...........*/
@media (max-width:1023px){

  /* Prevent layout from exceeding viewport width */
  html, body{
    overflow-x: hidden !important;
  }

  /* Ensure mobile menu doesn't exceed viewport */
  #navbar-menu.collapse.navbar-collapse.collapse-mobile.show{
    max-height: 100vh !important;
    overflow-y: auto !important;
  }

}

/*..........to add toggle button to services ...........*/
@media (max-width:1023px){

  /* 1) Bring back arrow / dropdown indicator */
  nav.navbar.validnavs .navbar-nav li.menu-item-has-children > a.dropdown-toggle{
    position: relative !important;
    padding-right: 46px !important; /* space for arrow */
  }

  nav.navbar.validnavs .navbar-nav li.menu-item-has-children > a.dropdown-toggle:after{
    content: "›" !important;        /* arrow */
    position: absolute !important;
    right: 16px !important;
    top: 50% !important;
    transform: translateY(-50%) rotate(90deg) !important; /* looks like dropdown */
    font-size: 18px !important;
    line-height: 1 !important;
    opacity: 0.9 !important;
  }

  /* 2) Stop submenu from being cropped */
  nav.navbar.validnavs .navbar-collapse.collapse.collapse-mobile.show{
    overflow-y: auto !important;     /* keep scroll */
    overflow-x: hidden !important;
  }

  nav.navbar.validnavs .navbar-nav li.menu-item-has-children{
    overflow: visible !important;
  }

  nav.navbar.validnavs .navbar-nav li.menu-item-has-children > ul.dropdown-menu{
    position: relative !important;   /* keep it in flow */
    display: none;                   /* default closed */
    width: 100% !important;
    max-height: none !important;
    overflow: visible !important;
    padding-left: 12px !important;
  }

  /* 3) When theme adds dropdown.on, show submenu */
  nav.navbar.validnavs .navbar-nav li.dropdown.on > ul.dropdown-menu{
    display: block !important;
  }

}

/*.....items in the submenu for services are cropped.........*/
@media (max-width:1023px){

  /* SUBMENU ITEMS: force wrap + remove any clamp/ellipsis/truncation */
  nav.navbar.validnavs #navbar-menu.collapse.navbar-collapse.collapse-mobile.show
  ul.dropdown-menu > li,
  nav.navbar.validnavs #navbar-menu.collapse.navbar-collapse.collapse-mobile.show
  ul.dropdown-menu > li > a,
  nav.navbar.validnavs #navbar-menu.collapse.navbar-collapse.collapse-mobile.show
  ul.dropdown-menu > li > a *{
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    white-space: normal !important;
    text-overflow: clip !important;
    -webkit-line-clamp: unset !important;
    -webkit-box-orient: unset !important;
    max-width: none !important;
  }

  /* Make the submenu link actually wrap */
  nav.navbar.validnavs #navbar-menu.collapse.navbar-collapse.collapse-mobile.show
  ul.dropdown-menu > li > a{
    display: block !important;
    width: 100% !important;
    box-sizing: border-box !important;
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
    line-height: 1.25 !important;
    padding-right: 18px !important;
  }

  /* If the theme forces -webkit-box, this overrides it */
  nav.navbar.validnavs #navbar-menu.collapse.navbar-collapse.collapse-mobile.show
  ul.dropdown-menu > li > a{
    display: block !important;
  }
}
/*................remove inside scroll bar ...........*/
@media (max-width:1023px){

  /* Force mobile menu panel to align perfectly with screen */
  #navbar-menu.collapse.navbar-collapse.collapse-mobile.show{
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;

    width: 100vw !important;
    max-width: 100vw !important;

    margin: 0 !important;
    padding-left: 15px !important;
    padding-right: 15px !important;

    box-sizing: border-box !important;
  }

}

/*........to remove hamburger and x overlapping ......*/
@media (max-width:1023px){

  nav.navbar.validnavs:has(#navbar-menu.show) .navbar-toggle .fa-bars{ display:none !important; }
  nav.navbar.validnavs:has(#navbar-menu.show) .navbar-toggle .fa-times{ display:inline-block !important; }

  nav.navbar.validnavs:not(:has(#navbar-menu.show)) .navbar-toggle .fa-bars{ display:inline-block !important; }
  nav.navbar.validnavs:not(:has(#navbar-menu.show)) .navbar-toggle .fa-times{ display:none !important; }

}/* End custom CSS */