/* ETL Process Reveal v3 — pure CSS staggered reveal with !important to beat site CSS specificity */

.etl-process-anim .process-step {
  opacity: 0 !important;
  transform: translateY(40px) !important;
  transition: opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.7s cubic-bezier(0.16, 1, 0.3, 1) !important;
  will-change: transform, opacity;
}
.etl-process-anim .process-line {
  transform: scaleX(0) !important;
  transform-origin: left center !important;
  transition: transform 1.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
.etl-process-anim .process-dot {
  opacity: 0 !important;
  transition: opacity 0.4s ease 1s !important;
}

/* Revealed states with staggered delays */
.etl-process-anim.is-revealed .process-step                     { opacity: 1 !important; transform: none !important; }
.etl-process-anim.is-revealed .process-step[data-step="1"]      { transition-delay: 0.05s !important; }
.etl-process-anim.is-revealed .process-step[data-step="2"]      { transition-delay: 0.20s !important; }
.etl-process-anim.is-revealed .process-step[data-step="3"]      { transition-delay: 0.35s !important; }
.etl-process-anim.is-revealed .process-step[data-step="4"]      { transition-delay: 0.50s !important; }
.etl-process-anim.is-revealed .process-step[data-step="5"]      { transition-delay: 0.65s !important; }
.etl-process-anim.is-revealed .process-step[data-step="6"]      { transition-delay: 0.80s !important; }
.etl-process-anim.is-revealed .process-line                     { transform: scaleX(1) !important; }
.etl-process-anim.is-revealed .process-dot                      { opacity: 1 !important; }

@media (prefers-reduced-motion: reduce) {
  .etl-process-anim .process-step,
  .etl-process-anim .process-line,
  .etl-process-anim .process-dot {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}