Glassmorphic Navigation Bar with Logo and CTA

<div class="glass-panel flex rounded-full pt-3 pr-4 pb-3 pl-4 shadow-2xl items-center justify-between">
        <a href="#" class="flex items-center gap-2 group">
          <div class="flex select-none group-hover:opacity-90 transition-opacity cursor-pointer text-2xl text-white/95 tracking-tight font-serif items-center" onclick="window.location.href='/home'" role="button">
            <!-- H Vector -->
            <div class="relative flex flex-col items-center leading-none mr-1">
              <span class="absolute -top-3 w-full text-center text-sm font-sans opacity-80">
                →
              </span>
              <span class="italic">H</span>
            </div>

            <!-- Tensor Product Symbol -->
            <span class="text-xl opacity-100 mr-2 ml-2">⊗</span>

            <!-- AI System Term -->
            <div class="relative flex items-baseline">
              <span class="italic">AI</span>
              <span class="text-xs absolute -top-1.5 -right-2 font-sans font-medium">
                2
              </span>
              <span class="text-[10px] -bottom-1.5 -right-5 font-medium text-white/95 absolute">
                sys
              </span>
            </div>
            <!-- Spacer for the absolute positioned elements -->
            <div class="w-5"></div>
          </div>
        </a>

        <div class="hidden md:flex gap-8 gap-x-8 gap-y-8 items-center">
          <a href="/home" class="hover:text-white transition-colors text-xs font-medium text-zinc-400">Home</a><a href="/reviews" class="hover:text-white transition-colors text-xs font-medium text-zinc-400">
            Book Reviews
          </a>
          <a href="/newsroom" class="hover:text-white transition-colors text-xs font-medium text-zinc-400">
            Newsroom
          </a>
          <a href="/contact" class="hover:text-white transition-colors text-xs font-medium text-zinc-400">Contact</a>
          
        </div>

        <div class="flex items-center gap-3">
          <a href="#" class="hidden sm:block hover:text-white transition-colors"></a>
          <button class="hover:bg-zinc-200 transition-all text-xs font-medium text-black bg-slate-50 rounded-full pt-1.5 pr-4 pb-1.5 pl-4 shadow-[0_0_20px_rgba(255,255,255,0.1)]">
            Buy Now
          </button>
        </div>
      </div>