.block-clip-rb {
  clip-path: polygon(0 0, 100% 0%, 100% 80%, 0% 100%);
}

.block-clip-lt{
  clip-path: polygon(0 50%, 100% 0, 100% 100%, 0% 100%);
}

.block-clip-lb{
  clip-path: polygon(0 0, 100% 0, 100% 50%, 0% 100%);
}

.redial-gradient-dark{
  background: rgb(1,28,26);
  background: radial-gradient(circle, rgba(1,28,26,0) 0%, rgba(1,28,26,0.52) 100%);
}

@keyframes animation-left-to-right{
  from {
    transform: translateX(-7px)
  }
  to{
    transform: translateX(7px)
  }
}
@keyframes animation-top-to-bottom{
  from {
    transform: translateY(7px)
  }
  to{
    transform: translateY(-7px)
  }
}

.animation-left-to-right{
  animation: animation-left-to-right 1.5s linear infinite alternate;
}
.animation-top-to-bottom{
  animation: animation-top-to-bottom 1s linear infinite alternate;
}
@keyframes fadeInDown {
  0% {
    opacity: 0;
    transform: translate3d(0, -100%, 0);
  }

  100% {
    opacity: 1;
    transform: translateZ(0);
  }
}

.scrolling {
  position: fixed;
  width: 100%;
  top:0;
  animation: fadeInDown 0.9s 1;
  backdrop-filter: blur(10px);
}
.scrolling.bg-invert{
  background: rgba(255, 255, 255, 0.7)
  
}

.dark .scrolling.bg-invert{
  background: rgba(17, 24, 39, 0.87)

}
.scrolling.bg-dark{
  background: rgba(0, 0, 0, 0.5)
}

/* Preloader styles */
.preloader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #543EE8;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
  transition: transform 1s ease-in-out;
}

/* Typing animation */
.typing-animation {
  font-size: 3rem;
  color: white;
  white-space: nowrap;
  overflow: hidden;
  display: inline-block;
  animation: typing 2s steps(50, end) infinite, blink 0.75s step-end infinite;
}

@keyframes typing {
  from { width: 0; opacity:0}
  to { width: 100%; opacity:1}
}

@keyframes blink {
  from, to { border-color: transparent; }
  50% { border-color: white; }
}

/* Hide main content during preloading */
.page-wrapper {
  display: none;
}

/* Preloader hide animation */
.preloader.hide {
  transform: translateY(-100%);
}

/* Show main content after preloader is hidden */
.page-wrapper.show {
  display: block;
}

.element-move,
.element-move-x {
  transition: transform 0.3s ease; /* Adjust duration and easing as needed */
}
