/*Header*/
.headerWrap{position: fixed;top: 0;left: 0;width: 100%;z-index: 999;color: var(--yellow);background: linear-gradient(to bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%);transition: transform 0.45s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.45s cubic-bezier(0.4, 0, 0.2, 1);}
.headerWrap.hidden-at-footer{transform: translateY(-110%);opacity: 0;pointer-events: none;}
.headerWrap > .container{width:100%}
.headerWrap.careerHeader{background: none;}
.headerSec{display:flex;justify-content:space-between;padding: 35px 0 0;height: 135px;}
.headerWrap.scrolled{background: rgba(21, 20, 18, 0.95); transition: background 0.3s ease, transform 0.45s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.45s cubic-bezier(0.4, 0, 0.2, 1);}
.headerWrap.scrolled .headerSec{padding: 10px 0;height: 90px;}
.headerNavLinks{display: flex;justify-content: center;align-items: center;width: 100%;transition: justify-content 0.3s ease;}
.navLinksList{display:flex;gap:40px;transition:gap .3s ease;height: 100px;}
.headerWrap.scrolled .headerNavLinks{justify-content: center;}
.headerWrap.scrolled .headerNavLinks .navLinksList{gap:30px;height: 70px;}
.navLinksList > li{display: block;}
.navLinksList > li > a{font-size: 20px;line-height: 1em;}
.headerLogoSec{position: relative;}
img.headerLogoImg{max-width: 100px;position: relative;top: -25px;transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);}
.headerWrap.scrolled img.headerLogoImg{transform:scale(0.75);top:-40px;}
.hamburger{display:flex;gap:17.5px;cursor:pointer;height: max-content;width: 120px;height: 39px;padding: 12px 20px;border-radius: 20px;background: #282828;position: absolute;right: 60px;border: 1px solid #373737;align-items: center;transition: all 0.3s ease;}
.hamburger > span{font-size: 13px;line-height: 1em;font-weight: 500;font-weight:600;color:var(--yellow);font-family: var(--inter24ptSemiBold);display: block;}

/* Menu Items Styles - Hidden by default globally */
.navLinksList li.headerMenuItem { display: none; }
.headerMenuItem a { color: var(--yellow); text-decoration: none; font-weight: 500; font-size: 16px; transition: color 0.3s; }
.headerMenuItem a:hover { color: #fff; }

@media screen and (min-width: 768px) {
.headerWrap .headerNavLinks{justify-content:flex-start}
.headerWrap .navLinksList{width:100%;justify-content:flex-start;align-items:center}
.headerWrap .headerLogoSec{margin-left:calc(50% - 50px);margin-right:auto;transition:all .5s cubic-bezier(0.25,0.46,0.45,0.94)}
.headerWrap.staticHeaderWrap .headerLogoSec{margin-left:0;transition:all .5s cubic-bezier(0.25,0.46,0.45,0.94)}
.headerWrap.staticHeaderWrap .hamburger{left: unset;right: 60px;}
.staticMobileSidebar .sidebarContent{left: unset; right: 0px; transform: translateX(100%); }
.staticMobileSidebar .sidebarContent .hamburger{left: unset; right: 60px;position: absolute;}
.headerWrap.scrolled .headerLogoSec{margin-left:0;margin-right:auto}
.headerWrap.scrolled img.headerLogoImg{transform-origin:left center;top:0;max-width: 80px;}
.headerWrap.scrolled .hamburger{opacity:0;pointer-events:none;visibility:hidden;transition:all .3s ease}
.navLinksList li.headerMenuItem{display:block;max-width:0;opacity:0;overflow:hidden;margin:0;transform:translateY(-20px);transition:all .5s ease}
.headerWrap.scrolled .navLinksList li.headerMenuItem{max-width:150px;opacity:1;transform:translateY(0)}
.headerWrap.scrolled .navLinksList{gap:0}
}

.talkWithUsSec{width: 38px;position: relative;transition:all .3s ease;cursor: pointer;}
.talkWithUsSec span{font-size: 18px;line-height: 1.2em;font-weight:500;text-align: right;display: block;transition:all .3s ease}
.talkWithUsIcon{position: absolute;bottom: 40px;left: -15px;}
.headerWrap.scrolled .talkWithUsSec span{font-size: 16px;line-height: 1.3em;}
.headerWrap.scrolled .talkWithUsIcon{position: absolute;bottom: 10px;left: -15px;}

/* Mobile Sidebar */
.mobileSidebar{position:fixed;top:0;left:0;width:100%;height:100vh;z-index:9999;opacity:0;visibility:hidden;transition:all 0.5s cubic-bezier(0.33, 1, 0.68, 1);}
.mobileSidebar.active{opacity:1;visibility:visible}
.sidebarOverlay{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.6);backdrop-filter:blur(8px);opacity: 0;transition: opacity 0.5s ease;}
.sidebarContent{position:absolute;top:0;right:0;width:350px;max-width:85vw;height:100vh;background:rgba(21, 20, 18, 0.95);color:var(--yellow);transform:translateX(-100%);transition:transform 0.6s cubic-bezier(0.22, 1, 0.36, 1);display:flex;flex-direction:column;padding: 37px 60px;box-shadow: 10px 0 30px rgba(0,0,0,0.5);transform: translateX(100%);}
.mobileSidebar.active .sidebarContent{transform:translateX(0)}
.sidebarHeader{display:flex;justify-content:flex-end;padding:20px 20px 15px;}
.closeSidebar{background:none;border:none;cursor:pointer;display:flex;flex-direction:column;gap:6px;padding:10px}
.closeSidebar span{display:block;width:20px;height:2px;background:#000;transition:all .3s ease}
.closeSidebar span:nth-child(1){transform:rotate(45deg) translate(5px,-0px)}
.closeSidebar span:nth-child(2){transform:rotate(-45deg) translate(5px,0px)}
.sidebarNavList{list-style:none;padding:60px 0;margin:0;}
.sidebarNavList li {transform: translateX(50px);opacity: 0;transition: all 0.5s ease;}
.mobileSidebar.active .sidebarNavList li {transform: translateX(0);opacity: 1;}
/* Stagger delays */
.mobileSidebar.active .sidebarNavList li:nth-child(1) { transition-delay: 0.1s; }
.mobileSidebar.active .sidebarNavList li:nth-child(2) { transition-delay: 0.15s; }
.mobileSidebar.active .sidebarNavList li:nth-child(3) { transition-delay: 0.2s; }
.mobileSidebar.active .sidebarNavList li:nth-child(4) { transition-delay: 0.25s; }
.mobileSidebar.active .sidebarNavList li:nth-child(5) { transition-delay: 0.3s; }
.mobileSidebar.active .sidebarNavList li:nth-child(6) { transition-delay: 0.35s; }
.mobileSidebar.active .sidebarNavList li:nth-child(7) { transition-delay: 0.4s; }

.sidebarNavList a{color:var(--yellow);text-decoration:none;font-size:18px;line-height: 1em;transition:color .3s ease;display:block;padding:0 0 30px;}
/* .sidebarNavList a:hover{text-shadow: 0 0 10px rgba(235, 158, 1, 0.6);} */
.sidebarNavList a:hover{color: #fff;}
.sidebarNavList li:last-child a{padding: 0;}
.sidebarContent .hamburger{position: absolute; margin-bottom: 20px;right: 60px;left: unset;}
.sidebarContactInfo{border-bottom: 1px solid var(--yellow);padding: 60px 0;}
.sidebarContactInfo > a{color: var(--yellow);text-decoration: none;font-size: 20px;line-height: 1em; transition: color .3s ease;display: block;padding: 0 0 15px; transform: translateX(50px); opacity: 0; transition: all 0.5s ease, color .3s ease;}
.mobileSidebar.active .sidebarContactInfo > a{transform: translateX(0); opacity: 1;}
.mobileSidebar.active .sidebarContactInfo > a:nth-child(1) { transition-delay: 0.4s; }
.mobileSidebar.active .sidebarContactInfo > a:nth-child(2) { transition-delay: 0.45s; }

.sidebarContactInfo > a:hover{text-shadow: 0 0 2px currentColor;}
.sidebarContactInfo>a.emailLink{padding: 0;}
.sidebarAddress{padding: 60px 0 0;}
.sidebarAddress > p{font-size: 20px;line-height: 1.8em;padding: 0; transform: translateX(50px); opacity: 0; transition: all 0.5s ease;}
.mobileSidebar.active .sidebarAddress > p{transform: translateX(0); opacity: 1;}
.mobileSidebar.active .sidebarAddress > p:nth-child(1) { transition-delay: 0.5s; }
.mobileSidebar.active .sidebarAddress > p:nth-child(2) { transition-delay: 0.55s; }
.mobileSidebar.active .sidebarAddress > p:nth-child(3) { transition-delay: 0.6s; }


/*WhatsApp Button*/
.whatsappBtnWrap{position: fixed;bottom: 100px;right: 15px;z-index: 1000;border-radius: 50%;}
.whatsappBtn{display: inline-block;width: 38px;height: 38px;display: flex;align-items: center;justify-content: center;transition: all 0.3s ease;}
.whatsappBtn:hover{transform: scale(1.1);}
.whatsappBtn img{width: 38px;height: 38px;}


@media screen and (min-width: 1800px) {

}

@media screen and (min-width: 1600px) {
    .navLinksList{gap:90px;}
}

@media screen and (min-width: 1440px) {

    .navLinksList{gap:60px;}
    .headerWrap.scrolled .headerNavLinks .navLinksList{gap:30px;}
    .headerWrap.scrolled img.headerLogoImg {max-width: 100px;}
}

@media screen and (min-width: 1300px) {}

@media screen and (max-width: 1200px) {

    .navLinksList > li > a{font-size: 18px;}
    .talkWithUsSec span{font-size: 16px;}
    

}

@media screen and (max-width: 1024px) {

    .hamburger.active span:nth-child(1) {transform: rotate(45deg) translate(5px, 5px);}    
    .hamburger.active span:nth-child(3) { transform: rotate(-45deg) translate(7px, -6px);}
    .talkWithUsSec{width: 120px;display: flex;align-items: center;justify-content: center;position: relative;}
    .headerWrap.scrolled .headerSec{height: 80px;}
    .talkWithUsIcon{bottom: 5px;left: -18px;}
    .headerWrap.scrolled .headerLogo > img{top:-20px;max-width: 90px;}

}


@media only screen and (max-width: 991px) {

    .whatsappBtnWrap{right: 25px;}
    .hamburger {left: 25px;}
    .sidebarNavList{padding: 40px 0;}
    .sidebarNavList a{padding: 0 0 25px;}
    .sidebarContent .hamburger{margin-bottom: 0;}
    .sidebarContactInfo{padding: 40px 0;}
    .sidebarAddress{padding: 40px 0 0;}
    .sidebarContent{font-size: 385px;padding: 30px;}
    .headerWrap.scrolled .headerNavLinks .navLinksList{gap: 20px;}
   
}

@media only screen and (max-width: 767px) {  

    .whatsappBtnWrap{right: 15px;}
    .headerWrap.scrolled .talkWithUsSec span{font-size: 14px;}
    .headerWrap.scrolled .headerSec {padding: 5px 0;height: 65px; }
    .hamburger{gap: 7px;left: unset;right: 15px;top: 13px;}
    .headerWrap.scrolled .talkWithUsIcon{width: 18px;height: 18px;left: 0px;bottom: 25px;}
    .talkWithUsSec{align-items: flex-start;}
    .sidebarContent{width: 300px;max-width: 85vw;}
    .headerWrap.scrolled img.headerLogoImg{top: 0px;max-width: 70px;padding: 0;}
    .headerWrap.scrolled .headerNavLinks{justify-content: flex-start;}
    .sidebarContent{left: unset;right: 0px; transform: translateX(100%);}
    .sidebarContent .hamburger{position: absolute;right: 15px;}

}

@media only screen and (max-width: 479px) {

    img.headerLogoImg{max-width: 100px;}
    .sidebarHeader{padding: 20px 20px 5px;}
    .sidebarNavList a{font-size: 16px;}
    .sidebarNavList li{margin-bottom: 0;}
    .hamburger{width: max-content;padding: 8px 16px;height: 35px;}
    .hamburger > img{max-width: 15px;}
    .hamburger > span{font-size: 12px;}
    .headerWrap.scrolled .hamburger span{width: auto;}
    .sidebarContactInfo>a{font-size: 16px;}
    .sidebarAddress>p{font-size: 16px;}
    .sidebarContactInfo{padding: 30px 0;}
    .sidebarAddress{padding: 30px 0 0;}    
    .sidebarContent{padding: 25px;}
}

@media only screen and (max-width: 320px) {
}
