/* Digital Ecosystem case-study motion layer */
.page-digital-ecosystem {
  --kp-de-ease: cubic-bezier(.22,1,.36,1);
}

.page-digital-ecosystem .kp-de-card,
.page-digital-ecosystem .kp-de-workstream,
.page-digital-ecosystem .kp-de-outcome-card,
.page-digital-ecosystem .kp-de-roadmap-column,
.page-digital-ecosystem .kp-de-info-card,
.page-digital-ecosystem .kp-de-architecture-row {
  transition: transform .28s ease, border-color .28s ease, background-color .28s ease;
}

.page-digital-ecosystem .kp-de-card:hover,
.page-digital-ecosystem .kp-de-workstream:hover,
.page-digital-ecosystem .kp-de-outcome-card:hover,
.page-digital-ecosystem .kp-de-roadmap-column:hover,
.page-digital-ecosystem .kp-de-info-card:hover {
  transform: translateY(-4px);
  border-color: rgba(138,37,40,.2);
}

.page-digital-ecosystem.kp-de-effects-ready .kp-de-browser {
  opacity: 0;
  transform: translateY(28px) scale(.97);
}

.page-digital-ecosystem .kp-de-product-visual.is-visual-animated .kp-de-browser {
  opacity: 1;
  transform: translateY(0) scale(1);
  transition: opacity .62s ease, transform .72s var(--kp-de-ease);
}

.page-digital-ecosystem .kp-de-product-visual.is-visual-animated .kp-de-browser:nth-child(1){transition-delay:80ms}
.page-digital-ecosystem .kp-de-product-visual.is-visual-animated .kp-de-browser:nth-child(2){transition-delay:180ms}
.page-digital-ecosystem .kp-de-product-visual.is-visual-animated .kp-de-browser:nth-child(3){transition-delay:280ms}
.page-digital-ecosystem .kp-de-product-visual.is-visual-animated .kp-de-browser:nth-child(4){transition-delay:380ms}

.page-digital-ecosystem.kp-de-effects-ready .kp-de-ecosystem-node,
.page-digital-ecosystem.kp-de-effects-ready .kp-de-journey-node,
.page-digital-ecosystem.kp-de-effects-ready .kp-de-payment-step {
  opacity: 0;
  transform: translateY(22px) scale(.98);
}

.page-digital-ecosystem .is-sequence-animated .kp-de-ecosystem-node,
.page-digital-ecosystem .is-sequence-animated .kp-de-journey-node,
.page-digital-ecosystem .is-sequence-animated .kp-de-payment-step {
  opacity: 1;
  transform: translateY(0) scale(1);
  transition: opacity .58s ease, transform .68s var(--kp-de-ease);
}

.page-digital-ecosystem .is-sequence-animated > *:nth-child(1){transition-delay:40ms}
.page-digital-ecosystem .is-sequence-animated > *:nth-child(2){transition-delay:130ms}
.page-digital-ecosystem .is-sequence-animated > *:nth-child(3){transition-delay:220ms}
.page-digital-ecosystem .is-sequence-animated > *:nth-child(4){transition-delay:310ms}
.page-digital-ecosystem .is-sequence-animated > *:nth-child(5){transition-delay:400ms}
.page-digital-ecosystem .is-sequence-animated > *:nth-child(6){transition-delay:490ms}
.page-digital-ecosystem .is-sequence-animated > *:nth-child(7){transition-delay:580ms}
.page-digital-ecosystem .is-sequence-animated > *:nth-child(8){transition-delay:670ms}

.page-digital-ecosystem .kp-de-ecosystem-map.is-sequence-animated .kp-de-ecosystem-node::after,
.page-digital-ecosystem .kp-de-journey-map.is-sequence-animated .kp-de-journey-node::after {
  animation: kpDeArrowPulse 1.45s ease-in-out infinite;
}

.page-digital-ecosystem .kp-de-ecosystem-map.is-sequence-animated .kp-de-ecosystem-node:nth-child(2)::after,
.page-digital-ecosystem .kp-de-journey-map.is-sequence-animated .kp-de-journey-node:nth-child(2)::after,
.page-digital-ecosystem .kp-de-journey-map.is-sequence-animated .kp-de-journey-node:nth-child(5)::after {
  animation-delay: 260ms;
}

