.site-intro{position:fixed;inset:0;z-index:1000;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#101317;color:#fff;pointer-events:none;animation:intro-failsafe .4s 4s forwards}
.intro-active .site-intro{pointer-events:auto}.intro-active{overflow:hidden}
.intro-mark{position:relative;width:100px;height:112px;margin-bottom:28px}
.intro-outline{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.intro-outline path{stroke-dasharray:500;stroke-dashoffset:500;animation:intro-draw 1.2s cubic-bezier(.4,0,.2,1) forwards}
.intro-outline path+path{animation-delay:.15s}
.intro-mark .brand-emblem{position:absolute;left:6px;top:5px;width:90px;height:103px;opacity:0;animation:intro-logo .55s 1s forwards}
.intro-mark .brand-emblem img{width:359px;height:103px;max-width:none}
.intro-wordmark{font:700 clamp(20px,3vw,34px)/1.3 'Open Sans',Arial,sans-serif;letter-spacing:.12em;text-align:center;margin:0 20px}
.intro-wordmark span{display:inline-block;opacity:0;transform:translateY(12px);animation:intro-letter .5s forwards;animation-delay:calc(1.15s + var(--i)*.035s)}
.intro-tagline{font:400 11px/1.5 'Open Sans',Arial,sans-serif;letter-spacing:.1em;color:#b4c2cf;margin-top:13px;opacity:0;animation:intro-letter .5s 1.7s forwards}
.site-intro.intro-exit{opacity:0;transform:translateY(-18px);transition:opacity .5s ease,transform .5s ease;pointer-events:none}
@keyframes intro-draw{to{stroke-dashoffset:0}}@keyframes intro-logo{to{opacity:1}}@keyframes intro-letter{to{opacity:1;transform:translateY(0)}}@keyframes intro-failsafe{to{opacity:0;visibility:hidden;pointer-events:none}}
@media(prefers-reduced-motion:reduce){.site-intro{display:none}.intro-active{overflow:auto}}
/* Keep the logo on the same dark surface as the animated outline. */
.intro-mark .brand-emblem img{filter:url('assets/intro-filter.svg#remove-white')}
.intro-outline{animation:intro-outline-out .4s .85s ease forwards}
.intro-mark .brand-emblem{animation:intro-logo .45s .95s ease forwards}
.intro-wordmark span{animation-delay:calc(1s + var(--i)*.025s)}
.intro-tagline{animation-delay:1.4s}
.site-intro.intro-exit{transform:none;transition:opacity .55s cubic-bezier(.4,0,.2,1)}
@keyframes intro-outline-out{to{opacity:0}}
.intro-mark .brand-emblem{background:transparent;mix-blend-mode:normal}
.intro-mark .brand-emblem img{mix-blend-mode:normal}
