make thet shop the collection button more blended in smaller and not as noticeable

index.html

@@ -84,7 +84,7 @@ overflow-x: hidden;
             <h1 class="text-5xl md:text-8xl font-bold mb-6 text-stroke uppercase tracking-tighter graffiti-font">NAGAD CLOTHING</h1>
 <p class="text-lg md:text-xl mb-10 max-w-2xl mx-auto">Where faith meets urban culture. Inspired by scripture, driven by beats, designed for the streets.</p>
 <div class="flex justify-center">
-    <button class="bg-gradient-to-r from-purple-500 via-pink-500 to-red-500 text-white px-12 py-4 font-bold tracking-wider uppercase hover:bg-gradient-to-r hover:from-purple-600 hover:via-pink-600 hover:to-red-600 hover-scale transform transition-all duration-300 shadow-lg hover:shadow-xl animate-pulse">
+    <button class="bg-white bg-opacity-20 text-white px-8 py-3 font-medium tracking-wide hover:bg-opacity-30 hover-scale transform transition-all duration-300">
         Shop The Collection
     </button>
 </div>