:root {
  /* Duration */
  --motion-instant: 100ms;
  --motion-fast: 160ms;
  --motion-normal: 220ms;
  --motion-reveal: 420ms;
  --motion-flow: 600ms;
  --motion-hero: 760ms;

  /* Easing */
  --ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --ease-entrance: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-exit: cubic-bezier(0.4, 0, 1, 1);
  --ease-linear: linear;

  /* Distance */
  --motion-distance-micro: 2px;
  --motion-distance-icon: 4px;
  --motion-distance-compact: 8px;
  --motion-distance-reveal: 12px;
  --motion-distance-section: 20px;
  --motion-distance-hero: 28px;

  /* Stagger */
  --motion-stagger-desktop: 60ms;
  --motion-stagger-mobile: 40ms;
  --motion-stagger-max: 240ms;
}

[data-motion] {
  --motion-distance: var(--motion-distance-reveal);
  --motion-delay: 0ms;
  --motion-order: 0;
  opacity: 1;
  transform: none;
}

.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
}

.js-motion-ready [data-motion].motion-pending {
  opacity: 0;
  transform: translateY(var(--motion-distance));
}

.js-motion-ready [data-motion].is-visible {
  opacity: 1;
  transform: translateY(0);
  transition-property: opacity, transform;
  transition-duration: var(--motion-reveal);
  transition-timing-function: var(--ease-entrance);
  transition-delay: var(--motion-delay);
}

.js-motion-ready [data-motion="hero"].is-visible {
  --motion-distance: var(--motion-distance-hero);
  transition-duration: var(--motion-hero);
}

.js-motion-ready [data-motion="flow"].is-visible {
  --motion-distance: var(--motion-distance-section);
  transition-duration: var(--motion-flow);
}

#home .hero .eyebrow,
#home .hero h1,
#home .hero .hero-lead,
#home .hero .hero-ctas,
#home .hero-map-bg {
  --hero-enter-x: 0;
  --hero-enter-y: var(--motion-distance-reveal);
  --hero-enter-opacity-start: 0;
  animation-name: newpay-hero-enter;
  animation-duration: var(--motion-reveal);
  animation-timing-function: var(--ease-entrance);
  animation-delay: 0ms;
  animation-fill-mode: both;
}

#home .hero .eyebrow {
  --hero-enter-y: var(--motion-distance-compact);
  animation-duration: 360ms;
}

#home .hero h1 {
  --hero-enter-y: var(--motion-distance-hero);
  animation-duration: 720ms;
  animation-delay: 120ms;
}

#home .hero .hero-lead {
  --hero-enter-y: 16px;
  animation-duration: 520ms;
  animation-delay: 320ms;
}

#home .hero .hero-ctas {
  --hero-enter-y: var(--motion-distance-reveal);
  animation-duration: 480ms;
  animation-delay: 480ms;
}

#home .hero-map-bg {
  --hero-enter-x: 24px;
  --hero-enter-y: 0;
  --hero-enter-opacity-start: 0.4;
  animation-duration: 1000ms;
  animation-delay: 80ms;
}

@keyframes newpay-hero-enter {
  from {
    opacity: var(--hero-enter-opacity-start);
    transform: translate3d(var(--hero-enter-x), var(--hero-enter-y), 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

#home .role-grid[data-motion-group] > .role-card[data-motion="reveal"] {
  --motion-distance: 18px;
}

#home .stats-grid[data-motion-group] > .stat[data-motion="reveal"] {
  --motion-distance: var(--motion-distance-reveal);
}

#home .stat strong[data-count] {
  font-variant-numeric: tabular-nums;
}

#home .stat strong[data-count] .stat-value {
  min-inline-size: var(--count-width, auto);
  display: inline-block;
  color: inherit;
  font: inherit;
  line-height: inherit;
  letter-spacing: inherit;
  text-align: center;
  white-space: nowrap;
}

.js-motion-ready #home .role-grid[data-motion-group] > .role-card[data-motion="reveal"].is-visible {
  transition-duration: 520ms;
  transition-delay: calc(var(--motion-order) * 80ms);
}

.site-wave-footer#contact .site-footer-cta[data-motion="reveal"] {
  --motion-distance: 18px;
}

.js-motion-ready .site-wave-footer#contact .site-footer-cta[data-motion="reveal"].is-visible {
  transition-duration: 520ms;
}

#home .ecosystem .section-head[data-motion="reveal"],
#home .merchant-ops .merchant-grid > div[data-motion="reveal"]:not(.merchant-operations-visual) {
  --motion-distance: var(--motion-distance-reveal);
}

#home .ecosystem .ecosystem-visual[data-motion="reveal"] {
  --motion-distance: 16px;
}

#home .merchant-ops .merchant-operations-visual[data-motion="reveal"] {
  --motion-distance: 14px;
}

.js-motion-ready #home .ecosystem .section-head[data-motion="reveal"].is-visible,
.js-motion-ready #home .merchant-ops .merchant-grid > div[data-motion="reveal"]:not(.merchant-operations-visual).is-visible {
  transition-duration: var(--motion-reveal);
}

.js-motion-ready #home .ecosystem .ecosystem-visual[data-motion="reveal"].is-visible {
  transition-duration: var(--motion-flow);
  transition-delay: 100ms;
}

.js-motion-ready #home .merchant-ops .merchant-operations-visual[data-motion="reveal"].is-visible {
  transition-duration: 560ms;
  transition-delay: 100ms;
}

#home .security .section-head[data-motion="reveal"],
#home .milestones .section-head[data-motion="reveal"] {
  --motion-distance: 10px;
}

#home .security-grid[data-motion-group] > .security-card[data-motion="reveal"] {
  --motion-distance: 10px;
}

#home .security .news-strip[data-motion="reveal"] {
  --motion-distance: var(--motion-distance-compact);
}

#home .stories .section-head[data-motion="reveal"] {
  --motion-distance: var(--motion-distance-reveal);
}

#home .stories .home-merchant-card[data-motion="reveal"] {
  --motion-distance: 14px;
}

#home .milestones .timeline[data-motion-group] > .time-card[data-motion="reveal"] {
  --motion-distance: var(--motion-distance-reveal);
}

.js-motion-ready #home .security .section-head[data-motion="reveal"].is-visible,
.js-motion-ready #home .milestones .section-head[data-motion="reveal"].is-visible {
  transition-duration: 400ms;
}

.js-motion-ready #home .security-grid[data-motion-group] > .security-card[data-motion="reveal"].is-visible {
  transition-duration: 400ms;
  transition-delay: calc(var(--motion-order) * 50ms);
}

.js-motion-ready #home .security .news-strip[data-motion="reveal"].is-visible {
  transition-duration: 360ms;
  transition-delay: 80ms;
}

.js-motion-ready #home .stories .section-head[data-motion="reveal"].is-visible {
  transition-duration: var(--motion-reveal);
}

.js-motion-ready #home .stories .home-merchant-showcase[data-motion-group] > .home-merchant-card[data-motion="reveal"].is-visible,
.js-motion-ready #home .stories .home-merchant-side[data-motion-group] > .home-merchant-card[data-motion="reveal"].is-visible {
  transition-duration: 460ms;
  transition-delay: calc(var(--motion-order) * var(--motion-stagger-desktop));
}

.js-motion-ready #home .stories .home-merchant-card[data-motion="reveal"].is-visible:hover {
  transform: translateY(-4px);
}

