/* Subtle motion for the original homepage scenario illustrations. */

.animated-legacy-scene svg {
  overflow: visible;
}

.animated-legacy-scene circle,
.animated-legacy-scene ellipse,
.animated-legacy-scene polygon,
.animated-legacy-scene path,
.animated-legacy-scene line,
.animated-legacy-scene rect {
  transform-box: fill-box;
  transform-origin: center;
}

.target-legacy svg > circle:nth-of-type(1),
.target-legacy svg > circle:nth-of-type(2) {
  animation: legacyPulseRing 3.8s ease-in-out infinite;
}

.target-legacy svg > circle:nth-of-type(n+3):nth-of-type(-n+7) {
  animation: legacyNodeFloat 4.2s ease-in-out infinite;
}

.target-legacy svg > line {
  stroke-dasharray: 5 8;
  animation: legacyDataFlow 3.6s linear infinite;
}

.target-legacy svg > rect {
  animation: legacyScoreGlow 3.4s ease-in-out infinite;
}

.gen-legacy svg > ellipse {
  stroke-dasharray: 6 5;
  animation: legacyPocketDrift 4s linear infinite;
}

.gen-legacy svg > circle:not(.diffuse-dot) {
  animation: legacyLigandSettle 3.2s ease-in-out infinite;
}

.gen-legacy svg > line {
  stroke-dasharray: 14 10;
  animation: legacyDataFlow 3.2s linear infinite;
}

.gen-legacy .diffuse-dot {
  animation: diffuseFloat 6s ease-in-out infinite, legacyDotBlink 2.8s ease-in-out infinite;
}

.deliver-legacy svg > circle {
  animation: legacyCarrierBreathe 4s ease-in-out infinite;
}

.deliver-legacy svg > path:first-of-type {
  stroke-dasharray: 22 14;
  animation: legacyReleaseFlow 2.4s linear infinite;
}

.deliver-legacy svg > path:nth-of-type(2) {
  animation: legacyReleaseFill 3.8s ease-in-out infinite;
}

.deliver-legacy svg > rect {
  animation: legacyScoreGlow 3.6s ease-in-out infinite;
}

.hci-reveal {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity 0.55s cubic-bezier(.4,0,.2,1), transform 0.55s cubic-bezier(.4,0,.2,1);
}

.hci-reveal.visible {
  opacity: 1;
  transform: translateY(0);
}

.magnetic-hover { will-change: transform; }

@keyframes legacyPulseRing {
  0%, 100% { transform: scale(1); opacity: 0.24; }
  50% { transform: scale(1.06); opacity: 0.46; }
}

@keyframes legacyNodeFloat {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-3px); }
}

@keyframes legacyDataFlow {
  from { stroke-dashoffset: 0; }
  to { stroke-dashoffset: -48; }
}

@keyframes legacyScoreGlow {
  0%, 100% { filter: drop-shadow(0 0 0 rgba(37,99,235,0)); }
  50% { filter: drop-shadow(0 8px 14px rgba(37,99,235,0.15)); }
}

@keyframes legacyPocketDrift {
  from { stroke-dashoffset: 0; }
  to { stroke-dashoffset: -44; }
}

@keyframes legacyLigandSettle {
  0%, 100% { transform: translate(0, 0); }
  50% { transform: translate(1.5px, -2px); }
}

@keyframes legacyDotBlink {
  0%, 100% { opacity: 0.22; }
  50% { opacity: 0.48; }
}

@keyframes legacyCarrierBreathe {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.045); }
}

@keyframes legacyReleaseFlow {
  from { stroke-dashoffset: 0; }
  to { stroke-dashoffset: -72; }
}

@keyframes legacyReleaseFill {
  0%, 100% { opacity: 0.42; }
  50% { opacity: 0.78; }
}

@media (prefers-reduced-motion: reduce) {
  .animated-legacy-scene *,
  .hci-reveal {
    animation: none !important;
    transition: none !important;
  }

  .hci-reveal {
    opacity: 1;
    transform: none;
  }
}
