Tailwind Faq Components in Cyber library

<section class="relative py-20 scan-lines">
    <div class="absolute inset-0 bg-gradient-to-br from-black via-gray-950 to-black"></div>
    <div class="absolute inset-0 opacity-20">
        <div class="absolute top-20 left-1/4 w-2 h-2 bg-blue-400 rounded-full animate-pulse"></div>
        <div class="absolute top-40 right-1/3 w-1 h-1 bg-green-400 rounded-full animate-pulse delay-75"></div>
        <div class="absolute bottom-40 left-1/3 w-3 h-3 bg-purple-500 rounded-full animate-pulse delay-150"></div>
        <div class="absolute bottom-20 right-1/4 w-1 h-1 bg-blue-400 rounded-full animate-pulse delay-300"></div>
    </div>
    
    <div class="container px-4 mx-auto relative z-10">
        <div class="mb-16 text-center">
            <span class="text-xs font-semibold text-blue-400 uppercase tracking-wider animate-pulse">DATA QUERY MODULE</span>
            <h2 class="mt-2 text-3xl leading-tight md:text-4xl md:leading-tight lg:text-5xl lg:leading-tight font-bold font-heading tracking-wider bg-gradient-to-r from-blue-400 via-purple-500 to-green-400 bg-clip-text text-transparent">FREQUENTLY ACCESSED PROTOCOLS</h2>
        </div>
        
        <div class="flex flex-wrap -mx-4 -mb-8">
            <div class="w-full md:w-1/2 lg:w-1/3 mb-8 px-4">
                <div class="relative hologram-effect p-6 rounded-lg border border-blue-400 border-opacity-30 animate-float hover:border-opacity-60 transition-all duration-300 group">
                    <span class="mr-6 mb-6 flex items-center justify-center w-16 h-16 p-3 bg-gradient-to-br from-blue-400 to-purple-500 hover:from-purple-500 hover:to-green-400 transition-all duration-300 transform group-hover:scale-110" style="clip-path: polygon(15px 0, 100% 0, calc(100% - 15px) 100%, 0 100%);">
                        <svg class="text-gray-950" width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
                            <path d="M18.1332 14.5333C18.2665 14.6667 18.3998 14.6667 18.6665 14.6667H27.9998C28.7998 14.6667 29.3332 14.1333 29.3332 13.3333C29.3332 13.0667 29.3332 12.9333 29.1998 12.8L24.5332 3.46667C24.1332 2.8 23.3332 2.53334 22.6665 2.93334C22.5332 3.06667 22.2665 3.2 22.1332 3.46667L17.4665 12.8C17.1998 13.3333 17.4665 14.1333 18.1332 14.5333ZM23.3332 6.93334L25.8665 12H20.7998L23.3332 6.93334ZM8.6665 2.66667C5.33317 2.66667 2.6665 5.33334 2.6665 8.66667C2.6665 12 5.33317 14.6667 8.6665 14.6667C11.9998 14.6667 14.6665 12 14.6665 8.66667C14.6665 5.33334 11.9998 2.66667 8.6665 2.66667ZM8.6665 12C6.79984 12 5.33317 10.5333 5.33317 8.66667C5.33317 6.80001 6.79984 5.33334 8.6665 5.33334C10.5332 5.33334 11.9998 6.80001 11.9998 8.66667C11.9998 10.5333 10.5332 12 8.6665 12ZM14.2665 17.7333C13.7332 17.2 12.9332 17.2 12.3998 17.7333L8.6665 21.4667L4.93317 17.7333C4.39984 17.2 3.59984 17.2 3.0665 17.7333C2.53317 18.2667 2.53317 19.0667 3.0665 19.6L6.79984 23.3333L3.0665 27.0667C2.53317 27.6 2.53317 28.4 3.0665 28.9333C3.59984 29.4667 4.39984 29.4667 4.93317 28.9333L8.6665 25.2L12.3998 28.9333C12.9332 29.4667 13.7332 29.4667 14.2665 28.9333C14.7998 28.4 14.7998 27.6 14.2665 27.0667L10.5332 23.3333L14.2665 19.6C14.7998 19.0667 14.7998 18.2667 14.2665 17.7333ZM27.9998 17.3333H18.6665C17.8665 17.3333 17.3332 17.8667 17.3332 18.6667V28C17.3332 28.8 17.8665 29.3333 18.6665 29.3333H27.9998C28.7998 29.3333 29.3332 28.8 29.3332 28V18.6667C29.3332 17.8667 28.7998 17.3333 27.9998 17.3333ZM26.6665 26.6667H19.9998V20H26.6665V26.6667Z" fill="currentColor"></path>
                        </svg>
                    </span>
                    <h3 class="mb-2 text-lg lg:text-2xl font-bold font-heading text-gray-50 tracking-wider hover:text-blue-400 transition-colors duration-300">QUANTUM ENCRYPTION</h3>
                    <ul class="list-inside list-disc leading-loose text-gray-400">
                        <li class="text-blue-400"><a class="text-gray-400 hover:text-blue-400 hover:underline transition-colors duration-300" href="">Neural network initialization</a></li>
                        <li class="text-blue-400"><a class="text-gray-400 hover:text-purple-500 hover:underline transition-colors duration-300" href="">Blockchain verification</a></li>
                        <li class="text-blue-400"><a class="text-gray-400 hover:text-green-400 hover:underline transition-colors duration-300" href="">Matrix computation module</a></li>
                        <li class="text-blue-400"><a class="text-gray-400 hover:text-blue-400 hover:underline transition-colors duration-300" href="">Holographic data streams</a></li>
                    </ul>
                    <div class="absolute top-4 right-4 w-2 h-2 bg-blue-400 rounded-full animate-pulse"></div>
                </div>
            </div>
            
            <div class="w-full md:w-1/2 lg:w-1/3 mb-8 px-4">
                <div class="relative hologram-effect p-6 rounded-lg border border-purple-500 border-opacity-30 animate-float hover:border-opacity-60 transition-all duration-300 group" style="animation-delay: 0.5s;">
                    <span class="mr-6 mb-6 flex items-center justify-center w-16 h-16 p-3 bg-gradient-to-br from-purple-500 to-green-400 hover:from-green-400 hover:to-blue-400 transition-all duration-300 transform group-hover:scale-110" style="clip-path: polygon(15px 0, 100% 0, calc(100% - 15px) 100%, 0 100%);">
                        <svg class="text-gray-950" width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
                            <path d="M18.1332 14.5333C18.2665 14.6667 18.3998 14.6667 18.6665 14.6667H27.9998C28.7998 14.6667 29.3332 14.1333 29.3332 13.3333C29.3332 13.0667 29.3332 12.9333 29.1998 12.8L24.5332 3.46667C24.1332 2.8 23.3332 2.53334 22.6665 2.93334C22.5332 3.06667 22.2665 3.2 22.1332 3.46667L17.4665 12.8C17.1998 13.3333 17.4665 14.1333 18.1332 14.5333ZM23.3332 6.93334L25.8665 12H20.7998L23.3332 6.93334ZM8.6665 2.66667C5.33317 2.66667 2.6665 5.33334 2.6665 8.66667C2.6665 12 5.33317 14.6667 8.6665 14.6667C11.9998 14.6667 14.6665 12 14.6665 8.66667C14.6665 5.33334 11.9998 2.66667 8.6665 2.66667ZM8.6665 12C6.79984 12 5.33317 10.5333 5.33317 8.66667C5.33317 6.80001 6.79984 5.33334 8.6665 5.33334C10.5332 5.33334 11.9998 6.80001 11.9998 8.66667C11.9998 10.5333 10.5332 12 8.6665 12ZM14.2665 17.7333C13.7332 17.2 12.9332 17.2 12.3998 17.7333L8.6665 21.4667L4.93317 17.7333C4.39984 17.2 3.59984 17.2 3.0665 17.7333C2.53317 18.2667 2.53317 19.0667 3.0665 19.6L6.79984 23.3333L3.0665 27.0667C2.53317 27.6 2.53317 28.4 3.0665 28.9333C3.59984 29.4667 4.39984 29.4667 4.93317 28.9333L8.6665 25.2L12.3998 28.9333C12.9332 29.4667 13.7332 29.4667 14.2665 28.9333C14.7998 28.4 14.7998 27.6 14.2665 27.0667L10.5332 23.3333L14.2665 19.6C14.7998 19.0667 14.7998 18.2667 14.2665 17.7333ZM27.9998 17.3333H18.6665C17.8665 17.3333 17.3332 17.8667 17.3332 18.6667V28C17.3332 28.8 17.8665 29.3333 18.6665 29.3333H27.9998C28.7998 29.3333 29.3332 28.8 29.3332 28V18.6667C29.3332 17.8667 28.7998 17.3333 27.9998 17.3333ZM26.6665 26.6667H19.9998V20H26.6665V26.6667Z" fill="currentColor"></path>
                        </svg>
                    </span>
                    <h3 class="mb-2 text-lg lg:text-2xl font-bold font-heading text-gray-50 tracking-wider hover:text-purple-500 transition-colors duration-300">NEURAL NETWORK SYSTEMS</h3>
                    <ul class="list-inside list-disc leading-loose text-gray-400">
                        <li class="text-purple-500"><a class="text-gray-400 hover:text-blue-400 hover:underline transition-colors duration-300" href="">Cybernetic interface module</a></li>
                        <li class="text-purple-500"><a class="text-gray-400 hover:text-purple-500 hover:underline transition-colors duration-300" href="">Bio authentication protocols</a></li>
                        <li class="text-purple-500"><a class="text-gray-400 hover:text-green-400 hover:underline transition-colors duration-300" href="">Synthetic consciousness array</a></li>
                        <li class="text-purple-500"><a class="text-gray-400 hover:text-blue-400 hover:underline transition-colors duration-300" href="">Digital brain mapping</a></li>
                    </ul>
                    <div class="absolute top-4 right-4 w-2 h-2 bg-purple-500 rounded-full animate-pulse"></div>
                </div>
            </div>
            
            <div class="w-full md:w-1/2 lg:w-1/3 mb-8 px-4">
                <div class="relative hologram-effect p-6 rounded-lg border border-green-400 border-opacity-30 animate-float hover:border-opacity-60 transition-all duration-300 group" style="animation-delay: 1s;">
                    <span class="mr-6 mb-6 flex items-center justify-center w-16 h-16 p-3 bg-gradient-to-br from-green-400 to-blue-400 hover:from-blue-400 hover:to-purple-500 transition-all duration-300 transform group-hover:scale-110" style="clip-path: polygon(15px 0, 100% 0, calc(100% - 15px) 100%, 0 100%);">
                        <svg class="text-gray-950" width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
                            <path d="M18.1332 14.5333C18.2665 14.6667 18.3998 14.6667 18.6665 14.6667H27.9998C28.7998 14.6667 29.3332 14.1333 29.3332 13.3333C29.3332 13.0667 29.3332 12.9333 29.1998 12.8L24.5332 3.46667C24.1332 2.8 23.3332 2.53334 22.6665 2.93334C22.5332 3.06667 22.2665 3.2 22.1332 3.46667L17.4665 12.8C17.1998 13.3333 17.4665 14.1333 18.1332 14.5333ZM23.3332 6.93334L25.8665 12H20.7998L23.3332 6.93334ZM8.6665 2.66667C5.33317 2.66667 2.6665 5.33334 2.6665 8.66667C2.6665 12 5.33317 14.6667 8.6665 14.6667C11.9998 14.6667 14.6665 12 14.6665 8.66667C14.6665 5.33334 11.9998 2.66667 8.6665 2.66667ZM8.6665 12C6.79984 12 5.33317 10.5333 5.33317 8.66667C5.33317 6.80001 6.79984 5.33334 8.6665 5.33334C10.5332 5.33334 11.9998 6.80001 11.9998 8.66667C11.9998 10.5333 10.5332 12 8.6665 12ZM14.2665 17.7333C13.7332 17.2 12.9332 17.2 12.3998 17.7333L8.6665 21.4667L4.93317 17.7333C4.39984 17.2 3.59984 17.2 3.0665 17.7333C2.53317 18.2667 2.53317 19.0667 3.0665 19.6L6.79984 23.3333L3.0665 27.0667C2.53317 27.6 2.53317 28.4 3.0665 28.9333C3.59984 29.4667 4.39984 29.4667 4.93317 28.9333L8.6665 25.2L12.3998 28.9333C12.9332 29.4667 13.7332 29.4667 14.2665 28.9333C14.7998 28.4 14.7998 27.6 14.2665 27.0667L10.5332 23.3333L14.2665 19.6C14.7998 19.0667 14.7998 18.2667 14.2665 17.7333ZM27.9998 17.3333H18.6665C17.8665 17.3333 17.3332 17.8667 17.3332 18.6667V28C17.3332 28.8 17.8665 29.3333 18.6665 29.3333H27.9998C28.7998 29.3333 29.3332 28.8 29.3332 28V18.6667C29.3332 17.8667 28.7998 17.3333 27.9998 17.3333ZM26.6665 26.6667H19.9998V20H26.6665V26.6667Z" fill="currentColor"></path>
                        </svg>
                    </span>
                    <h3 class="mb-2 text-lg lg:text-2xl font-bold font-heading text-gray-50 tracking-wider hover:text-green-400 transition-colors duration-300">HOLOGRAPHIC DATA MATRIX</h3>
                    <ul class="list-inside list-disc leading-loose text-gray-400">
                        <li class="text-green-400"><a class="text-gray-400 hover:text-blue-400 hover:underline transition-colors duration-300" href="">Virtual reality mapping</a></li>
                        <li class="text-green-400"><a class="text-gray-400 hover:text-purple-500 hover:underline transition-colors duration-300" href="">Augmented perception filters</a></li>
                        <li class="text-green-400"><a class="text-gray-400 hover:text-green-400 hover:underline transition-colors duration-300" href="">Dimensional data compression</a></li>
                        <li class="text-green-400"><a class="text-gray-400 hover:text-blue-400 hover:underline transition-colors duration-300" href="">Fractal algorithm processing</a></li>
                    </ul>
                    <div class="absolute top-4 right-4 w-2 h-2 bg-green-400 rounded-full animate-pulse"></div>
                </div>
            </div>
            
            <div class="w-full md:w-1/2 lg:w-1/3 mb-8 px-4">
                <div class="relative hologram-effect p-6 rounded-lg border border-blue-400 border-opacity-30 animate-float hover:border-opacity-60 transition-all duration-300 group" style="animation-delay: 1.5s;">
                    <span class="mr-6 mb-6 flex items-center justify-center w-16 h-16 p-3 bg-gradient-to-br from-blue-400 to-purple-500 hover:from-purple-500 hover:to-green-400 transition-all duration-300 transform group-hover:scale-110" style="clip-path: polygon(15px 0, 100% 0, calc(100% - 15px) 100%, 0 100%);">
                        <svg class="text-gray-950" width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
                            <path d="M18.1332 14.5333C18.2665 14.6667 18.3998 14.6667 18.6665 14.6667H27.9998C28.7998 14.6667 29.3332 14.1333 29.3332 13.3333C29.3332 13.0667 29.3332 12.9333 29.1998 12.8L24.5332 3.46667C24.1332 2.8 23.3332 2.53334 22.6665 2.93334C22.5332 3.06667 22.2665 3.2 22.1332 3.46667L17.4665 12.8C17.1998 13.3333 17.4665 14.1333 18.1332 14.5333ZM23.3332 6.93334L25.8665 12H20.7998L23.3332 6.93334ZM8.6665 2.66667C5.33317 2.66667 2.6665 5.33334 2.6665 8.66667C2.6665 12 5.33317 14.6667 8.6665 14.6667C11.9998 14.6667 14.6665 12 14.6665 8.66667C14.6665 5.33334 11.9998 2.66667 8.6665 2.66667ZM8.6665 12C6.79984 12 5.33317 10.5333 5.33317 8.66667C5.33317 6.80001 6.79984 5.33334 8.6665 5.33334C10.5332 5.33334 11.9998 6.80001 11.9998 8.66667C11.9998 10.5333 10.5332 12 8.6665 12ZM14.2665 17.7333C13.7332 17.2 12.9332 17.2 12.3998 17.7333L8.6665 21.4667L4.93317 17.7333C4.39984 17.2 3.59984 17.2 3.0665 17.7333C2.53317 18.2667 2.53317 19.0667 3.0665 19.6L6.79984 23.3333L3.0665 27.0667C2.53317 27.6 2.53317 28.4 3.0665 28.9333C3.59984 29.4667 4.39984 29.4667 4.93317 28.9333L8.6665 25.2L12.3998 28.9333C12.9332 29.4667 13.7332 29.4667 14.2665 28.9333C14.7998 28.4 14.7998 27.6 14.2665 27.0667L10.5332 23.3333L14.2665 19.6C14.7998 19.0667 14.7998 18.2667 14.2665 17.7333ZM27.9998 17.3333H18.6665C17.8665 17.3333 17.3332 17.8667 17.3332 18.6667V28C17.3332 28.8 17.8665 29.3333 18.6665 29.3333H27.9998C28.7998 29.3333 29.3332 28.8 29.3332 28V18.6667C29.3332 17.8667 28.7998 17.3333 27.9998 17.3333ZM26.6665 26.6667H19.9998V20H26.6665V26.6667Z" fill="currentColor"></path>
                        </svg>
                    </span>
                    <h3 class="mb-2 text-lg lg:text-2xl font-bold font-heading text-gray-50 tracking-wider hover:text-blue-400 transition-colors duration-300">CYBERSECURITY FIREWALL</h3>
                    <ul class="list-inside list-disc leading-loose text-gray-400">
                        <li class="text-blue-400"><a class="text-gray-400 hover:text-blue-400 hover:underline transition-colors duration-300" href="">Intrusion detection arrays</a></li>
                        <li class="text-blue-400"><a class="text-gray-400 hover:text-purple-500 hover:underline transition-colors duration-300" href="">Digital fortress protocols</a></li>
                        <li class="text-blue-400"><a class="text-gray-400 hover:text-green-400 hover:underline transition-colors duration-300" href="">Quantum security barriers</a></li>
                        <li class="text-blue-400"><a class="text-gray-400 hover:text-blue-400 hover:underline transition-colors duration-300" href="">Neural threat analysis</a></li>
                    </ul>
                    <div class="absolute top-4 right-4 w-2 h-2 bg-blue-400 rounded-full animate-pulse"></div>
                </div>
            </div>
            
            <div class="w-full md:w-1/2 lg:w-1/3 mb-8 px-4">
                <div class="relative hologram-effect p-6 rounded-lg border border-purple-500 border-opacity-30 animate-float hover:border-opacity-60 transition-all duration-300 group" style="animation-delay: 2s;">
                    <span class="mr-6 mb-6 flex items-center justify-center w-16 h-16 p-3 bg-gradient-to-br from-purple-500 to-green-400 hover:from-green-400 hover:to-blue-400 transition-all duration-300 transform group-hover:scale-110" style="clip-path: polygon(15px 0, 100% 0, calc(100% - 15px) 100%, 0 100%);">
                        <svg class="text-gray-950" width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
                            <path d="M18.1332 14.5333C18.2665 14.6667 18.3998 14.6667 18.6665 14.6667H27.9998C28.7998 14.6667 29.3332 14.1333 29.3332 13.3333C29.3332 13.0667 29.3332 12.9333 29.1998 12.8L24.5332 3.46667C24.1332 2.8 23.3332 2.53334 22.6665 2.93334C22.5332 3.06667 22.2665 3.2 22.1332 3.46667L17.4665 12.8C17.1998 13.3333 17.4665 14.1333 18.1332 14.5333ZM23.3332 6.93334L25.8665 12H20.7998L23.3332 6.93334ZM8.6665 2.66667C5.33317 2.66667 2.6665 5.33334 2.6665 8.66667C2.6665 12 5.33317 14.6667 8.6665 14.6667C11.9998 14.6667 14.6665 12 14.6665 8.66667C14.6665 5.33334 11.9998 2.66667 8.6665 2.66667ZM8.6665 12C6.79984 12 5.33317 10.5333 5.33317 8.66667C5.33317 6.80001 6.79984 5.33334 8.6665 5.33334C10.5332 5.33334 11.9998 6.80001 11.9998 8.66667C11.9998 10.5333 10.5332 12 8.6665 12ZM14.2665 17.7333C13.7332 17.2 12.9332 17.2 12.3998 17.7333L8.6665 21.4667L4.93317 17.7333C4.39984 17.2 3.59984 17.2 3.0665 17.7333C2.53317 18.2667 2.53317 19.0667 3.0665 19.6L6.79984 23.3333L3.0665 27.0667C2.53317 27.6 2.53317 28.4 3.0665 28.9333C3.59984 29.4667 4.39984 29.4667 4.93317 28.9333L8.6665 25.2L12.3998 28.9333C12.9332 29.4667 13.7332 29.4667 14.2665 28.9333C14.7998 28.4 14.7998 27.6 14.2665 27.0667L10.5332 23.3333L14.2665 19.6C14.7998 19.0667 14.7998 18.2667 14.2665 17.7333ZM27.9998 17.3333H18.6665C17.8665 17.3333 17.3332 17.8667 17.3332 18.6667V28C17.3332 28.8 17.8665 29.3333 18.6665 29.3333H27.9998C28.7998 29.3333 29.3332 28.8 29.3332 28V18.6667C29.3332 17.8667 28.7998 17.3333 27.9998 17.3333ZM26.6665 26.6667H19.9998V20H26.6665V26.6667Z" fill="currentColor"></path>
                        </svg>
                    </span>
                    <h3 class="mb-2 text-lg lg:text-2xl font-bold font-heading text-gray-50 tracking-wider hover:text-purple-500 transition-colors duration-300">BIOTECH INTEGRATION</h3>
                    <ul class="list-inside list-disc leading-loose text-gray-400">
                        <li class="text-purple-500"><a class="text-gray-400 hover:text-blue-400 hover:underline transition-colors duration-300" href="">Genetic code modification</a></li>
                        <li class="text-purple-500"><a class="text-gray-400 hover:text-purple-500 hover:underline transition-colors duration-300" href="">Nano enhancement protocols</a></li>
                        <li class="text-purple-500"><a class="text-gray-400 hover:text-green-400 hover:underline transition-colors duration-300" href="">Synthetic biology arrays</a></li>
                        <li class="text-purple-500"><a class="text-gray-400 hover:text-blue-400 hover:underline transition-colors duration-300" href="">Cellular reprogramming</a></li>
                    </ul>
                    <div class="absolute top-4 right-4 w-2 h-2 bg-purple-500 rounded-full animate-pulse"></div>
                </div>
            </div>
            
            <div class="w-full md:w-1/2 lg:w-1/3 mb-8 px-4">
                <div class="relative hologram-effect p-6 rounded-lg border border-green-400 border-opacity-30 animate-float hover:border-opacity-60 transition-all duration-300 group" style="animation-delay: 2.5s;">
                    <span class="mr-6 mb-6 flex items-center justify-center w-16 h-16 p-3 bg-gradient-to-br from-green-400 to-blue-400 hover:from-blue-400 hover:to-purple-500 transition-all duration-300 transform group-hover:scale-110" style="clip-path: polygon(15px 0, 100% 0, calc(100% - 15px) 100%, 0 100%);">
                        <svg class="text-gray-950" width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
                            <path d="M18.1332 14.5333C18.2665 14.6667 18.3998 14.6667 18.6665 14.6667H27.9998C28.7998 14.6667 29.3332 14.1333 29.3332 13.3333C29.3332 13.0667 29.3332 12.9333 29.1998 12.8L24.5332 3.46667C24.1332 2.8 23.3332 2.53334 22.6665 2.93334C22.5332 3.06667 22.2665 3.2 22.1332 3.46667L17.4665 12.8C17.1998 13.3333 17.4665 14.1333 18.1332 14.5333ZM23.3332 6.93334L25.8665 12H20.7998L23.3332 6.93334ZM8.6665 2.66667C5.33317 2.66667 2.6665 5.33334 2.6665 8.66667C2.6665 12 5.33317 14.6667 8.6665 14.6667C11.9998 14.6667 14.6665 12 14.6665 8.66667C14.6665 5.33334 11.9998 2.66667 8.6665 2.66667ZM8.6665 12C6.79984 12 5.33317 10.5333 5.33317 8.66667C5.33317 6.80001 6.79984 5.33334 8.6665 5.33334C10.5332 5.33334 11.9998 6.80001 11.9998 8.66667C11.9998 10.5333 10.5332 12 8.6665 12ZM14.2665 17.7333C13.7332 17.2 12.9332 17.2 12.3998 17.7333L8.6665 21.4667L4.93317 17.7333C4.39984 17.2 3.59984 17.2 3.0665 17.7333C2.53317 18.2667 2.53317 19.0667 3.0665 19.6L6.79984 23.3333L3.0665 27.0667C2.53317 27.6 2.53317 28.4 3.0665 28.9333C3.59984 29.4667 4.39984 29.4667 4.93317 28.9333L8.6665 25.2L12.3998 28.9333C12.9332 29.4667 13.7332 29.4667 14.2665 28.9333C14.7998 28.4 14.7998 27.6 14.2665 27.0667L10.5332 23.3333L14.2665 19.6C14.7998 19.0667 14.7998 18.2667 14.2665 17.7333ZM27.9998 17.3333H18.6665C17.8665 17.3333 17.3332 17.8667 17.3332 18.6667V28C17.3332 28.8 17.8665 29.3333 18.6665 29.3333H27.9998C28.7998 29.3333 29.3332 28.8 29.3332 28V18.6667C29.3332 17.8667 28.7998 17.3333 27.9998 17.3333ZM26.6665 26.6667H19.9998V20H26.6665V26.6667Z" fill="currentColor"></path>
                        </svg>
                    </span>
                    <h3 class="mb-2 text-lg lg:text-2xl font-bold font-heading text-gray-50 tracking-wider hover:text-green-400 transition-colors duration-300">QUANTUM COMPUTING</h3>
                    <ul class="list-inside list-disc leading-loose text-gray-400">
                        <li class="text-green-400"><a class="text-gray-400 hover:text-blue-400 hover:underline transition-colors duration-300" href="">Superposition calculations</a></li>
                        <li class="text-green-400"><a class="text-gray-400 hover:text-purple-500 hover:underline transition-colors duration-300" href="">Entanglement protocols</a></li>
                        <li class="text-green-400"><a class="text-gray-400 hover:text-green-400 hover:underline transition-colors duration-300" href="">Parallel universe access</a></li>
                        <li class="text-green-400"><a class="text-gray-400 hover:text-blue-400 hover:underline transition-colors duration-300" href="">Quantum bit manipulation</a></li>
                    </ul>
                    <div class="absolute top-4 right-4 w-2 h-2 bg-green-400 rounded-full animate-pulse"></div>
                </div>
            </div>
        </div>
    </div>
</section>