/* Keep the diagram legible. One quiet handoff moves through each pair in turn. */
.canvas-data-routes { pointer-events:none; }
.canvas-routes .canvas-route-base { stroke:#b1c2dc; stroke-width:.8; }
.canvas-routes .canvas-data-packet { fill:none; stroke:#456faa; stroke-width:1.8; stroke-dasharray:.008 .992; stroke-linecap:round; vector-effect:non-scaling-stroke; opacity:0; transition:none; }
.has-logo-hub .canvas-tool>span,
.has-logo-hub .canvas-tool>span::after { animation:none; }
.has-logo-hub .canvas-tool>span::after { display:none; }
[data-state="separate"] .canvas-data-routes,
.static-home .canvas-data-routes,
.is-static .canvas-data-routes { display:none; }
@media(prefers-reduced-motion:no-preference) {
  .canvas-data-packet { animation:canvas-refined-in 18s linear var(--stream-delay,0s) infinite both paused; }
  .canvas-data-route.is-out .canvas-data-packet { animation-name:canvas-refined-out; }
  .business-canvas[data-motion="playing"] .canvas-data-packet { animation-play-state:running; }
  .has-logo-hub .canvas-mobile-packet { animation-duration:4.8s; box-shadow:none; }
  .has-logo-hub .partnership-link::after { animation-duration:6s; }
  @keyframes canvas-refined-in {
    0%,2% { stroke-dashoffset:1px; opacity:0; }
    4% { opacity:.65; }
    14% { stroke-dashoffset:0px; opacity:.65; }
    16%,100% { stroke-dashoffset:0px; opacity:0; }
  }
  @keyframes canvas-refined-out {
    0%,18% { stroke-dashoffset:0px; opacity:0; }
    20% { opacity:.65; }
    30% { stroke-dashoffset:1px; opacity:.65; }
    32%,100% { stroke-dashoffset:1px; opacity:0; }
  }
}
@media(prefers-reduced-motion:reduce) { .canvas-data-routes { display:none; } }