@keyframes kpDeArrowPulse {
  0%,100% { opacity:.62; box-shadow:0 0 0 0 rgba(138,37,40,.17); filter:none; }
  48% { opacity:1; box-shadow:0 0 0 8px rgba(138,37,40,0); filter:brightness(1.15); }
}

.page-digital-ecosystem.kp-de-effects-ready .kp-de-workstream .kp-de-flow span {
  opacity: 0;
  transform: translateX(14px);
}

.page-digital-ecosystem .kp-de-workstream.kp-revealed .kp-de-flow span {
  opacity: 1;
  transform: translateX(0);
  transition: opacity .48s ease, transform .56s var(--kp-de-ease), border-color .22s ease, background-color .22s ease;
}

.page-digital-ecosystem .kp-de-workstream.kp-revealed .kp-de-flow span:nth-child(1){transition-delay:100ms}
.page-digital-ecosystem .kp-de-workstream.kp-revealed .kp-de-flow span:nth-child(2){transition-delay:180ms}
.page-digital-ecosystem .kp-de-workstream.kp-revealed .kp-de-flow span:nth-child(3){transition-delay:260ms}

.page-digital-ecosystem .kp-de-tool-badges span {
  transition: transform .22s ease, border-color .22s ease, background-color .22s ease, color .22s ease;
}

.page-digital-ecosystem .kp-de-tool-badges span:hover {
  transform: translateY(-3px);
  border-color: rgba(138,37,40,.24);
  background: rgba(138,37,40,.055);
  color: #8a2528;
}

@media (prefers-reduced-motion: reduce) {
  .page-digital-ecosystem *,
  .page-digital-ecosystem *::before,
  .page-digital-ecosystem *::after {
    animation: none !important;
    transition-duration: .01ms !important;
    transition-delay: 0ms !important;
  }

  .page-digital-ecosystem .kp-de-browser,
  .page-digital-ecosystem .kp-de-ecosystem-node,
  .page-digital-ecosystem .kp-de-journey-node,
  .page-digital-ecosystem .kp-de-payment-step,
  .page-digital-ecosystem .kp-de-flow span {
    opacity: 1 !important;
    transform: none !important;
  }
}

/* City Publications-style roadmap and workflow effects */

/* Roadmap cards stagger in and progress bars animate on scroll */
.page-digital-ecosystem.kp-de-effects-ready
  [data-kp-de-roadmap]
  .kp-de-roadmap-column {
  opacity: 0;
  transform: translateY(24px) scale(.98);
}

.page-digital-ecosystem
  [data-kp-de-roadmap].is-roadmap-animated
  .kp-de-roadmap-column {
  opacity: 1;
  transform: translateY(0) scale(1);
  transition:
    opacity 620ms ease,
    transform 720ms var(--kp-de-ease),
    border-color 260ms ease,
    background-color 260ms ease;
}



.page-digital-ecosystem
  [data-kp-de-roadmap].is-roadmap-animated
  .kp-de-roadmap-column:nth-child(2) {
  transition-delay: 180ms;
}

.page-digital-ecosystem
  [data-kp-de-roadmap].is-roadmap-animated
  .kp-de-roadmap-column:nth-child(3) {
  transition-delay: 300ms;
}

.page-digital-ecosystem .kp-de-roadmap-column {
  position: relative;
  overflow: hidden;
}

.page-digital-ecosystem .kp-de-roadmap-column::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  background: linear-gradient(
    180deg,
    rgba(138,37,40,.18),
    #8a2528,
    rgba(138,37,40,.18)
  );
  transform: scaleY(0);
  transform-origin: top;
}

.page-digital-ecosystem
  [data-kp-de-roadmap].is-roadmap-animated
  .kp-de-roadmap-column::before {
  transform: scaleY(1);
  transition: transform 980ms var(--kp-de-ease);
}

