From d68db09810fb7b6104b881e176d861332a417a06 Mon Sep 17 00:00:00 2001
From: aramesh-site deploy <deploy@aramesh-site.local>
Date: Wed, 7 Oct 2026 09:56:15 +0000
Subject: [PATCH] =?UTF-8?q?feat(timeline):=20=DA=A9=D8=A7=D8=B1=D8=AA=20?=
 =?UTF-8?q?=D9=BE=D8=A7=DB=8C=D8=A7=D9=86=DB=8C=20(=D8=AA=D8=B9=D9=87?=
 =?UTF-8?q?=D8=AF=DB=8C=20=D9=81=D8=B1=D8=A7=D8=AA=D8=B1=20=D8=A7=D8=B2=20?=
 =?UTF-8?q?=D8=AA=D8=AD=D9=88=DB=8C=D9=84=20=D8=B3=D8=A7=D8=AE=D8=AA=D9=85?=
 =?UTF-8?q?=D8=A7=D9=86)=20=D9=88=D8=B3=D8=B7=20=D8=AE=D8=B7=20=D8=B2?=
 =?UTF-8?q?=D9=85=D8=A7=D9=86=DB=8C=20=D9=85=DB=8C=E2=80=8C=D9=86=D8=B4?=
 =?UTF-8?q?=DB=8C=D9=86=D8=AF=20=E2=80=94=20=D9=82=D8=A7=D8=A8=20=D9=86?=
 =?UTF-8?q?=D8=AA=DB=8C=D8=AC=D9=87=E2=80=8C=DA=AF=DB=8C=D8=B1=DB=8C=20?=
 =?UTF-8?q?=D8=AF=D8=A7=D8=B3=D8=AA=D8=A7=D9=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/components/home/Timeline.tsx | 10 +++++++---
 1 file changed, 7 insertions(+), 3 deletions(-)

diff --git a/frontend/src/components/home/Timeline.tsx b/frontend/src/components/home/Timeline.tsx
index 5785923..94dba83 100644
--- a/frontend/src/components/home/Timeline.tsx
+++ b/frontend/src/components/home/Timeline.tsx
@@ -9,7 +9,7 @@ const ease = [0.23, 1, 0.32, 1] as const
 
 type Milestone = TimelineItem
 
-function Item({ item, index }: { item: Milestone; index: number }) {
+function Item({ item, index, featured = false }: { item: Milestone; index: number; featured?: boolean }) {
   const ref = useRef<HTMLLIElement>(null)
   const active = useInView(ref, { once: true, amount: 0.6 })
   const onRight = index % 2 === 0
@@ -28,7 +28,11 @@ function Item({ item, index }: { item: Milestone; index: number }) {
 
       <motion.div
         className={`pr-8 md:pr-0 ${
-          onRight ? 'md:col-start-1 md:pl-16 md:text-left' : 'md:col-start-2 md:pr-16'
+          featured
+            ? 'md:col-span-2 md:col-start-1 md:max-w-xl md:mx-auto'
+            : onRight
+              ? 'md:col-start-1 md:pl-16 md:text-left'
+              : 'md:col-start-2 md:pr-16'
         }`}
         initial={{ opacity: 0, y: 24 }}
         animate={active ? { opacity: 1, y: 0 } : { opacity: 0, y: 24 }}
@@ -86,7 +90,7 @@ export function Timeline() {
 
           <ol className="flex flex-col gap-12 md:gap-16">
             {timeline.map((item, i) => (
-              <Item key={item.id} item={item} index={i} />
+              <Item key={item.id} item={item} index={i} featured={i === timeline.length - 1} />
             ))}
           </ol>
           <div className="mt-12">