/* Leadpulse motion: появление при скролле, живой первый экран, счётчики.
   Всё на transform/opacity (дёшево для GPU), отключается при prefers-reduced-motion. */
.lp-rot { display: inline-flex; align-items: center; gap: 10px; margin: 0 0 24px; padding: 8px 16px 8px 12px; border-radius: 999px; background: rgba(255,255,255,.12); color: #fff; font-size: 16px; line-height: 20px; backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
.lp-rot::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: #5BF5A0; box-shadow: 0 0 0 0 rgba(91,245,160,.6); }
.lp-rot__box { position: relative; display: inline-block; height: 20px; overflow: hidden; vertical-align: top; }
.lp-rot__w { display: inline-block; white-space: nowrap; font-weight: 500; }
.lp-rot__w + .lp-rot__w { position: absolute; left: 0; top: 0; visibility: hidden; }
html.lp-motion .lp-rot__w + .lp-rot__w { visibility: visible; }
@media (max-width: 1050px) { .lp-rot { font-size: 14px; margin-bottom: 16px; } }

@media (prefers-reduced-motion: no-preference) {
  /* появление */
  html.lp-motion .lp-r { opacity: 0; transform: translate3d(0, 32px, 0); transition: opacity .9s cubic-bezier(.2,.8,.2,1), transform .9s cubic-bezier(.2,.8,.2,1); transition-delay: var(--lp-d, 0ms); }
  html.lp-motion .lp-r.lp-in { opacity: 1; transform: none; }
  html.lp-motion .lp-r--fade { transform: none; }

  /* первый экран: переливающийся фон */
  .mainblock.index { position: relative; overflow: hidden; isolation: isolate; }
  .mainblock.index::before, .mainblock.index::after { content: ""; position: absolute; z-index: -1; width: 70vw; height: 70vw; max-width: 1000px; max-height: 1000px; border-radius: 50%; pointer-events: none; will-change: transform; }
  .mainblock.index::before { top: -35%; left: -20%; background: radial-gradient(closest-side, rgba(157,97,255,.75), rgba(157,97,255,0)); animation: lpAur1 16s ease-in-out infinite alternate; }
  .mainblock.index::after { right: -25%; top: 10%; background: radial-gradient(closest-side, rgba(0,194,255,.55), rgba(0,194,255,0)); animation: lpAur2 20s ease-in-out infinite alternate; }
  @keyframes lpAur1 { to { transform: translate3d(35vw, 20vh, 0) scale(1.2); } }
  @keyframes lpAur2 { to { transform: translate3d(-30vw, 25vh, 0) scale(.9); } }

  /* иллюстрация «парит» */
  .mainblock.index .part-1 img { animation: lpFloat 7s ease-in-out infinite; }
  @keyframes lpFloat { 50% { transform: translate3d(0, -16px, 0) rotate(-1.5deg); } }

  /* смена слов */
  .lp-rot::before { animation: lpPulse 2s ease-out infinite; }
  @keyframes lpPulse { 70%, 100% { box-shadow: 0 0 0 8px rgba(91,245,160,0); } }
  .lp-rot__w { transition: transform .6s cubic-bezier(.2,.8,.2,1), opacity .6s; }
  .lp-rot__w.is-next { transform: translateY(110%); opacity: 0; }
  .lp-rot__w.is-prev { transform: translateY(-110%); opacity: 0; }
  .lp-rot__box { transition: width .5s cubic-bezier(.2,.8,.2,1); }
}
@media (prefers-reduced-motion: no-preference) {
  html.lp-motion .mainblock .part-1 .lp-r { transition-duration: .7s; }
}
@media (max-width: 400px) { .lp-rot { font-size: 13px; gap: 8px; padding: 7px 12px 7px 10px; } }
