/* Header only. The landing content and its original styles are preserved. */
#main-nav{
    inset:18px auto auto 50%;
    transform:translateX(-50%);
    width:min(1240px,calc(100% - 64px));
    margin:0;
    padding:0;
    border:1px solid #ffffff24;
    border-radius:24px;
    background:#121b26e8;
    color:#fff;
    box-shadow:0 8px 32px #07101a15;
    backdrop-filter:blur(20px);
    -webkit-backdrop-filter:blur(20px);
    transition:background .2s,border-color .2s,box-shadow .2s;
}
#main-nav.is-scrolled,#main-nav:has(.menu-toggle[aria-expanded=true]){
    background:#17202bf5;
    color:#fff;
    border-color:#ffffff1a;
    box-shadow:0 8px 30px #07101a24;
}
#main-nav .header-inner{
    width:100%;height:72px;margin:0;padding:0 17px 0 22px;
    border:0;gap:22px;
}
#main-nav .wordmark{font-size:23px;letter-spacing:0;font-weight:650;gap:10px;color:#fff}
#main-nav .wordmark em{color:#b9c6e7}
#main-nav .brand-mark{width:32px;height:32px;border-radius:10px;background:#3555ed}
#main-nav .brand-mark .icon{font-size:17px;width:20px;height:20px}
#main-nav .nav-links{gap:3px;color:#b8c0cd;font-size:12px}
#main-nav .nav-links a{
    display:inline-flex;align-items:center;justify-content:center;
    min-height:42px;padding:11px 15px;border-radius:14px;white-space:nowrap;
    transition:color .15s,background .15s;
}
#main-nav .nav-links a:hover{color:#fff;background:#ffffff0d}
#main-nav .nav-links a[aria-current]{color:#19212c;background:#fff}
#main-nav .nav-links a[aria-current]::after{display:none}
#main-nav .header-actions{gap:10px;flex:none}
#main-nav .header-contact{
    min-height:42px;padding:11px 15px;gap:10px;border:1px solid #ffffff26;
    border-radius:14px;background:transparent;color:#e2e7ee;font-size:12px;
}
#main-nav .header-contact:hover{background:#ffffff12;color:#fff}
#main-nav .header-contact .icon{font-size:12px;width:14px;height:14px}
#main-nav .account-btn{
    width:auto;height:42px;min-width:42px;gap:9px;padding:0 15px;
    border:0;border-radius:14px;background:#edf0f5;color:#19212c;
    font-size:12px;font-weight:500;
}
#main-nav .account-btn:hover{background:#fff;color:#19212c}
#main-nav .account-btn .icon{width:17px;height:17px;font-size:16px}
#main-nav .menu-toggle{background:#ffffff0d;color:white;border:1px solid #ffffff24;border-radius:14px}
#main-nav .menu-toggle:hover{background:#ffffff19;color:white}
#main-nav :focus-visible{outline:2px solid #b7c7ff;outline-offset:3px}
#main-nav .mobile-menu{width:100%;margin:0}
#main-nav .mobile-menu:not([hidden]){padding:4px 12px 12px;max-height:calc(100dvh - 116px);overflow-y:auto;overscroll-behavior:contain}
#main-nav .mobile-menu a,#main-nav .mobile-menu button{
    min-height:57px;padding:16px 15px;border:0;border-radius:14px;
    background:transparent;color:#e4e9f1;font-size:15px;text-align:left;
}
#main-nav .mobile-menu a:hover,#main-nav .mobile-menu button:hover{background:#ffffff0d;color:white}
#main-nav .mobile-menu .icon{color:#9ba9bf;font-size:14px;width:17px;height:17px}
#main-nav .mobile-menu button{background:#ffffff0d;margin-top:6px;color:#fff}
#menu-backdrop{background:#08101a70;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
@media(max-width:1150px){
    #main-nav .header-inner{gap:15px;padding-left:18px;padding-right:14px}
    #main-nav .nav-links a{padding-inline:12px}
    #main-nav .header-contact{display:none}
}
@media(max-width:900px){
    #main-nav{top:14px;width:calc(100% - 40px);border-radius:22px}
    #main-nav .header-inner{height:66px;padding:0 13px 0 18px;gap:16px}
    #main-nav .nav-links{display:none}
    #main-nav .menu-toggle{display:inline-flex;height:42px;width:42px}
    #main-nav .mobile-menu:not([hidden]){display:grid}
    #main-nav .header-actions{gap:8px}
}
@media(max-width:680px){
    #main-nav{top:calc(12px + env(safe-area-inset-top));width:calc(100% - 24px);border-radius:21px}
    #main-nav .header-inner{height:64px;padding:0 10px 0 15px;gap:12px}
    #main-nav .wordmark{font-size:21px;gap:8px;letter-spacing:0}
    #main-nav .brand-mark{width:29px;height:29px;border-radius:9px}
    #main-nav .brand-mark .icon{font-size:16px;width:18px;height:18px}
    #main-nav .account-btn{width:42px;height:42px;padding:0}
    #main-nav .account-label{display:none}
    #main-nav .mobile-menu:not([hidden]){max-height:calc(100dvh - 106px - env(safe-area-inset-top));padding:3px 10px 10px}
}
@media(max-width:359px){
    #main-nav .header-inner{gap:8px;padding-left:12px;padding-right:9px}
    #main-nav .wordmark{font-size:19px;gap:7px}
    #main-nav .header-actions{gap:6px}
    #main-nav .account-btn,#main-nav .menu-toggle{width:40px;height:40px;min-width:40px}
}