fix: Add max-w-4xl mx-auto to sections in vineman-2

src/pages/ระบบรั้วไวน์แมน-vineman-2/index.astro

@@ -89,8 +89,9 @@ import Footer from '@/components/common/Footer.astro';
     <!-- Products Overview -->
     <section class="section bg-gray-50">
       <div class="container-custom">
-        <h2 class="text-2xl md:text-xl font-bold text-secondary-900 mb-8 text-center">ลวดหนาม/เสารั้ว/เสารับแรง</h2>
-        <div class="grid grid-cols-2 md:grid-cols-4 gap-6">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl md:text-xl font-bold text-secondary-900 mb-8 text-center">ลวดหนาม/เสารั้ว/เสารับแรง</h2>
+          <div class="grid grid-cols-2 md:grid-cols-4 gap-6">
           <div class="text-center">
             <img 
               src="/images/products-raw/vineman/ระบบรั้วไวน์แมน.jpg" 
@@ -124,14 +125,16 @@ import Footer from '@/components/common/Footer.astro';
             <p class="text-secondary-700 font-medium">ฟิคซ์ล็อค</p>
           </div>
         </div>
+        </div>
       </div>
     </section>
 
     <!-- 6 Techniques -->
     <section class="section bg-white">
       <div class="container-custom">
-        <h2 class="text-2xl md:text-xl font-bold text-secondary-900 mb-8 text-center">6 เทคนิคน่ารู้ ก่อนเลือกใช้ ระบบรั้วตาข่าย</h2>
-        <div class="grid lg:grid-cols-2 gap-8 items-center">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl md:text-xl font-bold text-secondary-900 mb-8 text-center">6 เทคนิคน่ารู้ ก่อนเลือกใช้ ระบบรั้วตาข่าย</h2>
+          <div class="grid lg:grid-cols-2 gap-8 items-center">
           <div>
             <img 
               src="/images/products-raw/vineman/เทคนิคน่ารู้-ก่อนเลือกใช้-ระบบรั้วตาข่าย-488x1024.jpg" 
@@ -166,16 +169,18 @@ import Footer from '@/components/common/Footer.astro';
             </div>
           </div>
         </div>
+        </div>
       </div>
     </section>
 
     <!-- Problems & Solutions -->
     <section class="section bg-gray-50">
       <div class="container-custom">
-        <h2 class="text-2xl md:text-xl font-bold text-secondary-900 mb-8 text-center">ทุกปัญหา! ระบบรั้วเสาปูน แก้ไขด้วยระบบรั้วไวน์แมน</h2>
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl md:text-xl font-bold text-secondary-900 mb-8 text-center">ทุกปัญหา! ระบบรั้วเสาปูน แก้ไขด้วยระบบรั้วไวน์แมน</h2>
           
-        <!-- Problems -->
-        <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4 mb-8">
+          <!-- Problems -->
+          <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4 mb-8">
           <div class="text-center">
             <img src="/images/products-raw/vineman/จุดเชื่อมของเสาค้ำยันไม่คงทน.jpg" alt="จุดเชื่อมของเสาค้ำยันไม่คงทน" class="w-full h-auto rounded-lg mb-2" width="600" height="400" loading="lazy" decoding="async" />
             <p class="text-sm text-secondary-700">จุดเชื่อมของเสาค้ำยันไม่คงทน</p>
@@ -213,14 +218,17 @@ import Footer from '@/components/common/Footer.astro';
             <p class="text-secondary-600 text-sm mt-2">ระบบรั้วตาข่ายไวน์แมน สามารถติดตั้งเดินแนวรั้วบนพื้นที่ทุกรูปแบบทั้งขึ้น-ลง เนินส่วนเว้า-ส่วนโค้งได้อย่างแข็งแรงและต่อเนื่อง</p>
           </div>
         </div>
+        </div>
+        </div>
       </div>
     </section>
 
     <!-- Pole Types -->
     <section class="section bg-white">
       <div class="container-custom">
