/* Reserve the complete logo while the original lettering is revealed. */
html.js.logo-intro :is(.brand-wordmark,.company-wordmark):not(.logo-motion-initialized){
 clip-path:inset(0 71% 0 0);animation:logo-pending-fallback 1ms step-end 1800ms forwards;
}
/* If the enhancement script fails to load, the complete name still returns. */
@keyframes logo-pending-fallback{to{clip-path:inset(0)}}
.logo-motion-frame{display:block;position:relative;width:fit-content;max-width:100%;flex:none}
.logo-motion-artwork{position:absolute;inset:0 auto auto 0;display:none;width:100%;height:100%;overflow:visible;pointer-events:none}
/* Original lettering appears once; the kros and each ink layer move independently. */
.logo-motion-active>.logo-motion-ready{clip-path:inset(0 0 0 29%)}
.logo-motion-active>.logo-motion-artwork{display:block}
.logo-motion-kros,.logo-motion-color{transform-box:view-box;transform-origin:30.95px 32px}
.logo-motion-artwork .st0{fill:#111}
.logo-motion-artwork .st1{fill:#00a9d3}
.logo-motion-artwork .st2{fill:#e5007d}
.logo-motion-artwork .st6{fill:#fff}
.logo-motion-artwork .st7{fill:none;stroke:#000;stroke-miterlimit:200;stroke-width:1.92px}
.logo-motion-artwork .st8{fill:#f1cc00}
/* Motion changes only composited transforms, so mobile layout and target sizes stay fixed. */
@media(prefers-reduced-motion:reduce){
 .logo-motion-kros,.logo-motion-color,.logo-motion-image{animation:none!important;transition:none!important;transform:none!important}
 html.js :is(.brand-wordmark,.company-wordmark){clip-path:none!important;opacity:1!important;animation:none!important}
 .logo-motion-artwork{display:none!important}
}
@media print{
 .logo-motion-artwork{display:none!important}
 html.js :is(.brand-wordmark,.company-wordmark){clip-path:none!important;opacity:1!important;animation:none!important}
}