.page-digital-ecosystem
  [data-kp-de-roadmap].is-roadmap-animated
  .kp-de-roadmap-column:nth-child(2)::before {
  transition-delay: 180ms;
}

.page-digital-ecosystem
  [data-kp-de-roadmap].is-roadmap-animated
  .kp-de-roadmap-column:nth-child(3)::before {
  transition-delay: 300ms;
}

.page-digital-ecosystem .kp-de-roadmap-progress {
  display: grid;
  gap: 10px;
  margin: 18px 0 22px;
}

.page-digital-ecosystem .kp-de-roadmap-progress-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

.page-digital-ecosystem .kp-de-roadmap-progress-head span {
  color: rgba(17,17,17,.58);
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.page-digital-ecosystem .kp-de-roadmap-progress-head strong {
  color: #8a2528;
  font-size: 1rem;
  font-weight: 900;
}

.page-digital-ecosystem .kp-de-roadmap-bar {
  display: block;
  width: 100%;
  height: 10px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(17,17,17,.08);
}

.page-digital-ecosystem .kp-de-roadmap-bar > span {
  display: block;
  position: relative;
  height: 100%;
  overflow: hidden;
  border-radius: inherit;
  background: linear-gradient(90deg, rgba(138,37,40,.68), #8a2528);
}

.page-digital-ecosystem.kp-de-effects-ready
  [data-kp-de-roadmap]
  .kp-de-roadmap-bar
  > span {
  width: 0 !important;
}

.page-digital-ecosystem
  [data-kp-de-roadmap].is-roadmap-animated
  .kp-de-roadmap-bar
  > span {
  width: var(--kp-de-roadmap-target, 0%) !important;
  transition: width 1350ms var(--kp-de-ease);
}

.page-digital-ecosystem
  [data-kp-de-roadmap].is-roadmap-animated
  .kp-de-roadmap-column:nth-child(2)
  .kp-de-roadmap-bar
  > span {
  transition-delay: 220ms;
}

.page-digital-ecosystem
  [data-kp-de-roadmap].is-roadmap-animated
  .kp-de-roadmap-column:nth-child(3)
  .kp-de-roadmap-bar
  > span {
  transition-delay: 360ms;
}

/* Continuous running light within roadmap bars */
.page-digital-ecosystem
  [data-kp-de-roadmap].is-roadmap-animated
  .kp-de-roadmap-bar
  > span::after {
  content: "";
  position: absolute;
  inset: 0;
  width: 42%;
  left: -48%;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.16),
    rgba(255,255,255,.74),
    rgba(255,255,255,.16),
    transparent
  );
  transform: skewX(-18deg);
  animation: kpDeRoadmapRunningLight 2.25s linear infinite;
  pointer-events: none;
}

.page-digital-ecosystem
  [data-kp-de-roadmap].is-roadmap-animated
  .kp-de-roadmap-column:nth-child(2)
  .kp-de-roadmap-bar
  > span::after {
  animation-delay: 240ms;
}

.page-digital-ecosystem
  [data-kp-de-roadmap].is-roadmap-animated
  .kp-de-roadmap-column:nth-child(3)
  .kp-de-roadmap-bar
  > span::after {
  animation-delay: 480ms;
}

@keyframes kpDeRoadmapRunningLight {
  0% { left: -48%; }
  100% { left: 118%; }
}

/* Workflow number-chip sweep */
.page-digital-ecosystem [data-kp-de-flow-node] .kp-de-step-number,
.page-digital-ecosystem .kp-de-ecosystem-node .kp-de-status {
  position: relative;
  overflow: hidden;
}

.page-digital-ecosystem
  .is-sequence-animated
  [data-kp-de-flow-node]
  .kp-de-step-number::after,
.page-digital-ecosystem
  .is-sequence-animated
  .kp-de-ecosystem-node
  .kp-de-status::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    110deg,
    transparent 15%,
    rgba(255,255,255,.66) 48%,
    transparent 82%
  );
  transform: translateX(-130%);
  animation: kpDeWorkflowSweep 2.8s ease-in-out infinite;
}

