.fu-process-visual {
  width: min(100%, 980px);
  margin: clamp(20px, 3vw, 38px) auto clamp(38px, 5vw, 64px);
  opacity: 0;
  transform: translateY(22px) scale(.985);
  transition: opacity .7s ease, transform .8s cubic-bezier(.2,.75,.25,1);
}

.fu-process-visual.is-visible {
  opacity: 1;
  transform: translateY(0) scale(1);
}

.fu-process-visual__image-wrap {
  overflow: hidden;
  border-radius: 18px;
  background: #eaeff3;
  box-shadow: 0 16px 36px rgba(31, 45, 61, .16), 0 3px 10px rgba(31, 45, 61, .07);
  transform: translateZ(0);
}

.fu-process-visual img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  transition: transform 1.1s cubic-bezier(.2,.75,.25,1), filter .6s ease;
}

.fu-process-visual.is-visible img {
  animation: fu-process-image-settle 8s ease-in-out infinite alternate;
}

.fu-process-visual:hover img {
  transform: scale(1.035);
  filter: saturate(1.04);
}

@keyframes fu-process-image-settle {
  from { transform: scale(1); }
  to { transform: scale(1.022); }
}

@media (max-width: 767px) {
  .fu-process-visual {
    width: 100%;
    margin: 18px auto 34px;
  }
  .fu-process-visual__image-wrap {
    border-radius: 12px;
    box-shadow: 0 10px 24px rgba(31, 45, 61, .15), 0 2px 6px rgba(31, 45, 61, .06);
  }
}

@media (prefers-reduced-motion: reduce) {
  .fu-process-visual,
  .fu-process-visual img {
    animation: none !important;
    transition: none !important;
    opacity: 1;
    transform: none;
  }
}