Neon_Glow_Video_Player

<div class="flex justify-center items-center py-12 px-4 sm:px-6 lg:px-8 bg-gradient-to-br from-orange-50 to-red-50 dark:from-gray-900 dark:to-gray-800">
  <div class="w-full max-w-4xl bg-gradient-to-br from-amber-500 to-red-500 p-1 sm:p-2 rounded-xl shadow-xl dark:from-red-700 dark:to-orange-700 dark:shadow-2xl dark:shadow-red-900/50 transform hover:scale-[1.01] transition-all duration-300 ease-in-out glow-border">
    <div class="relative pb-[56.25%] overflow-hidden rounded-lg">
      <iframe
        class="absolute top-0 left-0 w-full h-full rounded-lg"
        src="https://www.youtube.com/embed/dQw4w9WgXcQ?autoplay=0&controls=1&modestbranding=1&rel=0"
        frameborder="0"
        allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-story"
        allowfullscreen
        title="Corporate Introduction Video"
      ></iframe>
    </div>
    <div class="mt-4 flex flex-col sm:flex-row justify-between items-center px-2 py-2">
      <h3 class="text-lg sm:text-xl font-bold text-white mb-2 sm:mb-0 drop-shadow-[0_0_5px_rgba(255,165,0,0.7)] dark:drop-shadow-[0_0_5px_rgba(255,90,0,0.9)]">
        Innovating the Future of Business
      </h3>
      <button class="px-4 py-2 bg-white text-orange-600 rounded-lg text-sm font-semibold shadow-md
                     hover:bg-amber-100 focus:outline-none focus:ring-2 focus:ring-white focus:ring-offset-2 focus:ring-offset-amber-500
                     dark:bg-orange-800 dark:text-white dark:hover:bg-orange-700 dark:focus:ring-orange-500 dark:focus:ring-offset-red-700
                     glow-button">
        Learn More
      </button>
    </div>
  </div>
</div>

<style>
  /* Base glow effect for the container */
  .glow-border {
    box-shadow: 0 0 15px rgba(255, 120, 0, 0.6), /* Warm orange glow */
                0 0 30px rgba(255, 80, 0, 0.4), /* Deeper orange */
                inset 0 0 10px rgba(255, 180, 0, 0.3); /* Inner slight glow */
    animation: pulse-glow 2s infinite alternate;
  }

  .dark .glow-border {
    box-shadow: 0 0 15px rgba(255, 60, 0, 0.8),
                0 0 30px rgba(255, 0, 0, 0.6),
                inset 0 0 10px rgba(255, 90, 0, 0.4);
  }

  .glow-button {
    box-shadow: 0 0 8px rgba(255, 180, 0, 0.5);
    transition: all 0.3s ease-in-out;
  }

  .glow-button:hover {
    box-shadow: 0 0 15px rgba(255, 160, 0, 0.8), 0 0 20px rgba(255, 120, 0, 0.6);
  }

  .dark .glow-button {
    box-shadow: 0 0 8px rgba(255, 90, 0, 0.7);
  }
  
  .dark .glow-button:hover {
    box-shadow: 0 0 15px rgba(255, 70, 0, 0.9), 0 0 20px rgba(255, 0, 0, 0.7);
  }

  @keyframes pulse-glow {
    from { opacity: 0.9; transform: scale(1); }
    to { opacity: 1; transform: scale(1.005); }
  }
</style>