.page-digital-ecosystem
  .is-sequence-animated
  [data-kp-de-flow-node]:nth-child(2)
  .kp-de-step-number::after,
.page-digital-ecosystem
  .is-sequence-animated
  .kp-de-ecosystem-node:nth-child(2)
  .kp-de-status::after {
  animation-delay: 180ms;
}

.page-digital-ecosystem
  .is-sequence-animated
  [data-kp-de-flow-node]:nth-child(3)
  .kp-de-step-number::after,
.page-digital-ecosystem
  .is-sequence-animated
  .kp-de-ecosystem-node:nth-child(3)
  .kp-de-status::after {
  animation-delay: 360ms;
}

.page-digital-ecosystem
  .is-sequence-animated
  [data-kp-de-flow-node]:nth-child(4)
  .kp-de-step-number::after,
.page-digital-ecosystem
  .is-sequence-animated
  .kp-de-ecosystem-node:nth-child(4)
  .kp-de-status::after {
  animation-delay: 540ms;
}

.page-digital-ecosystem
  .is-sequence-animated
  [data-kp-de-flow-node]:nth-child(5)
  .kp-de-step-number::after {
  animation-delay: 720ms;
}

.page-digital-ecosystem
  .is-sequence-animated
  [data-kp-de-flow-node]:nth-child(6)
  .kp-de-step-number::after {
  animation-delay: 900ms;
}

.page-digital-ecosystem
  .is-sequence-animated
  [data-kp-de-flow-node]:nth-child(7)
  .kp-de-step-number::after {
  animation-delay: 1080ms;
}

.page-digital-ecosystem
  .is-sequence-animated
  [data-kp-de-flow-node]:nth-child(8)
  .kp-de-step-number::after {
  animation-delay: 1260ms;
}

@keyframes kpDeWorkflowSweep {
  0%, 18% { transform: translateX(-130%); }
  52%, 100% { transform: translateX(130%); }
}

/* Stronger running-arrow effect across all workflow maps */
.page-digital-ecosystem
  [data-kp-de-workflow-map].is-sequence-animated
  [data-kp-de-flow-node]::after {
  animation: kpDeWorkflowArrowRun 1.45s ease-in-out infinite;
  box-shadow: 0 0 0 0 rgba(138,37,40,.17);
}

.page-digital-ecosystem
  [data-kp-de-workflow-map].is-sequence-animated
  [data-kp-de-flow-node]:nth-child(2)::after,
.page-digital-ecosystem
  [data-kp-de-workflow-map].is-sequence-animated
  [data-kp-de-flow-node]:nth-child(5)::after {
  animation-delay: 260ms;
}

.page-digital-ecosystem
  [data-kp-de-workflow-map].is-sequence-animated
  [data-kp-de-flow-node]:nth-child(3)::after,
.page-digital-ecosystem
  [data-kp-de-workflow-map].is-sequence-animated
  [data-kp-de-flow-node]:nth-child(6)::after {
  animation-delay: 520ms;
}

@keyframes kpDeWorkflowArrowRun {
  0%, 100% {
    opacity: .58;
    box-shadow: 0 0 0 0 rgba(138,37,40,.17);
    filter: none;
  }
  48% {
    opacity: 1;
    box-shadow: 0 0 0 8px rgba(138,37,40,0);
    filter: brightness(1.18);
  }
}

/* Workstream cards reveal in sequence */
.page-digital-ecosystem.kp-de-effects-ready
  [data-kp-de-workstream-sequence]
  .kp-de-workstream {
  opacity: 0;
  transform: translateY(24px);
}

.page-digital-ecosystem
  [data-kp-de-workstream-sequence].is-workstream-animated
  .kp-de-workstream {
  opacity: 1;
  transform: translateY(0);
  transition:
    opacity 600ms ease,
    transform 700ms var(--kp-de-ease),
    border-color 260ms ease;
}

.page-digital-ecosystem
  [data-kp-de-workstream-sequence].is-workstream-animated
  .kp-de-workstream:nth-child(1) { transition-delay: 40ms; }

