feat(frontend): update pages, components and branding

Refresh Astro frontend implementation including new pages (Portfolio, Teams, Services), components, and styling updates.

apps/frontend/src/pages/marketing-solutions.astro

@@ -1,43 +1,24 @@
 ---
-import Layout from '../layouts/Layout.astro';
+/**
+ * Marketing Solutions Page - 行銷方案頁面
+ * Pixel-perfect implementation based on Webflow design
+ */
+import Layout from '../layouts/Layout.astro'
+import SolutionsHero from '../sections/SolutionsHero.astro'
+import ServicesList from '../sections/ServicesList.astro'
+
+// Metadata for SEO
+const title = '行銷解決方案 | 恩群數位行銷'
+const description = '恩群數位行銷提供全方位的數位行銷服務，包括 Google Ads、社群代操、論壇行銷、網紅行銷、網站設計等，協助您的品牌在數位時代脫穎而出。'
 ---
 
-<Layout>
-  <section class="solutions-section">
-    <div class="container">
-      <h1>行銷方案</h1>
-      <p>我們提供多樣化的行銷方案，幫助您的品牌深入人心。</p>
-      <ul>
-        <li>Google 商家關鍵字</li>
-        <li>Google Ads</li>
-        <li>社群代操</li>
-        <li>論壇行銷</li>
-        <li>網紅行銷</li>
-        <li>形象影片</li>
-      </ul>
-    </div>
-  </section>
+<Layout title={title} description={description}>
+  <!-- Hero Section -->
+  <SolutionsHero
+    title="行銷解決方案"
+    subtitle="提供全方位的數位行銷服務，協助您的品牌在數位時代脫穎而出"
+  />
+
+  <!-- Services List -->
+  <ServicesList />
 </Layout>
-
-<style>
-  .solutions-section {
-    padding: 40px 0;
-  }
-  .container {
-    max-width: 1200px;
-    margin: 0 auto;
-    padding: 0 20px;
-  }
-  h1 {
-    text-align: center;
-    margin-bottom: 30px;
-  }
-  ul {
-    list-style: none;
-    padding: 0;
-  }
-  li {
-    padding: 10px 0;
-    border-bottom: 1px solid #eee;
-  }
-</style>