feat: Enhance professional card display by reducing section height, adding list padding, applying a box shadow, and aligning card content to the top.

lib/features/home/presentation/widgets/top_professionals_section.dart

@@ -68,7 +68,8 @@ class _TopProfessionalsSectionState
   Widget build(BuildContext context) {
     // CMS data for title/CTA text only
     final homeState = ref.watch(homeProvider);
-    final cmsContent = homeState.content?.topProfessionals ?? _defaultCmsContent;
+    final cmsContent =
+        homeState.content?.topProfessionals ?? _defaultCmsContent;
 
     // Dynamic data from database (top-rated agents/lenders, matching web)
     final profState = ref.watch(topProfessionalsProvider);
@@ -107,11 +108,12 @@ class _TopProfessionalsSectionState
           else ...[
             // Professional Cards - horizontal scroll
             SizedBox(
-              height: 540,
+              height: 510,
               child: ListView.builder(
                 controller: _scrollController,
                 scrollDirection: Axis.horizontal,
                 physics: const BouncingScrollPhysics(),
+                padding: const EdgeInsets.only(bottom: 16, left: 10, right: 10),
                 itemCount: activeList.length,
                 itemBuilder: (context, index) {
                   final cardWidth = MediaQuery.of(context).size.width - 48;
@@ -122,7 +124,13 @@ class _TopProfessionalsSectionState
                         left: index == 0 ? 0 : 8,
                         right: index == activeList.length - 1 ? 0 : 8,
                       ),
-                      child: _buildProfessionalCard(activeList[index], index: index),
+                      child: Align(
+                        alignment: Alignment.topCenter,
+                        child: _buildProfessionalCard(
+                          activeList[index],
+                          index: index,
+                        ),
+                      ),
                     ),
                   );
                 },
@@ -289,7 +297,9 @@ class _TopProfessionalsSectionState
     final expertiseTags = agent.specializations;
     final experience = agent.experienceText;
     final locationText = agent.location;
-    final subtitle = agent.agentType != null ? '(${agent.agentType!.name})' : '';
+    final subtitle = agent.agentType != null
+        ? '(${agent.agentType!.name})'
+        : '';
     final rawRating = agent.averageRating ?? 0.0;
     final rating = rawRating > 0 ? rawRating : 5.0;
 
@@ -298,18 +308,27 @@ class _TopProfessionalsSectionState
         color: Colors.white,
         borderRadius: BorderRadius.circular(15),
         border: Border.all(color: AppColors.primaryDark, width: 0.1),
+        boxShadow: [
+          BoxShadow(
+            color: const Color(0xFFD9D9D9).withValues(alpha: 0.5),
+            offset: const Offset(0, 10),
+            blurRadius: 20,
+          ),
+        ],
       ),
       clipBehavior: Clip.antiAlias,
       child: Column(
         crossAxisAlignment: CrossAxisAlignment.start,
+        mainAxisSize: MainAxisSize.min,
         children: [
           // Image (226px per Figma)
           SizedBox(
             width: double.infinity,
             height: 226,
             child: ClipRRect(
-                borderRadius:
+              borderRadius: const BorderRadius.vertical(
-                    const BorderRadius.vertical(top: Radius.circular(15)),
+                top: Radius.circular(15),
+              ),
               child: imageUrl.isNotEmpty
                   ? S3Image(
                       imageUrl: imageUrl,
@@ -324,13 +343,11 @@ class _TopProfessionalsSectionState
           ),
 
           // Content
-            Expanded(
+          Padding(
-              child: Padding(
+            padding: const EdgeInsets.fromLTRB(16, 12, 16, 14),
-              padding: const EdgeInsets.fromLTRB(16, 12, 16, 12),
-              child: SingleChildScrollView(
-                physics: const NeverScrollableScrollPhysics(),
             child: Column(
               crossAxisAlignment: CrossAxisAlignment.start,
+              mainAxisSize: MainAxisSize.min,
               children: [
                 // Name
                 Text(
@@ -450,11 +467,19 @@ class _TopProfessionalsSectionState
                       ...expertiseTags.take(3).map((tag) => _buildTag(tag)),
                       if (expertiseTags.length > 3)
                         Container(
-                            padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 4),
+                          padding: const EdgeInsets.symmetric(
+                            horizontal: 10,
+                            vertical: 4,
+                          ),
                           decoration: BoxDecoration(
                             borderRadius: BorderRadius.circular(15),
-                              color: AppColors.accentOrange.withValues(alpha: 0.1),
+                            color: AppColors.accentOrange.withValues(
-                              border: Border.all(color: AppColors.accentOrange, width: 0.7),
+                              alpha: 0.1,
+                            ),
+                            border: Border.all(
+                              color: AppColors.accentOrange,
+                              width: 0.7,
+                            ),
                           ),
                           child: Text(
                             '+${expertiseTags.length - 3} more',
@@ -518,8 +543,6 @@ class _TopProfessionalsSectionState
               ],
             ),
           ),
-            ),
-            ),
         ],
       ),
     );
@@ -603,7 +626,6 @@ class _TopProfessionalsSectionState
     );
   }
 
-
   Widget _buildAvatarPlaceholder() {
     return Container(
       width: double.infinity,
@@ -615,11 +637,9 @@ class _TopProfessionalsSectionState
 
   Widget _buildTag(String label) {
     return Container(
-      height: 28,
+      padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 6),
-      padding: const EdgeInsets.symmetric(horizontal: 10),
-      alignment: Alignment.center,
       decoration: BoxDecoration(
-        borderRadius: BorderRadius.circular(14),
+        borderRadius: BorderRadius.circular(20),
         border: Border.all(color: AppColors.primaryDark, width: 0.7),
       ),
       child: Text(
@@ -629,7 +649,6 @@ class _TopProfessionalsSectionState
           fontSize: 13,
           fontWeight: FontWeight.w400,
           color: AppColors.primaryDark,
-          height: 1,
         ),
       ),
     );
@@ -638,8 +657,9 @@ class _TopProfessionalsSectionState
   Widget _buildProgressIndicator(int totalCards) {
     return LayoutBuilder(
       builder: (context, constraints) {
-        final indicatorWidth =
+        final indicatorWidth = totalCards > 0
-            totalCards > 0 ? constraints.maxWidth / totalCards : 103.0;
+            ? constraints.maxWidth / totalCards
+            : 103.0;
         final offset = totalCards > 0
             ? (_currentPage * constraints.maxWidth / totalCards)
             : 0.0;
@@ -731,11 +751,8 @@ class _TopProfessionalsSectionState
             'assets/icons/building_icon.png',
             width: 50,
             height: 38,
-            errorBuilder: (_, __, ___) => const Icon(
+            errorBuilder: (_, __, ___) =>
-              Icons.business,
+                const Icon(Icons.business, color: Color(0xFF5BA4A4), size: 38),
-              color: Color(0xFF5BA4A4),
-              size: 38,
-            ),
           ),
           const SizedBox(height: 12),
           Text(