body:has(.btn--nav-toggle.active) {overflow: hidden;}

.wpb-navigation .wpb-navigation__main { background-color: var(--nav-bg-clr); --nav-bg-clr: transparent; position: absolute; width: 100%; z-index: 1040; transition: background-color var(--ts-duration) var(--ts-function); }
.wpb-navigation .wpb-navigation__main .wpb-navigation__top { padding-block: 2rem; }

.wpb-navigation .wpb-navigation__main .container {--p: 1rem 2rem; --m: 0; --br: 0; --border-width: 0; --border-1: hsl(0, 0%, 65%); --border-2: hsl(0, 0%, 75%); --bg: hsl(0, 0%, 50%);}
.wpb-navigation .wpb-navigation__main .container { display: flex; align-items: center; justify-content: space-between; column-gap: 2rem; padding: var(--p); margin: var(--m) auto; border-bottom: 1px solid rgba(222, 226, 230, 0.5); background: hsl(from var(--bg) h s l / 0.1); backdrop-filter: blur(4px); }

.wpb-navigation .wpb-navigation__main .logo { display: inline-flex; filter: contrast(0) brightness(2);  }
.wpb-navigation .wpb-navigation__main .logo img { width: 15rem; height: auto; }
.wpb-navigation .wpb-navigation__main .wux-search-form {display: none;}

@media (min-width: 992px) {
    .wpb-navigation .wpb-navigation__main .container {--p: 1rem 2rem; --m: 2rem; --br: 1rem; --border-width: 1px;}
    .wpb-navigation .wpb-navigation__main .container {display: grid; grid-template-columns: 22rem 1fr 22rem; border-bottom: none; border-radius: var(--br);}
    .wpb-navigation .wpb-navigation__main .container::before { content: ""; position: absolute; z-index: -1; inset: 0; border-radius: inherit; border: 1px solid transparent; background: linear-gradient(var(--border-1), var(--border-2)) border-box; mask: linear-gradient(black, black) border-box, linear-gradient(black, black) padding-box; mask-composite: subtract; }
    .wpb-navigation .wpb-navigation__main .wux-search-form {display: block;}
}


/* Hamburger button */
.btn.btn--nav-toggle, .btn.search-trigger { --bg-clr: transparent !important; --clr: #FFF !important; --border: 1px solid #FFF !important; }
.btn--nav-toggle {border: none; background: transparent; width: fit-content; margin-left: auto; }
.btn--nav-toggle:hover {cursor: pointer;}

.hamburger { width: 3rem; height: 1.8rem; display: flex; flex-direction: column; justify-content: space-between; align-items: flex-end; cursor: pointer; position: relative;}
.bar { height: 0.2rem; background-color: #fff; transition: all 0.2s ease; transform-origin: center; position: relative;}
.bar.top {width: 80%;  transform: translateY(0) rotate(0); transition-delay: 0s; }
.bar.middle {width: 60%; transform: translateY(0); opacity: 1; transition-delay: 0s; }
.bar.bottom {width: 100%; transform: translateY(0) rotate(0); transition-delay: 0s; }

.btn--nav-toggle.active .bar.top    {width: 100%; transition-delay: 0s;}
.btn--nav-toggle.active .bar.middle {opacity: 0;  transition-delay: 0.2s;}
.btn--nav-toggle.active .bar.bottom {width: 100%; transition-delay: 0s;}

.btn--nav-toggle.active .bar.top    {transform: translateY(0.8rem) rotate(45deg); transition-delay: 0.4s;}
.btn--nav-toggle.active .bar.bottom {transform: translateY(-0.8rem) rotate(-45deg); transition-delay: 0.4s;}

/* Collapse menu */
.wpb-navigation__collapse {--bg-clr: var(--clr-dark);}
.wpb-navigation__collapse { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100dvw; height: 100dvh; background-color: var(--bg-clr); z-index: 1000; display: flex ; flex-direction: column; align-items: flex-start; justify-content: flex-end;}
.wpb-navigation__collapse ul { list-style: none; }
.wpb-navigation__collapse .container {position: relative;}
.wpb-navigation__collapse .menu-item {--clr: var(--clr-light); --clr-hover: var(--clr-primary-20); --ff: var(--font-secondary); --fs: clamp(6rem, 6vw, 20rem); --lh: 1; --tr: color var(--ts-duration) var(--ts-function);}
.wpb-navigation__collapse .menu-item {position: relative;  margin: 1rem 0; }
.wpb-navigation__collapse .menu-item:last-child { margin-bottom: 0 !important; }
.wpb-navigation__collapse .menu-item .menu-link {color: var(--clr); text-decoration: none; display: inline-flex; align-items: center; column-gap: 2rem; font-family: var(--ff); font-size: var(--fs); line-height: var(--lh); transition: var(--tr); }
.wpb-navigation__collapse .menu-item .menu-link:hover { color: var(--clr-hover); }
.wpb-navigation__collapse .menu-item .menu-link span {margin-left: 4rem;}
.wpb-navigation__collapse .menu-item-has-children { position: relative; }  
.wpb-navigation__collapse .menu-item-has-children .menu-link { justify-content: space-between; }  

.wpb-navigation__collapse .menu-item .menu-link .menu-icon {width: 0.6rem; height: 0%; background: var(--clr); position: absolute; bottom: 0; left: -1rem; transition: all var(--ts-duration) var(--ts-function);}
.wpb-navigation__collapse .menu-item .menu-link:hover .menu-icon {height: 100%; background: var(--clr-hover);}

.wpb-navigation__collapse .container {height: 100%; display: flex ; flex-direction: row; gap: 4rem; justify-content: space-between; align-items: center;}
.wpb-navigation__collapse .wpb-menu-image {width: 100%; height: 100%; display: none; align-items: center; justify-content: center;}
.wpb-navigation__collapse .wpb-menu-image img {max-width: 40dvw; }

.wpb-navigation__collapse .wpb-menu-info {position: absolute; bottom: 0; left: 5.8rem;}
.wpb-navigation__collapse .wpb-menu-info .contact-link {padding: 0.4rem 0; font-size: 1.4rem; color: var(--clr-light); border-bottom: 1px solid rgba(222, 226, 230, 0.5); transition: color var(--ts-duration) var(--ts-function);}
.wpb-navigation__collapse .wpb-menu-info .contact-link:hover {color: var(--clr-primary-20);}
.wpb-navigation__collapse .wpb-menu-info .contact-link:last-child {padding-bottom: 0; border: none;}

@media (min-width: 992px) {
    .wpb-navigation__collapse .container {align-items: flex-end;}
    .wpb-navigation__collapse .wpb-menu-info {position: absolute; bottom: 0; left: unset; right: 0;}
    .wpb-navigation__collapse .wpb-menu-image {display: flex;}
}