/* MatStudio v2.2.31 — unified, understated site header.
   Loaded after page and consistency styles to override older per-page header rules.
   Scope everything here to the header/mobile menu only. */

/* Keep the centered navigation and well-balanced actions, including on Home. */
@media (min-width:981px){
  body .site-header .header-inner{
    grid-template-columns:minmax(0,1fr) max-content minmax(0,1fr)!important;
    column-gap:24px!important;
  }
  body .site-header .primary-nav{
    justify-self:center!important;
    justify-content:center!important;
    gap:30px!important;
  }
  /* Some legacy 1024px rules show the hamburger alongside desktop navigation. */
  body .site-header .mobile-toggle,
  body .site-header .mobile-panel{display:none!important}
  body .site-header .header-actions{
    display:flex!important;
    align-items:center!important;
    justify-self:end!important;
    justify-content:flex-end!important;
    gap:14px!important;
    min-width:0;
  }
}

/* The wordmark uses the site's clean UI font rather than the old display serif. */
body .site-header .brand.brand-wordmark-only .ms-white-wordmark{
  font-family:var(--sans,-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif)!important;
  font-size:33px!important;
  font-weight:650!important;
  font-style:normal!important;
  letter-spacing:-.045em!important;
  line-height:1.1!important;
  color:#f8f6f2!important;
  -webkit-text-fill-color:#f8f6f2!important;
}
body .site-header .primary-nav a{
  font-family:var(--sans,-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif)!important;
  font-size:17px!important;
  font-weight:550!important;
  letter-spacing:-.015em!important;
  line-height:1.35!important;
}

/* Header social icons: subtle until interaction; no boxed icon backgrounds. */
body .site-header .header-actions .socials{
  display:flex!important;
  gap:4px!important;
  align-items:center!important;
  flex:0 0 auto;
}
body .site-header .header-actions .socials a{
  display:grid;
  width:42px;
  height:42px;
  padding:0;
  place-items:center;
  border:1px solid transparent;
  border-radius:50%;
  opacity:1;
  color:#e0ddd7;
  transition:color .18s ease,background-color .18s ease,border-color .18s ease;
}
body .site-header .header-actions .socials svg{
  width:20px;
  height:20px;
  fill:currentColor;
}
body .site-header .header-actions .socials a:hover{
  color:#fff;
  border-color:rgba(255,255,255,.13);
  background:rgba(255,255,255,.07);
  transform:none;
}
body .site-header .header-actions .socials a:focus-visible{
  outline:2px solid var(--orange,#ff5a1f);
  outline-offset:2px;
}

/* Understated project CTA: compact outline, restrained weight and no glow. */
body .site-header .header-actions .nav-cta.ms-project-cta{
  min-height:43px!important;
  padding:0 18px!important;
  border:1px solid rgba(255,255,255,.31)!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.045)!important;
  background-image:none!important;
  box-shadow:none!important;
  color:#f4f2ee!important;
  font-family:var(--sans,-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif)!important;
  font-size:14.5px!important;
  font-weight:550!important;
  line-height:1.25!important;
  letter-spacing:0!important;
  white-space:nowrap;
}
body .site-header .header-actions .nav-cta.ms-project-cta:hover{
  border-color:rgba(255,90,31,.76)!important;
  background:rgba(255,90,31,.09)!important;
  color:#fff!important;
  box-shadow:none!important;
}
body .site-header .header-actions .nav-cta.ms-project-cta:focus-visible{
  outline:2px solid var(--orange,#ff5a1f)!important;
  outline-offset:3px!important;
}

@media (min-width:981px) and (max-width:1180px){
  body .site-header .primary-nav{gap:24px!important}
  body .site-header .header-inner{column-gap:18px!important}
  body .site-header .header-actions{gap:12px!important}
  body .site-header .header-actions .socials{gap:0!important}
  body .site-header .header-actions .socials a{width:38px;height:40px}
  body .site-header .header-actions .nav-cta.ms-project-cta{padding-inline:15px!important}
}

/* The mobile header retains its existing hamburger; social links and a compact
   CTA are accessible in the mobile menu rather than squeezed into one row. */
@media (max-width:980px){
  body .site-header .brand.brand-wordmark-only .ms-white-wordmark{font-size:28px!important}
  body .site-header .mobile-panel{gap:0}
  body .site-header .mobile-panel>a{font-size:16px;font-weight:550}
  body .site-header .mobile-panel .mobile-panel-actions{
    display:flex;
    align-items:center;
    justify-content:space-between;
    flex-wrap:wrap;
    gap:12px;
    padding:15px 12px 7px;
  }
  body .site-header .mobile-panel .mobile-socials{display:flex;align-items:center;gap:6px}
  body .site-header .mobile-panel .mobile-socials a{
    display:grid;
    place-items:center;
    width:44px;
    height:44px;
    min-height:44px;
    padding:0;
    border:1px solid rgba(255,255,255,.19);
    border-radius:50%;
    color:#f6f4f0;
    background:rgba(255,255,255,.035);
  }
  body .site-header .mobile-panel .mobile-socials svg{width:20px;height:20px;fill:currentColor}
  body .site-header .mobile-panel .mobile-project-cta{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:auto;
    min-height:44px;
    padding:0 16px;
    margin:0;
    border:1px solid rgba(255,255,255,.36);
    border-radius:999px;
    background:rgba(255,255,255,.06);
    color:#fff;
    font-size:14px;
    font-weight:550;
    white-space:nowrap;
  }
}
@media (max-width:760px){
  body .site-header .brand.brand-wordmark-only .ms-white-wordmark{font-size:26px!important}
}
@media (prefers-reduced-motion:reduce){
  body .site-header .header-actions .socials a{transition:none}
}