.white-logo{
    display: none;
}
.header_element_wrap {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    max-width: 2560px;
    margin: 0 auto;
}
.site-branding {
    width: 33%;
}
.main-navigation {
    width: 67%;
    padding-top: clamp(3px, calc(0.1875rem + ((1vw - 19.2px) * 0.625)), 7px);
}
.menu {
    list-style: none;
    display: flex;
    padding-left: clamp(30px, calc(1.875rem + ((1vw - 19.2px) * 1.25)), 38px);
}
.menu li a{
    color: var(--grey-03);
    font-family: var(--open-sans);
    font-size: clamp(14px, calc(0.875rem + ((1vw - 19.2px) * 0.625)), 18px);
    font-weight: 600;
    line-height: normal;
    text-transform: uppercase;
    padding: 1.5px clamp(20px, calc(1.25rem + ((1vw - 19.2px) * 0.9375)), 26px);
    border-right: 1px solid var(--grey-03);
    display: flex;
    flex-direction: column;
}
body:not(.home) .menu-home a {
    border-left: 1px solid;
}
.menu li a:before, .menu li a:after {
    content: "";
    display: block;
    width: 0;
    border-top: 1px solid;
    background: var(--grey-03);
    margin: 0px auto;
    position: relative;
}
.menu li a:before {
    transition: width 0.9s;
}
.menu li a:after {
    top: 0px;
    position: relative;
    transition: width 0.5s;
}
.menu li:hover a:before, .menu li:hover a:after, .home .footer_inView .menu-approach a:before, .home .footer_inView .menu-approach a:after, .page-approach .footer_inView .menu-team a:before, .page-approach .footer_inView .menu-team a:after, .page-team .footer_inView .menu-portfolio a:before, .page-team .footer_inView .menu-portfolio a:after, .page-portfolio .footer_inView .menu-news a:before, .page-portfolio .footer_inView .menu-news a:after, .page-news .footer_inView .menu-contact a:before, .page-news .footer_inView .menu-contact a:after, .single-post .footer_inView .menu-contact a:before, .single-post .footer_inView .menu-contact a:after {
    background: var(--grey-03);
    width: 100%;
}
:is(.page-news, .page-contact) .site-header:not(.page_scrolled) .menu li:hover a:before, :is(.page-news, .page-contact) .site-header:not(.page_scrolled) .menu li a:before, :is(.page-news, .page-contact) .site-header:not(.page_scrolled) .menu li:hover a:after, :is(.page-news, .page-contact) .site-header:not(.page_scrolled) .menu li a:after {
    background: var(--background-white);
}
.page-portfolio .site-header:not(.page_scrolled) .menu li:hover a:before, .page-portfolio .site-header:not(.page_scrolled) .menu li a:before, .page-portfolio .site-header:not(.page_scrolled) .menu li:hover a:after, .page-portfolio .site-header:not(.page_scrolled) .menu li a::after {
    background: var(--logo-blue);
}
body:not(.page-team) .site-header:not(.page_scrolled) .menu_white li a {
    color: var(--background-white);
}
body:not(.page-team) .site-header:not(.menu-open) .menu_white li a {
    border-color: var(--text-white)!important;
}
.page-portfolio .site-header:not(.page_scrolled) .menu li a {
    color: var(--logo-blue);
    border-color: var(--logo-blue);
}
.menu .current-menu-item a, .single-post .menu-news a{
    color: var(--blue-highlights);
    border: 1px solid var(--blue-highlights) !important;
    padding-top:0px;
    padding-bottom: 0px;
}
.page-portfolio .site-header:not(.page_scrolled) .current-menu-item a {
    border-color: var(--logo-blue) !important;
}
body:not(.page-team) .site-header:not(.page_scrolled) .menu_white .current-menu-item a {
    color: var(--light-blue-09) !important;
    border-color: var(--light-blue-09) !important;
}
:is(.page-news, .page-contact, .page-team, .single-post) .site-header.page_scrolled .menu .current-menu-item a {
    color: var(--blue-highlights) !important;
    border-color: var(--blue-highlights) !important;
}
.menu .current-menu-item a:before, .menu .current-menu-item a:after, .single-post .menu-news a:after, .single-post .menu-news a:before {
    content: unset;
}
.page-approach .menu-home a, .page-team .menu-approach a, .page-portfolio .menu-team a, .page-news .menu-portfolio a, .single-post .menu-portfolio a, .page-contact .menu-news a, .page-investor-login .menu-contact a {
    border-right: unset;
}
header {
    background-color: transparent;
}
  
