/* Floating sand frame: keep the header's original 85px / 70px flow height. */
.site-header{
  width:min(calc(100% - 64px),1472px);
  margin-inline:auto;
  padding-block:10px;
  background:transparent;
  border:0;
  backdrop-filter:none;
}
/* Keep scrolling content out of the breathing room above the floating frame. */
.site-header::before{
  content:"";
  position:fixed;
  top:0;
  inset-inline:0;
  height:10px;
  background:var(--bone);
  pointer-events:none;
  z-index:-1;
}
.site-header .header-inner{
  height:65px;
  max-width:none;
  padding-inline:23px;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
  gap:16px;
  background:var(--white);
  border:1px solid var(--line);
  border-radius:6px;
  box-shadow:0 6px 20px rgb(39 40 36 / 6%);
}
.site-header .brand{justify-self:start}
.site-header .nav-actions{justify-self:end}
.site-header .desktop-nav{font-weight:650;gap:clamp(32px,4vw,64px)}
.site-header .desktop-nav a{padding:9px 8px;border-radius:4px;transition:background .18s}
.site-header .desktop-nav a:hover{background:var(--paper)}
.site-header .desktop-nav a::after{left:8px;right:8px;bottom:4px}
.site-header .mobile-nav{
  position:absolute;
  top:calc(100% - 2px);
  inset-inline:0;
  padding:12px 24px;
  background:var(--white);
  border:1px solid var(--line);
  border-radius:6px;
  box-shadow:0 6px 20px rgb(39 40 36 / 6%);
}
@media(max-width:900px){
  .site-header .header-inner{grid-template-columns:minmax(0,1fr) auto}
  .site-header .menu-toggle{position:relative;width:44px;height:44px;padding-inline:10px}
  .site-header .menu-toggle span{position:absolute;top:50%;left:10px;right:10px;margin:0;transform:translateY(-4px);transition:transform .2s ease}
  .site-header .menu-toggle span:last-child{transform:translateY(3px)}
  .site-header .menu-toggle[aria-expanded="true"] span:first-child{transform:translateY(-.5px) rotate(45deg)}
  .site-header .menu-toggle[aria-expanded="true"] span:last-child{transform:translateY(-.5px) rotate(-45deg)}
}
@media(max-width:600px){
  .site-header{width:calc(100% - 24px);padding-block:8px}
  .site-header::before{height:8px}
  .site-header .header-inner{height:54px;padding-inline:12px;gap:8px}
  .site-header .nav-actions{gap:8px}
}
@media(max-width:400px){
  .site-header .header-inner{padding-inline:9px;gap:6px}
  .site-header .brand img{width:82px}
  .site-header .nav-actions{gap:4px}
  .site-header .nav-actions>.button{font-size:9px;padding-inline:8px;gap:6px;white-space:nowrap}
}
@media(prefers-reduced-motion:reduce){
  .site-header .desktop-nav a,.site-header .desktop-nav a::after{transition:none}
  .site-header .menu-toggle span{transition:none}
}
.reduced-motion .site-header .menu-toggle span{transition:none}
