feat(pricing): introduce real-time budget estimator

This commit introduces a real-time budget estimator for event services. A new summary sidebar now displays a live,
itemized breakdown of costs as the user selects options in the order form.

Key changes include:
- A new `OrderSummary` component to display the price breakdown and total.
- Comprehensive pricing logic implemented in the `useEventOrder` composable.
- A responsive two-column layout on the main page to accommodate the summary.
- UI/UX improvements across the form, including clearer labels and subtle transition animations for conditional fields.

app/pages/index.vue

@@ -6,24 +6,40 @@
     />
 
     <UContainer>
-      <UForm :schema="orderSchema" :state="orderState" class="space-y-4">
-        <!-- 联系人信息 -->
-        <EventOrderMetaDetails />
-        <!-- 竞标大屏 -->
-        <EventOrderProductBidding />
-        <!-- 背景设计 -->
-        <EventOrderProductBackgroundDesign />
-        <!-- 致辞 / 流程 PPT 设计 -->
-        <EventOrderProductFlowDesign />
-        <!-- 赞助商名册 -->
-        <EventOrderProductSponsor />
-      </UForm>
+      <div class="grid grid-cols-1 lg:grid-cols-3 gap-6">
+        <div class="lg:col-span-2">
+          <UForm :schema="orderSchema" :state="orderState" class="space-y-4">
+            <!-- 基本信息 -->
+            <EventOrderMetaDetails />
+            <!-- 竞价系统 -->
+            <EventOrderProductBidding />
+            <!-- 舞台背景设计 -->
+            <EventOrderProductBackgroundDesign />
+            <!-- 流程 / 投影 PPT 设计 -->
+            <EventOrderProductFlowDesign />
+            <!-- 赞助商位设计 -->
+            <EventOrderProductSponsor />
+          </UForm>
+        </div>
+        <div class="lg:col-span-1">
+          <EventOrderSummary />
+        </div>
+      </div>
     </UContainer>
   </div>
 </template>
 
 <script lang="ts" setup>
 const { orderSchema, orderState } = useEventOrder();
+
+useSeoMeta({
+  title: "Tootaio · 活动价目估算",
+  description:
+    "在线选择服务，实时获得预算估算，包括竞价系统、舞台背景设计、流程/投影PPT与赞助商位设计。",
+  ogTitle: "Tootaio · 活动价目估算",
+  ogDescription: "在线选择服务，实时获得预算估算：竞价系统、舞台背景、PPT等。",
+  twitterCard: "summary_large_image",
+});
 </script>
 
 <style></style>