/* [project]/src/components/background/floatingGradientBackground/FloatingGradientBackground.css [app-client] (css) */
.floating-gradient-background-container {
  --circle-size: 80%;
  --circle-size-small: 60%;
  --blending: hard-light;
}

.floating-gradient-background-circle-one {
  background: radial-gradient(circle at center, var(--color-background-accent) 0, #fff0 50%) no-repeat;
  mix-blend-mode: var(--blending);
  width: var(--circle-size);
  height: var(--circle-size);
  top: calc(50% - var(--circle-size-small) / 2);
  left: calc(50% - var(--circle-size-small) / 2);
  transform-origin: center;
  animation: 20s infinite moveVertical;
}

.floating-gradient-background-circle-two {
  background: radial-gradient(circle at center, var(--color-accent) 0, #fff0 50%) no-repeat;
  mix-blend-mode: var(--blending);
  width: var(--circle-size);
  height: var(--circle-size);
  top: calc(50% - var(--circle-size-small) / 2);
  left: calc(50% - var(--circle-size-small) / 2);
  transform-origin: calc(50% - 400px);
  animation: 20s infinite reverse moveInCircle;
}

.floating-gradient-background-circle-three {
  background: radial-gradient(circle at center, var(--color-primary-cta) 0, #fff0 50%) no-repeat;
  mix-blend-mode: var(--blending);
  width: var(--circle-size-small);
  height: var(--circle-size-small);
  top: calc(50% - var(--circle-size) / 2 + 200px);
  left: calc(50% - var(--circle-size) / 2 - 500px);
  transform-origin: calc(50% + 400px);
  animation: 30s linear infinite moveInCircle;
}

.floating-gradient-background-circle-four {
  background: radial-gradient(circle at center, var(--color-background-accent) 0, #fff0 50%) no-repeat;
  mix-blend-mode: var(--blending);
  width: var(--circle-size-small);
  height: var(--circle-size-small);
  top: calc(50% - var(--circle-size) / 2);
  left: calc(50% - var(--circle-size) / 2);
  transform-origin: calc(50% - 200px);
  animation: 30s infinite moveHorizontal;
}

.floating-gradient-background-circle-five {
  background: radial-gradient(circle at center, var(--color-primary-cta) 0, #fff0 50%) no-repeat;
  mix-blend-mode: var(--blending);
  width: calc(var(--circle-size-small) * 2);
  height: calc(var(--circle-size-small) * 2);
  top: calc(50% - var(--circle-size));
  left: calc(50% - var(--circle-size));
  transform-origin: calc(50% - 800px) calc(50% + 200px);
  animation: 20s infinite moveInCircle;
}

@keyframes moveInCircle {
  0% {
    transform: rotate(0);
  }

  50% {
    transform: rotate(180deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

@keyframes moveVertical {
  0% {
    transform: translateY(-50%);
  }

  50% {
    transform: translateY(50%);
  }

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

@keyframes moveHorizontal {
  0% {
    transform: translateX(-50%)translateY(-10%);
  }

  50% {
    transform: translateX(50%)translateY(10%);
  }

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

/* [project]/src/components/button/ButtonShiftHover/ShiftButton.css [app-client] (css) */
.shift-button [data-button-animate-chars] span {
  text-shadow: 0px calc(var(--text-sm) * 1.5) currentColor;
  transition: transform .6s cubic-bezier(.215, .61, .355, 1);
  display: inline-block;
  position: relative;
  transform: translateY(0)rotate(.001deg);
}

.shift-button:hover [data-button-animate-chars] span {
  transform: translateY(calc(var(--text-sm) * -1.5)) rotate(.001deg);
}

.shift-button:hover .shift-button-bg {
  transform: scale(.975);
}

@media (max-width: 768px) {
  .shift-button [data-button-animate-chars] span {
    text-shadow: 0px calc(var(--text-sm) * 1.5) currentColor;
  }

  .shift-button:hover [data-button-animate-chars] span {
    transform: translateY(0)rotate(0);
  }

  .shift-button:hover .shift-button-bg {
    transform: scale(1);
  }
}

/* [project]/src/components/button/ButtonTextStagger/StaggerButton.css [app-client] (css) */
.stagger-button [data-button-animate-chars] span {
  text-shadow: 0px calc(var(--text-sm) * 1.5) currentColor;
  transition: transform .6s cubic-bezier(.215, .61, .355, 1);
  display: inline-block;
  position: relative;
  transform: translateY(0)rotate(.001deg);
}

.stagger-button:hover [data-button-animate-chars] span {
  transform: translateY(calc(var(--text-sm) * -1.5)) rotate(.001deg);
}

.stagger-button:hover .stagger-button-bg {
  transform: scale(.975);
}

@media (max-width: 768px) {
  .stagger-button [data-button-animate-chars] span {
    text-shadow: 0px calc(var(--text-sm) * 1.5) currentColor;
  }

  .stagger-button:hover [data-button-animate-chars] span {
    transform: translateY(0)rotate(0);
  }

  .stagger-button:hover .stagger-button-bg {
    transform: scale(1);
  }
}

/* [project]/src/components/button/ButtonBounceEffect/BounceButton.css [app-client] (css) */
.bounce-button {
  --ease-elastic: linear(0, .55 7.5%, .85 12%, .95 14%, 1.03 16.5%, 1.09 20%, 1.13 22%, 1.14 23%, 1.15 24.5%, 1.15 26%, 1.13 28%, 1.11 31%, 1.05 39%, 1.02 43%, .99 47%, .98 52%, .97 59%, 1.002 81%, 1);
  transition: transform .65s var(--ease-elastic);
}

.bounce-button [data-button-animate-chars] span {
  text-shadow: 0px calc(var(--text-sm) * 1.5) currentColor;
  transition: transform .65s var(--ease-elastic);
  display: inline-block;
  position: relative;
  transform: translateY(0)rotate(.001deg);
}

.bounce-button:hover {
  transform: scale(.92)rotate(-3deg);
}

.bounce-button:hover [data-button-animate-chars] span {
  transform: translateY(calc(var(--text-sm) * -1.5)) rotate(3deg);
}

@media (max-width: 768px) {
  .bounce-button:hover {
    transform: scale(1)rotate(0);
  }

  .bounce-button:hover [data-button-animate-chars] span {
    transform: translateY(0)rotate(0);
  }
}

/* [project]/src/components/button/ButtonDirectionalHover/DirectionalButton.css [app-client] (css) */
.directional-button-circle-wrap {
  border-radius: inherit;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
}

.directional-button-circle {
  pointer-events: none;
  border-radius: 50%;
  width: 100%;
  transition: transform .7s cubic-bezier(.625, .05, 0, 1);
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%)scale(0)rotate(.001deg);
}

.directional-button-circle:before {
  content: "";
  padding-top: 100%;
  display: block;
}

.directional-button:hover .directional-button-circle {
  transform: translate(-50%, -50%)scale(1)rotate(.001deg);
}

@media (max-width: 768px) {
  .directional-button:hover .directional-button-circle {
    transform: translate(-50%, -50%)scale(0)rotate(.001deg);
  }
}

/* [project]/src/components/button/ButtonTextShift/TextShiftButton.css [app-client] (css) */
.stagger-button [data-button-animate-chars] span {
  text-shadow: 0px calc(var(--text-sm) * 1.5) currentColor;
  transition: transform .6s cubic-bezier(.215, .61, .355, 1);
  display: inline-block;
  position: relative;
  transform: translateY(0)rotate(.001deg);
}

.stagger-button:hover [data-button-animate-chars] span {
  transform: translateY(calc(var(--text-sm) * -1.5)) rotate(.001deg);
}

@media (max-width: 768px) {
  .stagger-button [data-button-animate-chars] span {
    text-shadow: 0px calc(var(--text-sm) * 1.5) currentColor;
  }

  .stagger-button:hover [data-button-animate-chars] span {
    transform: translateY(0)rotate(0);
  }
}

/*# sourceMappingURL=src_components_e79d92db._.css.map*/