.js-motion-ready #home .milestones .timeline[data-motion-group] > .time-card[data-motion="reveal"].is-visible {
  transition-duration: var(--motion-reveal);
  transition-delay: calc(var(--motion-order) * 50ms);
}

#home .cross-border[data-motion="flow"] {
  --flow-copy-delay: 0ms;
  --flow-card-delay: 100ms;
  --flow-step-delay-base: 220ms;
  --flow-step-delay-gap: 160ms;
  --flow-connector-delay-base: 360ms;
  --flow-logo-delay: 720ms;
  --flow-y: var(--motion-distance-reveal);
  --flow-step-y: 10px;
  --flow-logo-y: var(--motion-distance-compact);
}

#home .cross-border[data-motion="flow"],
.js-motion-ready #home .cross-border[data-motion="flow"].motion-pending,
.js-motion-ready #home .cross-border[data-motion="flow"].is-visible {
  opacity: 1;
  transform: none;
  transition: none;
}

#home .cross-border[data-motion="flow"] .cross-grid > div:not(.flow-card),
#home .cross-border[data-motion="flow"] .flow-card,
#home .cross-border[data-motion="flow"] .flow-step,
#home .cross-border[data-motion="flow"] .logo-matrix {
  opacity: 1;
  transform: none;
}

#home .cross-border[data-motion="flow"] .flow-step {
  position: relative;
}

#home .cross-border[data-motion="flow"] .flow-step:not(:last-child)::after {
  content: "";
  position: absolute;
  left: 39px;
  bottom: -15px;
  width: 2px;
  height: 14px;
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(0, 200, 128, 0.78), rgba(255, 255, 255, 0.32));
  opacity: 1;
  transform: scaleY(1);
  transform-origin: top;
  pointer-events: none;
}

.js-motion-ready #home .cross-border[data-motion="flow"].motion-pending .cross-grid > div:not(.flow-card),
.js-motion-ready #home .cross-border[data-motion="flow"].motion-pending .flow-card,
.js-motion-ready #home .cross-border[data-motion="flow"].motion-pending .flow-step,
.js-motion-ready #home .cross-border[data-motion="flow"].motion-pending .logo-matrix {
  opacity: 0;
}

.js-motion-ready #home .cross-border[data-motion="flow"].motion-pending .cross-grid > div:not(.flow-card),
.js-motion-ready #home .cross-border[data-motion="flow"].motion-pending .flow-card {
  transform: translateY(var(--flow-y));
}

.js-motion-ready #home .cross-border[data-motion="flow"].motion-pending .flow-step {
  transform: translateY(var(--flow-step-y));
}

.js-motion-ready #home .cross-border[data-motion="flow"].motion-pending .logo-matrix {
  transform: translateY(var(--flow-logo-y));
}

.js-motion-ready #home .cross-border[data-motion="flow"].motion-pending .flow-step:not(:last-child)::after {
  opacity: 0;
  transform: scaleY(0);
}

.js-motion-ready #home .cross-border[data-motion="flow"].is-visible .cross-grid > div:not(.flow-card) {
  transition:
    opacity var(--motion-reveal) var(--ease-entrance) var(--flow-copy-delay),
    transform var(--motion-reveal) var(--ease-entrance) var(--flow-copy-delay);
}

.js-motion-ready #home .cross-border[data-motion="flow"].is-visible .flow-card {
  transition:
    opacity var(--motion-reveal) var(--ease-entrance) var(--flow-card-delay),
    transform var(--motion-reveal) var(--ease-entrance) var(--flow-card-delay);
}

.js-motion-ready #home .cross-border[data-motion="flow"].is-visible .flow-step {
  transition:
    opacity var(--motion-reveal) var(--ease-entrance) calc(var(--flow-step-delay-base) + (var(--flow-order, 0) * var(--flow-step-delay-gap))),
    transform var(--motion-reveal) var(--ease-entrance) calc(var(--flow-step-delay-base) + (var(--flow-order, 0) * var(--flow-step-delay-gap)));
}

.js-motion-ready #home .cross-border[data-motion="flow"].is-visible .flow-step:not(:last-child)::after {
  transition:
    opacity 320ms var(--ease-entrance) calc(var(--flow-connector-delay-base) + (var(--flow-order, 0) * var(--flow-step-delay-gap))),
    transform 320ms var(--ease-entrance) calc(var(--flow-connector-delay-base) + (var(--flow-order, 0) * var(--flow-step-delay-gap)));
}

.js-motion-ready #home .cross-border[data-motion="flow"].is-visible .logo-matrix {
  transition:
    opacity 360ms var(--ease-entrance) var(--flow-logo-delay),
    transform 360ms var(--ease-entrance) var(--flow-logo-delay);
}

#home .developer[data-motion="flow"] {
  --developer-copy-y: var(--motion-distance-reveal);
  --developer-step-y: 10px;
  --developer-code-y: var(--motion-distance-compact);
}

#home .developer[data-motion="flow"],
.js-motion-ready #home .developer[data-motion="flow"].motion-pending,
.js-motion-ready #home .developer[data-motion="flow"].is-visible {
  opacity: 1;
  transform: none;
  transition: none;
}

#home .developer[data-motion="flow"] .developer-grid > div:first-child > .kicker,
#home .developer[data-motion="flow"] .developer-grid > div:first-child > h2,
#home .developer[data-motion="flow"] .developer-grid > div:first-child > .section-copy,
#home .developer[data-motion="flow"] .step,
#home .developer[data-motion="flow"] .developer-grid > div:first-child > .hero-ctas,
#home .developer[data-motion="flow"] .code-panel {
  opacity: 1;
  transform: none;
}

.js-motion-ready #home .developer[data-motion="flow"].motion-pending .developer-grid > div:first-child > .kicker,
.js-motion-ready #home .developer[data-motion="flow"].motion-pending .developer-grid > div:first-child > h2,
.js-motion-ready #home .developer[data-motion="flow"].motion-pending .developer-grid > div:first-child > .section-copy {
  opacity: 0;
  transform: translateY(var(--developer-copy-y));
}

.js-motion-ready #home .developer[data-motion="flow"].motion-pending .step {
  opacity: 0;
  transform: translateY(var(--developer-step-y));
}

.js-motion-ready #home .developer[data-motion="flow"].motion-pending .developer-grid > div:first-child > .hero-ctas,
.js-motion-ready #home .developer[data-motion="flow"].motion-pending .code-panel {
  opacity: 0;
  transform: translateY(var(--developer-code-y));
}

.js-motion-ready #home .developer[data-motion="flow"].is-visible .developer-grid > div:first-child > .kicker,
.js-motion-ready #home .developer[data-motion="flow"].is-visible .developer-grid > div:first-child > h2,
.js-motion-ready #home .developer[data-motion="flow"].is-visible .developer-grid > div:first-child > .section-copy {
  transition:
    opacity var(--motion-reveal) var(--ease-entrance),
    transform var(--motion-reveal) var(--ease-entrance);
}

.js-motion-ready #home .developer[data-motion="flow"].is-visible .step {
  transition:
    opacity 400ms var(--ease-entrance),
    transform 400ms var(--ease-entrance);
}

.js-motion-ready #home .developer[data-motion="flow"].is-visible .step:nth-child(1) {
  transition-delay: 120ms;
}

.js-motion-ready #home .developer[data-motion="flow"].is-visible .step:nth-child(2) {
  transition-delay: 180ms;
}

