feat: داشبورد — لیست کاشی پکیج‌ها + مدال انتخاب روش پرداخت

- حذف متن hardcoded 'پکیج پایه ۵۶ میلیون تومان' و دیالوگ inline
- ایجاد PackagePurchaseDialog — کامپوننت مستقل 2 مرحله‌ای:
  مرحله ۱: نمایش کاشی‌های پکیج (ریسپانسیو ۲-۳ تایی)
  مرحله ۲: انتخاب روش پرداخت (درگاه بانکی / دایا الماس)
- دایا الماس فقط برای پکیج پایه + دور اول نمایش داده میشه
- پکیج‌ها داینامیک از API بارگذاری میشن
- تغییر متن CTA از 'شروع فرآیند تامین اعتبار' به 'تهیه پکیج'
- تغییر متن راهنما از 'پکیج پایه را تهیه کنید' به 'یکی از پکیج‌ها را تهیه کنید'
- CSS: hover effects + badge + responsive tiles

src/FrontOffice.Main/wwwroot/css/site.css

@@ -1611,3 +1611,30 @@ html, body {
 }
 
 /*#endregion*/
+
+/* ── Package Purchase Dialog tiles ── */
+.pkg-tile {
+    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
+    position: relative;
+}
+.pkg-tile:hover {
+    transform: translateY(-3px);
+    box-shadow: 0 6px 20px rgba(0,0,0,.08);
+    border-color: var(--mud-palette-primary) !important;
+}
+.pkg-tile-badge {
+    position: absolute;
+    top: 8px;
+    right: 8px;
+}
+.pkg-payment-option {
+    transition: transform .15s ease, box-shadow .15s ease;
+}
+.pkg-payment-option:hover {
+    transform: translateY(-2px);
+    box-shadow: 0 4px 12px rgba(0,0,0,.06);
+}
+@media (max-width: 600px) {
+    .pkg-tile { padding: .8rem !important; }
+    .pkg-tile .mud-avatar-large { width: 48px !important; height: 48px !important; }
+}