.page-digital-ecosystem
  [data-kp-de-workstream-sequence].is-workstream-animated
  .kp-de-workstream:nth-child(2) { transition-delay: 130ms; }

.page-digital-ecosystem
  [data-kp-de-workstream-sequence].is-workstream-animated
  .kp-de-workstream:nth-child(3) { transition-delay: 220ms; }

.page-digital-ecosystem
  [data-kp-de-workstream-sequence].is-workstream-animated
  .kp-de-workstream:nth-child(4) { transition-delay: 310ms; }

.page-digital-ecosystem
  [data-kp-de-workstream-sequence].is-workstream-animated
  .kp-de-workstream:nth-child(5) { transition-delay: 400ms; }

.page-digital-ecosystem
  [data-kp-de-workstream-sequence].is-workstream-animated
  .kp-de-workstream:nth-child(6) { transition-delay: 490ms; }

@media (prefers-reduced-motion: reduce) {
  .page-digital-ecosystem [data-kp-de-roadmap] .kp-de-roadmap-column,
  .page-digital-ecosystem [data-kp-de-workstream-sequence] .kp-de-workstream {
    opacity: 1 !important;
    transform: none !important;
  }

  .page-digital-ecosystem .kp-de-roadmap-bar > span {
    width: var(--kp-de-roadmap-target, 0%) !important;
  }

  .page-digital-ecosystem .kp-de-roadmap-bar > span::after,
  .page-digital-ecosystem [data-kp-de-flow-node] .kp-de-step-number::after,
  .page-digital-ecosystem .kp-de-ecosystem-node .kp-de-status::after,
  .page-digital-ecosystem [data-kp-de-flow-node]::after {
    animation: none !important;
  }
}

/* Two-section roadmap refinement */
.page-digital-ecosystem .kp-de-roadmap {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  max-width: 980px;
  margin: 0 auto;
}

.page-digital-ecosystem .kp-de-roadmap-column {
  min-height: 100%;
}

.page-digital-ecosystem .kp-de-roadmap-column .kp-de-status {
  margin-bottom: 20px;
}

.page-digital-ecosystem .kp-de-roadmap-column .kp-de-list {
  margin-top: 0;
}

.page-digital-ecosystem
  [data-kp-de-roadmap].is-roadmap-animated
  .kp-de-roadmap-column:nth-child(1) {
  transition-delay: 60ms;
}

.page-digital-ecosystem
  [data-kp-de-roadmap].is-roadmap-animated
  .kp-de-roadmap-column:nth-child(2) {
  transition-delay: 190ms;
}

.page-digital-ecosystem
  [data-kp-de-roadmap].is-roadmap-animated
  .kp-de-roadmap-column:nth-child(2)::before {
  transition-delay: 190ms;
}

@media (max-width: 760px) {
  .page-digital-ecosystem .kp-de-roadmap {
    grid-template-columns: 1fr !important;
  }
}

/* City Publications process-mapping parity for ecosystem, journey and payment maps */
.page-digital-ecosystem.kp-de-effects-ready
  [data-kp-de-workflow-map]
  [data-kp-de-flow-node] {
  opacity: 0;
  transform: translateY(24px) scale(0.975);
}

.page-digital-ecosystem.kp-de-effects-ready
  [data-kp-de-workflow-map]
  [data-kp-de-flow-node]::after {
  opacity: 0;
  transform: translateY(-50%) scale(0.55);
}

.page-digital-ecosystem.kp-de-effects-ready
  .kp-de-journey-node[data-step="4"]::after,
.page-digital-ecosystem.kp-de-effects-ready
  .kp-de-payment-node[data-step="4"]::after {
  transform: translateX(50%) scale(0.55);
}

.page-digital-ecosystem
  [data-kp-de-workflow-map].is-sequence-animated
  [data-kp-de-flow-node] {
  opacity: 1;
  transform: translateY(0) scale(1);
  transition:
    opacity 620ms ease,
    transform 720ms var(--kp-de-ease),
    border-color 260ms ease,
    background-color 260ms ease;
}

