.logo-scatter {
    display: inline-flex;
    align-items: center;
    overflow: visible;
  }

  .logo-scatter .logo-letter {
    display: block;
    flex: 0 0 auto;

    /* Наведение отслеживает неподвижный контейнер. */
    pointer-events: none;
  }

  .logo-scatter .logo-letter-motion {
    display: block;
    pointer-events: none;
    transform: translate(0, 0);
    transition:
      transform 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
    will-change: transform;
  }

  .logo-scatter.logo-scatter--active .logo-letter-motion {
    transition: transform 0.08s ease-out;
  }

  @media (prefers-reduced-motion: reduce) {
    .logo-scatter .logo-letter-motion {
      transform: none !important;
      transition: none !important;
      will-change: auto;
    }
  }
</style>