header.page_scrolled, .page-team header {
    background-color: var(--light-blue-13);
}
header.page_scrolled:not(.menu-open)::after {
    content: "";
    border-bottom: 1px solid var(--grey-12);
    width: 100%;
    left: 0;
    right: 0;
    bottom: 0;
    position: absolute;
}
header {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    width: 100%;
    z-index: 999;
}
.page-team header {
    position: fixed;
}
.admin-bar header {
    top: 32px;
}
.menu-toggle {
    display: none;
}

/* Logo Styles starts */
.logo_wrapper {
    padding-left: clamp(55px, calc(3.4375rem + ((1vw - 19.2px) * 3.125)), 75px);
    padding-top: clamp(40px, calc(2.5rem + ((1vw - 19.2px) * 2.0313)), 53px);
}
.page_scrolled .logo_wrapper, .page-team .logo_wrapper {
    padding-top: 7.5px;
    padding-bottom: 7.5px;
    transition: padding-top 0.3s ease-in-out;
    display: flex;
}
.logo_wrapper img, .logo_wrapper svg{
    max-width: clamp(151px, calc(9.4375rem + ((1vw - 19.2px) * 7.6563)), 200px);
    width: 100%;
}
.page_scrolled .logo_wrapper img, .page-team .logo_wrapper img{
    max-width: clamp(84px, calc(5.25rem + ((1vw - 19.2px) * 4.375)), 112px);
}
.logo_wrapper .logo-link {
    display: flex;
    width: fit-content;
}
/* Logo Styles ends */
    .menu-invLogin {
        margin-left: auto;
        margin-right: 75px;
    }
    .menu-invLogin a{
        border-left: 1px solid var(--grey-03);
    }
@media (max-width: 1950px) {
    .logo_wrapper {
        padding-left: clamp(35px, calc(2.1875rem + ((1vw - 12.8px) * 3.125)), 55px);
        padding-top: clamp(35px, calc(2.1875rem + ((1vw - 12.8px) * 0.7813)), 40px);
        width: 32.3%;
    }
    .menu li a {
        font-size: clamp(13px, calc(0.8125rem + ((1vw - 12.8px) * 0.1563)), 14px);
        padding: 0px 19.7px;
    }
    .logo_wrapper img, .logo_wrapper svg{
        max-width: clamp(100px, calc(6.25rem + ((1vw - 12.8px) * 7.9688)), 151px);
    }
    .page_scrolled .logo_wrapper img, .page-team .logo_wrapper img {
        max-width: clamp(56px, calc(3.5rem + ((1vw - 12.8px) * 4.375)), 84px);
    }
    .main-navigation {
        width: 67.7%;
        padding-top: 0px;
    }
    .menu-invLogin {
        margin-right: 55px;
    }
    .page-team .header_element_wrap,  .page_scrolled .header_element_wrap{
        align-items: center;
    }
}

