  main::-webkit-scrollbar {
    display: none;
    /* cursor: url('/assets/cursor.png') 4 4, auto; */
  }

  body {
    cursor: url('/assets/custom_cursor.png'), auto;
    scroll-behavior: smooth;
  }

  main {
    -ms-overflow-style: none;
    scrollbar-width: none;
    scroll-behavior: smooth;
  }

  html {
    scroll-behavior: smooth;
    font-family: "Inter";

  }

  @keyframes slide-horizontal {
    0% {
      transform: translateX(0%);
    }

    100% {
      transform: translateX(-50%);
    }
  }

  .animate-slide {
    animation: slide-horizontal 90s linear infinite;
  }

  .hide-scrollbar::-webkit-scrollbar {
    display: none;
  }

  .hide-scrollbar {
    -ms-overflow-style: none;
    /* IE and Edge */
    scrollbar-width: none;
    /* Firefox */
  }




  /* Particle Styles */
  .particle {
    position: absolute;
    width: 12px;
    height: 12px;
    background: rgba(248, 227, 158, 1);
    border-radius: 50%;
    box-shadow: 0 0 12px rgba(248, 227, 158, 0.8);
    animation: floatParticle 5s ease-in-out infinite;
    opacity: 0;
    will-change: transform, opacity;
  }

  @keyframes floatParticle {
    0% {
      transform: translateY(0px) translateX(0px) scale(1);
      opacity: 0;
    }

    10% {
      opacity: 1;
    }

    50% {
      transform: translateY(-60px) translateX(20px) scale(1.3);
      opacity: 1;
    }

    90% {
      opacity: 0;
    }

    100% {
      transform: translateY(0px) translateX(0px) scale(1);
      opacity: 0;
    }
  }

  .particle {
    will-change: transform, opacity;
  }


  /* Floating animation */
  @keyframes float {
    0% {
      transform: translate(0, 0) scale(1);
      opacity: 0.9;
    }

    25% {
      transform: translate(12px, -18px) scale(1.1);
      opacity: 1;
    }

    50% {
      transform: translate(-15px, -25px) scale(0.95);
      opacity: 0.8;
    }

    75% {
      transform: translate(18px, 15px) scale(1.05);
      opacity: 1;
    }

    100% {
      transform: translate(0, 0) scale(1);
      opacity: 0.9;
    }
  }

  /* Apply to all balls */
  #faq .absolute>div {
    animation: float 8s ease-in-out infinite;
  }

  /* Randomize speed so they don't sync */
  #faq .absolute>div:nth-child(3n) {
    animation-duration: 10s;
  }

  #faq .absolute>div:nth-child(4n) {
    animation-duration: 12s;
  }

  #faq .absolute>div:nth-child(5n) {
    animation-duration: 14s;
  }

  @keyframes float {
    0% {
      transform: translateY(0px);
    }

    50% {
      transform: translateY(-20px);
    }

    100% {
      transform: translateY(0px);
    }
  }

  .animate-float {
    animation: float 6s ease-in-out infinite;
  }

  .animate-float-slow {
    animation: float 10s ease-in-out infinite;
  }

  .animate-float-fast {
    animation: float 4s ease-in-out infinite;
  }

  .animate-float-delay {
    animation: float 6s ease-in-out infinite;
    animation-delay: 2s;
  }

  @keyframes fadeInDown {
    from {
      opacity: 0;
      transform: translate(-50%, -20px);
    }

    to {
      opacity: 1;
      transform: translate(-50%, 0);
    }
  }

  .animate-fadeInDown {
    animation: fadeInDown 0.4s ease-out;
  }





  .animate-fadeInScale {
    animation: fadeInScale 0.3s ease-in-out;
  }

  @keyframes fadeInScale {
    from {
      opacity: 0;
      transform: scale(0.9);
    }

    to {
      opacity: 1;
      transform: scale(1);
    }
  }


  /* !! ABOUT US FLOATING ANIMATION  */
  @keyframes float {

    0%,
    100% {
      transform: translateY(0) rotate(6deg);
    }

    50% {
      transform: translateY(-15px) rotate(6deg);
    }
  }

  .animate-float {
    animation: float 4s ease-in-out infinite;
  }


  /* TOAST INTRODUCTION ANIMATION */

  @keyframes fadeInRight {
    0% {
      opacity: 0;
      transform: translateX(50px);
    }

    100% {
      opacity: 1;
      transform: translateX(0);
    }
  }

  @keyframes fadeOutRight {
    0% {
      opacity: 1;
      transform: translateX(0);
    }

    100% {
      opacity: 0;
      transform: translateX(50px);
    }
  }

  .animate-fadeInRight {
    animation: fadeInRight 0.5s forwards;
  }

  .animate-fadeOutRight {
    animation: fadeOutRight 0.5s forwards;
  }