Limit the Use Cases tools row to the three catalog articles, make it mouse-draggable instead of auto-advancing, and put card titles on Bricolage Grotesque so they match the design.

Co-authored-by: Cursor <cursoragent@cursor.com>

app/components/sections/RelatedArticles/RelatedArticles.view.tsx

@@ -5,6 +5,7 @@ export function RelatedArticlesView({
   filteredPosts,
   slugOrder,
   isMobile,
+  manualScroll,
   transformStyle,
   getProgressStyle,
   onMouseDown,
@@ -76,12 +77,13 @@ export function RelatedArticlesView({
                 ? "lg:gap-[var(--spacing-scale-012)] lg:pl-[var(--spacing-scale-024)]"
                 : ""
             } ${
-              !isMobile
+              manualScroll
                 ? "overflow-x-auto scrollbar-hide cursor-grab active:cursor-grabbing"
                 : ""
             }`}
+            data-testid="related-articles-track"
             style={transformStyle}
-            onMouseDown={!isMobile ? onMouseDown : undefined}
+            onMouseDown={manualScroll ? onMouseDown : undefined}
           >
             {filteredPosts.map((relatedPost) => (
               <div
@@ -100,8 +102,7 @@ export function RelatedArticlesView({
           </div>
         </div>
 
-        {/* Progress bars - only show on mobile */}
-        {isMobile && (
+        {isMobile && !isUseCases && (
           <div className="flex justify-center gap-[var(--measures-spacing-008)] px-[var(--measures-spacing-064)]">
             {filteredPosts.map((relatedPost, index) => (
               <div