.js-motion-ready #home .developer[data-motion="flow"].is-visible .step:nth-child(3) {
  transition-delay: 240ms;
}

.js-motion-ready #home .developer[data-motion="flow"].is-visible .step:nth-child(4) {
  transition-delay: 320ms;
}

.js-motion-ready #home .developer[data-motion="flow"].is-visible .step:nth-child(5) {
  transition-delay: 380ms;
}

.js-motion-ready #home .developer[data-motion="flow"].is-visible .step:nth-child(6) {
  transition-delay: 440ms;
}

.js-motion-ready #home .developer[data-motion="flow"].is-visible .developer-grid > div:first-child > .hero-ctas {
  transition:
    opacity 380ms var(--ease-entrance) 500ms,
    transform 380ms var(--ease-entrance) 500ms;
}

.js-motion-ready #home .developer[data-motion="flow"].is-visible .code-panel {
  transition:
    opacity 460ms var(--ease-entrance) 520ms,
    transform 460ms var(--ease-entrance) 520ms;
}

@media (max-width: 720px) {
  [data-motion] {
    --motion-distance: var(--motion-distance-compact);
  }

  .js-motion-ready [data-motion="hero"].is-visible {
    --motion-distance: 18px;
  }

  #home .hero .eyebrow,
  #home .hero .hero-ctas {
    --hero-enter-y: 6px;
    animation-duration: 300ms;
  }

  #home .hero h1 {
    --hero-enter-y: 20px;
    animation-duration: 620ms;
    animation-delay: 80ms;
  }

  #home .hero .hero-lead {
    --hero-enter-y: var(--motion-distance-reveal);
    animation-duration: 460ms;
    animation-delay: 260ms;
  }

  #home .hero .hero-ctas {
    --hero-enter-y: 10px;
    animation-duration: 420ms;
    animation-delay: 420ms;
  }

  #home .hero-map-bg {
    --hero-enter-x: 8px;
    --hero-enter-opacity-start: 0.55;
    animation-duration: 820ms;
    animation-delay: 60ms;
  }

  #home .stats-grid[data-motion-group] > .stat[data-motion="reveal"] {
    --motion-distance: var(--motion-distance-compact);
  }

  #home .role-grid[data-motion-group] > .role-card[data-motion="reveal"],
  .site-wave-footer#contact .site-footer-cta[data-motion="reveal"] {
    --motion-distance: var(--motion-distance-reveal);
  }

  .js-motion-ready #home .role-grid[data-motion-group] > .role-card[data-motion="reveal"].is-visible {
    transition-duration: 480ms;
    transition-delay: calc(var(--motion-order) * 60ms);
  }

  .js-motion-ready .site-wave-footer#contact .site-footer-cta[data-motion="reveal"].is-visible {
    transition-duration: 480ms;
  }

  #home .ecosystem .section-head[data-motion="reveal"],
  #home .merchant-ops .merchant-grid > div[data-motion="reveal"]:not(.merchant-operations-visual) {
    --motion-distance: var(--motion-distance-compact);
  }

  #home .ecosystem .ecosystem-visual[data-motion="reveal"],
  #home .merchant-ops .merchant-operations-visual[data-motion="reveal"] {
    --motion-distance: 10px;
  }

  .js-motion-ready #home .ecosystem .section-head[data-motion="reveal"].is-visible,
  .js-motion-ready #home .merchant-ops .merchant-grid > div[data-motion="reveal"]:not(.merchant-operations-visual).is-visible {
    transition-duration: 400ms;
  }

  .js-motion-ready #home .ecosystem .ecosystem-visual[data-motion="reveal"].is-visible {
    transition-duration: 500ms;
    transition-delay: 60ms;
  }

  .js-motion-ready #home .merchant-ops .merchant-operations-visual[data-motion="reveal"].is-visible {
    transition-duration: 480ms;
    transition-delay: 60ms;
  }

  #home .security .section-head[data-motion="reveal"],
  #home .milestones .section-head[data-motion="reveal"] {
    --motion-distance: 6px;
  }

  #home .security-grid[data-motion-group] > .security-card[data-motion="reveal"],
  #home .stories .home-merchant-card[data-motion="reveal"],
  #home .milestones .timeline[data-motion-group] > .time-card[data-motion="reveal"] {
    --motion-distance: var(--motion-distance-compact);
  }

  #home .security .news-strip[data-motion="reveal"] {
    --motion-distance: 6px;
  }

  #home .stories .section-head[data-motion="reveal"] {
    --motion-distance: var(--motion-distance-compact);
  }

  .js-motion-ready #home .security .section-head[data-motion="reveal"].is-visible,
  .js-motion-ready #home .milestones .section-head[data-motion="reveal"].is-visible {
    transition-duration: 360ms;
  }

  .js-motion-ready #home .security-grid[data-motion-group] > .security-card[data-motion="reveal"].is-visible,
  .js-motion-ready #home .milestones .timeline[data-motion-group] > .time-card[data-motion="reveal"].is-visible {
    transition-duration: 380ms;
    transition-delay: calc(var(--motion-order) * var(--motion-stagger-mobile));
  }

  .js-motion-ready #home .security .news-strip[data-motion="reveal"].is-visible {
    transition-duration: 340ms;
    transition-delay: 40ms;
  }

  .js-motion-ready #home .stories .section-head[data-motion="reveal"].is-visible {
    transition-duration: 380ms;
  }

  .js-motion-ready #home .stories .home-merchant-showcase[data-motion-group] > .home-merchant-card[data-motion="reveal"].is-visible,
  .js-motion-ready #home .stories .home-merchant-side[data-motion-group] > .home-merchant-card[data-motion="reveal"].is-visible {
    transition-duration: 420ms;
    transition-delay: calc(var(--motion-order) * var(--motion-stagger-mobile));
  }

  #home .cross-border[data-motion="flow"] {
    --flow-card-delay: 70ms;
    --flow-step-delay-base: 150ms;
    --flow-step-delay-gap: 90ms;
    --flow-logo-delay: 480ms;
    --flow-y: var(--motion-distance-compact);
    --flow-step-y: var(--motion-distance-compact);
    --flow-logo-y: 6px;
  }

  #home .cross-border[data-motion="flow"] .flow-step:not(:last-child)::after {
    display: none;
  }

  .js-motion-ready #home .cross-border[data-motion="flow"].is-visible .cross-grid > div:not(.flow-card),
  .js-motion-ready #home .cross-border[data-motion="flow"].is-visible .flow-card,
  .js-motion-ready #home .cross-border[data-motion="flow"].is-visible .flow-step {
    transition-duration: 360ms;
  }

  .js-motion-ready #home .cross-border[data-motion="flow"].is-visible .logo-matrix {
    transition-duration: 320ms;
  }

  #home .developer[data-motion="flow"] {
    --developer-copy-y: var(--motion-distance-compact);
    --developer-step-y: var(--motion-distance-compact);
    --developer-code-y: 6px;
  }

  .js-motion-ready #home .developer[data-motion="flow"].is-visible .developer-grid > div:first-child > .kicker,
  .js-motion-ready #home .developer[data-motion="flow"].is-visible .developer-grid > div:first-child > h2,
  .js-motion-ready #home .developer[data-motion="flow"].is-visible .developer-grid > div:first-child > .section-copy {
    transition-duration: 360ms;
  }

  .js-motion-ready #home .developer[data-motion="flow"].is-visible .step {
    transition-duration: 360ms;
  }

  .js-motion-ready #home .developer[data-motion="flow"].is-visible .step:nth-child(1) {
    transition-delay: 80ms;
  }

  .js-motion-ready #home .developer[data-motion="flow"].is-visible .step:nth-child(2) {
    transition-delay: 120ms;
  }

  .js-motion-ready #home .developer[data-motion="flow"].is-visible .step:nth-child(3) {
    transition-delay: 160ms;
  }

  .js-motion-ready #home .developer[data-motion="flow"].is-visible .step:nth-child(4) {
    transition-delay: 220ms;
  }

  .js-motion-ready #home .developer[data-motion="flow"].is-visible .step:nth-child(5) {
    transition-delay: 250ms;
  }

  .js-motion-ready #home .developer[data-motion="flow"].is-visible .step:nth-child(6) {
    transition-delay: 280ms;
  }

  .js-motion-ready #home .developer[data-motion="flow"].is-visible .developer-grid > div:first-child > .hero-ctas {
    transition:
      opacity 320ms var(--ease-entrance) 320ms,
      transform 320ms var(--ease-entrance) 320ms;
  }

  .js-motion-ready #home .developer[data-motion="flow"].is-visible .code-panel {
    transition:
      opacity 400ms var(--ease-entrance) 360ms,
      transform 400ms var(--ease-entrance) 360ms;
  }
}

