/* One identity, expanded at the top and folded into its emblem on scroll. */
.header .logo { position:relative; height:64px; width:195px; flex:0 0 195px; transition:width .45s ease,flex-basis .45s ease; }
.header .logo .brand-wordmark { position:absolute; left:0; width:195px; height:auto; transition:opacity .3s ease,transform .38s ease; }
.header .logo .brand-emblem { position:absolute; left:0; width:64px; height:48px; object-fit:contain; opacity:0; transform:scale(.8); transition:opacity .3s ease,transform .45s ease; }
.header .logo.is-compact { width:64px; flex-basis:64px; }
.header .logo.is-compact .brand-wordmark { opacity:0; pointer-events:none; }
.header .logo.is-compact .brand-emblem { opacity:1; transform:scale(1); }
#intro-mark .intro-emblem { position:absolute; width:100px; height:96px; object-fit:contain; left:50%; top:0; transform:translateX(-50%); }
#intro-mark .intro-wordmark { opacity:0; }
.intro-pending .header .brand-emblem { visibility:hidden; }
@media(max-width:700px){.header .logo{height:55px;flex-basis:auto;width:172px}.header .logo .brand-wordmark{width:172px;height:auto}.header .logo.is-compact{width:58px;flex-basis:58px}.header .logo .brand-emblem{width:58px;height:46px}}
@media(prefers-reduced-motion:reduce){.header .logo,.header .logo .brand-wordmark,.header .logo .brand-emblem{transition:none}}
