Neon_Glow_Food_Container

<div class="min-h-screen bg-gray-50 flex items-center justify-center p-4 dark:bg-gray-950 font-sans">
  <div class="relative w-full max-w-md mx-auto bg-white rounded-xl shadow-2xl overflow-hidden transform transition-all duration-500 ease-in-out hover:scale-105
              dark:bg-gray-800 dark:shadow-purple-500/50 dark:hover:shadow-purple-400/70
              border border-transparent dark:border-purple-600/50">

    <!-- Glowing Border Effect (Simulated) -->
    <div class="absolute inset-0 rounded-xl pointer-events-none
                bg-gradient-to-br from-purple-400 via-pink-500 to-red-500 opacity-20 blur-xl dark:opacity-30">
    </div>
    <div class="absolute inset-0 rounded-xl pointer-events-none
                bg-gradient-to-br from-purple-500 via-pink-600 to-red-600 opacity-10 blur-lg dark:opacity-20">
    </div>

    <div class="relative p-6 sm:p-8 z-10">
      <div class="text-center mb-6">
        <h2 class="text-3xl sm:text-4xl font-extrabold text-gray-900 mb-2
                   dark:text-white dark:drop-shadow-[0_0_5px_rgba(255,0,255,0.7)]">
          Taste the Future
        </h2>
        <p class="text-sm sm:text-base text-gray-600 dark:text-gray-300 dark:drop-shadow-[0_0_2px_rgba(0,255,255,0.5)]">
          Your next favorite meal is just a click away.
        </p>
      </div>

      <div class="relative w-full h-48 sm:h-56 mb-6 rounded-lg overflow-hidden shadow-lg
                  border-2 border-violet-400 dark:border-pink-500
                  transform transition-all duration-300 ease-in-out hover:scale-[1.02]">
        <img src="https://picsum.photos/600/400?random=1" alt="Delicious Food" class="w-full h-full object-cover">
        <div class="absolute inset-0 bg-gradient-to-t from-gray-900/70 to-transparent flex items-end p-4">
          <p class="text-white text-lg font-bold drop-shadow-[0_0_5px_rgba(0,255,255,0.9)]">Today's Special</p>
        </div>
      </div>

      <p class="text-gray-700 leading-relaxed text-center mb-6 dark:text-gray-300">
        Explore a vibrant selection of dishes, crafted with passion and precision. From local delights to international cuisines, we bring the best to your doorstep.
      </p>

      <div class="flex flex-col sm:flex-row gap-4">
        <button class="flex-1 py-3 px-6 rounded-full text-lg font-semibold
                       bg-gradient-to-r from-purple-600 to-pink-600 text-white
                       shadow-lg hover:shadow-xl transition-all duration-300 ease-in-out transform hover:-translate-y-0.5
                       focus:outline-none focus:ring-4 focus:ring-purple-300 dark:focus:ring-pink-500/70
                       dark:from-purple-700 dark:to-pink-700 dark:shadow-purple-500/40 dark:hover:shadow-purple-400/60
                       relative overflow-hidden group">
          <span class="relative z-10">Order Now</span>
          <span class="absolute top-0 left-0 w-full h-full rounded-full bg-white opacity-0 blur group-hover:opacity-20 group-hover:animate-ping-slow"></span>
        </button>
        <button class="flex-1 py-3 px-6 rounded-full text-lg font-semibold
                       border-2 border-purple-500 text-purple-600
                       dark:border-pink-500 dark:text-pink-400
                       hover:bg-purple-50 hover:border-purple-600
                       dark:hover:bg-gray-700 dark:hover:border-pink-600
                       transition-all duration-300 ease-in-out transform hover:-translate-y-0.5
                       focus:outline-none focus:ring-4 focus:ring-purple-300 dark:focus:ring-pink-500/70">
          View Menu
        </button>
      </div>
    </div>
  </div>
</div>