/* Localized photographic light activity. The overlay shares the photo's exact
   cover crop, media shift, scale and timing so LEDs stay on their hardware. */
.service-card .service-media { border-radius: inherit; isolation: isolate; }
.service-card .service-media .machine-layer {
  position: absolute;
  inset: 0 auto auto 0;
  display: block;
  width: 100%;
  height: calc(100% + 42px);
  overflow: hidden;
  pointer-events: none;
  transform: translate3d(0,var(--media-shift,-16px),0) scale(1.035);
  transform-origin: 50% 50%;
  transition: transform .5s cubic-bezier(.22,.61,.36,1);
  mix-blend-mode: screen;
}
.service-card:hover .service-media .machine-layer {
  transform: translate3d(0,var(--media-shift,-16px),0) scale(1.065);
}
.machine-led {
  opacity: .14;
  animation: machine-led-activity var(--machine-period,5s) ease-in-out var(--machine-delay,0s) infinite;
}
@keyframes machine-led-activity {
  0%, 13%, 52%, 100% { opacity: .08; }
  22%, 29% { opacity: .82; }
  38% { opacity: .2; }
  69%, 78% { opacity: .45; }
  88% { opacity: .13; }
}
.machine-screen-sweep {
  opacity: .7;
  animation: machine-screen-scan 12s linear -3s infinite;
}
@keyframes machine-screen-scan {
  from { transform: translateX(-360px); }
  to { transform: translateX(1536px); }
}
.machine-screen-trace {
  fill: none;
  stroke: #81cfff;
  stroke-width: 1.4;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: 36 420;
  opacity: .42;
  animation: machine-screen-data 8s linear infinite;
}
.machine-screen-trace-delayed { animation-delay: -4s; animation-duration: 11s; opacity: .32; }
.machine-screen-trace-slow { animation-delay: -2s; animation-duration: 13s; }
@keyframes machine-screen-data {
  from { stroke-dashoffset: 456; }
  to { stroke-dashoffset: 0; }
}
.service-card[data-machine-running="false"] .machine-layer *,
.site-page.motion-paused .machine-layer * { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce) {
  .service-card .service-media .machine-layer,
  .service-card:hover .service-media .machine-layer { transform: none; transition: none; }
  .machine-layer * { animation: none !important; }
  .machine-layer { opacity: 0; }
}
