/* Equal outer tracks keep navigation centred independently of logo/CTA widths. */
.header-inner{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:24px;align-items:center}
.header-inner>.brand{justify-self:start}
.header-inner>#navigation{display:flex;justify-content:center;align-items:center;gap:clamp(22px,2.2vw,35px);width:auto;padding:0;font-size:12px;white-space:nowrap}
.header-inner>.header-cta{justify-self:end;white-space:nowrap}
.cap-menu-toggle{gap:8px}
.menu-chevron{width:16px;height:16px;display:block;flex-shrink:0;transition:transform .2s ease;transform-origin:center}
.cap-menu-toggle[aria-expanded=true]>.menu-chevron{transform:rotate(180deg)}
@media(min-width:1024px) and (max-width:1199px){.header-inner{gap:18px}.header-inner>#navigation{gap:20px;font-size:11px}.header-inner>.header-cta{font-size:11px;padding-inline:12px;gap:9px}}
@media(max-width:1023px){
.header-inner{display:flex;flex-wrap:wrap;justify-content:space-between;gap:0}
.header-inner>#navigation{width:100%;flex-direction:column;flex-wrap:nowrap;align-items:stretch;gap:0;padding-block:8px 12px;white-space:normal}
/* The open menu has a height cap: scroll it rather than wrap items into an off-screen column. */
.header-inner>#navigation>*{flex-shrink:0}
.enhanced .header-inner>#navigation{display:none}
.enhanced .header-inner>#navigation.is-open{display:flex}
.header-inner>#navigation>a,.header-inner>#navigation>button{font-size:14px;justify-content:flex-start;min-height:48px;padding:12px 0;border-bottom:1px solid var(--line)}
.cap-menu-toggle{font-size:14px;min-height:48px}
.header-inner>.header-cta{margin:0 0 20px;align-self:flex-start}
.enhanced .header-inner>.header-cta{display:none}
.enhanced .header-inner>#navigation.is-open~.header-cta{display:inline-flex}
}
@media(prefers-reduced-motion:reduce){.menu-chevron{transition:none}}

/* Larger navigation, with a compact desktop adjustment before mobile. */
.header-inner>#navigation{font-size:15px;gap:clamp(22px,2vw,32px)}
.header-inner>.header-cta{font-size:13px}
@media(min-width:1024px) and (max-width:1199px){.header-inner>#navigation{font-size:13px;gap:18px}.header-inner>.header-cta{font-size:12px}}
@media(max-width:1023px){.header-inner>#navigation{gap:0}.header-inner>#navigation>a,.header-inner>#navigation>button,.cap-menu-toggle{font-size:16px}}
/* Extend the real link across the Framework card without extra tab stops. */
#capabilities .capability .cap-arrow:after{content:"";position:absolute;inset:0;z-index:2;cursor:pointer}
#capabilities .capability:focus-within{outline:2px solid var(--blue);outline-offset:4px}
#capabilities .capability-0:focus-within,#capabilities .capability-2:focus-within{outline-color:var(--cyan)}
