/* Scroll motion is enabled by site.js only on the software home page. */
@media (prefers-reduced-motion: no-preference) {
  html.has-scroll-reveal [data-scroll-reveal] {
    opacity: 0;
    translate: var(--reveal-x, 0) var(--reveal-y, 15px);
    transition:
      opacity .52s cubic-bezier(.16, 1, .3, 1),
      translate .52s cubic-bezier(.16, 1, .3, 1),
      transform .2s ease,
      border-color .2s ease;
    transition-delay: var(--reveal-delay, 0ms);
  }

  html.has-scroll-reveal [data-scroll-reveal="heading"] { --reveal-y: 9px; }
  html.has-scroll-reveal [data-scroll-reveal="metric"] { --reveal-y: 0; }
  html.has-scroll-reveal [data-scroll-reveal="process"] { opacity: 1; translate: none; }
  html.has-scroll-reveal [data-scroll-reveal="form"] { --reveal-x: 18px; --reveal-y: 0; }

  html.has-scroll-reveal [data-scroll-reveal].is-revealed {
    opacity: 1;
    translate: 0 0;
  }

  html.has-scroll-reveal .process-grid::after {
    content: "";
    position: absolute;
    z-index: 0;
    top: 25px;
    left: calc(12.5% - 9px);
    right: calc(12.5% - 9px);
    height: 2px;
    background: var(--lime);
    transform: scaleX(0);
    transform-origin: left center;
  }

  html.has-scroll-reveal .process-grid.is-animated::after {
    transition: transform 1.15s cubic-bezier(.16, 1, .3, 1);
    transform: scaleX(1);
  }

  html.has-scroll-reveal .process-grid.is-animated .process-number {
    animation: process-step 680ms ease-out both;
  }

  html.has-scroll-reveal .process-card:nth-child(2) .process-number { animation-delay: 230ms; }
  html.has-scroll-reveal .process-card:nth-child(3) .process-number { animation-delay: 460ms; }
  html.has-scroll-reveal .process-card:nth-child(4) .process-number { animation-delay: 690ms; }

  @keyframes process-step {
    0%, 100% { background: var(--lime); border-color: var(--lime); transform: scale(1); }
    42%, 72% { background: #c4ed83; border-color: #c4ed83; transform: scale(1.07); }
  }
}

@media (min-width: 701px) and (max-width: 900px) and (prefers-reduced-motion: no-preference) {
  html.has-scroll-reveal .process-grid::after { left: calc(12.5% - 6.75px); right: calc(12.5% - 6.75px); }
}

@media (max-width: 700px) {
  html.has-scroll-reveal [data-scroll-reveal] { transition-delay: 0ms; }
  html.has-scroll-reveal [data-scroll-reveal="form"] { --reveal-x: 0; --reveal-y: 12px; }
}

@media (max-width: 700px) and (prefers-reduced-motion: no-preference) {
  html.has-scroll-reveal .process-grid::after {
    top: 26px;
    bottom: 26px;
    left: 25px;
    right: auto;
    width: 2px;
    height: auto;
    transform: scaleY(0);
    transform-origin: center top;
  }

  html.has-scroll-reveal .process-grid.is-animated::after { transform: scaleY(1); }
}

@media print {
  html.has-scroll-reveal [data-scroll-reveal] { opacity: 1 !important; translate: none !important; }
}
