:root{--navigation-height:112px;scroll-padding-top:calc(var(--navigation-height) + 20px)}
body.inner-page{--navigation-height:100px}
.navigation-spacer{height:var(--navigation-height)}
.sticky-navigation{position:fixed;inset:0 0 auto;z-index:1000;color:white;background:transparent;transition:background .25s,box-shadow .25s}
.sticky-navigation.is-scrolled,.inner-page .sticky-navigation,.sticky-navigation:has(.menu-toggle[aria-expanded=true]){background:#090d12f5;box-shadow:0 1px 0 #ffffff1f,0 8px 26px #0002;backdrop-filter:blur(16px)}
.sticky-navigation .header{height:var(--navigation-height);position:relative}
.sticky-navigation .mobile-nav:not([hidden]){position:absolute;top:calc(var(--navigation-height) - 1px);max-height:calc(100dvh - var(--navigation-height) - 16px);overflow-y:auto;overscroll-behavior:contain;background:#11171c;z-index:1001}
.sticky-navigation .header .service-menu{max-height:calc(100dvh - var(--navigation-height) - 20px);overflow-y:auto}
@media(max-width:1024px){:root,body.inner-page{--navigation-height:90px}}
@media(prefers-reduced-motion:reduce){.sticky-navigation{transition:none}}

/* Keep the full brand and switch to the drawer before the desktop links crowd. */
.header .brand picture{display:block}
.header .brand{flex-shrink:0}
.header nav>a,.header nav>details>summary,.header .header-cta{white-space:nowrap}
.header .header-cta{flex-shrink:0}
@media(min-width:1025px) and (max-width:1279px){
 .sticky-navigation .header{gap:22px}
 .header .brand img{width:175px;height:auto}
 .header nav{gap:20px}
 .header .header-cta{gap:18px;padding-inline:20px}
}
@media(max-width:1024px){
 .header .brand{flex:0 0 auto}
 .header .brand img{width:175px;height:auto}
 .sticky-navigation .header nav,.sticky-navigation .header .header-cta{display:none}
 .header .menu-toggle{display:flex;flex:0 0 44px;flex-direction:column;gap:7px;align-items:center;justify-content:center;width:44px;height:44px;background:transparent;color:white;border:1px solid #ffffff50;border-radius:4px}
 .header .menu-toggle span{width:20px;height:1px;background:currentColor;transition:transform .3s}
 .header .menu-toggle[aria-expanded=true] span:first-child{transform:translateY(4px) rotate(45deg)}
 .header .menu-toggle[aria-expanded=true] span:last-child{transform:translateY(-4px) rotate(-45deg)}
}

/* The hamburger opens a full-height drawer, with a scrolling link area and a
   persistent project button. Main links use the site's heading typeface. */
body.mobile-navigation-open{overflow:hidden;overscroll-behavior:none}
@media(max-width:1024px){
 .sticky-navigation .mobile-nav:not([hidden]){display:flex;flex-direction:column;position:absolute;top:var(--navigation-height);left:0;right:0;width:100%;height:calc(100vh - var(--navigation-height));height:calc(100dvh - var(--navigation-height));max-height:none;padding:0;gap:0;overflow:hidden;background:#10161b;border:0;border-top:1px solid #ffffff17;box-shadow:none}
 .mobile-menu-content{flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;padding:14px 6% 22px;scrollbar-width:thin;scrollbar-color:#536674 transparent}
 .sticky-navigation .mobile-menu-content>a,.sticky-navigation .mobile-menu-content>.nav-services>summary{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:13px 0;color:#f4f6f7;font:400 clamp(42px,10.5vw,60px)/1.08 var(--serif);letter-spacing:-.5px;text-decoration:none}
 .mobile-menu-content>a,.mobile-menu-content>.nav-services{border-bottom:1px solid #ffffff20}
 .mobile-menu-content>.nav-services{flex:none}
 .sticky-navigation .mobile-menu-content>a[aria-current=page],.sticky-navigation .mobile-menu-content>.nav-services.is-current>summary{color:#b8dcf3}
 .sticky-navigation .mobile-menu-content .nav-chevron{width:22px;height:22px;flex:0 0 22px;color:#93b9d2}
 .sticky-navigation .mobile-menu-content .nav-chevron svg{width:18px;height:18px}
 .sticky-navigation .mobile-menu-content .service-menu{position:static;transform:none;max-height:none;width:auto;margin:0;padding:0 0 14px;border:0;border-radius:0;box-shadow:none;background:transparent;overflow:visible}
 .sticky-navigation .mobile-menu-content .service-menu a{display:grid;grid-template-columns:22px minmax(0,1fr) 24px;align-items:center;gap:10px;padding:12px 4px;color:#ced9e0;font:400 clamp(26px,6.8vw,36px)/1.15 var(--serif);letter-spacing:0;border-radius:3px}
 .sticky-navigation .mobile-menu-content .service-menu a>span{font:400 10px/1.5 var(--sans);letter-spacing:1px;color:#83aec9}
 .sticky-navigation .mobile-menu-content .service-menu a>b{float:none;display:flex;align-items:center;justify-content:center;color:#9abed5}
 .sticky-navigation .mobile-menu-content .service-menu .arrow-icon{width:19px;height:19px}
 .sticky-navigation .mobile-menu-content .service-menu a[aria-current=page]{background:#ffffff0b;color:#c9e9ff}
 .mobile-menu-footer{flex:0 0 auto;padding:18px 6% max(18px,env(safe-area-inset-bottom));border-top:1px solid #ffffff20;background:#10161b;box-shadow:0 -12px 24px #10161b70}
 .sticky-navigation .mobile-nav .mobile-project-cta{display:flex;justify-content:space-between;gap:20px;width:100%;min-height:66px;padding:17px 22px;border:1px solid #d0e8f7;border-radius:5px;background:#e7f3fb;color:#112331;box-shadow:none;font:500 18px/1.2 var(--sans);letter-spacing:0}
 .sticky-navigation .mobile-nav .mobile-project-cta .cta-arrow{display:flex;align-items:center;justify-content:center;margin:0;color:inherit}
 .sticky-navigation .mobile-nav .mobile-project-cta .arrow-icon{width:27px;height:27px}
 .sticky-navigation .mobile-nav .mobile-project-cta:hover{background:#fff;transform:none}
 .sticky-navigation .mobile-nav a:focus-visible,.sticky-navigation .mobile-nav summary:focus-visible{outline:2px solid #b8dcf3;outline-offset:4px}
 .sticky-navigation .mobile-nav .mobile-project-cta:focus-visible{outline-offset:5px}
}
