.testimonial-review-card {
  border-radius: 12px;
  cursor: pointer;
  position: relative;
  background: radial-gradient(
    89.36% 183.33% at 37.06% -14.58%,
    rgba(255, 255, 255, 0.0714) 0%,
    rgba(255, 255, 255, 0.0153) 100%
  );
}

.testimonial-review-card::before {
  content: '';
  position: absolute;
  inset: 0;
  padding: 1px;
  border-radius: inherit;
  background:
    radial-gradient(
      98.54% 262.92% at 0% 0%,
      #151515 0%,
      rgba(21, 21, 21, 0) 100%
    ),
    radial-gradient(
      115% 266.82% at 0% 2.79%,
      #6b4eff 0%,
      rgba(107, 78, 255, 0) 100%
    ),
    radial-gradient(
      98.54% 262.92% at 1.46% 0%,
      #ffffff 0%,
      rgba(255, 255, 255, 0) 100%
    );

  -webkit-mask:
    linear-gradient(#fff 0 0) content-box,
    linear-gradient(#fff 0 0);
  mask:
    linear-gradient(#fff 0 0) content-box,
    linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
}

.testimonial-feedback-card {
  background: linear-gradient(
    351deg,
    rgba(55, 52, 69, 0.06) 0%,
    rgba(55, 52, 69, 0.17) 100%
  );

  backdrop-filter: blur(21px);
}

.testimonial-feedback-card::before {
  content: '';
  position: absolute;
  inset: 0;
  padding: 1px;
  background:
    linear-gradient(
      14.78deg,
      rgba(55, 52, 69, 0.0612) 3.84%,
      rgba(55, 52, 69, 0.1656) 103.86%
    ),
    linear-gradient(164.98deg, #373445 -10.78%, rgba(55, 52, 69, 0) 130.84%);

  -webkit-mask:
    linear-gradient(#fff 0 0) content-box,
    linear-gradient(#fff 0 0);
  mask:
    linear-gradient(#fff 0 0) content-box,
    linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
}

.testimonial-heading {
  background: linear-gradient(
    181.83deg,
    #ffffff 1.55%,
    rgba(255, 255, 255, 0.75) 98.45%
  );
  font-size: 2.25rem;
  font-weight: 600;
  line-height: 3.125rem;
  text-align: center;
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
}

#testimonials-wrapper:hover div {
  animation-play-state: paused;
}

#right-2-left-animation {
  animation: right-left 180s infinite linear;
}

@keyframes right-left {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-66.67%);
  }
}

@media screen and (min-width: 640px) {
  .testimonial-heading {
    font-size: 2.75rem;
    line-height: 3.125rem;
  }
}

@media screen and (min-width: 1024px) {
  .testimonial-heading {
    font-size: 3rem;
    line-height: 3.375rem;
  }
}
