.hero{
  position:relative;
  overflow:hidden;
}

.hero-words{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  overflow:hidden;
  pointer-events:none;
  z-index:20;
}

.drop-word{
  position:absolute;
  left:var(--x);
  top:var(--y);

  font-family:'Inter',sans-serif;
  font-size:8px;
  font-weight:500;
  line-height:1;

  color:#242AD7;
  white-space:nowrap;

  opacity:0;

  transform:scale(.7) scaleX(1.35) scaleY(.75);
  transform-origin:center;
  filter:blur(6px);

  animation:liquidWord 1.4s cubic-bezier(.19,1,.22,1) forwards;
  animation-delay:var(--d);
}

@keyframes liquidWord{
  0%{
    opacity:0;
    transform:scale(.7) scaleX(1.35) scaleY(.75);
    filter:blur(6px);
  }

  30%{
    opacity:.35;
    transform:scale(.88) scaleX(.72) scaleY(1.28);
    filter:blur(4px);
  }

  55%{
    opacity:.7;
    transform:scale(1.02) scaleX(1.18) scaleY(.88);
    filter:blur(1.5px);
  }

  78%{
    opacity:1;
    transform:scale(1.03) scaleX(.94) scaleY(1.06);
    filter:blur(.3px);
  }

  100%{
    opacity:1;
    transform:scale(1) scaleX(1) scaleY(1);
    filter:blur(0);
  }
}

.ticker-wrap{
  position:relative;
  width:100vw;
  overflow:hidden;
  background:#242AD7;
  padding:9px 0;
}

.ticker{
  display:flex;
  width:max-content;
  animation:tickerMove 22s linear infinite;
}

.ticker span{
  display:flex;
  align-items:center;

  font-family:'Inter',sans-serif;
  font-size:10px;
  font-weight:500;

  letter-spacing:.08em;
  text-transform:uppercase;
  white-space:nowrap;

  color:#F7F7F7;

  padding-right:40px;
}

@keyframes tickerMove{
  0%{
    transform:translateX(0);
  }

  100%{
    transform:translateX(-50%);
  }
}

/* МОБИЛЬНАЯ */

@media(max-width:980px){

  .hero-words .w1{
    --x:58% !important;
    --y:18% !important;
  }

  .hero-words .w2{
    --x:26% !important;
    --y:33% !important;
  }

  .hero-words .w3{
    --x:86% !important;
    --y:24% !important;
  }

  .hero-words .w4{
    --x:73% !important;
    --y:46% !important;
  }

  .hero-words .w5{
    --x:40% !important;
    --y:58% !important;
  }

  .hero-words .w6{
    --x:83% !important;
    --y:80% !important;
  }

  /* Базовое SEO левее */

  .hero-words .w7{
    --x:12% !important;
    --y:52% !important;
  }

  .hero-words .w8{
    --x:72% !important;
    --y:92% !important;
  }

}