feat(timeline): کارت پایانی (تعهدی فراتر از تحویل ساختمان) وسط خط زمانی می‌نشیند — قاب نتیجه‌گیری داستان

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">