Mobile Menu

<div class="fixed inset-0 bg-gray-900 z-50 flex flex-col px-6 py-8">
  <div class="flex justify-between items-center mb-12">
    <span class="text-xl font-bold text-white">Brand</span>
    <button class="w-10 h-10 flex items-center justify-center text-gray-400 hover:text-white">
      <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path></svg>
    </button>
  </div>
  <nav class="flex flex-col gap-6">
    <a href="#" class="text-3xl font-bold text-white hover:text-indigo-400 transition-colors">Home</a>
    <a href="#" class="text-3xl font-bold text-white hover:text-indigo-400 transition-colors">Features</a>
    <a href="#" class="text-3xl font-bold text-white hover:text-indigo-400 transition-colors">Pricing</a>
    <a href="#" class="text-3xl font-bold text-white hover:text-indigo-400 transition-colors">About</a>
    <a href="#" class="text-3xl font-bold text-white hover:text-indigo-400 transition-colors">Contact</a>
  </nav>
  <div class="mt-auto">
    <a href="#" class="block w-full py-4 bg-indigo-600 text-white text-center font-bold rounded-xl hover:bg-indigo-700 transition-colors">Sign Up Free</a>
  </div>
</div>