.page-digital-ecosystem
  [data-kp-de-workflow-map].is-sequence-animated
  [data-kp-de-flow-node]::after {
  opacity: 1;
  transition:
    opacity 360ms ease,
    transform 520ms var(--kp-de-ease);
}

.page-digital-ecosystem
  [data-kp-de-workflow-map].is-sequence-animated
  [data-kp-de-flow-node]:not(.kp-de-journey-node[data-step="4"]):not(.kp-de-payment-node[data-step="4"]):not([data-step="4"])::after {
  transform: translateY(-50%) scale(1);
}

.page-digital-ecosystem
  [data-kp-de-workflow-map].is-sequence-animated
  .kp-de-journey-node[data-step="4"]::after,
.page-digital-ecosystem
  [data-kp-de-workflow-map].is-sequence-animated
  .kp-de-payment-node[data-step="4"]::after {
  transform: translateX(50%) scale(1);
}

.page-digital-ecosystem
  [data-kp-de-workflow-map].is-sequence-animated
  [data-kp-de-flow-node]:nth-child(1) {
  transition-delay: 40ms;
}
.page-digital-ecosystem
  [data-kp-de-workflow-map].is-sequence-animated
  [data-kp-de-flow-node]:nth-child(2) {
  transition-delay: 130ms;
}
.page-digital-ecosystem
  [data-kp-de-workflow-map].is-sequence-animated
  [data-kp-de-flow-node]:nth-child(3) {
  transition-delay: 220ms;
}
.page-digital-ecosystem
  [data-kp-de-workflow-map].is-sequence-animated
  [data-kp-de-flow-node]:nth-child(4) {
  transition-delay: 310ms;
}
.page-digital-ecosystem
  [data-kp-de-workflow-map].is-sequence-animated
  [data-kp-de-flow-node]:nth-child(5) {
  transition-delay: 400ms;
}
.page-digital-ecosystem
  [data-kp-de-workflow-map].is-sequence-animated
  [data-kp-de-flow-node]:nth-child(6) {
  transition-delay: 490ms;
}
.page-digital-ecosystem
  [data-kp-de-workflow-map].is-sequence-animated
  [data-kp-de-flow-node]:nth-child(7) {
  transition-delay: 580ms;
}
.page-digital-ecosystem
  [data-kp-de-workflow-map].is-sequence-animated
  [data-kp-de-flow-node]:nth-child(8) {
  transition-delay: 670ms;
}

.page-digital-ecosystem [data-kp-de-flow-node]:hover {
  transform: translateY(-5px) scale(1.01) !important;
  border-color: rgba(138, 37, 40, 0.23);
  background: rgba(255, 255, 255, 0.98);
}

.page-digital-ecosystem [data-kp-de-flow-node] .kp-de-step-number,
.page-digital-ecosystem .kp-de-ecosystem-node .kp-de-status {
  transition: background-color 240ms ease, color 240ms ease;
}

.page-digital-ecosystem [data-kp-de-flow-node]:hover .kp-de-step-number,
.page-digital-ecosystem .kp-de-ecosystem-node:hover .kp-de-status {
  background: #8a2528;
  color: #ffffff;
}

.page-digital-ecosystem
  [data-kp-de-workflow-map].is-sequence-animated
  .kp-de-ecosystem-node::after {
  animation: kpDeWorkflowArrowRun 1.45s ease-in-out infinite;
}

.page-digital-ecosystem
  [data-kp-de-workflow-map].is-sequence-animated
  .kp-de-journey-node[data-step="4"]::after,
.page-digital-ecosystem
  [data-kp-de-workflow-map].is-sequence-animated
  .kp-de-payment-node[data-step="4"]::after {
  animation: kpDeWorkflowArrowRunVertical 1.45s ease-in-out infinite;
  animation-delay: 520ms;
}

.page-digital-ecosystem
  [data-kp-de-workflow-map].is-sequence-animated
  .kp-de-ecosystem-node:nth-child(2)::after,
.page-digital-ecosystem
  [data-kp-de-workflow-map].is-sequence-animated
  .kp-de-journey-node:nth-child(2)::after,