@media (max-width: 1600px) {
    .menu .current-menu-item a, .single-post .menu-news a {
        padding-bottom: 0px;
    }
    .menu li a:after {
        top: 0px;
    }
}
@media (max-width: 1450px) {
    .logo_wrapper {
        width: 25%;
    }
    .main-navigation {
        width: 75%;
    }
    .menu-invLogin {
        margin-right: 35px;
    }
}
@media (max-width: 1280px) {
    .logo_wrapper {
        padding-top: 35px;
        padding-left: clamp(30px, calc(1.875rem + ((1vw - 10.24px) * 1.9531)), 35px);
        
    }
    .logo_wrapper img, .logo_wrapper svg{
        max-width: clamp(100px, calc(6.25rem + ((1vw - 12.8px) * -7.8125)), 120px);
    }
    .page_scrolled .logo_wrapper img, .page-team .logo_wrapper img {
        max-width: 56px;
    }
    .page_scrolled .logo_wrapper, .page-team .logo_wrapper {
        padding-top: 5px;
        padding-bottom: 5px;
    }
    .main-navigation {
        padding-top: 0px;
    }
    .menu {
        margin-top: 9.5px;
        margin-bottom: 9.5px;
        padding-left: 35px;
    }
    .menu li a {
        padding: 0px 16px 0px 17px;
    }
    .page_scrolled .main-navigation {
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
}

@media (max-width: 1180px) {
    .header_element_wrap {
        flex-wrap: nowrap;
    }
    .page-team .header_element_wrap,  .page_scrolled .header_element_wrap{
        align-items: unset;
    }
    .page_scrolled .main-navigation {
        display: block;
    }
    .logo_wrapper {
        width: 19%;
    }
    .main-navigation {
        width: 81%;
    }
    .menu {
        padding-right: 21px;
        padding-left: 0px;
        justify-content: flex-end;
        margin-top: 20px;
    }
    .menu li a {
        font-size: 14px;
        padding: 0px clamp(17px, calc(1.0625rem + ((1vw - 9.81px) * 6.9767)), 20px);
    }
    .page_scrolled .logo_wrapper img, .page-team .logo_wrapper img {
        max-width: 84px;
    }
    .page_scrolled .logo_wrapper, .page-team .logo_wrapper {
        padding-top: 7.5px;
        padding-bottom: 7.5px;
    }
    .menu-invLogin {
        margin-left: unset;
        margin-right: 0px;
    }
    .menu-invLogin a{
        border-left: unset;
    }
}
@media (max-width: 1027px) {
    .logo_wrapper {
        width: 18%;
    }
    .main-navigation {
        width: 82%;
    }
    .logo_wrapper img, .logo_wrapper svg, .popup_menu_logo img{
        max-width: clamp(100px, calc(7.5rem + ((1vw - 10.24px) * 7.8125)), 120px);
    }
}
@media (min-width: 981px){
 .popup_menu_logo{
    display: none;
 }
    .menu-primary-menu-container {
        display: block !important;
    }
        /* For menu on scrolling   */
         header.header-off {
           position: absolute
         }
         @keyframes slideIn {
           from {
             transform: translateY(-100%);
             opacity: 0;
           }
           to {
             transform: translateY(0);
             opacity: 1;
           }
         }
         
         header.hero_scrolled {
           animation: slideIn 0.5s ease-out forwards;
           opacity: 1; 
           position: fixed;
         }    
}

@media (max-width: 980px) {
    header {
        position: fixed;
        transition: background-color 0.1s ease-in;
    }
    
    .logo_wrapper img, .logo_wrapper svg, .popup_menu_logo img {
        transition: max-width 0.1s ease-in; 
    }
    
    .logo_wrapper, .page_scrolled .logo_wrapper, .page-team .logo_wrapper {
        transition: padding-top 0.1s ease-in;
    }
    
    .page_scrolled .logo_wrapper img, .page-team .logo_wrapper img, .page_scrolled .popup_menu_logo img, .page-team .popup_menu_logo img{
        max-width: 84px;
    }
    .menu-toggle {
        display: block;
        float: right;
        -webkit-tap-highlight-color: transparent;
    }
    .menu-primary-menu-container, .menu_close_icon{
        display: none;
    }
    .menu li a:before, .menu li a:after {
        content: unset;
    }
    :is(.page-news, .page-contact) .site-header:not(.page_scrolled) .menu-icons circle {
        fill: var(--background-white);
    }
    .logo_wrapper, .popup_menu_logo, .page-team .popup_menu_logo {
        padding-left: clamp(20px, calc(1.25rem + ((1vw - 3.9px) * 2.8249)), 30px);
        padding-top: clamp(20px, calc(1.25rem + ((1vw - 3.9px) * 2.8249)), 30px);
    }
    .page_scrolled .popup_menu_logo, .page-team .popup_menu_logo {
        padding-top: 7.5px !important;
    }
    .logo_wrapper .logo-link {
        display: block;
    }
    .menu-toggle {
        background-color: unset;
        border: unset;
        outline: 0;
        cursor: pointer;
        padding: 20.5px 29px 10.5px 20px;
        position: relative;
        z-index: 99;
    }
    .main-navigation.toggled .menu-toggle {
        padding-right: 39px;
    }
    .logo_wrapper {
        width: 30%;
    }
    .main-navigation {
        padding-top: 0px;
        width: 70%;
    }
    .page_scrolled .logo_wrapper, .page-team .logo_wrapper {
        padding-top: 7.5px;
        padding-bottom: 7.5px;
    }
    .menu-primary-menu-container {
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        right: 0;
    }
    .menu {
        display: block;
        margin-top: 10px;
        position: relative;
        padding: 3px 0px 0px;
        padding-bottom: clamp(10px, calc(0.625rem + ((1vw - 3.9px) * 17.1958)), 75px); 
    }
    .menu li {
        margin-bottom: clamp(16px, calc(1rem + ((1vw - 3.9px) * 2.381)), 25px);
        margin-left: clamp(367px, calc(22.9375rem + ((1vw - 7.68px) * 25)), 420px);
    }
    .menu .menu-home {
        margin-top: 37px;
    }
    .menu li a {
        border-right: unset;
        padding: 2px 20px !important;
        display: inline;
        text-transform: capitalize;
        font-family: var(--baskervville);
        font-weight: 400;
        font-size: 22px;
        color: var(--grey-03) !important;
        border-left: 1px solid;
        border-bottom: 1px solid;
    }
    .menu .current-menu-item a, .site-header:not(.page_scrolled) .menu_white .current-menu-item a, .page-portfolio .site-header:not(.page_scrolled) .current-menu-item a, .single-post .menu-news a, body:not(.page-team) .site-header:not(.page_scrolled) .menu_white .current-menu-item a {
        color: var(--blue-highlights) !important;
        border-color: var(--blue-highlights) !important;
    }
    .menu .current-menu-item span {
        border-left: unset;
        border-bottom: unset;
    }
    .menu-primary-menu-container ul li::before {
        content: "";
        position: absolute;
        max-width: clamp(248px, calc(15.5rem + ((1vw - 7.68px) * 24.5283)), 300px) !important;
        width: 100%;
        height: clamp(187px, calc(11.6875rem + ((1vw - 7.68px) * 13.2075)), 215px);
        left: clamp(20px, calc(1.25rem + ((1vw - 3.9px) * 10.7345)), 58px);
        top: 37px;
        background-size: cover;
    }
    .home .menu-primary-menu-container .menu-home::before {
        background-image: url(/wp-content/uploads/2024/06/PGZIV___FFL___All_Pages_Hamburger_Menu___Home___Tablet___xILE___2024-06-21.webp);
    }
   .page-approach .menu-primary-menu-container .menu-approach::before {
        background-image: url(/wp-content/uploads/2024/06/20RMQ___FFL___All_Pages_Hamburger_Menu___Approach___Tablet___xILE___2024-06-21.webp);
        top: 92px;
    }
    .page-team .menu-primary-menu-container .menu-team::before {
        background-image: url(/wp-content/uploads/2024/08/73XQR___FFL___All_Pages_Hamburger_Menu___Team___Tablet___246x200___ILE___2024-08-12.webp);
        top: 105px;
    }
    .page-portfolio .menu-primary-menu-container .menu-portfolio::before {
        background-image: url(/wp-content/uploads/2024/06/9DA0I___FFL___All_Pages_Hamburger_Menu___Portfolio___Tablet___xILE___2024-06-21.webp);
        top: 111px;
    }
    :is(.page-news, .single-post) .menu-primary-menu-container .menu-news::before {
        background-image: url(/wp-content/uploads/2024/06/HQY0O___FFL___All_Pages_Hamburger_Menu___News___Tablet___xILE___2024-06-21.webp);
        top: 112px
    }
    .page-contact .menu-primary-menu-container .menu-contact::before {
        background-image: url(/wp-content/uploads/2024/06/K0AAJ___FFL___All_Pages_Hamburger_Menu___Contact___Tablet___xILE___2024-06-21.webp);
        top: 122px;
    }
    .page-investor-login .menu-primary-menu-container .menu-invLogin::before {
        background-image: url(/wp-content/uploads/2024/06/XG91A___FFL___All_Pages_Hamburger_Menu___Investor_Login___Tablet___xILE___2024-06-21.webp);
        top: 178px;
    }
    .main-navigation.toggled {
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        width: 100%;
        min-height: clamp(560px, calc(35rem + ((1vw - 7.69px) * 15.6398)), 593px);
    }
    .home .main-navigation.toggled {
        min-height: clamp(525px, calc(32.8125rem + ((1vw - 7.69px) * 23.2227)), 574px);
    }


/* Hide the menu by default */
.menu-primary-menu-container {
    background-color: var(--light-blue-13);
    display: block;
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transition: max-height 0.3s ease, opacity 0.3s ease;
}
.menu-primary-menu-container {
    position: fixed;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
}
/* When the menu is open, make it visible and slide it down */
.menu-primary-menu-container.open {
    opacity: 1;
    max-height: 600px;
    overflow-y: auto;
}
.page_scrolled .logo_wrapper img.visible-logo{
    visibility:hidden;
}


} 

@media all and (max-width: 980px) and (pointer: coarse) and (hover: none) {
    .main-navigation.toggled .menu-toggle {
        padding-right: 22px;
    }
}

@media (max-width: 768px) {
    .menu-primary-menu-container ul li::before {
        max-width: clamp(150px, calc(9.375rem + ((1vw - 3.9px) * 27.6836)), 248px) !important;
        height: clamp(122px, calc(7.625rem + ((1vw - 3.9px) * 18.3616)), 187px);
    }
    .menu li {
        margin-left: clamp(195px, calc(12.1875rem + ((1vw - 3.9px) * 48.5876)), 367px);
    }
    .page-portfolio .menu-primary-menu-container .menu-portfolio::before {
        top: 122px;
    }
    :is(.page-news, .single-post) .menu-primary-menu-container .menu-news::before {
        top: 129px;
    }
    .page-contact .menu-primary-menu-container .menu-contact::before {
        top: 147px;
    }
    .page-investor-login .menu-primary-menu-container .menu-invLogin::before {
        top: 205px;
    }
    .main-navigation.toggled {
        min-height: clamp(512px, calc(32rem + ((1vw - 6.81px) * 55.1724)), 560px);
    }
    .home .main-navigation.toggled {
            min-height: clamp(512px, calc(32rem + ((1vw - 6.81px) * 75.8621)), 578px);
    }
    .menu-primary-menu-container.open {
        max-height: 611px;
    }
}

@media (max-width: 680px) {
    .logo_wrapper img, .logo_wrapper svg, .popup_menu_logo img {
        max-width: 84px;
    }
    .page_scrolled .logo_wrapper img, .page-team .logo_wrapper img, .page_scrolled .popup_menu_logo img, .page-team .popup_menu_logo img{
        max-width: 65px;
    }
    .page_scrolled .logo_wrapper, .page-team .logo_wrapper, .page_scrolled .popup_menu_logo, .page-team .popup_menu_logo {
        padding-top: 12.5px !important;
        padding-bottom: 12px;
    }
    .main-navigation.toggled {
        min-height: clamp(470px, calc(29.375rem + ((1vw - 5px) * 23.3333)), 512px);
    }
}


@media (max-width: 499px) {
    .menu li a {
        font-size: 18px;
        padding: 1px 10px !important;
    }
    .home .menu-primary-menu-container .menu-home::before {
        top: 13px;
    }
    .page-approach .menu-primary-menu-container .menu-approach::before {
        top: 67px;
    }
    .page-portfolio .menu-primary-menu-container .menu-portfolio::before, :is(.page-news, .single-post) .menu-primary-menu-container .menu-news::before, .page-contact .menu-primary-menu-container .menu-contact::before {
        top: 100px;
    }
    .page-investor-login .menu-primary-menu-container .menu-invLogin::before{
        top: 184px;
    }
    .menu .menu-home {
        margin-top: 11px;
    }
    .main-navigation.toggled {
        min-height: clamp(363px, calc(35.3125rem + ((1vw - 7.68px) * 75.3731)), 565px);
    }
    .main-navigation.toggled {
        min-height: clamp(400px, calc(25rem + ((1vw - 3.9px) * 11.0092)), 412px);
    }
    .home .main-navigation.toggled {
            height: clamp(327.91px, calc(31.958125rem + ((1vw - 4.99px) * 102.4693)), 511.33px);
            min-height: 367px;
    }
    .menu .current-menu-item a, .site-header:not(.page_scrolled) .menu_white .current-menu-item a, .page-portfolio .site-header:not(.page_scrolled) .current-menu-item a, .single-post .menu-news a, body:not(.page-team) .site-header:not(.page_scrolled) .menu_white .current-menu-item a, .menu .current-menu-item a, .single-post .menu-news a, :is(.page-news, .page-contact, .page-team, .single-post) .site-header.page_scrolled .menu .current-menu-item a {
        color: var(--blue-highlights-v2) !important;
        border-color: var(--blue-highlights-v2) !important;
    }
    .menu-primary-menu-container.open {
        max-height: clamp(470px, calc(32rem + ((1vw - 4.99px) * 38.5321)), 512px);
    }
}

@media (max-width: 375px) {
    .menu li a {
        font-size: 17px;
        padding: 1px 8px !important;
    }
    .menu li {
        margin-left: 150px;
    }
    .menu-primary-menu-container ul li::before {
        max-width: 115px !important;
        height: 92px;
    }
}
