sorry i thought you like to have that look of your example page.
So maybe you try :

#top .av-burger-overlay-bg {
  z-index: 3;
  opacity: 1;
  background-image: url(https://sonoranwaters.armourcloud.io/wp-content/uploads/2025/04/Custom-Pool-Designer-and-Builder-in-Scottsdale-Sonoran-Waters-3-1.jpg);
  background-size: cover;
  background-position: center bottom;
  background-repeat: no-repeat;
  display: block;
  position: fixed;
}

#top .av-burger-overlay-inner {
  z-index: 3;
  opacity: 1;
  background-image: url(https://sonoranwaters.armourcloud.io/wp-content/uploads/2025/04/Sonoran-Waters-Logo_LONG.png);
  background-repeat: no-repeat;
  background-size: 450px;
  background-position: center top;
  background-color: rgba(0,0,0,0.4);
  backdrop-filter: blur(2px)
}

you header settings and logo behaviour should be corrected generally.
Overlapping with burger icon etc. – that is something we can do for burger overlay then too.

and maybe this is nicer on transparency headers:

#top .av-main-nav-wrap {
  float: right;
  position: relative;
  z-index: 3;
  padding: 0  !important;
  margin: 0 0 0 15px !important;
}

.header_color.av_header_transparency .av-hamburger-inner, 
.header_color.av_header_transparency .av-hamburger-inner::before, 
.header_color.av_header_transparency .av-hamburger-inner::after {
  background-color: #FFF ;
}

#top .av_header_transparency .phone-info, 
#top .av_header_transparency .social_bookmarks li a {
  color: #FFF;
}

#top .av_header_glassy.av_header_transparency .avia-menu.av_menu_icon_beside {
  border: none !important;
}

find those entries in your css and korrekt them by:

@media only screen and (min-width: 768px) and (max-width: 989px) {
  .responsive.html_mobile_menu_tablet.html_header_top #top #main {
    padding-top: 70px !important;
  }
}

@media only screen and (max-width: 767px) {
  .responsive.html_mobile_menu_tablet.html_header_top #top #main {
    padding-top: 30px !important;
  }
}

The admin bar sometimes interferes with the setting of the frontend css.
have a look to this privacy page : https://webers-web.info/datenschutz/
if you scroll you see that the headings will be sticky til the next heading goes to top. if on that page the admin bar is present – the sticky moment seems to be wrong. – because those 50px are not concidered.
You can test it:
Go to your profile and turn off the “Show admin bar” to see that it has nothing to do with logging in and out.
This is something that normal users won’t see anyway.

Hello,

Any reason this isn’t included in the latest theme udpate?

To fix this icon in all places (Login, Checkout, My Account > Account Details, etc.) and make it look and function like it should (centered, color changing, and character input doesn’t overlap), I recommend this code, which basically pulls in a simplified version of the official WooCommerce layout stylesheet:

.woocommerce form .password-input {
	display: flex;
	flex-direction: column;
	justify-content: center;
	position: relative
}
.woocommerce form .password-input input {
	padding-right: 2.5rem !important;
	margin-bottom: 0;
}
.woocommerce form .password-input input::-ms-reveal {
	display: none
}
.woocommerce form .show-password-input {
	background: transparent;
	border: 0;
	color: #222;
	cursor: pointer;
	font-size: inherit;
	padding: 0;
	position: absolute;
	right: .7em;
	top: 50%;
	transform: translateY(-50%);
}
.woocommerce form .show-password-input.display-password {
	color: #999
}
.woocommerce form .show-password-input::after {
	font-family: WooCommerce;
	speak: never;
	-webkit-font-smoothing: antialiased;
	content: "\e010";
	margin-top: -2px;
	vertical-align: middle;
	display: inline-block
}