.brand-family { display:flex; align-items:center; gap:14px; min-width:0; }
.brand { gap:8px; white-space:nowrap; }
.brand-mark { flex-shrink:0; width:23px; height:23px; color:#a9472d; transform-origin:50% 50%; }
.brand-name { display:inline-block; }
.site-switch { display:inline-flex; align-items:center; justify-content:center; gap:6px; min-height:44px; padding:0 10px; border-radius:9px; text-decoration:none; color:var(--muted); font-size:12px; white-space:nowrap; }
.site-switch:hover { background:#efefef; color:var(--ink); }
.site-switch svg { width:13px; height:13px; flex-shrink:0; transition:transform .25s; }
.site-switch:hover svg { transform:translateX(2px); }
.site-departing .brand-mark { animation:float-logo-out 420ms cubic-bezier(.4,0,.2,1) both; }
.site-departing .brand-name { opacity:.2; transition:opacity 380ms; }
.site-departing main,.site-departing footer { opacity:0; transition:opacity 380ms; pointer-events:none; }
.site-arriving .brand-mark { animation:float-logo-in 650ms cubic-bezier(.2,.7,.2,1) both; }
.site-arriving .brand-name,.site-arriving main,.site-arriving footer { animation:float-page-in 550ms ease-out both; }
@keyframes float-logo-out { to { transform:rotate(180deg) scale(.82); opacity:.25; } }
@keyframes float-logo-in { from { transform:rotate(-180deg) scale(.82); opacity:.25; } to { transform:rotate(0) scale(1); opacity:1; } }
@keyframes float-page-in { from { opacity:0; } to { opacity:1; } }
@media(max-width:700px) {
  .site-header { padding-left:12px; padding-right:12px; flex-wrap:wrap; }
  .brand-family { gap:4px; } .brand { gap:5px; font-size:14px; }
  .brand-mark { width:18px; height:18px; }
  .site-switch { gap:4px; padding:0 7px; font-size:11px; }
  .header-actions { margin-left:auto; }
}
@media(prefers-reduced-motion:reduce) {
  .site-departing *,.site-arriving * { animation:none!important; transition:none!important; }
}