/* The badge forms first. Its space then opens to the complete, original logo. */
.homepage .loader .intro-lockup{position:absolute;width:clamp(270px,30vw,360px);aspect-ratio:197.63/60.43;transform-origin:0 0}
.homepage .loader .intro-assembly{width:100%;height:100%;transform:translateX(34.44%)}
.homepage .loader .intro-logo{display:block;position:static;width:100%;height:100%;overflow:visible;fill:#e8e2d6;stroke:none}
.homepage .loader path{stroke:none;stroke-dasharray:none;stroke-dashoffset:0;animation:none}
.homepage .loader .intro-frame{opacity:0;animation:intro-frame-in .3s ease .8s forwards}
.homepage .loader .intro-us{opacity:0;animation:intro-us-in .4s cubic-bezier(.2,.7,.2,1) .62s both}
.homepage .loader .intro-word{fill:#e8e2d6}
.homepage .loader .intro-light{transition:opacity .42s ease}
.homepage .loader[data-assembled] .intro-light{opacity:0}
.homepage .loader .intro-trace{fill:none;stroke:url(#intro-color);stroke-width:2.5;stroke-linejoin:round;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;animation:intro-trace-loop 1.92s cubic-bezier(.5,0,.2,1) infinite}
.homepage .loader .intro-glow{stroke-width:4;stroke-opacity:.8}
.homepage .loader .intro-spark{fill:none;stroke:#fff;stroke-width:.85;stroke-linecap:round;stroke-dasharray:.035 .965;stroke-dashoffset:1;animation:intro-spark-loop 1.92s cubic-bezier(.5,0,.2,1) infinite}
.identity-docked .homepage .header .brand{animation:none;opacity:1}
@keyframes intro-trace-in{to{stroke-dashoffset:0}}
/* 0-50% is the original .96s draw; it holds, fades, and redraws from nothing. */
@keyframes intro-trace-loop{0%{stroke-dashoffset:1;opacity:1}50%{stroke-dashoffset:0;opacity:1}72%{stroke-dashoffset:0;opacity:1}96%,100%{stroke-dashoffset:0;opacity:0}}
@keyframes intro-spark-loop{0%{stroke-dashoffset:1;opacity:0}6%{opacity:1}45%{opacity:1}50%,100%{stroke-dashoffset:0;opacity:0}}
@keyframes intro-frame-in{to{opacity:1}}
@keyframes intro-us-in{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
@keyframes intro-spark-in{0%{stroke-dashoffset:1;opacity:0}12%{opacity:1}90%{opacity:1}100%{stroke-dashoffset:0;opacity:0}}
@media(prefers-reduced-motion:reduce){
  .homepage .loader .intro-frame,.homepage .loader .intro-us{opacity:1;transform:none}
  .homepage .loader .intro-light{display:none}
}
/* A usable first view replaces the cover while the GPU assets finish loading.
   The still rock and the CALCIUM lettering both stand in. The word is the same
   SVG path and gradient mineral.js paints into WebGL, placed by hero-lettering.js
   with the shared lettering-frame.js math, so the hand-off is a pixel-aligned
   cross-fade rather than a font swap (the earlier Hubot text stand-in read as one). */
.progressive-entry .homepage .loader{opacity:0;transition:opacity .28s ease}
.progressive-entry .homepage .rock-fallback{display:block!important;opacity:1;transition:opacity .6s ease}
.progressive-entry .homepage .word-fallback{display:block!important;opacity:1;transition:opacity .6s ease}
.progressive-entry .homepage #rock{transition:opacity .6s ease}
.progressive-entry.progressive-hydrated .homepage .rock-fallback{opacity:0}
.progressive-entry.progressive-hydrated.progressive-scrolled .homepage .word-fallback{opacity:0}
.progressive-entry .homepage .header>*,.progressive-entry .homepage .opening>*{animation-duration:.35s;animation-delay:0s}
@media(prefers-reduced-motion:reduce){.progressive-entry .homepage .loader,.progressive-entry .homepage #rock,.progressive-entry .homepage .rock-fallback,.progressive-entry .homepage .word-fallback{transition:none}}