.products-page .products-hero[data-motion="products-hero"],
.js-motion-ready .products-page .products-hero[data-motion="products-hero"].motion-pending,
.js-motion-ready .products-page .products-hero[data-motion="products-hero"].is-visible,
.products-page .tech-panel[data-motion="flow"],
.js-motion-ready .products-page .tech-panel[data-motion="flow"].motion-pending,
.js-motion-ready .products-page .tech-panel[data-motion="flow"].is-visible {
  opacity: 1;
  transform: none;
  transition: none;
}

.products-page .products-hero[data-motion="products-hero"] .eyebrow,
.products-page .products-hero[data-motion="products-hero"] h1,
.products-page .products-hero[data-motion="products-hero"] .hero-lead,
.products-page .products-hero[data-motion="products-hero"] .hero-copy,
.products-page .products-hero[data-motion="products-hero"] .hero-actions,
.products-page .products-hero[data-motion="products-hero"] .hero-metric,
.products-page .tech-panel[data-motion="flow"] .tech-copy,
.products-page .tech-panel[data-motion="flow"] .api-board,
.products-page .tech-panel[data-motion="flow"] .api-list li {
  opacity: 1;
  transform: none;
}

.products-page .products-hero[data-motion="products-hero"] .products-hero-visual {
  opacity: 1;
}

.js-motion-ready .products-page .products-hero[data-motion="products-hero"].motion-pending .eyebrow,
.js-motion-ready .products-page .products-hero[data-motion="products-hero"].motion-pending h1,
.js-motion-ready .products-page .products-hero[data-motion="products-hero"].motion-pending .hero-lead,
.js-motion-ready .products-page .products-hero[data-motion="products-hero"].motion-pending .hero-copy,
.js-motion-ready .products-page .products-hero[data-motion="products-hero"].motion-pending .hero-actions,
.js-motion-ready .products-page .products-hero[data-motion="products-hero"].motion-pending .hero-metric {
  opacity: 0;
  transform: translateY(var(--products-hero-y, 8px));
}

.js-motion-ready .products-page .products-hero[data-motion="products-hero"].motion-pending .products-hero-visual {
  opacity: 0;
}

.js-motion-ready .products-page .products-hero[data-motion="products-hero"].is-visible .eyebrow {
  transition:
    opacity 360ms var(--ease-entrance),
    transform 360ms var(--ease-entrance);
}

.js-motion-ready .products-page .products-hero[data-motion="products-hero"].is-visible h1 {
  --products-hero-y: 16px;
  transition:
    opacity 600ms var(--ease-entrance) 60ms,
    transform 600ms var(--ease-entrance) 60ms;
}

.js-motion-ready .products-page .products-hero[data-motion="products-hero"].is-visible .hero-lead {
  --products-hero-y: 10px;
  transition:
    opacity var(--motion-reveal) var(--ease-entrance) 140ms,
    transform var(--motion-reveal) var(--ease-entrance) 140ms;
}

.js-motion-ready .products-page .products-hero[data-motion="products-hero"].is-visible .hero-copy {
  --products-hero-y: 10px;
  transition:
    opacity var(--motion-reveal) var(--ease-entrance) 170ms,
    transform var(--motion-reveal) var(--ease-entrance) 170ms;
}

.js-motion-ready .products-page .products-hero[data-motion="products-hero"].is-visible .hero-actions {
  transition:
    opacity var(--motion-reveal) var(--ease-entrance) 220ms,
    transform var(--motion-reveal) var(--ease-entrance) 220ms;
}

.js-motion-ready .products-page .products-hero[data-motion="products-hero"].is-visible .hero-metric {
  transition:
    opacity var(--motion-reveal) var(--ease-entrance),
    transform var(--motion-reveal) var(--ease-entrance);
}

.js-motion-ready .products-page .products-hero[data-motion="products-hero"].is-visible .hero-metric:nth-child(1) {
  transition-delay: 300ms;
}

.js-motion-ready .products-page .products-hero[data-motion="products-hero"].is-visible .hero-metric:nth-child(2) {
  transition-delay: 350ms;
}

.js-motion-ready .products-page .products-hero[data-motion="products-hero"].is-visible .hero-metric:nth-child(3) {
  transition-delay: 400ms;
}

.js-motion-ready .products-page .products-hero[data-motion="products-hero"].is-visible .products-hero-visual {
  transition: opacity 600ms var(--ease-entrance) 160ms;
}

.products-page .systems-grid[data-motion-group] > .system-card[data-motion="reveal"] {
  --motion-distance: 14px;
}

.products-page .matrix-grid[data-motion-group] > .matrix-card[data-motion="reveal"],
.products-page .scenario-grid[data-motion-group] > .scenario-card[data-motion="reveal"] {
  --motion-distance: 10px;
}

.products-page .security-grid[data-motion-group] > .security-card[data-motion="reveal"] {
  --motion-distance: 8px;
}

.products-page .scenario-solution-link[data-motion="reveal"],
.products-page .product-cta-box[data-motion="reveal"] {
  --motion-distance: 10px;
}

.js-motion-ready .products-page .systems-grid[data-motion-group] > .system-card[data-motion="reveal"].is-visible {
  transition-duration: 460ms;
  transition-delay: min(var(--motion-delay), 180ms);
}

.js-motion-ready .products-page .matrix-grid[data-motion-group] > .matrix-card[data-motion="reveal"].is-visible,
.js-motion-ready .products-page .scenario-grid[data-motion-group] > .scenario-card[data-motion="reveal"].is-visible {
  transition-duration: 420ms;
}

.js-motion-ready .products-page .security-grid[data-motion-group] > .security-card[data-motion="reveal"].is-visible {
  transition-duration: 380ms;
  transition-delay: min(var(--motion-delay), 160ms);
}

.js-motion-ready .products-page .section-head[data-motion="reveal"].is-visible,
.js-motion-ready .products-page .scenario-solution-link[data-motion="reveal"].is-visible,
.js-motion-ready .products-page .product-cta-box[data-motion="reveal"].is-visible {
  transition-duration: var(--motion-reveal);
}

