

@media (prefers-reduced-motion: no-preference) {

  .wz-em.is-rv .wz-em-rv:not(.is-in) { opacity: 0; translate: 0 14px; }
  .wz-em.is-rv .wz-em-rv.is-in {
    transition:
      opacity .5s ease-out var(--wz-em-rv-d, 0s),
      translate .5s cubic-bezier(.16, 1, .3, 1) var(--wz-em-rv-d, 0s);
  }

  .wz-em.is-rv .wz-em__flow.is-on .wz-em__flow-line {
    transform-origin: 0 0;
    animation: wz-em-gambar .55s cubic-bezier(.16, 1, .3, 1) calc(var(--wz-em-rv-d, 0s) + .2s) both;
  }
  .wz-em.is-rv .wz-em__flow.is-on .wz-em__flow-line:last-child { animation-delay: calc(var(--wz-em-rv-d, 0s) + .85s); }
  .wz-em.is-rv .wz-em__flow.is-on .wz-em__flow-box {
    animation: wz-em-letup .55s cubic-bezier(.34, 1.56, .64, 1) calc(var(--wz-em-rv-d, 0s) + .5s) both;
  }

  .wz-em.is-rv .wz-em__scenario.is-on .wz-em__scenario-strip {
    animation: wz-em-turun .45s ease-out calc(var(--wz-em-rv-d, 0s) + .55s) both;
  }

  .wz-em.is-rv .wz-em__scenario--inbox.is-on .wz-em__scenario-strip { animation-delay: calc(var(--wz-em-rv-d, 0s) + 1.25s); }
  .wz-em.is-rv .wz-em__scenario--inbox.is-on .wz-em__scenario-mail {
    animation: wz-em-nyala 1.4s ease-out calc(var(--wz-em-rv-d, 0s) + 1.35s);
  }

  .wz-em.is-rv .wz-em__feature-card.is-on .wz-em__feature-icon {
    animation: wz-em-letup .5s cubic-bezier(.34, 1.56, .64, 1) calc(var(--wz-em-rv-d, 0s) + .18s) both;
  }

  .wz-em.is-rv .wz-em__campaignstage.is-on .wz-em__newsletter {
    animation: wz-em-naik .7s cubic-bezier(.16, 1, .3, 1) calc(var(--wz-em-rv-d, 0s) + .3s) both;
  }
  .wz-em.is-rv .wz-em__campaignstage.is-on .wz-em__editor-step--active i {
    animation: wz-em-denyut 1.1s ease-out calc(var(--wz-em-rv-d, 0s) + 1s) 2;
  }

  .wz-em.is-rv .wz-em__api-preview.is-on .wz-em__api-preview-body > * {
    animation: wz-em-naik .5s cubic-bezier(.16, 1, .3, 1) both;
  }
  .wz-em.is-rv .wz-em__api-preview.is-on .wz-em__api-preview-body > :nth-child(1) { animation-delay: calc(var(--wz-em-rv-d, 0s) + .25s); }
  .wz-em.is-rv .wz-em__api-preview.is-on .wz-em__api-preview-body > :nth-child(2) { animation-delay: calc(var(--wz-em-rv-d, 0s) + .4s); }
  .wz-em.is-rv .wz-em__api-preview.is-on .wz-em__api-preview-body > :nth-child(n+3) { animation-delay: calc(var(--wz-em-rv-d, 0s) + .55s); }
  .wz-em.is-rv .wz-em__api-preview.is-on .wz-em__api-response {
    animation: wz-em-letup .5s cubic-bezier(.34, 1.56, .64, 1) calc(var(--wz-em-rv-d, 0s) + .95s) both;
  }

  .wz-em.is-rv .wz-em__credit-value { font-variant-numeric: tabular-nums; }
  .wz-em.is-rv .wz-em__credit-col.is-on .wz-em__credit-plan::before {
    animation: wz-em-bilah .7s cubic-bezier(.16, 1, .3, 1) calc(var(--wz-em-rv-d, 0s) + .15s) both;
  }

  @media (hover: hover) {
    .wz-em__feature-card { transition: translate .25s ease, box-shadow .25s ease, border-color .25s ease; }
    .wz-em__feature-card:hover {
      translate: 0 -3px;
      border-color: color-mix(in srgb, var(--k) 35%, white);
      box-shadow: 0 16px 30px -20px color-mix(in srgb, var(--k) 45%, transparent);
    }
  }
}

@keyframes wz-em-gambar { from { transform: scale(0); } }
@keyframes wz-em-letup { from { opacity: 0; scale: .6; } }
@keyframes wz-em-turun { from { opacity: 0; translate: 0 -8px; } }
@keyframes wz-em-naik { from { opacity: 0; translate: 0 16px; } }
@keyframes wz-em-bilah { from { width: 0; } }
@keyframes wz-em-nyala {
  0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--wz-green) 34%, transparent); }
  100% { box-shadow: 0 0 0 16px color-mix(in srgb, var(--wz-green) 0%, transparent); }
}
@keyframes wz-em-denyut {
  0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--wz-btn-bg) 45%, transparent); }
  100% { box-shadow: 0 0 0 9px color-mix(in srgb, var(--wz-btn-bg) 0%, transparent); }
}
