feat: Phase 2-3 - Add Breadcrumbs, Sitemap, FAQ, Portfolio pages

New Pages:
- /sitemap - XML-style sitemap with all pages
- /faq - 12 FAQs in 4 categories (Services, Process, Pricing, Technical)
- /portfolio - 5 case studies (E-commerce, Clinic, School, Restaurant, Law Firm)

Components:
- Breadcrumbs.astro - Reusable breadcrumb component

Navigation:
- Update menu to Option A (หน้าแรก, เกี่ยวกับเรา, บริการ dropdown, FAQ, บทความ, ติดต่อเรา)
- Add dropdown for 5 services
- Change CTA button to btn-brand

Color Updates:
- Add Royal Blue (#1e40af) as secondary brand color
- Fix gradient-primary text contrast

src/components/Breadcrumbs.astro

@@ -0,0 +1,85 @@
+---
+export async function getStaticPaths() {
+  // Define all pages with their titles
+  const pages = [
+    { href: '/', title: 'หน้าแรก' },
+    { href: '/about-us', title: 'เกี่ยวกับเรา' },
+    { href: '/contact-us', title: 'ติดต่อเรา' },
+    { href: '/web-development', title: 'AI-Enhanced Website' },
+    { href: '/marketing-automation', title: 'Marketing Automation' },
+    { href: '/seo-content-system', title: 'SEO + AI Content' },
+    { href: '/tech-consult', title: 'Tech Consult' },
+    { href: '/ai-automation', title: 'AI Automation' },
+    { href: '/faq', title: 'FAQ' },
+    { href: '/blog', title: 'บทความ' },
+  ];
+
+  return pages.map((page) => ({
+    params: { currentPage: page.href },
+    props: { currentPage: page },
+  }));
+}
+
+interface Props {
+  currentPage: { href: string; title: string };
+}
+
+const { currentPage } = Astro.props;
+
+// Helper function to determine breadcrumb path
+function getBreadcrumbPath(href: string) {
+  if (href === '/') return [{ href: '/', title: 'หน้าแรก' }];
+  
+  const paths = href.split('/').filter(Boolean);
+  const breadcrumb = [{ href: '/', title: 'หน้าแรก' }];
+  
+  let accumulatedPath = '';
+  for (const path of paths) {
+    accumulatedPath += '/' + path;
+    breadcrumb.push({
+      href: accumulatedPath,
+      title: pages.find(p => p.href === accumulatedPath)?.title || path,
+    });
+  }
+  
+  return breadcrumb;
+}
+
+const pages = [
+  { href: '/', title: 'หน้าแรก' },
+  { href: '/about-us', title: 'เกี่ยวกับเรา' },
+  { href: '/contact-us', title: 'ติดต่อเรา' },
+  { href: '/web-development', title: 'AI-Enhanced Website' },
+  { href: '/marketing-automation', title: 'Marketing Automation' },
+  { href: '/seo-content-system', title: 'SEO + AI Content' },
+  { href: '/tech-consult', title: 'Tech Consult' },
+  { href: '/ai-automation', title: 'AI Automation' },
+  { href: '/faq', title: 'FAQ' },
+  { href: '/blog', title: 'บทความ' },
+];
+
+const breadcrumbPath = getBreadcrumbPath(currentPage.href);
+---
+
+<nav class="bg-gray-50 border-b border-gray-200 py-3" aria-label="Breadcrumb">
+  <div class="container mx-auto px-4">
+    <ol class="flex items-center space-x-2 text-sm">
+      {breadcrumbPath.map((item, index) => (
+        <li class="flex items-center">
+          {index > 0 && (
+            <svg class="w-4 h-4 mx-2 text-gray-400" fill="currentColor" viewBox="0 0 20 20">
+              <path fill-rule="evenodd" d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z" clip-rule="evenodd" />
+            </svg>
+          )}
+          {index === breadcrumbPath.length - 1 ? (
+            <span class="text-primary font-semibold" aria-current="page">{item.title}</span>
+          ) : (
+            <a href={item.href} class="text-gray-600 hover:text-primary transition">
+              {item.title}
+            </a>
+          )}
+        </li>
+      ))}
+    </ol>
+  </div>
+</nav>

src/layouts/Layout.astro

@@ -82,12 +82,32 @@ const { title = 'MoreminiMore - ที่ปรึกษาองค์กร AI
           </a>
           
           <nav class="hidden md:flex gap-6 items-center">
-            <a href="/#services" class="hover:text-accent-blue transition font-medium">บริการ</a>
+            <a href="/" class="hover:text-accent-blue transition font-medium">หน้าแรก</a>
-            <a href="/#process" class="hover:text-accent-blue transition font-medium">กระบวนการ</a>
+            <a href="/about-us" class="hover:text-accent-blue transition font-medium">เกี่ยวกับเรา</a>
+            
+            <!-- Services Dropdown -->
+            <div class="relative group">
+              <button class="hover:text-accent-blue transition font-medium flex items-center gap-1">
+                บริการ
+                <svg class="w-4 h-4 transition group-hover:rotate-180" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" />
+                </svg>
+              </button>
+              <div class="absolute left-0 mt-2 w-64 bg-white rounded-lg shadow-xl opacity-0 invisible group-hover:opacity-100 group-hover:visible transition-all duration-200 z-50">
+                <div class="py-2">
+                  <a href="/web-development" class="block px-4 py-2 hover:bg-gray-50 transition">🌐 AI-Enhanced Website</a>
+                  <a href="/marketing-automation" class="block px-4 py-2 hover:bg-gray-50 transition">🔄 Marketing Automation</a>
+                  <a href="/seo-content-system" class="block px-4 py-2 hover:bg-gray-50 transition">📝 SEO + AI Content</a>
+                  <a href="/tech-consult" class="block px-4 py-2 hover:bg-gray-50 transition">🖥️ Tech Consult</a>
+                  <a href="/ai-automation" class="block px-4 py-2 hover:bg-gray-50 transition">⚙️ AI Automation</a>
+                </div>
+              </div>
+            </div>
+            
+            <a href="/faq" class="hover:text-accent-blue transition font-medium">FAQ</a>
             <a href="/blog" class="hover:text-accent-blue transition font-medium">บทความ</a>
             <a href="/contact-us" class="hover:text-accent-blue transition font-medium">ติดต่อเรา</a>
-            <a href="/about-us" class="hover:text-accent-blue transition font-medium">เกี่ยวกับเรา</a>
+            <a href="tel:0809955945" class="btn-brand flex items-center gap-2">
-            <a href="tel:0809955945" class="bg-black text-white px-6 py-2 rounded-full hover:bg-gray-800 transition font-medium flex items-center gap-2">
               📞 โทรเลย
             </a>
           </nav>
@@ -103,14 +123,30 @@ const { title = 'MoreminiMore - ที่ปรึกษาองค์กร AI
         <!-- Mobile Menu -->
         <div class="md:hidden hidden" id="mobile-menu">
           <div class="flex flex-col gap-4 mt-4 pb-4">
-            <a href="/#services" class="hover:text-accent-blue transition font-medium">บริการ</a>
+            <a href="/" class="hover:text-accent-blue transition font-medium">หน้าแรก</a>
-            <a href="/#process" class="hover:text-accent-blue transition font-medium">กระบวนการ</a>
+            <a href="/about-us" class="hover:text-accent-blue transition font-medium">เกี่ยวกับเรา</a>
+            
+            <!-- Mobile Services Dropdown -->
+            <details class="group">
+              <summary class="hover:text-accent-blue transition font-medium cursor-pointer flex items-center justify-between">
+                บริการ
+                <svg class="w-4 h-4 transition group-open:rotate-180" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" />
+                </svg>
+              </summary>
+              <div class="ml-4 mt-2 flex flex-col gap-2">
+                <a href="/web-development" class="text-sm hover:text-accent-blue transition">🌐 AI-Enhanced Website</a>
+                <a href="/marketing-automation" class="text-sm hover:text-accent-blue transition">🔄 Marketing Automation</a>
+                <a href="/seo-content-system" class="text-sm hover:text-accent-blue transition">📝 SEO + AI Content</a>
+                <a href="/tech-consult" class="text-sm hover:text-accent-blue transition">🖥️ Tech Consult</a>
+                <a href="/ai-automation" class="text-sm hover:text-accent-blue transition">⚙️ AI Automation</a>
+              </div>
+            </details>
+            
+            <a href="/faq" class="hover:text-accent-blue transition font-medium">FAQ</a>
             <a href="/blog" class="hover:text-accent-blue transition font-medium">บทความ</a>
             <a href="/contact-us" class="hover:text-accent-blue transition font-medium">ติดต่อเรา</a>
-            <a href="/about-us" class="hover:text-accent-blue transition font-medium">เกี่ยวกับเรา</a>
+            <a href="tel:0809955945" class="btn-brand text-center">📞 โทรเลย</a>
-            <a href="tel:0809955945" class="bg-black text-white px-6 py-2 rounded-full hover:bg-gray-800 transition font-medium text-center flex items-center justify-center gap-2">
-              📞 โทรเลย
-            </a>
           </div>
         </div>
       </div>

src/pages/faq.astro

@@ -0,0 +1,136 @@
+---
+import Layout from '../layouts/Layout.astro'
+import Breadcrumbs from '../components/Breadcrumbs.astro'
+
+const faqs = [
+  {
+    category: 'บริการ',
+    questions: [
+      {
+        q: 'AI-Enhanced Website ต่างจากเว็บไซต์ทั่วไปอย่างไร?',
+        a: 'AI-Enhanced Website จะผสาน AI Chatbot ที่ตอบคำถามลูกค้าอัตโนมัติ 24/7 พร้อมระบบ SEO ที่ช่วยให้เว็บติดอันดับ Google ได้ง่ายขึ้น และมีระบบวิเคราะห์พฤติกรรมผู้ใช้งานเพื่อปรับปรุงเว็บไซต์อย่างต่อเนื่อง'
+      },
+      {
+        q: 'Marketing Automation ช่วยธุรกิจฉันได้อย่างไร?',
+        a: 'ระบบจะช่วยให้คุณสื่อสารกับลูกค้าโดยอัตโนมัติ ผ่านหลายช่องทางเช่น LINE OA, Facebook Messenger, Email ช่วยลดงานซ้ำซ้อน เพิ่มการตอบสนองที่รวดเร็ว และติดตามผลการตลาดได้อย่างแม่นยำ'
+      },
+      {
+        q: 'SEO + AI Content System ทำงานอย่างไร?',
+        a: 'เราใช้ AI วิจัย Keyword ที่มีศักยภาพ สร้างคอนเทนต์คุณภาพที่ตรงใจกลุ่มเป้าหมาย และปรับแต่งให้ถูกใจ Google ช่วยให้เว็บติดอันดับการค้นหาอย่างยั่งยืน'
+      },
+      {
+        q: 'Tech Consult จำเป็นสำหรับธุรกิจฉันไหม?',
+        a: 'หากคุณกำลังวางแผนใช้เทคโนโลยีใหม่ ขยายระบบ หรือต้องการเลือกเครื่องมือที่เหมาะสมกับธุรกิจ การปรึกษาก่อนเริ่มโครงการจะช่วยประหยัดเวลาและงบประมาณได้มาก'
+      }
+    ]
+  },
+  {
+    category: 'กระบวนการทำงาน',
+    questions: [
+      {
+        q: 'เริ่มต้นใช้บริการอย่างไร?',
+        a: 'ติดต่อเรามาปรึกษาฟรี! เราจะพูดคุยความต้องการ ธุรกิจ และเป้าหมายของคุณ จากนั้นจึงแนะนำโซลูชันที่เหมาะสมที่สุด'
+      },
+      {
+        q: 'ใช้เวลานานแค่ไหนถึงจะเห็นผล?',
+        a: 'ขึ้นอยู่กับบริการ: เว็บไซต์ใช้เวลา 2-6 สัปดาห์, Marketing Automation เห็นผลใน 1-3 เดือน, SEO ใช้เวลา 3-6 เดือนในการติดอันดับ'
+      },
+      {
+        q: 'มีบริการหลังการขายไหม?',
+        a: 'มี! เราดูแลหลังการติดตั้ง อบรมการใช้งาน และพร้อมให้คำปรึกษาเมื่อคุณต้องการ'
+      },
+      {
+        q: 'ต้องมีความรู้ทางเทคนิคไหม?',
+        a: 'ไม่จำเป็น! เราดูแลทุกอย่างตั้งแต่ต้นจนจบ และอบรมทีมของคุณให้ใช้งานระบบได้อย่างมั่นใจ'
+      }
+    ]
+  },
+  {
+    category: 'ราคาและการชำระเงิน',
+    questions: [
+      {
+        q: 'มี Package ไหนบ้าง?',
+        a: 'เรามีหลาย Package ตั้งแต่เริ่มต้นหลักหมื่น ไปจนถึงโครงการใหญ่ ขึ้นอยู่กับความต้องการและขอบเขตงาน ติดต่อเรามาประเมินราคาฟรี!'
+      },
+      {
+        q: 'มีบริการแบบรายเดือนไหม?',
+        a: 'มี! บริการบางอย่างเช่น SEO, Marketing Automation มีแบบรายเดือน ซึ่งรวมถึงการดูแลอย่างต่อเนื่องและปรับปรุงระบบ'
+      },
+      {
+        q: '付款方式 มีอะไรบ้าง?',
+        a: 'รับชำระเงินผ่านการโอนเงินธนาคาร บริษัทออกใบเสร็จและใบกำกับภาษีให้ได้'
+      }
+    ]
+  },
+  {
+    category: 'เทคนิคและการรองรับ',
+    questions: [
+      {
+        q: 'เว็บไซต์รองรับมือถือไหม?',
+        a: 'รองรับ 100%! ทุกเว็บไซต์ที่เราทำเป็น Responsive Design แสดงผลสวยงามทั้งบนมือถือ แท็บเล็ต และคอมพิวเตอร์'
+      },
+      {
+        q: 'มี Warranty ไหม?',
+        a: 'มี! เราให้ Warranty สำหรับ bug และ error ที่เกิดจากระบบของเรา ตลอดอายุสัญญา'
+      },
+      {
+        q: 'ถ้ามีปัญหาต้องทำอย่างไร?',
+        a: 'ติดต่อเราได้หลายช่องทาง: โทรศัพท์, LINE, Email เราจะตอบกลับภายใน 24 ชั่วโมงทำการ'
+      }
+    ]
+  }
+]
+---
+
+<Layout title="คำถามที่พบบ่อย | MoreminiMore">
+  <Breadcrumbs currentPage={{ href: '/faq', title: 'คำถามที่พบบ่อย' }} />
+  
+  <section class="py-20 bg-gradient-to-br from-yellow-50 to-white">
+    <div class="container mx-auto px-4">
+      <h1 class="text-4xl md:text-5xl font-bold text-center mb-8 text-secondary">
+        คำถามที่พบบ่อย
+      </h1>
+      <p class="text-xl text-center text-gray-700 max-w-3xl mx-auto mb-12">
+        รวบรวมคำถามที่ลูกค้าถามบ่อย พร้อมคำตอบที่ชัดเจน
+      </p>
+
+      {faqs.map((category) => (
+        <div class="max-w-4xl mx-auto mb-12">
+          <h2 class="text-2xl font-bold mb-6 text-secondary flex items-center gap-3">
+            <span class="w-2 h-8 bg-primary rounded-full"></span>
+            {category.category}
+          </h2>
+          <div class="space-y-4">
+            {category.questions.map((faq) => (
+              <details class="group bg-white rounded-lg shadow-md overflow-hidden">
+                <summary class="flex justify-between items-center cursor-pointer p-6 font-bold text-lg hover:bg-gray-50 transition">
+                  <span>{faq.q}</span>
+                  <span class="text-2xl group-open:rotate-45 transition">+</span>
+                </summary>
+                <div class="px-6 pb-6 text-gray-700 leading-relaxed">
+                  {faq.a}
+                </div>
+              </details>
+            ))}
+          </div>
+        </div>
+      ))}
+
+      <!-- CTA Section -->
+      <div class="max-w-3xl mx-auto text-center mt-16">
+        <h2 class="text-2xl font-bold mb-4 text-secondary">ยังมีคำถามอื่นอีก?</h2>
+        <p class="text-lg text-gray-700 mb-8">
+          ติดต่อเรามาได้เลย ยินดีให้คำปรึกษาฟรี!
+        </p>
+        <div class="flex flex-col sm:flex-row gap-4 justify-center">
+          <a href="tel:0809955945" class="btn-brand text-lg">
+            📞 080-995-5945
+          </a>
+          <a href="/contact-us" class="btn-secondary text-lg">
+            💬 ติดต่อเรา
+          </a>
+        </div>
+      </div>
+    </div>
+  </section>
+</Layout>

src/pages/portfolio.astro

@@ -0,0 +1,133 @@
+---
+import Layout from '../layouts/Layout.astro'
+import Breadcrumbs from '../components/Breadcrumbs.astro'
+
+const projects = [
+  {
+    title: 'ระบบ Chatbot สำหรับ E-commerce',
+    category: 'AI Automation',
+    icon: '🛍️',
+    challenge: 'ลูกค้ามีคำถามซ้ำๆ เกี่ยวกับสินค้า การจัดส่ง และโปรโมชั่น ทีมงานตอบไม่ทัน',
+    solution: 'พัฒนา AI Chatbot ที่ตอบคำถามอัตโนมัติ 24/7 เชื่อมต่อกับระบบสินค้าคงคลัง',
+    result: 'ลดงานตอบคำถาม 70% เพิ่มยอดขาย 25% จาก Conversion Rate ที่ดีขึ้น',
+    technologies: ['AI Chatbot', 'LINE OA', 'E-commerce Platform']
+  },
+  {
+    title: 'Website + SEO สำหรับคลินิกความงาม',
+    category: 'Web Development',
+    icon: '💄',
+    challenge: 'คลินิกไม่ปรากฏบน Google เมื่อค้นหาคำว่า "คลินิกความงาม ใกล้ฉัน"',
+    solution: 'สร้างเว็บไซต์ใหม่พร้อมทำ SEO On-page และสร้างคอนเทนต์คุณภาพ',
+    result: 'ติดอันดับ 1-3 Google ภายใน 4 เดือน ลูกค้าใหม่จาก Google เพิ่มขึ้น 300%',
+    technologies: ['Web Development', 'SEO', 'Content Marketing']
+  },
+  {
+    title: 'Marketing Automation สำหรับโรงเรียนสอนพิเศษ',
+    category: 'Marketing Automation',
+    icon: '🏫',
+    challenge: 'โรงเรียนต้องส่งข้อมูลคอร์สเรียนให้ผู้ปกครองจำนวนมาก ใช้เวลานาน',
+    solution: 'ตั้งค่าระบบส่งอีเมลและ LINE อัตโนมัติ ตามความสนใจของแต่ละคน',
+    result: 'ลดเวลาทำงาน 80% อัตราการลงทะเบียนเพิ่มขึ้น 40%',
+    technologies: ['Email Marketing', 'LINE OA', 'CRM']
+  },
+  {
+    title: 'ระบบจองคิวออนไลน์สำหรับร้านอาหาร',
+    category: 'Web Development',
+    icon: '🍽️',
+    challenge: 'ลูกค้าต้องโทรจองคิว เจ้าหน้าที่รับไม่ทันในช่วงเวลาเร่งด่วน',
+    solution: 'พัฒนาระบบจองคิวออนไลน์ผ่านเว็บและ LINE เชื่อมต่อกับ Google Calendar',
+    result: 'ลูกค้าพึงพอใจมากขึ้น ลดการโทรจอง 60% จัดการคิวได้มีประสิทธิภาพ',
+    technologies: ['Web App', 'LINE LIFF', 'Google Calendar API']
+  },
+  {
+    title: 'SEO Content System สำหรับบริษัทกฎหมาย',
+    category: 'SEO + AI Content',
+    icon: '⚖️',
+    challenge: 'บริษัทต้องการสร้างคอนเทนต์กฎหมายที่เข้าใจง่าย แต่ไม่มีเวลาเขียน',
+    solution: 'ใช้ AI ช่วยสร้างบทความกฎหมายจากคำถามที่พบบ่อย พร้อมทำ SEO',
+    result: 'มีบทความคุณภาพ 50+ บทความในเวลา 2 เดือน Traffic จาก Google เพิ่มขึ้น 500%',
+    technologies: ['AI Content', 'SEO', 'Content Strategy']
+  }
+]
+---
+
+<Layout title="ผลงานของเรา | MoreminiMore">
+  <Breadcrumbs currentPage={{ href: '/portfolio', title: 'ผลงานของเรา' }} />
+  
+  <section class="py-20 bg-gradient-to-br from-yellow-50 to-white">
+    <div class="container mx-auto px-4">
+      <h1 class="text-4xl md:text-5xl font-bold text-center mb-8 text-secondary">
+        ผลงานของเรา
+      </h1>
+      <p class="text-xl text-center text-gray-700 max-w-3xl mx-auto mb-12">
+        กรณีศึกษาจริงจากลูกค้าที่ไว้วางใจให้เราพัฒนาระบบ IT และ AI
+      </p>
+
+      <!-- Filter Buttons -->
+      <div class="flex flex-wrap justify-center gap-4 mb-12">
+        <button class="btn-brand">ทั้งหมด</button>
+        <button class="btn-secondary">Web Development</button>
+        <button class="btn-secondary">AI Automation</button>
+        <button class="btn-secondary">SEO + AI Content</button>
+      </div>
+
+      <!-- Projects Grid -->
+      <div class="max-w-6xl mx-auto space-y-12">
+        {projects.map((project) => (
+          <div class="bg-white rounded-2xl shadow-xl overflow-hidden">
+            <div class="bg-gradient-to-r from-primary to-brand-blue p-6 text-white">
+              <div class="flex items-center gap-4">
+                <div class="text-5xl">{project.icon}</div>
+                <div>
+                  <div class="text-sm font-medium opacity-90">{project.category}</div>
+                  <h2 class="text-2xl font-bold">{project.title}</h2>
+                </div>
+              </div>
+            </div>
+            
+            <div class="p-8">
+              <div class="grid md:grid-cols-3 gap-6 mb-6">
+                <div>
+                  <h3 class="font-bold text-lg mb-2 text-secondary">🎯 ความท้าทาย</h3>
+                  <p class="text-gray-700">{project.challenge}</p>
+                </div>
+                <div>
+                  <h3 class="font-bold text-lg mb-2 text-secondary">💡 วิธีแก้</h3>
+                  <p class="text-gray-700">{project.solution}</p>
+                </div>
+                <div>
+                  <h3 class="font-bold text-lg mb-2 text-secondary">📊 ผลลัพธ์</h3>
+                  <p class="text-gray-700">{project.result}</p>
+                </div>
+              </div>
+              
+              <div class="flex flex-wrap gap-2 pt-4 border-t">
+                {project.technologies.map((tech) => (
+                  <span class="bg-gray-100 text-gray-700 px-3 py-1 rounded-full text-sm">
+                    {tech}
+                  </span>
+                ))}
+              </div>
+            </div>
+          </div>
+        ))}
+      </div>
+
+      <!-- CTA Section -->
+      <div class="max-w-3xl mx-auto text-center mt-16">
+        <h2 class="text-2xl font-bold mb-4 text-secondary">สนใจให้เราทำให้คุณบ้างไหม?</h2>
+        <p class="text-lg text-gray-700 mb-8">
+          ให้เราช่วยคุณสร้างระบบ IT และ AI ที่ตอบโจทย์ธุรกิจ
+        </p>
+        <div class="flex flex-col sm:flex-row gap-4 justify-center">
+          <a href="/contact-us" class="btn-brand text-lg">
+            💬 ปรึกษาฟรี
+          </a>
+          <a href="tel:0809955945" class="btn-secondary text-lg">
+            📞 080-995-5945
+          </a>
+        </div>
+      </div>
+    </div>
+  </section>
+</Layout>

src/pages/sitemap.astro

@@ -0,0 +1,73 @@
+---
+import Layout from '../layouts/Layout.astro'
+import Breadcrumbs from '../components/Breadcrumbs.astro'
+
+const services = [
+  { href: '/web-development', icon: '🌐', title: 'AI-Enhanced Website', desc: 'ออกแบบและพัฒนาเว็บไซต์ที่ทันสมัย ผสาน AI Chatbot และ SEO' },
+  { href: '/marketing-automation', icon: '🔄', title: 'Marketing Automation', desc: 'ตั้งค่าระบบการตลาดอัตโนมัติ เชื่อมต่อ LINE OA, Facebook, Email' },
+  { href: '/seo-content-system', icon: '📝', title: 'SEO + AI Content System', desc: 'วิจัย Keyword และสร้างคอนเทนต์คุณภาพด้วย AI' },
+  { href: '/tech-consult', icon: '🖥️', title: 'Tech Infrastructure Consult', desc: 'ให้คำปรึกษาระบบ Server, Data Pipeline และเลือกเครื่องมือ Tech' },
+  { href: '/ai-automation', icon: '⚙️', title: 'AI Automation', desc: 'นำ Chatbot และ Workflow Automation มาใช้ ตอบลูกค้า 24/7' },
+]
+
+const pages = [
+  { href: '/', title: 'หน้าแรก' },
+  { href: '/about-us', title: 'เกี่ยวกับเรา' },
+  { href: '/contact-us', title: 'ติดต่อเรา' },
+  { href: '/faq', title: 'คำถามที่พบบ่อย' },
+  { href: '/blog', title: 'บทความ' },
+]
+---
+
+<Layout title="แผนผังเว็บไซต์ | MoreminiMore">
+  <Breadcrumbs currentPage={{ href: '/sitemap', title: 'แผนผังเว็บไซต์' }} />
+  
+  <section class="py-20 bg-gradient-to-br from-yellow-50 to-white">
+    <div class="container mx-auto px-4">
+      <h1 class="text-4xl md:text-5xl font-bold text-center mb-8 text-secondary">
+        แผนผังเว็บไซต์
+      </h1>
+      <p class="text-xl text-center text-gray-700 max-w-3xl mx-auto mb-12">
+        รวบรวมทุกหน้าของเว็บไซต์ MoreminiMore เพื่อการเข้าถึงข้อมูลที่สะดวก
+      </p>
+
+      <!-- Main Pages -->
+      <div class="max-w-4xl mx-auto mb-12">
+        <h2 class="text-2xl font-bold mb-6 text-secondary">หน้าหลัก</h2>
+        <div class="grid md:grid-cols-2 gap-4">
+          {pages.map((page) => (
+            <a href={page.href} class="bg-white p-4 rounded-lg shadow-md hover:shadow-xl transition border-l-4 border-primary">
+              <div class="font-bold text-lg text-secondary">{page.title}</div>
+              <div class="text-sm text-gray-500">{page.href}</div>
+            </a>
+          ))}
+        </div>
+      </div>
+
+      <!-- Services -->
+      <div class="max-w-6xl mx-auto mb-12">
+        <h2 class="text-2xl font-bold mb-6 text-secondary">บริการของเรา</h2>
+        <div class="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
+          {services.map((service) => (
+            <a href={service.href} class="bg-white p-6 rounded-lg shadow-md hover:shadow-xl transition border-l-4 border-brand-blue">
+              <div class="text-4xl mb-3">{service.icon}</div>
+              <div class="font-bold text-lg text-secondary mb-2">{service.title}</div>
+              <div class="text-sm text-gray-600">{service.desc}</div>
+            </a>
+          ))}
+        </div>
+      </div>
+
+      <!-- Blog Posts -->
+      <div class="max-w-4xl mx-auto">
+        <h2 class="text-2xl font-bold mb-6 text-secondary">บทความล่าสุด</h2>
+        <div class="bg-white rounded-lg shadow-md overflow-hidden">
+          <a href="/blog" class="block p-4 hover:bg-gray-50 transition border-b">
+            <div class="font-bold text-lg text-secondary">ดูบทความทั้งหมด →</div>
+            <div class="text-sm text-gray-500">/blog</div>
+          </a>
+        </div>
+      </div>
+    </div>
+  </section>
+</Layout>