/* svc-crm.html — hero animation (prefix: cr-)
   Theme: 4-column kanban pipeline with a deal card moving between stages + forecast bar */
@keyframes crGlow { 0%,100% { opacity: 0.08; } 50% { opacity: 0.2; } }
@keyframes crFade { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
@keyframes crMove {
  0%,20%   { transform: translate(0, 0); }
  50%, 70% { transform: translate(112px, 0); }
  100%     { transform: translate(224px, 0); }
}
@keyframes crMoveTxt {
  0%,20%   { transform: translate(0, 0); }
  50%, 70% { transform: translate(112px, 0); }
  100%     { transform: translate(224px, 0); }
}
.cr-glow { animation: crGlow 3.5s ease-in-out infinite; }
.cr-col { }
.cr-col1 { animation: crFade 0.45s var(--ease-spring) 0.4s both; }
.cr-col2 { animation: crFade 0.45s var(--ease-spring) 0.55s both; }
.cr-col3 { animation: crFade 0.45s var(--ease-spring) 0.7s both; }
.cr-col4 { animation: crFade 0.45s var(--ease-spring) 0.85s both; }
.cr-moving { transform-box: fill-box; transform-origin: center; animation: crMove 6s ease-in-out 1.6s infinite; }
.cr-col2 text:nth-of-type(3), .cr-col2 text:nth-of-type(4) { transform-box: fill-box; transform-origin: center; animation: crMoveTxt 6s ease-in-out 1.6s infinite; }
.cr-fc { animation: crFade 0.5s var(--ease-spring) 1.2s both; }
