/* Indigo Tango — home page motion additions, 2026-11-09.
   Load after site-motion-20261026.css. Every effect is short and finite, and
   nothing starts hidden: with JavaScript off or reduced motion on, the page
   looks exactly as it does today. */
@media (prefers-reduced-motion:no-preference){
  /* 1. Hero copy arrives in order: kicker, headline, description, actions. */
  .network-kicker,.network-hero h1,.network-description,.network-actions,.network-hero-foot,.network-art-caption{animation:it-rise .9s cubic-bezier(.2,.7,.2,1) both}
  .network-hero h1{animation-delay:.08s}
  .network-description{animation-delay:.22s}
  .network-actions{animation-delay:.34s}
  .network-hero-foot{animation-delay:.6s}
  .network-art-caption{animation-delay:1.1s}
  @keyframes it-rise{from{opacity:0;transform:translateY(18px)}}

  /* 2. One pass of light across "More business." */
  @supports ((-webkit-background-clip:text) or (background-clip:text)){
    .network-hero h1 span{background:linear-gradient(100deg,#7ce8ed 43%,#f0ffff 50%,#7ce8ed 57%) 100% 0/300% 100% no-repeat;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:it-sheen 1.7s .75s cubic-bezier(.3,.6,.2,1) both}
    @keyframes it-sheen{to{background-position:0 0}}
  }

  /* 3. Status dots ping three times, then rest. */
  .network-kicker>span,.network-status{animation:it-ping 2.2s ease-out 1.2s 3}
  @keyframes it-ping{0%{box-shadow:0 0 12px #00c2d1,0 0 0 0 #00c2d199}70%,100%{box-shadow:0 0 12px #00c2d1,0 0 0 9px #00c2d100}}
}

/* 4. Button arrows lean in the direction they point. */
.network-primary span,.network-secondary span,.network-hero-foot a span{display:inline-block;transition:transform .3s cubic-bezier(.2,.7,.2,1)}
.network-primary:hover span,.network-primary:focus-visible span{transform:translate(3px,-3px)}
.network-secondary:hover span,.network-secondary:focus-visible span,.network-hero-foot a:hover span{transform:translateY(4px)}
.network-hero-foot strong{font-variant-numeric:tabular-nums}

/* 5. "How it works" diagram: one request runs through the three steps. */
.workflow-visual .workflow-node{transition:border-color .45s ease,box-shadow .45s ease,background-color .45s ease}
.workflow-visual .workflow-node>span{transition:background-color .45s ease,color .45s ease}
.workflow-visual .workflow-node.is-live{border-color:#00c2d1;box-shadow:0 0 0 1px #00c2d138,0 0 36px #00c2d124}
.workflow-visual .workflow-node.is-live>span{background:#00c2d138;color:#c9fdff}
.workflow-connector .flow-dot{position:absolute;left:-2.5px;top:-3px;width:6px;height:6px;border-radius:50%;background:#c9fdff;box-shadow:0 0 10px 2px #00c2d1;opacity:0;pointer-events:none}