@media (min-width: 1101px) and (min-height: 741px) and (prefers-reduced-motion: no-preference) {
  .principles-layer .principle { animation: float-principle 23s ease-in-out infinite; }
  .principle.customer { --drift-x: 12px; --drift-y: -17px; animation-duration: 23s; animation-delay: -3s; }
  .principle.invent { --drift-x: -14px; --drift-y: 19px; animation-duration: 29s; animation-delay: -11s; }
  .principle.think { --drift-x: -12px; --drift-y: 18px; animation-duration: 26s; animation-delay: -7s; }
  .principle.action { --drift-x: 13px; --drift-y: -16px; animation-duration: 31s; animation-delay: -19s; }
  .principle.deliver { --drift-x: 6px; --drift-y: -3px; animation: float-principle 21s ease-in-out -5s infinite; }
  .principle-connectors { opacity: .35; }
}
@keyframes float-principle {
  0%, 100% { transform: translate3d(0, 0, 0); }
  25% { transform: translate3d(var(--drift-x), var(--drift-y), 0); }
  50% { transform: translate3d(calc(var(--drift-x) * -.6), calc(var(--drift-y) * .4), 0); }
  75% { transform: translate3d(calc(var(--drift-x) * -.8), calc(var(--drift-y) * -.7), 0); }
}