-        <h2 class="text-2xl md:text-xl font-bold text-secondary-900 mb-8 text-center">รั้วตาข่ายไวน์แมน ใช้ได้กับเสาทุกประเภท</h2>
-        <div class="grid md:grid-cols-3 gap-6">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl md:text-xl font-bold text-secondary-900 mb-8 text-center">รั้วตาข่ายไวน์แมน ใช้ได้กับเสาทุกประเภท</h2>
+          <div class="grid md:grid-cols-3 gap-6">
           <div class="text-center">
             <img src="/images/products-raw/vineman/ระบบรั้วไวน์แมน-ระยะห่างของเสา-5-8-เมตร-1024x302.jpg" alt="ระยะห่างของเสา 5-8 เมตร" class="w-full h-auto rounded-xl mb-3" width="600" height="400" loading="lazy" decoding="async" />
             <p class="text-secondary-700 font-medium">เสาไวน์แมน ระยะห่าง 5-8 เมตร</p>
@@ -234,14 +242,17 @@ import Footer from '@/components/common/Footer.astro';
             <p class="text-secondary-700 font-medium">เสาไม้เนื้อแข็ง ระยะห่าง 4-6 เมตร</p>
           </div>
         </div>
+        </div>
+        </div>
       </div>
     </section>
 
     <!-- Semi-Spring -->
     <section class="section bg-gray-50">
       <div class="container-custom">
-        <h2 class="text-2xl md:text-xl font-bold text-secondary-900 mb-8 text-center">ไวน์แมน รั้วตาข่ายกึ่งสปริง</h2>
-        <div class="grid lg:grid-cols-2 gap-8 items-center">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl md:text-xl font-bold text-secondary-900 mb-8 text-center">ไวน์แมน รั้วตาข่ายกึ่งสปริง</h2>
+          <div class="grid lg:grid-cols-2 gap-8 items-center">
           <div>
             <img src="/images/products-raw/vineman/ไวน์แมน-รั้วตาข่ายกึ่งสปริง.jpg" alt="รั้วตาข่ายกึ่งสปริง" class="w-full h-auto rounded-xl" width="600" height="400" loading="lazy" decoding="async" />
           </div>
@@ -269,14 +280,16 @@ import Footer from '@/components/common/Footer.astro';
             </div>
           </div>
         </div>
+        </div>
       </div>
     </section>
 
     <!-- Buying Guide -->
     <section class="section bg-white">
       <div class="container-custom">
-        <h2 class="text-2xl md:text-xl font-bold text-secondary-900 mb-8 text-center">VINEMAN Buying Guide</h2>
-        <div class="grid lg:grid-cols-2 gap-8">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl md:text-xl font-bold text-secondary-900 mb-8 text-center">VINEMAN Buying Guide</h2>
+          <div class="grid lg:grid-cols-2 gap-8">
           <div>
             <img src="/images/products-raw/vineman/VINEMAN-Buying-Guide.jpg" alt="VINEMAN Buying Guide" class="w-full h-auto rounded-xl" width="600" height="400" loading="lazy" decoding="async" />
           </div>
@@ -289,13 +302,15 @@ import Footer from '@/components/common/Footer.astro';
             <p class="text-secondary-500 text-xs">(สูตรในการคำนวณพื้นที่นี้ สามารถนำไปคำนวณกับพื้นที่รูปทรงสี่เหลี่ยมจตุรัส และพื้นที่รูปทรงอื่นๆ ได้โดยประมาณ)</p>
           </div>
         </div>
+        </div>
       </div>
     </section>
 
     <!-- Calculation Table -->
     <section class="section bg-gray-50">
       <div class="container-custom">
-        <h2 class="text-2xl md:text-xl font-bold text-secondary-900 mb-8 text-center">ตาราง การคำนวณปริมาณเบื้องต้น</h2>
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl md:text-xl font-bold text-secondary-900 mb-8 text-center">ตาราง การคำนวณปริมาณเบื้องต้น</h2>
         <img src="/images/products-raw/vineman/ตารางการคำนวณปริมาณเบื้องต้น-1024x322.jpg" alt="ตารางการคำนวณปริมาณเบื้องต้น" class="w-full max-w-3xl mx-auto h-auto rounded-xl" width="800" height="600" loading="lazy" decoding="async" />
         <div class="mt-6 p-4 bg-yellow-50 rounded-xl max-w-3xl mx-auto">
           <p class="text-secondary-700 text-sm"><strong>หมายเหตุ:</strong></p>
@@ -311,10 +326,11 @@ import Footer from '@/components/common/Footer.astro';
     <!-- Specifications -->
     <section class="section bg-white">
       <div class="container-custom">
