/* One viewport-wide sticky shell across every portfolio route. Content widths stay unchanged. */
body>header.portfolio-header{--paper:#fff;--ink:#190615;--muted:#6a5866;--line:#C8D3DF;box-sizing:border-box;position:sticky;top:12px;z-index:50;display:flex;align-items:center;flex-wrap:nowrap;gap:15px;width:min(94vw,1800px);max-width:none;margin-left:calc((100% - min(94vw,1800px))/2);margin-right:calc((100% - min(94vw,1800px))/2);padding:6px 13px;background:#fff;border:0;border-radius:12px 12px 4px 4px;font:400 14px/20px var(--font);color:#190615!important}
body>header.portfolio-header :is(a,summary,button){font-family:var(--font);font-size:14px;line-height:20px;font-weight:400;letter-spacing:normal;color:#190615!important}
body>header.portfolio-header .name{background:transparent;font-size:14px;white-space:nowrap;padding:8px 10px;border-radius:6px}
body>header.portfolio-header .capability-menu{display:block;margin:0}
body>header.portfolio-header .capability-menu summary{padding:8px 10px;border-radius:6px;white-space:nowrap}
body>header.portfolio-header .capability-panel{background:#fff;color:#190615}
body>header.portfolio-header>nav{position:static;display:flex;align-items:center;gap:22px;margin-left:auto;padding:0;background:transparent;font-size:14px}
body>header.portfolio-header>nav a{padding:8px 10px;border-radius:6px;white-space:nowrap}
body>header.portfolio-header .menu{display:none;padding:8px 10px;border:0;border-radius:6px;background:transparent;margin-left:auto;cursor:pointer}
body>header.portfolio-header :is(nav a,.name,.menu,.capability-menu summary):is(:hover,:focus-visible){background:#190615;color:#EEF4F9!important;opacity:1}
@media(max-width:1100px){body>header.portfolio-header .capability-menu{display:none}body>header.portfolio-header>nav{gap:14px}}
@media(max-width:760px){body>header.portfolio-header{gap:12px;padding:6px 10px}body>header.portfolio-header .menu{display:block}body>header.portfolio-header>nav{display:none;position:absolute;top:calc(100% + 8px);left:0;right:0;margin:0;padding:12px;background:#fff;border-radius:12px;flex-direction:column;align-items:stretch;gap:2px;box-shadow:0 12px 30px #19061512}body>header.portfolio-header>nav.open{display:flex}}

/* hover menus on Case Studies, Strategy, Index and Lab, styled like the capability panel */
body>header.portfolio-header .nav-drop{position:relative;display:flex}
body>header.portfolio-header .nav-panel{display:none;position:absolute;top:100%;left:0;margin-top:6px;z-index:60;width:max-content;min-width:260px}
body>header.portfolio-header .nav-drop::after{content:"";position:absolute;left:0;right:0;top:100%;height:10px}
body>header.portfolio-header .nav-drop.end .nav-panel{left:auto;right:0}
body>header.portfolio-header .nav-panel a{display:block;padding:2px 0;border-radius:0;white-space:normal;font-size:16px;line-height:1.3;letter-spacing:-.02em;background:none!important;color:#190615!important}
body>header.portfolio-header .nav-panel a:hover,body>header.portfolio-header .nav-panel a:focus-visible{text-decoration:underline;text-underline-offset:3px}
@media(hover:hover) and (min-width:761px){body>header.portfolio-header .nav-drop:hover .nav-panel{display:block}}
@media(min-width:761px){body>header.portfolio-header .nav-drop:focus-within .nav-panel{display:block}}
@media(max-width:760px){body>header.portfolio-header .nav-drop{display:block}body>header.portfolio-header .nav-drop>a{display:block}body>header.portfolio-header .nav-panel{display:none!important}}
/* dropdown links never show the current-page underline */
body>header.portfolio-header .nav-panel a,body>header.portfolio-header .nav-panel a[aria-current],body>header.portfolio-header .nav-panel a:hover,body>header.portfolio-header .nav-panel a:focus-visible{text-decoration:none!important}
body>header.portfolio-header .nav-panel a:hover,body>header.portfolio-header .nav-panel a:focus-visible{opacity:.6}