updates

Frontend/src/styles/index.css

@@ -66,6 +66,31 @@
   background: linear-gradient(180deg, var(--luxury-gold-light) 0%, var(--luxury-gold) 100%);
 }
 
+/* Custom scrollbar for specific elements */
+.custom-scrollbar {
+  scrollbar-width: thin;
+  scrollbar-color: #f59e0b #1e293b;
+}
+
+.custom-scrollbar::-webkit-scrollbar {
+  width: 6px;
+  height: 6px;
+}
+
+.custom-scrollbar::-webkit-scrollbar-track {
+  background: rgba(30, 41, 59, 0.5);
+  border-radius: 8px;
+}
+
+.custom-scrollbar::-webkit-scrollbar-thumb {
+  background: linear-gradient(180deg, #f59e0b 0%, #d97706 100%);
+  border-radius: 8px;
+}
+
+.custom-scrollbar::-webkit-scrollbar-thumb:hover {
+  background: linear-gradient(180deg, #fbbf24 0%, #f59e0b 100%);
+}
+
 /* Base styles - Luxury Hotel Typography */
 body {
   margin: 0;
@@ -228,6 +253,94 @@ code {
     @apply border border-[#d4af37]/20;
     @apply shadow-2xl;
   }
+
+  /* Enterprise Card - Luxury & Professional */
+  .enterprise-card {
+    @apply bg-white rounded-lg shadow-xl border border-gray-200/60;
+    @apply relative overflow-hidden;
+    @apply transition-all duration-300 ease-out;
+    @apply hover:shadow-2xl hover:shadow-[#d4af37]/10;
+    @apply hover:-translate-y-0.5;
+    @apply backdrop-blur-sm;
+  }
+
+  .enterprise-card::before {
+    content: '';
+    @apply absolute top-0 left-0 right-0 h-0.5;
+    background: linear-gradient(90deg, transparent 0%, #d4af37 50%, transparent 100%);
+    opacity: 0;
+    transition: opacity 0.3s ease-out;
+  }
+
+  .enterprise-card:hover::before {
+    opacity: 1;
+  }
+
+  /* Enterprise Section Title */
+  .enterprise-section-title {
+    @apply text-3xl md:text-4xl font-serif font-bold;
+    @apply text-gray-900 tracking-tight;
+    @apply bg-gradient-to-r from-gray-900 via-gray-800 to-gray-900;
+    @apply bg-clip-text text-transparent;
+  }
+
+  /* Enterprise Section Subtitle */
+  .enterprise-section-subtitle {
+    @apply text-gray-600 text-base font-light;
+    @apply tracking-wide leading-relaxed;
+  }
+
+  /* Enterprise Button Primary */
+  .btn-enterprise-primary {
+    @apply px-8 py-3.5 rounded-lg font-semibold tracking-wide text-sm;
+    @apply bg-gradient-to-r from-[#d4af37] via-[#e8c547] to-[#d4af37];
+    @apply text-[#0f0f0f] shadow-lg shadow-[#d4af37]/30;
+    @apply transition-all duration-300 ease-out;
+    @apply hover:from-[#f5d76e] hover:via-[#d4af37] hover:to-[#f5d76e];
+    @apply hover:shadow-xl hover:shadow-[#d4af37]/40;
+    @apply hover:-translate-y-0.5 hover:scale-[1.02];
+    @apply active:translate-y-0 active:scale-100;
+    @apply disabled:opacity-50 disabled:cursor-not-allowed disabled:hover:translate-y-0 disabled:hover:scale-100;
+    @apply relative overflow-hidden;
+  }
+
+  .btn-enterprise-primary::before {
+    content: '';
+    @apply absolute inset-0 bg-gradient-to-r from-white/0 via-white/30 to-white/0;
+    @apply translate-x-[-100%] transition-transform duration-700;
+  }
+
+  .btn-enterprise-primary:hover::before {
+    @apply translate-x-[100%];
+  }
+
+  /* Enterprise Button Secondary */
+  .btn-enterprise-secondary {
+    @apply px-5 py-2.5 rounded-lg font-medium tracking-wide text-xs;
+    @apply bg-white border-2 border-gray-300 text-gray-700;
+    @apply shadow-md shadow-gray-200/50;
+    @apply transition-all duration-300 ease-out;
+    @apply hover:bg-gray-50 hover:border-[#d4af37] hover:text-[#c9a227];
+    @apply hover:shadow-lg hover:shadow-[#d4af37]/20;
+    @apply hover:-translate-y-0.5;
+    @apply active:translate-y-0;
+    @apply disabled:opacity-50 disabled:cursor-not-allowed;
+  }
+
+  /* Enterprise Input */
+  .enterprise-input {
+    @apply w-full px-4 py-3 rounded-lg border-2 border-gray-200;
+    @apply focus:ring-2 focus:ring-[#d4af37]/30 focus:border-[#d4af37];
+    @apply transition-all duration-200;
+    @apply bg-white text-gray-900;
+    @apply placeholder:text-gray-400;
+    @apply font-light tracking-wide;
+    @apply shadow-sm;
+  }
+
+  .enterprise-input:focus {
+    @apply shadow-md shadow-[#d4af37]/10;
+  }
 }
 
 /* Custom utilities */