.products-page .tech-panel[data-motion="flow"] {
  --products-tech-copy-y: var(--motion-distance-reveal);
  --products-tech-board-y: var(--motion-distance-compact);
  --products-tech-item-y: 6px;
}

.js-motion-ready .products-page .tech-panel[data-motion="flow"].motion-pending .tech-copy {
  opacity: 0;
  transform: translateY(var(--products-tech-copy-y));
}

.js-motion-ready .products-page .tech-panel[data-motion="flow"].motion-pending .api-board,
.js-motion-ready .products-page .tech-panel[data-motion="flow"].motion-pending .api-list li {
  opacity: 0;
  transform: translateY(var(--products-tech-board-y));
}

.js-motion-ready .products-page .tech-panel[data-motion="flow"].motion-pending .api-list li {
  transform: translateY(var(--products-tech-item-y));
}

.js-motion-ready .products-page .tech-panel[data-motion="flow"].is-visible .tech-copy {
  transition:
    opacity var(--motion-reveal) var(--ease-entrance),
    transform var(--motion-reveal) var(--ease-entrance);
}

.js-motion-ready .products-page .tech-panel[data-motion="flow"].is-visible .api-board {
  transition:
    opacity 460ms var(--ease-entrance) 420ms,
    transform 460ms var(--ease-entrance) 420ms;
}

.js-motion-ready .products-page .tech-panel[data-motion="flow"].is-visible .api-list li {
  transition:
    opacity 360ms var(--ease-entrance),
    transform 360ms var(--ease-entrance);
}

.js-motion-ready .products-page .tech-panel[data-motion="flow"].is-visible .api-list li:nth-child(1) {
  transition-delay: 140ms;
}

.js-motion-ready .products-page .tech-panel[data-motion="flow"].is-visible .api-list li:nth-child(2) {
  transition-delay: 190ms;
}

.js-motion-ready .products-page .tech-panel[data-motion="flow"].is-visible .api-list li:nth-child(3) {
  transition-delay: 240ms;
}

.js-motion-ready .products-page .tech-panel[data-motion="flow"].is-visible .api-list li:nth-child(4) {
  transition-delay: 290ms;
}

.js-motion-ready .products-page .tech-panel[data-motion="flow"].is-visible .api-list li:nth-child(5) {
  transition-delay: 340ms;
}

.js-motion-ready .products-page .tech-panel[data-motion="flow"].is-visible .api-list li:nth-child(6) {
  transition-delay: 390ms;
}

@media (max-width: 720px) {
  .js-motion-ready .products-page .products-hero[data-motion="products-hero"].motion-pending h1 {
    --products-hero-y: 12px;
  }

  .js-motion-ready .products-page .products-hero[data-motion="products-hero"].motion-pending .hero-lead,
  .js-motion-ready .products-page .products-hero[data-motion="products-hero"].motion-pending .hero-copy,
  .js-motion-ready .products-page .products-hero[data-motion="products-hero"].motion-pending .hero-actions,
  .js-motion-ready .products-page .products-hero[data-motion="products-hero"].motion-pending .hero-metric {
    --products-hero-y: 6px;
  }

  .js-motion-ready .products-page .products-hero[data-motion="products-hero"].is-visible h1 {
    transition-duration: 520ms;
    transition-delay: 50ms;
  }

  .js-motion-ready .products-page .products-hero[data-motion="products-hero"].is-visible .hero-lead {
    transition-duration: 380ms;
    transition-delay: 120ms;
  }

  .js-motion-ready .products-page .products-hero[data-motion="products-hero"].is-visible .hero-copy {
    transition-duration: 380ms;
    transition-delay: 150ms;
  }

  .js-motion-ready .products-page .products-hero[data-motion="products-hero"].is-visible .hero-actions {
    transition-duration: 360ms;
    transition-delay: 200ms;
  }

  .js-motion-ready .products-page .products-hero[data-motion="products-hero"].is-visible .hero-metric:nth-child(1) {
    transition-delay: 260ms;
  }

  .js-motion-ready .products-page .products-hero[data-motion="products-hero"].is-visible .hero-metric:nth-child(2) {
    transition-delay: 300ms;
  }

  .js-motion-ready .products-page .products-hero[data-motion="products-hero"].is-visible .hero-metric:nth-child(3) {
    transition-delay: 340ms;
  }

  .js-motion-ready .products-page .products-hero[data-motion="products-hero"].is-visible .products-hero-visual {
    transition-duration: 480ms;
    transition-delay: 140ms;
  }

  .products-page .systems-grid[data-motion-group] > .system-card[data-motion="reveal"],
  .products-page .matrix-grid[data-motion-group] > .matrix-card[data-motion="reveal"],
  .products-page .scenario-grid[data-motion-group] > .scenario-card[data-motion="reveal"],
  .products-page .security-grid[data-motion-group] > .security-card[data-motion="reveal"] {
    --motion-distance: var(--motion-distance-compact);
  }

  .js-motion-ready .products-page .systems-grid[data-motion-group] > .system-card[data-motion="reveal"].is-visible {
    transition-duration: 420ms;
  }

  .js-motion-ready .products-page .matrix-grid[data-motion-group] > .matrix-card[data-motion="reveal"].is-visible,
  .js-motion-ready .products-page .scenario-grid[data-motion-group] > .scenario-card[data-motion="reveal"].is-visible {
    transition-duration: 380ms;
  }

  .js-motion-ready .products-page .security-grid[data-motion-group] > .security-card[data-motion="reveal"].is-visible {
    transition-duration: 360ms;
  }

  .products-page .tech-panel[data-motion="flow"] {
    --products-tech-copy-y: var(--motion-distance-compact);
    --products-tech-board-y: 6px;
    --products-tech-item-y: 4px;
  }

  .js-motion-ready .products-page .tech-panel[data-motion="flow"].is-visible .tech-copy {
    transition-duration: 360ms;
  }

  .js-motion-ready .products-page .tech-panel[data-motion="flow"].is-visible .api-board {
    transition-duration: 400ms;
    transition-delay: 360ms;
  }

  .js-motion-ready .products-page .tech-panel[data-motion="flow"].is-visible .api-list li {
    transition-duration: 320ms;
  }

  .js-motion-ready .products-page .tech-panel[data-motion="flow"].is-visible .api-list li:nth-child(1) {
    transition-delay: 90ms;
  }

  .js-motion-ready .products-page .tech-panel[data-motion="flow"].is-visible .api-list li:nth-child(2) {
    transition-delay: 130ms;
  }

  .js-motion-ready .products-page .tech-panel[data-motion="flow"].is-visible .api-list li:nth-child(3) {
    transition-delay: 170ms;
  }

  .js-motion-ready .products-page .tech-panel[data-motion="flow"].is-visible .api-list li:nth-child(4) {
    transition-delay: 210ms;
  }

  .js-motion-ready .products-page .tech-panel[data-motion="flow"].is-visible .api-list li:nth-child(5) {
    transition-delay: 250ms;
  }

  .js-motion-ready .products-page .tech-panel[data-motion="flow"].is-visible .api-list li:nth-child(6) {
    transition-delay: 290ms;
  }
}

.solutions-page .solutions-hero[data-motion="solutions-hero"],
.js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].motion-pending,
.js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].is-visible,
.solutions-page .process-panel[data-motion="flow"],
.js-motion-ready .solutions-page .process-panel[data-motion="flow"].motion-pending,
.js-motion-ready .solutions-page .process-panel[data-motion="flow"].is-visible {
  opacity: 1;
  transform: none;
  transition: none;
}