.page-digital-ecosystem
  [data-kp-de-workflow-map].is-sequence-animated
  .kp-de-journey-node:nth-child(5)::after,
.page-digital-ecosystem
  [data-kp-de-workflow-map].is-sequence-animated
  .kp-de-payment-node:nth-child(2)::after,
.page-digital-ecosystem
  [data-kp-de-workflow-map].is-sequence-animated
  .kp-de-payment-node:nth-child(5)::after {
  animation-delay: 260ms;
}

.page-digital-ecosystem
  [data-kp-de-workflow-map].is-sequence-animated
  .kp-de-journey-node:nth-child(3)::after,
.page-digital-ecosystem
  [data-kp-de-workflow-map].is-sequence-animated
  .kp-de-journey-node:nth-child(6)::after,
.page-digital-ecosystem
  [data-kp-de-workflow-map].is-sequence-animated
  .kp-de-payment-node:nth-child(3)::after,
.page-digital-ecosystem
  [data-kp-de-workflow-map].is-sequence-animated
  .kp-de-payment-node:nth-child(6)::after {
  animation-delay: 520ms;
}

@keyframes kpDeWorkflowArrowRunVertical {
  0%,
  100% {
    opacity: 0.58;
    box-shadow: 0 0 0 0 rgba(138, 37, 40, 0.17);
    filter: none;
  }
  48% {
    opacity: 1;
    box-shadow: 0 0 0 8px rgba(138, 37, 40, 0);
    filter: brightness(1.18);
  }
}

.page-digital-ecosystem
  [data-kp-de-workflow-map].is-sequence-animated
  .kp-de-ecosystem-node:nth-child(2)
  .kp-de-status::after,
.page-digital-ecosystem
  [data-kp-de-workflow-map].is-sequence-animated
  [data-kp-de-flow-node]:nth-child(2)
  .kp-de-step-number::after {
  animation-delay: 180ms;
}

.page-digital-ecosystem
  [data-kp-de-workflow-map].is-sequence-animated
  .kp-de-ecosystem-node:nth-child(3)
  .kp-de-status::after,
.page-digital-ecosystem
  [data-kp-de-workflow-map].is-sequence-animated
  [data-kp-de-flow-node]:nth-child(3)
  .kp-de-step-number::after {
  animation-delay: 360ms;
}

.page-digital-ecosystem
  [data-kp-de-workflow-map].is-sequence-animated
  .kp-de-ecosystem-node:nth-child(4)
  .kp-de-status::after,
.page-digital-ecosystem
  [data-kp-de-workflow-map].is-sequence-animated
  [data-kp-de-flow-node]:nth-child(4)
  .kp-de-step-number::after {
  animation-delay: 540ms;
}

.page-digital-ecosystem
  [data-kp-de-workflow-map].is-sequence-animated
  [data-kp-de-flow-node]:nth-child(5)
  .kp-de-step-number::after {
  animation-delay: 720ms;
}

.page-digital-ecosystem
  [data-kp-de-workflow-map].is-sequence-animated
  [data-kp-de-flow-node]:nth-child(6)
  .kp-de-step-number::after {
  animation-delay: 900ms;
}

.page-digital-ecosystem
  [data-kp-de-workflow-map].is-sequence-animated
  [data-kp-de-flow-node]:nth-child(7)
  .kp-de-step-number::after {
  animation-delay: 1080ms;
}

.page-digital-ecosystem
  [data-kp-de-workflow-map].is-sequence-animated
  [data-kp-de-flow-node]:nth-child(8)
  .kp-de-step-number::after {
  animation-delay: 1260ms;
}

@media (prefers-reduced-motion: reduce) {
  .page-digital-ecosystem [data-kp-de-workflow-map] [data-kp-de-flow-node] {
    opacity: 1 !important;
    transform: none !important;
  }

  .page-digital-ecosystem [data-kp-de-workflow-map] [data-kp-de-flow-node]::after,
  .page-digital-ecosystem [data-kp-de-workflow-map] .kp-de-step-number::after,
  .page-digital-ecosystem [data-kp-de-workflow-map] .kp-de-status::after {
    animation: none !important;
  }
}