
    .scrolled {
      background: rgba(255, 255, 255, 0.95);
      backdrop-filter: blur(10px);
      box-shadow: 0 2px 10px rgba(0,0,0,0.1);
      
    }
     html {
              scroll-behavior: smooth;
            }
    #messageBox {
            position: fixed;
            top: 20px;
            left: 50%;
            transform: translateX(-50%);
            padding: 12px 24px;
            background-color: #10B981; /* Green color */
            color: white;
            border-radius: 9999px;
            font-weight: 600;
            z-index: 100;
            opacity: 0;
            transition: opacity 0.3s ease-in-out;
        }
        #messageBox.show {
            opacity: 1;
        }
    /* Floating animations */
    @keyframes float {
      0%, 100% { transform: translateY(0px); }
      50% { transform: translateY(-20px); }
    }
    @keyframes floatX {
      0%, 100% { transform: translateX(0px); }
      50% { transform: translateX(20px); }
    }
    @keyframes bounceY {
      0%, 100% { transform: translateY(0px); }
      50% { transform: translateY(10px); }
    }
    @keyframes scroll {
      0%, 100% { transform: translateY(0px); }
      50% { transform: translateY(10px); }
    }
        /* Infinite horizontal scroll animation */
    @keyframes scroll-logos {
      0% { transform: translateX(0); }
      100% { transform: translateX(-50%); }
    }
    .animate-scroll-logos {
      display: flex;
      width: max-content;
      animation: scroll-logos 20s linear infinite;
    }
.hidden {
  display: none;
}