.solutions-page .solutions-hero[data-motion="solutions-hero"] .solutions-hero-grid > div:first-child > .eyebrow,
.solutions-page .solutions-hero[data-motion="solutions-hero"] .solutions-hero-grid > div:first-child > h1,
.solutions-page .solutions-hero[data-motion="solutions-hero"] .solutions-hero-grid > div:first-child > .hero-lead,
.solutions-page .solutions-hero[data-motion="solutions-hero"] .solutions-hero-grid > div:first-child > .hero-actions,
.solutions-page .solutions-hero[data-motion="solutions-hero"] .hero-proof {
  opacity: 1;
  transform: none;
}

.solutions-page .solutions-hero[data-motion="solutions-hero"] .solutions-hero-visual,
.solutions-page .solutions-hero[data-motion="solutions-hero"] .network-center,
.solutions-page .solutions-hero[data-motion="solutions-hero"] .network-node,
.solutions-page .solutions-hero[data-motion="solutions-hero"] .network-ring,
.solutions-page .solutions-hero[data-motion="solutions-hero"] .network-connector,
.solutions-page .solutions-hero[data-motion="solutions-hero"] .network-glow {
  opacity: 1;
}

.js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].motion-pending .solutions-hero-grid > div:first-child > .eyebrow,
.js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].motion-pending .solutions-hero-grid > div:first-child > h1,
.js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].motion-pending .solutions-hero-grid > div:first-child > .hero-lead,
.js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].motion-pending .solutions-hero-grid > div:first-child > .hero-actions,
.js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].motion-pending .hero-proof {
  opacity: 0;
  transform: translateY(var(--solutions-hero-y, 8px));
}

.js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].motion-pending .solutions-hero-visual,
.js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].motion-pending .network-center,
.js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].motion-pending .network-node,
.js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].motion-pending .network-ring,
.js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].motion-pending .network-connector,
.js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].motion-pending .network-glow {
  opacity: 0;
}

.js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].is-visible .solutions-hero-grid > div:first-child > .eyebrow {
  transition:
    opacity 360ms var(--ease-entrance),
    transform 360ms var(--ease-entrance);
}

.js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].is-visible .solutions-hero-grid > div:first-child > h1 {
  --solutions-hero-y: 16px;
  transition:
    opacity 600ms var(--ease-entrance) 60ms,
    transform 600ms var(--ease-entrance) 60ms;
}

.js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].is-visible .solutions-hero-grid > div:first-child > .hero-lead {
  --solutions-hero-y: 10px;
  transition:
    opacity var(--motion-reveal) var(--ease-entrance) 140ms,
    transform var(--motion-reveal) var(--ease-entrance) 140ms;
}

.js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].is-visible .solutions-hero-grid > div:first-child > .hero-actions {
  transition:
    opacity var(--motion-reveal) var(--ease-entrance) 220ms,
    transform var(--motion-reveal) var(--ease-entrance) 220ms;
}

.js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].is-visible .hero-proof {
  transition:
    opacity var(--motion-reveal) var(--ease-entrance) 300ms,
    transform var(--motion-reveal) var(--ease-entrance) 300ms;
}

.js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].is-visible .solutions-hero-visual {
  transition: opacity 500ms var(--ease-entrance) 160ms;
}

.js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].is-visible .network-center {
  transition: opacity 460ms var(--ease-entrance) 360ms;
}

.js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].is-visible .network-ring,
.js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].is-visible .network-connector,
.js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].is-visible .network-glow {
  transition: opacity 420ms var(--ease-entrance) 470ms;
}

.js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].is-visible .network-node {
  transition: opacity 420ms var(--ease-entrance);
}

.js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].is-visible .node-merchant,
.js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].is-visible .node-bank,
.js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].is-visible .node-platform {
  transition-delay: 560ms;
}

.js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].is-visible .node-tourism,
.js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].is-visible .node-wallet,
.js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].is-visible .node-public {
  transition-delay: 640ms;
}

.solutions-page .scenario-nav[data-motion="reveal"],
.solutions-page .overview-grid[data-motion-group] > .overview-card[data-motion="reveal"],
.solutions-page .shared-grid[data-motion-group] > .shared-card[data-motion="reveal"],
.solutions-page .solutions-cta-box[data-motion="reveal"] {
  --motion-distance: 10px;
}

.js-motion-ready .solutions-page .scenario-nav[data-motion="reveal"].is-visible,
.js-motion-ready .solutions-page .overview-grid[data-motion-group] > .overview-card[data-motion="reveal"].is-visible,
.js-motion-ready .solutions-page .section-head[data-motion="reveal"].is-visible,
.js-motion-ready .solutions-page .solutions-cta-box[data-motion="reveal"].is-visible {
  transition-duration: var(--motion-reveal);
}

.js-motion-ready .solutions-page .shared-grid[data-motion-group] > .shared-card[data-motion="reveal"].is-visible {
  transition-duration: 380ms;
}

.solutions-page .solution-card[data-motion="solution-card"] {
  --motion-distance: 12px;
}

.solutions-page .solution-card[data-motion="solution-card"] .solution-side,
.solutions-page .solution-card[data-motion="solution-card"] .solution-content {
  opacity: 1;
  transform: none;
}

.js-motion-ready .solutions-page .solution-card[data-motion="solution-card"].motion-pending .solution-side,
.js-motion-ready .solutions-page .solution-card[data-motion="solution-card"].motion-pending .solution-content {
  opacity: 0;
  transform: translateY(6px);
}

.js-motion-ready .solutions-page .solution-card[data-motion="solution-card"].is-visible {
  transition-duration: 500ms;
}

.js-motion-ready .solutions-page .solution-card[data-motion="solution-card"].is-visible .solution-side {
  transition:
    opacity 420ms var(--ease-entrance) 80ms,
    transform 420ms var(--ease-entrance) 80ms;
}

.js-motion-ready .solutions-page .solution-card[data-motion="solution-card"].is-visible .solution-content {
  transition:
    opacity 440ms var(--ease-entrance) 160ms,
    transform 440ms var(--ease-entrance) 160ms;
}

.solutions-page .process-panel[data-motion="flow"] .section-head,
.solutions-page .process-panel[data-motion="flow"] .process-step {
  opacity: 1;
  transform: none;
}

.solutions-page .process-panel[data-motion="flow"] .process-grid::before {
  opacity: 1;
}

.js-motion-ready .solutions-page .process-panel[data-motion="flow"].motion-pending .section-head,
.js-motion-ready .solutions-page .process-panel[data-motion="flow"].motion-pending .process-step {
  opacity: 0;
  transform: translateY(10px);
}

.js-motion-ready .solutions-page .process-panel[data-motion="flow"].motion-pending .process-grid::before {
  opacity: 0;
}

.js-motion-ready .solutions-page .process-panel[data-motion="flow"].is-visible .section-head {
  transition:
    opacity var(--motion-reveal) var(--ease-entrance),
    transform var(--motion-reveal) var(--ease-entrance);
}

.js-motion-ready .solutions-page .process-panel[data-motion="flow"].is-visible .process-grid::before {
  transition: opacity 360ms var(--ease-entrance) 160ms;
}

.js-motion-ready .solutions-page .process-panel[data-motion="flow"].is-visible .process-step {
  transition:
    opacity 410ms var(--ease-entrance),
    transform 410ms var(--ease-entrance);
}

