.site-header{position:relative;height:170px;justify-content:flex-end}
.brand{position:absolute;inset:0;pointer-events:none}
.brand img{position:absolute;left:28px;top:16px;width:168px;height:138px;pointer-events:auto}
.brand-copy{position:absolute;left:50%;top:42px;transform:translateX(-50%);margin-left:0;min-width:560px;pointer-events:auto}
.brand-copy small{display:block;white-space:nowrap}
.arched-name{height:auto;align-items:center;line-height:1.15}
.arched-name span{transform:none!important}
.site-nav{position:relative;z-index:2}
@media(min-width:851px){
  .site-nav{position:absolute;right:28px;top:112px}
}
@media(max-width:850px){
  .site-header{height:145px;min-height:145px}
  .brand img{left:20px;top:18px;width:123px;height:108px}
  .brand-copy{left:50%;top:47px;transform:translateX(-50%);align-items:center;min-width:510px}
  .menu-button{position:absolute;right:20px;top:50%;width:46px;height:46px;margin:0;transform:translateY(-50%);z-index:3;touch-action:manipulation}
  .site-nav{top:128px}
}
@keyframes menu-button-spin{
  from{transform:translateY(-50%) rotate(0deg)}
  to{transform:translateY(-50%) rotate(360deg)}
}
.menu-button.spin{animation:menu-button-spin 2.4s ease-in-out}
.menu-button.spin::after{
  content:"❄️❄️\A❄️❄️";
  position:absolute;
  right:34px;
  top:50%;
  width:max-content;
  font-size:1.15rem;
  line-height:.9;
  text-align:center;
  white-space:pre;
  pointer-events:none;
  animation:cryo-spray 2.4s ease-out both;
}
@keyframes cryo-spray{
  0%{opacity:0;transform:translate(8px,-50%) scale(.55) rotate(0deg)}
  35%{opacity:1;transform:translate(-4px,-58%) scale(1) rotate(-120deg)}
  100%{opacity:0;transform:translate(-30px,-70%) scale(1.15) rotate(-360deg)}
}
@media (prefers-reduced-motion:reduce){
  .menu-button.spin{animation:none}
  .menu-button.spin::after{animation:none;display:none}
}
@media(max-width:560px){
  .site-header{height:158px;min-height:158px}
  .brand img{left:8px;top:19px;width:102px;height:93px}
  .brand-copy{top:40px;width:calc(100vw - 24px);min-width:0}
  .brand-copy small{position:absolute;top:76px;left:50%;transform:translateX(-50%);display:block;width:max-content;max-width:calc(100vw - 24px);font-size:.68rem;letter-spacing:0;line-height:1.25;white-space:nowrap;margin-top:0}
  .arched-name{font-size:.86rem;letter-spacing:.045em}
  .site-nav{top:145px}
}

@media (max-width:560px) and (orientation:portrait){
  .arched-name{
    font-size:1.18rem;
    letter-spacing:.075em;
    transform:translate(33px,29px);
  }
  .menu-button{
    position:absolute;
    right:8px;
    top:50%;
    width:46px;
    height:46px;
    margin:0;
    transform:translateY(-50%);
    touch-action:manipulation;
  }
}