      @import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap');
        
        body {
            font-family: 'Inter', sans-serif;
            overflow-x: hidden;
            background-color: #0a0a0a;
            color: #f8f8f8;
        }
        
        .hero-text {
            text-shadow: 0 0 10px rgba(100, 200, 255, 0.3);
        }
        
        .glass-card {
            background: rgba(255, 255, 255, 0.05);
            backdrop-filter: blur(10px);
            -webkit-backdrop-filter: blur(10px);
            border-radius: 12px;
            border: 1px solid rgba(255, 255, 255, 0.1);
        }
        
        .neon-hover:hover {
            box-shadow: 0 0 15px rgba(0, 200, 255, 0.5);
            transition: all 0.3s ease;
        }
        
        .card-hover {
            transition: all 0.3s ease;
        }
        
        .card-hover:hover {
            transform: translateY(-8px);
            box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
        }
        
        .counter {
            font-variant-numeric: tabular-nums;
        }
        
        #threejs-container {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            z-index: -1;
        }
        
        .wave-bg {
            position: absolute;
            bottom: 0;
            left: 0;
            width: 100%;
            height: 100px;
            background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 320'%3E%3Cpath fill='%230e7490' fill-opacity='0.2' d='M0,192L48,197.3C96,203,192,213,288,229.3C384,245,480,267,576,250.7C672,235,768,181,864,181.3C960,181,1056,235,1152,234.7C1248,235,1344,181,1392,154.7L1440,128L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z'%3E%3C/path%3E%3C/svg%3E");
            background-size: cover;
            background-repeat: no-repeat;
            z-index: -1;
        }
        
        .neural-pattern {
            position: absolute;
            width: 100%;
            height: 100%;
            background-image: radial-gradient(circle, rgba(14, 116, 144, 0.1) 1px, transparent 1px);
            background-size: 20px 20px;
            z-index: -2;
        }
        
        .blob {
            position: absolute;
            width: 200px;
            height: 300px;
            background: linear-gradient(45deg, rgba(14, 116, 144, 0.2), rgba(124, 58, 237, 0.2));
            border-radius: 10%;
            filter: blur(50px);
            z-index: -1;
        }
          .glass-card {
            background: rgba(255, 255, 255, 0.05);
            backdrop-filter: blur(10px);
            transform: translateY(20px);
            opacity: 0;
            animation: fadeInUp 1s ease forwards;
        }

        .glass-card:nth-child(2) {
            animation-delay: 0.3s;
        }
        .glass-card:nth-child(3) {
            animation-delay: 0.6s;
        }

        @keyframes fadeInUp {
            to {
            transform: translateY(0);
            opacity: 1;
            }
        }
        .scene {
            width: 150px;
            height: 150px;
            perspective: 600px;
            position: absolute;
            top: 10%;
            left: 60px;
            z-index: 25;
            pointer-events: none;
        }

        .cube {
            width: 100%;
            height: 100%;
            position: relative;
            transform-style: preserve-3d;
            animation: rotate 6s linear infinite;
        }

        .face {
            position: absolute;
            width: 150px;
            height: 150px;
            background: linear-gradient(135deg, #00fff7 0%, #005f5f 100%);
            border: 1px solid #003f3f;
            opacity: 0.9;
        }

        .face.front  { transform: translateZ(75px); }
        .face.back   { transform: rotateY(180deg) translateZ(75px); }
        .face.right  { transform: rotateY(90deg) translateZ(75px); }
        .face.left   { transform: rotateY(-90deg) translateZ(75px); }
        .face.top    { transform: rotateX(90deg) translateZ(75px); }
        .face.bottom { transform: rotateX(-90deg) translateZ(75px); }

        @keyframes rotate {
            from { transform: rotateX(0deg) rotateY(0deg); }
            to   { transform: rotateX(360deg) rotateY(360deg); }
        }
        /* Subtle animated background gradient */
          .animated-bg {
            background: linear-gradient(-45deg, #0f0f0f, #1a1a1a, #111827, #0c0c0c);
            background-size: 400% 400%;
            animation: bgAnimation 20s ease infinite;
          }

          @keyframes bgAnimation {
            0% { background-position: 0% 50%; }
            50% { background-position: 100% 50%; }
            100% { background-position: 0% 50%; }
          }

          /* Card hover lift + glow */
          .testimonial-card {
            transition: all 0.3s ease-in-out;
          }

          .testimonial-card:hover {
            transform: scale(1.025);
            box-shadow: 0 10px 40px rgba(0, 255, 255, 0.1);
            background-color: rgba(255, 255, 255, 0.02);
            border-color: rgba(255, 255, 255, 0.05);
          }
            .social-icon {
            width: 44px;
            height: 44px;
            border-radius: 9999px;
            display: flex;
            align-items: center;
            justify-content: center;
            color: white;
            transition: all 0.3s ease;
          }

          .animate-fadeIn {
            animation: fadeIn 0.4s ease-out;
          }

          @keyframes fadeIn {
            from { opacity: 0; transform: scale(0.95); }
            to { opacity: 1; transform: scale(1); }
          }
          @keyframes float {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-12px);
  }
}
.animate-float {
  animation: float 4s ease-in-out infinite;
}
        @keyframes slideIn {
          0% {
            opacity: 0;
            transform: translateX(20px);
          }
          100% {
            opacity: 1;
            transform: translateX(0);
          }
        }

        .animate-slideIn {
          animation: slideIn 0.6s ease-out both;
        }