.js-motion-ready .solutions-page .process-panel[data-motion="flow"].is-visible .process-step:nth-child(1) {
  transition-delay: 120ms;
}

.js-motion-ready .solutions-page .process-panel[data-motion="flow"].is-visible .process-step:nth-child(2) {
  transition-delay: 180ms;
}

.js-motion-ready .solutions-page .process-panel[data-motion="flow"].is-visible .process-step:nth-child(3) {
  transition-delay: 240ms;
}

.js-motion-ready .solutions-page .process-panel[data-motion="flow"].is-visible .process-step:nth-child(4) {
  transition-delay: 300ms;
}

.js-motion-ready .solutions-page .process-panel[data-motion="flow"].is-visible .process-step:nth-child(5) {
  transition-delay: 360ms;
}

.js-motion-ready .solutions-page .process-panel[data-motion="flow"].is-visible .process-step:nth-child(6) {
  transition-delay: 420ms;
}

@media (max-width: 720px) {
  .js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].motion-pending .solutions-hero-grid > div:first-child > h1 {
    --solutions-hero-y: 12px;
  }

  .js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].motion-pending .solutions-hero-grid > div:first-child > .hero-lead,
  .js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].motion-pending .solutions-hero-grid > div:first-child > .hero-actions,
  .js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].motion-pending .hero-proof {
    --solutions-hero-y: 6px;
  }

  .js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].is-visible .solutions-hero-grid > div:first-child > h1 {
    transition-duration: 520ms;
  }

  .js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].is-visible .network-center {
    transition-delay: 300ms;
  }

  .js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].is-visible .network-ring,
  .js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].is-visible .network-connector,
  .js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].is-visible .network-glow {
    transition-delay: 0ms;
  }

  .js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].is-visible .node-merchant,
  .js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].is-visible .node-platform,
  .js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].is-visible .node-public {
    transition-delay: 420ms;
  }

  .js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].is-visible .node-tourism,
  .js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].is-visible .node-wallet,
  .js-motion-ready .solutions-page .solutions-hero[data-motion="solutions-hero"].is-visible .node-bank {
    transition-delay: 500ms;
  }

  .solutions-page .solution-card[data-motion="solution-card"],
  .solutions-page .overview-grid[data-motion-group] > .overview-card[data-motion="reveal"],
  .solutions-page .shared-grid[data-motion-group] > .shared-card[data-motion="reveal"] {
    --motion-distance: var(--motion-distance-compact);
  }

  .js-motion-ready .solutions-page .solution-card[data-motion="solution-card"].is-visible {
    transition-duration: 420ms;
  }

  .js-motion-ready .solutions-page .solution-card[data-motion="solution-card"].is-visible .solution-side {
    transition-duration: 360ms;
    transition-delay: 60ms;
  }

  .js-motion-ready .solutions-page .solution-card[data-motion="solution-card"].is-visible .solution-content {
    transition-duration: 380ms;
    transition-delay: 120ms;
  }

  .js-motion-ready .solutions-page .process-panel[data-motion="flow"].motion-pending .section-head,
  .js-motion-ready .solutions-page .process-panel[data-motion="flow"].motion-pending .process-step {
    transform: translateY(8px);
  }

  .js-motion-ready .solutions-page .process-panel[data-motion="flow"].is-visible .section-head {
    transition-duration: 360ms;
  }

  .js-motion-ready .solutions-page .process-panel[data-motion="flow"].is-visible .process-step {
    transition-duration: 360ms;
  }

  .js-motion-ready .solutions-page .process-panel[data-motion="flow"].is-visible .process-step:nth-child(1) {
    transition-delay: 70ms;
  }

  .js-motion-ready .solutions-page .process-panel[data-motion="flow"].is-visible .process-step:nth-child(2) {
    transition-delay: 110ms;
  }

  .js-motion-ready .solutions-page .process-panel[data-motion="flow"].is-visible .process-step:nth-child(3) {
    transition-delay: 150ms;
  }

  .js-motion-ready .solutions-page .process-panel[data-motion="flow"].is-visible .process-step:nth-child(4) {
    transition-delay: 190ms;
  }

  .js-motion-ready .solutions-page .process-panel[data-motion="flow"].is-visible .process-step:nth-child(5) {
    transition-delay: 230ms;
  }

  .js-motion-ready .solutions-page .process-panel[data-motion="flow"].is-visible .process-step:nth-child(6) {
    transition-delay: 270ms;
  }
}

.merchant-hero .eyebrow,
.merchant-hero h1,
.merchant-hero .hero-lead,
.merchant-hero .hero-actions,
.merchant-hero .hero-pills {
  --merchant-hero-y: var(--motion-distance-reveal);
  --merchant-hero-opacity-start: 0;
  animation-name: newpay-merchant-hero-enter;
  animation-duration: var(--motion-reveal);
  animation-timing-function: var(--ease-entrance);
  animation-fill-mode: both;
}

.merchant-hero .eyebrow {
  --merchant-hero-y: var(--motion-distance-compact);
  animation-duration: 340ms;
}

.merchant-hero h1 {
  --merchant-hero-y: var(--motion-distance-hero);
  animation-duration: 680ms;
  animation-delay: 80ms;
}

.merchant-hero .hero-lead {
  --merchant-hero-y: 14px;
  animation-duration: 480ms;
  animation-delay: 220ms;
}

.merchant-hero .hero-actions {
  --merchant-hero-y: var(--motion-distance-reveal);
  animation-duration: 420ms;
  animation-delay: 340ms;
}

.merchant-hero .hero-pills {
  --merchant-hero-y: var(--motion-distance-compact);
  animation-duration: 360ms;
  animation-delay: 430ms;
}

