Tailwind CSS Card

📝 Code HTML (Tailwind CSS)

<div class="max-w-sm bg-white rounded-2xl shadow-2xl overflow-hidden 
     transform transition-all duration-300 hover:scale-105">
  <!-- Image -->
  <div class="relative overflow-hidden group">
    <img src="..." alt="..." 
         class="w-full h-56 object-cover transition-transform 
                duration-500 group-hover:scale-110">
  </div>
  
  <!-- Body -->
  <div class="p-6">
    <h2 class="text-2xl font-bold text-gray-800 mb-3">
      Aventure en Montagne
    </h2>
    <p class="text-gray-600 mb-4 leading-relaxed">
      Découvrez les sommets...
    </p>
    
    <div class="flex justify-between items-center mb-4">
      <span class="px-3 py-1 bg-green-100 text-green-800 
                   text-sm font-semibold rounded-full">
        Disponible
      </span>
      <span class="text-sm text-gray-500">
        À partir de <strong>299€</strong>
      </span>
    </div>
  </div>
  
  <!-- Footer -->
  <div class="px-6 pb-6">
    <button class="w-full bg-gradient-to-r from-purple-600 
                   to-indigo-600 hover:from-purple-700 
                   hover:to-indigo-700 text-white font-bold 
                   py-3 px-4 rounded-xl transition-all 
                   duration-300 transform hover:scale-105">
      Réserver Maintenant
    </button>
  </div>
</div>