style: polish enter button with gradient, inner highlight, arrow icon, and premium hover effects

src/app/page.tsx

@@ -237,15 +237,16 @@ export default async function HomePage() {
               <Link href="/client">
                 <button
                   type="button"
-                  className="rounded-full px-6 py-2.5 text-sm font-bold tracking-wide transition-all duration-200 hover:scale-105"
+                  className="group rounded-full px-7 py-3 text-sm font-bold tracking-wider transition-all duration-300 hover:scale-105 active:scale-95"
                   style={{
-                    background: "var(--button-color)",
+                    background: "linear-gradient(135deg, color-mix(in srgb, var(--color-primary) 92%, white), color-mix(in srgb, var(--color-primary) 92%, black))",
                     color: "var(--button-text-color)",
-                    border: "none",
-                    boxShadow: "0 4px 20px color-mix(in srgb, var(--color-primary) 30%, transparent)",
+                    border: "1px solid color-mix(in srgb, var(--color-primary) 60%, rgba(255,255,255,0.2))",
+                    boxShadow: "0 4px 24px color-mix(in srgb, var(--color-primary) 35%, transparent), inset 0 1px 0 rgba(255,255,255,0.2)",
                   }}
                 >
                   Enter {hotelName}
+                  <svg className="inline-block ml-2 w-4 h-4 transition-transform duration-300 group-hover:translate-x-0.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2.5} d="M9 5l7 7-7 7" /></svg>
                 </button>
               </Link>
             </div>