-        <h2 class="text-2xl md:text-xl font-bold text-secondary-900 mb-8 text-center">Specification</h2>
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl md:text-xl font-bold text-secondary-900 mb-8 text-center">Specification</h2>
 
-        <!-- ตาข่ายถักปม -->
-        <div class="mb-12 p-6 bg-gray-50 rounded-xl">
+          <!-- ตาข่ายถักปม -->
+          <div class="mb-12 p-6 bg-gray-50 rounded-xl">
           <h3 class="text-xl font-bold text-secondary-900 mb-4">ตาข่ายถักปม (ยาวม้วนละ 100 เมตร)</h3>
           <div class="grid lg:grid-cols-2 gap-6">
             <img src="/images/products-raw/vineman/ยืดหยุ่นสูง-300x294.jpg" alt="ยืดหยุ่นสูง" class="w-full h-auto rounded-xl" width="600" height="400" loading="lazy" decoding="async" />
@@ -394,14 +410,16 @@ import Footer from '@/components/common/Footer.astro';
           </div>
           <img src="/images/products-raw/vineman/ลวดหนามซิงค์อลูมิเนียม-ไวน์แมน-1024x673.jpg" alt="ลวดหนามซิงค์อลูมิเนียมไวน์แมน" class="w-full h-auto rounded-xl mt-4" width="600" height="400" loading="lazy" decoding="async" />
         </div>
+        </div>
       </div>
     </section>
 
     <!-- Product Features Section -->
     <section class="section bg-white">
       <div class="container-custom">
-        <h2 class="text-2xl md:text-xl font-bold text-secondary-900 mb-8 text-center">จุดเด่นของระบบรั้วไวน์แมน</h2>
-        <div class="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl md:text-xl font-bold text-secondary-900 mb-8 text-center">จุดเด่นของระบบรั้วไวน์แมน</h2>
+          <div class="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
           <div class="p-6 bg-gray-50 rounded-xl">
             <div class="w-12 h-12 bg-primary-100 rounded-full flex items-center justify-center mb-4">
               <svg class="w-6 h-6 text-primary-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
@@ -457,16 +475,18 @@ import Footer from '@/components/common/Footer.astro';
             <p class="text-secondary-600 text-sm">เข้ากันได้กับเสาไวน์แมน เสาปูน เสาไม้เนื้อแข็ง ติดตั้งเดินแนวรั้วขึ้น-ลงเนินได้</p>
           </div>
         </div>
+        </div>
       </div>
     </section>
 
     <!-- Application Guide Section -->
     <section class="section bg-gray-50">
       <div class="container-custom">
-        <h2 class="text-2xl md:text-xl font-bold text-secondary-900 mb-8 text-center">การใช้งานระบบรั้วไวน์แมน</h2>
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl md:text-xl font-bold text-secondary-900 mb-8 text-center">การใช้งานระบบรั้วไวน์แมน</h2>
           
-        <!-- Application Categories -->
-        <div class="grid md:grid-cols-2 lg:grid-cols-4 gap-6 mb-8">
+          <!-- Application Categories -->
+          <div class="grid md:grid-cols-2 lg:grid-cols-4 gap-6 mb-8">
           <div class="text-center">
             <div class="w-16 h-16 bg-primary-600 rounded-full flex items-center justify-center mx-auto mb-4">
               <svg class="w-8 h-8 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
@@ -553,15 +573,17 @@ import Footer from '@/components/common/Footer.astro';
             </table>
           </div>
         </div>
+        </div>
       </div>
     </section>
 
     <!-- FAQ Section -->
     <section class="section bg-white">
       <div class="container-custom">
-        <h2 class="text-2xl md:text-xl font-bold text-secondary-900 mb-8 text-center">คำถามที่พบบ่อยเกี่ยวกับระบบรั้วไวน์แมน</h2>
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl md:text-xl font-bold text-secondary-900 mb-8 text-center">คำถามที่พบบ่อยเกี่ยวกับระบบรั้วไวน์แมน</h2>
           
-        <div class="max-w-3xl mx-auto space-y-4">
+          <div class="space-y-4">
           <!-- FAQ 1 -->
           <div class="border border-gray-200 rounded-xl overflow-hidden">
             <details class="group">