Fix portfolio move-to-top and put category beside the date.

Bump sort_order above the page leader instead of swapping, and align category left with date right on one meta row.

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

apps/business/src/components/PortfolioCard.module.css

@@ -115,10 +115,18 @@
   text-align: left;
 }
 
+.metaRow {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 8px;
+  margin-top: auto;
+  min-width: 0;
+}
+
 .categoryChip {
   display: inline-block;
-  align-self: flex-start;
-  max-width: 100%;
+  max-width: 60%;
   padding: 3px 10px;
   font-family: var(--font-ui);
   font-size: 11px;
@@ -131,15 +139,14 @@
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
-}
-
-.meta {
-  margin: 0;
-  font-size: 12px;
-  line-height: 1.4;
-  color: var(--text-muted);
+  flex-shrink: 1;
 }
 
 .metaDate {
+  flex-shrink: 0;
+  font-size: 12px;
+  line-height: 1.4;
+  color: var(--text-muted);
   unicode-bidi: isolate;
+  text-align: right;
 }

apps/business/src/components/PortfolioCard.tsx

@@ -94,16 +94,18 @@ export function PortfolioCard({
               </p>
             )
           ) : null}
-          {portfolio.categoryName ? (
-            <span className={cardStyles.categoryChip} dir="auto">
-              {portfolio.categoryName}
-            </span>
-          ) : null}
-          <p className={cardStyles.meta}>
+          <div className={cardStyles.metaRow} dir="ltr">
+            {portfolio.categoryName ? (
+              <span className={cardStyles.categoryChip} dir="auto">
+                {portfolio.categoryName}
+              </span>
+            ) : (
+              <span />
+            )}
             <span className={cardStyles.metaDate} dir="auto">
               {publishDate}
             </span>
-          </p>
+          </div>
         </div>
       </Link>