<div class="wrap">
  <button class="trial-btn" type="button">
    כאן כותבים מה שרוצים<br />
  </button>
</div>
<script src="https://cdn.jsdelivr.net/npm/gsap@3.12.5/dist/gsap.min.js"></script>
<script>
	const btn = document.querySelector(".trial-btn");
	const wrap = document.querySelector(".wrap");

	const loop = () => {
	  const startX = wrap.clientWidth + 120;
	  const endX = -120;
	  gsap.set(btn, { x: startX });

	  gsap.to(btn, {
		x: endX,
		duration: 12,
		ease: "sine.inOut",
		repeat: -1,
		yoyo: true
	  });
	};

	loop();
</script>
<style>

.wrap {
  position: relative;
  width: 100vw;
  height: 100vh;
  overflow: hidden;
}

.trial-btn {
  position: absolute;
  top: calc(50% - 192px);
  left: 0;
  width: 384px;
  height: 384px;
  border-radius: 999px;
  border: 2px solid rgba(45, 212, 191, 0.7);
  background: rgba(0, 0, 0, 0.8);
  color: #f87171;
  font-weight: 700;
  font-size: 48px;
  line-height: 1.2;
  box-shadow: 0 0 18px rgba(20, 184, 166, 0.45);
  transition: box-shadow 0.3s ease, transform 0.3s ease;
  word-break: break-word;
  white-space: normal;
}

.trial-btn:hover {
  box-shadow:
    0 0 30px rgba(20, 184, 166, 0.85),
    0 0 90px rgba(20, 184, 166, 0.45),
    0 0 160px rgba(20, 184, 166, 0.2);
  transform: translateY(-50%) scale(1.02);
}
</style>