From 0fe19f032fab1b04b795f416d544768affc74a64 Mon Sep 17 00:00:00 2001
From: Victor Chukwuebuka Umeh <41862157+vyktoremario@users.noreply.github.com>
Date: Fri, 23 Jan 2026 15:24:20 +0100
Subject: [PATCH 1/2] Align items on Chainlink Journey Section

---
 src/components/JourneyCards/JourneyCards.astro | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/src/components/JourneyCards/JourneyCards.astro b/src/components/JourneyCards/JourneyCards.astro
index 39e85bdf1b5..81a00e7914e 100644
--- a/src/components/JourneyCards/JourneyCards.astro
+++ b/src/components/JourneyCards/JourneyCards.astro
@@ -164,6 +164,8 @@ const tabs = columns.map((column) => ({
   }
 
   .journey-card {
+    display: grid;
+    grid-template-rows: auto 1fr auto;
     gap: var(--space-6x);
     padding: var(--space-6x);
   }
@@ -188,7 +190,10 @@ const tabs = columns.map((column) => ({
     display: flex;
     flex-direction: column;
     gap: var(--space-2x);
-    margin-bottom: var(--space-8x);
+  }
+
+  .card-content > :last-child {
+    min-height: 3em;
   }
 
   .journey-footer {

From 004099acbcd85e57df6399d9b733fcd52cdf6700 Mon Sep 17 00:00:00 2001
From: Victor Chukwuebuka Umeh <41862157+vyktoremario@users.noreply.github.com>
Date: Fri, 23 Jan 2026 18:15:44 +0100
Subject: [PATCH 2/2] align items

---
 .../JourneyCards/JourneyCards.astro           | 32 +++++++++++++------
 1 file changed, 23 insertions(+), 9 deletions(-)

diff --git a/src/components/JourneyCards/JourneyCards.astro b/src/components/JourneyCards/JourneyCards.astro
index 81a00e7914e..528b1c1f625 100644
--- a/src/components/JourneyCards/JourneyCards.astro
+++ b/src/components/JourneyCards/JourneyCards.astro
@@ -102,21 +102,32 @@ const tabs = columns.map((column) => ({
     badge: item.badge,
   })),
 }))
+
+const rows = columns[0].items.map((_, rowIndex) => ({
+  items: columns.map((col) => col.items[rowIndex]),
+}))
 ---
 
 <section>
   <section class="desktop">
     <Typography variant="h4" className="section-title">Start your Chainlink journey</Typography>
-    <div class="journey-cards">
-      {
-        columns.map((column) => (
-          <div class="journey-column">
+
+    <div class="journey-rows">
+      <div class="journey-row journey-row--header">
+        {
+          columns.map((column) => (
             <header class="column-header">
               <Typography variant="h5" className="column-title">
                 {column.title}
               </Typography>
             </header>
-            {column.items.map((item) => (
+          ))
+        }
+      </div>
+      {
+        rows.map((row, i) => (
+          <div class="journey-row">
+            {row.items.map((item, j) => (
               <a href={item.href} class="journey-card">
                 <div class="card-content">
                   <Typography variant="body-semi">{item.title}</Typography>
@@ -152,14 +163,17 @@ const tabs = columns.map((column) => ({
     display: block;
   }
 
-  .journey-cards {
+  .journey-rows {
+    display: grid;
+    gap: 0;
+  }
+
+  .journey-row {
     display: grid;
     grid-template-columns: repeat(3, 1fr);
   }
 
-  .journey-column {
-    display: flex;
-    flex-direction: column;
+  .journey-row:not(.journey-row--header) > * {
     border-left: 1px solid var(--border);
   }