/* Shared masthead: transparent brand, quiet graphic detail and clear navigation. */
.site-header{
 height:100px;padding:0 5%;gap:24px;
 display:grid;grid-template-columns:minmax(230px,1fr) auto minmax(180px,1fr);
 isolation:isolate;background:linear-gradient(105deg,#d2dee5f5,#b6cbd6ed);
 border:0;box-shadow:0 1px 0 #eff5f780;
 backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
}
.site-header::before{
 content:'';position:absolute;inset:0 0 0 55%;z-index:-1;pointer-events:none;
 background:url('/assets/design/silver-motion-grok.jpg') right 57%/520px auto no-repeat;
 opacity:.16;mask-image:linear-gradient(90deg,transparent,#000 70%);
 -webkit-mask-image:linear-gradient(90deg,transparent,#000 70%);
}
.site-header::after{
 content:'';position:absolute;left:5%;right:5%;bottom:0;height:1px;
 background:linear-gradient(90deg,#54788830,#f1f5f7a8,#54788845);pointer-events:none;
}
.site-header .brand{
 justify-self:start;display:flex;align-items:center;padding:0;
 background:transparent;border:0;border-radius:0;box-shadow:none;
 min-width:0;max-width:100%;line-height:1;
}
.site-header .brand-logo{
 display:block;width:244px;height:auto;max-height:86px;object-fit:contain;
 padding:0;border:0;border-radius:0;background:transparent;
 /* Preserve the Grok-derived mark and lettering; unify its display color with the masthead. */
 filter:brightness(0) saturate(100%) invert(22%) sepia(23%) saturate(957%) hue-rotate(150deg) brightness(94%) contrast(92%);
}
.site-header .desktop-nav{
 display:flex;align-items:center;justify-content:center;gap:6px;
 padding:5px;border:1px solid #f1f5f785;border-radius:999px;
 background:#edf2f42e;box-shadow:inset 0 1px 0 #ffffff35;
}
.site-header .desktop-nav a{
 display:flex;align-items:center;justify-content:center;min-height:40px;
 padding:9px 15px;border-radius:999px;font-size:14px;font-weight:500;
 line-height:1.4;white-space:nowrap;color:#203d4b;
 transition:background .18s,color .18s;
}
.site-header .desktop-nav a::after{display:none}
.site-header .desktop-nav a:hover,.site-header .desktop-nav a[aria-current="page"]{background:#e6eff4ba;color:#142e39}
.site-header .header-cta{
 display:inline-flex;justify-self:end;align-items:center;justify-content:center;
 gap:18px;min-height:46px;padding:12px 19px;
 background:#244653;color:#f1f5f7;border:1px solid #365967;border-radius:999px;
 box-shadow:inset 0 1px 0 #ffffff15,0 5px 15px #24465310;
 font-size:14px;font-weight:500;line-height:1.4;white-space:nowrap;
 transition:background .18s,box-shadow .18s;
}
.site-header .header-cta:hover{background:#183844;color:#fff;box-shadow:0 7px 18px #24465320}
.site-header .header-cta span{font-size:21px;line-height:1}
.site-header .menu-toggle{display:none}
.site-header a:focus-visible,.site-header button:focus-visible{outline:2px solid #244653;outline-offset:5px}
.mobile-nav,.inner-page .site-header+.mobile-nav{
 top:100px;left:5%;right:5%;padding:15px;background:#d8e5ec;
 border:1px solid #a2b9c5;border-top:0;border-radius:0 0 20px 20px;
 box-shadow:0 18px 35px #18384420;color:#142e39;
}
.mobile-nav a{padding:10px 15px;border-radius:10px;min-height:46px;font-size:16px;line-height:1.5}
.mobile-nav a:hover,.mobile-nav a[aria-current="page"]{background:#c3d6e1}
@media(max-width:1100px){
 .site-header{padding-inline:4%;grid-template-columns:220px 1fr auto;gap:14px}
 .site-header .brand-logo{width:220px;max-height:80px}
 .site-header .desktop-nav{gap:0;padding:4px}
 .site-header .desktop-nav a{padding:9px 11px;font-size:13px}
 .site-header .header-cta{padding:11px 15px;gap:12px;font-size:13px}
}
@media(max-width:950px){
 .site-header{grid-template-columns:230px 1fr;height:94px}
 .site-header .brand-logo{width:226px}
 .site-header .desktop-nav{justify-self:end}
 .site-header .desktop-nav a{font-size:14px;padding:10px 14px}
 .site-header .header-cta{display:none}
}
@media(max-width:760px){
 .site-header{height:86px;padding:0 6%;display:flex;justify-content:space-between;gap:18px}
 .site-header::before{inset:0 0 0 40%;background-size:330px auto;opacity:.12}
 .site-header::after{left:6%;right:6%}
 .site-header .brand{padding:0;background:transparent;border:0;border-radius:0}
 .site-header .brand-logo{width:208px;max-width:calc(100vw - 110px);height:auto;max-height:74px}
 .site-header .desktop-nav,.site-header .header-cta{display:none}
 .site-header .menu-toggle{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  width:46px;height:46px;flex:0 0 46px;gap:6px;padding:0;
  border:1px solid #7898a9;border-radius:50%;background:#e1ebf180;
  box-shadow:inset 0 1px 0 #ffffff65;
 }
 .site-header .menu-toggle span{width:18px;height:1.5px;background:#244653;transition:transform .18s}
 .site-header .menu-toggle[aria-expanded="true"] span:first-child{transform:translateY(3.75px) rotate(45deg)}
 .site-header .menu-toggle[aria-expanded="true"] span:last-child{transform:translateY(-3.75px) rotate(-45deg)}
 .mobile-nav,.inner-page .site-header+.mobile-nav{top:86px;left:4%;right:4%;gap:4px;padding:12px}
}
@media(prefers-reduced-motion:reduce){.site-header .desktop-nav a,.site-header .header-cta,.site-header .menu-toggle span{transition:none}}
@media(min-width:761px){.mobile-nav{display:none!important}}