@keyframes newpay-merchant-hero-enter {
  from {
    opacity: var(--merchant-hero-opacity-start);
    transform: translate3d(0, var(--merchant-hero-y), 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

.merchant-hero-video[data-motion-video] {
  background: #05281f center / cover no-repeat;
}

@media (max-width: 720px) {
  .merchant-hero-video[data-motion-video][data-motion-video-visual="false"],
  .merchant-hero-video[data-motion-video][data-motion-video-playing="blocked"],
  .merchant-hero-video[data-motion-video][data-motion-video-playing="error"] {
    opacity: 0 !important;
  }

  .merchant-hero-video[data-motion-video][data-motion-video-visual="true"] {
    opacity: 1 !important;
  }
}

.service-grid[data-motion-group] > .service-card[data-motion="reveal"],
.method-grid[data-motion-group] > .method-card[data-motion="reveal"],
.wallet-logo-grid[data-motion-group] > .wallet-logo[data-motion="reveal"],
.ops-grid[data-motion-group] > .ops-item[data-motion="reveal"] {
  --motion-distance: 10px;
}

.merchant-app-visual[data-motion="reveal"],
.standee-scene[data-motion="reveal"] {
  --motion-distance: 14px;
}

.standee-copy[data-motion="reveal"],
.download-copy[data-motion="reveal"],
.download-panel[data-motion="reveal"],
.site-wave-footer#contact .site-footer-cta[data-motion="reveal"] {
  --motion-distance: var(--motion-distance-reveal);
}

.js-motion-ready .service-grid[data-motion-group] > .service-card[data-motion="reveal"].is-visible,
.js-motion-ready .method-grid[data-motion-group] > .method-card[data-motion="reveal"].is-visible,
.js-motion-ready .ops-grid[data-motion-group] > .ops-item[data-motion="reveal"].is-visible {
  transition-duration: 420ms;
  transition-delay: calc(var(--motion-order) * 50ms);
}

.js-motion-ready .wallet-logo-grid[data-motion-group] > .wallet-logo[data-motion="reveal"].is-visible {
  transition-duration: 380ms;
  transition-delay: calc(var(--motion-order) * 40ms);
}

.js-motion-ready .merchant-app-visual[data-motion="reveal"].is-visible,
.js-motion-ready .standee-scene[data-motion="reveal"].is-visible {
  transition-duration: 520ms;
  transition-delay: 80ms;
}

.js-motion-ready .standee-copy[data-motion="reveal"].is-visible,
.js-motion-ready .download-copy[data-motion="reveal"].is-visible,
.js-motion-ready .download-panel[data-motion="reveal"].is-visible,
.js-motion-ready .site-wave-footer#contact .site-footer-cta[data-motion="reveal"].is-visible {
  transition-duration: var(--motion-reveal);
}

@media (max-width: 720px) {
  .merchant-hero .eyebrow,
  .merchant-hero .hero-actions,
  .merchant-hero .hero-pills {
    --merchant-hero-y: 6px;
    animation-duration: 300ms;
  }

  .merchant-hero h1 {
    --merchant-hero-y: 18px;
    animation-duration: 560ms;
    animation-delay: 70ms;
  }

  .merchant-hero .hero-lead {
    --merchant-hero-y: 10px;
    animation-duration: 420ms;
    animation-delay: 200ms;
  }

  .merchant-hero .hero-actions {
    animation-delay: 320ms;
  }

  .merchant-hero .hero-pills {
    animation-delay: 390ms;
  }

  .service-grid[data-motion-group] > .service-card[data-motion="reveal"],
  .method-grid[data-motion-group] > .method-card[data-motion="reveal"],
  .wallet-logo-grid[data-motion-group] > .wallet-logo[data-motion="reveal"],
  .ops-grid[data-motion-group] > .ops-item[data-motion="reveal"],
  .merchant-app-visual[data-motion="reveal"],
  .standee-scene[data-motion="reveal"],
  .standee-copy[data-motion="reveal"],
  .download-copy[data-motion="reveal"],
  .download-panel[data-motion="reveal"],
  .site-wave-footer#contact .site-footer-cta[data-motion="reveal"] {
    --motion-distance: var(--motion-distance-compact);
  }

  .js-motion-ready .service-grid[data-motion-group] > .service-card[data-motion="reveal"].is-visible,
  .js-motion-ready .method-grid[data-motion-group] > .method-card[data-motion="reveal"].is-visible,
  .js-motion-ready .ops-grid[data-motion-group] > .ops-item[data-motion="reveal"].is-visible,
  .js-motion-ready .wallet-logo-grid[data-motion-group] > .wallet-logo[data-motion="reveal"].is-visible {
    transition-duration: 360ms;
    transition-delay: calc(var(--motion-order) * var(--motion-stagger-mobile));
  }
}

@media (prefers-reduced-motion: reduce) {
  html,
  html:focus-within {
    scroll-behavior: auto !important;
  }

  *,
  *::before,
  *::after {
    animation-duration: 1ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 1ms !important;
  }

  .js-motion-ready [data-motion],
  .js-motion-ready [data-motion].motion-pending,
  .js-motion-ready [data-motion].is-visible {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
    transition-delay: 0ms !important;
  }

  #home .hero .eyebrow,
  #home .hero h1,
  #home .hero .hero-lead,
  #home .hero .hero-ctas,
  #home .hero-map-bg,
  .merchant-hero .eyebrow,
  .merchant-hero h1,
  .merchant-hero .hero-lead,
  .merchant-hero .hero-actions,
  .merchant-hero .hero-pills {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
  }

  #home .cross-border[data-motion="flow"],
  #home .cross-border[data-motion="flow"] .cross-grid > div:not(.flow-card),
  #home .cross-border[data-motion="flow"] .flow-card,
  #home .cross-border[data-motion="flow"] .flow-step,
  #home .cross-border[data-motion="flow"] .logo-matrix,
  #home .cross-border[data-motion="flow"] .flow-step:not(:last-child)::after,
  #home .developer[data-motion="flow"],
  #home .developer[data-motion="flow"] .developer-grid > div:first-child > .kicker,
  #home .developer[data-motion="flow"] .developer-grid > div:first-child > h2,
  #home .developer[data-motion="flow"] .developer-grid > div:first-child > .section-copy,
  #home .developer[data-motion="flow"] .step,
  #home .developer[data-motion="flow"] .developer-grid > div:first-child > .hero-ctas,
  #home .developer[data-motion="flow"] .code-panel {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
    transition-delay: 0ms !important;
  }

  .products-page .products-hero[data-motion="products-hero"],
  .products-page .products-hero[data-motion="products-hero"] .eyebrow,
  .products-page .products-hero[data-motion="products-hero"] h1,
  .products-page .products-hero[data-motion="products-hero"] .hero-lead,
  .products-page .products-hero[data-motion="products-hero"] .hero-copy,
  .products-page .products-hero[data-motion="products-hero"] .hero-actions,
  .products-page .products-hero[data-motion="products-hero"] .hero-metric,
  .products-page .tech-panel[data-motion="flow"],
  .products-page .tech-panel[data-motion="flow"] .tech-copy,
  .products-page .tech-panel[data-motion="flow"] .api-board,
  .products-page .tech-panel[data-motion="flow"] .api-list li {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
    transition-delay: 0ms !important;
  }

  .products-page .products-hero[data-motion="products-hero"] .products-hero-visual {
    opacity: 1 !important;
    transition: none !important;
    transition-delay: 0ms !important;
  }

  .solutions-page .solutions-hero[data-motion="solutions-hero"],
  .solutions-page .solutions-hero[data-motion="solutions-hero"] .solutions-hero-grid > div:first-child > .eyebrow,
  .solutions-page .solutions-hero[data-motion="solutions-hero"] .solutions-hero-grid > div:first-child > h1,
  .solutions-page .solutions-hero[data-motion="solutions-hero"] .solutions-hero-grid > div:first-child > .hero-lead,
  .solutions-page .solutions-hero[data-motion="solutions-hero"] .solutions-hero-grid > div:first-child > .hero-actions,
  .solutions-page .solutions-hero[data-motion="solutions-hero"] .hero-proof,
  .solutions-page .solutions-hero[data-motion="solutions-hero"] .solutions-hero-visual,
  .solutions-page .solutions-hero[data-motion="solutions-hero"] .network-center,
  .solutions-page .solutions-hero[data-motion="solutions-hero"] .network-node,
  .solutions-page .solutions-hero[data-motion="solutions-hero"] .network-ring,
  .solutions-page .solutions-hero[data-motion="solutions-hero"] .network-connector,
  .solutions-page .solutions-hero[data-motion="solutions-hero"] .network-glow,
  .solutions-page .solution-card[data-motion="solution-card"] .solution-side,
  .solutions-page .solution-card[data-motion="solution-card"] .solution-content,
  .solutions-page .process-panel[data-motion="flow"],
  .solutions-page .process-panel[data-motion="flow"] .section-head,
  .solutions-page .process-panel[data-motion="flow"] .process-step,
  .solutions-page .process-panel[data-motion="flow"] .process-grid::before {
    opacity: 1 !important;
    transition: none !important;
    transition-delay: 0ms !important;
  }
}
