فرانت‌اند: ویرایش زنده درجا — دوقلوی دیجیتال سایت برای ادمین

لایه ویرایش بصری روی سایت واقعی (بدون داشبورد جدا):

- ورود ادمین از مسیر پنهان /admin/login با توکن JWT (localStorage) و
  AdminContext شامل isEditMode و وضعیت ذخیره (همگام/در حال ذخیره/خطا)
- AdminBar شناور پایین صفحه (فقط برای کاربر واردشده): کلید حالت ویرایش،
  وضعیت ذخیره، خروج — حالت ویرایش در sessionStorage می‌ماند
- InlineEdit: در حالت عادی دقیقاً همان HTML قبلی (بدون تغییر چیدمان)؛
  در حالت ویرایش کادرخط‌چین + contentEditable با ذخیره خودکار در blur
  (Enter ذخیره، Esc لغو) — وایرایش‌شده روی همه متن‌های سایت: هیرو،
  تیتر بخش‌ها، هیرو صفحات، داستان، فرم تماس، خبرنامه، فوتر، منو،
  برچسب‌های وضعیت پروژه و...
- کشوی عمومی EntityDrawer با پیکربندی متمرکز برای ۱۴ مجموعه (خدمات،
  پروژه‌ها، مقالات، نظرات، سوالات، تیم، تایم‌لاین، آمار، چرا آرامش،
  مدل‌های سرمایه‌گذاری، مراحل کار، دفاتر، گالری، منو): ویرایش چندفیلدی،
  افزودن، حذف و جابه‌جایی ترتیب (▲▼) با ذخیره خودکار هر فیلد
- دکمه‌های شناور ویرایش/حذف/ترتیب فقط در حالت ویرایش روی آیتم‌ها
- کشوهای یگانه: برند و لوگو، تنظیمات هیرو، فرم تماس، خبرنامه، فوتر،
  قبل/بعد و نقل‌قول داستان — آپلود تصویر به MinIO از همان‌جا
- به‌روزرسانی خوش‌بینانه SiteContext (updateSite) پس از هر PATCH؛
  مسیرها در حالت ویرایش کلیک نمی‌شوند؛ breadcrumb محافظ beforeunload

frontend/src/pages/Investment.tsx

@@ -4,16 +4,16 @@ import { Reveal } from '../components/Reveal'
 import { SectionHeading } from '../components/SectionHeading'
 import { Stats } from '../components/home/Stats'
 import { ContactSection } from '../components/ContactSection'
-import { usePageHero, useSectionHeading, useSite } from '../api'
+import { useSectionHeading, useSite } from '../api'
+import { AddItemButton, EditableItem } from '../admin/Editable'
 
 export function Investment() {
   const { investment_models } = useSite()
-  const hero = usePageHero('investment')
-  const heading = useSectionHeading('investment_models')
+    const heading = useSectionHeading('investment_models')
 
   return (
     <>
-      <PageHero title={hero.title} lead={hero.lead} image={hero.image} />
+      <PageHero pageKey="investment" />
 
       <section className="bg-ink py-24 lg:py-32" aria-labelledby="models-title">
         <div className="mx-auto max-w-site px-6 lg:px-10">
@@ -21,6 +21,7 @@ export function Investment() {
           <div className="mt-14 grid gap-6 lg:grid-cols-3">
             {investment_models.map((model, i) => (
               <Reveal key={model.id} delay={0.06 * i} className="h-full">
+                <EditableItem resource="investment_models" item={model} className="h-full">
                 <article className="group flex h-full flex-col border border-ivory/10 bg-char p-10 transition-all duration-300 ease-out hover:-translate-y-2 hover:border-copper/40 hover:shadow-lift transform-gpu will-change-transform">
                   <p className="text-sm font-bold text-copper/80">۰{(i + 1).toLocaleString('fa-IR')}</p>
 
@@ -41,8 +42,10 @@ export function Investment() {
                     </ul>
                   </div>
                 </article>
+                </EditableItem>
               </Reveal>
             ))}
+            <AddItemButton resource="investment_models" />
           </div>
         </div>
       </section>