Luxury_Retro_Add_to_Cart_Button

<div class="p-4 sm:p-6 md:p-8 bg-stone-100 dark:bg-stone-900 font-sans antialiased flex items-center justify-center min-h-[150px]">
  <div class="max-w-md w-full bg-stone-50 dark:bg-stone-800 rounded-lg shadow-xl overflow-hidden transform transition-all duration-300 hover:scale-[1.01] hover:shadow-2xl">
    <div class="p-4 sm:p-6 flex flex-col md:flex-row items-center justify-between">
      <div class="flex-grow text-center md:text-left mb-4 md:mb-0">
        <p class="text-stone-900 dark:text-stone-100 text-xl sm:text-2xl font-light tracking-wide mb-1 opacity-90">Price:</p>
        <p class="text-orange-900 dark:text-orange-300 text-2xl sm:text-3xl font-medium tracking-tight">$1,250,000</p>
        <p class="text-stone-600 dark:text-stone-400 text-sm mt-1">Estimated Mortgage: $4,500/month</p>
      </div>
      <div class="w-full md:w-auto">
        <button class="w-full px-6 py-3 font-semibold text-lg tracking-wide rounded-md 
                       bg-fuchsia-800 hover:bg-fuchsia-900 text-stone-50 
                       dark:bg-emerald-700 dark:hover:bg-emerald-800 dark:text-stone-50
                       transition-colors duration-300 
                       focus:outline-none focus:ring-2 focus:ring-fuchsia-500 dark:focus:ring-emerald-500 focus:ring-offset-2 focus:ring-offset-stone-50 dark:focus:ring-offset-stone-800 
                       active:scale-[0.98] active:shadow-inner">
          Inquire Now
        </button>
      </div>
    </div>
    <div class="px-4 pb-4 sm:px-6 sm:pb-6 pt-2">
      <p class="text-stone-700 dark:text-stone-300 text-xs sm:text-sm text-center md:text-left">Click 'Inquire Now' for more details or to schedule a viewing.</p>
    </div>
  </div>
</div>