/* Decorative asset-tracing sequence. Ends within five seconds; text stays still. */
.recovery-network { position:absolute; inset:8% 0 210px; width:100%; height:calc(92% - 210px); overflow:visible; pointer-events:none; }
.network-path { fill:none; stroke:#8dccff; stroke-width:1.2; opacity:.28; }
.network-ring { fill:none; stroke:#8dccff; stroke-width:1; opacity:.2; }
.network-orbit { transform-origin:260px 190px; }
.network-node { fill:#163451; stroke:#8dccff; stroke-width:1.5; }
.network-core { fill:#8dccff; }
.network-halo { fill:none; stroke:#8dccff; stroke-width:1; opacity:.3; transform-origin:260px 190px; }
.network-tracer { fill:#d8efff; opacity:0; }
.hero-art.motion-running .network-orbit { animation:network-turn 4.8s linear both; }
.hero-art.motion-running .network-halo { animation:network-signal 2.4s cubic-bezier(.77,0,.175,1) 2 both; }
.hero-art.motion-running .network-tracer { animation:network-trace 4.8s linear both; }
.network-tracer.route-one { --start-x:80px; --start-y:110px; --end-x:435px; --end-y:290px; }
.network-tracer.route-two { --start-x:430px; --start-y:80px; --end-x:105px; --end-y:305px; }
.network-tracer.route-three { --start-x:105px; --start-y:305px; --end-x:430px; --end-y:80px; }
@keyframes network-turn { from { transform:rotate(-24deg); } to { transform:rotate(24deg); } }
@keyframes network-signal { 0%,100% { opacity:.25; transform:scale(.95); } 50% { opacity:.7; transform:scale(1.08); } }
@keyframes network-trace {
  0% { transform:translate(var(--start-x),var(--start-y)); opacity:0; }
  10% { opacity:1; }
  48%,52% { transform:translate(260px,190px); opacity:1; }
  90% { opacity:1; }
  100% { transform:translate(var(--end-x),var(--end-y)); opacity:0; }
}
@media (max-width:700px) {
  .hero-art { min-height:320px; }
  .recovery-network { inset:0 0 130px; height:190px; }
  .hero-art:before { top:-30%; }
}
@media (prefers-reduced-motion:reduce) {
  .hero-art.motion-running .network-orbit,.hero-art.motion-running .network-halo,.hero-art.motion-running .network-tracer { animation:none; }
}