Part 1: Source code - Astro project structure and components

2026-05-21 16:33:59 +07:00
commit 5219cf8f72
74 changed files with 14762 additions and 0 deletions
--- a/.gitignore
+++ b/.gitignore
@@ -0,0 +1,10 @@
+node_modules/
+dist/
+.astro/
+.env
+.env.local
+.env.*.local
+*.log
+.DS_Store
+*.swp
+*.swo
--- a/.npmrc
+++ b/.npmrc
@@ -0,0 +1 @@
+onlyBuiltDependencies=better-sqlite3
--- a/.omc/project-memory.json
+++ b/.omc/project-memory.json
@@ -0,0 +1,200 @@
+{
+  "version": "1.0.0",
+  "lastScanned": 1778722765790,
+  "projectRoot": "/Users/kunthawatgreethong/Gitea/dealplustech-emdash",
+  "techStack": {
+    "languages": [
+      {
+        "name": "JavaScript/TypeScript",
+        "version": ">=20.0.0",
+        "confidence": "high",
+        "markers": [
+          "package.json"
+        ]
+      },
+      {
+        "name": "TypeScript",
+        "version": null,
+        "confidence": "high",
+        "markers": [
+          "tsconfig.json"
+        ]
+      }
+    ],
+    "frameworks": [
+      {
+        "name": "astro",
+        "version": "6.1.7",
+        "category": "fullstack"
+      }
+    ],
+    "packageManager": "npm",
+    "runtime": "Node.js 20.0.0"
+  },
+  "build": {
+    "buildCommand": "npm run build 2>&1 | tail -5",
+    "testCommand": null,
+    "lintCommand": null,
+    "devCommand": "npm run dev",
+    "scripts": {
+      "dev": "astro dev",
+      "build": "astro build",
+      "preview": "astro preview",
+      "astro": "astro"
+    }
+  },
+  "conventions": {
+    "namingStyle": null,
+    "importStyle": null,
+    "testPattern": null,
+    "fileOrganization": "type-based"
+  },
+  "structure": {
+    "isMonorepo": false,
+    "workspaces": [],
+    "mainDirectories": [
+      "public",
+      "src"
+    ],
+    "gitBranches": null
+  },
+  "customNotes": [],
+  "directoryMap": {
+    "dist": {
+      "path": "dist",
+      "purpose": "Distribution/build output",
+      "fileCount": 1,
+      "lastAccessed": 1778722765769,
+      "keyFiles": [
+        "index.html"
+      ]
+    },
+    "public": {
+      "path": "public",
+      "purpose": "Public files",
+      "fileCount": 0,
+      "lastAccessed": 1778722765772,
+      "keyFiles": []
+    },
+    "src": {
+      "path": "src",
+      "purpose": "Source code",
+      "fileCount": 1,
+      "lastAccessed": 1778722765772,
+      "keyFiles": [
+        "env.d.ts"
+      ]
+    },
+    "src/components": {
+      "path": "src/components",
+      "purpose": "UI components",
+      "fileCount": 0,
+      "lastAccessed": 1778722765773,
+      "keyFiles": []
+    },
+    "src/pages": {
+      "path": "src/pages",
+      "purpose": "Page components",
+      "fileCount": 32,
+      "lastAccessed": 1778722765773,
+      "keyFiles": [
+        "about-us.astro",
+        "all-products.astro",
+        "contact-us.astro"
+      ]
+    }
+  },
+  "hotPaths": [
+    {
+      "path": "src/layouts/BaseLayout.astro",
+      "accessCount": 4,
+      "lastAccessed": 1778764408392,
+      "type": "file"
+    },
+    {
+      "path": "CLAUDE.md",
+      "accessCount": 3,
+      "lastAccessed": 1778722935903,
+      "type": "file"
+    },
+    {
+      "path": "src/pages/all-products.astro",
+      "accessCount": 3,
+      "lastAccessed": 1778765063509,
+      "type": "file"
+    },
+    {
+      "path": "src/pages/เครื่องเชื่อม-hdpe.astro",
+      "accessCount": 2,
+      "lastAccessed": 1778728155229,
+      "type": "file"
+    },
+    {
+      "path": "src/pages/ระบบรั้วไวน์แมน.astro",
+      "accessCount": 2,
+      "lastAccessed": 1778764284029,
+      "type": "file"
+    },
+    {
+      "path": "astro.config.mjs",
+      "accessCount": 1,
+      "lastAccessed": 1778722802839,
+      "type": "file"
+    },
+    {
+      "path": "src/styles/global.css",
+      "accessCount": 1,
+      "lastAccessed": 1778722802869,
+      "type": "file"
+    },
+    {
+      "path": "package.json",
+      "accessCount": 1,
+      "lastAccessed": 1778722802930,
+      "type": "file"
+    },
+    {
+      "path": "src/layouts/Layout.astro",
+      "accessCount": 1,
+      "lastAccessed": 1778722809476,
+      "type": "file"
+    },
+    {
+      "path": "src/pages/index.astro",
+      "accessCount": 1,
+      "lastAccessed": 1778722845170,
+      "type": "file"
+    },
+    {
+      "path": "PROJECT_PDF_GUIDE.md",
+      "accessCount": 1,
+      "lastAccessed": 1778722854338,
+      "type": "file"
+    },
+    {
+      "path": "src/components/common/StickyBottomCTA.astro",
+      "accessCount": 1,
+      "lastAccessed": 1778722894184,
+      "type": "file"
+    },
+    {
+      "path": "src/pages/อุปกรณ์ปรับอากาศ.astro",
+      "accessCount": 1,
+      "lastAccessed": 1778763831615,
+      "type": "file"
+    },
+    {
+      "path": "src/pages/ท่อ-xy-lent.astro",
+      "accessCount": 1,
+      "lastAccessed": 1778763831668,
+      "type": "file"
+    },
+    {
+      "path": "src/pages/รั้วเทวดา.astro",
+      "accessCount": 1,
+      "lastAccessed": 1778763831720,
+      "type": "file"
+    }
+  ],
+  "userDirectives": []
+}
--- a/.omc/sessions/02c17e1c-9216-463e-bf95-4f5f78cefc4f.json
+++ b/.omc/sessions/02c17e1c-9216-463e-bf95-4f5f78cefc4f.json
@@ -0,0 +1,8 @@
+{
+  "session_id": "02c17e1c-9216-463e-bf95-4f5f78cefc4f",
+  "ended_at": "2026-05-11T03:34:19.588Z",
+  "reason": "resume",
+  "agents_spawned": 0,
+  "agents_completed": 0,
+  "modes_used": []
+}
--- a/.omc/sessions/086c93b8-ed5c-4f49-b508-44ed650577bc.json
+++ b/.omc/sessions/086c93b8-ed5c-4f49-b508-44ed650577bc.json
@@ -0,0 +1,8 @@
+{
+  "session_id": "086c93b8-ed5c-4f49-b508-44ed650577bc",
+  "ended_at": "2026-05-12T02:21:51.006Z",
+  "reason": "resume",
+  "agents_spawned": 0,
+  "agents_completed": 0,
+  "modes_used": []
+}
--- a/.omc/sessions/27234eb1-24d7-4a70-84b9-be18df166f36.json
+++ b/.omc/sessions/27234eb1-24d7-4a70-84b9-be18df166f36.json
@@ -0,0 +1,8 @@
+{
+  "session_id": "27234eb1-24d7-4a70-84b9-be18df166f36",
+  "ended_at": "2026-05-14T13:01:59.693Z",
+  "reason": "resume",
+  "agents_spawned": 0,
+  "agents_completed": 0,
+  "modes_used": []
+}
--- a/.omc/sessions/53a89674-cfb8-4c92-938b-4e5ae0bd3f1f.json
+++ b/.omc/sessions/53a89674-cfb8-4c92-938b-4e5ae0bd3f1f.json
@@ -0,0 +1,8 @@
+{
+  "session_id": "53a89674-cfb8-4c92-938b-4e5ae0bd3f1f",
+  "ended_at": "2026-05-17T06:13:48.424Z",
+  "reason": "prompt_input_exit",
+  "agents_spawned": 0,
+  "agents_completed": 0,
+  "modes_used": []
+}
--- a/.omc/sessions/77cb8f65-501a-417d-8d97-926fcba021ef.json
+++ b/.omc/sessions/77cb8f65-501a-417d-8d97-926fcba021ef.json
@@ -0,0 +1,8 @@
+{
+  "session_id": "77cb8f65-501a-417d-8d97-926fcba021ef",
+  "ended_at": "2026-05-12T23:24:48.258Z",
+  "reason": "other",
+  "agents_spawned": 0,
+  "agents_completed": 0,
+  "modes_used": []
+}
--- a/.omc/sessions/815b1c30-de13-4272-8eed-0902f816df2d.json
+++ b/.omc/sessions/815b1c30-de13-4272-8eed-0902f816df2d.json
@@ -0,0 +1,8 @@
+{
+  "session_id": "815b1c30-de13-4272-8eed-0902f816df2d",
+  "ended_at": "2026-05-06T10:48:43.865Z",
+  "reason": "resume",
+  "agents_spawned": 10,
+  "agents_completed": 9,
+  "modes_used": []
+}
--- a/.omc/sessions/881caeef-0afc-463f-9bfd-74c45283e671.json
+++ b/.omc/sessions/881caeef-0afc-463f-9bfd-74c45283e671.json
@@ -0,0 +1,8 @@
+{
+  "session_id": "881caeef-0afc-463f-9bfd-74c45283e671",
+  "ended_at": "2026-05-05T01:30:53.461Z",
+  "reason": "resume",
+  "agents_spawned": 0,
+  "agents_completed": 0,
+  "modes_used": []
+}
--- a/.omc/sessions/c1885857-6101-4fc3-820f-0dff42f3c723.json
+++ b/.omc/sessions/c1885857-6101-4fc3-820f-0dff42f3c723.json
@@ -0,0 +1,8 @@
+{
+  "session_id": "c1885857-6101-4fc3-820f-0dff42f3c723",
+  "ended_at": "2026-05-07T04:33:10.787Z",
+  "reason": "prompt_input_exit",
+  "agents_spawned": 1,
+  "agents_completed": 1,
+  "modes_used": []
+}
--- a/.omc/sessions/e755b3ef-8dbf-470c-8a00-a71497e48536.json
+++ b/.omc/sessions/e755b3ef-8dbf-470c-8a00-a71497e48536.json
@@ -0,0 +1,8 @@
+{
+  "session_id": "e755b3ef-8dbf-470c-8a00-a71497e48536",
+  "ended_at": "2026-05-05T04:07:42.708Z",
+  "reason": "prompt_input_exit",
+  "agents_spawned": 3,
+  "agents_completed": 3,
+  "modes_used": []
+}
--- a/.omc/state/checkpoints/checkpoint-2026-05-05T02-38-54-178Z.json
+++ b/.omc/state/checkpoints/checkpoint-2026-05-05T02-38-54-178Z.json
@@ -0,0 +1,16 @@
+{
+  "created_at": "2026-05-05T02:38:54.176Z",
+  "trigger": "auto",
+  "active_modes": {},
+  "todo_summary": {
+    "pending": 0,
+    "in_progress": 0,
+    "completed": 0
+  },
+  "wisdom_exported": false,
+  "background_jobs": {
+    "active": [],
+    "recent": [],
+    "stats": null
+  }
+}
--- a/.omc/state/checkpoints/checkpoint-2026-05-05T03-48-13-808Z.json
+++ b/.omc/state/checkpoints/checkpoint-2026-05-05T03-48-13-808Z.json
@@ -0,0 +1,16 @@
+{
+  "created_at": "2026-05-05T03:48:13.806Z",
+  "trigger": "auto",
+  "active_modes": {},
+  "todo_summary": {
+    "pending": 0,
+    "in_progress": 0,
+    "completed": 0
+  },
+  "wisdom_exported": false,
+  "background_jobs": {
+    "active": [],
+    "recent": [],
+    "stats": null
+  }
+}
--- a/.omc/state/checkpoints/checkpoint-2026-05-05T04-01-34-649Z.json
+++ b/.omc/state/checkpoints/checkpoint-2026-05-05T04-01-34-649Z.json
@@ -0,0 +1,16 @@
+{
+  "created_at": "2026-05-05T04:01:34.647Z",
+  "trigger": "auto",
+  "active_modes": {},
+  "todo_summary": {
+    "pending": 0,
+    "in_progress": 0,
+    "completed": 0
+  },
+  "wisdom_exported": false,
+  "background_jobs": {
+    "active": [],
+    "recent": [],
+    "stats": null
+  }
+}
--- a/.omc/state/checkpoints/checkpoint-2026-05-06T03-38-55-435Z.json
+++ b/.omc/state/checkpoints/checkpoint-2026-05-06T03-38-55-435Z.json
@@ -0,0 +1,16 @@
+{
+  "created_at": "2026-05-06T03:38:55.431Z",
+  "trigger": "auto",
+  "active_modes": {},
+  "todo_summary": {
+    "pending": 0,
+    "in_progress": 0,
+    "completed": 0
+  },
+  "wisdom_exported": false,
+  "background_jobs": {
+    "active": [],
+    "recent": [],
+    "stats": null
+  }
+}
--- a/.omc/state/checkpoints/checkpoint-2026-05-06T04-07-01-730Z.json
+++ b/.omc/state/checkpoints/checkpoint-2026-05-06T04-07-01-730Z.json
@@ -0,0 +1,16 @@
+{
+  "created_at": "2026-05-06T04:07:01.729Z",
+  "trigger": "auto",
+  "active_modes": {},
+  "todo_summary": {
+    "pending": 0,
+    "in_progress": 0,
+    "completed": 0
+  },
+  "wisdom_exported": false,
+  "background_jobs": {
+    "active": [],
+    "recent": [],
+    "stats": null
+  }
+}
--- a/.omc/state/checkpoints/checkpoint-2026-05-06T04-07-19-716Z.json
+++ b/.omc/state/checkpoints/checkpoint-2026-05-06T04-07-19-716Z.json
@@ -0,0 +1,16 @@
+{
+  "created_at": "2026-05-06T04:07:19.715Z",
+  "trigger": "auto",
+  "active_modes": {},
+  "todo_summary": {
+    "pending": 0,
+    "in_progress": 0,
+    "completed": 0
+  },
+  "wisdom_exported": false,
+  "background_jobs": {
+    "active": [],
+    "recent": [],
+    "stats": null
+  }
+}
--- a/.omc/state/checkpoints/checkpoint-2026-05-06T04-08-04-801Z.json
+++ b/.omc/state/checkpoints/checkpoint-2026-05-06T04-08-04-801Z.json
@@ -0,0 +1,16 @@
+{
+  "created_at": "2026-05-06T04:08:04.800Z",
+  "trigger": "auto",
+  "active_modes": {},
+  "todo_summary": {
+    "pending": 0,
+    "in_progress": 0,
+    "completed": 0
+  },
+  "wisdom_exported": false,
+  "background_jobs": {
+    "active": [],
+    "recent": [],
+    "stats": null
+  }
+}
--- a/.omc/state/checkpoints/checkpoint-2026-05-06T04-12-51-570Z.json
+++ b/.omc/state/checkpoints/checkpoint-2026-05-06T04-12-51-570Z.json
@@ -0,0 +1,16 @@
+{
+  "created_at": "2026-05-06T04:12:51.569Z",
+  "trigger": "auto",
+  "active_modes": {},
+  "todo_summary": {
+    "pending": 0,
+    "in_progress": 0,
+    "completed": 0
+  },
+  "wisdom_exported": false,
+  "background_jobs": {
+    "active": [],
+    "recent": [],
+    "stats": null
+  }
+}
--- a/.omc/state/checkpoints/checkpoint-2026-05-06T04-23-46-943Z.json
+++ b/.omc/state/checkpoints/checkpoint-2026-05-06T04-23-46-943Z.json
@@ -0,0 +1,16 @@
+{
+  "created_at": "2026-05-06T04:23:46.942Z",
+  "trigger": "auto",
+  "active_modes": {},
+  "todo_summary": {
+    "pending": 0,
+    "in_progress": 0,
+    "completed": 0
+  },
+  "wisdom_exported": false,
+  "background_jobs": {
+    "active": [],
+    "recent": [],
+    "stats": null
+  }
+}
--- a/.omc/state/checkpoints/checkpoint-2026-05-06T04-50-17-478Z.json
+++ b/.omc/state/checkpoints/checkpoint-2026-05-06T04-50-17-478Z.json
@@ -0,0 +1,16 @@
+{
+  "created_at": "2026-05-06T04:50:17.477Z",
+  "trigger": "auto",
+  "active_modes": {},
+  "todo_summary": {
+    "pending": 0,
+    "in_progress": 0,
+    "completed": 0
+  },
+  "wisdom_exported": false,
+  "background_jobs": {
+    "active": [],
+    "recent": [],
+    "stats": null
+  }
+}
--- a/.omc/state/checkpoints/checkpoint-2026-05-06T04-50-37-703Z.json
+++ b/.omc/state/checkpoints/checkpoint-2026-05-06T04-50-37-703Z.json
@@ -0,0 +1,16 @@
+{
+  "created_at": "2026-05-06T04:50:37.702Z",
+  "trigger": "auto",
+  "active_modes": {},
+  "todo_summary": {
+    "pending": 0,
+    "in_progress": 0,
+    "completed": 0
+  },
+  "wisdom_exported": false,
+  "background_jobs": {
+    "active": [],
+    "recent": [],
+    "stats": null
+  }
+}
--- a/.omc/state/checkpoints/checkpoint-2026-05-06T04-51-15-895Z.json
+++ b/.omc/state/checkpoints/checkpoint-2026-05-06T04-51-15-895Z.json
@@ -0,0 +1,16 @@
+{
+  "created_at": "2026-05-06T04:51:15.894Z",
+  "trigger": "auto",
+  "active_modes": {},
+  "todo_summary": {
+    "pending": 0,
+    "in_progress": 0,
+    "completed": 0
+  },
+  "wisdom_exported": false,
+  "background_jobs": {
+    "active": [],
+    "recent": [],
+    "stats": null
+  }
+}
--- a/.omc/state/checkpoints/checkpoint-2026-05-06T05-06-20-220Z.json
+++ b/.omc/state/checkpoints/checkpoint-2026-05-06T05-06-20-220Z.json
@@ -0,0 +1,16 @@
+{
+  "created_at": "2026-05-06T05:06:20.219Z",
+  "trigger": "auto",
+  "active_modes": {},
+  "todo_summary": {
+    "pending": 0,
+    "in_progress": 0,
+    "completed": 0
+  },
+  "wisdom_exported": false,
+  "background_jobs": {
+    "active": [],
+    "recent": [],
+    "stats": null
+  }
+}
--- a/.omc/state/checkpoints/checkpoint-2026-05-06T05-10-42-656Z.json
+++ b/.omc/state/checkpoints/checkpoint-2026-05-06T05-10-42-656Z.json
@@ -0,0 +1,16 @@
+{
+  "created_at": "2026-05-06T05:10:42.655Z",
+  "trigger": "auto",
+  "active_modes": {},
+  "todo_summary": {
+    "pending": 0,
+    "in_progress": 0,
+    "completed": 0
+  },
+  "wisdom_exported": false,
+  "background_jobs": {
+    "active": [],
+    "recent": [],
+    "stats": null
+  }
+}
--- a/.omc/state/checkpoints/checkpoint-2026-05-06T05-40-48-597Z.json
+++ b/.omc/state/checkpoints/checkpoint-2026-05-06T05-40-48-597Z.json
@@ -0,0 +1,16 @@
+{
+  "created_at": "2026-05-06T05:40:48.596Z",
+  "trigger": "auto",
+  "active_modes": {},
+  "todo_summary": {
+    "pending": 0,
+    "in_progress": 0,
+    "completed": 0
+  },
+  "wisdom_exported": false,
+  "background_jobs": {
+    "active": [],
+    "recent": [],
+    "stats": null
+  }
+}
--- a/.omc/state/checkpoints/checkpoint-2026-05-06T11-25-39-858Z.json
+++ b/.omc/state/checkpoints/checkpoint-2026-05-06T11-25-39-858Z.json
@@ -0,0 +1,16 @@
+{
+  "created_at": "2026-05-06T11:25:39.857Z",
+  "trigger": "auto",
+  "active_modes": {},
+  "todo_summary": {
+    "pending": 0,
+    "in_progress": 0,
+    "completed": 0
+  },
+  "wisdom_exported": false,
+  "background_jobs": {
+    "active": [],
+    "recent": [],
+    "stats": null
+  }
+}
--- a/.omc/state/checkpoints/checkpoint-2026-05-07T02-48-25-591Z.json
+++ b/.omc/state/checkpoints/checkpoint-2026-05-07T02-48-25-591Z.json
@@ -0,0 +1,16 @@
+{
+  "created_at": "2026-05-07T02:48:25.590Z",
+  "trigger": "auto",
+  "active_modes": {},
+  "todo_summary": {
+    "pending": 0,
+    "in_progress": 0,
+    "completed": 0
+  },
+  "wisdom_exported": false,
+  "background_jobs": {
+    "active": [],
+    "recent": [],
+    "stats": null
+  }
+}
--- a/.omc/state/checkpoints/checkpoint-2026-05-07T02-54-46-706Z.json
+++ b/.omc/state/checkpoints/checkpoint-2026-05-07T02-54-46-706Z.json
@@ -0,0 +1,16 @@
+{
+  "created_at": "2026-05-07T02:54:46.705Z",
+  "trigger": "auto",
+  "active_modes": {},
+  "todo_summary": {
+    "pending": 0,
+    "in_progress": 0,
+    "completed": 0
+  },
+  "wisdom_exported": false,
+  "background_jobs": {
+    "active": [],
+    "recent": [],
+    "stats": null
+  }
+}
--- a/.omc/state/mission-state.json
+++ b/.omc/state/mission-state.json
@@ -0,0 +1,4 @@
+{
+  "updatedAt": "2026-05-07T04:33:10.977Z",
+  "missions": []
+}
--- a/CLAUDE.md
+++ b/CLAUDE.md
@@ -0,0 +1,58 @@
+# CLAUDE.md
+
+This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
+
+## Project Overview
+
+Astro-based Thai-language static website for "ดีล พลัส เทค" (Deal Plus Tech), a water systems company. Site is deployed at https://dealplustech.com.
+
+## Commands
+
+```bash
+npm run dev      # Start dev server at http://localhost:3100
+npm run build    # Build static site to dist/
+npm run preview  # Preview built site
+npm run astro    # Run Astro CLI directly
+```
+
+## Architecture
+
+- **Framework**: Astro 6 with static output (`output: 'static'`)
+- **Styling**: Tailwind CSS v4 — custom theme is defined directly in `src/styles/global.css` (no tailwind.config.js)
+- **Fonts**: Kanit + Noto Sans Thai (loaded from Google Fonts)
+- **Path aliases**: `@` → `src/`, `@components` → `src/components`, `@layouts` → `src/layouts`, `@styles` → `src/styles`
+
+### Directory Structure
+
+```
+src/
+├── layouts/
+│   ├── BaseLayout.astro   # Main layout with header/footer + navigation dropdown
+│   └── Layout.astro       # HTML shell with meta tags
+├── pages/                 # All routes (Thai URLs for products)
+├── components/common/    # Header, Footer, StickyBottomCTA
+└── styles/global.css      # Tailwind imports + custom theme + animations
+```
+
+### Key Patterns
+
+**Company info and navigation** are defined in `src/layouts/BaseLayout.astro` (not a separate config). To add/modify product categories or company details, edit this file directly.
+
+**Product pricing PDFs**: Pages with a `#pricelist` section automatically show a "ราคาสินค้า" button in the hero. The auto-detection runs in a `<script>` tag at the bottom of BaseLayout.astro. See `PROJECT_PDF_GUIDE.md` for the full pattern.
+
+**StickyBottomCTA** is mobile-only (`hidden md:block`) — appears fixed at the bottom on mobile for phone/LINE contact.
+
+**Hero floating cards**: The homepage hero uses layered floating card animations (`animate-float`, `animate-float-delayed-1/2/3`) with z-index layering to create depth.
+
+### Color Theme
+
+Custom Tailwind colors defined in `src/styles/global.css`:
+- Primary: green tones (`primary-600` = #2d6a4f)
+- Accent: orange tones (`accent-500` = #e35c1c)
+
+### Adding Product Pages
+
+1. Create `src/pages/<product-name>.astro`
+2. Use `BaseLayout.astro` as wrapper
+3. Add hero section with `data-price-button class="hidden"` attribute on the price button
+4. If the product has a PDF price list, add a `<section id="pricelist">` and copy PDF to `public/documents/`
--- a/PROJECT_PDF_GUIDE.md
+++ b/PROJECT_PDF_GUIDE.md
@@ -0,0 +1,131 @@
+# PDF Section Pattern for Product Pages
+
+This guide explains how to add price PDF sections to product pages. The "ราคาสินค้า" (Price) button automatically appears based on whether a `#pricelist` section exists on the page.
+
+## Auto-Detection Behavior
+
+The hero section includes a "ราคาสินค้า" button that is **hidden by default** (`hidden` class). JavaScript in `BaseLayout.astro` automatically:
+
+- **Shows** the button if `#pricelist` section exists on the page
+- **Hides** the button if `#pricelist` section does not exist
+
+This means you only need to add the PDF section — the button visibility is handled automatically.
+
+---
+
+## Adding PDF to Existing Product
+
+### Step 1: Add PDF file
+
+Copy the PDF file to `public/documents/` directory.
+
+### Step 2: Add PDF section with `id="pricelist"`
+
+Add this section to the product page (typically at the bottom, before the contact CTA):
+
+```astro
+<section id="pricelist" class="py-16 px-4 bg-gradient-to-br from-primary-700 to-primary-600">
+  <div class="max-w-4xl mx-auto text-center">
+    <h2 class="text-2xl font-bold text-white mb-6">ดาวน์โหลดราคาสินค้า</h2>
+    <a href="/documents/YOUR_FILE.pdf" target="_blank" class="inline-flex items-center gap-4 p-6 bg-white rounded-xl hover:bg-neutral-100 transition-colors group">
+      <svg class="w-12 h-12 text-red-600 flex-shrink-0" fill="currentColor" viewBox="0 0 24 24">
+        <path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6zm-1 9V3.5L18.5 9H13zM8 13h8v2H8v-2zm0 4h8v2H8v-2zm0-8h2v2H8V9z"/>
+      </svg>
+      <div class="text-left">
+        <div class="font-semibold text-neutral-900 group-hover:text-primary-600 transition-colors">Product Name Price List</div>
+        <div class="text-sm text-neutral-500">PDF - ดาวน์โหลดราคา</div>
+      </div>
+    </a>
+  </div>
+</section>
+```
+
+### Step 3: Ensure button has correct attributes
+
+The hero button must have:
+- `href="#pricelist"` — scrolls to the PDF section
+- `data-price-button` — tells JavaScript this is the price button
+- `class="hidden"` — starts hidden, JS will remove this if section exists
+
+```astro
+<a href="#pricelist" data-price-button class="hidden bg-white text-primary-700 hover:bg-primary-50 py-3 px-6 rounded-xl font-semibold flex items-center gap-2">
+  <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/>
+  </svg>
+  ราคาสินค้า
+</a>
+```
+
+---
+
+## Products with PDF Sections (4 pages)
+
+| Product | Route | PDF File |
+|---------|------|----------|
+| เทอร์โมเบรค Thermobreak | `/เทอร์โมเบรค-thermobreak` | `2026-New Update Thermobreak Price List.pdf` |
+| เครื่องเชื่อม HDPE | `/เครื่องเชื่อม-hdpe` | `Price List HDPE.pdf` |
+| ฉนวนหุ้มท่อ | `/ฉนวนหุ้มท่อ` | `16 Price List Armaflex 2567.pdf` |
+| เม็ดกรู๊ฟ คับปลิ้ง | `/เม็กกรู๊ฟ-คับปลิ้ง` | `Price List MECH_V13-2021 [260864](1).pdf` |
+
+---
+
+## Products WITHOUT PDF Sections
+
+These pages do NOT have a `#pricelist` section, so the "ราคาสินค้า" button will remain hidden:
+
+- `/water-pump`
+- `/water-treatment`
+- `/วาล์ว-valve`
+- `/durgo-avvs`
+- `/อุปกรณ์ปรับอากาศ`
+- `/grilles`
+- `/realflex`
+- `/อุปกรณ์ดับเพลิง`
+- `/รั้วเทวดา`
+- `/ระบบรั้วไวน์แมน`
+- And all other product pages not listed above
+
+---
+
+## JavaScript Implementation
+
+The auto-detection script is in `src/layouts/BaseLayout.astro`:
+
+```typescript
+document.addEventListener('DOMContentLoaded', () => {
+  const priceButton = document.querySelector('[data-price-button]');
+  if (!priceButton) return;
+  const hasPricelist = document.getElementById('pricelist') !== null;
+  if (hasPricelist) {
+    priceButton.classList.remove('hidden');
+    priceButton.removeAttribute('disabled');
+  } else {
+    priceButton.classList.add('hidden');
+  }
+});
+```
+
+---
+
+## Adding New Product with PDF
+
+1. Create the product page in `src/pages/`
+2. Add hero section with the "ราคาสินค้า" button using `data-price-button class="hidden"`
+3. Add the PDF section with `id="pricelist"` at the appropriate location
+4. Copy PDF to `public/documents/`
+5. The button will automatically appear when the page loads
+
+---
+
+## Testing
+
+After adding a PDF section, verify:
+
+1. Navigate to the product page
+2. The "ราคาสินค้า" button should be visible in the hero section
+3. Click the button — it should scroll to the `#pricelist` section
+4. The PDF link should open correctly
+
+For pages without PDF:
+1. Navigate to a product page without a `#pricelist` section
+2. The "ราคาสินค้า" button should not be visible
--- a/astro.config.mjs
+++ b/astro.config.mjs
@@ -0,0 +1,29 @@
+import { defineConfig } from 'astro/config'
+import tailwindcss from '@tailwindcss/vite'
+import { fileURLToPath } from 'url'
+import path from 'path'
+
+const __dirname = path.dirname(fileURLToPath(import.meta.url))
+
+export default defineConfig({
+  site: 'https://dealplustech.com',
+  vite: {
+    plugins: [tailwindcss()],
+    resolve: {
+      alias: {
+        '@': path.resolve(__dirname, './src'),
+        '@components': path.resolve(__dirname, './src/components'),
+        '@layouts': path.resolve(__dirname, './src/layouts'),
+        '@styles': path.resolve(__dirname, './src/styles'),
+      },
+    },
+  },
+  output: 'static',
+  build: {
+    assets: '_assets',
+  },
+  server: {
+    host: '0.0.0.0',
+    port: 3100,
+  },
+})
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@@ -0,0 +1,24 @@
+{
+  "name": "dealplustech-emdash",
+  "type": "module",
+  "version": "1.0.0",
+  "description": "Deal Plus Tech - ระบบน้ำคุณภาพสูง ราคาโรงงาน",
+  "scripts": {
+    "dev": "astro dev",
+    "build": "astro build",
+    "preview": "astro preview",
+    "astro": "astro"
+  },
+  "dependencies": {
+    "@astrojs/check": "^0.9.4",
+    "@tailwindcss/typography": "^0.5.15",
+    "@tailwindcss/vite": "^4.0.0",
+    "astro": "^6.1.7",
+    "marked": "^18.0.3",
+    "tailwindcss": "^4.0.0",
+    "typescript": "^5.6.3"
+  },
+  "engines": {
+    "node": ">=20.0.0"
+  }
+}
--- a/src/components/common/Footer.astro
+++ b/src/components/common/Footer.astro
@@ -0,0 +1,118 @@
+---
+const companyInfo = {
+  name: "ดีล พลัส เทค จำกัด",
+  phone: "090-555-1415",
+  email: "dealplustech@gmail.com",
+  line: "@JPPSELECTION",
+  address: "9/70 ซอยนครลุง 17 แขวงบางไผ่ เขตบางแค กรุงเทพมหานคร 10160",
+  hours: "จันทร์-ศุกร์ 08:00-18:00 เสาร์ 08:00-17:00"
+};
+
+const productLinks = [
+  { title: "ท่อพีพีอาร์", href: "/ท่อ-ppr-thai-ppr" },
+  { title: "ท่อ HDPE", href: "/ท่อ-hdpe" },
+  { title: "ท่อ UPVC", href: "/ท่อ-upvc" },
+  { title: "เครื่องเชื่อมท่อ", href: "/เครื่องเชื่อม-hdpe" },
+  { title: "วาล์ว", href: "/วาล์ว-valve" },
+  { title: "ปั๊มน้ำ", href: "/water-pump" },
+];
+---
+
+<footer class="bg-primary-700 text-white">
+  <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-12 lg:py-16">
+    <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8 lg:gap-12">
+      <!-- Company Info -->
+      <div class="lg:col-span-1">
+        <img src="/images/logo.png" alt="ดีล พลัส เทค" class="h-10 w-auto mb-4" />
+        <div class="space-y-3 text-sm text-primary-100">
+          <p class="flex items-start gap-2">
+            <svg class="w-5 h-5 shrink-0 mt-0.5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17.657 16.657L13.414 20.9a1.998 1.998 0 01-2.827 0l-4.244-4.243a8 8 0 1111.314 0z" />
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 11a3 3 0 11-6 0 3 3 0 016 0z" />
+            </svg>
+            <span>{companyInfo.address}</span>
+          </p>
+          <p class="flex items-center gap-2">
+            <svg class="w-5 h-5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z" />
+            </svg>
+            <a href={`tel:${companyInfo.phone}`} class="hover:text-accent-400">{companyInfo.phone}</a>
+          </p>
+          <p class="flex items-center gap-2">
+            <svg class="w-5 h-5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z" />
+            </svg>
+            <a href={`mailto:${companyInfo.email}`} class="hover:text-accent-400">{companyInfo.email}</a>
+          </p>
+          <p class="flex items-center gap-2">
+            <svg class="w-5 h-5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 12h.01M12 12h.01M16 12h.01M21 12c0 4.418-4.03 8-9 8a9.863 9.863 0 01-4.255-.949L3 20l1.395-3.72C3.512 15.042 3 13.574 3 12c0-4.418 4.03-8 9-8s9 3.582 9 8z" />
+            </svg>
+            <span>LINE: {companyInfo.line}</span>
+          </p>
+          <p class="text-primary-200 text-xs">{companyInfo.hours}</p>
+        </div>
+      </div>
+
+      <!-- Quick Links -->
+      <div>
+        <h3 class="font-semibold text-lg mb-4">ลิงก์ด่วน</h3>
+        <ul class="space-y-2 text-sm text-primary-100">
+          <li><a href="/" class="hover:text-accent-400 transition-colors">หน้าแรก</a></li>
+          <li><a href="/about-us" class="hover:text-accent-400 transition-colors">เกี่ยวกับเรา</a></li>
+          <li><a href="/all-products" class="hover:text-accent-400 transition-colors">สินค้าทั้งหมด</a></li>
+          <li><a href="/portfolio" class="hover:text-accent-400 transition-colors">ผลงาน</a></li>
+          <li><a href="/contact-us" class="hover:text-accent-400 transition-colors">ติดต่อเรา</a></li>
+        </ul>
+      </div>
+
+      <!-- Products -->
+      <div>
+        <h3 class="font-semibold text-lg mb-4">สินค้ายอดนิยม</h3>
+        <ul class="space-y-2 text-sm text-primary-100">
+          {productLinks.map(link => (
+            <li><a href={link.href} class="hover:text-accent-400 transition-colors">{link.title}</a></li>
+          ))}
+        </ul>
+      </div>
+
+      <!-- Contact CTA -->
+      <div>
+        <h3 class="font-semibold text-lg mb-4">ติดต่อเรา</h3>
+        <div class="space-y-3">
+          <a
+            href={`tel:${companyInfo.phone}`}
+            class="flex items-center justify-center gap-2 w-full bg-primary-600 hover:bg-primary-500 text-white py-3 px-4 rounded-lg font-medium transition-colors"
+          >
+            <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z" />
+            </svg>
+            โทรเลย
+          </a>
+          <a
+            href="https://line.me/ti/p/~JPPSELECTION"
+            target="_blank"
+            rel="noopener"
+            class="flex items-center justify-center gap-2 w-full bg-accent-500 hover:bg-accent-600 text-white py-3 px-4 rounded-lg font-medium transition-colors"
+          >
+            <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24">
+              <path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/>
+            </svg>
+            แอดไลน์
+          </a>
+        </div>
+      </div>
+    </div>
+
+    <!-- Bottom bar -->
+    <div class="mt-12 pt-8 border-t border-primary-600">
+      <div class="flex flex-col sm:flex-row justify-between items-center gap-4 text-sm text-primary-200">
+        <p>&copy; {new Date().getFullYear()} {companyInfo.name}. สงวนลิขสิทธิ์.</p>
+        <div class="flex gap-6">
+          <a href="/privacy-policy" class="hover:text-white transition-colors">นโยบายความเป็นส่วนตัว</a>
+          <a href="/terms-and-conditions" class="hover:text-white transition-colors">ข้อกำหนดการใช้งาน</a>
+        </div>
+      </div>
+    </div>
+  </div>
+</footer>
--- a/src/components/common/Header.astro
+++ b/src/components/common/Header.astro
@@ -0,0 +1,132 @@
+---
+const navItems = [
+  { label: "หน้าแรก", href: "/" },
+  { label: "เกี่ยวกับเรา", href: "/about-us" },
+];
+
+const productCategories = [
+  {
+    title: "ท่อพีพีอาร์",
+    items: [
+      { label: "ไทยพีพีอาร์", href: "/ท่อ-ppr-thai-ppr" },
+      { label: "ท่อ PPR ตราช้าง", href: "/ท่อ-ppr-scg" },
+      { label: "ท่อ PP-R Poloplast", href: "/pp-r-poloplast" },
+      { label: "ท่อ HDPE", href: "/ท่อ-hdpe" },
+    ]
+  },
+  {
+    title: "ท่อ UPVC/Specialty",
+    items: [
+      { label: "ท่อ UPVC", href: "/ท่อ-upvc" },
+      { label: "ท่อ Syler", href: "/ท่อ-syler" },
+      { label: "ท่อ PVC และข้อต่อ", href: "/ท่อ-และข้อต่อ-pvc" },
+      { label: "ท่อ XYLENT", href: "/ท่อ-xy-lent" },
+    ]
+  },
+  {
+    title: "เครื่องเชื่อมท่อ",
+    items: [
+      { label: "เครื่องเชื่อม HDPE", href: "/เครื่องเชื่อม-hdpe" },
+      { label: "เครื่องเชื่อม PPR", href: "/เครื่องเชื่อม-ppr" },
+      { label: "Pipe Coupling", href: "/pipe-coupling" },
+      { label: "เม็กกรู๊ฟ คับปลิ้ง", href: "/เม็กกรู๊ฟ-คับปลิ้ง" },
+    ]
+  },
+  {
+    title: "วาล์ว",
+    items: [
+      { label: "วาล์ว Valve", href: "/วาล์ว-valve" },
+      { label: "DURGO วาล์วเติมอากาศ", href: "/durgo-avvs" },
+    ]
+  },
+  {
+    title: "ปั๊มและระบบน้ำ",
+    items: [
+      { label: "ปั๊มน้ำ Water Pump", href: "/water-pump" },
+      { label: "ระบบกรองน้ำ", href: "/water-treatment" },
+    ]
+  },
+  {
+    title: "อุปกรณ์ปรับอากาศ",
+    items: [
+      { label: "อุปกรณ์ปรับอากาศ", href: "/อุปกรณ์ปรับอากาศ" },
+      { label: "กริลแอร์", href: "/grilles" },
+    ]
+  },
+  {
+    title: "ฉนวนและรั้ว",
+    items: [
+      { label: "ฉนวนหุ้มท่อ", href: "/ฉนวนหุ้มท่อ" },
+      { label: "เทอร์โมเบรค Thermobreak", href: "/เทอร์โมเบรค-thermobreak" },
+      { label: "Realflex", href: "/realflex" },
+      { label: "อุปกรณ์ดับเพลิง", href: "/อุปกรณ์ดับเพลิง" },
+      { label: "รั้วเทวดา", href: "/รั้วเทวดา" },
+      { label: "ระบบรั้วไวน์แมน", href: "/ระบบรั้วไวน์แมน" },
+    ]
+  },
+];
+
+const currentPath = Astro.url.pathname;
+---
+
+<header class="sticky top-0 z-50 bg-white/95 backdrop-blur-sm border-b border-neutral-200">
+  <nav class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+    <div class="flex items-center justify-between h-16 lg:h-20">
+      <!-- Logo -->
+      <a href="/" class="flex items-center gap-2">
+        <div class="w-10 h-10 bg-primary-500 rounded-lg flex items-center justify-center">
+          <span class="text-white font-bold text-lg">ดีล</span>
+        </div>
+        <span class="font-semibold text-xl text-primary-700 hidden sm:block">ดีล พลัส เทค</span>
+      </a>
+
+      <!-- Desktop Nav -->
+      <div class="hidden lg:flex items-center gap-8">
+        <a href="/" class={`text-sm font-medium transition-colors ${currentPath === '/' ? 'text-primary-600' : 'text-neutral-600 hover:text-primary-600'}`}>
+          หน้าแรก
+        </a>
+        <a href="/about-us" class={`text-sm font-medium transition-colors ${currentPath === '/about-us' ? 'text-primary-600' : 'text-neutral-600 hover:text-primary-600'}`}>
+          เกี่ยวกับเรา
+        </a>
+        <a href="/all-products" class={`text-sm font-medium transition-colors ${currentPath === '/all-products' ? 'text-primary-600' : 'text-neutral-600 hover:text-primary-600'}`}>
+          สินค้าทั้งหมด
+        </a>
+        <a href="/contact-us" class={`text-sm font-medium transition-colors ${currentPath === '/contact-us' ? 'text-primary-600' : 'text-neutral-600 hover:text-primary-600'}`}>
+          ติดต่อเรา
+        </a>
+      </div>
+
+      <!-- Mobile menu button -->
+      <button
+        type="button"
+        class="lg:hidden p-2 rounded-lg text-neutral-600 hover:bg-neutral-100"
+        aria-label="เปิดเมนู"
+        data-mobile-menu-toggle
+      >
+        <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+        </svg>
+      </button>
+    </div>
+
+    <!-- Mobile menu -->
+    <div class="lg:hidden hidden" data-mobile-menu>
+      <div class="py-4 space-y-2 border-t border-neutral-200">
+        <a href="/" class="block px-4 py-2 text-neutral-700 hover:bg-neutral-100 rounded-lg">หน้าแรก</a>
+        <a href="/about-us" class="block px-4 py-2 text-neutral-700 hover:bg-neutral-100 rounded-lg">เกี่ยวกับเรา</a>
+        <a href="/all-products" class="block px-4 py-2 text-neutral-700 hover:bg-neutral-100 rounded-lg">สินค้าทั้งหมด</a>
+        <a href="/portfolio" class="block px-4 py-2 text-neutral-700 hover:bg-neutral-100 rounded-lg">ผลงาน</a>
+        <a href="/contact-us" class="block px-4 py-2 text-neutral-700 hover:bg-neutral-100 rounded-lg">ติดต่อเรา</a>
+      </div>
+    </div>
+  </nav>
+</header>
+
+<script>
+  const menuToggle = document.querySelector('[data-mobile-menu-toggle]');
+  const mobileMenu = document.querySelector('[data-mobile-menu]');
+
+  menuToggle?.addEventListener('click', () => {
+    mobileMenu?.classList.toggle('hidden');
+  });
+</script>
--- a/src/components/common/StickyBottomCTA.astro
+++ b/src/components/common/StickyBottomCTA.astro
@@ -0,0 +1,43 @@
+---
+interface Props {
+  phone?: string;
+  lineUrl?: string;
+}
+
+const { phone = "0905551415", lineUrl = "https://line.me/ti/p/~JPPSELECTION" } = Astro.props;
+
+// Format phone for display and tel link
+const phoneFormatted = phone.replace(/-/g, "");
+---
+
+<!-- Sticky Bottom CTA - Mobile Only -->
+<div class="fixed bottom-0 left-0 right-0 bg-white border-t border-gray-200 p-4 z-50 md:hidden safe-area-pb">
+  <div class="flex gap-3">
+    <a
+      href={`tel:${phoneFormatted}`}
+      class="flex-1 flex items-center justify-center gap-2 bg-emerald-600 text-white py-3.5 rounded-lg font-semibold text-base shadow-lg active:bg-emerald-700 transition-colors"
+    >
+      <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z" />
+      </svg>
+      โทรเลย
+    </a>
+    <a
+      href={lineUrl}
+      target="_blank"
+      rel="noopener noreferrer"
+      class="flex-1 flex items-center justify-center gap-2 bg-[#06DC02] text-white py-3.5 rounded-lg font-semibold text-base shadow-lg active:opacity-90 transition-opacity"
+    >
+      <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24">
+        <path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314z"/>
+      </svg>
+      แชทเลย
+    </a>
+  </div>
+</div>
+
+<style>
+  .safe-area-pb {
+    padding-bottom: env(safe-area-inset-bottom, 0.5rem);
+  }
+</style>
--- a/src/env.d.ts
+++ b/src/env.d.ts
@@ -0,0 +1,2 @@
+/// <reference path="../.astro/types.d.ts" />
+/// <reference types="astro" />
--- a/src/layouts/BaseLayout.astro
+++ b/src/layouts/BaseLayout.astro
@@ -0,0 +1,269 @@
+---
+import '@/styles/global.css';
+import Layout from './Layout.astro';
+
+const companyInfo = {
+  name: "ดีล พลัส เทค จำกัด",
+  phone: "090-555-1415",
+  email: "dealplustech@gmail.com",
+  line: "@JPPSELECTION",
+  address: "9/70 ซอยนครลุง 17 แขวงบางไผ่ เขตบางแค กรุงเทพมหานคร 10160",
+  hours: "จันทร์-ศุกร์ 08:00-18:00 เสาร์ 08:00-17:00"
+};
+
+const categories = [
+  {
+    name: 'ท่อพีพีอาร์',
+    slug: '/ท่อ-ppr-thai-ppr',
+    subcategories: [
+      { name: 'ไทยพีพีอาร์', slug: '/ท่อ-ppr-thai-ppr' },
+      { name: 'ท่อ PPR ตราช้าง', slug: '/ท่อ-ppr-scg' },
+      { name: 'ท่อ HDPE', slug: '/ท่อ-hdpe' },
+      { name: 'ท่อ UPVC', slug: '/ท่อ-upvc' },
+      { name: 'ท่อ Syler', slug: '/ท่อ-syler' },
+      { name: 'ท่อ XYLENT', slug: '/ท่อ-xy-lent' },
+    ]
+  },
+  {
+    name: 'เครื่องเชื่อมท่อ',
+    slug: '/เครื่องเชื่อม-hdpe',
+    subcategories: [
+      { name: 'เครื่องเชื่อม HDPE', slug: '/เครื่องเชื่อม-hdpe' },
+      { name: 'เครื่องเชื่อม PPR', slug: '/เครื่องเชื่อม-ppr' },
+      { name: 'Pipe Coupling', slug: '/pipe-coupling' },
+      { name: 'เม็ดกรู๊ฟ คับปลิ้ง', slug: '/เม็กกรู๊ฟ-คับปลิ้ง' },
+    ]
+  },
+  {
+    name: 'ระบบน้ำ',
+    slug: '/water-pump',
+    subcategories: [
+      { name: 'วาล์ว', slug: '/วาล์ว-valve' },
+      { name: 'ปั๊มน้ำ', slug: '/water-pump' },
+      { name: 'ระบบกรองน้ำ', slug: '/water-treatment' },
+    ]
+  },
+  {
+    name: 'อุปกรณ์ปรับอากาศ',
+    slug: '/อุปกรณ์ปรับอากาศ',
+    subcategories: [
+      { name: 'หัวจ่ายแอร์', slug: '/อุปกรณ์ปรับอากาศ' },
+      { name: 'กริลแอร์', slug: '/grilles' },
+      { name: 'DURGO วาล์วเติมอากาศ', slug: '/durgo-avvs' },
+    ]
+  },
+  {
+    name: 'อุปกรณ์ดับเพลิง',
+    slug: '/อุปกรณ์ดับเพลิง',
+    subcategories: [
+      { name: 'อุปกรณ์ดับเพลิง', slug: '/อุปกรณ์ดับเพลิง' },
+      { name: 'Realflex', slug: '/realflex' },
+    ]
+  },
+  {
+    name: 'ฉนวนหุ้มท่อ',
+    slug: '/ฉนวนหุ้มท่อ',
+    subcategories: [
+      { name: 'ฉนวนหุ้มท่อ', slug: '/ฉนวนหุ้มท่อ' },
+      { name: 'เทอร์โมเบรค', slug: '/เทอร์โมเบรค-thermobreak' },
+    ]
+  },
+  {
+    name: 'ระบบรั้ว',
+    slug: '/รั้วเทวดา',
+    subcategories: [
+      { name: 'รั้วเทวดา', slug: '/รั้วเทวดา' },
+      { name: 'ระบบรั้วไวน์แมน', slug: '/ระบบรั้วไวน์แมน' },
+    ]
+  },
+];
+
+const productLinks = [
+  { title: "ท่อพีพีอาร์", href: "/ท่อ-ppr-thai-ppr" },
+  { title: "ท่อ HDPE", href: "/ท่อ-hdpe" },
+  { title: "ท่อ UPVC", href: "/ท่อ-upvc" },
+  { title: "เครื่องเชื่อมท่อ", href: "/เครื่องเชื่อม-hdpe" },
+  { title: "วาล์ว", href: "/วาล์ว-valve" },
+  { title: "ปั๊มน้ำ", href: "/water-pump" },
+];
+---
+
+<Layout title="ดีล พลัส เทค">
+  <header class="bg-white shadow-sm sticky top-0 z-50">
+    <nav class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+      <div class="flex items-center justify-between h-16 lg:h-20">
+        <a href="/" class="flex items-center">
+          <img src="/images/logo.png" alt="ดีล พลัส เทค" class="h-10 lg:h-14 w-auto" />
+        </a>
+        <div class="hidden lg:flex items-center gap-6">
+          <a href="/" class="text-neutral-600 hover:text-primary-600 font-medium">หน้าแรก</a>
+          <a href="/about-us" class="text-neutral-600 hover:text-primary-600 font-medium">เกี่ยวกับเรา</a>
+
+          <div class="relative group">
+            <button class="flex items-center gap-1 text-neutral-600 hover:text-primary-600 font-medium">
+              <span>สินค้า</span>
+              <svg class="w-4 h-4 transition-transform duration-200 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 top-full left-1/2 -translate-x-1/2 mt-0 w-[600px] max-w-[95vw] bg-white rounded-b-2xl shadow-xl border border-neutral-200 opacity-0 invisible group-hover:opacity-100 group-hover:visible transition-all duration-200 transform group-hover:translate-y-0 translate-y-2 z-50">
+              <div class="grid grid-cols-4 gap-4 p-6">
+                {categories.map(cat => (
+                  <div class="space-y-2">
+                    <span class="block text-sm font-bold text-primary-700 cursor-default">
+                      {cat.name}
+                    </span>
+                    <ul class="space-y-1">
+                      {cat.subcategories.map(sub => (
+                        <li>
+                          <a href={sub.slug} class="block text-sm text-neutral-600 hover:text-primary-600 transition-colors">
+                            {sub.name}
+                          </a>
+                        </li>
+                      ))}
+                    </ul>
+                  </div>
+                ))}
+              </div>
+              <div class="border-t border-neutral-100 px-6 py-4 bg-neutral-50 rounded-b-2xl">
+                <a href="/all-products" class="text-sm font-semibold text-primary-600 hover:text-primary-700 transition-colors flex items-center gap-1">
+                  ดูสินค้าทั้งหมด
+                  <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7" />
+                  </svg>
+                </a>
+              </div>
+            </div>
+          </div>
+
+          <a href="/portfolio" class="text-neutral-600 hover:text-primary-600 font-medium">ผลงาน</a>
+          <a href="/contact-us" class="bg-primary-600 hover:bg-primary-700 text-white py-2 px-4 rounded-lg font-medium">ติดต่อเรา</a>
+        </div>
+      </div>
+    </nav>
+  </header>
+
+  <slot />
+
+  <footer class="text-neutral-800">
+    <div class="bg-white">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-12 lg:py-16">
+        <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8 lg:gap-12">
+          <!-- Company Info -->
+          <div class="lg:col-span-1">
+            <img src="/images/logo.png" alt="ดีล พลัส เทค" class="h-10 w-auto mb-4" />
+            <div class="space-y-3 text-sm text-neutral-600">
+              <p class="flex items-start gap-2">
+                <svg class="w-5 h-5 shrink-0 mt-0.5 text-primary-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17.657 16.657L13.414 20.9a1.998 1.998 0 01-2.827 0l-4.244-4.243a8 8 0 1111.314 0z" />
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 11a3 3 0 11-6 0 3 3 0 016 0z" />
+                </svg>
+                <span>{companyInfo.address}</span>
+              </p>
+              <p class="flex items-center gap-2">
+                <svg class="w-5 h-5 shrink-0 text-primary-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z" />
+                </svg>
+                <a href={`tel:${companyInfo.phone}`} class="hover:text-primary-600">{companyInfo.phone}</a>
+              </p>
+              <p class="flex items-center gap-2">
+                <svg class="w-5 h-5 shrink-0 text-primary-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z" />
+                </svg>
+                <a href={`mailto:${companyInfo.email}`} class="hover:text-primary-600">{companyInfo.email}</a>
+              </p>
+              <p class="flex items-center gap-2">
+                <svg class="w-5 h-5 shrink-0 text-primary-600" fill="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+                  <path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.63.63-.63h2.386c.346 0 .627.285.627.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.63.63-.63.345 0 .63.285.63.63v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.63.63-.63.346 0 .628.285.628.63v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.63.63-.63.348 0 .63.285.63.63v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/>
+                </svg>
+                <span>LINE: {companyInfo.line}</span>
+              </p>
+              <p class="text-neutral-400 text-xs">{companyInfo.hours}</p>
+            </div>
+          </div>
+
+          <!-- Quick Links -->
+          <div>
+            <h3 class="font-semibold text-lg mb-4 text-primary-700">ลิงก์ด่วน</h3>
+            <ul class="space-y-2 text-sm text-neutral-600">
+              <li><a href="/" class="hover:text-primary-600 transition-colors">หน้าแรก</a></li>
+              <li><a href="/about-us" class="hover:text-primary-600 transition-colors">เกี่ยวกับเรา</a></li>
+              <li><a href="/all-products" class="hover:text-primary-600 transition-colors">สินค้าทั้งหมด</a></li>
+              <li><a href="/portfolio" class="hover:text-primary-600 transition-colors">ผลงาน</a></li>
+              <li><a href="/contact-us" class="hover:text-primary-600 transition-colors">ติดต่อเรา</a></li>
+            </ul>
+          </div>
+
+          <!-- Products -->
+          <div>
+            <h3 class="font-semibold text-lg mb-4 text-primary-700">สินค้ายอดนิยม</h3>
+            <ul class="space-y-2 text-sm text-neutral-600">
+              {productLinks.map(link => (
+                <li><a href={link.href} class="hover:text-primary-600 transition-colors">{link.title}</a></li>
+              ))}
+            </ul>
+          </div>
+
+          <!-- Contact CTA -->
+          <div>
+            <h3 class="font-semibold text-lg mb-4 text-primary-700">ติดต่อเรา</h3>
+            <div class="space-y-3">
+              <a
+                href={`tel:${companyInfo.phone}`}
+                class="flex items-center justify-center gap-2 w-full bg-primary-600 hover:bg-primary-700 text-white py-3 px-4 rounded-lg font-medium transition-colors"
+              >
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z" />
+                </svg>
+                โทรเลย
+              </a>
+              <div class="flex flex-col items-center gap-2">
+                <img
+                  src="/images/line-qr.svg"
+                  alt="LINE QR Code"
+                  class="w-28 h-28 rounded-lg bg-white p-2 shadow-sm"
+                />
+                <a
+                  href="https://line.me/ti/p/~JPPSELECTION"
+                  target="_blank"
+                  rel="noopener"
+                  class="flex items-center justify-center gap-2 w-full bg-accent-500 hover:bg-accent-600 text-white py-3 px-4 rounded-lg font-medium transition-colors"
+                >
+                  <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+                    <path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.63.63-.63h2.386c.346 0 .627.285.627.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.63.63-.63.345 0 .63.285.63.63v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.63.63-.63.346 0 .628.285.628.63v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.63.63-.63.348 0 .63.285.63.63v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/>
+                  </svg>
+                  แอดไลน์
+                </a>
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <!-- Bottom bar -->
+        <div class="mt-12 pt-8 border-t border-neutral-200">
+          <div class="flex flex-col sm:flex-row justify-between items-center gap-4 text-sm text-neutral-500">
+            <p>&copy; {new Date().getFullYear()} {companyInfo.name}. สงวนลิขสิทธิ์.</p>
+            <div class="flex gap-6">
+              <a href="/privacy-policy" class="hover:text-primary-600 transition-colors">นโยบายความเป็นส่วนตัว</a>
+              <a href="/terms-and-conditions" class="hover:text-primary-600 transition-colors">ข้อกำหนดการใช้งาน</a>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+
+  <script>
+    document.addEventListener('DOMContentLoaded', () => {
+      const priceButton = document.querySelector('[data-price-button]');
+      if (!priceButton) return;
+      const hasPricelist = document.getElementById('pricelist') !== null;
+      if (hasPricelist) {
+        priceButton.classList.remove('hidden');
+        priceButton.removeAttribute('disabled');
+      } else {
+        priceButton.classList.add('hidden');
+      }
+    });
+  </script>
+</Layout>
--- a/src/layouts/Layout.astro
+++ b/src/layouts/Layout.astro
@@ -0,0 +1,43 @@
+---
+import '@/styles/global.css';
+
+interface Props {
+  title: string;
+  description?: string;
+}
+
+const { title, description = "ดีล พลัส เทค - ระบบน้ำคุณภาพสูง ราคาโรงงาน" } = Astro.props;
+---
+
+<!doctype html>
+<html lang="th">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta name="description" content={description} />
+    <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
+    <link rel="preconnect" href="https://fonts.googleapis.com" />
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+    <link href="https://fonts.googleapis.com/css2?family=Kanit:wght@400;500;600;700&family=Noto+Sans+Thai:wght@400;500;600&display=swap" rel="stylesheet" />
+    <title>{title}</title>
+  </head>
+  <body class="min-h-screen bg-neutral-50">
+    <slot />
+  </body>
+</html>
+
+<style is:global>
+  /* Page transition animations */
+  main {
+    animation: fadeIn 0.3s ease-out;
+  }
+
+  @keyframes fadeIn {
+    from {
+      opacity: 0;
+    }
+    to {
+      opacity: 1;
+    }
+  }
+</style>
--- a/src/pages/about-us.astro
+++ b/src/pages/about-us.astro
@@ -0,0 +1,171 @@
+---
+import BaseLayout from '@/layouts/BaseLayout.astro';
+---
+
+<BaseLayout title="เกี่ยวกับเรา - ดีล พลัส เทค" description="ดีล พลัส เทค จำกัด ผู้นำด้านระบบน้ำคุณภาพสูง ราคาโรงงาน มีประสบการณ์กว่า 10 ปี">
+  <!-- Hero -->
+  <section class="bg-gradient-to-br from-primary-700 to-primary-600 text-white py-16 lg:py-24">
+    <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+      <div class="max-w-3xl">
+        <h1 class="text-4xl lg:text-5xl font-bold mb-6">เกี่ยวกับเรา</h1>
+        <p class="text-lg text-primary-100">
+          ดีล พลัส เทค จำกัด ผู้นำด้านระบบน้ำและสุขภัณฑ์คุณภาพสูง ท่อ PPR ท่อ HDPE อุปกรณ์วาล์ว ปั๊มน้ำ เครื่องเชื่อมท่อ อุปกรณ์ปรับอากาศ และฉนวนหุ้มท่อสำหรับโรงงานและบ้านเรือน
+        </p>
+      </div>
+    </div>
+  </section>
+
+  <!-- Company Info -->
+  <section class="py-16 lg:py-24 bg-white">
+    <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+      <div class="grid lg:grid-cols-2 gap-12 items-center">
+        <div>
+          <h2 class="text-3xl font-bold text-primary-700 mb-6">บริษัท ดีล พลัส เทค จำกัด</h2>
+          <div class="space-y-4 text-neutral-600">
+            <p>
+              ดีล พลัส เทค จำกัด เป็นผู้นำด้านระบบน้ำและสุขภัณฑ์คุณภาพสูง ด้วยประสบการณ์กว่า 10 ปีในอุตสาหกรรม ทำให้เราเข้าใจความต้องการของลูกค้าเป็นอย่างดี
+            </p>
+            <p>
+              เราเป็นตัวแทนจำหน่ายและจัดจำหน่ายสินค้าระบบน้ำคุณภาพสูงจากแบรนด์ชั้นนำทั่วโลก อาทิ ท่อ PPR ไทยพีพีอาร์ ท่อ PPR ตราช้าง ท่อ HDPE ท่อ UPVC อุปกรณ์วาล์ว ปั๊มน้ำ เครื่องเชื่อมท่อ และอุปกรณ์ปรับอากาศ
+            </p>
+            <p>
+              สินค้าของเราได้รับมาตรฐาน มอก. และได้รับความไว้วางใจจากโครงการทั่วประเทศ ทั้งโรงงานอุตสาหกรรม อาคารพาณิชย์ โรงแรม โรงพยาบาล และบ้านเรือน
+            </p>
+          </div>
+        </div>
+        <div class="bg-neutral-50 rounded-2xl p-8 border border-neutral-200">
+          <h3 class="text-xl font-semibold text-primary-700 mb-6">สินค้าหลัก</h3>
+          <div class="grid grid-cols-2 gap-4">
+            <div class="flex items-center gap-3">
+              <div class="w-10 h-10 bg-primary-100 rounded-lg flex items-center justify-center">
+                <svg class="w-5 h-5 text-primary-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+              </div>
+              <span class="text-neutral-700">ท่อ PPR</span>
+            </div>
+            <div class="flex items-center gap-3">
+              <div class="w-10 h-10 bg-primary-100 rounded-lg flex items-center justify-center">
+                <svg class="w-5 h-5 text-primary-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+              </div>
+              <span class="text-neutral-700">ท่อ HDPE</span>
+            </div>
+            <div class="flex items-center gap-3">
+              <div class="w-10 h-10 bg-primary-100 rounded-lg flex items-center justify-center">
+                <svg class="w-5 h-5 text-primary-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+              </div>
+              <span class="text-neutral-700">เครื่องเชื่อมท่อ</span>
+            </div>
+            <div class="flex items-center gap-3">
+              <div class="w-10 h-10 bg-primary-100 rounded-lg flex items-center justify-center">
+                <svg class="w-5 h-5 text-primary-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+              </div>
+              <span class="text-neutral-700">วาล์ว</span>
+            </div>
+            <div class="flex items-center gap-3">
+              <div class="w-10 h-10 bg-primary-100 rounded-lg flex items-center justify-center">
+                <svg class="w-5 h-5 text-primary-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+              </div>
+              <span class="text-neutral-700">ปั๊มน้ำ</span>
+            </div>
+            <div class="flex items-center gap-3">
+              <div class="w-10 h-10 bg-primary-100 rounded-lg flex items-center justify-center">
+                <svg class="w-5 h-5 text-primary-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+              </div>
+              <span class="text-neutral-700">ฉนวนท่อ</span>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </section>
+
+  <!-- Stats -->
+  <section class="py-16 bg-neutral-50">
+    <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+      <div class="grid grid-cols-3 gap-6 lg:gap-8">
+        <div class="text-center p-8 bg-white rounded-2xl border border-neutral-200">
+          <div class="text-4xl lg:text-5xl font-bold text-primary-600 mb-2">10+</div>
+          <div class="text-neutral-600">ปีประสบการณ์</div>
+        </div>
+        <div class="text-center p-8 bg-white rounded-2xl border border-neutral-200">
+          <div class="text-4xl lg:text-5xl font-bold text-primary-600 mb-2">1000+</div>
+          <div class="text-neutral-600">โปรเจคสำเร็จ</div>
+        </div>
+        <div class="text-center p-8 bg-white rounded-2xl border border-neutral-200">
+          <div class="text-4xl lg:text-5xl font-bold text-primary-600 mb-2">500+</div>
+          <div class="text-neutral-600">สินค้าในคลัง</div>
+        </div>
+      </div>
+    </div>
+  </section>
+
+  <!-- Why Choose Us -->
+  <section class="py-16 lg:py-24 bg-white">
+    <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+      <div class="text-center mb-12">
+        <h2 class="text-3xl font-bold text-primary-700 mb-4">ทำไมต้องเลือกเรา</h2>
+      </div>
+      <div class="grid md:grid-cols-2 lg:grid-cols-4 gap-6">
+        <div class="text-center p-6">
+          <div class="w-16 h-16 mx-auto mb-4 bg-accent-100 rounded-2xl flex items-center justify-center">
+            <svg class="w-8 h-8 text-accent-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" />
+            </svg>
+          </div>
+          <h3 class="text-lg font-semibold text-primary-700 mb-2">คุณภาพสูง</h3>
+          <p class="text-sm text-neutral-600">สินค้าผ่านมาตรฐาน มอก. รับประกันคุณภาพ</p>
+        </div>
+        <div class="text-center p-6">
+          <div class="w-16 h-16 mx-auto mb-4 bg-accent-100 rounded-2xl flex items-center justify-center">
+            <svg class="w-8 h-8 text-accent-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8c1.11 0 2.08.402 2.599 1M12 8V7m0 1v8m0 0v1m0-1c-1.11 0-2.08-.402-2.599-1M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
+            </svg>
+          </div>
+          <h3 class="text-lg font-semibold text-primary-700 mb-2">ราคาโรงงาน</h3>
+          <p class="text-sm text-neutral-600">ราคาพิเศษ ราคาโรงงาน ไม่มีมาร์จิ้นกลาง</p>
+        </div>
+        <div class="text-center p-6">
+          <div class="w-16 h-16 mx-auto mb-4 bg-accent-100 rounded-2xl flex items-center justify-center">
+            <svg class="w-8 h-8 text-accent-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z" />
+            </svg>
+          </div>
+          <h3 class="text-lg font-semibold text-primary-700 mb-2">จัดส่งรวดเร็ว</h3>
+          <p class="text-sm text-neutral-600">สินค้าพร้อมส่ง จัดส่งภายใน 1-3 วัน</p>
+        </div>
+        <div class="text-center p-6">
+          <div class="w-16 h-16 mx-auto mb-4 bg-accent-100 rounded-2xl flex items-center justify-center">
+            <svg class="w-8 h-8 text-accent-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M18.364 5.636l-3.536 3.536m0 5.656l3.536 3.536M9.172 9.172L5.636 5.636m3.536 9.192l-3.536 3.536M21 12a9 9 0 11-18 0 9 9 0 0118 0zm-5 0a4 4 0 11-8 0 4 4 0 018 0z" />
+            </svg>
+          </div>
+          <h3 class="text-lg font-semibold text-primary-700 mb-2">บริการดี</h3>
+          <p class="text-sm text-neutral-600">ให้คำปรึกษาฟรี ตอบคำถามทุกคำถาม</p>
+        </div>
+      </div>
+    </div>
+  </section>
+
+  <!-- CTA -->
+  <section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white">
+    <div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
+      <h2 class="text-3xl font-bold mb-6">ต้องการสินค้าคุณภาพ ราคาโรงงาน?</h2>
+      <p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ @JPPSELECTION</p>
+      <div class="flex flex-wrap justify-center gap-4">
+        <a href="/contact-us" class="bg-white text-primary-700 py-3 px-8 rounded-xl font-semibold hover:bg-primary-50 transition-colors">ติดต่อเรา</a>
+        <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-8 rounded-xl font-semibold transition-colors">แอดไลน์</a>
+      </div>
+    </div>
+  </section>
+</BaseLayout>
--- a/src/pages/all-products.astro
+++ b/src/pages/all-products.astro
@@ -0,0 +1,98 @@
+---
+import BaseLayout from '@/layouts/BaseLayout.astro';
+
+const products = [
+  { name: "ท่อ PPR ไทยพีพีอาร์", href: "/ท่อ-ppr-thai-ppr", image: "/images/products-cropped/ppr-pipe_000C.jpg", category: "ท่อพีพีอาร์" },
+  { name: "ท่อ PPR ตราช้าง", href: "/ท่อ-ppr-scg", image: "/images/products-cropped/ppr-scg.jpg", category: "ท่อพีพีอาร์" },
+  { name: "ท่อ HDPE", href: "/ท่อ-hdpe", image: "/images/products-cropped/hdpe001.png", category: "ท่อพีพีอาร์" },
+  { name: "ท่อ UPVC", href: "/ท่อ-upvc", image: "/images/products-cropped/upvc-pipe_000C.jpg", category: "ท่อ UPVC" },
+  { name: "ท่อ Syler", href: "/ท่อ-syler", image: "/images/products-cropped/syler-pipe-cold-water.jpg", category: "ท่อ UPVC" },
+  { name: "ท่อ XYLENT", href: "/ท่อ-xy-lent", image: "/images/products-cropped/XYLENT_001.png", category: "ท่อ UPVC" },
+  { name: "เครื่องเชื่อม HDPE", href: "/เครื่องเชื่อม-hdpe", image: "/images/HDPE-welding-crop.jpg", category: "เครื่องเชื่อม" },
+  { name: "เครื่องเชื่อม PPR", href: "/เครื่องเชื่อม-ppr", image: "/images/products-misc/ppr-welding-machine-main.jpg", category: "เครื่องเชื่อม" },
+  { name: "Pipe Coupling", href: "/pipe-coupling", image: "/images/pipe-coupling/BG-SMC02.png", category: "เครื่องเชื่อม" },
+  { name: "เม็กกรู๊ฟ คับปลิ้ง", href: "/เม็กกรู๊ฟ-คับปลิ้ง", image: "/images/products-misc/MECH_001.jpg", category: "เครื่องเชื่อม" },
+  { name: "วาล์ว Valve", href: "/วาล์ว-valve", image: "/images/products-cropped/valve_000C.jpg", category: "วาล์ว" },
+  { name: "DURGO วาล์วเติมอากาศ", href: "/durgo-avvs", image: "/images/products-cropped/durgo_000C.jpg", category: "วาล์ว" },
+  { name: "ปั๊มน้ำ Water Pump", href: "/water-pump", image: "/images/products-cropped/water-pump_000C.jpg", category: "ปั๊มและระบบน้ำ" },
+  { name: "ระบบกรองน้ำ", href: "/water-treatment", image: "/images/products-cropped/water-treatment_000C.jpg", category: "ปั๊มและระบบน้ำ" },
+  { name: "อุปกรณ์ปรับอากาศ", href: "/อุปกรณ์ปรับอากาศ", image: "/images/products-raw/ball-jet/main-ball-jet.jpg", category: "อุปกรณ์ปรับอากาศ" },
+  { name: "กริลแอร์", href: "/grilles", image: "/images/products-cropped/grilles_000C.jpg", category: "อุปกรณ์ปรับอากาศ" },
+  { name: "อุปกรณ์ดับเพลิง", href: "/อุปกรณ์ดับเพลิง", image: "/images/products-cropped/extinguishers_000C.jpg", category: "อุปกรณ์ดับเพลิง" },
+  { name: "Realflex", href: "/realflex", image: "/images/products-cropped/realflex_000C.jpg", category: "ฉนวนและรั้ว" },
+  { name: "ฉนวนหุ้มท่อ", href: "/ฉนวนหุ้มท่อ", image: "/images/thermobreak/thermobreak-solarblock.png", category: "ฉนวนและรั้ว" },
+  { name: "เทอร์โมเบรค Thermobreak", href: "/เทอร์โมเบรค-thermobreak", image: "/images/thermobreak/thermobreak-solarblock.png", category: "ฉนวนและรั้ว" },
+  { name: "รั้วเทวดา", href: "/รั้วเทวดา", image: "/images/products-raw/tevada/TEVADA_001-987x1024.png", category: "ฉนวนและรั้ว" },
+  { name: "ระบบรั้วไวน์แมน", href: "/ระบบรั้วไวน์แมน", image: "/images/products-cropped/vineman_000C.jpg", category: "ฉนวนและรั้ว" },
+];
+
+const categories = [
+  { name: "ท่อพีพีอาร์", count: 2 },
+  { name: "ท่อ UPVC", count: 2 },
+  { name: "เครื่องเชื่อม", count: 4 },
+  { name: "วาล์ว", count: 2 },
+  { name: "ปั๊มและระบบน้ำ", count: 2 },
+  { name: "อุปกรณ์ปรับอากาศ", count: 2 },
+  { name: "ฉนวนและรั้ว", count: 6 },
+];
+---
+
+<BaseLayout title="สินค้าทั้งหมด - ดีล พลัส เทค" description="สินค้าระบบน้ำคุณภาพสูง ท่อ PPR ท่อ HDPE อุปกรณ์วาล์ว ปั๊มน้ำ เครื่องเชื่อมท่อ">
+  <!-- Hero -->
+  <section class="bg-gradient-to-br from-primary-700 to-primary-600 text-white py-16">
+    <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+      <h1 class="text-4xl lg:text-5xl font-bold mb-4">สินค้าทั้งหมด</h1>
+      <p class="text-lg text-primary-100">สินค้าระบบน้ำคุณภาพสูง {products.length} รายการ</p>
+    </div>
+  </section>
+
+  <!-- Categories -->
+  <section class="py-8 bg-white border-b border-neutral-200">
+    <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+      <div class="flex flex-wrap gap-3">
+        <a href="#all" class="px-4 py-2 bg-primary-600 text-white rounded-full text-sm font-medium">ทั้งหมด ({products.length})</a>
+        {categories.map(cat => (
+          <a href={`#${cat.name}`} class="px-4 py-2 bg-neutral-100 text-neutral-700 hover:bg-primary-100 hover:text-primary-700 rounded-full text-sm font-medium transition-colors">
+            {cat.name} ({cat.count})
+          </a>
+        ))}
+      </div>
+    </div>
+  </section>
+
+  <!-- Products Grid -->
+  <section class="py-16 lg:py-24 bg-neutral-50">
+    <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+      <div class="grid md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-6 stagger-container">
+        {products.map(product => (
+          <a href={product.href} class="group bg-white rounded-xl overflow-hidden border border-neutral-200 hover:border-primary-300 hover:shadow-lg transition-all">
+            <div class="aspect-square img-hover bg-neutral-100">
+              <img
+                src={product.image}
+                alt={product.name}
+                class="w-full h-full object-cover"
+                loading="lazy"
+              />
+            </div>
+            <div class="p-4">
+              <span class="text-xs text-primary-600 font-medium">{product.category}</span>
+              <h3 class="font-semibold text-neutral-800 group-hover:text-primary-600 mt-1">{product.name}</h3>
+            </div>
+          </a>
+        ))}
+      </div>
+    </div>
+  </section>
+
+  <!-- CTA -->
+  <section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white">
+    <div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
+      <h2 class="text-3xl font-bold mb-6">ต้องการสินค้าคุณภาพ ราคาโรงงาน?</h2>
+      <p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ @JPPSELECTION</p>
+      <div class="flex flex-wrap justify-center gap-4">
+        <a href="/contact-us" class="bg-white text-primary-700 py-3 px-8 rounded-xl font-semibold hover:bg-primary-50 transition-colors">ติดต่อเรา</a>
+        <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-8 rounded-xl font-semibold transition-colors">แอดไลน์</a>
+      </div>
+    </div>
+  </section>
+</BaseLayout>
--- a/src/pages/contact-us.astro
+++ b/src/pages/contact-us.astro
@@ -0,0 +1,127 @@
+---
+import BaseLayout from '@/layouts/BaseLayout.astro';
+---
+
+<BaseLayout title="ติดต่อเรา - ดีล พลัส เทค" description="ติดต่อ ดีล พลัส เทค จำกัด โทร 090-555-1415 แอดไลน์ @JPPSELECTION">
+  <!-- Hero -->
+  <section class="bg-gradient-to-br from-primary-700 to-primary-600 text-white py-16">
+    <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+      <h1 class="text-4xl lg:text-5xl font-bold mb-4">ติดต่อเรา</h1>
+      <p class="text-lg text-primary-100">พร้อมให้บริการและให้คำปรึกษาฟรี</p>
+    </div>
+  </section>
+
+  <!-- Contact Info -->
+  <section class="py-16 lg:py-24 bg-white">
+    <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+      <div class="grid md:grid-cols-2 lg:grid-cols-4 gap-6 mb-16">
+        <!-- Phone -->
+        <a href="tel:090-555-1415" class="bg-neutral-50 rounded-xl p-6 border border-neutral-200 hover:border-primary-300 hover:shadow-lg transition-all text-center group">
+          <div class="w-14 h-14 mx-auto mb-4 bg-primary-100 rounded-xl flex items-center justify-center group-hover:bg-primary-200">
+            <svg class="w-7 h-7 text-primary-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z" />
+            </svg>
+          </div>
+          <h3 class="font-semibold text-neutral-800 mb-1">โทรศัพท์</h3>
+          <p class="text-primary-600 font-medium">090-555-1415</p>
+          <p class="text-sm text-neutral-500 mt-1">โทรได้ทุกวัน</p>
+        </a>
+
+        <!-- LINE -->
+        <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" class="bg-neutral-50 rounded-xl p-6 border border-neutral-200 hover:border-primary-300 hover:shadow-lg transition-all text-center group">
+          <div class="w-14 h-14 mx-auto mb-4 bg-green-100 rounded-xl flex items-center justify-center group-hover:bg-green-200">
+            <svg class="w-7 h-7 text-green-600" fill="currentColor" viewBox="0 0 24 24">
+              <path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/>
+            </svg>
+          </div>
+          <h3 class="font-semibold text-neutral-800 mb-1">ไลน์</h3>
+          <p class="text-primary-600 font-medium">@JPPSELECTION</p>
+          <p class="text-sm text-neutral-500 mt-1">แอดเพื่อขอใบเสนอราคา</p>
+        </a>
+
+        <!-- Email -->
+        <a href="mailto:dealplustech@gmail.com" class="bg-neutral-50 rounded-xl p-6 border border-neutral-200 hover:border-primary-300 hover:shadow-lg transition-all text-center group">
+          <div class="w-14 h-14 mx-auto mb-4 bg-blue-100 rounded-xl flex items-center justify-center group-hover:bg-blue-200">
+            <svg class="w-7 h-7 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z" />
+            </svg>
+          </div>
+          <h3 class="font-semibold text-neutral-800 mb-1">อีเมล</h3>
+          <p class="text-primary-600 font-medium">dealplustech@gmail.com</p>
+          <p class="text-sm text-neutral-500 mt-1">ตอบกลับภายใน 24 ชม.</p>
+        </a>
+
+        <!-- Address -->
+        <div class="bg-neutral-50 rounded-xl p-6 border border-neutral-200 text-center">
+          <div class="w-14 h-14 mx-auto mb-4 bg-orange-100 rounded-xl flex items-center justify-center">
+            <svg class="w-7 h-7 text-orange-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17.657 16.657L13.414 20.9a1.998 1.998 0 01-2.827 0l-4.244-4.243a8 8 0 1111.314 0z" />
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 11a3 3 0 11-6 0 3 3 0 016 0z" />
+            </svg>
+          </div>
+          <h3 class="font-semibold text-neutral-800 mb-1">ที่อยู่</h3>
+          <p class="text-primary-600 font-medium text-sm">9/70 ซอยนครลุง 17</p>
+          <p class="text-sm text-neutral-500">เขตบางแค กรุงเทพฯ 10160</p>
+        </div>
+      </div>
+
+      <!-- Benefits -->
+      <div class="bg-neutral-50 rounded-2xl p-8 border border-neutral-200">
+        <h2 class="text-2xl font-bold text-primary-700 mb-6 text-center">ทำไมต้องติดต่อเรา</h2>
+        <div class="grid md:grid-cols-2 lg:grid-cols-4 gap-6">
+          <div class="flex items-start gap-3">
+            <div class="w-8 h-8 bg-primary-500 rounded-lg flex items-center justify-center shrink-0">
+              <svg class="w-5 h-5 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+              </svg>
+            </div>
+            <div>
+              <h3 class="font-medium text-neutral-800">สินค้าคุณภาพ</h3>
+              <p class="text-sm text-neutral-500">ผ่านมาตรฐาน มอก.</p>
+            </div>
+          </div>
+          <div class="flex items-start gap-3">
+            <div class="w-8 h-8 bg-primary-500 rounded-lg flex items-center justify-center shrink-0">
+              <svg class="w-5 h-5 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+              </svg>
+            </div>
+            <div>
+              <h3 class="font-medium text-neutral-800">ราคาโรงงาน</h3>
+              <p class="text-sm text-neutral-500">ไม่มีมาร์จิ้นกลาง</p>
+            </div>
+          </div>
+          <div class="flex items-start gap-3">
+            <div class="w-8 h-8 bg-primary-500 rounded-lg flex items-center justify-center shrink-0">
+              <svg class="w-5 h-5 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+              </svg>
+            </div>
+            <div>
+              <h3 class="font-medium text-neutral-800">จัดส่งรวดเร็ว</h3>
+              <p class="text-sm text-neutral-500">ภายใน 1-3 วัน</p>
+            </div>
+          </div>
+          <div class="flex items-start gap-3">
+            <div class="w-8 h-8 bg-primary-500 rounded-lg flex items-center justify-center shrink-0">
+              <svg class="w-5 h-5 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+              </svg>
+            </div>
+            <div>
+              <h3 class="font-medium text-neutral-800">ให้คำปรึกษาฟรี</h3>
+              <p class="text-sm text-neutral-500">ตอบทุกคำถาม</p>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <!-- Business Hours -->
+      <div class="mt-8 p-6 bg-primary-50 rounded-xl border border-primary-200">
+        <h3 class="font-semibold text-primary-700 mb-2">เวลาทำการ</h3>
+        <p class="text-neutral-600">จันทร์-ศุกร์ 08:00-18:00 | เสาร์ 08:00-17:00</p>
+        <p class="text-sm text-neutral-500 mt-1">หยุดวันอาทิตย์และวันหยุดนักขัตฤกษ์</p>
+      </div>
+    </div>
+  </section>
+</BaseLayout>
--- a/src/pages/durgo-avvs.astro
+++ b/src/pages/durgo-avvs.astro
@@ -0,0 +1,281 @@
+---
+import BaseLayout from '@/layouts/BaseLayout.astro';
+---
+
+<BaseLayout title="ระบบวาล์วเติมอากาศ DURGO AVVs" description="จำหน่ายระบบวาล์วเติมอากาศ DURGO AVVs คุณภาพสูง ราคาโรงงาน ส่งฟรี กทม. ปริมณฑล">
+  <main class="bg-white min-h-screen">
+    <!-- Product Hero Section -->
+    <section class="bg-gradient-to-br from-primary-700 to-primary-600 text-white py-16">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="grid lg:grid-cols-2 gap-12 items-center">
+          <div class="order-2 lg:order-1">
+            <div class="rounded-2xl overflow-hidden">
+              <img src="/images/products-cropped/durgo_000C.jpg" alt="DURGO AVVs" class="w-full h-auto rounded-xl" width="600" height="400" loading="eager" />
+            </div>
+          </div>
+          <div class="order-1 lg:order-2">
+            <span class="inline-block px-4 py-1.5 bg-white/20 text-white rounded-full text-sm font-medium mb-4">วาล์วเติมอากาศ</span>
+            <h1 class="text-3xl sm:text-4xl lg:text-5xl font-bold mb-4">ระบบวาล์วเติมอากาศ DURGO AVVs</h1>
+            <p class="text-lg sm:text-xl text-white/80 mb-8 leading-relaxed">
+              จำหน่ายระบบวาล์วเติมอากาศ DURGO AVVs คุณภาพสูง ราคาโรงงาน ส่งฟรี กรุงเทพมหานคร และปริมณฑล
+            </p>
+            <div class="flex flex-wrap gap-4 mb-8">
+              <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" class="flex items-center gap-2 bg-white text-primary-700 px-6 py-3 rounded-xl font-semibold hover:bg-primary-50 transition-colors">
+                <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"><path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/></svg>
+                แชท
+              </a>
+              <a href="tel:0905551415" class="flex items-center gap-2 bg-white/10 hover:bg-white/20 text-white px-6 py-3 rounded-xl font-semibold border border-white/30 transition-colors">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z"/>
+                </svg>
+                090-555-1415
+              </a>
+            </div>
+            <div class="flex flex-wrap gap-6">
+              <div class="flex items-center gap-2 text-white/80">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span>คุณภาพสูง มาตรฐานอุตสาหกรรม</span>
+              </div>
+              <div class="flex items-center gap-2 text-white/80">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span>ราคาโรงงาน คุ้มค่า</span>
+              </div>
+              <div class="flex items-center gap-2 text-white/80">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span>จัดส่งรวดเร็ว ส่งฟรี กทม. ปริมณฑล</span>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Product Details -->
+    <section class="py-16 bg-white">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl font-bold text-primary-700 mb-8">รายละเอียดสินค้า</h2>
+          <div class="prose prose-lg max-w-none">
+            <p class="text-lg text-neutral-700 leading-relaxed">
+              <strong>ระบบวาล์วเติมอากาศ DURGO AVVs</strong> นวัตกรรมระดับโลก ที่ประเทศชั้นนำเลือกใช้ ด้วยผลิตภัณฑ์คุณภาพจากยุโรป เชียวชาญเทคโนโลยีระบบวาล์ว ทั้งด้านการผลิต การออกแบบวางระบบ ทางด้านอุตสาหกรรมทำความร้อน และระบบสุขาภิบาลตั้งแต่ปี 1921 จนเป็นที่ยอมรับ ได้สิทธิบัตรมากมายจากทุกทวีปทั่วโลก
+            </p>
+
+            <div class="flex flex-wrap justify-center gap-4 my-8">
+              <img src="/images/durgo-avvs/durgo-002.jpg" alt="DURGO AVVs" class="max-w-md w-full h-auto rounded-lg shadow-md" width="400" height="300" loading="lazy" />
+              <img src="/images/durgo-avvs/durgo-003.jpg" alt="DURGO AVVs" class="max-w-md w-full h-auto rounded-lg shadow-md" width="400" height="300" loading="lazy" />
+            </div>
+
+            <h3 class="text-xl font-bold text-primary-700 mt-8 mb-4">เหตุผลที่ควรเลือกใช้ DURGO AVVs</h3>
+            <p class="text-lg text-neutral-700 leading-relaxed">
+              ระบบระบายน้ำฝน และน้ำทิ้ง เป็นระบบที่มีความสำคัญอย่างมากในโครงการที่พักอาศัย โรงแรม และอาคารสำนักงานต่างๆ ดังนั้น การเลือกระบบวาล์วเติมอากาศ DURGO AVVs ทดแทนท่ออากาศแบบเก่า จะทำให้เจ้าของโครงการตลอดจนผู้อาศัย ได้รับประโยชน์มากมาย
+            </p>
+
+            <div class="grid md:grid-cols-2 gap-8 my-8">
+              <div class="text-center">
+                <img src="/images/durgo-avvs/durgo-004.jpg" alt="ลดค่าใช้จ่าย" class="w-16 h-16 mx-auto mb-3 object-contain" width="64" height="64" loading="lazy" />
+                <h4 class="text-lg font-bold text-neutral-800 mb-2">ลดค่าใช้จ่าย</h4>
+                <p class="text-base text-neutral-700">วัสดุท่อน้ำทิ้ง ค่าแรง และลดระยะเวลาในการก่อสร้าง</p>
+              </div>
+              <div class="text-center">
+                <img src="/images/durgo-avvs/durgo-008.jpg" alt="มั่นใจได้" class="w-16 h-16 mx-auto mb-3 object-contain" width="64" height="64" loading="lazy" />
+                <h4 class="text-lg font-bold text-neutral-800 mb-2">มั่นใจได้</h4>
+                <p class="text-base text-neutral-700">จากการยอมรับ และการใช้งานในต่างประเทศมานาน กว่า 50 ปี</p>
+              </div>
+              <div class="text-center">
+                <img src="/images/durgo-avvs/durgo-005.jpg" alt="เพิ่มมูลค่า" class="w-16 h-16 mx-auto mb-3 object-contain" width="64" height="64" loading="lazy" />
+                <h4 class="text-lg font-bold text-neutral-800 mb-2">เพิ่มมูลค่า</h4>
+                <p class="text-base text-neutral-700">สามารถลดปริมาณ หรือไม่ต้องใช้ท่ออากาศภายในอาคาร ลดขนาดช่องชาร์ปทำให้เพิ่มพื้นที่ขาย และพื้นที่ใช้สอยได้มากขึ้น</p>
+              </div>
+              <div class="text-center">
+                <img src="/images/durgo-avvs/durgo-009.jpg" alt="ยับยั้งการลามไฟ" class="w-16 h-16 mx-auto mb-3 object-contain" width="64" height="64" loading="lazy" />
+                <h4 class="text-lg font-bold text-neutral-800 mb-2">ยับยั้งการลามไฟ</h4>
+                <p class="text-base text-neutral-700">เมื่อเกิดเหตุเพลิงไหม้ เพราะอากาศเข้าในอาคารน้อยลง เมื่อเทียบกับระบบเก่า</p>
+              </div>
+              <div class="text-center">
+                <img src="/images/durgo-avvs/durgo-006.jpg" alt="ลดกลิ่น" class="w-16 h-16 mx-auto mb-3 object-contain" width="64" height="64" loading="lazy" />
+                <h4 class="text-lg font-bold text-neutral-800 mb-2">ลดกลิ่น</h4>
+                <p class="text-base text-neutral-700">ในระบบเก่ามักมีปัญหากลิ่นเหม็นจากระบบท่อน้ำทิ้ง ทั้งภายในอาคาร และนอกอาคาร</p>
+              </div>
+              <div class="text-center">
+                <img src="/images/durgo-avvs/durgo-010.jpg" alt="ตอบโจทย์ทุกการใช้งาน" class="w-16 h-16 mx-auto mb-3 object-contain" width="64" height="64" loading="lazy" />
+                <h4 class="text-lg font-bold text-neutral-800 mb-2">ตอบโจทย์ทุกการใช้งาน</h4>
+                <p class="text-base text-neutral-700">สินค้าหลากหลายติดตั้งกับท่อประเภทต่างๆ (มาตรฐาน EN/JIS) ได้ทุกชนิด</p>
+              </div>
+              <div class="text-center">
+                <img src="/images/durgo-avvs/durgo-007.jpg" alt="ป้องกันเชื้อโรค" class="w-16 h-16 mx-auto mb-3 object-contain" width="64" height="64" loading="lazy" />
+                <h4 class="text-lg font-bold text-neutral-800 mb-2">ป้องกันเชื้อโรค</h4>
+                <p class="text-base text-neutral-700">ที่ปะปนมากับอากาศภายในท่อน้ำทิ้งระบบเก่าไม่ให้แพร่กระจายเข้าสู่ห้องพักส่วนต่างๆ ภายในอาคารได้</p>
+              </div>
+              <div class="text-center">
+                <img src="/images/durgo-avvs/durgo-011.jpg" alt="ลดอัตราการถ่ายเทอากาศ" class="w-16 h-16 mx-auto mb-3 object-contain" width="64" height="64" loading="lazy" />
+                <h4 class="text-lg font-bold text-neutral-800 mb-2">ลดอัตราการถ่ายเทอากาศ</h4>
+                <p class="text-base text-neutral-700">ในขณะที่ระบบไม่ถูกใช้งานจึงทำให้น้ำใน Trap (ตัวดักกลิ่น) ระเหยช้าลง และไม่ถูกดูดออกไป</p>
+              </div>
+            </div>
+
+            <div class="my-8 max-w-2xl mx-auto">
+              <img src="/images/durgo-avvs/durgo-012.jpg" alt="INTERNATIONAL STANDARD" class="w-full h-auto rounded-lg shadow-md" width="800" height="600" loading="lazy" />
+            </div>
+
+            <h3 class="text-xl font-bold text-primary-700 mt-8 mb-4">หลักการทำงานของวาล์วเติมอากาศ DURGO AVVs</h3>
+            <p class="text-lg text-neutral-700 leading-relaxed">
+              <strong>ระบบวาล์วเติมอากาศ DURGO AVVs</strong> ทดแทนท่อระบายอากาศของระบบท่อน้ำทิ้งแบบเก่า จะช่วยเพิ่มประสิทธิภาพของการเติมอากาศเข้าระบบ และช่วยป้องกันไม่ให้น้ำถูกดึงออกจาก Trap (ตัวดักกลิ่น) ซึ่งเป็นสาเหตุหลักของการเกิดกลิ่นเหม็น และลดการแพร่เชื้อโรคที่มากับอากาศภายในระบบท่อน้ำทิ้งได้อย่างดี
+            </p>
+            <p class="text-lg text-neutral-700 leading-relaxed">
+              ซึ่งอาศัยแรงดันที่เกิดขึ้นจากการระบายน้ำในระบบน้ำทิ้ง ทั้งแรงดันบวก (Positive Pressure) และแรงดันลบ (Negative Pressure) โดยมีขั้นตอนการทำงาน ดังนี้
+            </p>
+            <ul class="list-disc pl-6 space-y-2 text-lg text-neutral-700">
+              <li>ขณะที่แรงดันของระบบสมดุล ยังไม่มีการระบายน้ำเสีย แรงดันของอากาศปกติจะกดแผ่น Disc Valve และแผ่นซีลยาง EPDM ให้ปิดสนิท กลิ่นเหม็น และเชื้อโรคภายในท่อระบายน้ำเสีย จะไม่สามารถแพร่ออกสู่ภายนอกได้</li>
+              <li>เมื่อมีการระบายน้ำจะทำให้แรงดันในระบบเสียสมดุล และเกิดแรงดันลบในระบบ เมื่อแรงดันลบมีค่ามากพอจะทำให้แผ่นชีลยาง EPDM และแผ่น Disc Valve ยกตัวขึ้น (วาล์วเปิด) และเติมอากาศเข้าไปในระบบ</li>
+              <li>เมื่อการระบายน้ำเสร็จสิ้น แรงดันลบในระบบลดน้อยลง ระบบกลับสู่สมดุล แผ่นซีลยาง EPDM และแผ่น Disc Valve จะตกมาที่ตำแหน่งเดิม (วาล์วปิด) กลับสู่สภาวะปกติ</li>
+            </ul>
+
+            <div class="my-8">
+              <img src="/images/durgo-avvs/durgo-013.jpg" alt="หลักการทำงาน" class="w-full h-auto rounded-lg shadow-md" width="800" height="600" loading="lazy" />
+            </div>
+
+            <h3 class="text-xl font-bold text-primary-700 mt-8 mb-4">เปรียบเทียบการออกแบบระบบระบายน้ำทิ้ง</h3>
+            <div class="flex flex-wrap justify-center gap-4 my-8">
+              <img src="/images/durgo-avvs/durgo-014.jpg" alt="ระบบเดิม" class="max-w-lg w-full h-auto rounded-lg shadow-md" width="600" height="400" loading="lazy" />
+              <img src="/images/durgo-avvs/durgo-015.jpg" alt="ระบบ DURGO" class="max-w-lg w-full h-auto rounded-lg shadow-md" width="600" height="400" loading="lazy" />
+              <img src="/images/durgo-avvs/durgo-016.jpg" alt="เปรียบเทียบ" class="max-w-lg w-full h-auto rounded-lg shadow-md" width="600" height="400" loading="lazy" />
+            </div>
+
+            <h3 class="text-xl font-bold text-primary-700 mt-8 mb-4">ขนาดของวาล์วเติมอากาศ DURGO AVVs</h3>
+            <div class="my-8">
+              <img src="/images/durgo-avvs/durgo-023.jpg" alt="ขนาด" class="w-full h-auto rounded-lg shadow-md" width="800" height="600" loading="lazy" />
+            </div>
+
+            <h3 class="text-xl font-bold text-primary-700 mt-8 mb-4">เกณฑ์การเลือกใช้วาล์วเติมอากาศ DURGO AVVs</h3>
+            <div class="my-8">
+              <img src="/images/durgo-avvs/durgo-024.jpg" alt="เกณฑ์การเลือกใช้" class="w-full h-auto rounded-lg shadow-md" width="800" height="600" loading="lazy" />
+            </div>
+
+            <h3 class="text-xl font-bold text-primary-700 mt-8 mb-4">เทคนิคและข้อกำหนดขั้นต้นในการติดตั้งวาล์วเติมอากาศ DURGO AVVs</h3>
+            <ul class="list-disc pl-6 space-y-2 text-lg text-neutral-700">
+              <li>การติดตั้งวาล์วเติมอากาศ DURGO AVVs จะต้องตั้งฉากกับระดับน้ำ ค่าความคลาดเคลื่อนในการติดตั้งไม่ควรเอียงเกิน 5 องศา และห้ามติดตั้งในแนวนอนเด็ดขาด</li>
+              <li>ในการออกแบบ ต้องคำนึงถึงตำแหน่งในการติดตั้ง ไม่ควรติดตั้งวาล์วเติมอากาศ DURGO AVVs ในบริเวณที่อับอากาศและไม่ควรติดตั้งในที่ที่มีอากาศเสีย ปล่องควัน หรือที่ที่มีก๊าซอันตราย</li>
+              <li>วาล์วเติมอากาศ DURGO AVVs ควรติดตั้งในอาคาร หากติดตั้งภายนอกอาคาร ต้องมีวัสดุกันแสงแดดหรืออลูมิเนียมอัลลอยป้องกันบริเวณหัววาล์วเติมอากาศ DURGO AVVs</li>
+              <li>การติดตั้งวาล์วเติมอากาศ DURGO AVVs ห้ามติดตั้งต่ำกว่าระดับ Flood Level ของอุปกรณ์สุขภัณฑ์ 1 เมตร</li>
+            </ul>
+
+            <h3 class="text-xl font-bold text-primary-700 mt-8 mb-4">การบำรุงรักษา</h3>
+            <p class="text-lg text-neutral-700 leading-relaxed">
+              <strong>วาล์วเติมอากาศ DURGO AVVs</strong> ใช้หลักการตามธรรมชาติของความสมดุลแรงดันในระบบ ไม่ใช้ระบบไฟฟ้าหรือเครื่องกล จึงไม่มีความจำเป็นต้องบำรุงรักษาเป็นพิเศษ แต่ในกรณีที่คำนึงถึงการใช้งานที่มีปัจจัยไม่แน่นอน ควรเตรียมช่องเปิดสำหรับการบำรุงรักษา ขนาด 300 mm x 300 mm ขึ้นไป
+            </p>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Product Range Section -->
+    <section class="py-16 bg-neutral-50">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <h2 class="text-2xl font-bold text-primary-700 mb-8 text-center">ผลิตภัณฑ์วาล์วเติมอากาศ DURGO AVVs</h2>
+        <div class="max-w-4xl mx-auto">
+          <div class="grid md:grid-cols-2 gap-6 my-8">
+            <div class="bg-white p-6 rounded-xl shadow-sm">
+              <h3 class="text-lg font-bold text-neutral-800 mb-3">DURGO Air Valve (Standard)</h3>
+              <ul class="space-y-2 text-neutral-700">
+                <li>• ขนาด: 1" - 6" (DN25 - DN150)</li>
+                <li>• วัสดุ: ABS Body + EPDM Seal</li>
+                <li>• มาตรฐาน: EN/JIS Compliant</li>
+                <li>• อุณหภูมิใช้งาน: -20°C ถึง +60°C</li>
+              </ul>
+            </div>
+            <div class="bg-white p-6 rounded-xl shadow-sm">
+              <h3 class="text-lg font-bold text-neutral-800 mb-3">DURGO AVVs (Anti-Siphon)</h3>
+              <ul class="space-y-2 text-neutral-700">
+                <li>• ป้องกันการดูดน้ำจาก Trap</li>
+                <li>• รองรับ Negative Pressure สูง</li>
+                <li>• ซีลยาง EPDM ทนทาน</li>
+                <li>• อายุการใช้งานยาวนาน</li>
+              </ul>
+            </div>
+            <div class="bg-white p-6 rounded-xl shadow-sm">
+              <h3 class="text-lg font-bold text-neutral-800 mb-3">DURGO Mini Valve</h3>
+              <ul class="space-y-2 text-neutral-700">
+                <li>• ขนาดเล็ก สำหรับท่อขนาด 1" - 2"</li>
+                <li>• เหมาะสำหรับอาคารที่พักอาศัย</li>
+                <li>• ติดตั้งง่าย น้ำหนักเบา</li>
+                <li>• ราคาคุ้มค่า</li>
+              </ul>
+            </div>
+            <div class="bg-white p-6 rounded-xl shadow-sm">
+              <h3 class="text-lg font-bold text-neutral-800 mb-3">DURGO Waste Air Valve</h3>
+              <ul class="space-y-2 text-neutral-700">
+                <li>• ออกแบบสำหรับระบบ Waste Line</li>
+                <li>• รองรับอัตราการไหลสูง</li>
+                <li>• ทนต่อแรงดันบวก (Positive Pressure)</li>
+                <li>• ได้รับมาตรฐาน SHASE (ญี่ปุ่น)</li>
+              </ul>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- FAQ Section -->
+    <section class="py-16 bg-white">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <h2 class="text-2xl font-bold text-primary-700 mb-8 text-center">คำถามที่พบบ่อยเกี่ยวกับวาล์วเติมอากาศ DURGO AVVs</h2>
+        <div class="max-w-3xl mx-auto">
+          <div class="space-y-4">
+            <div class="bg-neutral-50 rounded-xl shadow-sm overflow-hidden">
+              <div class="p-6">
+                <h3 class="text-lg font-bold text-neutral-800 mb-3">1. วาล์วเติมอากาศ DURGO AVVs ต่างจากท่ออากาศแบบเดิมอย่างไร?</h3>
+                <p class="text-neutral-700 leading-relaxed">
+                  วาล์วเติมอากาศ DURGO AVVs ทำงานด้วยหลักการสมดุลแรงดันในระบบ (Pressure Balance) โดยจะเปิดเมื่อมีแรงดันลบ (Negative Pressure) เกิดขึ้นในระบบท่อระบายน้ำ และปิดอัตโนมัติเมื่อระบบกลับสู่สภาวะปกติ ต่างจากท่ออากาศแบบเดิมที่เปิดอยู่ตลอดเวลา ทำให้กลิ่นเหม็นและเชื้อโรคสามารถแพร่กระจายเข้าสู่อาคารได้
+                </p>
+              </div>
+            </div>
+            <div class="bg-neutral-50 rounded-xl shadow-sm overflow-hidden">
+              <div class="p-6">
+                <h3 class="text-lg font-bold text-neutral-800 mb-3">2. DURGO AVVs มีอายุการใช้งานนานเท่าไหร่?</h3>
+                <p class="text-neutral-700 leading-relaxed">
+                  วาล์วเติมอากาศ DURGO AVVs ผลิตจากพลาสติก ABS ที่มีความแข็งแรงสูง ร่วมกับซีลยาง EPDM ที่ทนทานต่อการเสื่อมสภาพ สามารถใช้งานได้นานกว่า 20 ปี ขึ้นอยู่กับสภาพการใช้งานและการบำรุงรักษา โดยไม่ต้องเปลี่ยนชิ้นส่วนหรือบำรุงรักษาเป็นพิเศษ
+                </p>
+              </div>
+            </div>
+            <div class="bg-neutral-50 rounded-xl shadow-sm overflow-hidden">
+              <div class="p-6">
+                <h3 class="text-lg font-bold text-neutral-800 mb-3">3. DURGO AVVs เหมาะกับอาคารประเภทใด?</h3>
+                <p class="text-neutral-700 leading-relaxed">
+                  วาล์วเติมอากาศ DURGO AVVs เหมาะสำหรับอาคารทุกประเภท ไม่ว่าจะเป็นอาคารที่พักอาศัย อาคารสำนักงาน โรงแรม ห้างสรรพสินค้า โรงงานอุตสาหกรรม โรงพยาบาล และสถานศึกษา สามารถติดตั้งกับท่อระบายน้ำทิ้งที่ใช้มาตรฐาน EN หรือ JIS ได้ทุกชนิด
+                </p>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Contact CTA -->
+    <section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white">
+      <div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
+        <h2 class="text-xl sm:text-2xl font-bold mb-6">สนใจสินค้าของเรา?</h2>
+        <p class="text-lg text-white/80 mb-8 max-w-2xl mx-auto">
+          ติดต่อเราวันนี้เพื่อรับคำแนะนำและราคาพิเศษ
+        </p>
+        <div class="flex flex-wrap justify-center gap-4">
+          <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" class="flex items-center gap-2 bg-white text-primary-700 px-6 py-3 rounded-xl font-semibold hover:bg-primary-50 transition-colors">
+            <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"><path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/></svg>
+            แชท
+          </a>
+          <a href="tel:0905551415" class="flex items-center gap-2 bg-white/10 hover:bg-white/20 text-white px-6 py-3 rounded-xl font-semibold border border-white/30 transition-colors">
+            โทร 090-555-1415
+          </a>
+        </div>
+        <p class="text-base text-white/70 mt-8">
+          <strong>โทร:</strong> 090-555-1415 &nbsp;|&nbsp; <strong>Line Id:</strong> JPPSELECTION &nbsp;|&nbsp; <strong>E-mail:</strong> dealplustech@gmail.com
+        </p>
+      </div>
+    </section>
+  </main>
+</BaseLayout>
--- a/src/pages/grilles.astro
+++ b/src/pages/grilles.astro
@@ -0,0 +1,287 @@
+---
+import BaseLayout from '@/layouts/BaseLayout.astro';
+---
+
+<BaseLayout title="กริลแอร์พลาสติก (Grilles air plastic)" description="จำหน่ายกริลแอร์พลาสติก (ABS) และอลูมิเนียม คุณภาพสูง ราคาโรงงาน ส่งฟรี กทม. ปริมณฑล">
+  <main class="bg-white min-h-screen">
+    <!-- Product Hero Section -->
+    <section class="bg-gradient-to-br from-primary-700 to-primary-600 text-white py-16">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="grid lg:grid-cols-2 gap-12 items-center">
+          <div class="order-2 lg:order-1">
+            <div class="rounded-2xl overflow-hidden">
+              <img src="/images/products-cropped/grilles_000C.jpg" alt="กริลแอร์พลาสติก" class="w-full h-auto rounded-xl" width="600" height="400" loading="eager" />
+            </div>
+          </div>
+          <div class="order-1 lg:order-2">
+            <span class="inline-block px-4 py-1.5 bg-white/20 text-white rounded-full text-sm font-medium mb-4">กริลแอร์</span>
+            <h1 class="text-3xl sm:text-4xl lg:text-5xl font-bold mb-4">กริลแอร์ (Grilles air)</h1>
+            <p class="text-lg sm:text-xl text-white/80 mb-8 leading-relaxed">
+              จำหน่ายกริลแอร์พลาสติก (ABS) และอลูมิเนียม คุณภาพสูง ราคาโรงงาน ส่งฟรี กรุงเทพมหานคร และปริมณฑล
+            </p>
+            <div class="flex flex-wrap gap-4 mb-8">
+              <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" class="flex items-center gap-2 bg-white text-primary-700 px-6 py-3 rounded-xl font-semibold hover:bg-primary-50 transition-colors">
+                <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"><path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/></svg>
+                แชท
+              </a>
+              <a href="tel:0905551415" class="flex items-center gap-2 bg-white/10 hover:bg-white/20 text-white px-6 py-3 rounded-xl font-semibold border border-white/30 transition-colors">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z"/>
+                </svg>
+                090-555-1415
+              </a>
+            </div>
+            <div class="flex flex-wrap gap-6">
+              <div class="flex items-center gap-2 text-white/80">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span>คุณภาพสูง มาตรฐานอุตสาหกรรม</span>
+              </div>
+              <div class="flex items-center gap-2 text-white/80">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span>ราคาโรงงาน คุ้มค่า</span>
+              </div>
+              <div class="flex items-center gap-2 text-white/80">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span>จัดส่งรวดเร็ว ส่งฟรี กทม. ปริมณฑล</span>
+              </div>
+              <div class="flex items-center gap-2 bg-green-500/20 rounded px-3 py-1">
+                <svg class="w-5 h-5 text-green-300" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span class="text-green-300 font-semibold">ไม่เกิดหยดน้ำ</span>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Product Details -->
+    <section class="py-16 bg-white">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl font-bold text-primary-700 mb-8">รายละเอียดสินค้า</h2>
+          <div class="prose prose-lg max-w-none space-y-8 mb-8">
+            <p class="text-lg text-neutral-700 leading-relaxed">
+              หลายคนอาจเรียกอุปกรณ์นี้ว่า "ตะแกรงแอร์" หรือ "หน้ากากช่องลม" แต่ชื่อที่ถูกต้องและเป็นทางการคือ <strong>หน้ากากแอร์ (Air Grille and Diffuser)</strong> อุปกรณ์นี้ทำหน้าที่เป็นจุดเชื่อมต่อระหว่างระบบท่อส่งลมเย็นกับพื้นที่ใช้งาน หน้ากากแอร์ไม่ได้เป็นเพียงแค่ส่วนตกแต่ง แต่ยังมีบทบาทสำคัญในการกระจายลมเย็นให้ทั่วถึงและมีประสิทธิภาพ
+            </p>
+
+            <h3 class="text-xl font-bold text-primary-700 mt-8 mb-4">หน้าที่หลักของหน้ากากแอร์</h3>
+
+            <h4 class="text-xl font-semibold text-neutral-800 mt-6 mb-2">1. ควบคุมทิศทางลม</h4>
+            <p class="text-lg text-neutral-700 leading-relaxed">
+              หน้ากากแอร์มีบานเกล็ด (Louver) ที่สามารถปรับได้ ทำให้เราสามารถควบคุมทิศทางการกระจายลมเย็นได้ตามต้องการ
+            </p>
+
+            <h4 class="text-xl font-semibold text-neutral-800 mt-6 mb-2">2. กระจายลมอย่างสม่ำเสมอ</h4>
+            <p class="text-lg text-neutral-700 leading-relaxed">
+              หน้ากากแอร์ถูกออกแบบมาเพื่อกระจายลมเย็นจากท่อให้ครอบคลุมพื้นที่กว้างขึ้น ไม่ให้ลมพุ่งแรงไปที่จุดใดจุดหนึ่งเพียงอย่างเดียว
+            </p>
+
+            <h4 class="text-xl font-semibold text-neutral-800 mt-6 mb-2">3. กรองฝุ่นเบื้องต้น</h4>
+            <p class="text-lg text-neutral-700 leading-relaxed">
+              หน้ากากแอร์บางรุ่นมีช่องสำหรับใส่แผ่นกรองอากาศ ช่วยดักจับฝุ่นละอองขนาดใหญ่ก่อนที่ลมจะถูกส่งเข้าไปในห้อง
+            </p>
+
+            <h4 class="text-xl font-semibold text-neutral-800 mt-6 mb-2">4. ความสวยงาม</h4>
+            <p class="text-lg text-neutral-700 leading-relaxed">
+              หน้ากากแอร์มีหลายรูปแบบและหลายวัสดุให้เลือกใช้ สามารถติดตั้งให้เข้ากับการออกแบบภายในของอาคารได้อย่างลงตัว
+            </p>
+
+            <div class="flex flex-wrap justify-center gap-4 my-8">
+              <img src="/images/grilles/fresh-air1-content-1.jpg" alt="Fresh Air" class="max-w-md w-full h-auto rounded-lg shadow-md" width="400" height="300" loading="lazy" />
+              <img src="/images/grilles/grilles-plastic-content.jpg" alt="กริลแอร์พลาสติก" class="max-w-md w-full h-auto rounded-lg shadow-md" width="400" height="300" loading="lazy" />
+            </div>
+
+            <h3 class="text-xl font-bold text-primary-700 mt-8 mb-4">ประเภทของหน้ากากแอร์</h3>
+            <p class="text-lg text-neutral-700 leading-relaxed">
+              หน้ากากแอร์แบ่งออกเป็นหลายประเภทตามลักษณะการใช้งานและการติดตั้ง แต่ที่นิยมใช้กันทั่วไปได้แก่
+            </p>
+            <ul class="list-disc pl-6 space-y-2 text-lg text-neutral-700">
+              <li><strong>หน้ากากแอร์แบบสี่เหลี่ยมจัตุรัส (Square Diffuser):</strong> เหมาะสำหรับห้องทั่วไปและสำนักงาน มีลักษณะเป็นช่องตารางสี่เหลี่ยม ช่วยกระจายลมเย็นออกไปในหลายทิศทาง</li>
+              <li><strong>หน้ากากแอร์แบบสี่เหลี่ยมผืนผ้า (Linear Diffuser):</strong> นิยมใช้ในพื้นที่ยาว เช่น ทางเดินหรือห้องโถง ทำให้ลมกระจายไปตามแนวขนานอย่างสม่ำเสมอ</li>
+              <li><strong>หน้ากากแอร์แบบกลม (Round Diffuser):</strong> เหมาะสำหรับการติดตั้งในเพดานที่ต้องการความกลมกลืน เช่น ห้องประชุมหรือพื้นที่ที่มีการออกแบบเป็นทรงโค้ง</li>
+              <li><strong>หน้ากากแอร์แบบหัวเจ็ต (Jet Diffuser):</strong> ออกแบบมาเพื่อส่งลมเย็นได้ไกลกว่าปกติ เหมาะสำหรับพื้นที่ที่มีเพดานสูง เช่น โกดังหรือโรงงานอุตสาหกรรม</li>
+            </ul>
+
+            <div class="flex flex-wrap justify-center gap-4 my-8">
+              <img src="/images/grilles/linear-slot-content.jpg" alt="Linear Slot" class="max-w-lg w-full h-auto rounded-lg shadow-md" width="500" height="300" loading="lazy" />
+              <img src="/images/grilles/air-grille-content.jpg" alt="หน้ากากแอร์" class="max-w-lg w-full h-auto rounded-lg shadow-md" width="500" height="300" loading="lazy" />
+            </div>
+
+            <h3 class="text-xl font-bold text-primary-700 mt-8 mb-4">ทำไมต้องเลือกหน้ากากแอร์จากเรา?</h3>
+            <p class="text-lg text-neutral-700 leading-relaxed">
+              ในฐานะผู้ผลิต <strong>หน้ากากแอร์</strong> ที่มีประสบการณ์ยาวนาน เราเข้าใจถึงความต้องการที่แตกต่างกันของลูกค้า เราจึงใส่ใจในทุกขั้นตอนการผลิต ตั้งแต่การเลือกใช้วัสดุคุณภาพสูง เช่น อลูมิเนียมเกรดดีที่ทนทานต่อการกัดกร่อน ไปจนถึงการออกแบบที่พิถีพิถันเพื่อให้หน้ากากแอร์ทุกชิ้นของเราทำงานได้อย่างเต็มประสิทธิภาพ
+            </p>
+
+            <h3 class="text-xl font-bold text-primary-700 mt-8 mb-4">หน้ากากแอร์: รู้จักประเภทก่อนเลือกซื้อ</h3>
+            <ul class="list-disc pl-6 space-y-2 text-lg text-neutral-700">
+              <li><strong>Supply Air Grille (หน้ากากลมส่ง):</strong> เป็นหน้ากากแอร์ทำหน้าที่จ่ายลมเย็นจากระบบปรับอากาศเข้าสู่พื้นที่ใช้งานโดยตรง</li>
+              <li><strong>Return Air Grille (หน้ากากลมกลับ):</strong> ทำหน้าที่ดูดอากาศในห้องกลับเข้าสู่ระบบปรับอากาศเพื่อนำไปผ่านกระบวนการทำความเย็นอีกครั้ง</li>
+              <li><strong>Exhaust Air Grille (หน้ากากระบายอากาศ):</strong> ทำหน้าที่ระบายอากาศเสียหรืออากาศที่ไม่ต้องการออกจากพื้นที่</li>
+            </ul>
+
+            <h4 class="text-xl font-semibold text-neutral-800 mt-6 mb-2">Ceiling Diffuser (หน้ากากแอร์แบบติดเพดาน)</h4>
+            <ul class="list-disc pl-6 space-y-2 text-lg text-neutral-700">
+              <li><strong>Square Diffuser (แบบสี่เหลี่ยมจัตุรัส):</strong> เป็นที่นิยมอย่างมากในอาคารสำนักงานและที่พักอาศัย สามารถจ่ายลมได้ 1, 2, 3 หรือ 4 ทิศทาง</li>
+              <li><strong>Round Diffuser (แบบกลม):</strong> ให้ความรู้สึกที่ดูนุ่มนวลและทันสมัย เหมาะกับพื้นที่ที่ต้องการการออกแบบที่โดดเด่น</li>
+            </ul>
+
+            <h4 class="text-xl font-semibold text-neutral-800 mt-6 mb-2">Linear Diffuser (หน้ากากแอร์แบบแนวยาว)</h4>
+            <ul class="list-disc pl-6 space-y-2 text-lg text-neutral-700">
+              <li><strong>Linear Slot Diffuser (แบบช่องยาว):</strong> มีลักษณะเป็นช่องแคบๆ ยาวๆ ให้ความสวยงามและทันสมัย นิยมใช้ในโรงแรมหรืออาคารที่เน้นดีไซน์</li>
+              <li><strong>Linear Bar Grille (แบบซี่บาร์ยาว):</strong> มีลักษณะเป็นซี่บาร์เรียงต่อกันเป็นแนวยาว ให้ความรู้สึกเรียบหรูและมินิมอล</li>
+              <li><strong>Jet Diffuser (หน้ากากแอร์แบบหัวเจ็ต):</strong> เป็นหน้ากากแอร์ที่สามารถส่งลมได้ไกลและพุ่งเป็นลำ เหมาะสำหรับพื้นที่ที่มีเพดานสูงมาก</li>
+            </ul>
+
+            <h3 class="text-xl font-bold text-primary-700 mt-8 mb-4">สรุป: เลือกหน้ากากแอร์ให้ตอบโจทย์การใช้งาน</h3>
+            <p class="text-lg text-neutral-700 leading-relaxed">
+              การเลือกใช้หน้ากากแอร์ที่เหมาะสม ไม่เพียงแค่ช่วยให้ระบบปรับอากาศทำงานได้อย่างเต็มประสิทธิภาพ แต่ยังช่วยประหยัดพลังงานและเสริมความสวยงามให้แก่อาคารของคุณอีกด้วย
+            </p>
+            <p class="text-lg text-neutral-700 leading-relaxed mt-4">
+              <strong>ฟรี ไม่มีค่าใช้จ่าย</strong> แม้ว่าจะสั่งมากสั่งน้อย เราเป็นผู้ผลิตสามารถเสนอราคาที่เหมาะสมโดนใจแน่นอนครับ
+            </p>
+          </div>
+
+          <!-- ข้อมูลจำเพาะทางเทคนิค -->
+          <div class="bg-neutral-50 rounded-lg p-6">
+            <h2 class="text-xl font-bold text-primary-700 mb-4">ข้อมูลจำเพาะทางเทคนิค</h2>
+            <div class="overflow-x-auto">
+              <table class="w-full border-collapse bg-white rounded-lg shadow-sm text-lg">
+                <thead>
+                  <tr class="bg-primary-600 text-white">
+                    <th class="px-4 py-3 text-left">ประเภท</th>
+                    <th class="px-4 py-3 text-center">ขนาด</th>
+                    <th class="px-4 py-3 text-center">CFM</th>
+                  </tr>
+                </thead>
+                <tbody class="divide-y">
+                  <tr><td colspan="3" class="px-4 py-2 bg-neutral-100 font-semibold">หน้ากากลมส่ง</td></tr>
+                  <tr><td class="px-4 py-3">Square Diffuser</td><td class="px-4 py-3 text-center">6x6 - 24x24"</td><td class="px-4 py-3 text-center">200-800</td></tr>
+                  <tr><td class="px-4 py-3">Linear Slot</td><td class="px-4 py-3 text-center">12" - 48"</td><td class="px-4 py-3 text-center">150-600</td></tr>
+                  <tr><td class="px-4 py-3">Jet Diffuser</td><td class="px-4 py-3 text-center">8" - 12"</td><td class="px-4 py-3 text-center">300-1200</td></tr>
+                  <tr><td colspan="3" class="px-4 py-2 bg-neutral-100 font-semibold">หน้ากากลมกลับ</td></tr>
+                  <tr><td class="px-4 py-3">Standard</td><td class="px-4 py-3 text-center">10x10 - 36x36"</td><td class="px-4 py-3 text-center">300-1500</td></tr>
+                </tbody>
+              </table>
+            </div>
+          </div>
+
+          <!-- วิธีเลือกขนาด -->
+          <div class="mt-8">
+            <h2 class="text-xl font-bold text-primary-700 mb-4">วิธีเลือกขนาด</h2>
+            <div class="bg-blue-50 p-4 rounded-lg mb-4">
+              <p class="font-mono text-neutral-900 text-lg">CFM ÷ 2 = พื้นที่ (ตร.นิ้ว)</p>
+              <p class="text-neutral-600 mt-1">ตัวอย่าง: 400 CFM ÷ 2 = 200 ตร.นิ้ว → 14x14</p>
+            </div>
+          </div>
+
+          <!-- เปรียบเทียบวัสดุ -->
+          <div class="mt-8 bg-neutral-50 rounded-lg p-6">
+            <h2 class="text-xl font-bold text-primary-700 mb-4">เปรียบเทียบวัสดุ</h2>
+            <div class="grid md:grid-cols-2 gap-4">
+              <div class="bg-white p-4 rounded-lg shadow-sm">
+                <h3 class="font-bold text-neutral-800 mb-2 flex items-center gap-2">
+                  <span class="w-8 h-8 bg-blue-100 rounded-full flex items-center justify-center">
+                    <svg class="w-4 h-4 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M7 21a4 4 0 01-4-4V5a2 2 0 012-2h4a2 2 0 012 2v12a4 4 0 01-4 4z"/></svg>
+                  </span>
+                  ABS Plastic
+                </h3>
+                <ul class="space-y-2 text-neutral-700">
+                  <li class="flex items-start gap-2"><span class="text-green-500">✓</span> ราคาประหยัด</li>
+                  <li class="flex items-start gap-2"><span class="text-green-500">✓</span> น้ำหนักเบา</li>
+                  <li class="flex items-start gap-2 bg-green-50 rounded px-2 py-1 border border-green-200"><span class="text-green-600 font-bold">★</span> <strong class="text-green-700">ไม่เกิดหยดน้ำ</strong></li>
+                </ul>
+              </div>
+              <div class="bg-white p-4 rounded-lg shadow-sm">
+                <h3 class="font-bold text-neutral-800 mb-2 flex items-center gap-2">
+                  <span class="w-8 h-8 bg-neutral-200 rounded-full flex items-center justify-center">
+                    <svg class="w-4 h-4 text-neutral-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 3v4M3 5h4M6 17v4m-2-2h4m5-16l2.286 6.857L21 12l-5.714 2.143L13 21l-2.286-6.857L5 12l5.714-2.143L13 3z"/></svg>
+                  </span>
+                  Aluminum
+                </h3>
+                <ul class="space-y-2 text-neutral-700">
+                  <li class="flex items-start gap-2"><span class="text-green-500">✓</span> ทนทานต่อการกัดกร่อน</li>
+                  <li class="flex items-start gap-2"><span class="text-green-500">✓</span> ดีไซน์หลากหลาย</li>
+                </ul>
+              </div>
+            </div>
+          </div>
+
+          <!-- คำถามที่พบบ่อย -->
+          <div class="mt-8">
+            <h2 class="text-xl font-bold text-primary-700 mb-4">คำถามที่พบบ่อย</h2>
+            <div class="space-y-3 text-lg">
+              <div class="bg-neutral-50 rounded-lg p-4">
+                <h3 class="font-semibold text-neutral-800 mb-2">เลือก ABS หรือ Aluminum ดี?</h3>
+                <p class="text-neutral-700">ABS ราคาถูกกว่า เหมาะกับบ้านเรือนทั่วไป ส่วน Aluminum แข็งแรงทนทานกว่า เหมาะกับอาคารสำนักงานหรือโรงงาน</p>
+              </div>
+              <div class="bg-primary-50 rounded-lg p-4 border border-primary-200">
+                <h3 class="font-semibold text-primary-800 mb-2">ทำไม ABS ถึงไม่มีหยดน้ำขัง?</h3>
+                <p class="text-primary-700">พื้นผิวพลาสติกเรียบลื่น ไม่มีรอยตะเข็บให้น้ำควบแน่นเกาะ ต่างจากโลหะที่อุณหภูมิเย็นกว่าจะทำให้เกิดหยดน้ำขังที่ผิว</p>
+              </div>
+              <div class="bg-neutral-50 rounded-lg p-4">
+                <h3 class="font-semibold text-neutral-800 mb-2">สั่งทำขนาดพิเศษได้ไหม?</h3>
+                <p class="text-neutral-700">ได้ครับ รับสั่งทำขนาดพิเศษตามต้องการ สอบถามราคาและระยะเวลาการผลิตได้เลย</p>
+              </div>
+            </div>
+          </div>
+
+          <!-- ข้อแนะนำการติดตั้ง -->
+          <div class="mt-8 bg-neutral-50 rounded-lg p-6">
+            <h2 class="text-xl font-bold text-primary-700 mb-4">ข้อแนะนำการติดตั้ง</h2>
+            <div class="grid md:grid-cols-2 gap-8">
+              <div>
+                <h3 class="text-lg font-semibold text-neutral-800 mb-4">ขั้นตอนการติดตั้ง</h3>
+                <ol class="space-y-3 text-lg">
+                  <li class="flex gap-3"><span class="flex-shrink-0 w-7 h-7 bg-primary-600 text-white rounded-full flex items-center justify-center">1</span><span class="text-neutral-700">วัดและทำเครื่องหมายตำแหน่งที่จะติดตั้ง</span></li>
+                  <li class="flex gap-3"><span class="flex-shrink-0 w-7 h-7 bg-primary-600 text-white rounded-full flex items-center justify-center">2</span><span class="text-neutral-700">ตัดช่องเปิดตามขนาดหน้ากาก (เผื่อความกว้าง 1-2 ซม.)</span></li>
+                  <li class="flex gap-3"><span class="flex-shrink-0 w-7 h-7 bg-primary-600 text-white rounded-full flex items-center justify-center">3</span><span class="text-neutral-700">ตรวจสอบระดับให้ตรง</span></li>
+                  <li class="flex gap-3"><span class="flex-shrink-0 w-7 h-7 bg-primary-600 text-white rounded-full flex items-center justify-center">4</span><span class="text-neutral-700">ยึดกรอบหน้ากากด้วยสกรูหรือคลิปยึด</span></li>
+                  <li class="flex gap-3"><span class="flex-shrink-0 w-7 h-7 bg-primary-600 text-white rounded-full flex items-center justify-center">5</span><span class="text-neutral-700">ติดตั้งตัวหน้ากากเข้ากับกรอบ</span></li>
+                  <li class="flex gap-3"><span class="flex-shrink-0 w-7 h-7 bg-primary-600 text-white rounded-full flex items-center justify-center">6</span><span class="text-neutral-700">ปรับบานเกล็ดให้ได้ทิศทางลมที่ต้องการ</span></li>
+                </ol>
+              </div>
+              <div>
+                <h3 class="text-lg font-semibold text-neutral-800 mb-4">ข้อควรระวัง</h3>
+                <ul class="space-y-3 text-lg">
+                  <li class="flex items-start gap-3"><span class="text-amber-500 text-xl">⚠️</span><span class="text-neutral-700">อย่าติดตั้งหน้ากากใกล้ม่านบังตาหรือผ้ามากเกินไป เพราะจะขวางทางลม</span></li>
+                  <li class="flex items-start gap-3"><span class="text-amber-500 text-xl">⚠️</span><span class="text-neutral-700">ควรเว้นระยะห่างจากผนังอย่างน้อย 15 ซม. เพื่อให้ลมกระจายได้ดี</span></li>
+                  <li class="flex items-start gap-3"><span class="text-amber-500 text-xl">⚠️</span><span class="text-neutral-700">ตรวจสอบความดันสถิตของระบบก่อนเลือกขนาด</span></li>
+                </ul>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Contact CTA -->
+    <section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white">
+      <div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
+        <h2 class="text-xl sm:text-2xl font-bold mb-6">สนใจสินค้าของเรา?</h2>
+        <p class="text-lg text-white/80 mb-8 max-w-2xl mx-auto">
+          ติดต่อเราวันนี้เพื่อรับคำแนะนำและราคาพิเศษ
+        </p>
+        <div class="flex flex-wrap justify-center gap-4">
+          <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" class="flex items-center gap-2 bg-white text-primary-700 px-6 py-3 rounded-xl font-semibold hover:bg-primary-50 transition-colors">
+            <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"><path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/></svg>
+            แชท
+          </a>
+          <a href="tel:0905551415" class="flex items-center gap-2 bg-white/10 hover:bg-white/20 text-white px-6 py-3 rounded-xl font-semibold border border-white/30 transition-colors">
+            โทร 090-555-1415
+          </a>
+        </div>
+        <p class="text-base text-white/70 mt-8">
+          <strong>โทร:</strong> 090-555-1415 &nbsp;|&nbsp; <strong>Line Id:</strong> JPPSELECTION &nbsp;|&nbsp; <strong>E-mail:</strong> dealplustech@gmail.com
+        </p>
+      </div>
+    </section>
+  </main>
+</BaseLayout>
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -0,0 +1,208 @@
+---
+import BaseLayout from '@/layouts/BaseLayout.astro';
+---
+
+<BaseLayout title="ดีล พลัส เทค - ระบบน้ำคุณภาพสูง ราคาโรงงาน" description="ดีล พลัส เทค จำกัด ผู้นำด้านระบบน้ำคุณภาพสูง ราคาโรงงาน ท่อ PPR ท่อ HDPE อุปกรณ์วาล์ว ปั๊มน้ำ เครื่องเชื่อมท่อ และอุปกรณ์โรงงานคุณภาพ">
+  <!-- Hero Section -->
+  <section class="relative bg-gradient-to-br from-primary-700 via-primary-600 to-primary-500 text-white overflow-hidden">
+    <!-- Animated Background Orbs -->
+    <div class="absolute inset-0 overflow-hidden pointer-events-none">
+      <div class="absolute -top-24 -right-24 w-[500px] h-[500px] bg-accent-400/40 rounded-full blur-sm animate-orb-1"></div>
+      <div class="absolute -bottom-24 -left-24 w-[450px] h-[450px] bg-primary-300/40 rounded-full blur-sm animate-orb-2"></div>
+      <div class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[800px] h-[800px] bg-primary-400/20 rounded-full blur-sm animate-orb-3"></div>
+    </div>
+    <div class="absolute inset-0 opacity-10">
+      <div class="absolute inset-0" style="background-image: url('data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.4'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E');"></div>
+    </div>
+    <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-16 lg:py-24 relative z-10">
+      <div class="grid lg:grid-cols-2 gap-12 items-center">
+        <div class="space-y-8">
+          <div class="space-y-4">
+            <span class="inline-block px-4 py-1 bg-white/20 rounded-full text-sm font-medium">
+              ระบบน้ำคุณภาพสูง ราคาโรงงาน
+            </span>
+            <h1 class="text-4xl lg:text-5xl xl:text-6xl font-bold leading-tight">
+              ระบบน้ำคุณภาพสูง<br/>
+              <span class="text-accent-400">ราคาโรงงาน</span>
+            </h1>
+            <p class="text-lg text-primary-100 max-w-xl">
+              ดีล พลัส เทค จำกัด ผู้นำด้านระบบน้ำและสุขภัณฑ์คุณภาพสูง ท่อ PPR ท่อ HDPE อุปกรณ์วาล์ว ปั๊มน้ำ เครื่องเชื่อมท่อ อุปกรณ์ปรับอากาศ และฉนวนหุ้มท่อสำหรับโรงงานและบ้านเรือน
+            </p>
+          </div>
+          <div class="flex flex-wrap gap-4">
+            <a
+              href="/all-products"
+              class="relative z-10 inline-flex items-center justify-center gap-2 bg-accent-500 hover:bg-accent-600 text-white py-4 px-8 rounded-xl font-semibold text-lg transition-all hover:shadow-lg hover:-translate-y-0.5"
+            >
+              ดูสินค้าทั้งหมด
+              <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 8l4 4m0 0l-4 4m4-4H3" />
+              </svg>
+            </a>
+            <a
+              href="/contact-us"
+              class="relative z-10 inline-flex items-center justify-center gap-2 bg-white/10 hover:bg-white/20 text-white py-4 px-8 rounded-xl font-semibold text-lg border border-white/30 transition-all"
+            >
+              ติดต่อเรา
+            </a>
+          </div>
+        </div>
+
+        <!-- Floating Product Cards -->
+        <div class="relative h-96 lg:h-[500px]">
+          <!-- Card 1 - PPR Pipe (smallest) -->
+          <div class="absolute top-8 right-12 w-36 lg:w-44 rounded-2xl shadow-2xl overflow-hidden animate-float">
+            <img src="/images/products-cropped/ppr-pipe_000C.jpg" alt="ท่อ PPR" class="w-full h-full object-cover" loading="lazy" />
+          </div>
+
+          <!-- Card 2 - Thermobreak (2nd biggest) -->
+          <div class="absolute top-20 left-8 w-44 lg:w-56 rounded-2xl shadow-2xl overflow-hidden animate-float-delayed-1">
+            <img src="/images/thermobreak/thermobreak-solarblock.png" alt="เทอร์โมเบรค" class="w-full h-full object-cover" loading="lazy" />
+          </div>
+
+          <!-- Card 3 - Grilles (biggest, center) -->
+          <div class="absolute top-32 left-1/2 -translate-x-1/2 w-56 lg:w-72 rounded-2xl shadow-2xl overflow-hidden animate-float-delayed-2">
+            <img src="/images/products-cropped/grilles_000C.jpg" alt="กริลแอร์" class="w-full h-full object-cover" loading="lazy" />
+          </div>
+        </div>
+      </div>
+    </div>
+  </section>
+
+  
+  <!-- Featured Products -->
+  <section class="py-16 lg:py-24 bg-white">
+    <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+      <div class="text-center mb-12">
+        <h2 class="text-3xl lg:text-4xl font-bold text-primary-700 mb-4">สินค้าแนะนำ</h2>
+        <p class="text-neutral-600 max-w-2xl mx-auto">สินค้าคุณภาพสูงจากแบรนด์ชั้นนำ ที่ได้รับความไว้วางใจจากลูกค้าทั่วประเทศ</p>
+      </div>
+
+      <div class="grid md:grid-cols-2 lg:grid-cols-3 gap-6 lg:gap-8 stagger-container">
+        <!-- Product 1 -->
+        <a href="/ท่อ-ppr-thai-ppr" class="group bg-neutral-50 rounded-2xl overflow-hidden border border-neutral-200 hover:border-primary-300 hover:shadow-xl transition-all">
+          <div class="aspect-square img-hover">
+            <img
+              src="/images/products-cropped/ppr-pipe_000C.jpg"
+              alt="ท่อ PPR ไทยพีพีอาร์"
+              class="w-full h-full object-cover"
+              loading="lazy"
+            />
+          </div>
+          <div class="p-6">
+            <h3 class="text-lg font-semibold text-primary-700 group-hover:text-primary-600">ท่อ PPR ไทยพีพีอาร์</h3>
+            <p class="text-neutral-500 text-sm mt-1">ท่อน้ำดื่มคุณภาพสูง ทนความร้อน ทนแรงดัน</p>
+          </div>
+        </a>
+
+        <!-- Product 2 -->
+        <a href="/grilles" class="group bg-neutral-50 rounded-2xl overflow-hidden border border-neutral-200 hover:border-primary-300 hover:shadow-xl transition-all">
+          <div class="aspect-square img-hover">
+            <img
+              src="/images/products-cropped/grilles_000C.jpg"
+              alt="กริลแอร์"
+              class="w-full h-full object-cover"
+              loading="lazy"
+            />
+          </div>
+          <div class="p-6">
+            <h3 class="text-lg font-semibold text-primary-700 group-hover:text-primary-600">กริลแอร์</h3>
+            <p class="text-neutral-500 text-sm mt-1">อุปกรณ์ปรับอากาศ ระบายอากาศคุณภาพสูง</p>
+          </div>
+        </a>
+
+        <!-- Product 3 -->
+        <a href="/เทอร์โมเบรค-thermobreak" class="group bg-neutral-50 rounded-2xl overflow-hidden border border-neutral-200 hover:border-primary-300 hover:shadow-xl transition-all">
+          <div class="aspect-square img-hover">
+            <img
+              src="/images/thermobreak/thermobreak-solarblock.png"
+              alt="เทอร์โมเบรค ฉนวนหุ้มท่อ"
+              class="w-full h-full object-cover"
+              loading="lazy"
+            />
+          </div>
+          <div class="p-6">
+            <h3 class="text-lg font-semibold text-primary-700 group-hover:text-primary-600">เทอร์โมเบรค ฉนวนหุ้มท่อ</h3>
+            <p class="text-neutral-500 text-sm mt-1">ฉนวนกันความร้อน ประหยัดพลังงาน</p>
+          </div>
+        </a>
+      </div>
+    </div>
+  </section>
+
+  <!-- Trust Badges -->
+  <section class="py-16 lg:py-20 bg-neutral-50">
+    <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+      <div class="grid grid-cols-2 lg:grid-cols-4 gap-6 lg:gap-8">
+        <div class="text-center">
+          <div class="inline-flex items-center justify-center w-16 h-16 bg-primary-100 rounded-full mb-4">
+            <svg class="w-8 h-8 text-primary-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z" />
+            </svg>
+          </div>
+          <h3 class="font-semibold text-primary-700">รับรองคุณภาพ</h3>
+          <p class="text-neutral-500 text-sm mt-1">มาตรฐาน ม.อ.ก.</p>
+        </div>
+        <div class="text-center">
+          <div class="inline-flex items-center justify-center w-16 h-16 bg-primary-100 rounded-full mb-4">
+            <svg class="w-8 h-8 text-primary-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z" />
+            </svg>
+          </div>
+          <h3 class="font-semibold text-primary-700">จัดส่งรวดเร็ว</h3>
+          <p class="text-neutral-500 text-sm mt-1">ภายใน 1-3 วัน</p>
+        </div>
+        <div class="text-center">
+          <div class="inline-flex items-center justify-center w-16 h-16 bg-primary-100 rounded-full mb-4">
+            <svg class="w-8 h-8 text-primary-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8c1.11 0 2.08.402 2.599 1M12 8V7m0 1v8m0 0v1m0-1c-1.11 0-2.08-.402-2.599-1M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
+            </svg>
+          </div>
+          <h3 class="font-semibold text-primary-700">ราคาโรงงาน</h3>
+          <p class="text-neutral-500 text-sm mt-1">ตรงจากผู้ผลิต</p>
+        </div>
+        <div class="text-center">
+          <div class="inline-flex items-center justify-center w-16 h-16 bg-primary-100 rounded-full mb-4">
+            <svg class="w-8 h-8 text-primary-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4.318 6.318a4.5 4.5 0 000 6.364L12 20.364a4.5 4.5 0 006.364-6.364L12 7.636l-1.318-1.318a4.5 4.5 0 00-6.364 0z" />
+            </svg>
+          </div>
+          <h3 class="font-semibold text-primary-700">บริการด้วยใจ</h3>
+          <p class="text-neutral-500 text-sm mt-1">ให้คำปรึกษาฟรี</p>
+        </div>
+      </div>
+    </div>
+  </section>
+
+  <!-- CTA Section -->
+  <section class="py-16 lg:py-20 bg-gradient-to-br from-primary-700 to-primary-600 text-white">
+    <div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
+      <h2 class="text-3xl lg:text-4xl font-bold mb-4">ต้องการสอบถามราคา?</h2>
+      <p class="text-lg text-primary-100 mb-8 max-w-2xl mx-auto">
+        ติดต่อทีมงานของเราได้เลย พร้อมให้บริการให้คำปรึกษาฟรี ตอบทุกคำถามเรื่องระบบน้ำและอุปกรณ์ต่างๆ
+      </p>
+      <div class="flex flex-wrap justify-center gap-4">
+        <a
+          href="tel:090-555-1415"
+          class="inline-flex items-center justify-center gap-2 bg-white text-primary-700 py-4 px-8 rounded-xl font-semibold text-lg hover:bg-primary-50 transition-all"
+        >
+          <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z" />
+          </svg>
+          090-555-1415
+        </a>
+        <a
+          href="https://line.me/ti/p/~JPPSELECTION"
+          target="_blank"
+          rel="noopener"
+          class="inline-flex items-center justify-center gap-2 bg-accent-500 hover:bg-accent-600 text-white py-4 px-8 rounded-xl font-semibold text-lg transition-all"
+        >
+          <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24">
+            <path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/>
+          </svg>
+          แอดไลน์
+        </a>
+      </div>
+    </div>
+  </section>
+</BaseLayout>
--- a/src/pages/pipe-coupling.astro
+++ b/src/pages/pipe-coupling.astro
@@ -0,0 +1,182 @@
+---
+import BaseLayout from '@/layouts/BaseLayout.astro';
+---
+
+<BaseLayout title="ข้อต่อท่อ SMC (Pipe Coupling)" description="จำหน่ายข้อต่อท่อ SMC (Pipe Coupling) คุณภาพสูง ราคาโรงงาน ส่งฟรี กทม. ปริมณฑล">
+  <main class="bg-white min-h-screen">
+    <!-- Product Hero Section -->
+    <section class="bg-gradient-to-br from-primary-700 to-primary-600 text-white py-16">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="grid lg:grid-cols-2 gap-12 items-center">
+          <div class="lg:sticky lg:top-24">
+            <div class="bg-white/10 backdrop-blur-sm rounded-2xl p-6">
+              <img src="/images/pipe-coupling/BG-SMC02.png" alt="ข้อต่อท่อ SMC" class="w-full h-auto rounded-xl" width="600" height="400" loading="eager" />
+            </div>
+          </div>
+          <div>
+            <span class="inline-block px-4 py-1.5 bg-white/20 text-white rounded-full text-sm font-medium mb-4">ข้อต่อท่อ</span>
+            <h1 class="text-3xl sm:text-4xl lg:text-5xl font-bold mb-4">ข้อต่อท่อ SMC (Pipe Coupling)</h1>
+            <p class="text-lg sm:text-xl text-white/80 mb-4 leading-relaxed">
+              จำหน่ายข้อต่อท่อ SMC (Pipe Coupling) คุณภาพสูง ราคาโรงงาน ส่งฟรี กรุงเทพมหานคร และปริมณฑล
+            </p>
+            <div class="flex flex-wrap gap-4 mb-8">
+              <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" class="flex items-center gap-2 bg-white text-primary-700 px-6 py-3 rounded-xl font-semibold hover:bg-primary-50 transition-colors">
+                <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"><path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/></svg>
+                แชท
+              </a>
+              <a href="tel:0905551415" class="flex items-center gap-2 bg-white/10 hover:bg-white/20 text-white px-6 py-3 rounded-xl font-semibold border border-white/30 transition-colors">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z"/>
+                </svg>
+                090-555-1415
+              </a>
+            </div>
+            <div class="space-y-4">
+              <div class="flex items-start space-x-3">
+                <svg class="w-6 h-6 text-white mt-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span class="text-lg text-white/80">คุณภาพสูง มาตรฐานอุตสาหกรรม</span>
+              </div>
+              <div class="flex items-start space-x-3">
+                <svg class="w-6 h-6 text-white mt-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span class="text-lg text-white/80">ราคาโรงงาน คุ้มค่า</span>
+              </div>
+              <div class="flex items-start space-x-3">
+                <svg class="w-6 h-6 text-white mt-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span class="text-lg text-white/80">จัดส่งรวดเร็ว ส่งฟรี กทม. ปริมณฑล</span>
+              </div>
+              <div class="flex items-start space-x-3">
+                <svg class="w-6 h-6 text-white mt-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span class="text-lg text-white/80">รับประกันสินค้า</span>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Product Details -->
+    <section class="py-16 bg-white">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl font-bold text-primary-700 mb-4">รายละเอียดสินค้า</h2>
+
+          <div class="bg-primary-50 border-2 border-primary-200 rounded-xl p-6 mt-4 mb-6">
+            <p class="text-xl sm:text-2xl font-bold text-primary-700 text-center">
+              ไม่เชื่อม • ไม่กรู๊ฟ • ติดตั้งง่าย • แค่ขันน็อต
+            </p>
+          </div>
+
+          <h2 class="text-xl font-bold text-neutral-800 mb-8 text-center">การปฏิวัติวงการท่อส่งน้ำและก๊าซ</h2>
+
+          <div class="prose prose-lg max-w-none">
+            <p class="text-lg text-neutral-700 leading-relaxed">
+              <strong>ข้อต่อท่อ SMC</strong> เป็นระบบข้อต่อท่อที่ได้รับการพัฒนามาเพื่อทดแทนการเชื่อมท่อด้วยไฟฟ้าแบบเดิม โดยใช้หลักการบีบอัด (Compression) เข้ากับวงแหวน O-Ring ที่อยู่ภายในตัวข้อต่อ ทำให้สามารถประกอบท่อได้อย่างรวดเร็วและมีความแข็งแรงทนทาน
+            </p>
+
+            <div class="bg-blue-50 border-l-4 border-blue-500 rounded-r-xl p-6 mt-6">
+              <h3 class="font-bold text-blue-800 mb-3 text-xl">ข้อดีเด่นของข้อต่อท่อ SMC</h3>
+              <ul class="text-blue-700 space-y-2">
+                <li>✓ ไม่ต้องใช้เครื่องเชื่อมท่อ - ประหยัดค่าเครื่องมือ</li>
+                <li>✓ ไม่ต้องใช้ช่างที่มีประสบการณ์สูง - ทำเองได้ง่ายๆ</li>
+                <li>✓ ไม่เกิดประกายไฟ - ปลอดภัยในพื้นที่อันตราย</li>
+                <li>✓ ติดตั้งในพื้นที่แคบได้ - คล่องตัวสูง</li>
+                <li>✓ สามารถใช้ซ้ำได้ - ประหยัดค่าใช้จ่ายระยะยาว</li>
+              </ul>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Product Types -->
+    <section class="py-16 bg-neutral-50">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-xl font-bold text-neutral-800 mb-12 text-center">รุ่นของสินค้า</h2>
+
+          <!-- GR Type -->
+          <div class="mb-16">
+            <h3 class="text-xl font-bold text-neutral-800 mb-6 flex items-center">
+              <span class="bg-primary-600 text-white w-10 h-10 rounded-full flex items-center justify-center mr-4">GR</span>
+              รุ่น GR / Grip Ring (สำหรับติดตั้งใหม่)
+            </h3>
+            <div class="grid md:grid-cols-2 gap-8 items-start">
+              <div class="bg-white rounded-xl p-6 shadow-sm">
+                <p class="text-neutral-700 leading-relaxed">
+                  <strong>รุ่น GR / Grip Ring</strong> เป็นข้อต่อท่อแบบถอดได้ (Disassembly) เหมาะสำหรับการติดตั้งท่อใหม่ มีวงแหวนกันการเคลื่อนที่ (Grip) อยู่ภายใน ช่วยให้ท่อยึดติดแน่นไม่หลุดแม้ในสภาพแรงดันสูง สามารถถอดประกอบใหม่ได้หลังการติดตั้ง เหมาะสำหรับงานที่ต้องการความยืดหยุ่นในการปรับเปลี่ยนระบบท่อภายหลังและงานที่ต้องการความแข็งแรงพิเศษ
+                </p>
+              </div>
+              <img src="/images/pipe-coupling/SMC-Page-05.jpg" alt="รุ่น GR / Grip Ring" class="w-full h-auto rounded-xl shadow-md" width="800" height="600" loading="lazy" />
+            </div>
+          </div>
+
+          <!-- RCH Type -->
+          <div class="mb-16">
+            <h3 class="text-xl font-bold text-neutral-800 mb-6 flex items-center">
+              <span class="bg-blue-600 text-white w-10 h-10 rounded-full flex items-center justify-center mr-4">RCH</span>
+              รุ่น RCH (สำหรับงานซ่อม)
+            </h3>
+            <div class="grid md:grid-cols-2 gap-8 items-start">
+              <img src="/images/pipe-coupling/SMC-Page-07.jpg" alt="รุ่น RCH" class="w-full h-auto rounded-xl shadow-md" width="800" height="600" loading="lazy" />
+              <div class="bg-white rounded-xl p-6 shadow-sm">
+                <p class="text-neutral-700 leading-relaxed">
+                  รุ่น RCH เป็นข้อต่อท่อแบบถอดได้เช่นกัน แต่ออกแบบมาเพื่อการซ่อมแซมท่อที่รั่วซึมหรือเสียหาย สามารถติดตั้งได้โดยไม่ต้องตัดท่อส่วนที่เสียหายออก ช่วยประหยัดเวลาและค่าใช้จ่ายในการซ่อมแซม
+                </p>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- FAQ Section -->
+    <section id="faq" class="py-16 bg-white">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-xl font-bold text-neutral-800 mb-8">คำถามที่พบบ่อย</h2>
+          <div class="space-y-4">
+            <div class="bg-neutral-50 rounded-lg p-4">
+              <h3 class="font-semibold text-neutral-800 mb-2">Q: ข้อต่อท่อ SMC แตกต่างจากข้อต่อท่อแบบเดิมอย่างไร?</h3>
+              <p class="text-neutral-700">ข้อต่อท่อ SMC ใช้หลักการบีบอัด (Compression) กับวงแหวน O-Ring ภายใน ทำให้ไม่ต้องใช้เครื่องเชื่อมท่อ สามารถติดตั้งได้ง่ายและรวดเร็วกว่าการเชื่อมท่อด้วยไฟฟ้าแบบเดิม นอกจากนี้ยังสามารถถอดประกอบใหม่ได้ และไม่เกิดประกายไฟขณะติดตั้ง ทำให้ปลอดภัยในพื้นที่อันตราย</p>
+            </div>
+            <div class="bg-neutral-50 rounded-lg p-4">
+              <h3 class="font-semibold text-neutral-800 mb-2">Q: ข้อต่อท่อ SMC สามารถใช้กับท่อประเภทใดได้บ้าง?</h3>
+              <p class="text-neutral-700">ข้อต่อท่อ SMC สามารถใช้ได้กับท่อหลายประเภท เช่น ท่อเหล็กกล้า (Steel), ท่อสแตนเลส (Stainless Steel), ท่อเหล็กอาร์ค (M.S.), ท่อทองแดง (Copper) และท่อ PVC/UPVC ขึ้นอยู่กับรุ่นและขนาดที่เหมาะสมกับการใช้งาน</p>
+            </div>
+            <div class="bg-neutral-50 rounded-lg p-4">
+              <h3 class="font-semibold text-neutral-800 mb-2">Q: อายุการใช้งานของข้อต่อท่อ SMC นานเท่าไหร่?</h3>
+              <p class="text-neutral-700">อายุการใช้งานของข้อต่อท่อ SMC ขึ้นอยู่กับการใช้งานและสภาพแวดล้อม โดยทั่วไปสามารถใช้งานได้นาน 10-20 ปีหรือมากกว่าหากติดตั้งและบำรุงรักษาอย่างถูกต้อง</p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Contact CTA -->
+    <section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white">
+      <div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
+        <h2 class="text-xl sm:text-2xl font-bold mb-6">สนใจสินค้าของเรา?</h2>
+        <p class="text-lg text-white/80 mb-8 max-w-2xl mx-auto">
+          ติดต่อเราวันนี้เพื่อรับคำแนะนำและราคาพิเศษ
+        </p>
+        <div class="flex flex-wrap justify-center gap-4">
+          <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" class="flex items-center gap-2 bg-white text-primary-700 px-6 py-3 rounded-xl font-semibold hover:bg-primary-50 transition-colors">
+            <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"><path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/></svg>
+            แชท
+          </a>
+          <a href="tel:0905551415" class="flex items-center gap-2 bg-white/10 hover:bg-white/20 text-white px-6 py-3 rounded-xl font-semibold border border-white/30 transition-colors">
+            โทร 090-555-1415
+          </a>
+        </div>
+      </div>
+    </section>
+  </main>
+</BaseLayout>
--- a/src/pages/portfolio.astro
+++ b/src/pages/portfolio.astro
@@ -0,0 +1,144 @@
+---
+import BaseLayout from '@/layouts/BaseLayout.astro';
+---
+
+<BaseLayout title="ผลงาน - ดีล พลัส เทค" description="ผลงานติดตั้งระบบน้ำของ ดีล พลัส เทค จำกัด">
+  <!-- Hero -->
+  <section class="bg-gradient-to-br from-primary-700 to-primary-600 text-white py-16">
+    <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+      <h1 class="text-4xl lg:text-5xl font-bold mb-4">ผลงาน</h1>
+      <p class="text-lg text-primary-100">ตัวอย่างโครงการที่ได้รับความไว้วางใจจากลูกค้าทั่วประเทศ</p>
+    </div>
+  </section>
+
+  <!-- Portfolio Grid -->
+  <section class="py-16 lg:py-24 bg-white">
+    <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+      <div class="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
+
+        <!-- Project 1 - Cyber World -->
+        <div class="group bg-neutral-50 rounded-xl overflow-hidden border border-neutral-200 hover:shadow-xl transition-all">
+          <div class="aspect-video img-hover bg-neutral-200">
+            <img src="/images/portfolio/cyber-world.jpg" alt="Cyber World" class="w-full h-full object-cover" loading="lazy" />
+          </div>
+          <div class="p-4">
+            <h3 class="font-semibold text-primary-700 group-hover:text-primary-600">Cyber World</h3>
+            <p class="text-sm text-neutral-500 mt-1">ติดตั้งระบบท่อ PPR</p>
+          </div>
+        </div>
+
+        <!-- Project 2 - Toyox -->
+        <div class="group bg-neutral-50 rounded-xl overflow-hidden border border-neutral-200 hover:shadow-xl transition-all">
+          <div class="aspect-video img-hover bg-neutral-200">
+            <img src="/images/portfolio/toyox.jpg" alt="Toyox" class="w-full h-full object-cover" loading="lazy" />
+          </div>
+          <div class="p-4">
+            <h3 class="font-semibold text-primary-700 group-hover:text-primary-600">Toyox</h3>
+            <p class="text-sm text-neutral-500 mt-1">ติดตั้งระบบท่ออุตสาหกรรม</p>
+          </div>
+        </div>
+
+        <!-- Project 4 - Ethanol Factory -->
+        <div class="group bg-neutral-50 rounded-xl overflow-hidden border border-neutral-200 hover:shadow-xl transition-all">
+          <div class="aspect-video img-hover bg-neutral-200">
+            <img src="/images/portfolio/ethanol-factory.jpg" alt="โรงงานเอธานอล" class="w-full h-full object-cover" loading="lazy" />
+          </div>
+          <div class="p-4">
+            <h3 class="font-semibold text-primary-700 group-hover:text-primary-600">โรงงานเอธานอล</h3>
+            <p class="text-sm text-neutral-500 mt-1">ติดตั้งระบบท่ออุตสาหกรรม</p>
+          </div>
+        </div>
+
+        <!-- Project 6 - Seacon Bang Khae -->
+        <div class="group bg-neutral-50 rounded-xl overflow-hidden border border-neutral-200 hover:shadow-xl transition-all">
+          <div class="aspect-video img-hover bg-neutral-200">
+            <img src="/images/portfolio/seacon-bang-khae.jpg" alt="ซีคอนบางแค" class="w-full h-full object-cover" loading="lazy" />
+          </div>
+          <div class="p-4">
+            <h3 class="font-semibold text-primary-700 group-hover:text-primary-600">ซีคอนบางแค (Seacon Bang Khae)</h3>
+            <p class="text-sm text-neutral-500 mt-1">ติดตั้งระบบท่อ</p>
+          </div>
+        </div>
+
+        <!-- Project 7 - CP Ram Ladkrabang -->
+        <div class="group bg-neutral-50 rounded-xl overflow-hidden border border-neutral-200 hover:shadow-xl transition-all">
+          <div class="aspect-video img-hover bg-neutral-200">
+            <img src="/images/portfolio/cp-ram-ladkrabang.jpg" alt="ซีพีแรม ลาดกระบัง" class="w-full h-full object-cover" loading="lazy" />
+          </div>
+          <div class="p-4">
+            <h3 class="font-semibold text-primary-700 group-hover:text-primary-600">ซีพีแรม ลาดกระบัง (CP Ram Ladkrabang)</h3>
+            <p class="text-sm text-neutral-500 mt-1">ติดตั้งระบบท่อ</p>
+          </div>
+        </div>
+
+        <!-- Project 9 - Begrim -->
+        <div class="group bg-neutral-50 rounded-xl overflow-hidden border border-neutral-200 hover:shadow-xl transition-all">
+          <div class="aspect-video img-hover bg-neutral-200">
+            <img src="/images/portfolio/begrim.jpg" alt="บริษัท บีกริม" class="w-full h-full object-cover" loading="lazy" />
+          </div>
+          <div class="p-4">
+            <h3 class="font-semibold text-primary-700 group-hover:text-primary-600">บริษัท บีกริม (Begrim Co., Ltd.)</h3>
+            <p class="text-sm text-neutral-500 mt-1">ติดตั้งระบบท่อ</p>
+          </div>
+        </div>
+
+        <!-- Project 11 - Eminent Air Factory -->
+        <div class="group bg-neutral-50 rounded-xl overflow-hidden border border-neutral-200 hover:shadow-xl transition-all">
+          <div class="aspect-video img-hover bg-neutral-200">
+            <img src="/images/portfolio/eminent-air-factory.jpg" alt="Eminent Air Factory" class="w-full h-full object-cover" loading="lazy" />
+          </div>
+          <div class="p-4">
+            <h3 class="font-semibold text-primary-700 group-hover:text-primary-600">Eminent Air Factory</h3>
+            <p class="text-sm text-neutral-500 mt-1">ติดตั้งระบบท่อ</p>
+          </div>
+        </div>
+
+        <!-- Project 12 - Thai Nam Tip -->
+        <div class="group bg-neutral-50 rounded-xl overflow-hidden border border-neutral-200 hover:shadow-xl transition-all">
+          <div class="aspect-video img-hover bg-neutral-200">
+            <img src="/images/portfolio/thai-nam-tip.jpg" alt="ไทยน้ำทิพย์" class="w-full h-full object-cover" loading="lazy" />
+          </div>
+          <div class="p-4">
+            <h3 class="font-semibold text-primary-700 group-hover:text-primary-600">ไทยน้ำทิพย์ (Thai Nam Tip)</h3>
+            <p class="text-sm text-neutral-500 mt-1">ติดตั้งระบบท่อ</p>
+          </div>
+        </div>
+
+        <!-- Project 13 - Essilor Factory -->
+        <div class="group bg-neutral-50 rounded-xl overflow-hidden border border-neutral-200 hover:shadow-xl transition-all">
+          <div class="aspect-video img-hover bg-neutral-200">
+            <img src="/images/portfolio/essilor-factory.jpg" alt="Essilor Factory" class="w-full h-full object-cover" loading="lazy" />
+          </div>
+          <div class="p-4">
+            <h3 class="font-semibold text-primary-700 group-hover:text-primary-600">Essilor Factory</h3>
+            <p class="text-sm text-neutral-500 mt-1">ติดตั้งระบบท่อ</p>
+          </div>
+        </div>
+
+        <!-- Project 15 - Pracharat Project -->
+        <div class="group bg-neutral-50 rounded-xl overflow-hidden border border-neutral-200 hover:shadow-xl transition-all">
+          <div class="aspect-video img-hover bg-neutral-200">
+            <img src="/images/portfolio/pracharat-project.jpg" alt="โครงการประชารัฐ" class="w-full h-full object-cover" loading="lazy" />
+          </div>
+          <div class="p-4">
+            <h3 class="font-semibold text-primary-700 group-hover:text-primary-600">โครงการประชารัฐ (Pracharat Project)</h3>
+            <p class="text-sm text-neutral-500 mt-1">ติดตั้งระบบท่อ</p>
+          </div>
+        </div>
+
+      </div>
+    </div>
+  </section>
+
+  <!-- CTA -->
+  <section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white">
+    <div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
+      <h2 class="text-3xl font-bold mb-6">ต้องการให้เราดูแลโครงการของคุณ?</h2>
+      <p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ @JPPSELECTION</p>
+      <div class="flex flex-wrap justify-center gap-4">
+        <a href="/contact-us" class="bg-white text-primary-700 py-3 px-8 rounded-xl font-semibold hover:bg-primary-50 transition-colors">ติดต่อเรา</a>
+        <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-8 rounded-xl font-semibold transition-colors">แอดไลน์</a>
+      </div>
+    </div>
+  </section>
+</BaseLayout>
--- a/src/pages/privacy-policy.astro
+++ b/src/pages/privacy-policy.astro
@@ -0,0 +1,113 @@
+---
+import BaseLayout from '@/layouts/BaseLayout.astro';
+import { marked } from 'marked';
+
+const privacyContent = `# นโยบายความเป็นส่วนตัว
+
+**บริษัท ดีล พลัส เทค จำกัด** ("บริษัทฯ") ให้ความสำคัญกับการคุ้มครองข้อมูลส่วนบุคคลของท่าน จึงได้จัดทำนโยบายความเป็นส่วนตัวฉบับนี้ขึ้นเพื่อชี้แจงเกี่ยวกับการเก็บรวบรวม ใช้ หรือเปิดเผยข้อมูลส่วนบุคคล รวมถึงสิทธิต่างๆ ของท่านตามพระราชบัญญัติคุ้มครองข้อมูลส่วนบุคคล พ.ศ. 2562
+
+## 1. ข้อมูลส่วนบุคคลที่เราเก็บรวบรวม
+
+ข้อมูลส่วนบุคคลที่บริษัทฯ อาจเก็บรวบรวมจากท่าน อาจรวมถึง:
+
+- **ข้อมูลส่วนบุคคลทั่วไป:** ชื่อ-นามสกุล ที่อยู่อีเมล หมายเลขโทรศัพท์ ที่อยู่ไปรษณีย์ วันเดือนปีเกิด
+- **ข้อมูลการติดต่อ:** ข้อมูลการติดต่อที่ท่านให้ไว้เมื่อลงทะเบียน กรอกแบบฟอร์ม หรือติดต่อบริษัทฯ
+- **ข้อมูลการใช้งาน:** IP address, ข้อมูลการเข้าชมเว็บไซต์, คุกกี้, ข้อมูลกิจกรรมการใช้งาน
+- **ข้อมูลการเงิน:** ข้อมูลบัตรเครดิต/เดบิต ข้อมูลการชำระเงิน (กรณีใช้บริการที่มีค่าใช้จ่าย)
+- **ข้อมูลอื่นที่ท่านให้ไว้:** ข้อมูลใดๆ ที่ท่านให้ไว้โดยสมัครใจผ่านช่องทางการติดต่อของบริษัทฯ
+
+## 2. วัตถุประสงค์ในการเก็บรวบรวมข้อมูล
+
+บริษัทฯ เก็บรวบรวมข้อมูลส่วนบุคคลเพื่อวัตถุประสงค์ดังต่อไปนี้:
+
+- เพื่อให้บริการและดำเนินการตามคำขอของท่าน
+- เพื่อการสื่อสารและให้ข้อมูลข่าวสารเกี่ยวกับบริการของบริษัทฯ
+- เพื่อปรับปรุงคุณภาพบริการและพัฒนาเว็บไซต์
+- เพื่อการวิเคราะห์ข้อมูลและสถิติการใช้งาน
+- เพื่อการตลาดและการโฆษณา (ได้รับความยินยอมจากท่าน)
+- เพื่อการปฏิบัติตามกฎหมาย คำสั่ง หรือกระบวนการทางกฎหมาย
+- เพื่อการรักษาความปลอดภัยและป้องกันการทุจริต
+
+## 3. การใช้และเปิดเผยข้อมูลส่วนบุคคล
+
+บริษัทฯ จะไม่เปิดเผยข้อมูลส่วนบุคคลของท่านต่อบุคคลที่สาม เว้นแต่:
+
+- ได้รับความยินยอมจากท่าน
+- จำเป็นต้องเปิดเผยเพื่อให้บริการตามคำขอของท่าน
+- จำเป็นต้องเปิดเผยต่อผู้ให้บริการที่บริษัทฯ ว่าจ้างให้ดำเนินการในส่วนที่จำเป็น
+- กฎหมายกำหนดหรือร้องขอให้เปิดเผย
+- เพื่อป้องกันหรือระงับอันตรายต่อชีวิต สุขภาพ หรือทรัพย์สิน
+- จำเป็นเพื่อประโยชน์โดยชอบด้วยกฎหมายของบริษัทฯ
+
+## 4. ระยะเวลาการเก็บรักษาข้อมูล
+
+บริษัทฯ จะเก็บรักษาข้อมูลส่วนบุคคลของท่านตราบเท่าที่จำเป็นเพื่อบรรลุวัตถุประสงค์ที่ระบุไว้ในนโยบายนี้ เว้นแต่กฎหมายกำหนดให้เก็บรักษาไว้นานกว่านั้น
+
+ท่านสามารถขอให้บริษัทฯ ลบหรือทำลายข้อมูลส่วนบุคคลของท่านได้ตามสิทธิ์ของท่านในข้อ 7
+
+## 5. การคุ้มครองข้อมูลส่วนบุคคล
+
+บริษัทฯ มีมาตรการรักษาความปลอดภัยที่เหมาะสมเพื่อป้องกันการสูญหาย เข้าถึง ใช้ เปลี่ยนแปลง แก้ไข หรือเปิดเผยข้อมูลส่วนบุคคลโดยไม่ได้รับอนุญาต รวมถึงมาตรการทางเทคนิคและองค์กรที่จำเป็น
+
+## 6. การใช้คุกกี้
+
+เว็บไซต์ของบริษัทฯ อาจใช้คุกกี้และเทคโนโลยีที่คล้ายคลึงกันเพื่อ:
+
+- จดจำการตั้งค่าของท่าน
+- วิเคราะห์การใช้งานเว็บไซต์
+- ปรับปรุงประสบการณ์การใช้งาน
+- แสดงเนื้อหาและโฆษณาที่ท่านสนใจ
+
+ท่านสามารถตั้งค่าเบราว์เซอร์ของท่านเพื่อปฏิเสธคุกกี้บางประเภทหรือทั้งหมดได้ แต่การปฏิเสธคุกกี้อาจส่งผลต่อการทำงานของเว็บไซต์
+
+## 7. สิทธิของเจ้าของข้อมูล
+
+ตามพระราชบัญญัติคุ้มครองข้อมูลส่วนบุคคล ท่านมีสิทธิดังต่อไปนี้:
+
+**7.1 สิทธิในการเข้าถึง** - ท่านมีสิทธิขอเข้าถึงและขอรับสำเนาข้อมูลส่วนบุคคลของท่านที่บริษัทฯ มีอยู่
+
+**7.2 สิทธิในการแก้ไข** - ท่านมีสิทธิขอให้บริษัทฯ แก้ไขข้อมูลส่วนบุคคลที่ไม่ถูกต้องหรือไม่สมบูรณ์
+
+**7.3 สิทธิในการลบ** - ท่านมีสิทธิขอให้บริษัทฯ ลบข้อมูลส่วนบุคคลของท่าน ในกรณีที่ข้อมูลนั้นไม่จำเป็นต้องเก็บรักษาไว้ต่อไป
+
+**7.4 สิทธิในการระงับการใช้** - ท่านมีสิทธิขอให้บริษัทฯ ระงับการใช้ข้อมูลส่วนบุคคลของท่านในบางกรณี
+
+**7.5 สิทธิในการคัดค้าน** - ท่านมีสิทธิคัดค้านการเก็บรวบรวม ใช้ หรือเปิดเผยข้อมูลส่วนบุคคลของท่าน
+
+**7.6 สิทธิในการโอนย้าย** - ท่านมีสิทธิขอรับข้อมูลส่วนบุคคลในรูปแบบที่สามารถอ่านได้ด้วยเครื่องมือหรืออุปกรณ์อัตโนมัติ และขอส่งหรือโอนข้อมูลนั้นไปยังระบบอื่น
+
+**7.7 สิทธิในการถอนความยินยอม** - ท่านมีสิทธิถอนความยินยอมที่ท่านได้ให้ไว้แก่บริษัทฯ ได้ตลอดเวลา
+
+**7.8 สิทธิในการร้องเรียน** - ท่านมีสิทธิร้องเรียนต่อหน่วยงานกำกับดูแล (สำนักงานคณะกรรมการคุ้มครองข้อมูลส่วนบุคคล) หากบริษัทฯ ละเมิดหรือไม่ปฏิบัติตามพระราชบัญญัติคุ้มครองข้อมูลส่วนบุคคล
+
+## 8. การติดต่อบริษัทฯ
+
+หากท่านมีคำถาม ข้อสงสัย หรือต้องการใช้สิทธิใดๆ ตามนโยบายนี้ กรุณาติดต่อบริษัทฯ:
+
+**บริษัท ดีล พลัส เทค จำกัด**
+**ที่อยู่:** 9/70 ซอยนครลุง 17 แขวงบางไผ่ เขตบางแค กรุงเทพมหานคร 10160
+**โทรศัพท์:** 090-555-1415
+**อีเมล:** dealplustech@gmail.com
+
+## 9. การเปลี่ยนแปลงนโยบาย
+
+บริษัทฯ อาจปรับปรุงหรือเปลี่ยนแปลงนโยบายความเป็นส่วนตัวนี้เป็นครั้งคราว การเปลี่ยนแปลงจะมีผลเมื่อประกาศบนเว็บไซต์ ท่านควรตรวจสอบนโยบายนี้เป็นระยะเพื่อรับทราบการเปลี่ยนแปลง
+
+**วันที่มีผลบังคับใช้:** 6 พฤษภาคม 2569
+
+---
+
+*นโยบายความเป็นส่วนตัวฉบับนี้จัดทำขึ้นตามพระราชบัญญัติคุ้มครองข้อมูลส่วนบุคคล พ.ศ. 2562*`;
+
+const privacyHtml = marked.parse(privacyContent);
+---
+
+<BaseLayout title="นโยบายความเป็นส่วนตัว - ดีล พลัส เทค" description="นโยบายความเป็นส่วนตัวของ บริษัท ดีล พลัส เทค จำกัด ตามพระราชบัญญัติคุ้มครองข้อมูลส่วนบุคคล พ.ศ. 2562">
+  <section class="py-16 lg:py-24 bg-white">
+    <div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8">
+      <h1 class="text-3xl lg:text-4xl font-bold text-primary-700 mb-8 text-center">นโยบายความเป็นส่วนตัว</h1>
+
+      <div class="prose prose-lg max-w-none prose-headings:text-primary-700 prose-headings:font-semibold prose-a:text-primary-600 prose-strong:text-primary-700" set:html={privacyHtml} />
+    </div>
+  </section>
+</BaseLayout>
--- a/src/pages/realflex.astro
+++ b/src/pages/realflex.astro
@@ -0,0 +1,204 @@
+---
+import BaseLayout from '@/layouts/BaseLayout.astro';
+import Header from '@/components/common/Header.astro';
+import Footer from '@/components/common/Footer.astro';
+import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
+---
+
+<script type="application/ld+json">
+{
+  "@context": "https://schema.org",
+  "@type": "Product",
+  "name": "Realflex | สายอ่อนสแตนเลส",
+  "description": "จำหน่ายRealflex สายอ่อนสแตนเลสคุณภาพสูง ราคาโรงงาน ส่งฟรี กทม. ปริมณฑล",
+  "image": "https://dealplustech.co.th/images/products-cropped/realflex_000C.jpg",
+  "offers": {
+    "@type": "Offer",
+    "url": "https://dealplustech.co.th/realflex",
+    "priceCurrency": "THB",
+    "availability": "https://schema.org/InStock"
+  }
+}
+</script>
+
+<BaseLayout title="Realflex | สายอ่อนสแตนเลส" description="จำหน่ายRealflex สายอ่อนสแตนเลสคุณภาพสูง ราคาโรงงาน ส่งฟรี กทม. ปริมณฑล">
+  <Header slot="header" />
+
+  <main class="bg-white min-h-screen pb-24 md:pb-0">
+    <!-- Hero Section -->
+    <section class="bg-gradient-to-br from-primary-700 to-primary-600 text-white py-12">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <nav class="text-sm mb-4 text-primary-100">
+          <a href="/" class="hover:text-white">หน้าแรก</a> / <a href="/all-products" class="hover:text-white">สินค้าทั้งหมด</a> / <span class="text-white">Realflex</span>
+        </nav>
+        <div class="grid lg:grid-cols-2 gap-8 items-center">
+          <div class="img-hover rounded-2xl overflow-hidden bg-white/10">
+            <img src="/images/products-cropped/realflex_000C.jpg" alt="Realflex" class="w-full" loading="eager" />
+          </div>
+          <div>
+            <span class="text-sm text-primary-200 font-medium">สายอ่อนสแตนเลส</span>
+            <h1 class="text-3xl lg:text-4xl font-bold mt-2 mb-4">Realflex | สายอ่อนสแตนเลส</h1>
+            <p class="text-primary-100 text-lg mb-6">Stainless Steel Flexible Hose Fitting สำหรับระบบดับเพลิงอัตโนมัติ</p>
+            <div class="flex flex-wrap gap-4 mb-8">
+              <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" class="bg-white/10 hover:bg-white/20 text-white py-3 px-6 rounded-xl font-semibold border border-white/30 flex items-center gap-2">
+                <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"><path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/></svg>
+                แชท
+              </a>
+              <a href="tel:0905551415" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-6 rounded-xl font-semibold flex items-center gap-2">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z"/>
+                </svg>
+                090-555-1415
+              </a>
+            </div>
+            <div class="flex flex-wrap gap-4 text-primary-100 text-sm">
+              <div class="flex items-center gap-1">
+                <svg class="w-5 h-5 text-accent-500" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" /></svg>
+                <span>ทนแรงดัน 14 bar</span>
+              </div>
+              <div class="flex items-center gap-1">
+                <svg class="w-5 h-5 text-accent-500" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" /></svg>
+                <span>มาตรฐาน NFPA13</span>
+              </div>
+              <div class="flex items-center gap-1">
+                <svg class="w-5 h-5 text-accent-500" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" /></svg>
+                <span>ผ่าน UL 2443</span>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Product Details -->
+    <section class="py-16 px-4">
+      <div class="max-w-7xl mx-auto">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl font-bold text-neutral-900 mb-8">รายละเอียดสินค้า</h2>
+
+          <div class="mb-8">
+            <img src="/images/realflex/realflex-001.png" alt="Realflex" class="max-w-md w-full h-auto rounded-xl shadow-md" loading="lazy" />
+          </div>
+
+          <p class="text-lg text-neutral-700 leading-relaxed mb-6">
+            <strong>Realflex®</strong> สายอ่อนสแตนเลส ผลิตโดยบริษัท Realflex Pipetec Co Ltd นำเสนอโซลูชันที่เป็นเอกลักษณ์สำหรับอุตสาหกรณ์ดับเพลิงแบบสเปร์เกลอร์ สาย Realflex® ผลิตจากสแตนเลส AISI Grade 304 ที่ทนต่อการกัดกร่อน มีความยืดหยุ่นสูง พร้อมน็อตหกเหลี่ยมสองตัวและโอริงซีลคุณภาพสูง ทดสอบแรงดันแตกที่ 70 bar/875 psi ที่อุณหภูมิห้อง
+          </p>
+
+          <p class="text-lg text-neutral-700 leading-relaxed mb-6">
+            เพื่อความสะดวกในการติดตั้ง ชุดสาย Realflex® มาพร้อมระบบแบร็คเก็ตโลหะชุบสังกะสีน้ำหนักเบาออกแบบพิเศษ ทำให้การติดตั้งรวดเร็ว ปลอดภัย และคุ้มค่าสำหรับทุกโครงการ
+          </p>
+
+          <h3 class="text-xl font-bold text-neutral-900 mt-8 mb-4">คุณสมบัติเด่น</h3>
+
+          <div class="grid md:grid-cols-2 gap-6 mb-8">
+            <div class="bg-neutral-50 p-6 rounded-xl">
+              <h4 class="text-lg font-bold text-neutral-900 mb-3">ปลอดภัยและน่าเชื่อถือ</h4>
+              <p class="text-neutral-700 text-sm">สายอ่อน Realflex® ผลิตจากสแตนเลส AISI 304 ทนต่อการกัดกร่อนพร้อมข้อต่อและซีลคุณภาพสูง สายทุกเส้นผ่านการทดสอบการรั่วซึม 100% ก่อนออกจากโรงงาน แรงดันใช้งาน 14bar/200psi ทดสอบแรงดันแตกที่ 70bar/875psi</p>
+            </div>
+            <div class="bg-neutral-50 p-6 rounded-xl">
+              <h4 class="text-lg font-bold text-neutral-900 mb-3">ติดตั้งง่าย</h4>
+              <p class="text-neutral-700 text-sm">ไม่ต้องใช้เครื่องมือพิเศษ ไม่ต้องตัด ไม่ต้องเกลียว เพียงใช้ประแจ ขวาน และเทปซีลท่อ ก็สามารถติดตั้งได้อย่างรวดเร็ว</p>
+            </div>
+            <div class="bg-neutral-50 p-6 rounded-xl">
+              <h4 class="text-lg font-bold text-neutral-900 mb-3">ประหยัดค่าใช้จ่าย</h4>
+              <p class="text-neutral-700 text-sm">การออกแบบสายอ่อน Realflex® ที่เป็นเอกลักษณ์ช่วยประหยัดค่าใช้จ่ายด้านเวลาเมื่อเทียบกับระบบท่อแข็งแบบดั้งเดิม ลดเวลาการติดตั้งอย่างมีนัยสำคัญ</p>
+            </div>
+            <div class="bg-neutral-50 p-6 rounded-xl">
+              <h4 class="text-lg font-bold text-neutral-900 mb-3">เป็นมิตรกับสิ่งแวดล้อม</h4>
+              <p class="text-neutral-700 text-sm">ไม่มีของเสีย ไม่ต้องตัด สายอ่อนสามารถปรับรูปร่างและย้ายตำแหน่งให้เหมาะกับตำแหน่งสเปร์เกลอร์บนเพดานได้โดยไม่ต้องระบายน้ำออกจากระบบ</p>
+            </div>
+          </div>
+
+          <h3 class="text-xl font-bold text-neutral-900 mt-8 mb-4">ทำไมต้องเลือก Realflex?</h3>
+          <ul class="list-disc pl-6 space-y-3 text-lg text-neutral-700 mb-6">
+            <li>Realflex® ให้ความยาวเพิ่มอีก 25% สำหรับท่อปล่อย (สูงสุด 140 มม.) และความสูงเพิ่มอีก 50% สำหรับแบร็คเก็ตด้านข้าง (102 มม.)</li>
+            <li>ท่อปล่อยที่มีร่องเก็บและการออกแบบแบร็คเก็ตด้านข้างที่เป็นเอกลักษณ์ ทำงานกับระบบเพดาน T-bar และโครงไม้หรือโลหะทุกรูปแบบ</li>
+            <li>สกรูและโบลท์ยึดทุกตัวมีหัวปีก ช่วยเพิ่มความเร็วในการติดตั้ง</li>
+            <li>บาร์สี่เหลี่ยมรองรับที่หนากว่าคู่แข่ง 50% ด้วยความหนา 1.20 มม. ให้ความแข็งแรงและความเสถียรที่ดีกว่า</li>
+          </ul>
+
+          <h3 class="text-xl font-bold text-neutral-900 mt-8 mb-4">มาตรฐานที่ได้รับ</h3>
+          <div class="flex flex-wrap gap-3 mb-8">
+            <span class="px-4 py-2 bg-neutral-100 rounded-full text-sm font-medium text-neutral-700">NFPA 13</span>
+            <span class="px-4 py-2 bg-neutral-100 rounded-full text-sm font-medium text-neutral-700">NFPA 13D</span>
+            <span class="px-4 py-2 bg-neutral-100 rounded-full text-sm font-medium text-neutral-700">NFPA 13R</span>
+            <span class="px-4 py-2 bg-neutral-100 rounded-full text-sm font-medium text-neutral-700">EN 12845</span>
+            <span class="px-4 py-2 bg-neutral-100 rounded-full text-sm font-medium text-neutral-700">UL 2443</span>
+            <span class="px-4 py-2 bg-neutral-100 rounded-full text-sm font-medium text-neutral-700">FM 1637</span>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Application Section -->
+    <section class="py-16 px-4 bg-neutral-50">
+      <div class="max-w-7xl mx-auto">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl font-bold text-neutral-900 mb-8 text-center">การประยุกต์ใช้งานในอุตสาหกรรม</h2>
+
+          <div class="space-y-6">
+            <div class="bg-white p-6 rounded-xl">
+              <h3 class="text-lg font-bold text-neutral-900 mb-2">ระบบดับเพลิงอัตโนมัติ (Sprinkler System)</h3>
+              <p class="text-neutral-700">เชื่อมต่อระหว่างท่อน้ำประปาหลักและหัวสเปร์เกลอร์ ใช้ในอาคารทุกประเภทที่ต้องการระบบดับเพลิงอัตโนมัติ</p>
+            </div>
+            <div class="bg-white p-6 rounded-xl">
+              <h3 class="text-lg font-bold text-neutral-900 mb-2">อาคารพาณิชย์</h3>
+              <p class="text-neutral-700">ห้างสรรพสินค้า โรงแรม อาคารสำนักงาน โรงพยาบาล โรงเรียน ศูนย์การค้า และอาคารที่พักอาศัยขนาดใหญ่</p>
+            </div>
+            <div class="bg-white p-6 rounded-xl">
+              <h3 class="text-lg font-bold text-neutral-900 mb-2">โรงงานอุตสาหกรรมพิเศษ</h3>
+              <p class="text-neutral-700">โรงงานผลิตอิเล็กทรอนิกส์ เซมิคอนดักเตอร์ อุตสาหกรรมเคมีบริสุทธิ์ นิวเคลียร์ อาหารและเครื่องดื่ม ยา และห้องปฏิบัติการชีววิทยา</p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- FAQ Section -->
+    <section class="py-16 px-4">
+      <div class="max-w-7xl mx-auto">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl font-bold text-neutral-900 mb-8 text-center">คำถามที่พบบ่อย</h2>
+          <div class="space-y-4">
+            <div class="bg-neutral-50 rounded-xl p-4">
+              <h3 class="font-semibold text-neutral-900 mb-2">1. Realflex® ทนแรงดันได้เท่าไหร่?</h3>
+              <p class="text-neutral-700">สายอ่อน Realflex® มีแรงดันใช้งานที่ 14 bar (200 psi) และทดสอบแรงดันแตกที่ 70 bar (875 psi) ที่อุณหภูมิห้อง ทนอุณหภูมิสิ่งแวดล้อมได้ถึง 107°C (225°F)</p>
+            </div>
+            <div class="bg-neutral-50 rounded-xl p-4">
+              <h3 class="font-semibold text-neutral-900 mb-2">2. ติดตั้ง Realflex® ยากไหม?</h3>
+              <p class="text-neutral-700">การติดตั้ง Realflex® ง่ายและรวดเร็ว ไม่ต้องใช้เครื่องมือพิเศษ ไม่ต้องตัด ไม่ต้องเกลียว เพียงใช้ประแจ ขวาน และเทปซีลท่อ สามารถติดตั้งได้ทันที</p>
+            </div>
+            <div class="bg-neutral-50 rounded-xl p-4">
+              <h3 class="font-semibold text-neutral-900 mb-2">3. Realflex® เหมาะกับอาคารประเภทใด?</h3>
+              <p class="text-neutral-700">เหมาะสำหรับอาคารทุกประเภทที่ติดตั้งระบบสเปร์เกลอร์ รวมถึงอาคารพาณิชย์ โรงงานอุตสาหกรรม โรงพยาบาล ห้างสรรพสินค้า และโรงแรม</p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Contact CTA -->
+    <section class="py-16 px-4 bg-gradient-to-br from-primary-700 to-primary-600 text-white text-center">
+      <div class="max-w-4xl mx-auto">
+        <h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2>
+        <p class="text-lg text-primary-100 mb-8">ติดต่อ 090-555-1415 หรือแอดไลน์ @JPPSELECTION</p>
+        <div class="flex flex-wrap justify-center gap-4">
+          <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" class="bg-white text-primary-700 py-3 px-8 rounded-xl font-semibold hover:bg-primary-50 flex items-center gap-2">
+            <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"><path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/></svg>
+            แชท
+          </a>
+          <a href="tel:0905551415" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-8 rounded-xl font-semibold flex items-center gap-2">
+            <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z"/>
+            </svg>
+            090-555-1415
+          </a>
+        </div>
+      </div>
+    </section>
+  </main>
+
+  <Footer slot="footer" />
+
+  <StickyBottomCTA phone="0905551415" lineUrl="https://line.me/ti/p/~JPPSELECTION" slot="after-footer" />
+</BaseLayout>
--- a/src/pages/terms-and-conditions.astro
+++ b/src/pages/terms-and-conditions.astro
@@ -0,0 +1,78 @@
+---
+import BaseLayout from '@/layouts/BaseLayout.astro';
+import { marked } from 'marked';
+
+const termsContent = `# ข้อกำหนดการใช้งาน
+
+**ชื่อเว็บไซต์:** ดีล พลัส เทค
+**เว็บไซต์:** https://dealplustech.com
+**มีผลบังคับใช้วันที่:** 6 พฤษภาคม 2569
+**แก้ไขล่าสุด:** 6 พฤษภาคม 2569
+
+## 1. การยอมรับเงื่อนไข
+
+ด้วยการเข้าถึงและใช้งานเว็บไซต์ https://dealplustech.com ("เว็บไซต์") ของบริษัท ดีล พลัส เทค จำกัด ("บริษัท") ท่านยอมรับและตกลงที่จะถูกผูกมัดด้วยข้อกำหนดการใช้งานฉบับนี้
+
+## 2. บริการของเรา
+
+ดีล พลัส เทค ให้บริการ:
+
+1. **สินค้าระบบน้ำ** - ท่อ PPR ท่อ HDPE อุปกรณ์วาล์ว
+2. **อุปกรณ์ปรับอากาศ** - กริลแอร์ หัวจ่ายแอร์
+3. **ระบบรั้ว** - รั้วเทวดา ระบบรั้วไวน์แมน
+
+## 3. ราคาและการชำระเงิน
+
+- ราคาทั้งหมดแสดงเป็นเงินบาทไทย (THB)
+- ราคานี้รวม VAT 7%
+- การชำระเงินผ่านโอนเงินธนาคารหรือชำระเงินสด
+
+## 4. การจัดส่งสินค้า
+
+- สินค้าพร้อมจัดส่ง จัดส่งภายใน 1-3 วันทำการ
+- ฟรีค่าจัดส่งสำหรับยอดคำสั่งซื้อขั้นต่ำตามที่กำหนด
+- สินค้าทุกชิ้นผ่านการตรวจสอบคุณภาพก่อนจัดส่ง
+
+## 5. นโยบายการคืนสินค้า
+
+- ผู้ใช้สามารถขอคืนสินค้าได้ภายใน 7 วันนับจากวันที่รับสินค้า
+- สินค้าต้องอยู่ในสภาพเดิม ไม่มีร่องรอยการใช้งาน
+- การคืนเงินจะดำเนินการภายใน 3 วันทำการ
+
+## 6. การรับประกัน
+
+- สินค้าทุกชิ้นมีการรับประกันตามเงื่อนไขของผู้ผลิต
+- การรับประกันไม่รวมกรณีใช้งานผิดวิธีหรือเก็บรักษาไม่ถูกต้อง
+
+## 7. ข้อจำกัดความรับผิด
+
+ความรับผิดรวมของเราจะไม่เกิน 100,000 บาท
+
+## 8. กฎหมายที่ใช้บังคับ
+
+ข้อกำหนดนี้ถูกควบคุมและตีความตามกฎหมายแห่งราชอาณาจักรไทย ศาลแพ่ง/ศาลล้มละลายกลาง กรุงเทพมหานคร
+
+## 9. การติดต่อ
+
+หากท่านมีคำถามเกี่ยวกับข้อกำหนดการใช้งาน:
+
+**อีเมล:** dealplustech@gmail.com
+**โทรศัพท์:** 090-555-1415
+**ที่อยู่:** 9/70 ซอยนครลุง 17 แขวงบางไผ่ เขตบางแค กรุงเทพมหานคร 10160
+
+---
+
+*ข้อกำหนดการใช้งานมีผลบังคับใช้วันที่ 6 พฤษภาคม 2569*`;
+
+const termsHtml = marked.parse(termsContent);
+---
+
+<BaseLayout title="ข้อกำหนดการใช้งาน - ดีล พลัส เทค" description="ข้อกำหนดการใช้งานเว็บไซต์ ดีล พลัส เทค จำกัด">
+  <section class="py-16 lg:py-24 bg-white">
+    <div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8">
+      <h1 class="text-3xl lg:text-4xl font-bold text-primary-700 mb-8 text-center">ข้อกำหนดการใช้งาน</h1>
+
+      <div class="prose prose-lg max-w-none prose-headings:text-primary-700 prose-headings:font-semibold prose-a:text-primary-600" set:html={termsHtml} />
+    </div>
+  </section>
+</BaseLayout>
--- a/src/pages/water-pump.astro
+++ b/src/pages/water-pump.astro
@@ -0,0 +1,313 @@
+---
+import BaseLayout from '@/layouts/BaseLayout.astro';
+---
+
+<BaseLayout title="ปั๊มน้ำ (Water Pump)" description="จำหน่ายปั๊มน้ำ (Water Pump) คุณภาพสูง ราคาโรงงาน ส่งฟรี กทม. ปริมณฑล">
+  <main class="bg-white min-h-screen">
+    <!-- Product Hero Section -->
+    <section class="bg-gradient-to-br from-primary-700 to-primary-600 text-white py-16">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="grid lg:grid-cols-2 gap-12 items-center">
+          <div class="order-2 lg:order-1">
+            <div class="rounded-2xl overflow-hidden">
+              <img src="/images/products-cropped/water-pump_000C.jpg" alt="ปั๊มน้ำ (Water Pump)" class="w-full h-auto rounded-xl" width="600" height="400" loading="eager" />
+            </div>
+          </div>
+          <div class="order-1 lg:order-2">
+            <span class="inline-block px-4 py-1.5 bg-white/20 text-white rounded-full text-sm font-medium mb-4">ปั๊มน้ำ</span>
+            <h1 class="text-3xl sm:text-4xl lg:text-5xl font-bold mb-4">ปั๊มน้ำ (Water Pump)</h1>
+            <p class="text-lg sm:text-xl text-white/80 mb-8 leading-relaxed">
+              จำหน่ายปั๊มน้ำ (Water Pump) คุณภาพสูง ราคาโรงงาน ส่งฟรี กรุงเทพมหานคร และปริมณฑล
+            </p>
+            <div class="flex flex-wrap gap-4 mb-8">
+              <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" class="flex items-center gap-2 bg-white text-primary-700 px-6 py-3 rounded-xl font-semibold hover:bg-primary-50 transition-colors">
+                <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"><path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/></svg>
+                แชท
+              </a>
+              <a href="tel:0905551415" class="flex items-center gap-2 bg-white/10 hover:bg-white/20 text-white px-6 py-3 rounded-xl font-semibold border border-white/30 transition-colors">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z"/>
+                </svg>
+                090-555-1415
+              </a>
+            </div>
+            <div class="flex flex-wrap gap-6">
+              <div class="flex items-center gap-2 text-white/80">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span>คุณภาพสูง มาตรฐานอุตสาหกรรม</span>
+              </div>
+              <div class="flex items-center gap-2 text-white/80">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span>ราคาโรงงาน คุ้มค่า</span>
+              </div>
+              <div class="flex items-center gap-2 text-white/80">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span>จัดส่งรวดเร็ว ส่งฟรี กทม. ปริมณฑล</span>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Product Details -->
+    <section class="py-16 bg-white">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-xl font-bold text-primary-700 mb-8">รายละเอียดสินค้า</h2>
+          <div class="flex justify-center">
+            <img src="/images/water-pump-banner.jpg" alt="ปั๊มน้ำ" class="max-w-md w-full rounded-lg shadow-md mb-8" width="400" height="300" loading="lazy" />
+          </div>
+          <div class="prose prose-lg max-w-none">
+            <p class="text-lg text-neutral-700 leading-relaxed mb-4">จำหน่ายปั๊มน้ำทุกประเภท สำหรับบ้านพักอาศัย อาคาร และโรงงานอุตสาหกรรม จากแบรนด์ชั้นนำ</p>
+            <p class="text-lg text-neutral-700 leading-relaxed mb-4"><strong>ประเภทปั๊มน้ำ:</strong></p>
+            <ul class="list-disc pl-6 mb-6 space-y-2 text-neutral-700">
+              <li><strong>ปั๊มน้ำอัตโนมัติ:</strong> สำหรับบ้านพักอาศัย</li>
+              <li><strong>ปั๊มน้ำหอยโข่ง:</strong> สำหรับระบบน้ำในอาคาร</li>
+              <li><strong>ปั๊มน้ำจุ่ม:</strong> สำหรับระบายน้ำท่วม</li>
+              <li><strong>ปั๊มน้ำแรงดันสูง:</strong> สำหรับระบบดับเพลิง</li>
+              <li><strong>ปั๊มเคมี:</strong> สำหรับส่งสารเคมี</li>
+            </ul>
+            <p class="text-lg text-neutral-700 leading-relaxed mb-4"><strong>การใช้งาน:</strong></p>
+            <ul class="list-disc pl-6 mb-6 space-y-2 text-neutral-700">
+              <li>บ้านพักอาศัย</li>
+              <li>อาคารสูง</li>
+              <li>โรงงานอุตสาหกรรม</li>
+              <li>ระบบดับเพลิง</li>
+              <li>ระบบชลประทาน</li>
+            </ul>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Pump Types Guide -->
+    <section class="py-16 bg-neutral-50">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl font-bold text-primary-700 mb-8 text-center">ประเภทของปั๊มน้ำ (Pump Types)</h2>
+          <div class="grid md:grid-cols-2 gap-6">
+            <div class="bg-white p-6 rounded-xl shadow-sm">
+              <h3 class="text-lg font-bold text-primary-600 mb-3">ปั๊มน้ำหอยโข่ง (Centrifugal Pump)</h3>
+              <p class="text-neutral-600 text-sm leading-relaxed mb-3">ทำงานโดยใช้แรงหมุนของใบพัดสร้างแรงดันน้ำ เหมาะสำหรับงานจ่ายน้ำในอาคาร บ้านพัก และระบบ sprinklers ใช้งานง่าย ราคาคุ้มค่า</p>
+              <div class="text-xs text-neutral-500">
+                <span class="font-semibold">กำลังไฟ:</span> 0.5-3 HP | <span class="font-semibold">Head:</span> 15-50 m
+              </div>
+            </div>
+            <div class="bg-white p-6 rounded-xl shadow-sm">
+              <h3 class="text-lg font-bold text-primary-600 mb-3">ปั๊มน้ำเจ็ท (Jet Pump)</h3>
+              <p class="text-neutral-600 text-sm leading-relaxed mb-3">ใช้หลักการ Venturi สร้างสุญญากาศดูดน้ำ เหมาะสำหรับบ่อน้ำลึกหรือแหล่งน้ำที่อยู่ต่ำกว่าตัวปั๊ม ติดตั้งภายในอาคารได้</p>
+              <div class="text-xs text-neutral-500">
+                <span class="font-semibold">กำลังไฟ:</span> 0.5-2 HP | <span class="font-semibold">Suction:</span> สูงสุด 9 m
+              </div>
+            </div>
+            <div class="bg-white p-6 rounded-xl shadow-sm">
+              <h3 class="text-lg font-bold text-primary-600 mb-3">ปั๊มน้ำจุ่ม (Submersible Pump)</h3>
+              <p class="text-neutral-600 text-sm leading-relaxed mb-3">ติดตั้งจมอยู่ในน้ำ ดูดน้ำจากด้านล่างขึ้นด้านบน เหมาะสำหรับบ่อบาด บ่อบาดน้ำบาด และระบายน้ำท่วม</p>
+              <div class="text-xs text-neutral-500">
+                <span class="font-semibold">กำลังไฟ:</span> 1-10 HP | <span class="font-semibold">Depth:</span> สูงสุด 50 m
+              </div>
+            </div>
+            <div class="bg-white p-6 rounded-xl shadow-sm">
+              <h3 class="text-lg font-bold text-primary-600 mb-3">ปั๊มน้ำอัตโนมัติ (Automatic Pump)</h3>
+              <p class="text-neutral-600 text-sm leading-relaxed mb-3">มี Pressure Tank และ Pressure Switch ควบคุมการเปิด-ปิดอัตโนมัติ เหมาะสำหรับบ้านพักอาศัยที่ต้องการน้ำประปาอัตโนมัติ</p>
+              <div class="text-xs text-neutral-500">
+                <span class="font-semibold">กำลังไฟ:</span> 0.5-1.5 HP | <span class="font-semibold">Tank:</span> 20-100 L
+              </div>
+            </div>
+            <div class="bg-white p-6 rounded-xl shadow-sm">
+              <h3 class="text-lg font-bold text-primary-600 mb-3">ปั๊มน้ำแรงดันสูง (High Pressure Pump)</h3>
+              <p class="text-neutral-600 text-sm leading-relaxed mb-3">ออกแบบให้สร้างแรงดันน้ำสูง เหมาะสำหรับระบบดับเพลิง ระบบ prismatic และอุตสาหกรรมที่ต้องการแรงดันสูง</p>
+              <div class="text-xs text-neutral-500">
+                <span class="font-semibold">กำลังไฟ:</span> 5-50 HP | <span class="font-semibold">Head:</span> 50-200 m
+              </div>
+            </div>
+            <div class="bg-white p-6 rounded-xl shadow-sm">
+              <h3 class="text-lg font-bold text-primary-600 mb-3">ปั๊มเคมี (Chemical Pump)</h3>
+              <p class="text-neutral-600 text-sm leading-relaxed mb-3">ผลิตจากวัสดุทนการกัดกร่อน (PVC, PP, SS316) เหมาะสำหรับส่งสารเคมีกรด-ด่าง และของเหลวอุตสาหกรรม</p>
+              <div class="text-xs text-neutral-500">
+                <span class="font-semibold">วัสดุ:</span> PVC/PP/SS316 | <span class="font-semibold">Temp:</span> สูงสุด 80°C
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Selection Guide -->
+    <section class="py-16 bg-white">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl font-bold text-primary-700 mb-8 text-center">วิธีเลือกปั๊มน้ำให้เหมาะกับการใช้งาน</h2>
+          <div class="space-y-6">
+            <div class="flex gap-4">
+              <div class="flex-shrink-0 w-12 h-12 bg-primary-100 rounded-full flex items-center justify-center">
+                <span class="text-primary-600 font-bold">1</span>
+              </div>
+              <div>
+                <h3 class="text-lg font-bold text-neutral-800 mb-2">พิจารณาความสูงยก (Head)</h3>
+                <p class="text-neutral-600 text-sm leading-relaxed">ความสูงยก คือระยะทางจากตัวปั๊มถึงจุดที่ต้องการน้ำสูงสุด วัดเป็นเมตร เช่น บ้าน 2 ชั้น สูง 6 เมตร ควรเลือกปั๊มที่มี Head สูงกว่า 15 เมตร เพื่อให้มีแรงดันเพียงพอ</p>
+              </div>
+            </div>
+            <div class="flex gap-4">
+              <div class="flex-shrink-0 w-12 h-12 bg-primary-100 rounded-full flex items-center justify-center">
+                <span class="text-primary-600 font-bold">2</span>
+              </div>
+              <div>
+                <h3 class="text-lg font-bold text-neutral-800 mb-2">คำนวณอัตราการไหล (Flow Rate)</h3>
+                <p class="text-neutral-600 text-sm leading-relaxed">อัตราการไหล คือปริมาณน้ำที่ปั๊มสามารถส่งได้ในหน่วยเวลา วัดเป็นลิตร/นาที (L/min) หรือ ลูกบาศก์เมตร/ชั่วโมง (m³/hr) บ้านพักทั่วไปใช้ 20-50 L/min</p>
+              </div>
+            </div>
+            <div class="flex gap-4">
+              <div class="flex-shrink-0 w-12 h-12 bg-primary-100 rounded-full flex items-center justify-center">
+                <span class="text-primary-600 font-bold">3</span>
+              </div>
+              <div>
+                <h3 class="text-lg font-bold text-neutral-800 mb-2">เลือกตามการใช้งาน</h3>
+                <div class="text-neutral-600 text-sm leading-relaxed">
+                  <ul class="list-disc list-inside space-y-1 mt-2">
+                    <li><strong>บ้านพักอาศัย:</strong> ปั๊มอัตโนมัติ หรือ ปั๊มหอยโข่ง กำลัง 0.5-1 HP</li>
+                    <li><strong>อาคารสูง:</strong> ปั๊มแรงดันสูง กำลัง 3-10 HP พร้อมถังกด</li>
+                    <li><strong>เกษตรกรรม/ชลประทาน:</strong> ปั๊มเจ็ท หรือ ปั๊มจุ่ม กำลัง 3-10 HP</li>
+                    <li><strong>โรงงานอุตสาหกรรม:</strong> ปั๊มเคมี หรือ ปั๊มหอยโข่งคุณภาพสูง</li>
+                    <li><strong>ระบบดับเพลิง:</strong> ปั๊มแรงดันสูง ตามมาตรฐาน มอก.</li>
+                  </ul>
+                </div>
+              </div>
+            </div>
+            <div class="flex gap-4">
+              <div class="flex-shrink-0 w-12 h-12 bg-primary-100 rounded-full flex items-center justify-center">
+                <span class="text-primary-600 font-bold">4</span>
+              </div>
+              <div>
+                <h3 class="text-lg font-bold text-neutral-800 mb-2">ตรวจสอบแหล่งน้ำ</h3>
+                <p class="text-neutral-600 text-sm leading-relaxed">หากดูดจากบ่อน้ำตื้น (ต่ำกว่าตัวปั๊มไม่เกิน 8 เมตร) ใช้ปั๊มหอยโข่งหรือปั๊มอัตโนมัติ หากดูดจากบ่อน้ำลึก (เกิน 8 เมตร) ต้องใช้ปั๊มเจ็ทหรือปั๊มจุ่ม</p>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Installation Tips -->
+    <section class="py-16 bg-neutral-50">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl font-bold text-primary-700 mb-8 text-center">ข้อแนะนำการติดตั้งและบำรุงรักษา</h2>
+          <div class="grid md:grid-cols-3 gap-6">
+            <div class="bg-white p-6 rounded-xl shadow-sm">
+              <div class="w-10 h-10 bg-accent-100 rounded-lg flex items-center justify-center mb-4">
+                <svg class="w-5 h-5 text-accent-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17.657 16.657L13.414 20.9a1.998 1.998 0 01-2.827 0l-4.244-4.243a8 8 0 1111.314 0z" />
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 11a3 3 0 11-6 0 3 3 0 016 0z" />
+                </svg>
+              </div>
+              <h3 class="text-base font-bold text-neutral-800 mb-2">สถานที่ติดตั้ง</h3>
+              <p class="text-neutral-600 text-sm leading-relaxed">ติดตั้งในที่ร่ม อากาศถ่ายเทสะดวก ห่างจากแหล่งความร้อน สูงจากพื้นอย่างน้อย 30 ซม. เพื่อป้องกันน้ำท่วมและฝุ่น</p>
+            </div>
+            <div class="bg-white p-6 rounded-xl shadow-sm">
+              <div class="w-10 h-10 bg-accent-100 rounded-lg flex items-center justify-center mb-4">
+                <svg class="w-5 h-5 text-accent-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19.428 15.428a2 2 0 00-1.022-.547l-2.387-.477a6 6 0 00-3.86.517l-.318.158a6 6 0 01-3.86.517L6.05 15.21a2 2 0 00-1.806.547M8 4h8l-1 1v5.172a2 2 0 00.586 1.414l5 5c1.414 1.414.586 3.414-1.414 3.414H12" />
+                </svg>
+              </div>
+              <h3 class="text-base font-bold text-neutral-800 mb-2">การเติมน้ำ (Priming)</h3>
+              <p class="text-neutral-600 text-sm leading-relaxed">ก่อนเปิดใช้งานครั้งแรก หรือหลังจากน้ำในระบบหมด ต้องเติมน้ำในท่อดูดและตัวปั๊มให้เต็มก่อน เพื่อป้องกันการวิ่งแห้ง (Dry Run)</p>
+            </div>
+            <div class="bg-white p-6 rounded-xl shadow-sm">
+              <div class="w-10 h-10 bg-accent-100 rounded-lg flex items-center justify-center mb-4">
+                <svg class="w-5 h-5 text-accent-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10.325 4.317c.426-1.756 2.924-1.756 3.35 0a1.724 1.724 0 002.573 1.066c1.543-.94 3.31.826 2.37 2.37a1.724 1.724 0 001.065 2.572c1.756.426 1.756 2.924 0 3.35a1.724 1.724 0 00-1.066 2.573c.94 1.543-.826 3.31-2.37 2.37a1.724 1.724 0 00-2.572 1.065c-.426 1.756-2.924 1.756-3.35 0a1.724 1.724 0 00-2.573-1.066c-1.543.94-3.31-.826-2.37-2.37a1.724 1.724 0 00-1.065-2.572c-1.756-.426-1.756-2.924 0-3.35a1.724 1.724 0 001.066-2.573c-.94-1.543.826-3.31 2.37-2.37.996.608 2.296.07 2.572-1.065z" />
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z" />
+                </svg>
+              </div>
+              <h3 class="text-base font-bold text-neutral-800 mb-2">การบำรุงรักษา</h3>
+              <p class="text-neutral-600 text-sm leading-relaxed">ตรวจสอบระดับน้ำมันหล่อลื่นทุก 3 เดือน เปลี่ยนซีลกันรั่วทุก 1-2 ปี ทำความสะอาดตะแกรงดูดน้ำเดือนละครั้ง และตรวจสอบสายไฟทุก 6 เดือน</p>
+            </div>
+          </div>
+          <div class="mt-8 p-4 bg-accent-50 border border-accent-200 rounded-lg">
+            <p class="text-sm text-accent-700 text-center"><strong>หมายเหตุ:</strong> ควรให้ช่างผู้เชี่ยวชาญติดตั้งและตรวจสอบระบบปั๊มน้ำเป็นประจำทุกปี เพื่อความปลอดภัยและอายุการใช้งานที่ยาวนาน</p>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- FAQ Section -->
+    <section class="py-16 bg-white">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl font-bold text-primary-700 mb-8 text-center">คำถามที่พบบ่อยเกี่ยวกับปั๊มน้ำ (FAQ)</h2>
+          <div class="space-y-4">
+            <div class="border border-neutral-200 rounded-lg overflow-hidden">
+              <details class="group">
+                <summary class="flex justify-between items-center p-4 bg-neutral-50 cursor-pointer list-none">
+                  <span class="font-semibold text-neutral-800">ปั๊มน้ำมีกี่ประเภทและแต่ละประเภทเหมาะกับการใช้งานอะไร?</span>
+                  <span class="transition group-open:rotate-180">
+                    <svg fill="none" height="24" shape-rendering="geometricPrecision" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" viewBox="0 0 24 24" width="24"><path d="M6 9l6 6 6-6"></path></svg>
+                  </span>
+                </summary>
+                <div class="p-4 text-neutral-600 text-sm leading-relaxed">
+                  ปั๊มน้ำแบ่งออกเป็นหลายประเภทตามการใช้งาน: (1) <strong>ปั๊มหอยโข่ง</strong> เหมาะสำหรับบ้านพักและอาคารขนาดเล็ก (2) <strong>ปั๊มเจ็ท</strong> เหมาะสำหรับบ่อน้ำลึก (3) <strong>ปั๊มจุ่ม</strong> เหมาะสำหรับระบายน้ำและบ่อบาด (4) <strong>ปั๊มอัตโนมัติ</strong> เหมาะสำหรับบ้านที่ต้องการน้ำประปาอัตโนมัติ (5) <strong>ปั๊มแรงดันสูง</strong> เหมาะสำหรับระบบดับเพลิงและอุตสาหกรรม
+                </div>
+              </details>
+            </div>
+            <div class="border border-neutral-200 rounded-lg overflow-hidden">
+              <details class="group">
+                <summary class="flex justify-between items-center p-4 bg-neutral-50 cursor-pointer list-none">
+                  <span class="font-semibold text-neutral-800">เลือกซื้อปั๊มน้ำอย่างไรให้เหมาะกับการใช้งาน?</span>
+                  <span class="transition group-open:rotate-180">
+                    <svg fill="none" height="24" shape-rendering="geometricPrecision" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" viewBox="0 0 24 24" width="24"><path d="M6 9l6 6 6-6"></path></svg>
+                  </span>
+                </summary>
+                <div class="p-4 text-neutral-600 text-sm leading-relaxed">
+                  ต้องพิจารณา 4 ปัจจัยหลัก: (1) <strong>ความสูงยก (Head)</strong> วัดระยะจากปั๊มถึงจุดส่งน้ำสูงสุด (2) <strong>อัตราการไหล (Flow Rate)</strong> ปริมาณน้ำที่ต้องการต่อนาที (3) <strong>แหล่งน้ำ</strong> บ่อ ถังเก็บ หรือน้ำประปา (4) <strong>กำลังไฟ</strong> เลือกให้เหมาะกับขนาดและการใช้งาน
+                </div>
+              </details>
+            </div>
+            <div class="border border-neutral-200 rounded-lg overflow-hidden">
+              <details class="group">
+                <summary class="flex justify-between items-center p-4 bg-neutral-50 cursor-pointer list-none">
+                  <span class="font-semibold text-neutral-800">การติดตั้งปั๊มน้ำต้องดูอะไรบ้าง?</span>
+                  <span class="transition group-open:rotate-180">
+                    <svg fill="none" height="24" shape-rendering="geometricPrecision" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" viewBox="0 0 24 24" width="24"><path d="M6 9l6 6 6-6"></path></svg>
+                  </span>
+                </summary>
+                <div class="p-4 text-neutral-600 text-sm leading-relaxed">
+                  สิ่งสำคัญในการติดตั้ง: (1) <strong>ตำแหน่ง</strong> ติดตั้งในที่ร่ม อากาศถ่ายเทดี สูงจากพื้น 30 ซม. (2) <strong>ท่อดูด</strong> ใช้ขนาดไม่เล็กกว่าทางเข้าปั๊ม (3) <strong>วาล์ว</strong> ติดตั้งวาล์วกันย้อนที่ท่อส่ง (4) <strong>สายดิน</strong> ต่อสายดินให้ครบถ้วน (5) <strong>ทดสอบ</strong> เติมน้ำ (Priming) ก่อนเปิดใช้งานเสมอ
+                </div>
+              </details>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Contact CTA -->
+    <section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white">
+      <div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
+        <h2 class="text-xl sm:text-2xl font-bold mb-6">สนใจสินค้าของเรา?</h2>
+        <p class="text-lg text-white/80 mb-8 max-w-2xl mx-auto">
+          ติดต่อเราวันนี้เพื่อรับคำแนะนำและราคาพิเศษ
+        </p>
+        <div class="flex flex-wrap justify-center gap-4">
+          <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" class="flex items-center gap-2 bg-white text-primary-700 px-6 py-3 rounded-xl font-semibold hover:bg-primary-50 transition-colors">
+            <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"><path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/></svg>
+            แชท
+          </a>
+          <a href="tel:0905551415" class="flex items-center gap-2 bg-white/10 hover:bg-white/20 text-white px-6 py-3 rounded-xl font-semibold border border-white/30 transition-colors">
+            โทร 090-555-1415
+          </a>
+        </div>
+        <p class="text-base text-white/70 mt-8">
+          <strong>โทร:</strong> 090-555-1415 &nbsp;|&nbsp; <strong>Line Id:</strong> JPPSELECTION &nbsp;|&nbsp; <strong>E-mail:</strong> dealplustech@gmail.com
+        </p>
+      </div>
+    </section>
+  </main>
+</BaseLayout>
--- a/src/pages/water-treatment.astro
+++ b/src/pages/water-treatment.astro
@@ -0,0 +1,203 @@
+---
+import BaseLayout from '@/layouts/BaseLayout.astro';
+import Header from '@/components/common/Header.astro';
+import Footer from '@/components/common/Footer.astro';
+import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
+---
+
+<script type="application/ld+json">
+{
+  "@context": "https://schema.org",
+  "@type": "Product",
+  "name": "ระบบกรองน้ำ Water Treatment",
+  "description": "จำหน่ายระบบกรองน้ำดี (Water Treatment) คุณภาพสูง ราคาโรงงาน ส่งฟรี กทม. ปริมณฑล",
+  "image": "https://dealplustech.co.th/images/products-cropped/water-treatment_000C.jpg",
+  "offers": {
+    "@type": "Offer",
+    "url": "https://dealplustech.co.th/water-treatment",
+    "priceCurrency": "THB",
+    "availability": "https://schema.org/InStock"
+  }
+}
+</script>
+
+<BaseLayout title="ระบบกรองน้ำดี (Water Treatment)" description="จำหน่ายระบบกรองน้ำดี (Water Treatment)คุณภาพสูง ราคาโรงงาน ส่งฟรี กทม. ปริมณฑล">
+  <Header slot="header" />
+
+  <main class="bg-white min-h-screen pb-24 md:pb-0">
+    <!-- Hero Section -->
+    <section class="bg-gradient-to-br from-primary-700 to-primary-600 text-white py-12">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <nav class="text-sm mb-4 text-primary-100">
+          <a href="/" class="hover:text-white">หน้าแรก</a> / <a href="/all-products" class="hover:text-white">สินค้าทั้งหมด</a> / <span class="text-white">ระบบกรองน้ำ</span>
+        </nav>
+        <div class="grid lg:grid-cols-2 gap-8 items-center">
+          <div class="img-hover rounded-2xl overflow-hidden bg-white/10">
+            <img src="/images/products-cropped/water-treatment_000C.jpg" alt="ระบบกรองน้ำ" class="w-full" loading="eager" />
+          </div>
+          <div>
+            <span class="text-sm text-primary-200 font-medium">ปั๊มและระบบน้ำ</span>
+            <h1 class="text-3xl lg:text-4xl font-bold mt-2 mb-4">ระบบกรองน้ำดี (Water Treatment)</h1>
+            <p class="text-primary-100 text-lg mb-6">ระบบกรองน้ำคุณภาพสูง กรองสารอนินทรีย์ คลอรีน เหมาะสำหรับน้ำดื่ม</p>
+            <div class="flex flex-wrap gap-4 mb-8">
+              <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" class="bg-white/10 hover:bg-white/20 text-white py-3 px-6 rounded-xl font-semibold border border-white/30 flex items-center gap-2">
+                <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"><path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/></svg>
+                แชท
+              </a>
+              <a href="tel:0905551415" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-6 rounded-xl font-semibold flex items-center gap-2">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z"/>
+                </svg>
+                090-555-1415
+              </a>
+            </div>
+            <div class="flex flex-wrap gap-4 text-primary-100 text-sm">
+              <div class="flex items-center gap-1">
+                <svg class="w-5 h-5 text-accent-500" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" /></svg>
+                <span>ระบบผลิตน้ำประปา</span>
+              </div>
+              <div class="flex items-center gap-1">
+                <svg class="w-5 h-5 text-accent-500" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" /></svg>
+                <span>ระบบ DI น้ำบริสุทธิ์</span>
+              </div>
+              <div class="flex items-center gap-1">
+                <svg class="w-5 h-5 text-accent-500" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" /></svg>
+                <span>ระบบ RO</span>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Product Details -->
+    <section class="py-16 px-4">
+      <div class="max-w-7xl mx-auto">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl font-bold text-neutral-900 mb-8">รายละเอียดสินค้า</h2>
+
+          <p class="text-lg text-neutral-700 leading-relaxed mb-6">
+            จำหน่ายระบบกรองน้ำดีและอุปกรณ์ครบวงจร สำหรับบ้าน อาคาร โรงงานอุตสาหกรรม โรงแรม โรงพยาบาล และสถานประกอบการต่างๆ พร้อมให้คำปรึกษาและออกแบบระบบโดยทีมงานมืออาชีพ
+          </p>
+
+          <h3 class="text-xl font-bold text-neutral-900 mt-8 mb-4">ระบบผลิตน้ำประปาและน้ำบริสุทธิ์</h3>
+          <ul class="list-disc pl-6 mb-6 space-y-2 text-neutral-700">
+            <li><strong>ระบบผลิตน้ำประปา</strong> - สำหรับโรงงาน อาคาร ชุมชน</li>
+            <li><strong>ระบบผลิตน้ำ DI</strong> - น้ำบริสุทธิ์สำหรับอุตสาหกรรมอิเล็กทรอนิกส์ อาหาร เครื่องดื่ม</li>
+            <li><strong>ระบบ Ultrafiltration (UF)</strong> - กรองน้ำขนาดเล็ก 0.01 ไมครอน</li>
+            <li><strong>ระบบ Reverse Osmosis (RO)</strong> - กรองน้ำขนาดเล็กมาก ขนาด 0.0001 ไมครอน</li>
+          </ul>
+
+          <h3 class="text-xl font-bold text-neutral-900 mt-8 mb-4">1. สารเคมี (Chemical Supply)</h3>
+          <h4 class="text-lg font-semibold text-neutral-800 mb-3">สารเคมีเฉพาะทาง (Specialty Chemicals)</h4>
+          <ul class="list-disc pl-6 mb-6 space-y-2 text-neutral-700">
+            <li>สารเคมีบำบัดน้ำ - ระบบ Cooling Tower, Boiler, น้ำบริสุทธิ์, น้ำเสีย</li>
+            <li>สารกันตะกรันสำหรับ RO</li>
+            <li>สารเคมีสำหรับอุตสาหกรรมอาหาร</li>
+            <li>สารเคมีสำหรับทำความสะอาด</li>
+          </ul>
+
+          <h4 class="text-lg font-semibold text-neutral-800 mb-3">สารเคมีพื้นฐาน (Basic Chemicals)</h4>
+          <ul class="list-disc pl-6 mb-6 space-y-2 text-neutral-700">
+            <li>NaCl 99.75% (เกลือบริสุทธิ์)</li>
+            <li>NaOCl 10% (ของเหลว) - คลอรีนน้ำ</li>
+            <li>NaOH 50% (ของเหลว) และ 99% (ผง) - โซดาไฟ</li>
+            <li>HCl 35% (ของเหลว) - กรดเกลือ</li>
+            <li>PAC 10% (ของเหลว) และ 30%-35% (ผง) - สารส้ม</li>
+          </ul>
+
+          <h3 class="text-xl font-bold text-neutral-900 mt-8 mb-4">2. อุปกรณ์ (Equipment Supply)</h3>
+          <ul class="list-disc pl-6 mb-6 space-y-2 text-neutral-700">
+            <li><strong>ระบบกรอง</strong> - Sand Filter, Carbon Filter, Softener และอื่นๆ</li>
+            <li><strong>อุปกรณ์เติมสารเคมี</strong> - Metering Pump</li>
+            <li><strong>เครื่องควบคุม</strong> - pH, Conductivity และอื่นๆ</li>
+            <li><strong>เครื่องฆ่าเชื้อด้วย UV</strong> - Ultraviolet Sterilizers</li>
+          </ul>
+
+          <h3 class="text-xl font-bold text-neutral-900 mt-8 mb-4">3. ระบบโรงงาน (Engineering Plant Supply)</h3>
+          <ul class="list-disc pl-6 mb-6 space-y-2 text-neutral-700">
+            <li><strong>ระบบตกตะกอน</strong> - Clarifier Plant</li>
+            <li><strong>ระบบกำจัดแร่ธาตุ</strong> - Demineralization Plant</li>
+            <li><strong>ระบบ Reverse Osmosis</strong> - RO Plant</li>
+            <li><strong>ระบบบำบัดน้ำเสีย</strong> - Wastewater Treatment Plant</li>
+          </ul>
+        </div>
+      </div>
+    </section>
+
+    <!-- Treatment Methods -->
+    <section class="py-16 px-4 bg-neutral-50">
+      <div class="max-w-7xl mx-auto">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl font-bold text-neutral-900 mb-8 text-center">วิธีการบำบัดน้ำแต่ละประเภท</h2>
+
+          <div class="grid md:grid-cols-2 gap-6">
+            <div class="bg-white p-6 rounded-xl">
+              <h3 class="font-bold text-lg text-neutral-900 mb-2">ระบบกรองทราย (Sand Filter)</h3>
+              <p class="text-neutral-700 text-sm">กรองตะกอนและสารแขวนลอยขนาดใหญ่กว่า 20 ไมครอน เหมาะสำหรับน้ำดิมที่มีตะกอนสูง</p>
+            </div>
+            <div class="bg-white p-6 rounded-xl">
+              <h3 class="font-bold text-lg text-neutral-900 mb-2">ระบบคาร์บอน (Carbon Filter)</h3>
+              <p class="text-neutral-700 text-sm">กำจัดกลิ่น สี และสารอินทรีย์ด้วยถ่านกัมมันต์ ขจัดคลอรีนและสารประกอบอินทรีย์ที่เป็นอันตราย</p>
+            </div>
+            <div class="bg-white p-6 rounded-xl">
+              <h3 class="font-bold text-lg text-neutral-900 mb-2">ระบบปรับอ่อนน้ำ (Water Softener)</h3>
+              <p class="text-neutral-700 text-sm">กำจัดความกระด้าง (Ca, Mg) ด้วยเรซิ่นแลกเปลี่ยนไอออน ป้องกันการสะสมของตะกรันหินปูน</p>
+            </div>
+            <div class="bg-white p-6 rounded-xl">
+              <h3 class="font-bold text-lg text-neutral-900 mb-2">ระบบ Reverse Osmosis (RO)</h3>
+              <p class="text-neutral-700 text-sm">กรองน้ำขนาดเล็กมาก 0.0001 ไมครอน ขจัดโลหะหนัก สารละลาย และเชื้อโรค</p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- FAQ Section -->
+    <section class="py-16 px-4">
+      <div class="max-w-7xl mx-auto">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl font-bold text-neutral-900 mb-8 text-center">คำถามที่พบบ่อย</h2>
+          <div class="space-y-4">
+            <div class="bg-neutral-50 rounded-xl p-4">
+              <h3 class="font-semibold text-neutral-900 mb-2">ระบบบำบัดน้ำมีกี่ประเภท?</h3>
+              <p class="text-neutral-700">ระบบบำบัดน้ำแบ่งออกเป็นหลายประเภท ได้แก่ ระบบกรองทราย (Sand Filter) ระบบคาร์บอน (Carbon Filter) ระบบปรับอ่อนน้ำ (Softener) ระบบ UF และระบบ RO</p>
+            </div>
+            <div class="bg-neutral-50 rounded-xl p-4">
+              <h3 class="font-semibold text-neutral-900 mb-2">ระบบบำบัดน้ำเหมาะกับอุตสาหกรรมใด?</h3>
+              <p class="text-neutral-700">ใช้กันอย่างแพร่หลายในอุตสาหกรรมอาหารและเครื่องดื่ม อิเล็กทรอนิกส์ ยา กระดาษ เหล็กและโลหะ สิ่งทอ เคมี โรงแรม โรงพยาบาล และอาคารขนาดใหญ่</p>
+            </div>
+            <div class="bg-neutral-50 rounded-xl p-4">
+              <h3 class="font-semibold text-neutral-900 mb-2">การบำรุงรักษาระบบบำบัดน้ำทำอย่างไร?</h3>
+              <p class="text-neutral-700">ล้างกรองทรายทุก 1-2 เดือน เปลี่ยนถ่านกัมมันต์ทุก 6-12 เดือน รีเจนเนตตัวเรือนน้ำอ่อนทุก 1-2 เดือน และเปลี่ยน membrane RO ทุก 2-5 ปี</p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Contact CTA -->
+    <section class="py-16 px-4 bg-gradient-to-br from-primary-700 to-primary-600 text-white text-center">
+      <div class="max-w-4xl mx-auto">
+        <h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2>
+        <p class="text-lg text-primary-100 mb-8">ติดต่อ 090-555-1415 หรือแอดไลน์ @JPPSELECTION</p>
+        <div class="flex flex-wrap justify-center gap-4">
+          <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" class="bg-white text-primary-700 py-3 px-8 rounded-xl font-semibold hover:bg-primary-50 flex items-center gap-2">
+            <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"><path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/></svg>
+            แชท
+          </a>
+          <a href="tel:0905551415" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-8 rounded-xl font-semibold flex items-center gap-2">
+            <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z"/>
+            </svg>
+            090-555-1415
+          </a>
+        </div>
+      </div>
+    </section>
+  </main>
+
+  <Footer slot="footer" />
+
+  <StickyBottomCTA phone="0905551415" lineUrl="https://line.me/ti/p/~JPPSELECTION" slot="after-footer" />
+</BaseLayout>
--- a/src/pages/ฉนวนหุ้มท่อ.astro
+++ b/src/pages/ฉนวนหุ้มท่อ.astro
@@ -0,0 +1,335 @@
+---
+import BaseLayout from '@/layouts/BaseLayout.astro';
+import Header from '@/components/common/Header.astro';
+import Footer from '@/components/common/Footer.astro';
+---
+
+<BaseLayout title="ฉนวนหุ้มท่อ | Pipe Insulation - ดีล พลัส เทค" description="ฉนวนหุ้มท่อ (Pipe Insulation) คืออะไร? ทำไมถึงสำคัญในอุตสาหกรรม? ส่งฟรี กรุงเทพมหานคร ปริมณฑล">
+  <Header slot="header" />
+
+  <main class="bg-white min-h-screen">
+    <!-- Product Hero Section -->
+    <section class="bg-gradient-to-br from-primary-700 to-primary-600 text-white py-16">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="grid lg:grid-cols-2 gap-12 items-start">
+          <div class="lg:sticky lg:top-24">
+            <div class="rounded-2xl overflow-hidden bg-white/10 p-2">
+              <img src="/images/thermobreak/thermobreak-solarblock.png" alt="ฉนวนหุ้มท่อ" class="w-full h-auto rounded-xl" width="600" height="600" loading="eager" fetchpriority="high" decoding="sync" onerror="this.src='/images/logo/dealplustech-logo.png'" />
+            </div>
+          </div>
+
+          <div>
+            <span class="inline-block px-4 py-1.5 bg-white/20 text-white rounded-full text-sm font-medium mb-4">
+              ฉนวนหุ้มท่อ
+            </span>
+            <h1 class="text-3xl sm:text-4xl lg:text-5xl font-bold mb-4">ฉนวนหุ้มท่อ | Pipe Insulation</h1>
+            <p class="text-lg sm:text-xl text-white/80 mb-8 leading-relaxed">
+              ฉนวนหุ้มท่อ (Pipe Insulation) คืออะไร? ทำไมถึงสำคัญในอุตสาหกรรม? ส่งฟรี กรุงเทพมหานคร ปริมณฑล
+            </p>
+
+            <div class="flex flex-wrap gap-4 mb-8">
+              <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" class="bg-white text-primary-700 hover:bg-primary-50 py-3 px-6 rounded-xl font-semibold flex items-center gap-2">
+                <span>แชท</span>
+                <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"><path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/></svg>
+              </a>
+              <a href="tel:0905551415" class="bg-white/10 hover:bg-white/20 text-white py-3 px-6 rounded-xl font-semibold border border-white/30 flex items-center gap-2">
+                <span>090-555-1415</span>
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z"/>
+                </svg>
+              </a>
+              <a href="#pricelist" data-price-button class="hidden bg-white text-primary-700 hover:bg-primary-50 py-3 px-6 rounded-xl font-semibold flex items-center gap-2">
+                <span>ราคาสินค้า</span>
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/>
+                </svg>
+              </a>
+            </div>
+
+            <div class="flex flex-wrap gap-6">
+              <div class="flex items-center gap-2 text-white/80">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span>คุณภาพสูง มาตรฐานอุตสาหกรรม</span>
+              </div>
+              <div class="flex items-center gap-2 text-white/80">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span>ราคาโรงงาน คุ้มค่า</span>
+              </div>
+              <div class="flex items-center gap-2 text-white/80">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span>จัดส่งรวดเร็ว ส่งฟรี กทม. ปริมณฑล</span>
+              </div>
+              <div class="flex items-center gap-2 text-white/80">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span>รับประกันสินค้า</span>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Product Specifications -->
+    <section class="py-16">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-xl font-bold text-slate-900 mb-8">รายละเอียดสินค้า</h2>
+
+          <div class="prose prose-lg max-w-none mb-8">
+            <p class="text-lg text-slate-700 leading-relaxed mb-6">
+              <strong>ฉนวนหุ้มท่อ (Pipe Insulation)</strong> เป็นฉนวนที่ใช้หุ้มท่อเพื่อป้องกันการสูญเสียความร้อนหรือความเย็นของระบบท่อ ลดการเกิดการควบแน่นของไอน้ำบนผิวท่อ ประหยัดพลังงาน และป้องกันอุบัติเหตุจากผิวท่อที่ร้อน เหมาะสำหรับระบบประปา ระบบปรับอากาศ ระบบท่อน้ำร้อน ระบบท่อน้ำเย็น ระบบท่อส่งน้ำมันร้อน และอุตสาหกรรมต่างๆ
+            </p>
+
+            <h3 class="text-2xl font-bold text-slate-900 mt-8 mb-4">ประเภทฉนวนหุ้มท่อที่จำหน่าย</h3>
+
+            <div class="space-y-6 mb-8">
+              <div class="p-6 bg-gray-50 rounded-lg">
+                <h4 class="text-xl font-bold text-primary-700 mb-2">Armaflex</h4>
+                <p class="text-slate-700 mb-3">ฉนวนยางอีลาสโตเมอริก (Elastomeric Rubber Foam) แบบเซลล์ปิด ผลิตจากยาง NBR/PVC หุ้มท่อและอุปกรณ์ท่อเพื่อป้องกันการสูญเสียความเย็นและความร้อน ลดการเกิดการควบแน่น ทนต่อไอน้ำและความชื้น มีค่าสัมประสิทธิ์การนำความร้อนต่ำ ผิวเรียบสวยงาม ใช้งานง่าย รับประกันคุณภาพมาตรฐาน</p>
+                <div class="flex flex-wrap gap-2">
+                  <span class="px-3 py-1 bg-primary-100 text-primary-800 text-sm rounded-full">ทนความเย็น -50°C ถึง +105°C</span>
+                  <span class="px-3 py-1 bg-primary-100 text-primary-800 text-sm rounded-full">แบบท่อน (Slit Pipe)</span>
+                  <span class="px-3 py-1 bg-primary-100 text-primary-800 text-sm rounded-full">แบบม้วน (Sheet/Roll)</span>
+                  <span class="px-3 py-1 bg-primary-100 text-primary-800 text-sm rounded-full">ป้องกันการควบแน่น</span>
+                </div>
+              </div>
+
+              <div class="p-6 bg-gray-50 rounded-lg">
+                <h4 class="text-xl font-bold text-blue-700 mb-2">Aeroflex</h4>
+                <p class="text-slate-700 mb-3">ฉนวนยางอีลาสโตเมอริกคุณภาพสูง ผลิตจากยาง EPDM หรือ NBR/PVC แบบเซลล์ปิด มีคุณสมบัติยืดหยุ่นสูง ติดตั้งง่าย ทนต่อรังสี UV ทนต่อสภาพอากาศ เหมาะสำหรับงานระบบปรับอากาศ ระบบทำความเย็น ระบบท่อน้ำร้อน ทนอุณหภูมิได้ในช่วงกว้าง มีทั้งแบบท่อนและแบบแผ่น</p>
+                <div class="flex flex-wrap gap-2">
+                  <span class="px-3 py-1 bg-blue-100 text-blue-800 text-sm rounded-full">ทนความร้อน -50°C ถึง +116°C</span>
+                  <span class="px-3 py-1 bg-blue-100 text-blue-800 text-sm rounded-full">ยืดหยุ่นสูง</span>
+                  <span class="px-3 py-1 bg-blue-100 text-blue-800 text-sm rounded-full">ทนรังสี UV</span>
+                  <span class="px-3 py-1 bg-blue-100 text-blue-800 text-sm rounded-full">ติดตั้งง่าย</span>
+                </div>
+              </div>
+
+              <div class="p-6 bg-gray-50 rounded-lg">
+                <h4 class="text-xl font-bold text-orange-700 mb-2">Maxflex FR</h4>
+                <p class="text-slate-700 mb-3">ฉนวนยางที่มีคุณสมบัติทนไฟ (Fire Retardant) ผลิตตามมาตรฐานความปลอดภัยจากประกายไฟ มีทั้งแบบท่อน (FR ST) และแบบม้วน (FR Roll) เหมาะสำหรับงานที่ต้องการความปลอดภัยจากอัคคีภัย ระบบท่อดับเพลิง ระบบท่อน้ำร้อน ระบบท่อที่ต้องการความทนไฟ</p>
+                <div class="flex flex-wrap gap-2">
+                  <span class="px-3 py-1 bg-orange-100 text-orange-800 text-sm rounded-full">ทนไฟ (Fire Retardant)</span>
+                  <span class="px-3 py-1 bg-orange-100 text-orange-800 text-sm rounded-full">FR ST แบบท่อน</span>
+                  <span class="px-3 py-1 bg-orange-100 text-orange-800 text-sm rounded-full">FR Roll แบบม้วน</span>
+                  <span class="px-3 py-1 bg-orange-100 text-orange-800 text-sm rounded-full">มาตรฐานความปลอดภัย</span>
+                </div>
+              </div>
+            </div>
+
+            <h3 class="text-2xl font-bold text-slate-900 mt-8 mb-4">ฉนวนใยแก้ว (Glasswool & Mineral Wool)</h3>
+            <p class="text-lg text-slate-700 mb-8">นอกจากฉนวนยางแล้ว เรายังจำหน่ายฉนวนใยแก้วและใยหินสำหรับงานอุตสาหกรรมและงานระบบท่อลม ซึ่งเหมาะกับการใช้งานที่ต้องการความทนไฟและราคาประหยัด</p>
+
+            <div class="grid md:grid-cols-3 gap-6 mb-8">
+              <div class="bg-white p-5 rounded-lg shadow-sm">
+                <h3 class="font-bold text-slate-900 mb-3">SCG Glasswool</h3>
+                <p class="text-slate-700 text-sm mb-3">ฉนวนใยแก้วคุณภาพจาก SCG สำหรับงานฉนวนระบบท่อลมและฉนวนอาคาร</p>
+                <ul class="text-sm text-slate-600 space-y-1">
+                  <li>• ทนความร้อนสูง</li>
+                  <li>• ดูดซับเสียงได้ดี</li>
+                  <li>• ราคาประหยัด</li>
+                  <li>• เหมาะกับท่อลม</li>
+                </ul>
+              </div>
+              <div class="bg-white p-5 rounded-lg shadow-sm">
+                <h3 class="font-bold text-slate-900 mb-3">MicroFiber</h3>
+                <p class="text-slate-700 text-sm mb-3">ฉนวนใยแก้วเกรดพรีเมียม สำหรับงานที่ต้องการประสิทธิภาพสูง</p>
+                <ul class="text-sm text-slate-600 space-y-1">
+                  <li>• เส้นใยละเอียด</li>
+                  <li>• ประสิทธิภาพสูง</li>
+                  <li>• ทนความร้อนได้ดี</li>
+                  <li>• เหมาะกับงานอุตสาหกรรม</li>
+                </ul>
+              </div>
+              <div class="bg-white p-5 rounded-lg shadow-sm">
+                <h3 class="font-bold text-slate-900 mb-3">ROCKWOOL (Stonewool)</h3>
+                <p class="text-slate-700 text-sm mb-3">ฉนวนใยหินจาก ROCKWOOL สำหรับงานที่ต้องการความทนไฟและความแข็งแรงสูง</p>
+                <ul class="text-sm text-slate-600 space-y-1">
+                  <li>• ทนไฟได้ดีเยี่ยม</li>
+                  <li>• แข็งแรง ทนทาน</li>
+                  <li>• เหมาะกับงานอุตสาหกรรม</li>
+                  <li>• ดูดซับเสียงได้ดี</li>
+                </ul>
+              </div>
+            </div>
+
+            <h3 class="text-2xl font-bold text-slate-900 mt-8 mb-4">คุณสมบัติเด่นของฉนวนหุ้มท่อ</h3>
+
+            <ul class="list-disc pl-6 mb-6 space-y-2">
+              <li><strong>ป้องกันการสูญเสียความร้อน/ความเย็น</strong> — ลดการถ่ายเทความร้อนระหว่างตัวท่อกับสิ่งแวดล้อม ช่วยประหยัดพลังงานในระบบทำความเย็นและทำความร้อน</li>
+              <li><strong>ป้องกันการเกิดการควบแน่น</strong> — ผิวฉนวนที่เป็นเซลล์ปิดไม่ดูดซับความชื้น ป้องกันการเกิดหยดน้ำบนผิวท่อ ลดความเสียหายต่อโครงสร้างและอุปกรณ์</li>
+              <li><strong>ป้องกันอุบัติเหตุจากผิวท่อร้อน</strong> — ปกป้องผู้สัมผัสจากผิวท่อที่ร้อน เหมาะสำหรับท่อน้ำร้อน ท่อไอน้ำ และท่อที่มีอุณหภูมิสูง</li>
+              <li><strong>ลดเสียงรบกวน</strong> — ดูดซับเสียงจากการไหลของน้ำและการสั่นสะเทือนของท่อ ลดความเสียหายต่อโครงสร้าง</li>
+              <li><strong>ทนทานต่อสภาพอากาศและสารเคมี</strong> — ทนต่อรังสี UV ความชื้น และสารเคมีทั่วไป อายุการใช้งานยาวนาน</li>
+              <li><strong>ติดตั้งง่าย รวดเร็ว</strong> — ฉนวนยางมีความยืดหยุ่นสูง เข้ามุม เข้ารูปอุปกรณ์ท่อได้ง่าย ไม่ต้องใช้เครื่องมือพิเศษ</li>
+              <li><strong>น้ำหนักเบา ไม่ดูดซับน้ำ</strong> — โครงสร้างเซลล์ปิดไม่ดูดซับน้ำหรือไอน้ำ รักษาประสิทธิภาพฉนวนได้ตลอดอายุการใช้งาน</li>
+            </ul>
+
+            <div class="grid md:grid-cols-2 gap-4 my-8">
+              <img src="/images/products-raw/pipe-insulation/Insulte_06.png" alt="การติดตั้งฉนวนหุ้มท่อ" class="w-full h-auto rounded-xl" loading="lazy" />
+              <img src="/images/products-raw/pipe-insulation/Insulte_07.png" alt="การประยุกต์ใช้ฉนวนหุ้มท่อ" class="w-full h-auto rounded-xl" loading="lazy" />
+            </div>
+
+            <h3 class="text-2xl font-bold text-slate-900 mt-8 mb-4">การประยุกต์ใช้งาน</h3>
+
+            <p class="text-lg text-slate-700 leading-relaxed mb-4">
+              ฉนวนหุ้มท่อ Armaflex, Aeroflex และ Maxflex FR เหมาะสำหรับใช้ในงานต่างๆ ดังนี้:
+            </p>
+            <ul class="list-disc pl-6 mb-6 space-y-2">
+              <li>ระบบปรับอากาศและระบบทำความเย็น (HVAC/R) — ท่อน้ำเย็น ท่อน้ำย้อนกลับ คอยล์ระเหย</li>
+              <li>ระบบท่อน้ำร้อนและท่อไอน้ำ — ป้องกันการสูญเสียความร้อน ป้องกันอุบัติเหตุ</li>
+              <li>ระบบประปา — ป้องกันการแตกจากน้ำแข็งในท่อ ป้องกันการควบแน่น</li>
+              <li>ระบบดับเพลิง — ท่อน้ำดับเพลิงที่ต้องการความทนไฟ</li>
+              <li>อุตสาหกรรมอาหารและเครื่องดื่ม — รักษาอุณหภูมิผลิตภัณฑ์</li>
+              <li>อุตสาหกรรมเคมีและปิโตรเคมี — ป้องกันการเกิดปฏิกิริยาทางเคมี</li>
+            </ul>
+
+            <div class="bg-primary-50 border-l-4 border-primary-600 p-4 mt-6">
+              <p class="text-slate-700">
+                <strong>สอบถามราคาและสั่งซื้อ:</strong> ติดต่อเราได้ที่ Line: <a href="https://line.me/ti/p/~JPPSELECTION" class="text-primary-700 underline">@JPPSELECTION</a> หรือโทร <a href="tel:0905551415" class="text-primary-700 underline">090-555-1415</a> ราคาโรงงาน ส่งฟรี กรุงเทพมหานคร และปริมณฑล
+              </p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Thickness Selection Guide -->
+    <section class="py-16 bg-gray-50">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-xl font-bold text-slate-900 mb-8">คำแนะนำการเลือกความหนาฉนวน</h2>
+          <p class="text-lg text-slate-700 mb-6">การเลือกความหนาฉนวนขึ้นอยู่กับปัจจัยหลายอย่าง เช่น อุณหภูมิของไหลในท่อ อุณหภูมิแวดล้อม และความชื้น</p>
+
+          <div class="overflow-x-auto">
+            <table class="w-full border-collapse bg-white rounded-lg">
+              <thead>
+                <tr class="bg-primary-600 text-white">
+                  <th class="px-4 py-3 text-left">ขนาดท่อ (นิ้ว)</th>
+                  <th class="px-4 py-3 text-center">ท่อน้ำเย็น (มม.)</th>
+                  <th class="px-4 py-3 text-center">ท่อลมเย็น (มม.)</th>
+                  <th class="px-4 py-3 text-center">ท่อน้ำร้อน (มม.)</th>
+                </tr>
+              </thead>
+              <tbody class="divide-y divide-gray-200">
+                <tr><td class="px-4 py-2 font-medium">1/2"</td><td class="px-4 py-2 text-center">15-20</td><td class="px-4 py-2 text-center">20-25</td><td class="px-4 py-2 text-center">20-25</td></tr>
+                <tr><td class="px-4 py-2 font-medium">3/4"</td><td class="px-4 py-2 text-center">15-20</td><td class="px-4 py-2 text-center">20-25</td><td class="px-4 py-2 text-center">25-30</td></tr>
+                <tr><td class="px-4 py-2 font-medium">1"</td><td class="px-4 py-2 text-center">20-25</td><td class="px-4 py-2 text-center">25-30</td><td class="px-4 py-2 text-center">25-30</td></tr>
+                <tr><td class="px-4 py-2 font-medium">1-1/2"</td><td class="px-4 py-2 text-center">20-25</td><td class="px-4 py-2 text-center">25-30</td><td class="px-4 py-2 text-center">30-40</td></tr>
+                <tr><td class="px-4 py-2 font-medium">2"</td><td class="px-4 py-2 text-center">25-30</td><td class="px-4 py-2 text-center">30-40</td><td class="px-4 py-2 text-center">30-40</td></tr>
+                <tr><td class="px-4 py-2 font-medium">3"</td><td class="px-4 py-2 text-center">25-30</td><td class="px-4 py-2 text-center">30-40</td><td class="px-4 py-2 text-center">40-50</td></tr>
+                <tr><td class="px-4 py-2 font-medium">4"</td><td class="px-4 py-2 text-center">30-40</td><td class="px-4 py-2 text-center">40-50</td><td class="px-4 py-2 text-center">40-50</td></tr>
+                <tr><td class="px-4 py-2 font-medium">6"</td><td class="px-4 py-2 text-center">30-40</td><td class="px-4 py-2 text-center">40-50</td><td class="px-4 py-2 text-center">50-60</td></tr>
+              </tbody>
+            </table>
+          </div>
+
+          <div class="mt-6 grid md:grid-cols-3 gap-4">
+            <div class="p-4 bg-blue-50 rounded-lg">
+              <h4 class="font-semibold text-slate-900 mb-2">ท่อน้ำเย็น</h4>
+              <p class="text-sm text-slate-700">ต้องการป้องกันการควบแน่น ความหนา 15-30 มม. ขึ้นอยู่กับขนาดท่อและความชื้นแวดล้อม</p>
+            </div>
+            <div class="p-4 bg-orange-50 rounded-lg">
+              <h4 class="font-semibold text-slate-900 mb-2">ท่อลมเย็น</h4>
+              <p class="text-sm text-slate-700">ต้องการป้องกันการสูญเสียความเย็น ความหนา 20-50 มม. ขึ้นอยู่กับอุณหภูมิลมและแวดล้อม</p>
+            </div>
+            <div class="p-4 bg-red-50 rounded-lg">
+              <h4 class="font-semibold text-slate-900 mb-2">ท่อน้ำร้อน</h4>
+              <p class="text-sm text-slate-700">ต้องการป้องกันการสูญเสียความร้อนและป้องกันแผลมือ ความหนา 20-60 มม. ขึ้นอยู่กับอุณหภูมิน้ำร้อน</p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- FAQ Section -->
+    <section class="py-16">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-xl font-bold text-slate-900 mb-8">คำถามที่พบบ่อย</h2>
+          <div class="space-y-4">
+            <div class="bg-white rounded-lg p-4">
+              <h3 class="font-semibold text-slate-900 mb-2">Q: ฉนวนยาง (Armaflex/Aeroflex) กับ ฉนวนใยแก้ว (Glasswool) ต่างกันอย่างไร?</h3>
+              <p class="text-slate-700">ฉนวนยางมีโครงสร้างเซลล์ปิด ยืดหยุ่น กันความชื้นได้ดี เหมาะกับท่อขนาดเล็ก-กลาง ส่วนฉนวนใยแก้วมีราคาถูกกว่า เหมาะกับท่อขนาดใหญ่และงานอุตสาหกรรมที่ต้องการทนไฟ</p>
+            </div>
+            <div class="bg-white rounded-lg p-4">
+              <h3 class="font-semibold text-slate-900 mb-2">Q: เลือกความหนาฉนวนอย่างไร?</h3>
+              <p class="text-slate-700">การเลือกความหนาขึ้นอยู่กับ: 1) อุณหภูมิของไหลในท่อ 2) อุณหภูมิแวดล้อม 3) ความชื้น 4) ขนาดท่อ โดยทั่วไปท่อน้ำเย็นควรใช้ 15-25 มม. ท่อลมเย็น 20-40 มม. และท่อน้ำร้อน 25-50 มม.</p>
+            </div>
+            <div class="bg-white rounded-lg p-4">
+              <h3 class="font-semibold text-slate-900 mb-2">Q: ฉนวนยางใช้ภายนอกอาคารได้ไหม?</h3>
+              <p class="text-slate-700">ได้ แต่ควรเลือกชนิดที่ทนรังสี UV และอาจต้องติดตั้งแผ่นเคลือบเพิ่มเติมเพื่อป้องกันการเสื่อมสภาพจากแสงแดด</p>
+            </div>
+            <div class="bg-white rounded-lg p-4">
+              <h3 class="font-semibold text-slate-900 mb-2">Q: ติดตั้งฉนวนยางยากไหม?</h3>
+              <p class="text-slate-700">ไม่ยาก ฉนวนยางมีความยืดหยุ่นสูง สามารถเปิดรอยต่อแล้วสวมเข้าท่อได้ หรือใช้กาวพิเศษติดที่ข้อต่อและรอยต่อ</p>
+            </div>
+            <div class="bg-white rounded-lg p-4">
+              <h3 class="font-semibold text-slate-900 mb-2">Q: Maxflex FR ต่างจาก Armaflex/Aeroflex อย่างไร?</h3>
+              <p class="text-slate-700">Maxflex FR มีคุณสมบัติทนไฟ (Fire Retardant) ซึ่งเหมาะกับงานที่ต้องการความปลอดภัยจากอัคคีภัย เช่น ระบบดับเพลิง ระบบท่อน้ำร้อนในโรงแรมหรือโรงพยาบาล</p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Price Lists -->
+    <section id="pricelist" class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="max-w-lg mx-auto">
+          <h2 class="text-xl font-bold mb-6 text-center">📥 ดาวน์โหลดราคาสินค้า</h2>
+          <div class="grid md:grid-cols-2 gap-4">
+            <a href="/documents/16 Price List Armaflex 2567.pdf" target="_blank" class="flex items-center gap-4 p-4 bg-white rounded-xl shadow-sm hover:shadow-md transition-shadow">
+              <svg class="w-8 h-8 text-red-600 flex-shrink-0" fill="currentColor" viewBox="0 0 24 24"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6zm-1 9V3.5L18.5 9H13zM8 13h8v2H8v-2zm0 4h8v2H8v-2zm0-8h2v2H8V9z"/></svg>
+              <div><div class="font-medium text-slate-900">Price List Armaflex 2567</div><div class="text-sm text-slate-500">PDF</div></div>
+            </a>
+            <a href="/documents/19 Pricelist Aeroflex (update 2565).pdf" target="_blank" class="flex items-center gap-4 p-4 bg-white rounded-xl shadow-sm hover:shadow-md transition-shadow">
+              <svg class="w-8 h-8 text-red-600 flex-shrink-0" fill="currentColor" viewBox="0 0 24 24"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6zm-1 9V3.5L18.5 9H13zM8 13h8v2H8v-2zm0 4h8v2H8v-2zm0-8h2v2H8V9z"/></svg>
+              <div><div class="font-medium text-slate-900">Pricelist Aeroflex (update 2565)</div><div class="text-sm text-slate-500">PDF</div></div>
+            </a>
+            <a href="/documents/22 Price List Maxflex แบบม้วน FR Roll MSR15M.pdf" target="_blank" class="flex items-center gap-4 p-4 bg-white rounded-xl shadow-sm hover:shadow-md transition-shadow">
+              <svg class="w-8 h-8 text-red-600 flex-shrink-0" fill="currentColor" viewBox="0 0 24 24"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6zm-1 9V3.5L18.5 9H13zM8 13h8v2H8v-2zm0 4h8v2H8v-2zm0-8h2v2H8V9z"/></svg>
+              <div><div class="font-medium text-slate-900">Maxflex FR Roll MSR15M</div><div class="text-sm text-slate-500">PDF - แบบม้วน</div></div>
+            </a>
+            <a href="/documents/22 Price list MAXFLEX แบบท่อน FR ST_Rev05_01012025   29-1-68.pdf" target="_blank" class="flex items-center gap-4 p-4 bg-white rounded-xl shadow-sm hover:shadow-md transition-shadow">
+              <svg class="w-8 h-8 text-red-600 flex-shrink-0" fill="currentColor" viewBox="0 0 24 24"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6zm-1 9V3.5L18.5 9H13zM8 13h8v2H8v-2zm0 4h8v2H8v-2zm0-8h2v2H8V9z"/></svg>
+              <div><div class="font-medium text-slate-900">Maxflex FR ST แบบท่อน</div><div class="text-sm text-slate-500">PDF - แบบท่อน</div></div>
+            </a>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- CTA Section -->
+    <section class="py-16 bg-gradient-to-br from-accent-500 to-accent-600 text-white text-center">
+      <div class="max-w-4xl mx-auto px-4">
+        <h2 class="text-2xl md:text-3xl font-bold mb-6">สนใจสินค้าของเรา?</h2>
+        <p class="text-lg text-white/80 mb-8 max-w-2xl mx-auto">
+          ติดต่อเราวันนี้เพื่อรับคำแนะนำและราคาพิเศษ
+        </p>
+        <div class="flex flex-wrap justify-center gap-4">
+          <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" class="bg-white text-accent-600 hover:bg-gray-100 py-3 px-8 rounded-xl font-semibold flex items-center gap-2">
+            <span>แชท</span>
+            <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"><path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/></svg>
+          </a>
+          <a href="tel:0905551415" class="bg-white/10 hover:bg-white/20 text-white py-3 px-8 rounded-xl font-semibold border border-white/30 flex items-center gap-2">
+            <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z"/>
+            </svg>
+            <span>090-555-1415</span>
+          </a>
+        </div>
+      </div>
+    </section>
+  </main>
+
+  <Footer slot="footer" />
+</BaseLayout>
--- a/src/pages/ท่อ-hdpe.astro
+++ b/src/pages/ท่อ-hdpe.astro
@@ -0,0 +1,112 @@
+---
+import BaseLayout from '@/layouts/BaseLayout.astro';
+---
+
+<BaseLayout title="ท่อ HDPE (High Density Polyethylene)" description="ท่อ HDPE ราคาโรงงาน ส่งฟรี กรุงเทพมหานคร ปริมณฑล ท่อ HDPE คุณภาพสูง ทนทาน อายุการใช้งาน 50 ปี">
+  <main class="bg-white min-h-screen">
+    <!-- Hero Section -->
+    <section class="bg-gradient-to-br from-primary-700 to-primary-600 text-white">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-16">
+        <div class="grid lg:grid-cols-2 gap-12 items-center">
+          <div class="order-2 lg:order-1">
+            <span class="inline-block px-4 py-1.5 bg-white/20 text-white rounded-full text-sm font-medium mb-4">ท่อ HDPE</span>
+            <h1 class="text-3xl sm:text-4xl lg:text-5xl font-bold mb-4">ท่อ HDPE (High Density Polyethylene)</h1>
+            <p class="text-lg text-primary-100 mb-8 leading-relaxed">
+              ส่งฟรี กรุงเทพมหานคร ปริมณฑล ท่อ HDPE คุณภาพสูง ทนทานต่อแรงดันสูง เหมาะสำหรับงานประปา ระบบน้ำเย็น และงานอุตสาหกรรม
+            </p>
+            <div class="flex flex-wrap gap-6 mb-8">
+              <div class="flex items-center gap-2 text-white">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span>อายุการใช้งานยาวนานกว่า 50 ปี</span>
+              </div>
+              <div class="flex items-center gap-2 text-white">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span>ทนต่อสารเคมี กรด และด่าง</span>
+              </div>
+              <div class="flex items-center gap-2 text-white">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span>ทนต่อรังสี UV ไม่เป็นสนิม</span>
+              </div>
+            </div>
+            <div class="flex flex-wrap gap-4">
+              <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" class="flex items-center gap-2 bg-white text-primary-700 px-6 py-3 rounded-xl font-semibold hover:bg-primary-50 transition-colors">
+                <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24">
+                  <path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/>
+                </svg>
+                แชทไลน์
+              </a>
+              <a href="tel:0905551415" class="flex items-center gap-2 bg-white/10 hover:bg-white/20 text-white px-6 py-3 rounded-xl font-semibold border border-white/30 transition-colors">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z" />
+                </svg>
+                090-555-1415
+              </a>
+            </div>
+          </div>
+          <div class="order-1 lg:order-2">
+            <div class="rounded-2xl overflow-hidden">
+              <img src="/images/products-cropped/hdpe001.png" alt="ท่อ HDPE (High Density Polyethylene)" class="w-full" loading="eager" />
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Product Details -->
+    <section class="py-16 bg-white">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl font-bold text-primary-700 mb-8">รายละเอียดสินค้า</h2>
+          <div class="prose prose-lg max-w-none">
+            <p class="text-lg text-neutral-700 mb-6">
+              <strong>ท่อ HDPE (High Density Polyethylene)</strong> เป็นท่อพลาสติกคุณภาพสูง ผลิตจากวัสดุ Polyethylene หนาแน่นสูง ทนทานต่อแรงดันสูง เหมาะสำหรับงานประปา ระบบน้ำเย็น และงานอุตสาหกรรม ท่อ HDPE มีอายุการใช้งานยาวนานกว่า 50 ปี ทนต่อสารเคมี กรด และด่าง ทนต่อรังสี UV ไม่เป็นสนิม น้ำหนักเบา ติดตั้งง่าย
+            </p>
+
+            <h3 class="text-xl font-bold text-primary-700 mt-8 mb-4">คุณสมบัติเด่น</h3>
+            <ul class="list-disc pl-6 mb-6 space-y-2 text-neutral-700">
+              <li><strong>อายุการใช้งานยาวนานกว่า 50 ปี</strong> - ทนทานต่อการกัดกร่อน ไม่ผุกร่อน</li>
+              <li><strong>ทนต่อสารเคมี กรด และด่าง</strong> - เหมาะสำหรับงานอุตสาหกรรม</li>
+              <li><strong>ทนต่อรังสี UV ไม่เป็นสนิม</strong> - ใช้กลางแจ้งได้</li>
+              <li><strong>น้ำหนักเบา ติดตั้งง่าย</strong> - ลดค่าใช้จ่ายในการขนส่งและติดตั้ง</li>
+              <li><strong>รับแรงดันได้สูงถึง PN25</strong> - เหมาะสำหรับระบบที่ต้องการแรงดันสูง</li>
+            </ul>
+
+            <h3 class="text-xl font-bold text-primary-700 mt-8 mb-4">วิธีการต่อท่อ HDPE</h3>
+            <ul class="list-disc pl-6 mb-6 space-y-2 text-neutral-700">
+              <li><strong>Electrofusion</strong> - ใช้ข้อต่อ Electrofitting ต่อท่อโดยใช้ไฟฟ้าทำให้ข้อต่อและท่อหลอมละลายเชื่อมติดกัน เหมาะกับท่อขนาดเล็ก-กลาง</li>
+              <li><strong>Butt Fusion</strong> - เปิดปลายท่อทั้งสองด้านให้เรียบ แล้วใช้ความร้อนประกบเข้าด้วยกัน เหมาะกับท่อขนาดใหญ่</li>
+              <li><strong>Mechanical Joint</strong> - ใช้ข้อต่อแบบกลไก เช่น Compression หรือ Flange ติดตั้งง่าย ดึงออกได้ เหมาะกับงานซ่อม</li>
+            </ul>
+
+            <h3 class="text-xl font-bold text-primary-700 mt-8 mb-4">การใช้งาน</h3>
+            <ul class="list-disc pl-6 mb-6 space-y-2 text-neutral-700">
+              <li>ระบบประปาส่วนผู้บริโภค</li>
+              <li>ระบบน้ำอุตสาหกรรม</li>
+              <li>ระบบรดน้ำและชลประทาน</li>
+              <li>ระบบกักเก็บและขนส่งน้ำดื่ม</li>
+              <li>ระบบท่อใต้ดินและท่อลอย</li>
+            </ul>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- CTA -->
+    <section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white">
+      <div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
+        <h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2>
+        <p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ @JPPSELECTION</p>
+        <div class="flex flex-wrap justify-center gap-4">
+          <a href="/contact-us" class="bg-white text-primary-700 py-3 px-8 rounded-xl font-semibold hover:bg-primary-50 transition-colors">ติดต่อเรา</a>
+          <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-8 rounded-xl font-semibold transition-colors">แอดไลน์</a>
+        </div>
+      </div>
+    </section>
+  </main>
+</BaseLayout>
--- a/src/pages/ท่อ-ppr-scg.astro
+++ b/src/pages/ท่อ-ppr-scg.astro
@@ -0,0 +1,104 @@
+---
+import BaseLayout from '@/layouts/BaseLayout.astro';
+---
+
+<BaseLayout title="ท่อ PPR ตราช้าง (SCG)" description="ท่อ PPR ตราช้าง (SCG) ผลิตจากเม็ดพลาสติก PP-R 80 มาตรฐานยุโรป ทนแรงดัน 20 บาร์ ทนอุณหภูมิ 95°C ราคาถูก ส่งฟรี กทม. ปริมณฑล">
+  <main class="bg-white min-h-screen">
+    <!-- Hero Section -->
+    <section class="bg-gradient-to-br from-primary-700 to-primary-600 text-white">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-16">
+        <div class="grid lg:grid-cols-2 gap-12 items-center">
+          <div class="order-2 lg:order-1">
+            <span class="inline-block px-4 py-1.5 bg-white/20 text-white rounded-full text-sm font-medium mb-4">ท่อ PPR</span>
+            <h1 class="text-3xl sm:text-4xl lg:text-5xl font-bold mb-4">ท่อ PPR ตราช้าง (SCG)</h1>
+            <p class="text-lg text-primary-100 mb-8 leading-relaxed">
+              ส่งฟรี กรุงเทพมหานคร ปริมณฑล ท่อ PPR ตราช้าง ผลิตจากเม็ดพลาสติก PP-R 80 มาตรฐานยุโรป ทนแรงดัน 20 บาร์ ทนอุณหภูมิ 95°C
+            </p>
+            <div class="flex flex-wrap gap-6 mb-8">
+              <div class="flex items-center gap-2 text-white">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span>ทนแรงดันได้สูงสุด 20 บาร์</span>
+              </div>
+              <div class="flex items-center gap-2 text-white">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span>ทนต่ออุณหภูมิได้สูงถึง 95°C</span>
+              </div>
+              <div class="flex items-center gap-2 text-white">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span>วัตถุดิบคุณภาพสูงมาตรฐานยุโรป</span>
+              </div>
+            </div>
+            <div class="flex flex-wrap gap-4">
+              <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" class="flex items-center gap-2 bg-white text-primary-700 px-6 py-3 rounded-xl font-semibold hover:bg-primary-50 transition-colors">
+                <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24">
+                  <path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/>
+                </svg>
+                แชทไลน์
+              </a>
+              <a href="tel:0905551415" class="flex items-center gap-2 bg-white/10 hover:bg-white/20 text-white px-6 py-3 rounded-xl font-semibold border border-white/30 transition-colors">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z" />
+                </svg>
+                090-555-1415
+              </a>
+            </div>
+          </div>
+          <div class="order-1 lg:order-2">
+            <div class="rounded-2xl overflow-hidden">
+              <img src="/images/products-cropped/ppr-scg.jpg" alt="ท่อ PPR ตราช้าง (SCG)" class="w-full" loading="eager" />
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Product Details -->
+    <section class="py-16 bg-white">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl font-bold text-primary-700 mb-8">รายละเอียดสินค้า</h2>
+          <div class="prose prose-lg max-w-none">
+            <p class="text-lg text-neutral-700 mb-6">
+              ท่อ PPR ตราช้าง ผลิตจากเม็ดพลาสติก <strong>PP-R 80 (Polypropylene Random Copolymer 80)</strong> วัตถุดิบคุณภาพสูงมาตรฐานยุโรปจาก LyondellBasell สามารถทนแรงดันได้สูงสุด 20 บาร์ ทนต่ออุณหภูมิได้สูงถึง 95°C เชื่อมต่อด้วยความร้อน หลอมท่อและข้อต่อเป็นเนื้อเดียวกัน ไม่มีปัญหารั่วซึม น้ำหนักเบา และราคาคุ้มค่ากว่าเมื่อเทียบกับท่อโลหะ
+            </p>
+            <p class="text-lg text-neutral-700 mb-6">
+              เหมาะสำหรับระบบประปา ระบบประปาน้ำอุ่น ระบบประปาน้ำร้อน ระบบท่อน้ำเย็นในการปรับอากาศ ระบบท่อลมร้อน เป็นต้น ทั้งในบ้าน โรงแรม โรงพยาบาล ห้างสรรพสินค้า อาคารสำนักงาน และอาคารสูง
+            </p>
+            <p class="text-lg text-neutral-700 mb-6">
+              ท่อพีพีอาร์ตราช้าง เป็นท่อที่มีความแข็งแรงสูง ผลิตตามคุณภาพมาตรฐานของเยอรมัน <strong>DIN8077</strong> และ <strong>DIN8078</strong> สามารถเลือกท่อในการใช้งานได้ตามความเหมาะสม
+            </p>
+
+            <h3 class="text-xl font-bold text-primary-700 mt-8 mb-4">คุณสมบัติเด่น</h3>
+            <ul class="list-disc pl-6 mb-6 space-y-2 text-neutral-700">
+              <li><strong>ทนแรงดันได้สูง 20 บาร์</strong> - ผลิตจากวัตถุดิบคุณภาพเยี่ยมมาตรฐานยุโรป กระบวนการผลิตตามมาตรฐาน DIN 8077 และ DIN 8078 ของประเทศเยอรมัน</li>
+              <li><strong>ทนต่ออุณหภูมิได้สูงสุดถึง 95°C</strong> - เหมาะกับการใช้เป็นท่อน้ำร้อนเพื่อการอุปโภคบริโภค</li>
+              <li><strong>สะอาดไม่เป็นสนิม ปราศจากโลหะหนักและสิ่งปนเปื้อน</strong> - น้ำที่ไหลผ่านสะอาดปลอดภัย ไม่เกิดตะไคร่น้ำภายในท่อ</li>
+              <li><strong>ประหยัดพลังงาน</strong> - มีคุณสมบัติเป็นฉนวน ช่วยรักษาอุณหภูมิความร้อนของน้ำได้ดีกว่าท่อโลหะ ลดการสูญเสียความร้อน</li>
+              <li><strong>อายุการใช้งานยาวนาน</strong> - ทนทานต่อการกัดกร่อนของสารเคมี ไม่ผุกร่อนหรือเป็นสนิม</li>
+              <li><strong>น้ำหนักเบา ราคาถูกกว่าท่อทองแดง</strong> - ได้ระบบท่อที่มีประสิทธิภาพในราคาที่คุ้มค่า ง่ายต่อการติดตั้งและขนส่ง</li>
+              <li><strong>ติดตั้งง่าย เชื่อมต่อเป็นเนื้อเดียวกัน ไม่รั่วซึม</strong> - ใช้เครื่องเชื่อมท่อพีพีอาร์ เชื่อมต่อท่อและข้อต่อเข้ากันด้วยความร้อน</li>
+            </ul>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- CTA -->
+    <section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white">
+      <div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
+        <h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2>
+        <p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ @JPPSELECTION</p>
+        <div class="flex flex-wrap justify-center gap-4">
+          <a href="/contact-us" class="bg-white text-primary-700 py-3 px-8 rounded-xl font-semibold hover:bg-primary-50 transition-colors">ติดต่อเรา</a>
+          <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-8 rounded-xl font-semibold transition-colors">แอดไลน์</a>
+        </div>
+      </div>
+    </section>
+  </main>
+</BaseLayout>
--- a/src/pages/ท่อ-ppr-thai-ppr.astro
+++ b/src/pages/ท่อ-ppr-thai-ppr.astro
@@ -0,0 +1,123 @@
+---
+import BaseLayout from '@/layouts/BaseLayout.astro';
+---
+
+<BaseLayout title="ไทยพีพีอาร์ (Thai PPR) | ท่อพีพีอาร์ คุณภาพสูง" description="ไทยพีพีอาร์ (Thai PPR) ทางเลือกที่ดีที่สุดสำหรับงานระบบน้ำคุณภาพสูง ทั้งน้ำร้อนและน้ำเย็น ผลิตจากวัสดุ PP-R เกรดพรีเมียม ทนความร้อน 95°C อายุการใช้งาน 50 ปี">
+  <main class="bg-white min-h-screen">
+    <!-- Hero Section -->
+    <section class="bg-gradient-to-br from-primary-700 to-primary-600 text-white">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-16">
+        <div class="grid lg:grid-cols-2 gap-12 items-center">
+          <div class="order-2 lg:order-1">
+            <span class="inline-block px-4 py-1.5 bg-white/20 text-white rounded-full text-sm font-medium mb-4">ท่อ PPR</span>
+            <h1 class="text-3xl sm:text-4xl lg:text-5xl font-bold mb-4">ไทยพีพีอาร์ (Thai PPR)</h1>
+            <p class="text-lg text-primary-100 mb-8 leading-relaxed">
+              ไทยพีพีอาร์ (Thai PPR) ทางเลือกที่ดีที่สุดสำหรับงานระบบน้ำคุณภาพสูง ทั้งน้ำร้อนและน้ำเย็นในอาคารสมัยใหม่ ผลิตจากวัสดุ Polypropylene Random Copolymer (PPR) เกรดพรีเมียม สะอาด ปลอดภัย และมีสถานะเป็น Food Grade
+            </p>
+            <div class="flex flex-wrap gap-6 mb-8">
+              <div class="flex items-center gap-2 text-white">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span>ทนความร้อน 95°C</span>
+              </div>
+              <div class="flex items-center gap-2 text-white">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span>อายุ 50+ ปี</span>
+              </div>
+              <div class="flex items-center gap-2 text-white">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span>Food Grade</span>
+              </div>
+            </div>
+            <div class="flex flex-wrap gap-4">
+              <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" class="flex items-center gap-2 bg-white text-primary-700 px-6 py-3 rounded-xl font-semibold hover:bg-primary-50 transition-colors">
+                <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24">
+                  <path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/>
+                </svg>
+                แชทไลน์
+              </a>
+              <a href="tel:0905551415" class="flex items-center gap-2 bg-white/10 hover:bg-white/20 text-white px-6 py-3 rounded-xl font-semibold border border-white/30 transition-colors">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z" />
+                </svg>
+                090-555-1415
+              </a>
+            </div>
+          </div>
+          <div class="order-1 lg:order-2">
+            <div class="rounded-2xl overflow-hidden">
+              <img src="/images/products-cropped/ppr-pipe_000C.jpg" alt="ไทยพีพีอาร์ (Thai PPR)" class="w-full" loading="eager" />
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Product Details -->
+    <section class="py-16 bg-white">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl font-bold text-primary-700 mb-8">รายละเอียดสินค้า</h2>
+          <div class="prose prose-lg max-w-none">
+            <p class="text-lg text-neutral-700 leading-relaxed mb-6">
+              <strong>ไทยพีพีอาร์ (Thai PPR)</strong> คือทางเลือกที่ดีที่สุดสำหรับงานระบบน้ำคุณภาพสูง ทั้งน้ำร้อนและน้ำเย็นในอาคารสมัยใหม่ ผลิตจากวัสดุ <strong>Polypropylene Random Copolymer (PPR)</strong> เกรดพรีเมียม ทำให้มั่นใจได้ถึงความสะอาด ปลอดภัย และมีสถานะเป็น <strong>Food Grade</strong> ที่เหมาะสำหรับระบบน้ำดื่มโดยเฉพาะ
+            </p>
+
+            <p class="text-lg text-neutral-700 leading-relaxed mb-6">
+              ด้วยคุณสมบัติเด่นในการ <strong>ทนทานต่ออุณหภูมิสูง</strong> (ได้ถึง 95°C) และแรงดันที่คงที่ ไทยพีพีอาร์ จึงไม่มีปัญหาเรื่องการเกิดสนิมหรือตะกรันสะสม ทำให้มีอายุการใช้งานยาวนานกว่า 50 ปี การติดตั้งใช้เทคโนโลยี <strong>การเชื่อมแบบหลอมรวมด้วยความร้อน (Heat Fusion)</strong> ซึ่งทำให้รอยต่อของท่อและข้อต่อเป็นเนื้อเดียวกัน 100% จึงมั่นใจได้ว่าจะไม่มีปัญหารั่วซึมตลอดอายุการใช้งาน
+            </p>
+
+            <p class="text-lg text-neutral-700 leading-relaxed mb-6">
+              <strong>PPR (Polypropylene Random Copolymer)</strong> เป็นเม็ดพลาสติกคุณภาพสูงชนิดหนึ่ง ผลิตจากเม็ดพลาสติก PP-R(80) ชั้นดีจากยุโรป จึงทำให้มีเนื้อพลาสติกที่มีคุณภาพและความหนาแน่นสูง แสงลอดผ่านได้ไม่ วางใจได้ในคุณภาพและอายุการใช้งาน
+            </p>
+
+            <h3 class="text-xl font-bold text-primary-700 mt-8 mb-4">คุณสมบัติเด่นของไทยพีพีอาร์</h3>
+
+            <ul class="list-disc pl-6 mb-6 space-y-2 text-neutral-700">
+              <li><strong>ทนความร้อนได้สูงถึง 95°C</strong> - เหมาะกับการใช้เป็นท่อน้ำร้อนเพื่อการอุปโภคบริโภค</li>
+              <li><strong>ทนแรงดันได้สูงสุด 20 บาร์</strong> - เหมาะกับงานระบบประปาทั่วไปและอุตสาหกรรม</li>
+              <li><strong>สะอาดไม่เป็นสนิม ปราศจากโลหะหนักและสิ่งปนเปื้อน</strong> - น้ำที่ไหลผ่านท่อ PPR สะอาดปลอดภัย ไม่เป็นสนิม มีสีหรือกลิ่นปกติ</li>
+              <li><strong>ประหยัดพลังงาน รักษาอุณหภูมิของน้ำได้ดีกว่าท่อโลหะ</strong> - ช่วยลดการสูญเสียความร้อนระหว่างที่น้ำร้อนไหลผ่านภายในท่อ</li>
+              <li><strong>อายุการใช้งานยาวนานกว่า 50 ปี</strong> - ทนทานต่อการกัดกร่อนของสารเคมี ไม่ผุกร่อนหรือเป็นสนิม</li>
+              <li><strong>น้ำหนักเบา ติดตั้งง่าย ราคาคุ้มค่ากว่าท่อทองแดง</strong></li>
+              <li><strong>เชื่อมต่อเป็นเนื้อเดียวกัน ด้วยความร้อน (Heat Fusion) ไม่รั่วซึม</strong></li>
+            </ul>
+
+            <h3 class="text-xl font-bold text-primary-700 mt-8 mb-4">ข้อต่อ PPR</h3>
+
+            <p class="text-lg text-neutral-700 leading-relaxed mb-6">
+              ข้อต่อ PPR ผลิตตามมาตรฐาน DIN16962-5 สามารถติดตั้งร่วมกับท่อประเภทอื่นๆ ได้ตามลักษณะงาน เนื่องจากมีข้อต่อประเภทเกลียวชนิดต่างๆ มากมายจึงทำให้สะดวก และไม่มีปัญหาในการใช้งานร่วมกัน รวมทั้งเกลียวเป็นชนิดทำจากทองเหลืองและชนิดทำจากทองเหลืองชุบนิเกิลทำให้ไม่เป็นสนิม อีกทั้งข้อต่อ PPR สามารถทนต่อแรงดันได้สูงสุด 20 บาร์
+            </p>
+
+            <h3 class="text-xl font-bold text-primary-700 mt-8 mb-4">ขนาดและมาตรฐาน</h3>
+
+            <ul class="list-disc pl-6 mb-6 space-y-2 text-neutral-700">
+              <li>มาตรฐานการผลิต: DIN 8077, DIN 8078, ISO 15874</li>
+              <li>ขนาด: 20mm - 160mm</li>
+              <li>ความดันใช้งาน: PN 20 (20 bar)</li>
+              <li>สี: เขียว (น้ำร้อน) / ขาว (น้ำเย็น)</li>
+              <li>วัสดุ: PP-R Type 3</li>
+            </ul>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- CTA -->
+    <section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white">
+      <div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
+        <h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2>
+        <p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ @JPPSELECTION</p>
+        <div class="flex flex-wrap justify-center gap-4">
+          <a href="/contact-us" class="bg-white text-primary-700 py-3 px-8 rounded-xl font-semibold hover:bg-primary-50 transition-colors">ติดต่อเรา</a>
+          <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-8 rounded-xl font-semibold transition-colors">แอดไลน์</a>
+        </div>
+      </div>
+    </section>
+  </main>
+</BaseLayout>
--- a/src/pages/ท่อ-syler.astro
+++ b/src/pages/ท่อ-syler.astro
@@ -0,0 +1,327 @@
+---
+import BaseLayout from '@/layouts/BaseLayout.astro';
+---
+
+<BaseLayout title="ท่อ Syler | ท่อเหล็กบุพีอี" description="จำหน่ายท่อ Syler ท่อเหล็กบุพีอีคุณภาพสูง ราคาโรงงาน ส่งฟรี กทม. ปริมณฑล">
+  <main class="bg-white min-h-screen">
+    <!-- Product Hero Section -->
+    <section class="bg-gradient-to-br from-primary-700 to-primary-600 text-white py-16">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="grid lg:grid-cols-2 gap-12 items-center">
+          <div class="order-2 lg:order-1">
+            <div class="rounded-2xl overflow-hidden">
+              <img src="/images/products-cropped/syler-pipe-cold-water.jpg" alt="ท่อ Syler" class="w-full h-auto rounded-xl" width="600" height="400" loading="eager" />
+            </div>
+          </div>
+          <div class="order-1 lg:order-2">
+            <span class="inline-block px-4 py-1.5 bg-white/20 text-white rounded-full text-sm font-medium mb-4">ท่อ Syler</span>
+            <h1 class="text-3xl sm:text-4xl lg:text-5xl font-bold mb-4">ท่อ Syler | ท่อเหล็กบุพีอี</h1>
+            <p class="text-lg sm:text-xl text-white/80 mb-8 leading-relaxed">
+              จำหน่ายท่อ Syler ท่อเหล็กบุพีอีคุณภาพสูง ราคาโรงงาน ส่งฟรี กรุงเทพมหานคร และปริมณฑล
+            </p>
+            <div class="flex flex-wrap gap-4 mb-8">
+              <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" class="flex items-center gap-2 bg-white text-primary-700 px-6 py-3 rounded-xl font-semibold hover:bg-primary-50 transition-colors">
+                <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"><path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/></svg>
+                แชท
+              </a>
+              <a href="tel:0905551415" class="flex items-center gap-2 bg-white/10 hover:bg-white/20 text-white px-6 py-3 rounded-xl font-semibold border border-white/30 transition-colors">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z"/>
+                </svg>
+                090-555-1415
+              </a>
+            </div>
+            <div class="flex flex-wrap gap-6">
+              <div class="flex items-center gap-2 text-white/80">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span>คุณภาพสูง มาตรฐานอุตสาหกรรม</span>
+              </div>
+              <div class="flex items-center gap-2 text-white/80">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span>ราคาโรงงาน คุ้มค่า</span>
+              </div>
+              <div class="flex items-center gap-2 text-white/80">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span>จัดส่งรวดเร็ว ส่งฟรี กทม. ปริมณฑล</span>
+              </div>
+              <div class="flex items-center gap-2 text-white/80">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span>รับประกันสินค้า</span>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Product Details -->
+    <section class="py-16 bg-white">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-xl font-bold text-primary-700 mb-8">รายละเอียดสินค้า</h2>
+          <div class="prose prose-lg max-w-none">
+            <p class="text-lg text-neutral-700 leading-relaxed mb-4">
+              <strong>ท่อไซเลอร์ (Syler)</strong> เป็นท่อเหล็กกล้า Class M ชุบสังกะสี ภายนอกจะถูกเคลือบด้วยผงโพลีเอทิลีน (PE powder coat) ป้องกันสนิมจากภายนอกอีกชั้นหนึ่ง จึงทำให้มั่นใจได้ว่าท่อไซเลอร์จะมีอายุการใช้งานยาวนานกว่าท่อเหล็ก Galvanized ถึง 50 ปี เพราะไม่เป็นสนิมจากภายนอก
+            </p>
+            <p class="text-lg text-neutral-700 leading-relaxed mb-4">
+              ส่วนภายในถูกบุด้วยพลาสติกโพลีเอทิลีน (PE) เพื่อป้องกันการเกิดสนิมภายใน เนื่องจากน้ำภายในท่อจะไม่สัมผัสกับตัวท่อ ท่อ SYLER ผลิตภายใต้มาตรฐานระบบคุณภาพ ISO 9001:2000 และ FM APPROVED
+            </p>
+
+            <h3 class="text-xl font-bold text-primary-700 mt-8 mb-4">คุณสมบัติเด่น</h3>
+            <ul class="list-disc pl-6 mb-4 space-y-2">
+              <li>ทนแรงดันได้ <strong>50 bar</strong> อุณหภูมิใช้งานได้ถึง <strong>90°C</strong></li>
+              <li>ป้องกันปัญหาท่อรั่วซึมจากการกัดกร่อนของสนิม ท่อเป็นสนิมอุดตัน ท่อตกท้องช้าง ท่อกรอบแตกเมื่ออยู่กลางแจ้ง</li>
+              <li>ทนสารเคมีและสารก่อมะเร็งปนเปื้อน ไม่ลามไฟเมื่อเกิดอัคคีภัย</li>
+              <li>ติดตั้งง่ายแม้อยู่ในที่แคบ</li>
+              <li>ผ่านมาตรฐาน BS1387/85 CLASS M (BSM) ชุบสังกะสีหนากว่าปกติ</li>
+              <li>ผ่านการทดสอบมาตรฐาน BS6920 Part II (ปริมาณโลหะหนัก สี กลิ่น รส และการเจริญเติบโตของเชื้อจุลินทรีย์)</li>
+              <li>ปริมาณโลหะหนักที่ปนเปื้อนต่ำกว่ามาตรฐานตั้งแต่ 20-500 เท่า</li>
+            </ul>
+
+            <h3 class="text-xl font-bold text-primary-700 mt-8 mb-4">การใช้งาน</h3>
+            <ul class="list-disc pl-6 mb-4 space-y-2">
+              <li>ท่อเมนขนาดใหญ่และท่อดับเพลิง</li>
+              <li>ระบบท่อประปาน้ำร้อน น้ำเย็น</li>
+              <li>ท่อเคมี ท่อลม ภายในบ้าน อาคารสูง คอนโด โรงแรม โรงพยาบาล</li>
+              <li>ระบบขนส่งสารเคมี Compression air Chilled pipe</li>
+              <li>ใช้ได้ทั้งภายในและภายนอกอาคาร</li>
+            </ul>
+
+            <h3 class="text-xl font-bold text-primary-700 mt-8 mb-4">ข้อดีของระบบ Grooved Coupling</h3>
+            <ul class="list-disc pl-6 mb-4 space-y-2">
+              <li>ติดตั้งง่าย สะดวกรวดเร็ว ประหยัดค่าแรงและเวลา</li>
+              <li>โยกย้าย เปลี่ยนแปลงรูปแบบการติดตั้ง หรือขยายไลน์ท่อเพิ่มเติมได้โดยง่าย</li>
+              <li>รับแรงสั่นสะเทือน แรงกดจากแผ่นดินไหว ดูดซับเสียงได้ดี</li>
+              <li>รับแรงดันได้สูง 300-735 psi</li>
+              <li>ข้อต่อมี PE เคลือบผิวด้านใน คงคุณสมบัติเด่นของท่อไซเลอร์ไว้ครบ</li>
+            </ul>
+
+            <!-- Product Photos -->
+            <div class="mt-8 space-y-4">
+              <img src="/images/products-misc/SYLER-b01.jpg" alt="ท่อไซเลอร์ (Syler)" class="w-full h-auto rounded-lg shadow-md" width="800" height="600" loading="lazy" />
+              <img src="/images/products-misc/SYLER-b02.jpg" alt="ท่อไซเลอร์ (Syler)" class="w-full h-auto rounded-lg shadow-md" width="800" height="600" loading="lazy" />
+              <img src="/images/products-misc/SYLER-b03.jpg" alt="ท่อไซเลอร์ (Syler)" class="w-full h-auto rounded-lg shadow-md" width="800" height="600" loading="lazy" />
+              <img src="/images/products-misc/syler001.jpg" alt="ท่อไซเลอร์ (Syler)" class="w-full h-auto rounded-lg shadow-md" width="800" height="600" loading="lazy" />
+              <img src="/images/products-misc/syler002.jpg" alt="ท่อไซเลอร์ (Syler)" class="w-full h-auto rounded-lg shadow-md" width="800" height="600" loading="lazy" />
+              <img src="/images/products-misc/syler003.jpg" alt="ท่อไซเลอร์ (Syler)" class="w-full h-auto rounded-lg shadow-md" width="800" height="600" loading="lazy" />
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Installation Section -->
+    <section class="py-16 bg-neutral-50">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-xl font-bold text-primary-700 mb-12 text-center">วิธีการติดตั้ง</h2>
+
+          <!-- Step 1: Grooved -->
+          <div class="mb-16">
+            <h3 class="text-xl font-bold text-neutral-800 mb-8 flex items-center">
+              <span class="bg-primary-600 text-white w-10 h-10 rounded-full flex items-center justify-center mr-4 text-lg">1</span>
+              การกรู๊ฟท่อ (Grooved)
+            </h3>
+
+            <div class="bg-white rounded-2xl p-8 mb-8">
+              <div class="max-w-3xl mx-auto text-center">
+                <img src="/images/groove-coupling/G1.png" alt="เครื่องกรู๊ฟท่อไซเลอร์" class="w-full h-auto rounded-lg mb-6" style="max-height: 300px; object-fit: contain;" width="800" height="400" loading="lazy" />
+                <h4 class="text-xl font-bold text-neutral-800 mb-2">เครื่องกรู๊ฟท่อไซเลอร์</h4>
+                <p class="text-neutral-600">หมายเหตุ: การ Grooved ท่อ Syler ต้องใช้เครื่อง Grooved ของ Syler เท่านั้น</p>
+              </div>
+            </div>
+
+            <div class="grid md:grid-cols-2 gap-6">
+              <div class="bg-white border border-neutral-200 rounded-xl p-6 shadow-sm">
+                <div class="flex items-center mb-4">
+                  <span class="bg-primary-100 text-primary-700 px-3 py-1 rounded-full text-sm font-medium">ขั้นตอนที่ 1.1 - 1.3</span>
+                </div>
+                <p class="text-neutral-700 mb-4">ตั้งเครื่องกรู๊ฟ สอดท่อให้หน้าตัดท่อชนแนบกับหัวกรู๊ฟ ปรับระดับท่อที่วางพาดกับขาตั้งท่อด้วยมาตรวัดระดับน้ำ จากนั้นดึงคันโยกไฮโดริกให้หัวกดทับเนื้อท่อแล้ว จึงเปิดสวิทช์เครื่องเพื่อเริ่มทำการกรู๊ฟ</p>
+                <img src="/images/groove-coupling/G2.png" alt="การกรู๊ฟท่อ" class="w-full h-48 object-cover rounded-lg" width="600" height="400" loading="lazy" />
+              </div>
+
+              <div class="bg-white border border-neutral-200 rounded-xl p-6 shadow-sm">
+                <div class="flex items-center mb-4">
+                  <span class="bg-primary-100 text-primary-700 px-3 py-1 rounded-full text-sm font-medium">ขั้นตอนที่ 1.4</span>
+                </div>
+                <p class="text-neutral-700 mb-4">เมื่อกรู๊ฟเสร็จแล้ว ให้ปิดเครื่องแล้วยกคันโยกไฮโดริกขึ้น นำสายวัดระยะร่องกรู๊ฟมาวัดร่องตามขนาดท่อที่กรู๊ฟ ทั้งนี้ระยะความลึกของร่องกรู๊ฟอนุโลมให้ขาดเกินได้ไม่เกิน 3 มิลลิเมตร</p>
+                <div class="grid grid-cols-2 gap-3">
+                  <img src="/images/groove-coupling/G6.png" alt="การวัดร่องกรู๊ฟ" class="w-full h-32 object-cover rounded-lg" width="400" height="300" loading="lazy" />
+                  <img src="/images/groove-coupling/G7.png" alt="ล็อคระดับปั้มไฮโดริก" class="w-full h-32 object-cover rounded-lg" width="400" height="300" loading="lazy" />
+                </div>
+              </div>
+            </div>
+
+            <div class="bg-amber-50 border-l-4 border-amber-500 rounded-r-xl p-6 mt-6">
+              <h4 class="font-bold text-amber-800 mb-2">ข้อควรระวังในการกรู๊ฟ</h4>
+              <p class="text-amber-700">การกรู๊ฟท่อต่อเนื่องเป็นระยะเวลานานหัวกรู๊ฟท่อจะมีความร้อนสะสม หากหัวกรู๊ฟร้อนเกินไปจะทำให้พลาสติกละลายได้ ควรพักเพื่อให้หัวกรู๊ฟเย็นลงจึงค่อยกรู๊ฟท่อต่อไป</p>
+            </div>
+          </div>
+
+          <!-- Step 2: Coupling -->
+          <div class="mb-16">
+            <h3 class="text-xl font-bold text-neutral-800 mb-8 flex items-center">
+              <span class="bg-primary-600 text-white w-10 h-10 rounded-full flex items-center justify-center mr-4 text-lg">2</span>
+              การใส่ข้อต่อคัปปิ้ง (Coupling)
+            </h3>
+
+            <p class="text-lg text-neutral-700 mb-8">เมื่อกรู๊ฟท่อเรียบร้อยแล้ว ให้ทำการสวมข้อต่อ Coupling ตามขั้นตอนดังนี้</p>
+
+            <div class="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
+              <div class="bg-white border border-neutral-200 rounded-xl p-6 shadow-sm">
+                <span class="bg-blue-100 text-blue-700 px-3 py-1 rounded-full text-sm font-medium mb-3 inline-block">ขั้นตอนที่ 2.1</span>
+                <p class="text-neutral-700 mb-4">ทากาวเฮอร์เมสซีล 55 ที่หน้าตัดท่อเพื่อป้องกันสนิมบริเวณหน้าตัดท่อ</p>
+                <img src="/images/groove-coupling/G8.png" alt="ทากาวเฮอร์เมสซีล" class="w-full h-40 object-cover rounded-lg" width="600" height="400" loading="lazy" />
+              </div>
+
+              <div class="bg-white border border-neutral-200 rounded-xl p-6 shadow-sm">
+                <span class="bg-blue-100 text-blue-700 px-3 py-1 rounded-full text-sm font-medium mb-3 inline-block">ขั้นตอนที่ 2.2</span>
+                <p class="text-neutral-700 mb-4">นำ Grooved line gasket มาสวมที่ปลายท่อ เพื่อป้องกันไม่ให้น้ำที่ไหลผ่านสัมผัสหน้าตัดท่อ</p>
+                <img src="/images/groove-coupling/G9.png" alt="สวม Grooved line gasket" class="w-full h-40 object-cover rounded-lg" width="600" height="400" loading="lazy" />
+              </div>
+
+              <div class="bg-white border border-neutral-200 rounded-xl p-6 shadow-sm">
+                <span class="bg-blue-100 text-blue-700 px-3 py-1 rounded-full text-sm font-medium mb-3 inline-block">ขั้นตอนที่ 2.3</span>
+                <p class="text-neutral-700 mb-4">ทาน้ำยาหล่อลื่น Lubricant ให้ทั่วแหวนยาง EPDM เพื่อยืดอายุการใช้งาน</p>
+                <img src="/images/groove-coupling/G10.png" alt="ทาน้ำยาหล่อลื่น" class="w-full h-40 object-cover rounded-lg" width="600" height="400" loading="lazy" />
+              </div>
+
+              <div class="bg-white border border-neutral-200 rounded-xl p-6 shadow-sm">
+                <span class="bg-blue-100 text-blue-700 px-3 py-1 rounded-full text-sm font-medium mb-3 inline-block">ขั้นตอนที่ 2.4</span>
+                <p class="text-neutral-700 mb-4">นำยางที่ทา Lubricant แล้วมาสวมเข้ากับท่อก่อนจากนั้นจึงสวมเข้ากับข้อต่อ</p>
+                <div class="grid grid-cols-2 gap-2">
+                  <img src="/images/groove-coupling/G11.png" alt="สวมยางเข้ากับท่อ" class="w-full h-28 object-cover rounded-lg" width="400" height="300" loading="lazy" />
+                  <img src="/images/groove-coupling/G12.png" alt="สวมเข้ากับข้อต่อ" class="w-full h-28 object-cover rounded-lg" width="400" height="300" loading="lazy" />
+                </div>
+              </div>
+
+              <div class="bg-white border border-neutral-200 rounded-xl p-6 shadow-sm md:col-span-2">
+                <span class="bg-blue-100 text-blue-700 px-3 py-1 rounded-full text-sm font-medium mb-3 inline-block">ขั้นตอนที่ 2.5</span>
+                <p class="text-neutral-700 mb-4">นำข้อต่อ Coupling มาประกบพร้อมขันน๊อตจนแน่น</p>
+                <img src="/images/groove-coupling/G13.png" alt="ขันน๊อตจนแน่น" class="w-full h-48 object-cover rounded-lg" width="600" height="400" loading="lazy" />
+              </div>
+            </div>
+          </div>
+
+          <!-- Torque Specifications -->
+          <div class="mt-16">
+            <h3 class="text-xl font-bold text-neutral-800 mb-8 flex items-center">
+              <span class="bg-primary-600 text-white w-10 h-10 rounded-full flex items-center justify-center mr-4 text-lg">3</span>
+              แรงบิด (Torque) ที่ควรใช้ในการขันน๊อต
+            </h3>
+
+            <div class="bg-white rounded-xl p-8 shadow-sm border border-neutral-200">
+              <p class="text-lg text-neutral-700 mb-6">
+                การขันน๊อตด้วยแรงบิดที่ถูกต้องเป็นสิ่งสำคัญเพื่อให้ข้อต่อกรู๊ฟประกอบติดแน่นและปลอดภัย ควรขันน๊อตให้แน่นพอประมาณ ไม่แน่นเกินไปซึ่งอาจทำให้ยางเสียหาย หรือหลวมเกินไปซึ่งอาจทำให้รั่วซึม
+              </p>
+
+              <div class="overflow-x-auto">
+                <table class="w-full rounded-lg overflow-hidden">
+                  <thead class="bg-primary-600 text-white">
+                    <tr>
+                      <th class="px-4 py-3 text-center font-bold text-sm">ขนาดท่อ (นิ้ว)</th>
+                      <th class="px-4 py-3 text-center font-bold text-sm">ขนาดน๊อต</th>
+                      <th class="px-4 py-3 text-center font-bold text-sm">แรงบิด (Torque)</th>
+                      <th class="px-4 py-3 text-center font-bold text-sm">หมายเหตุ</th>
+                    </tr>
+                  </thead>
+                  <tbody>
+                    <tr class="border-b border-neutral-100">
+                      <td class="px-4 py-3 text-center text-neutral-700">1/2" - 2"</td>
+                      <td class="px-4 py-3 text-center text-neutral-700">3/8" - 1/2"</td>
+                      <td class="px-4 py-3 text-center text-neutral-700 font-medium">35-65 ft-lb</td>
+                      <td class="px-4 py-3 text-center text-neutral-700">47-88 Nm</td>
+                    </tr>
+                    <tr class="border-b border-neutral-100 bg-neutral-50">
+                      <td class="px-4 py-3 text-center text-neutral-700">2-1/2" - 4"</td>
+                      <td class="px-4 py-3 text-center text-neutral-700">1/2"</td>
+                      <td class="px-4 py-3 text-center text-neutral-700 font-medium">65-100 ft-lb</td>
+                      <td class="px-4 py-3 text-center text-neutral-700">88-136 Nm</td>
+                    </tr>
+                    <tr class="border-b border-neutral-100">
+                      <td class="px-4 py-3 text-center text-neutral-700">5" - 8"</td>
+                      <td class="px-4 py-3 text-center text-neutral-700">5/8"</td>
+                      <td class="px-4 py-3 text-center text-neutral-700 font-medium">100-150 ft-lb</td>
+                      <td class="px-4 py-3 text-center text-neutral-700">136-203 Nm</td>
+                    </tr>
+                    <tr class="border-b border-neutral-100 bg-neutral-50">
+                      <td class="px-4 py-3 text-center text-neutral-700">10" - 12"</td>
+                      <td class="px-4 py-3 text-center text-neutral-700">3/4"</td>
+                      <td class="px-4 py-3 text-center text-neutral-700 font-medium">150-200 ft-lb</td>
+                      <td class="px-4 py-3 text-center text-neutral-700">203-271 Nm</td>
+                    </tr>
+                    <tr>
+                      <td class="px-4 py-3 text-center text-neutral-700">14" - 24"</td>
+                      <td class="px-4 py-3 text-center text-neutral-700">7/8"</td>
+                      <td class="px-4 py-3 text-center text-neutral-700 font-medium">200-300 ft-lb</td>
+                      <td class="px-4 py-3 text-center text-neutral-700">271-407 Nm</td>
+                    </tr>
+                  </tbody>
+                </table>
+              </div>
+
+              <div class="bg-amber-50 border-l-4 border-amber-500 rounded-r-xl p-6 mt-6">
+                <h4 class="font-bold text-amber-800 mb-2">ข้อควรระวังเรื่องแรงบิด</h4>
+                <ul class="text-amber-700 space-y-1">
+                  <li>• ควรใช้คันทวนแรง (Torque Wrench) เพื่อให้ได้แรงบิดที่แม่นยำ</li>
+                  <li>• ขันน๊อตสลับกันเป็นวงกลม (Cross Pattern) เพื่อให้แรงกระจายอย่างเท่าเทียม</li>
+                  <li>• หากไม่แน่ใจควรปรึกษาผู้ผลิตหรือตัวแทนจำหน่าย</li>
+                </ul>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- FAQ Section -->
+    <section id="faq" class="py-16 bg-white">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-xl font-bold text-primary-700 mb-8">คำถามที่พบบ่อย</h2>
+          <div class="space-y-4">
+            <div class="bg-neutral-50 rounded-lg p-4">
+              <h3 class="font-semibold text-neutral-800 mb-2">Q: ท่อไซเลอร์ต่างจากท่อ PVC ธรรมดาอย่างไร?</h3>
+              <p class="text-neutral-700">ท่อไซเลอร์มีโครงสร้างเป็นเหล็กกล้าชุบสังกะสีและบุ PE ภายใน ทนแรงดันสูงและทนสนิมได้ดีกว่า PVC ธรรมดา เหมาะสำหรับงานที่ต้องการความแข็งแรงและทนความร้อน</p>
+            </div>
+            <div class="bg-neutral-50 rounded-lg p-4">
+              <h3 class="font-semibold text-neutral-800 mb-2">Q: ขนาดเส้นผ่านศูนย์กลางเลือกอย่างไร?</h3>
+              <p class="text-neutral-700">ขึ้นอยู่กับปริมาณน้ำที่ต้องการส่งและแรงดันในระบบ ควรปรึกษาวิศวกรเพื่อคำนวณขนาดที่เหมาะสม</p>
+            </div>
+            <div class="bg-neutral-50 rounded-lg p-4">
+              <h3 class="font-semibold text-neutral-800 mb-2">Q: ติดตั้งยากไหม?</h3>
+              <p class="text-neutral-700">การติดตั้งท่อไซเลอร์ง่ายกว่าท่อเหล็กธรรมดา เพราะใช้ระบบ Grooved Coupling ที่ไม่ต้องเชื่อม สามารถติดตั้งได้รวดเร็ว</p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Contact CTA -->
+    <section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white">
+      <div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
+        <h2 class="text-xl sm:text-2xl font-bold mb-6">สนใจสินค้าของเรา?</h2>
+        <p class="text-lg text-white/80 mb-8 max-w-2xl mx-auto">
+          ติดต่อเราวันนี้เพื่อรับคำแนะนำและราคาพิเศษ
+        </p>
+        <div class="flex flex-wrap justify-center gap-4">
+          <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" class="flex items-center gap-2 bg-white text-primary-700 px-6 py-3 rounded-xl font-semibold hover:bg-primary-50 transition-colors">
+            <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"><path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/></svg>
+            แชท
+          </a>
+          <a href="tel:0905551415" class="flex items-center gap-2 bg-white/10 hover:bg-white/20 text-white px-6 py-3 rounded-xl font-semibold border border-white/30 transition-colors">
+            โทร 090-555-1415
+          </a>
+        </div>
+      </div>
+    </section>
+  </main>
+</BaseLayout>
--- a/src/pages/ท่อ-upvc.astro
+++ b/src/pages/ท่อ-upvc.astro
@@ -0,0 +1,123 @@
+---
+import BaseLayout from '@/layouts/BaseLayout.astro';
+---
+
+<BaseLayout title="ท่อ UPVC (Unplasticized Polyvinyl Chloride)" description="ท่อ UPVC ราคาโรงงาน ส่งฟรี กรุงเทพมหานคร ปริมณฑล ท่อยูพีวีซี ทนสารเคมี ทนความร้อน สำหรับงานอุตสาหกรรม">
+  <main class="bg-white min-h-screen">
+    <!-- Hero Section -->
+    <section class="bg-gradient-to-br from-primary-700 to-primary-600 text-white">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-16">
+        <div class="grid lg:grid-cols-2 gap-12 items-center">
+          <div class="order-2 lg:order-1">
+            <span class="inline-block px-4 py-1.5 bg-white/20 text-white rounded-full text-sm font-medium mb-4">ท่อ UPVC</span>
+            <h1 class="text-3xl sm:text-4xl lg:text-5xl font-bold mb-4">ท่อ UPVC (Unplasticized Polyvinyl Chloride)</h1>
+            <p class="text-lg text-primary-100 mb-8 leading-relaxed">
+              ส่งฟรี กรุงเทพมหานคร ปริมณฑล ท่อ UPVC ทนสารเคมี ทนความร้อน สำหรับงานอุตสาหกรรม ระบบน้ำเสีย ระบบระบายน้ำ
+            </p>
+            <div class="flex flex-wrap gap-6 mb-8">
+              <div class="flex items-center gap-2 text-white">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span>ทนสารเคมีได้ดี</span>
+              </div>
+              <div class="flex items-center gap-2 text-white">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span>ทนต่อสภาพอากาศ</span>
+              </div>
+              <div class="flex items-center gap-2 text-white">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span>ทนความร้อนได้ถึง 60°C</span>
+              </div>
+            </div>
+            <div class="flex flex-wrap gap-4">
+              <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" class="flex items-center gap-2 bg-white text-primary-700 px-6 py-3 rounded-xl font-semibold hover:bg-primary-50 transition-colors">
+                <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24">
+                  <path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/>
+                </svg>
+                แชทไลน์
+              </a>
+              <a href="tel:0905551415" class="flex items-center gap-2 bg-white/10 hover:bg-white/20 text-white px-6 py-3 rounded-xl font-semibold border border-white/30 transition-colors">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z" />
+                </svg>
+                090-555-1415
+              </a>
+            </div>
+          </div>
+          <div class="order-1 lg:order-2">
+            <div class="rounded-2xl overflow-hidden">
+              <img src="/images/products-cropped/upvc-pipe_000C.jpg" alt="ท่อ UPVC" class="w-full" loading="eager" />
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Product Details -->
+    <section class="py-16 bg-white">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl font-bold text-primary-700 mb-8">รายละเอียดสินค้า</h2>
+          <div class="prose prose-lg max-w-none">
+            <p class="text-lg text-neutral-700 mb-6">
+              <strong>ท่อ UPVC (Unplasticized Polyvinyl Chloride)</strong> หรือ ท่อยูพีวีซี เป็นท่อพลาสติกที่มีความแข็งแรงและทนทานต่อสารเคมี ใช้ในงานเดินระบบน้ำทิ้ง ระบายน้ำเสีย ทนเคมีใช้ในโรงงานอุตสาหกรรมเคมี หรือเป็นระบบเดินของเหลวที่มีสารเคมีเจือปน สามารถทนอุณหภูมิได้ถึง 60 องศาเซลเซียส มีลักษณะ <strong>สีเทาเข้ม / สีเทาอ่อน</strong> ต่างจากท่อ PVC ทั่วไปที่มักเป็นสีฟ้า
+            </p>
+            <p class="text-lg text-neutral-700 mb-6">
+              ท่อและอุปกรณ์ยูพีวีซี สามารถใช้กาวทาท่อ UPVC ในการเชื่อมต่อ ซึ่งมีความรวดเร็วและง่ายต่อการติดตั้ง
+            </p>
+
+            <h3 class="text-xl font-bold text-primary-700 mt-8 mb-4">การใช้งาน ท่อ UPVC</h3>
+            <ul class="list-disc pl-6 mb-6 space-y-2 text-neutral-700">
+              <li>งานท่อน้ำเคมี</li>
+              <li>โรงงานอุตสาหกรรม ห้องเย็น ห้องแช่แข็ง ห้องปฏิบัติการ ห้องแล็บ</li>
+              <li>ท่อน้ำเสีย ท่อน้ำทิ้ง</li>
+              <li>ท่อน้ำที่มีสารเคมีปนเปื้อน</li>
+              <li>สระว่ายน้ำ (มีคลอรีนหรือสารเคมี)</li>
+              <li>งานทนสารเคมีเข้มข้น</li>
+            </ul>
+
+            <h3 class="text-xl font-bold text-primary-700 mt-8 mb-4">คุณสมบัติเด่นของท่อ UPVC</h3>
+            <ul class="list-disc pl-6 mb-6 space-y-2 text-neutral-700">
+              <li><strong>ทนสารเคมีได้ดี</strong></li>
+              <li><strong>ทนต่อสภาพอากาศ</strong></li>
+              <li><strong>ทนความร้อนได้ถึง 60°C</strong></li>
+              <li><strong>ทนการกัดกร่อน</strong></li>
+              <li><strong>ติดตั้งง่ายด้วยกาว UPVC</strong></li>
+              <li><strong>น้ำหนักเบา ขนส่งสะดวก</strong></li>
+            </ul>
+
+            <h3 class="text-xl font-bold text-primary-700 mt-8 mb-4">มาตรฐานและการเลือกใช้</h3>
+            <p class="text-lg text-neutral-700 mb-6">
+              ปัจจุบันยังไม่มีมาตรฐาน มอก. รองรับท่อและวาล์ว UPVC โดยตรง แต่สามารถใช้มาตรฐาน <strong>ASTM</strong> และมาตรฐาน <strong>Sch.80</strong> ตามมาตรฐานที่ยุโรปและเอเชียใช้ ซึ่งมีทั้งท่อและวาล์ว UPVC ที่ผลิตในยุโรปและผลิตในเอเชีย
+            </p>
+            <p class="text-lg text-neutral-700 mb-6">
+              การเลือกใช้ท่อและวาล์ว UPVC ควรปรึกษาวิศวกรออกแบบ และควรใช้ตามแบบที่ถูกออกแบบโดยมีวิศวกรเซ็นสำนักงานกำกับ เพื่อเป็นการประหยัดงบประมาณและไม่ Over Design
+            </p>
+
+            <h3 class="text-xl font-bold text-primary-700 mt-8 mb-4">ขนาดท่อ UPVC</h3>
+            <p class="text-lg text-neutral-700 mb-6">
+              ท่อ UPVC มีขนาดตั้งแต่ <strong>1/2"</strong> ไปจนถึง <strong>12"</strong> เหมาะสำหรับงานอุตสาหกรรมและงานระบายน้ำทิ้ง
+            </p>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- CTA -->
+    <section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white">
+      <div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
+        <h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2>
+        <p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ @JPPSELECTION</p>
+        <div class="flex flex-wrap justify-center gap-4">
+          <a href="/contact-us" class="bg-white text-primary-700 py-3 px-8 rounded-xl font-semibold hover:bg-primary-50 transition-colors">ติดต่อเรา</a>
+          <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-8 rounded-xl font-semibold transition-colors">แอดไลน์</a>
+        </div>
+      </div>
+    </section>
+  </main>
+</BaseLayout>
--- a/src/pages/ท่อ-xy-lent.astro
+++ b/src/pages/ท่อ-xy-lent.astro
@@ -0,0 +1,222 @@
+---
+import BaseLayout from '@/layouts/BaseLayout.astro';
+---
+<BaseLayout title="ท่อ XYLENT - ดีล พลัส เทค" description="ท่อระบายน้ำ 3 ชั้น ไซเลนท์ (XYLENT) ระบบ Push Fit เงียบสนิท 22 เดซิเบล จาก Poloplast">
+  <section class="bg-gradient-to-br from-primary-700 to-primary-600 text-white py-12">
+    <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+      <nav class="text-sm mb-4 text-primary-100">
+        <a href="/" class="hover:text-white">หน้าแรก</a> / <a href="/all-products" class="hover:text-white">สินค้าทั้งหมด</a> / <span class="text-white">ท่อ XYLENT</span>
+      </nav>
+      <div class="grid lg:grid-cols-2 gap-8 items-center">
+        <div class="img-hover rounded-2xl overflow-hidden bg-white/10">
+          <img src="/images/products-cropped/XYLENT_001.png" alt="ท่อ XYLENT" class="w-full" loading="eager" />
+        </div>
+        <div>
+          <span class="text-sm text-primary-200 font-medium">ท่อระบายน้ำ</span>
+          <h1 class="text-3xl lg:text-4xl font-bold mt-2 mb-4">ท่อระบายน้ำ 3 ชั้น ไซเลนท์ (XYLENT)</h1>
+          <p class="text-primary-100 text-lg mb-6">นวัตกรรมท่อระบายน้ำคุณภาพสูงจาก Poloplast ผู้ผลิตชั้นนำจากยุโรป ด้วยเทคโนโลยี 3 ชั้นที่ลดเสียงรบกวนได้อย่างมีประสิทธิภาพ ระดับเสียงเพียง 22 เดซิเบล ซึ่งเงียบกว่าท่อระบายน้ำทั่วไปถึง 3 เท่า</p>
+          <div class="flex flex-wrap gap-4">
+            <a href="/contact-us" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-6 rounded-xl font-semibold">สอบถามราคา</a>
+            <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" class="bg-white/10 hover:bg-white/20 text-white py-3 px-6 rounded-xl font-semibold border border-white/30">แอดไลน์</a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </section>
+
+  <!-- Product Features -->
+  <section class="py-16 bg-white">
+    <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+      <div class="text-center mb-12">
+        <h2 class="text-3xl font-bold text-primary-700 mb-4">เทคโนโลยี 3 ชั้น ไซเลนท์</h2>
+        <p class="text-neutral-600 max-w-2xl mx-auto">โครงสร้างผนังท่อ 3 ชั้นที่ทำงานร่วมกันในการลดเสียงและเพิ่มความแข็งแรง ผลิตจาก Polypropylene (PP) เกรดพิเศษ ทนทานต่อความร้อนและสารเคมี</p>
+      </div>
+      <div class="grid md:grid-cols-3 gap-8">
+        <div class="bg-neutral-50 rounded-xl p-6 text-center">
+          <div class="w-16 h-16 bg-primary-100 rounded-full flex items-center justify-center mx-auto mb-4">
+            <svg class="w-8 h-8 text-primary-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 12l5 5L20 7" />
+            </svg>
+          </div>
+          <h3 class="font-semibold text-primary-700 mb-2">เงียบสนิท 22 dB</h3>
+          <p class="text-sm text-neutral-600">ระดับเสียงเพียง 22 เดซิเบล เทียบเท่ากับเสียงกระซิบ ทำให้ห้องน้ำและพื้นที่ใกล้เคียงเงียบสงบ</p>
+        </div>
+        <div class="bg-neutral-50 rounded-xl p-6 text-center">
+          <div class="w-16 h-16 bg-primary-100 rounded-full flex items-center justify-center mx-auto mb-4">
+            <svg class="w-8 h-8 text-primary-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z" />
+            </svg>
+          </div>
+          <h3 class="font-semibold text-primary-700 mb-2">ระบบ Push Fit</h3>
+          <p class="text-sm text-neutral-600">ต่อและถอดได้ง่าย ติดตั้งง่าย รวดเร็ว ไม่ต้องใช้กาวหรือเครื่องมือพิเศษ</p>
+        </div>
+        <div class="bg-neutral-50 rounded-xl p-6 text-center">
+          <div class="w-16 h-16 bg-primary-100 rounded-full flex items-center justify-center mx-auto mb-4">
+            <svg class="w-8 h-8 text-primary-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z" />
+            </svg>
+          </div>
+          <h3 class="font-semibold text-primary-700 mb-2">ทนความร้อน 90°C</h3>
+          <p class="text-sm text-neutral-600">ทนความร้อนได้ถึง 90°C เหมาะสำหรับน้ำร้อนและน้ำเย็น ใช้งานได้ยาวนานตลอดอายุอาคาร</p>
+        </div>
+      </div>
+    </div>
+  </section>
+
+  <!-- Benefits -->
+  <section class="py-16 bg-neutral-50">
+    <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+      <div class="grid lg:grid-cols-2 gap-12 items-center">
+        <div>
+          <h2 class="text-3xl font-bold text-primary-700 mb-6">ข้อดีของท่อระบายน้ำ ไซเลนท์</h2>
+          <ul class="space-y-4">
+            <li class="flex items-start gap-3">
+              <span class="w-6 h-6 bg-primary-600 text-white rounded-full flex items-center justify-center flex-shrink-0 mt-0.5">✓</span>
+              <span class="text-neutral-700"><strong>เงียบสนิท:</strong> ลดเสียงรบกวนจากการไหลของน้ำได้อย่างมีประสิทธิภาพ เหมาะสำหรับอาคารที่ต้องการความเงียบสงบ</span>
+            </li>
+            <li class="flex items-start gap-3">
+              <span class="w-6 h-6 bg-primary-600 text-white rounded-full flex items-center justify-center flex-shrink-0 mt-0.5">✓</span>
+              <span class="text-neutral-700"><strong>ติดตั้งง่าย รวดเร็ว:</strong> ระบบ Push Fit ประหยัดเวลาในการติดตั้งและซ่อมแซม</span>
+            </li>
+            <li class="flex items-start gap-3">
+              <span class="w-6 h-6 bg-primary-600 text-white rounded-full flex items-center justify-center flex-shrink-0 mt-0.5">✓</span>
+              <span class="text-neutral-700"><strong>ป้องกันการรั่วซึม:</strong> ระบบล็อกแน่นหนึบ ป้องกันการรั่วซึมได้ดีเยี่ยม</span>
+            </li>
+            <li class="flex items-start gap-3">
+              <span class="w-6 h-6 bg-primary-600 text-white rounded-full flex items-center justify-center flex-shrink-0 mt-0.5">✓</span>
+              <span class="text-neutral-700"><strong>ทนเคมี:</strong> ทนทานต่อสารเคมีในครัวเรือนและงานอุตสาหกรรม</span>
+            </li>
+            <li class="flex items-start gap-3">
+              <span class="w-6 h-6 bg-primary-600 text-white rounded-full flex items-center justify-center flex-shrink-0 mt-0.5">✓</span>
+              <span class="text-neutral-700"><strong>รับแรงกดดันได้สูง:</strong> โครงสร้าง 3 ชั้นให้ความแข็งแรงในการรับแรงกดดันจากภายนอกสูง</span>
+            </li>
+            <li class="flex items-start gap-3">
+              <span class="w-6 h-6 bg-primary-600 text-white rounded-full flex items-center justify-center flex-shrink-0 mt-0.5">✓</span>
+              <span class="text-neutral-700"><strong>อายุการใช้งานยาวนาน:</strong> ไม่เสื่อมสภาพง่าย มีอายุการใช้งานยาวนานตลอดอาคาร</span>
+            </li>
+          </ul>
+        </div>
+        <div class="grid grid-cols-2 gap-4">
+          <img src="/images/products-raw/xylent/XYLENT_004-805x1024.png" alt="XYLENT product" class="rounded-xl img-hover" loading="lazy" />
+          <img src="/images/products-raw/xylent/XYLENT_031-771x1024.png" alt="XYLENT product" class="rounded-xl img-hover" loading="lazy" />
+          <img src="/images/products-raw/xylent/XYLENT_016-1024x617.png" alt="XYLENT product" class="rounded-xl img-hover" loading="lazy" />
+          <img src="/images/products-raw/xylent/XYLENT_008-1024x357.png" alt="XYLENT product" class="rounded-xl img-hover" loading="lazy" />
+        </div>
+      </div>
+    </div>
+  </section>
+
+  <!-- Applications -->
+  <section class="py-16 bg-white">
+    <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+      <h2 class="text-3xl font-bold text-primary-700 mb-8 text-center">การใช้งานท่อ XYLENT</h2>
+      <div class="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
+        <div class="flex items-center gap-4 bg-neutral-50 rounded-xl p-4">
+          <div class="w-12 h-12 bg-primary-100 rounded-full flex items-center justify-center flex-shrink-0">
+            <svg class="w-6 h-6 text-primary-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 21V5a2 2 0 00-2-2H7a2 2 0 00-2 2v16m14 0h2m-2 0h-5m-9 0H3m2 0h5M9 7h1m-1 4h1m4-4h1m-1 4h1m-5 10v-5a1 1 0 011-1h2a1 1 0 011 1v5m-4 0h4" />
+            </svg>
+          </div>
+          <span class="text-neutral-700 font-medium">ระบบระบายน้ำในอาคารสูง</span>
+        </div>
+        <div class="flex items-center gap-4 bg-neutral-50 rounded-xl p-4">
+          <div class="w-12 h-12 bg-primary-100 rounded-full flex items-center justify-center flex-shrink-0">
+            <svg class="w-6 h-6 text-primary-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-6 0a1 1 0 001-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 001 1m-6 0h6" />
+            </svg>
+          </div>
+          <span class="text-neutral-700 font-medium">ระบบน้ำทิ้งในบ้านพัก</span>
+        </div>
+        <div class="flex items-center gap-4 bg-neutral-50 rounded-xl p-4">
+          <div class="w-12 h-12 bg-primary-100 rounded-full flex items-center justify-center flex-shrink-0">
+            <svg class="w-6 h-6 text-primary-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 3v4M3 5h4M6 17v4m-2-2h4m5-16l2.286 6.857L21 12l-5.714 2.143L13 21l-2.286-6.857L5 12l5.714-2.143L13 3z" />
+            </svg>
+          </div>
+          <span class="text-neutral-700 font-medium">โรงแรมและรีสอร์ท</span>
+        </div>
+        <div class="flex items-center gap-4 bg-neutral-50 rounded-xl p-4">
+          <div class="w-12 h-12 bg-primary-100 rounded-full flex items-center justify-center flex-shrink-0">
+            <svg class="w-6 h-6 text-primary-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4.318 6.318a4.5 4.5 0 000 6.364L12 20.364l7.682-7.682a4.5 4.5 0 00-6.364-6.364L12 7.636l-1.318-1.318a4.5 4.5 0 00-6.364 0z" />
+            </svg>
+          </div>
+          <span class="text-neutral-700 font-medium">โรงพยาบาล</span>
+        </div>
+        <div class="flex items-center gap-4 bg-neutral-50 rounded-xl p-4">
+          <div class="w-12 h-12 bg-primary-100 rounded-full flex items-center justify-center flex-shrink-0">
+            <svg class="w-6 h-6 text-primary-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 13.255A23.931 23.931 0 0112 15c-3.183 0-6.22-.62-9-1.745M16 6V4a2 2 0 00-2-2h-4a2 2 0 00-2 2v2m4 6h.01M5 20h14a2 2 0 002-2V8a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z" />
+            </svg>
+          </div>
+          <span class="text-neutral-700 font-medium">อาคารสำนักงาน</span>
+        </div>
+        <div class="flex items-center gap-4 bg-neutral-50 rounded-xl p-4">
+          <div class="w-12 h-12 bg-primary-100 rounded-full flex items-center justify-center flex-shrink-0">
+            <svg class="w-6 h-6 text-primary-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19.428 15.428a2 2 0 00-1.022-.547l-2.387-.477a6 6 0 00-3.86.517l-.318.158a6 6 0 01-3.86.517L6.05 15.21a2 2 0 00-1.806.547M8 4h8l-1 1v5.172a2 2 0 00.586 1.414l5 5c1.26 1.26.367 3.414-1.415 3.414H4.828c-1.782 0-2.674-2.154-1.414-3.414l5-5A2 2 0 009 10.172V5L8 4z" />
+            </svg>
+          </div>
+          <span class="text-neutral-700 font-medium">งานอุตสาหกรรม</span>
+        </div>
+      </div>
+    </div>
+  </section>
+
+  <!-- Comparison Table -->
+  <section class="py-16 bg-neutral-50">
+    <div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8">
+      <h2 class="text-3xl font-bold text-primary-700 mb-8 text-center">เปรียบเทียบท่อ XYLENT กับท่อระบายน้ำทั่วไป</h2>
+      <div class="bg-white rounded-xl overflow-hidden shadow-sm">
+        <table class="w-full">
+          <thead>
+            <tr class="bg-primary-700 text-white">
+              <th class="py-4 px-6 text-left font-semibold">คุณสมบัติ</th>
+              <th class="py-4 px-6 text-center font-semibold">ท่อ XYLENT 3 ชั้น</th>
+              <th class="py-4 px-6 text-center font-semibold">ท่อ PVC ทั่วไป</th>
+            </tr>
+          </thead>
+          <tbody class="divide-y divide-neutral-200">
+            <tr>
+              <td class="py-4 px-6 font-medium text-neutral-700">ระดับเสียง</td>
+              <td class="py-4 px-6 text-center text-primary-600 font-semibold">22 dB (เงียบมาก)</td>
+              <td class="py-4 px-6 text-center text-neutral-500">50-60 dB (เสียงดัง)</td>
+            </tr>
+            <tr>
+              <td class="py-4 px-6 font-medium text-neutral-700">โครงสร้าง</td>
+              <td class="py-4 px-6 text-center text-primary-600 font-semibold">3 ชั้น (PP)</td>
+              <td class="py-4 px-6 text-center text-neutral-500">1 ชั้น (PVC)</td>
+            </tr>
+            <tr>
+              <td class="py-4 px-6 font-medium text-neutral-700">ระบบต่อ</td>
+              <td class="py-4 px-6 text-center text-primary-600 font-semibold">Push Fit (ล็อกแน่น)</td>
+              <td class="py-4 px-6 text-center text-neutral-500">กาว/เชื่อม</td>
+            </tr>
+            <tr>
+              <td class="py-4 px-6 font-medium text-neutral-700">ทนความร้อน</td>
+              <td class="py-4 px-6 text-center text-primary-600 font-semibold">90°C</td>
+              <td class="py-4 px-6 text-center text-neutral-500">60°C</td>
+            </tr>
+            <tr>
+              <td class="py-4 px-6 font-medium text-neutral-700">ความแข็งแรง</td>
+              <td class="py-4 px-6 text-center text-primary-600 font-semibold">สูงมาก</td>
+              <td class="py-4 px-6 text-center text-neutral-500">ปานกลาง</td>
+            </tr>
+          </tbody>
+        </table>
+      </div>
+    </div>
+  </section>
+
+  <!-- CTA -->
+  <section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white text-center">
+    <div class="max-w-4xl mx-auto px-4">
+      <h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2>
+      <p class="text-lg text-primary-100 mb-8">ติดต่อ 090-555-1415 หรือแอดไลน์ @JPPSELECTION</p>
+      <div class="flex flex-wrap justify-center gap-4">
+        <a href="/contact-us" class="bg-white text-primary-700 py-3 px-8 rounded-xl font-semibold hover:bg-primary-50">ติดต่อเรา</a>
+        <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-8 rounded-xl font-semibold">แอดไลน์</a>
+      </div>
+    </div>
+  </section>
+</BaseLayout>
--- a/src/pages/ระบบน้ำ.astro
+++ b/src/pages/ระบบน้ำ.astro
@@ -0,0 +1,93 @@
+---
+import BaseLayout from '@/layouts/BaseLayout.astro';
+---
+
+<BaseLayout title="ระบบน้ำ - วาล์ว ปั๊มน้ำ ระบบกรองน้ำ" description="ระบบน้ำครบวงจร วาล์ว ปั๊มน้ำ ระบบกรองน้ำ คุณภาพสูง ราคาโรงงาน ส่งฟรี กรุงเทพมหานคร ปริมณฑล">
+  <main class="bg-white min-h-screen">
+    <!-- Category Hero Section -->
+    <section class="bg-gradient-to-br from-primary-700 to-primary-600 text-white py-16">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="grid lg:grid-cols-2 gap-12 items-center">
+          <div>
+            <span class="inline-block px-4 py-1.5 bg-white/20 text-white rounded-full text-sm font-medium mb-4">ระบบน้ำ</span>
+            <h1 class="text-3xl sm:text-4xl lg:text-5xl font-bold mb-4">ระบบน้ำ</h1>
+            <p class="text-lg text-primary-100 mb-8 leading-relaxed">
+              ระบบน้ำครบวงจร วาล์ว ปั๊มน้ำ ระบบกรองน้ำ คุณภาพสูง ราคาโรงงาน ส่งฟรี กรุงเทพมหานคร ปริมณฑล
+            </p>
+            <div class="flex flex-wrap gap-4">
+              <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" class="flex items-center gap-2 bg-white text-primary-700 px-6 py-3 rounded-xl font-semibold hover:bg-primary-50 transition-colors">
+                <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24">
+                  <path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/>
+                </svg>
+                แชทไลน์
+              </a>
+              <a href="tel:0905551415" class="flex items-center gap-2 bg-white/10 hover:bg-white/20 text-white px-6 py-3 rounded-xl font-semibold border border-white/30 transition-colors">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z" />
+                </svg>
+                090-555-1415
+              </a>
+            </div>
+          </div>
+          <div>
+            <img src="/images/products-cropped/water-pump_000C.jpg" alt="ระบบน้ำ" class="rounded-2xl" loading="eager" />
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Products -->
+    <section class="py-16 bg-neutral-50">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <h2 class="text-2xl font-bold text-primary-700 mb-8 text-center">สินค้าในหมวดนี้</h2>
+        <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-6">
+          <a href="/วาล์ว-valve" class="group overflow-hidden block bg-white rounded-xl border border-neutral-200 hover:border-primary-300 hover:shadow-lg transition-all">
+            <div class="aspect-square overflow-hidden">
+              <img src="/images/products-cropped/valve_000C.jpg" alt="วาล์ว" class="w-full h-full object-cover group-hover:scale-105 transition-transform" loading="lazy" />
+            </div>
+            <div class="p-4 text-center">
+              <h3 class="text-lg font-bold text-neutral-800 group-hover:text-primary-600 transition-colors">วาล์ว</h3>
+            </div>
+          </a>
+
+          <a href="/water-pump" class="group overflow-hidden block bg-white rounded-xl border border-neutral-200 hover:border-primary-300 hover:shadow-lg transition-all">
+            <div class="aspect-square overflow-hidden">
+              <img src="/images/products-cropped/water-pump_000C.jpg" alt="ปั๊มน้ำ" class="w-full h-full object-cover group-hover:scale-105 transition-transform" loading="lazy" />
+            </div>
+            <div class="p-4 text-center">
+              <h3 class="text-lg font-bold text-neutral-800 group-hover:text-primary-600 transition-colors">ปั๊มน้ำ</h3>
+            </div>
+          </a>
+
+          <a href="/water-treatment" class="group overflow-hidden block bg-white rounded-xl border border-neutral-200 hover:border-primary-300 hover:shadow-lg transition-all">
+            <div class="aspect-square overflow-hidden">
+              <img src="/images/products-cropped/water-treatment_000C.jpg" alt="ระบบกรองน้ำ" class="w-full h-full object-cover group-hover:scale-105 transition-transform" loading="lazy" />
+            </div>
+            <div class="p-4 text-center">
+              <h3 class="text-lg font-bold text-neutral-800 group-hover:text-primary-600 transition-colors">ระบบกรองน้ำ</h3>
+            </div>
+          </a>
+        </div>
+      </div>
+    </section>
+
+    <!-- Contact CTA -->
+    <section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white">
+      <div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
+        <h2 class="text-3xl font-bold mb-6">สนใจสินค้าของเรา?</h2>
+        <p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้เพื่อรับคำแนะนำและราคาพิเศษ</p>
+        <div class="flex flex-wrap justify-center gap-4">
+          <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" class="flex items-center gap-2 bg-white text-primary-700 px-6 py-3 rounded-xl font-semibold hover:bg-primary-50 transition-colors">
+            <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24">
+              <path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/>
+            </svg>
+            แชทไลน์
+          </a>
+          <a href="tel:0905551415" class="flex items-center gap-2 bg-white/10 hover:bg-white/20 text-white px-6 py-3 rounded-xl font-semibold border border-white/30 transition-colors">
+            โทร 090-555-1415
+          </a>
+        </div>
+      </div>
+    </section>
+  </main>
+</BaseLayout>
--- a/src/pages/ระบบรั้วไวน์แมน.astro
+++ b/src/pages/ระบบรั้วไวน์แมน.astro
@@ -0,0 +1,542 @@
+---
+import BaseLayout from '@/layouts/BaseLayout.astro';
+import Header from '@/components/common/Header.astro';
+import Footer from '@/components/common/Footer.astro';
+import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
+---
+
+<script type="application/ld+json">
+{
+  "@context": "https://schema.org",
+  "@type": "Product",
+  "name": "ระบบรั้วไวน์แมน Vineman รั้วตาข่าย ลวดหนาม",
+  "description": "จำหน่ายระบบรั้วไวน์แมน Vineman รั้วตาข่าย ลวดหนามคุณภาพสูง ราคาโรงงาน ส่งฟรี กทม. ปริมณฑล",
+  "image": "https://dealplustech.co.th/images/products-raw/vineman/ระบบรั้วไวน์แมน-Vineman-e1613286324569-1024x880.jpg",
+  "offers": {
+    "@type": "Offer",
+    "url": "https://dealplustech.co.th/ระบบรั้วไวน์แมน-vineman-2",
+    "priceCurrency": "THB",
+    "availability": "https://schema.org/InStock"
+  }
+}
+</script>
+
+<BaseLayout title="ระบบรั้วไวน์แมน Vineman รั้วตาข่าย ลวดหนาม" description="จำหน่ายระบบรั้วไวน์แมน Vineman รั้วตาข่าย ลวดหนามคุณภาพสูง ราคาโรงงาน ส่งฟรี กทม. ปริมณฑล">
+  <Header slot="header" />
+
+  <main class="bg-white min-h-screen pb-24 md:pb-0">
+    <!-- Hero Section -->
+    <section class="bg-gradient-to-br from-primary-700 to-primary-600 text-white py-12">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <nav class="text-sm mb-4 text-primary-100">
+          <a href="/" class="hover:text-white">หน้าแรก</a> / <a href="/all-products" class="hover:text-white">สินค้าทั้งหมด</a> / <span class="text-white">ระบบรั้วไวน์แมน</span>
+        </nav>
+        <div class="grid lg:grid-cols-2 gap-8 items-center">
+          <div class="img-hover rounded-2xl overflow-hidden bg-white/10">
+            <img src="/images/products-raw/vineman/ระบบรั้วไวน์แมน-Vineman-e1613286324569-1024x880.jpg" alt="ระบบรั้วไวน์แมน Vineman" class="w-full" loading="eager" />
+          </div>
+          <div>
+            <span class="text-sm text-primary-200 font-medium">ระบบรั้ว</span>
+            <h1 class="text-3xl lg:text-4xl font-bold mt-2 mb-4">ระบบรั้วไวน์แมน | Vineman</h1>
+            <p class="text-primary-100 text-lg mb-6">ส่งฟรี กรุงเทพมหานคร ปริมณฑล รั้วตาข่ายคุณภาพสูงจากออสเตรเลีย ทนทาน ดีไซน์ทันสมัย</p>
+            <div class="flex flex-wrap gap-4 mb-8">
+              <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" class="bg-white/10 hover:bg-white/20 text-white py-3 px-6 rounded-xl font-semibold border border-white/30 flex items-center gap-2">
+                <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"><path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/></svg>
+                แชท
+              </a>
+              <a href="tel:0905551415" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-6 rounded-xl font-semibold flex items-center gap-2">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z"/>
+                </svg>
+                090-555-1415
+              </a>
+            </div>
+            <div class="flex flex-wrap gap-4 text-primary-100 text-sm">
+              <div class="flex items-center gap-1">
+                <svg class="w-5 h-5 text-accent-500" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" /></svg>
+                <span>ลวดแรงดึงสูง เหนียว ทนต่อแรงกระแทก</span>
+              </div>
+              <div class="flex items-center gap-1">
+                <svg class="w-5 h-5 text-accent-500" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" /></svg>
+                <span>ชุบสังกะสีหนา ตามมาตรฐาน ASTM</span>
+              </div>
+              <div class="flex items-center gap-1">
+                <svg class="w-5 h-5 text-accent-500" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" /></svg>
+                <span>อายุการใช้งานมากกว่า 50 ปี</span>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Products Overview -->
+    <section class="py-16 px-4 bg-neutral-50">
+      <div class="max-w-7xl mx-auto">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl font-bold text-neutral-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" alt="ระบบรั้วไวน์แมน" class="w-full h-auto rounded-xl mb-3" loading="lazy" />
+              <p class="text-neutral-700 font-medium">ระบบรั้วไวน์แมน</p>
+            </div>
+            <div class="text-center">
+              <img src="/images/products-raw/vineman/ลวดหนาม.jpg" alt="ลวดหนาม" class="w-full h-auto rounded-xl mb-3" loading="lazy" />
+              <p class="text-neutral-700 font-medium">ลวดหนาม</p>
+            </div>
+            <div class="text-center">
+              <img src="/images/products-raw/vineman/ตาข่ายถักปม.jpg" alt="ตาข่ายถักปม" class="w-full h-auto rounded-xl mb-3" loading="lazy" />
+              <p class="text-neutral-700 font-medium">ตาข่ายถักปม</p>
+            </div>
+            <div class="text-center">
+              <img src="/images/products-raw/vineman/ฟิคซ์ล็อค.jpg" alt="ฟิคซ์ล็อค" class="w-full h-auto rounded-xl mb-3" loading="lazy" />
+              <p class="text-neutral-700 font-medium">ฟิคซ์ล็อค</p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- 6 Techniques Section -->
+    <section class="py-16 px-4">
+      <div class="max-w-7xl mx-auto">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl font-bold text-neutral-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" alt="6 เทคนิคน่ารู้" class="w-full h-auto rounded-xl max-w-md mx-auto" loading="lazy" />
+            </div>
+            <div class="space-y-4">
+              <div class="flex items-start space-x-3">
+                <span class="flex-shrink-0 w-8 h-8 bg-primary-600 text-white rounded-full flex items-center justify-center font-bold">01</span>
+                <span class="text-neutral-700">ทนทาน ด้วยลวดแรงดึงสูง เหนียว ทนต่อแรงกระแทก ไม่ขาดง่าย</span>
+              </div>
+              <div class="flex items-start space-x-3">
+                <span class="flex-shrink-0 w-8 h-8 bg-primary-600 text-white rounded-full flex items-center justify-center font-bold">02</span>
+                <span class="text-neutral-700">คุ้มค่า ราคาถูกกว่า รั้วลวดหนาม รั้วคอนกรีต รั้วคาวบอย รั้วตาข่ายถัก CHAINLINK</span>
+              </div>
+              <div class="flex items-start space-x-3">
+                <span class="flex-shrink-0 w-8 h-8 bg-primary-600 text-white rounded-full flex items-center justify-center font-bold">03</span>
+                <span class="text-neutral-700">หนากว่า ด้วยลวดขนาด 2.50 มม. ชุบสังกะสีหนา ตามมาตรฐานอเมริกา (ASTM) อายุการใช้งานมากกว่า 50 ปี</span>
+              </div>
+              <div class="flex items-start space-x-3">
+                <span class="flex-shrink-0 w-8 h-8 bg-primary-600 text-white rounded-full flex items-center justify-center font-bold">04</span>
+                <span class="text-neutral-700">ดีไซน์เหนือกว่า ด้านล่างตีช่องถี่ ด้านบนช่องกว้าง ป้องกันสัตว์เล็กและสัตว์ใหญ่ได้พร้อมกัน</span>
+              </div>
+              <div class="flex items-start space-x-3">
+                <span class="flex-shrink-0 w-8 h-8 bg-primary-600 text-white rounded-full flex items-center justify-center font-bold">05</span>
+                <span class="text-neutral-700">ติดตั้งง่าย สะดวก รวดเร็ว พร้อมใช้งานเพียงตอกเสาเทปูน ขึงตึง</span>
+              </div>
+              <div class="flex items-start space-x-3">
+                <span class="flex-shrink-0 w-8 h-8 bg-primary-600 text-white rounded-full flex items-center justify-center font-bold">06</span>
+                <span class="text-neutral-700">สวยกว่า โปร่งโล่งสบายตา ไม่บดบังทัศนียภาพ ลมโกรก ถ่ายเทได้สะดวก</span>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Problems & Solutions -->
+    <section class="py-16 px-4 bg-neutral-50">
+      <div class="max-w-7xl mx-auto">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl font-bold text-neutral-900 mb-8 text-center">ทุกปัญหา! ระบบรั้วเสาปูน แก้ไขด้วยระบบรั้วไวน์แมน</h2>
+
+          <!-- Problems Grid -->
+          <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" loading="lazy" />
+              <p class="text-sm text-neutral-700">จุดเชื่อมของเสาค้ำยันไม่คงทน</p>
+            </div>
+            <div class="text-center">
+              <img src="/images/products-raw/vineman/เปราะ-แตกหักง่าย.jpg" alt="เปราะ แตกหักง่าย" class="w-full h-auto rounded-lg mb-2" loading="lazy" />
+              <p class="text-sm text-neutral-700">เปราะ แตกหักง่าย</p>
+            </div>
+            <div class="text-center">
+              <img src="/images/products-raw/vineman/ตัวยึดลวดหนาม-หลุดง่าย.jpg" alt="ตัวยึดลวดหนาม หลุดง่าย" class="w-full h-auto rounded-lg mb-2" loading="lazy" />
+              <p class="text-sm text-neutral-700">ตัวยึดลวดหนาม หลุดง่าย</p>
+            </div>
+            <div class="text-center">
+              <img src="/images/products-raw/vineman/เสาค้ำยันไม่แข็งแรง.jpg" alt="เสาค้ำยันไม่แข็งแรง" class="w-full h-auto rounded-lg mb-2" loading="lazy" />
+              <p class="text-sm text-neutral-700">เสาค้ำยันไม่แข็งแรง</p>
+            </div>
+            <div class="text-center">
+              <img src="/images/products-raw/vineman/เกิดรอยร้าวง่าย.jpg" alt="เกิดรอยร้าวง่าย" class="w-full h-auto rounded-lg mb-2" loading="lazy" />
+              <p class="text-sm text-neutral-700">เกิดรอยร้าวง่าย</p>
+            </div>
+            <div class="text-center">
+              <img src="/images/products-raw/vineman/ต้องหล่อปูนทำฐานรากทุกต้น.jpg" alt="ต้องหล่อปูนทำฐานรากทุกต้น" class="w-full h-auto rounded-lg mb-2" loading="lazy" />
+              <p class="text-sm text-neutral-700">ต้องหล่อปูนทำฐานรากทุกต้น</p>
+            </div>
+          </div>
+
+          <!-- Solutions -->
+          <div class="grid md:grid-cols-2 gap-6">
+            <div>
+              <img src="/images/products-raw/vineman/รั้วโปร่งโล่งสบายตา-1024x1013.jpg" alt="รั้วโปร่งโล่งสบายตา" class="w-full h-auto rounded-xl" loading="lazy" />
+            </div>
+            <div>
+              <img src="/images/products-raw/vineman/แข็งแรง-ติดตั้งง่าย-ได้ทุกภูมิทัศน์.jpg" alt="แข็งแรง ติดตั้งง่าย ได้ทุกภูมิทัศน์" class="w-full h-auto rounded-xl" loading="lazy" />
+              <p class="text-center text-neutral-700 font-medium mt-4">แข็งแรง ติดตั้งง่าย ได้ทุกภูมิทัศน์</p>
+              <p class="text-neutral-600 text-sm mt-2">ระบบรั้วตาข่ายไวน์แมน สามารถติดตั้งเดินแนวรั้วบนพื้นที่ทุกรูปแบบทั้งขึ้น-ลง เนินส่วนเว้า-ส่วนโค้งได้อย่างแข็งแรงและต่อเนื่อง</p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Pole Types -->
+    <section class="py-16 px-4">
+      <div class="max-w-7xl mx-auto">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl font-bold text-neutral-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" loading="lazy" />
+              <p class="text-neutral-700 font-medium">เสาไวน์แมน ระยะห่าง 5-8 เมตร</p>
+            </div>
+            <div class="text-center">
+              <img src="/images/products-raw/vineman/เสาปูน-ระยะห่างของเสา-4-6-เมตร-1024x299.jpg" alt="เสาปูน ระยะห่าง 4-6 เมตร" class="w-full h-auto rounded-xl mb-3" loading="lazy" />
+              <p class="text-neutral-700 font-medium">เสาปูน ระยะห่าง 4-6 เมตร</p>
+            </div>
+            <div class="text-center">
+              <img src="/images/products-raw/vineman/เสาไม้เนื้อแข็ง-ระยะห่างของเสา-4-6-เมตร-1024x295.jpg" alt="เสาไม้เนื้อแข็ง ระยะห่าง 4-6 เมตร" class="w-full h-auto rounded-xl mb-3" loading="lazy" />
+              <p class="text-neutral-700 font-medium">เสาไม้เนื้อแข็ง ระยะห่าง 4-6 เมตร</p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Semi-Spring Section -->
+    <section class="py-16 px-4 bg-neutral-50">
+      <div class="max-w-7xl mx-auto">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl font-bold text-neutral-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" loading="lazy" />
+            </div>
+            <div class="space-y-4">
+              <p class="text-neutral-700 leading-relaxed">
+                รั้วตาข่ายไวน์แมน ผลิตจากลวดกึ่งสปริง คิดค้นและออกแบบรอยหยักบนเส้นลวดในแนวนอน สามารถสปริงตัวได้ รั้วไม่ยืด หรือหย่อยตัวง่าย มีความแข็งแรง ยืดหยุ่นสูง คืนตัวกลับได้ดี เมื่อโดนแรงกระแทก
+              </p>
+              <div class="flex items-start space-x-3">
+                <svg class="w-6 h-6 text-primary-600 mt-1 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span class="text-neutral-700">ยืดหยุ่นสูง เดินแนวรั้วขึ้น/ลงเนินได้อย่างต่อเนื่อง</span>
+              </div>
+              <div class="flex items-start space-x-3">
+                <svg class="w-6 h-6 text-primary-600 mt-1 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span class="text-neutral-700">เส้นแนวนอนมีแรงดึงสูง 750-900 นิวตัน/ตร.มม.</span>
+              </div>
+              <div class="flex items-start space-x-3">
+                <svg class="w-6 h-6 text-primary-600 mt-1 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span class="text-neutral-700">ทนสนิมด้วยชุบสังกะสีตามมาตรฐาน ASTM</span>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Buying Guide -->
+    <section class="py-16 px-4">
+      <div class="max-w-7xl mx-auto">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl font-bold text-neutral-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" loading="lazy" />
+            </div>
+            <div class="space-y-4">
+              <p class="text-neutral-700 font-medium">สูตรคำนวณความยาวรอบพื้นที่โดยประมาณ</p>
+              <div class="bg-primary-50 p-6 rounded-xl text-center">
+                <p class="text-2xl font-bold text-primary-700">√ไร่ × 40 × 4</p>
+              </div>
+              <p class="text-neutral-600 text-sm">ตัวอย่าง: พื้นที่ขนาด 2 ไร่ มีความยาวรอบพื้นที่ = √2 × 40 × 4 = <strong>226 เมตร</strong></p>
+              <p class="text-neutral-500 text-xs">(สูตรในการคำนวณพื้นที่นี้ สามารถนำไปคำนวณกับพื้นที่รูปทรงสี่เหลี่ยมจตุรัส และพื้นที่รูปทรงอื่นๆ ได้โดยประมาณ)</p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Calculation Table -->
+    <section class="py-16 px-4 bg-neutral-50">
+      <div class="max-w-7xl mx-auto">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl font-bold text-neutral-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" loading="lazy" />
+          <div class="mt-6 p-4 bg-yellow-50 rounded-xl max-w-3xl mx-auto">
+            <p class="text-neutral-700 text-sm"><strong>หมายเหตุ:</strong></p>
+            <ul class="text-neutral-600 text-sm list-disc list-inside space-y-1 mt-2">
+              <li>ตารางข้างต้น เป็นเพียงตัวอย่างในการคำนวณปริมาณเบื้องต้น สำหรับพื้นที่ราบ เส้นตรง รูปสี่เหลี่ยม (ไม่มีประตู) เท่านั้น</li>
+              <li>ควรติดตั้งเสารั้วทุก 4-8 เมตร ขึ้นอยู่กับสภาพพื้นดิน และประเภทของเสา</li>
+              <li>กรณีพื้นที่ขึ้น-ลงเนิน มีส่วนเว้า/โค้ง ควรเพิ่มแผง-เสารับแรง เพื่อความแข็งแรงของระบบรั้ว</li>
+            </ul>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Product Features -->
+    <section class="py-16 px-4">
+      <div class="max-w-7xl mx-auto">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl font-bold text-neutral-900 mb-8 text-center">จุดเด่นของระบบรั้วไวน์แมน</h2>
+          <div class="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
+            <div class="p-6 bg-neutral-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">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z" />
+                </svg>
+              </div>
+              <h3 class="text-lg font-bold text-neutral-900 mb-2">ลวดแรงดึงสูง</h3>
+              <p class="text-neutral-600 text-sm">ผลิตจากลวดเหล็กกล้าคาร์บอนสูง แรงดึง 750-1,200 นิวตัน/ตร.มม. ทนต่อแรงกระแทกและการเสียดสี</p>
+            </div>
+            <div class="p-6 bg-neutral-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">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19.428 15.428a2 2 0 00-1.022-.547l-2.384-.477a6 6 0 00-3.86.517l-.318.158a6 6 0 01-3.86.517L6.05 15.21a2 2 0 00-1.806.547M8 4h8l-1 1v5.172a2 2 0 00.586 1.414l5 5c1.414 1.414.586 3.414-.586 3.414H12m5-15H7" />
+                </svg>
+              </div>
+              <h3 class="text-lg font-bold text-neutral-900 mb-2">ชุบสังกะสีตามมาตรฐาน ASTM</h3>
+              <p class="text-neutral-600 text-sm">ชุบสังกะสีหนาพิเศษ Hot-dipped Galvanized Class 3 ทนสนิม อายุการใช้งานมากกว่า 50 ปี</p>
+            </div>
+            <div class="p-6 bg-neutral-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">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15" />
+                </svg>
+              </div>
+              <h3 class="text-lg font-bold text-neutral-900 mb-2">รั้วกึ่งสปริง</h3>
+              <p class="text-neutral-600 text-sm">ออกแบบรอยหยักบนเส้นลวดแนวนอน สามารถสปริงตัวได้ รั้วไม่ยืดหรือหย่อนตัวง่าย</p>
+            </div>
+            <div class="p-6 bg-neutral-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">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8c1.11 0 2.08.402 2.599 1M12 8V7m0 1v8m0 0v1m0-1c-1.11 0-2.08-.402-2.599-1M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
+                </svg>
+              </div>
+              <h3 class="text-lg font-bold text-neutral-900 mb-2">ติดตั้งง่าย ประหยัด</h3>
+              <p class="text-neutral-600 text-sm">ใช้เสาระยะห่าง 4-8 เมตร ต้นเสาประหยัดกว่ารั้วประเภทอื่น ไม่ต้องเทปูนฐานทุกต้น</p>
+            </div>
+            <div class="p-6 bg-neutral-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">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-6 0a1 1 0 001-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 001 1m-6 0h6" />
+                </svg>
+              </div>
+              <h3 class="text-lg font-bold text-neutral-900 mb-2">ดีไซน์โปร่งโล่ง</h3>
+              <p class="text-neutral-600 text-sm">ไม่บดบังทัศนียภาพ ลมโกรกถ่ายเทได้ดี สวยงาม เหมาะกับทุกสภาพภูมิทัศน์</p>
+            </div>
+            <div class="p-6 bg-neutral-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">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" />
+                </svg>
+              </div>
+              <h3 class="text-lg font-bold text-neutral-900 mb-2">ใช้ได้กับทุกประเภทเสา</h3>
+              <p class="text-neutral-600 text-sm">เข้ากันได้กับเสาไวน์แมน เสาปูน เสาไม้เนื้อแข็ง ติดตั้งเดินแนวรั้วขึ้น-ลงเนินได้</p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Application Guide -->
+    <section class="py-16 px-4 bg-neutral-50">
+      <div class="max-w-7xl mx-auto">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl font-bold text-neutral-900 mb-8 text-center">การใช้งานระบบรั้วไวน์แมน</h2>
+
+          <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">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 21V5a2 2 0 00-2-2H7a2 2 0 00-2 2v16m14 0h2m-2 0h-5m-9 0H3m2 0h5M9 7h1m-1 4h1m4-4h1m-1 4h1m-5 10v-5a1 1 0 011-1h2a1 1 0 011 1v5m-4 0h4" />
+                </svg>
+              </div>
+              <h3 class="text-lg font-bold text-neutral-900 mb-2">โรงงาน/คลังสินค้า</h3>
+              <p class="text-neutral-600 text-sm">ล้อมรอบพื้นที่โรงงาน คลังสินค้า พื้นที่อุตสาหกรรม ป้องกันการเข้าถึงโดยไม่ได้รับอนุญาต</p>
+            </div>
+            <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">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 8h14M5 8a2 2 0 110-4h14a2 2 0 110 4M5 8v10a2 2 0 002 2h10a2 2 0 002-2V8m-9 4h4" />
+                </svg>
+              </div>
+              <h3 class="text-lg font-bold text-neutral-900 mb-2">ฟาร์มปศุสัตว์</h3>
+              <p class="text-neutral-600 text-sm">เหมาะสำหรับฟาร์มเลี้ยงแพะ แกะ กวาง จิงโจ้ นกกระจอกเทศ ป้องกันสัตว์หลุดออกนอกพื้นที่</p>
+            </div>
+            <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">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343 6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707M16 12a4 4 0 11-8 0 4 4 0 018 0z" />
+                </svg>
+              </div>
+              <h3 class="text-lg font-bold text-neutral-900 mb-2">สวนเกษตร/ไร่</h3>
+              <p class="text-neutral-600 text-sm">ล้อมสวนผลไม้ ไร่พืชไร่ ป้องกันสัตว์เข้ามาทำลายพืชผล ไม่บดบังแสงแดด</p>
+            </div>
+            <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">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0zm6 3a2 2 0 11-4 0 2 2 0 014 0zM7 10a2 2 0 11-4 0 2 2 0 014 0z" />
+                </svg>
+              </div>
+              <h3 class="text-lg font-bold text-neutral-900 mb-2">สถานที่สาธารณะ</h3>
+              <p class="text-neutral-600 text-sm">สนามกีฬา สวนสาธารณะ อาคารชุด หมู่บ้านจัดสรร กำแพงกันชน รั้วกั้นพื้นที่</p>
+            </div>
+          </div>
+
+          <!-- Application Table -->
+          <div class="bg-white p-6 rounded-xl">
+            <h3 class="text-lg font-bold text-neutral-900 mb-4">ตารางเปรียบเทียบการใช้งานตามประเภท</h3>
+            <div class="overflow-x-auto">
+              <table class="w-full text-sm">
+                <thead>
+                  <tr class="bg-neutral-100">
+                    <th class="text-left p-3 font-bold text-neutral-800">ประเภทการใช้งาน</th>
+                    <th class="text-left p-3 font-bold text-neutral-800">รุ่นแนะนำ</th>
+                    <th class="text-left p-3 font-bold text-neutral-800">ความสูง (เมตร)</th>
+                    <th class="text-left p-3 font-bold text-neutral-800">ข้อแนะนำ</th>
+                  </tr>
+                </thead>
+                <tbody>
+                  <tr class="border-b border-neutral-200">
+                    <td class="p-3 text-neutral-700">โรงงาน คลังสินค้า</td>
+                    <td class="p-3 text-neutral-700">13-175-15 / 14-200-15</td>
+                    <td class="p-3 text-neutral-700">2.4 - 3.0</td>
+                    <td class="p-3 text-neutral-700">เพิ่มลวดหนามบนสุดเพื่อความปลอดภัย</td>
+                  </tr>
+                  <tr class="border-b border-neutral-200">
+                    <td class="p-3 text-neutral-700">ฟาร์มแพะ แกะ</td>
+                    <td class="p-3 text-neutral-700">10-107-15 / 11-142-15</td>
+                    <td class="p-3 text-neutral-700">1.0 - 1.5</td>
+                    <td class="p-3 text-neutral-700">ตาข่ายถักปมช่องแคบกันสัตว์เล็ก</td>
+                  </tr>
+                  <tr class="border-b border-neutral-200">
+                    <td class="p-3 text-neutral-700">ฟาร์มกวาง จิงโจ้</td>
+                    <td class="p-3 text-neutral-700">11-155-15 / 12-120-15</td>
+                    <td class="p-3 text-neutral-700">1.8 - 2.4</td>
+                    <td class="p-3 text-neutral-700">ตาข่ายฟิคซ์ล็อคทนแรงกระแทก</td>
+                  </tr>
+                  <tr class="border-b border-neutral-200">
+                    <td class="p-3 text-neutral-700">สวนผลไม้</td>
+                    <td class="p-3 text-neutral-700">8-90-15 / 10-107-15</td>
+                    <td class="p-3 text-neutral-700">1.2 - 1.8</td>
+                    <td class="p-3 text-neutral-700">ประหยัด ทนทาน ไม่บดบังแสง</td>
+                  </tr>
+                  <tr>
+                    <td class="p-3 text-neutral-700">สถานที่สาธารณะ</td>
+                    <td class="p-3 text-neutral-700">13-175-15 / 14-200-15</td>
+                    <td class="p-3 text-neutral-700">2.0 - 3.0</td>
+                    <td class="p-3 text-neutral-700">รั้วกึ่งสปริง ติดตั้งเร็ว สวยงาม</td>
+                  </tr>
+                </tbody>
+              </table>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- FAQ Section -->
+    <section class="py-16 px-4">
+      <div class="max-w-7xl mx-auto">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl font-bold text-neutral-900 mb-8 text-center">คำถามที่พบบ่อยเกี่ยวกับระบบรั้วไวน์แมน</h2>
+
+          <div class="space-y-4">
+            <div class="border border-neutral-200 rounded-xl overflow-hidden">
+              <details class="group">
+                <summary class="flex items-center justify-between p-4 cursor-pointer bg-neutral-50 hover:bg-neutral-100 transition-colors">
+                  <span class="font-medium text-neutral-900">ระบบรั้วไวน์แมนมีอายุการใช้งานนานเท่าไหร่?</span>
+                  <svg class="w-5 h-5 text-neutral-500 group-open:rotate-180 transition-transform" 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="p-4 text-neutral-600 bg-white">
+                  ระบบรั้วไวน์แมนมีอายุการใช้งานมากกว่า 50 ปี ขึ้นอยู่กับการชุบสังกะสีตามมาตรฐาน ASTM Class 3 ซึ่งผ่านการทดสอบ Salt Spray Test มากกว่า 3,000 ชั่วโมง สามารถทนทานต่อสภาวะกัดกร่อนในประเทศไทยที่มีความชื้นสูงได้เป็นอย่างดี
+                </div>
+              </details>
+            </div>
+
+            <div class="border border-neutral-200 rounded-xl overflow-hidden">
+              <details class="group">
+                <summary class="flex items-center justify-between p-4 cursor-pointer bg-neutral-50 hover:bg-neutral-100 transition-colors">
+                  <span class="font-medium text-neutral-900">ระยะห่างของเสาควรเท่าไหร่?</span>
+                  <svg class="w-5 h-5 text-neutral-500 group-open:rotate-180 transition-transform" 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="p-4 text-neutral-600 bg-white">
+                  ระยะห่างขึ้นอยู่กับประเภทเสาที่ใช้: เสาไวน์แมนแนะนำ 5-8 เมตร, เสาปูนหรือเสาไม้เนื้อแข็งแนะนำ 4-6 เมตร สำหรับพื้นที่ที่มีความเรียบ เส้นตรง ส่วนพื้นที่ที่มีความเป็นเนินหรือมีแนวโค้ง ควรลดระยะห่างลงและเพิ่มเสารับแรงเพื่อความแข็งแรงของระบบรั้ว
+                </div>
+              </details>
+            </div>
+
+            <div class="border border-neutral-200 rounded-xl overflow-hidden">
+              <details class="group">
+                <summary class="flex items-center justify-between p-4 cursor-pointer bg-neutral-50 hover:bg-neutral-100 transition-colors">
+                  <span class="font-medium text-neutral-900">ติดตั้งระบบรั้วไวน์แมนยากหรือไม่?</span>
+                  <svg class="w-5 h-5 text-neutral-500 group-open:rotate-180 transition-transform" 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="p-4 text-neutral-600 bg-white">
+                  การติดตั้งระบบรั้วไวน์แมนค่อนข้างง่ายและรวดเร็ว สามารถทำได้โดยตอกเสาลงพื้นดินหรือเทปูนรากเล็กน้อย จากนั้นขึงตาข่ายและยึดด้วยตัวยึดพิเศษ สำหรับพื้นที่ขนาดใหญ่สามารถติดตั้งได้ 100-200 เมตร/วัน ขึ้นอยู่กับสภาพพื้นที่และจำนวนช่าง
+                </div>
+              </details>
+            </div>
+
+            <div class="border border-neutral-200 rounded-xl overflow-hidden">
+              <details class="group">
+                <summary class="flex items-center justify-between p-4 cursor-pointer bg-neutral-50 hover:bg-neutral-100 transition-colors">
+                  <span class="font-medium text-neutral-900">ควรเลือกตาข่ายถักปมหรือตาข่ายฟิคซ์ล็อค?</span>
+                  <svg class="w-5 h-5 text-neutral-500 group-open:rotate-180 transition-transform" 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="p-4 text-neutral-600 bg-white">
+                  ตาข่ายถักปมเหมาะสำหรับการใช้งานทั่วไป เช่น ล้อมสวน โรงงาน สถานที่สาธารณะ ส่วนตาข่ายฟิคซ์ล็อคเหมาะสำหรับฟาร์มปศุสัตว์ที่ต้องการความแข็งแรงสูง เช่น ฟาร์มแพะ แกะ กวาง จิงโจ้ นกกระจอกเทศ เนื่องจากมีตัวล็อคพิเศษช่วยเพิ่มความทนทานต่อแรงกระแทกจากสัตว์
+                </div>
+              </details>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Contact CTA -->
+    <section class="py-16 px-4 bg-gradient-to-br from-primary-700 to-primary-600 text-white text-center">
+      <div class="max-w-4xl mx-auto">
+        <h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2>
+        <p class="text-lg text-primary-100 mb-8">ติดต่อ 090-555-1415 หรือแอดไลน์ @JPPSELECTION</p>
+        <div class="flex flex-wrap justify-center gap-4">
+          <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" class="bg-white text-primary-700 py-3 px-8 rounded-xl font-semibold hover:bg-primary-50 flex items-center gap-2">
+            <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"><path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/></svg>
+            แชท
+          </a>
+          <a href="tel:0905551415" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-8 rounded-xl font-semibold flex items-center gap-2">
+            <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z"/>
+            </svg>
+            090-555-1415
+          </a>
+        </div>
+      </div>
+    </section>
+  </main>
+
+  <Footer slot="footer" />
+
+  <StickyBottomCTA phone="0905551415" lineUrl="https://line.me/ti/p/~JPPSELECTION" slot="after-footer" />
+</BaseLayout>
--- a/src/pages/รั้วเทวดา.astro
+++ b/src/pages/รั้วเทวดา.astro
@@ -0,0 +1,277 @@
+---
+import BaseLayout from '@/layouts/BaseLayout.astro';
+---
+
+<BaseLayout title="รั้วเทวดา | ระบบรั้วสำเร็จรูป คุณภาพสูง ราคาคุ้มค่า" description="รั้วเทวดา ระบบรั้วสำเร็จรูปสำหรับโรงงาน โกดัง สถานที่เกษตร รีสอร์ท และอื่นๆ พร้อมบริการติดตั้งครบวงจร">
+  <section class="bg-gradient-to-br from-primary-700 to-primary-600 text-white py-12">
+    <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+      <nav class="text-sm mb-4 text-primary-100">
+        <a href="/" class="hover:text-white">หน้าแรก</a> / <a href="/all-products" class="hover:text-white">สินค้าทั้งหมด</a> / <span class="text-white">รั้วเทวดา</span>
+      </nav>
+      <div class="grid lg:grid-cols-2 gap-8 items-center">
+        <div class="img-hover rounded-2xl overflow-hidden bg-white/10">
+          <img src="/images/products-raw/tevada/TEVADA_001-987x1024.png" alt="รั้วเทวดา" class="w-full" loading="eager" />
+        </div>
+        <div>
+          <span class="text-sm text-primary-200 font-medium">ระบบรั้วและฉากกั้น</span>
+          <h1 class="text-3xl lg:text-4xl font-bold mt-2 mb-4">รั้วเทวดา</h1>
+          <p class="text-primary-100 text-lg mb-6">ระบบรั้วสำเร็จรูปคุณภาพสูง ราคาคุ้มค่า เหมาะสำหรับโรงงาน โกดัง สถานที่เกษตร และอื่นๆ พร้อมบริการติดตั้งครบวงจรโดยทีมงานมืออาชีพ</p>
+          <div class="flex flex-wrap gap-4">
+            <a href="/contact-us" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-6 rounded-xl font-semibold">สอบถามราคา</a>
+            <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" class="bg-white/10 hover:bg-white/20 text-white py-3 px-6 rounded-xl font-semibold border border-white/30 flex items-center gap-2">
+              <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"><path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/></svg>
+              แชท LINE
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </section>
+
+  <!-- Features Section -->
+  <section class="py-16 bg-neutral-50">
+    <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+      <div class="text-center mb-12">
+        <h2 class="text-3xl lg:text-4xl font-bold text-primary-700 mb-4">คุณสมบัติเด่น</h2>
+        <p class="text-neutral-600 max-w-2xl mx-auto">ทำไมต้องเลือกรั้วเทวดา</p>
+      </div>
+      <div class="grid md:grid-cols-2 lg:grid-cols-4 gap-6">
+        <div class="bg-white rounded-xl p-6 shadow-sm hover:shadow-md transition-shadow text-center">
+          <div class="text-4xl mb-4">🛡️</div>
+          <h3 class="text-lg font-semibold text-neutral-900 mb-2">วัสดุคุณภาพ</h3>
+          <p class="text-sm text-neutral-600">แผ่นรั้วทำจากเหล็กพ่นสีชุบกันสนิม ทนทานต่อสภาพอากาศไทย</p>
+        </div>
+        <div class="bg-white rounded-xl p-6 shadow-sm hover:shadow-md transition-shadow text-center">
+          <div class="text-4xl mb-4">🔧</div>
+          <h3 class="text-lg font-semibold text-neutral-900 mb-2">ติดตั้งง่าย</h3>
+          <p class="text-sm text-neutral-600">ระบบ Prefab สำเร็จรูป ติดตั้งได้รวดเร็ว ลดค่าแรง</p>
+        </div>
+        <div class="bg-white rounded-xl p-6 shadow-sm hover:shadow-md transition-shadow text-center">
+          <div class="text-4xl mb-4">✨</div>
+          <h3 class="text-lg font-semibold text-neutral-900 mb-2">ดูแลรักษาง่าย</h3>
+          <p class="text-sm text-neutral-600">ไม่ต้องทาสี ทำความสะอาดง่าย อายุการใช้งานยาวนาน</p>
+        </div>
+        <div class="bg-white rounded-xl p-6 shadow-sm hover:shadow-md transition-shadow text-center">
+          <div class="text-4xl mb-4">💰</div>
+          <h3 class="text-lg font-semibold text-neutral-900 mb-2">ราคาคุ้มค่า</h3>
+          <p class="text-sm text-neutral-600">ราคาถูกกว่ารั้วคอนกรีต แต่คุณภาพไม่แพ้กัน</p>
+        </div>
+      </div>
+    </div>
+  </section>
+
+  <!-- Models Section -->
+  <section class="py-16 bg-white">
+    <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+      <div class="text-center mb-12">
+        <h2 class="text-3xl lg:text-4xl font-bold text-primary-700 mb-4">รุ่นสินค้า</h2>
+        <p class="text-neutral-600 max-w-2xl mx-auto">เลือกขนาดตามความต้องการ</p>
+      </div>
+      <div class="grid md:grid-cols-3 gap-8">
+        <!-- TVD-1250 -->
+        <div class="bg-white rounded-2xl overflow-hidden shadow-sm hover:shadow-xl transition-all border border-neutral-200">
+          <div class="aspect-video overflow-hidden">
+            <img src="/images/products-raw/tevada/TEVADA_003-1024x647.png" alt="TVD-1250" class="w-full h-full object-cover" loading="lazy" />
+          </div>
+          <div class="p-6">
+            <div class="flex items-center justify-between mb-3">
+              <h3 class="text-xl font-bold text-neutral-900">TVD-1250</h3>
+              <span class="text-lg font-semibold text-primary-600">฿3,200</span>
+            </div>
+            <div class="space-y-2 text-sm text-neutral-600 mb-4">
+              <div class="flex justify-between"><span>ความหนา:</span><span class="font-medium">0.5 มิลลิเมตร</span></div>
+              <div class="flex justify-between"><span>สูง:</span><span class="font-medium">1.25 เมตร</span></div>
+              <div class="flex justify-between"><span>กว้าง:</span><span class="font-medium">2 เมตร</span></div>
+            </div>
+            <ul class="space-y-1">
+              <li class="flex items-center text-sm text-neutral-700"><span class="text-primary-600 mr-2">✓</span>เหมาะสำหรับรั้วส่วนตัว</li>
+              <li class="flex items-center text-sm text-neutral-700"><span class="text-primary-600 mr-2">✓</span>น้ำหนักเบา ติดตั้งง่าย</li>
+              <li class="flex items-center text-sm text-neutral-700"><span class="text-primary-600 mr-2">✓</span>ราคาประหยัด</li>
+            </ul>
+          </div>
+        </div>
+        <!-- TVD-1500 -->
+        <div class="bg-white rounded-2xl overflow-hidden shadow-sm hover:shadow-xl transition-all border border-neutral-200">
+          <div class="aspect-video overflow-hidden">
+            <img src="/images/products-raw/tevada/TEVADA_004.png" alt="TVD-1500" class="w-full h-full object-cover" loading="lazy" />
+          </div>
+          <div class="p-6">
+            <div class="flex items-center justify-between mb-3">
+              <h3 class="text-xl font-bold text-neutral-900">TVD-1500</h3>
+              <span class="text-lg font-semibold text-primary-600">฿3,800</span>
+            </div>
+            <div class="space-y-2 text-sm text-neutral-600 mb-4">
+              <div class="flex justify-between"><span>ความหนา:</span><span class="font-medium">0.6 มิลลิเมตร</span></div>
+              <div class="flex justify-between"><span>สูง:</span><span class="font-medium">1.50 เมตร</span></div>
+              <div class="flex justify-between"><span>กว้าง:</span><span class="font-medium">2 เมตร</span></div>
+            </div>
+            <ul class="space-y-1">
+              <li class="flex items-center text-sm text-neutral-700"><span class="text-primary-600 mr-2">✓</span>เหมาะสำหรับโกดัง</li>
+              <li class="flex items-center text-sm text-neutral-700"><span class="text-primary-600 mr-2">✓</span>ความแข็งแรงสูง</li>
+              <li class="flex items-center text-sm text-neutral-700"><span class="text-primary-600 mr-2">✓</span>ทนสนิมได้ดี</li>
+            </ul>
+          </div>
+        </div>
+        <!-- TVD-2000 -->
+        <div class="bg-white rounded-2xl overflow-hidden shadow-sm hover:shadow-xl transition-all border border-neutral-200">
+          <div class="aspect-video overflow-hidden">
+            <img src="/images/products-raw/tevada/TEVADA_005.png" alt="TVD-2000" class="w-full h-full object-cover" loading="lazy" />
+          </div>
+          <div class="p-6">
+            <div class="flex items-center justify-between mb-3">
+              <h3 class="text-xl font-bold text-neutral-900">TVD-2000</h3>
+              <span class="text-lg font-semibold text-primary-600">฿4,500</span>
+            </div>
+            <div class="space-y-2 text-sm text-neutral-600 mb-4">
+              <div class="flex justify-between"><span>ความหนา:</span><span class="font-medium">0.7 มิลลิเมตร</span></div>
+              <div class="flex justify-between"><span>สูง:</span><span class="font-medium">2.00 เมตร</span></div>
+              <div class="flex justify-between"><span>กว้าง:</span><span class="font-medium">2 เมตร</span></div>
+            </div>
+            <ul class="space-y-1">
+              <li class="flex items-center text-sm text-neutral-700"><span class="text-primary-600 mr-2">✓</span>เหมาะสำหรับโรงงาน</li>
+              <li class="flex items-center text-sm text-neutral-700"><span class="text-primary-600 mr-2">✓</span>ทนทานสูงสุด</li>
+              <li class="flex items-center text-sm text-neutral-700"><span class="text-primary-600 mr-2">✓</span>รองรับพื้นที่ขนาดใหญ่</li>
+            </ul>
+          </div>
+        </div>
+      </div>
+    </div>
+  </section>
+
+  <!-- Applications Section -->
+  <section class="py-16 bg-primary-700 text-white">
+    <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+      <div class="text-center mb-12">
+        <h2 class="text-3xl lg:text-4xl font-bold mb-4">การประยุกต์ใช้งาน</h2>
+        <p class="text-primary-100 max-w-2xl mx-auto">เหมาะสำหรับหลายประเภทธุรกิจ</p>
+      </div>
+      <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
+        <div class="bg-white/10 backdrop-blur-sm rounded-xl p-4 text-center hover:bg-white/20 transition-colors">
+          <div class="text-3xl mb-2">🏭</div>
+          <h4 class="font-medium text-sm">โรงงานอุตสาหกรรม</h4>
+          <p class="text-xs text-white/70 mt-1">รั้วกั้นพื้นที่โรงงาน ความปลอดภัยสูง</p>
+        </div>
+        <div class="bg-white/10 backdrop-blur-sm rounded-xl p-4 text-center hover:bg-white/20 transition-colors">
+          <div class="text-3xl mb-2">📦</div>
+          <h4 class="font-medium text-sm">โกดังสินค้า</h4>
+          <p class="text-xs text-white/70 mt-1">รั้วกั้นเขตเก็บสินค้า ทนทานต่อแรงกระแทก</p>
+        </div>
+        <div class="bg-white/10 backdrop-blur-sm rounded-xl p-4 text-center hover:bg-white/20 transition-colors">
+          <div class="text-3xl mb-2">🌾</div>
+          <h4 class="font-medium text-sm">สถานที่เกษตร</h4>
+          <p class="text-xs text-white/70 mt-1">รั้วล้อมไร่นา ฟาร์ม สวนเกษตร</p>
+        </div>
+        <div class="bg-white/10 backdrop-blur-sm rounded-xl p-4 text-center hover:bg-white/20 transition-colors">
+          <div class="text-3xl mb-2">🏝️</div>
+          <h4 class="font-medium text-sm">รีสอร์ทและโรงแรม</h4>
+          <p class="text-xs text-white/70 mt-1">รั้วกั้นพื้นที่ สวยงาม ทนสภาพอากาศ</p>
+        </div>
+        <div class="bg-white/10 backdrop-blur-sm rounded-xl p-4 text-center hover:bg-white/20 transition-colors">
+          <div class="text-3xl mb-2">🏫</div>
+          <h4 class="font-medium text-sm">สถานศึกษา</h4>
+          <p class="text-xs text-white/70 mt-1">รั้วกั้นโรงเรียน มหาวิทยาลัย</p>
+        </div>
+        <div class="bg-white/10 backdrop-blur-sm rounded-xl p-4 text-center hover:bg-white/20 transition-colors">
+          <div class="text-3xl mb-2">🏠</div>
+          <h4 class="font-medium text-sm">บ้านพักอาศัย</h4>
+          <p class="text-xs text-white/70 mt-1">รั้วรอบบ้าน ความเป็นส่วนตัวสูง</p>
+        </div>
+      </div>
+    </div>
+  </section>
+
+  <!-- Installation Steps -->
+  <section class="py-16 bg-white">
+    <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+      <div class="text-center mb-12">
+        <h2 class="text-3xl lg:text-4xl font-bold text-primary-700 mb-4">ขั้นตอนการติดตั้ง</h2>
+        <p class="text-neutral-600 max-w-2xl mx-auto">ติดตั้งง่าย รวดเร็ว ด้วยทีมงานมืออาชีพ</p>
+      </div>
+      <div class="grid md:grid-cols-4 gap-6">
+        <div class="relative bg-white rounded-xl p-6 shadow-sm text-center border border-neutral-200">
+          <div class="w-12 h-12 bg-primary-600 text-white rounded-full flex items-center justify-center text-xl font-bold mx-auto mb-3">1</div>
+          <h4 class="font-semibold text-neutral-900 mb-1">วัดพื้นที่</h4>
+          <p class="text-sm text-neutral-600">วัดขนาดพื้นที่ที่ต้องการติดตั้งรั้ว</p>
+        </div>
+        <div class="relative bg-white rounded-xl p-6 shadow-sm text-center border border-neutral-200">
+          <div class="w-12 h-12 bg-primary-600 text-white rounded-full flex items-center justify-center text-xl font-bold mx-auto mb-3">2</div>
+          <h4 class="font-semibold text-neutral-900 mb-1">ปักเสา</h4>
+          <p class="text-sm text-neutral-600">ปักเสาเหล็กตามระยะที่กำหนด</p>
+        </div>
+        <div class="relative bg-white rounded-xl p-6 shadow-sm text-center border border-neutral-200">
+          <div class="w-12 h-12 bg-primary-600 text-white rounded-full flex items-center justify-center text-xl font-bold mx-auto mb-3">3</div>
+          <h4 class="font-semibold text-neutral-900 mb-1">ติดตั้งแผ่นรั้ว</h4>
+          <p class="text-sm text-neutral-600">ยึดแผ่นรั้วเข้ากับเสา</p>
+        </div>
+        <div class="relative bg-white rounded-xl p-6 shadow-sm text-center border border-neutral-200">
+          <div class="w-12 h-12 bg-primary-600 text-white rounded-full flex items-center justify-center text-xl font-bold mx-auto mb-3">4</div>
+          <h4 class="font-semibold text-neutral-900 mb-1">ตรวจสอบ</h4>
+          <p class="text-sm text-neutral-600">ตรวจสอบความเรียบร้อยและความแข็งแรง</p>
+        </div>
+      </div>
+    </div>
+  </section>
+
+  <!-- FAQ Section -->
+  <section class="py-16 bg-neutral-50">
+    <div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8">
+      <div class="text-center mb-12">
+        <h2 class="text-3xl lg:text-4xl font-bold text-primary-700 mb-4">คำถามที่พบบ่อย</h2>
+        <p class="text-neutral-600 max-w-2xl mx-auto">ข้อมูลเพิ่มเติมเกี่ยวกับรั้วเทวดา</p>
+      </div>
+      <div class="space-y-4">
+        <details class="group bg-white rounded-xl shadow-sm">
+          <summary class="flex items-center justify-between p-5 cursor-pointer hover:bg-neutral-50">
+            <span class="font-medium text-neutral-900">รั้วเทวดาใช้เวลาติดตั้งนานแค่ไหน?</span>
+            <span class="ml-4 flex-shrink-0 text-primary-600 group-open:rotate-180 transition-transform">
+              <svg class="w-5 h-5" 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>
+            </span>
+          </summary>
+          <div class="px-5 pb-5 text-neutral-600">สำหรับพื้นที่ 100 ตารางเมตร ใช้เวลาติดตั้งประมาณ 1-2 วัน ขึ้นอยู่กับสภาพพื้นที่</div>
+        </details>
+        <details class="group bg-white rounded-xl shadow-sm">
+          <summary class="flex items-center justify-between p-5 cursor-pointer hover:bg-neutral-50">
+            <span class="font-medium text-neutral-900">อายุการใช้งานของรั้วเทวดาเท่าไหร่?</span>
+            <span class="ml-4 flex-shrink-0 text-primary-600 group-open:rotate-180 transition-transform">
+              <svg class="w-5 h-5" 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>
+            </span>
+          </summary>
+          <div class="px-5 pb-5 text-neutral-600">รั้วเทวดามีอายุการใช้งานประมาณ 15-20 ปี ขึ้นอยู่กับสภาพแวดล้อมและการดูแลรักษา</div>
+        </details>
+        <details class="group bg-white rounded-xl shadow-sm">
+          <summary class="flex items-center justify-between p-5 cursor-pointer hover:bg-neutral-50">
+            <span class="font-medium text-neutral-900">สามารถสั่งตัดขนาดพิเศษได้หรือไม่?</span>
+            <span class="ml-4 flex-shrink-0 text-primary-600 group-open:rotate-180 transition-transform">
+              <svg class="w-5 h-5" 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>
+            </span>
+          </summary>
+          <div class="px-5 pb-5 text-neutral-600">ใช่ สามารถสั่งตัดขนาดตามความต้องการของลูกค้าได้ ราคาจะปรับตามขนาดที่สั่งทำ</div>
+        </details>
+        <details class="group bg-white rounded-xl shadow-sm">
+          <summary class="flex items-center justify-between p-5 cursor-pointer hover:bg-neutral-50">
+            <span class="font-medium text-neutral-900">มีบริการติดตั้งให้หรือไม่?</span>
+            <span class="ml-4 flex-shrink-0 text-primary-600 group-open:rotate-180 transition-transform">
+              <svg class="w-5 h-5" 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>
+            </span>
+          </summary>
+          <div class="px-5 pb-5 text-neutral-600">มีบริการติดตั้งครบวงจร ทั้งในกรุงเทพฯ และต่างจังหวัด ค่าบริการขึ้นอยู่กับระยะทางและความยากง่าย</div>
+        </details>
+      </div>
+    </div>
+  </section>
+
+  <!-- CTA Section -->
+  <section class="py-16 bg-gradient-to-br from-accent-500 to-accent-600 text-white">
+    <div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
+      <h2 class="text-3xl lg:text-4xl font-bold mb-4">สนใจรั้วเทวดา?</h2>
+      <p class="text-lg text-white/80 mb-8">ติดต่อทีมงานของเราวันนี้เพื่อรับใบเสนอราคาและคำแนะนำจากผู้เชี่ยวชาญ</p>
+      <div class="flex flex-wrap justify-center gap-4">
+        <a href="/contact-us" class="bg-white text-primary-700 py-3 px-8 rounded-xl font-semibold hover:bg-primary-50">ติดต่อสอบถาม</a>
+        <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" class="bg-white/10 hover:bg-white/20 text-white py-3 px-8 rounded-xl font-semibold border border-white/30 flex items-center gap-2">
+          <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"><path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/></svg>
+          แชท LINE
+        </a>
+      </div>
+    </div>
+  </section>
+</BaseLayout>
--- a/src/pages/วาล์ว-valve.astro
+++ b/src/pages/วาล์ว-valve.astro
@@ -0,0 +1,216 @@
+---
+import BaseLayout from '@/layouts/BaseLayout.astro';
+---
+
+<script type="application/ld+json">
+{
+  "@context": "https://schema.org",
+  "@type": "Product",
+  "name": "วาล์ว (Valve) - วาล์วน้ำทุกประเภท",
+  "description": "จำหน่ายวาล์ว (Valve) - วาล์วน้ำทุกประเภทคุณภาพสูง ราคาโรงงาน ส่งฟรี กทม. ปริมณฑล",
+  "image": "https://dealplustech.co.th/images/products-cropped/valve_000C.jpg",
+  "offers": {
+    "@type": "Offer",
+    "url": "https://dealplustech.co.th/วาล์ว-valve",
+    "priceCurrency": "THB",
+    "availability": "https://schema.org/InStock"
+  }
+}
+</script>
+
+<BaseLayout title="วาล์ว (Valve) - วาล์วน้ำทุกประเภท" description="จำหน่ายวาล์ว (Valve) - วาล์วน้ำทุกประเภทคุณภาพสูง ราคาโรงงาน ส่งฟรี กทม. ปริมณฑล">
+  <main class="bg-white min-h-screen">
+    <!-- Product Hero Section -->
+    <section class="bg-gradient-to-br from-primary-700 to-primary-600 text-white py-16">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="grid lg:grid-cols-2 gap-12 items-start">
+          <div>
+            <div class="rounded-2xl overflow-hidden bg-white/10">
+              <img src="/images/products-cropped/valve_000C.jpg" alt="วาล์ว (Valve)" class="w-full" width="600" height="400" loading="eager" />
+            </div>
+          </div>
+          <div>
+            <span class="inline-block px-4 py-1.5 bg-white/20 text-white rounded-full text-sm font-medium mb-4">วาล์ว</span>
+            <h1 class="text-3xl sm:text-4xl lg:text-5xl font-bold mb-4">วาล์ว (Valve) - วาล์วน้ำทุกประเภท</h1>
+            <p class="text-lg sm:text-xl text-white/80 mb-8 leading-relaxed">
+              จำหน่ายวาล์ว (Valve) - วาล์วน้ำทุกประเภทคุณภาพสูง ราคาโรงงาน ส่งฟรี กรุงเทพมหานคร และปริมณฑล
+            </p>
+            <div class="flex flex-wrap gap-4 mb-8">
+              <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" class="bg-white text-primary-700 hover:bg-primary-50 px-6 py-3 rounded-xl font-semibold flex items-center gap-2">
+                <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"><path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/></svg>
+                แชท
+              </a>
+              <a href="tel:0905551415" class="bg-white/10 hover:bg-white/20 text-white px-6 py-3 rounded-xl font-semibold border border-white/30 flex items-center gap-2">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z"/></svg>
+                090-555-1415
+              </a>
+            </div>
+            <div class="space-y-3">
+              <div class="flex items-start gap-3">
+                <svg class="w-6 h-6 text-white mt-0.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" /></svg>
+                <span class="text-lg text-white/80">คุณภาพสูง มาตรฐานอุตสาหกรรม</span>
+              </div>
+              <div class="flex items-start gap-3">
+                <svg class="w-6 h-6 text-white mt-0.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" /></svg>
+                <span class="text-lg text-white/80">ราคาโรงงาน คุ้มค่า</span>
+              </div>
+              <div class="flex items-start gap-3">
+                <svg class="w-6 h-6 text-white mt-0.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" /></svg>
+                <span class="text-lg text-white/80">จัดส่งรวดเร็ว ส่งฟรี กทม. ปริมณฑล</span>
+              </div>
+              <div class="flex items-start gap-3">
+                <svg class="w-6 h-6 text-white mt-0.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" /></svg>
+                <span class="text-lg text-white/80">รับประกันสินค้า</span>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Product Details -->
+    <section class="py-16 bg-white">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl font-bold text-primary-700 mb-8">รายละเอียดสินค้า</h2>
+          <div class="prose prose-lg max-w-none">
+            <p class="text-lg text-neutral-700 leading-relaxed mb-4">จำหน่ายวาล์วน้ำทุกประเภท คุณภาพสูงจากแบรนด์ชั้นนำ เหมาะสำหรับงานระบบประปา ระบบน้ำในอาคาร และโรงงานอุตสาหกรรม มีทีมงานผู้เชี่ยวชาญพร้อมให้คำแนะนำและบริการติดตั้ง</p>
+
+            <img src="/images/products-misc/valve_logo.jpg" alt="Valve Brands" class="w-full max-w-md mx-auto my-8 rounded-lg shadow-md" width="600" height="300" loading="lazy" />
+
+            <p class="text-lg text-neutral-700 leading-relaxed mb-4"><strong>ประเภทวาล์วที่มีจำหน่าย:</strong></p>
+            <ul class="list-disc pl-6 mb-4 space-y-2 text-neutral-700">
+              <li><strong>Gate Valve & Globe Valve</strong> - วาล์วประตูน้ำและวาล์วปรับการไหล สำหรับงานปิด-เปิดและควบคุมการไหล</li>
+              <li><strong>Ball Valve</strong> - วาล์วบอล เปิด-ปิดรวดเร็ว ทนทาน การบำรุงรักษาต่ำ</li>
+              <li><strong>Butterfly Valve</strong> - วาล์วผีเสื้อ สำหรับท่อขนาดใหญ่ ประหยัดพื้นที่ติดตั้ง</li>
+              <li><strong>Balancing Valve</strong> - วาล์วสมดุล สำหรับระบบปรับอากาศและทำความร้อน</li>
+              <li><strong>Check Valve</strong> - วาล์วกันน้ำย้อน ป้องกันการไหลย้อนกลับ</li>
+              <li><strong>Y-Strainer</strong> - ตะแกรงกรองตะกอน สำหรับระบบท่อ</li>
+              <li><strong>2 and 3 Way Control Valve</strong> - วาล์วควบคุม 2 และ 3 ทาง สำหรับระบบปรับอากาศ</li>
+              <li><strong>Electronic Room Thermostat</strong> - เทอร์โมสตัทอิเล็กทรอนิกส์ ควบคุมอุณหภูมิห้อง</li>
+              <li><strong>Pressure Gauge & Thermometer</strong> - มาตรวัดความดันและอุณหภูมิ</li>
+              <li><strong>Electric Actuator</strong> - มอเตอร์ขับวาล์วอัตโนมัติ</li>
+              <li><strong>Fire Protection Valve & Equipment</strong> - วาล์วและอุปกรณ์ดับเพลิง</li>
+              <li><strong>Fire Hose Cabinet & Accessories</strong> - ตู้และอุปกรณ์สายฉีดน้ำดับเพลิง</li>
+              <li><strong>Portable Fire Extinguisher</strong> - ถังดับเพลิงชนิดพกพา</li>
+              <li><strong>Angle Hose Valve</strong> - วาล์วสายฉีดน้ำมุม</li>
+              <li><strong>Monitoring Device</strong> - อุปกรณ์ตรวจสอบและควบคุมระบบ</li>
+              <li><strong>Fire Hose</strong> - สายฉีดน้ำดับเพลิง</li>
+              <li><strong>Fire Barrier</strong> - ฉนวนกันไฟ และวัสดุกันไฟ</li>
+              <li><strong>Water Pump</strong> - ปั๊มน้ำสำหรับงานดับเพลิงและระบบน้ำ</li>
+              <li><strong>Cooling Tower</strong> - หอทำลายความร้อน</li>
+              <li><strong>Copper Tube</strong> - ท่อทองแดง สำหรับงานประปาและเครื่องปรับอากาศ</li>
+            </ul>
+
+            <p class="text-lg text-neutral-700 leading-relaxed mb-4"><strong>วัสดุ:</strong> ทองเหลือง, สแตนเลส, PVC, เหล็กหล่อ, ทองแดง</p>
+
+            <p class="text-lg text-neutral-700 leading-relaxed mb-4"><strong>การใช้งาน:</strong></p>
+            <ul class="list-disc pl-6 mb-4 space-y-2 text-neutral-700">
+              <li>งานระบบประปา</li>
+              <li>งานระบบน้ำในอาคาร</li>
+              <li>งานโรงงานอุตสาหกรรม</li>
+              <li>งานชลประทาน</li>
+              <li>งานระบบดับเพลิง</li>
+              <li>งานระบบปรับอากาศ (HVAC)</li>
+              <li>งานระบบทำความร้อน</li>
+            </ul>
+
+            <p class="text-lg text-neutral-700 leading-relaxed mb-4"><strong>ขนาด:</strong> มีขนาดตั้งแต่ DN15 ถึง DN600 หรือ 1/2" ถึง 24" ตามความต้องการ</p>
+
+            <p class="text-lg text-neutral-700 leading-relaxed mb-4">สินค้าทุกชิ้นผ่านการตรวจสอบคุณภาพก่อนส่งมอบ พร้อมรับประกันสินค้าจริง ติดต่อสอบถามราคาและข้อมูลเพิ่มเติมได้ที่ Line @JPPSELECTION หรือโทร 090-555-1415</p>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Additional Images -->
+    <section class="py-16 bg-neutral-50">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl font-bold text-primary-700 mb-6">รูปภาพสินค้าเพิ่มเติม</h2>
+          <div class="grid grid-cols-2 md:grid-cols-3 gap-4">
+            <img src="/images/valve-In01.jpg" alt="วาล์ว (Valve)" class="w-full h-auto rounded-lg shadow-md" width="600" height="400" loading="lazy" onerror="this.style.display='none'" />
+            <img src="/images/valve-In02.jpg" alt="วาล์ว (Valve)" class="w-full h-auto rounded-lg shadow-md" width="600" height="400" loading="lazy" onerror="this.style.display='none'" />
+            <img src="/images/valve-In03.jpg" alt="วาล์ว (Valve)" class="w-full h-auto rounded-lg shadow-md" width="600" height="400" loading="lazy" onerror="this.style.display='none'" />
+            <img src="/images/valve-In05.jpg" alt="วาล์ว (Valve)" class="w-full h-auto rounded-lg shadow-md" width="600" height="400" loading="lazy" onerror="this.style.display='none'" />
+            <img src="/images/valve-In08.jpg" alt="วาล์ว (Valve)" class="w-full h-auto rounded-lg shadow-md" width="600" height="400" loading="lazy" onerror="this.style.display='none'" />
+            <img src="/images/valve-In10.jpg" alt="วาล์ว (Valve)" class="w-full h-auto rounded-lg shadow-md" width="600" height="400" loading="lazy" onerror="this.style.display='none'" />
+            <img src="/images/valve-In15.jpg" alt="วาล์ว (Valve)" class="w-full h-auto rounded-lg shadow-md" width="600" height="400" loading="lazy" onerror="this.style.display='none'" />
+            <img src="/images/valve-In17.jpg" alt="วาล์ว (Valve)" class="w-full h-auto rounded-lg shadow-md" width="600" height="400" loading="lazy" onerror="this.style.display='none'" />
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Valve Selection Guide -->
+    <section class="py-16 bg-white">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl font-bold text-primary-700 mb-8">วิธีเลือกวาล์วให้เหมาะสม</h2>
+          <div class="grid md:grid-cols-2 gap-6">
+            <div class="bg-blue-50 p-6 rounded-xl">
+              <h3 class="font-bold text-primary-800 mb-3">Ball Valve (บอลวาล์ว)</h3>
+              <p class="text-neutral-700 text-sm mb-2">เปิด-ปิดเร็ว ราคาถูก เหมาะกับงานทั่วไป</p>
+              <p class="text-neutral-600 text-sm">ใช้กับ: น้ำเย็น น้ำร้อน ลม</p>
+            </div>
+            <div class="bg-green-50 p-6 rounded-xl">
+              <h3 class="font-bold text-primary-800 mb-3">Gate Valve (เกตวาล์ว)</h3>
+              <p class="text-neutral-700 text-sm mb-2">เปิด-ปิดค่อยเป็นค่อยไป กันย้อนได้</p>
+              <p class="text-neutral-600 text-sm">ใช้กับ: น้ำ น้ำเสีย ลม</p>
+            </div>
+            <div class="bg-orange-50 p-6 rounded-xl">
+              <h3 class="font-bold text-primary-800 mb-3">Check Valve (เช็ควาล์ว)</h3>
+              <p class="text-neutral-700 text-sm mb-2">กันน้ำย้อนอัตโนมัติ</p>
+              <p class="text-neutral-600 text-sm">ใช้กับ: ป้องกันน้ำย้อน</p>
+            </div>
+            <div class="bg-purple-50 p-6 rounded-xl">
+              <h3 class="font-bold text-primary-800 mb-3">Globe Valve (โกลบวาล์ว)</h3>
+              <p class="text-neutral-700 text-sm mb-2">ควบคุมอัตราการไหลได้ละเอียด</p>
+              <p class="text-neutral-600 text-sm">ใช้กับ: งานที่ต้องปรับอัตราการไหล</p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- FAQ Section -->
+    <section class="py-16 bg-neutral-50">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl font-bold text-primary-700 mb-8">คำถามที่พบบ่อย</h2>
+          <div class="space-y-4">
+            <div class="bg-white rounded-xl p-6">
+              <h3 class="font-semibold text-primary-800 mb-2">Q: Ball Valve กับ Gate Valve ต่างกันอย่างไร?</h3>
+              <p class="text-neutral-700">Ball Valve เปิด-ปิดเร็วด้วยการหมุน 90 องศา ส่วน Gate Valve เปิด-ปิดค่อยเป็นค่อยไปด้วยการหมุนบังคับหลายรอบ Gate Valve กันย้อนได้ดีกว่า</p>
+            </div>
+            <div class="bg-white rounded-xl p-6">
+              <h3 class="font-semibold text-primary-800 mb-2">Q: วาล์วขนาดเลือกอย่างไร?</h3>
+              <p class="text-neutral-700">ขนาดวาล์วควรเท่ากับขนาดท่อ หรือเล็กกว่าหนึ่งขนาดสำหรับงานควบคุม</p>
+            </div>
+            <div class="bg-white rounded-xl p-6">
+              <h3 class="font-semibold text-primary-800 mb-2">Q: วาล์ว Brass กับ PVC ต่างกันอย่างไร?</h3>
+              <p class="text-neutral-700">Brass แข็งแรงทนแรงดันสูง เหมาะกับงานที่ต้องการความทนทาน PVC ราคาถูกกว่า เหมาะกับงานทั่วไปแรงดันต่ำ</p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- CTA Section -->
+    <section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white">
+      <div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
+        <h2 class="text-3xl font-bold mb-6">สนใจสินค้าของเรา?</h2>
+        <p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้เพื่อรับคำแนะนำและราคาพิเศษ</p>
+        <div class="flex flex-wrap justify-center gap-4">
+          <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" class="bg-white text-primary-700 px-8 py-4 rounded-xl font-semibold flex items-center gap-2">
+            <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"><path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/></svg>
+            แชท
+          </a>
+          <a href="tel:0905551415" class="bg-white/10 hover:bg-white/20 text-white px-8 py-4 rounded-xl font-semibold border border-white/30">
+            โทร 090-555-1415
+          </a>
+        </div>
+      </div>
+    </section>
+  </main>
+</BaseLayout>
--- a/src/pages/อุปกรณ์ดับเพลิง.astro
+++ b/src/pages/อุปกรณ์ดับเพลิง.astro
@@ -0,0 +1,371 @@
+---
+import BaseLayout from '@/layouts/BaseLayout.astro';
+import Header from '@/components/common/Header.astro';
+import Footer from '@/components/common/Footer.astro';
+import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
+---
+
+<BaseLayout title="อุปกรณ์ดับเพลิง ตู้ดับเพลิงเก็บเครื่องดับเพลิง - ดีล พลัส เทค" description="อุปกรณ์ดับเพลิง ตู้ดับเพลิงเก็บเครื่องดับเพลิง ครบอย่างจบในที่เดียว รับปรึกษาแล้วให้คำแนะนำได้ ไม่ว่าจะติดตั้งที่ไหน เราให้คำตอบคุณได้เสมอ ดีล พลัส เทค">
+  <Header slot="header" />
+
+  <main class="bg-white min-h-screen pb-24 md:pb-0">
+    <!-- Mobile: Full-width Hero Image -->
+    <section class="md:hidden">
+      <div class="w-full aspect-square bg-gray-100">
+        <img src="/images/products-cropped/extinguishers_000C.jpg" alt="อุปกรณ์ดับเพลิง" class="w-full h-full object-cover" width="600" height="600" loading="eager" fetchpriority="high" onerror="this.src='/images/logo/dealplustech-logo.png'" />
+      </div>
+    </section>
+
+    <!-- Product Info Section -->
+    <section class="px-4 py-6 md:px-0 md:py-0">
+      <!-- Mobile: Stacked Content -->
+      <div class="md:hidden">
+        <h1 class="text-2xl font-bold text-slate-900 mb-2">อุปกรณ์ดับเพลิง ตู้ดับเพลิงเก็บเครื่องดับเพลิง</h1>
+        <p class="text-base text-slate-600 mb-6 leading-relaxed">อุปกรณ์ดับเพลิง ตู้ดับเพลิงเก็บเครื่องดับเพลิง ครบอย่างจบในที่เดียว รับปรึกษาแล้วให้คำแนะนำได้ ไม่ว่าจะติดตั้งที่ไหน เราให้คำตอบคุณได้เสมอ ดีล พลัส เทค</p>
+        <div class="space-y-2 mb-6">
+          <div class="flex items-center gap-2 text-slate-700">
+            <svg class="w-5 h-5 text-emerald-600 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+            </svg>
+            <span>คุณภาพสูง มาตรฐานอุตสาหกรรม</span>
+          </div>
+          <div class="flex items-center gap-2 text-slate-700">
+            <svg class="w-5 h-5 text-emerald-600 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+            </svg>
+            <span>ราคาโรงงาน คุ้มค่า</span>
+          </div>
+          <div class="flex items-center gap-2 text-slate-700">
+            <svg class="w-5 h-5 text-emerald-600 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+            </svg>
+            <span>จัดส่งรวดเร็ว ส่งฟรี กทม. ปริมณฑล</span>
+          </div>
+        </div>
+      </div>
+
+      <!-- Desktop: Side-by-side (Hero Section) -->
+      <div class="hidden md:block bg-gradient-to-br from-primary-700 to-primary-600">
+        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-16">
+          <div class="grid lg:grid-cols-2 gap-12 items-start">
+            <div class="lg:sticky lg:top-24">
+              <div class="rounded-2xl overflow-hidden bg-white/10 p-2">
+                <img src="/images/products-cropped/extinguishers_000C.jpg" alt="อุปกรณ์ดับเพลิง" class="w-full h-auto rounded-xl" width="600" height="400" loading="eager" fetchpriority="high" decoding="sync" onerror="this.src='/images/logo/dealplustech-logo.png'" />
+              </div>
+            </div>
+            <div>
+              <span class="inline-block px-4 py-1.5 bg-white/20 text-white rounded-full text-sm font-medium mb-4">
+                อุปกรณ์ดับเพลิง
+              </span>
+              <h1 class="text-3xl sm:text-4xl lg:text-5xl font-bold text-white mb-4">อุปกรณ์ดับเพลิง ตู้ดับเพลิงเก็บเครื่องดับเพลิง</h1>
+              <p class="text-lg sm:text-xl text-white/80 mb-8 leading-relaxed">
+                อุปกรณ์ดับเพลิง ตู้ดับเพลิงเก็บเครื่องดับเพลิง ครบอย่างจบในที่เดียว รับปรึกษาแล้วให้คำแนะนำได้ ไม่ว่าจะติดตั้งที่ไหน เราให้คำตอบคุณได้เสมอ ดีล พลัส เทค
+              </p>
+              <div class="flex flex-wrap gap-4 mb-8">
+                <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" class="bg-white text-primary-700 hover:bg-primary-50 py-3 px-6 rounded-xl font-semibold flex items-center gap-2">
+                  <span>แชท</span>
+                  <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"><path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/></svg>
+                </a>
+                <a href="tel:0905551415" class="bg-white/10 hover:bg-white/20 text-white py-3 px-6 rounded-xl font-semibold border border-white/30 flex items-center gap-2">
+                  <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z"/>
+                  </svg>
+                  <span>090-555-1415</span>
+                </a>
+              </div>
+              <div class="space-y-4">
+                <div class="flex items-start space-x-3">
+                  <svg class="w-6 h-6 text-white mt-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                  </svg>
+                  <span class="text-lg text-white/80">คุณภาพสูง มาตรฐานอุตสาหกรรม</span>
+                </div>
+                <div class="flex items-start space-x-3">
+                  <svg class="w-6 h-6 text-white mt-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                  </svg>
+                  <span class="text-lg text-white/80">ราคาโรงงาน คุ้มค่า</span>
+                </div>
+                <div class="flex items-start space-x-3">
+                  <svg class="w-6 h-6 text-white mt-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                  </svg>
+                  <span class="text-lg text-white/80">จัดส่งรวดเร็ว ส่งฟรี กทม. ปริมณฑล</span>
+                </div>
+                <div class="flex items-start space-x-3">
+                  <svg class="w-6 h-6 text-white mt-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                  </svg>
+                  <span class="text-lg text-white/80">รับประกันสินค้า</span>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Product Specifications -->
+    <section class="py-16">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-xl font-bold text-slate-900 mb-8">รายละเอียดสินค้า</h2>
+
+          <div class="flex justify-center mb-8">
+            <img src="/images/fire-extinguisher-p1.jpg" alt="ถังดับเพลิง" class="max-w-md w-full rounded-lg shadow-md" width="400" height="300" loading="lazy" decoding="async" />
+          </div>
+
+          <div class="prose prose-lg max-w-none mb-8">
+            <p class="text-lg text-slate-700 leading-relaxed mb-4">จำหน่ายถังดับเพลิงและอุปกรณ์ดับเพลิงครบวงจร สำหรับบ้าน อาคาร โรงงาน และพื้นที่สาธารณะ มาตรฐาน มอก. พร้อมให้คำปรึกษาและติดตั้งโดยทีมงานมืออาชีพ</p>
+
+            <p class="text-lg text-slate-700 leading-relaxed mb-4"><strong>ประเภทถังดับเพลิงที่มีจำหน่าย:</strong></p>
+            <ul class="list-disc pl-6 mb-4 space-y-2">
+              <li><strong>ถังดับเพลิงชนิดผงเคมีแห้ง (Dry Chemical)</strong> - ใช้ได้กับไฟทุกประเภท ABC</li>
+              <li><strong>ถังดับเพลิงชนิดน้ำ (Water)</strong> - เหมาะสำหรับไฟประเภท A</li>
+              <li><strong>ถังดับเพลิงชนิดโฟม (Foam)</strong> - เหมาะสำหรับไฟประเภท A และ B</li>
+              <li><strong>ถังดับเพลิงชนิด CO2</strong> - เหมาะสำหรับไฟประเภท B และอุปกรณ์ไฟฟ้า</li>
+            </ul>
+
+            <p class="text-lg text-slate-700 leading-relaxed mb-4"><strong>ขนาด:</strong> 1 กก., 2 กก., 4.5 กก., 6 กก., 9 กก., 12 กก. และขนาดตามสั่ง</p>
+
+            <p class="text-lg text-slate-700 leading-relaxed mb-4"><strong>มาตรฐาน:</strong> มอก. 486-2551</p>
+          </div>
+
+          <div class="overflow-x-auto my-8">
+            <table class="w-full border-collapse">
+              <thead class="bg-primary-600 text-white">
+                <tr>
+                  <th class="px-6 py-4 text-left text-sm font-semibold uppercase">รูปภาพ</th>
+                  <th class="px-6 py-4 text-left text-sm font-semibold uppercase">ประเภท</th>
+                  <th class="px-6 py-4 text-left text-sm font-semibold uppercase">ขนาด</th>
+                  <th class="px-6 py-4 text-left text-sm font-semibold uppercase">วัสดุ</th>
+                  <th class="px-6 py-4 text-left text-sm font-semibold uppercase">กระจก</th>
+                  <th class="px-6 py-4 text-left text-sm font-semibold uppercase">กุญแจและภายใน</th>
+                </tr>
+              </thead>
+              <tbody class="bg-white">
+                <tr class="hover:bg-primary-50 transition-colors">
+                  <td class="px-6 py-4 border-b border-gray-200" rowspan="3"><img src="/images/fire-cabinet-1-crop.jpg" alt="ตู้ดับเพลิงแบบเดี่ยว" class="w-24 h-auto rounded" width="96" height="72" loading="lazy" decoding="async" /></td>
+                  <td class="px-6 py-4 border-b border-gray-200 text-lg" rowspan="3">แบบเดี่ยว</td>
+                  <td class="px-6 py-4 border-b border-gray-200 text-lg">300 x 600 x 250 มม.</td>
+                  <td class="px-6 py-4 border-b border-gray-200 text-lg" rowspan="3">เหล็ก#16 พ่นสีแดง</td>
+                  <td class="px-6 py-4 border-b border-gray-200 text-lg">กระจกธรรมดา</td>
+                  <td class="px-6 py-4 border-b border-gray-200 text-lg" rowspan="3">กุญแจเด้ง</td>
+                </tr>
+                <tr class="hover:bg-primary-50 transition-colors">
+                  <td class="px-6 py-4 border-b border-gray-200 text-lg">400 x 700 x 250 มม.</td>
+                  <td class="px-6 py-4 border-b border-gray-200 text-lg">กระจกนิรภัย 4 มม.</td>
+                </tr>
+                <tr class="hover:bg-primary-50 transition-colors">
+                  <td class="px-6 py-4 border-b border-gray-200 text-lg">400 x 800 x 250 มม.</td>
+                  <td class="px-6 py-4 border-b border-gray-200 text-lg"></td>
+                </tr>
+                <tr class="hover:bg-primary-50 transition-colors">
+                  <td class="px-6 py-4 border-b border-gray-200"><img src="/images/fire-cabinet-2-crop.jpg" alt="ตู้ดับเพลิงแบบใส่สายดับเพลิง" class="w-24 h-auto rounded" width="96" height="72" loading="lazy" decoding="async" /></td>
+                  <td class="px-6 py-4 border-b border-gray-200 text-lg">แบบใส่สายดับเพลิง</td>
+                  <td class="px-6 py-4 border-b border-gray-200 text-lg">600 x 700 x 200 มม.</td>
+                  <td class="px-6 py-4 border-b border-gray-200 text-lg">เหล็ก#21 พ่นสีแดง</td>
+                  <td class="px-6 py-4 border-b border-gray-200 text-lg">กระจกธรรมดา<br/>กระจกนิรภัย 4 มม.</td>
+                  <td class="px-6 py-4 border-b border-gray-200 text-lg">กุญแจเด้ง<br/>เหล็กรองรับสายดับเพลิง<br/>ที่ล็อกหัวฉีดดับเพลิง</td>
+                </tr>
+              </tbody>
+            </table>
+          </div>
+
+          <h3 class="text-xl font-bold text-slate-900 mb-4">วิธีการเลือกตู้ดับเพลิงเก็บเครื่องดับเพลิง</h3>
+          <img src="/images/fire-extinguisher-p3.jpg" alt="วิธีการเลือกตู้ดับเพลิง" class="w-full rounded-lg shadow-md" width="800" height="600" loading="lazy" decoding="async" />
+        </div>
+      </div>
+    </section>
+
+    <!-- Fire System Types Guide -->
+    <section class="py-16 bg-gray-50">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-xl font-bold text-slate-900 mb-8 text-center">ระบบดับเพลิงและอุปกรณ์ป้องกันอัคคีภัย</h2>
+
+          <div class="grid md:grid-cols-3 gap-8">
+            <div class="bg-white rounded-xl p-6 shadow-sm hover:shadow-md transition-shadow">
+              <div class="w-14 h-14 bg-primary-100 rounded-lg flex items-center justify-center mb-4">
+                <svg class="w-8 h-8 text-primary-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19.428 15.428a2 2 0 00-1.022-.547l-2.384-.477a6 6 0 00-3.86.517l-.318.158a6 6 0 01-3.86.517L6.05 15.21a2 2 0 00-1.806.547M8 4h8l-1 1v5.172a2 2 0 00.586 1.414l5 5c1.26 1.26.367 3.414-1.415 3.414H4.828c-1.782 0-2.674-2.154-1.414-3.414l5-5A2 2 0 009 10.172V5L8 4z"/>
+                </svg>
+              </div>
+              <h3 class="text-lg font-bold text-slate-900 mb-3">ระบบสปริงเกอร์ดับเพลิง (Sprinkler System)</h3>
+              <p class="text-slate-600 mb-4">ระบบดับเพลิงอัตโนมัติที่ติดตั้งหัวสปริงเกอร์ตามเพดานเมื่อตรวจพบอุณหภูมิสูงถึงจุดตั้งค่า หัวสปริงจะทำงานและพ่นน้ำอัตโนมัติ</p>
+              <ul class="text-sm text-slate-600 space-y-2">
+                <li>• Wet Pipe System - น้ำในท่อตลอดเวลา</li>
+                <li>• Dry Pipe System - อากาศแทนน้ำในท่อ</li>
+                <li>• Pre-Action System - รวม Wet และ Dry</li>
+                <li>• Deluge System - น้ำพร้อมเปิดพร้อมกันทุกหัว</li>
+              </ul>
+            </div>
+
+            <div class="bg-white rounded-xl p-6 shadow-sm hover:shadow-md transition-shadow">
+              <div class="w-14 h-14 bg-primary-100 rounded-lg flex items-center justify-center mb-4">
+                <svg class="w-8 h-8 text-primary-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z"/>
+                </svg>
+              </div>
+              <h3 class="text-lg font-bold text-slate-900 mb-3">ระบบไฮแดรนท์ (Hydrant System)</h3>
+              <p class="text-slate-600 mb-4">ระบบดับเพลิงภายในอาคารที่เชื่อมต่อกับแหล่งน้ำแรงดันสูง มีหัวฉีดและสายยางพร้อมใช้งาน</p>
+              <ul class="text-sm text-slate-600 space-y-2">
+                <li>• ถังดับเพลิงแบบตั้งเติม (Wall Mounted)</li>
+                <li>• ตู้ดับเพลิงเก็บเครื่องดับเพลิง</li>
+                <li>• หัวฉีดน้ำดับเพลิง (Fire Hose)</li>
+                <li>• สายดับเพลิงและมือจับ</li>
+              </ul>
+            </div>
+
+            <div class="bg-white rounded-xl p-6 shadow-sm hover:shadow-md transition-shadow">
+              <div class="w-14 h-14 bg-primary-100 rounded-lg flex items-center justify-center mb-4">
+                <svg class="w-8 h-8 text-primary-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 17h5l-1.405-1.405A2.032 2.032 0 0118 14.158V11a6.002 6.002 0 00-4-5.659V5a2 2 0 10-4 0v.341C7.67 6.165 6 8.388 6 11v3.159c0 .538-.214 1.055-.595 1.436L4 17h5m6 0v1a3 3 0 11-6 0v-1m6 0H9"/>
+                </svg>
+              </div>
+              <h3 class="text-lg font-bold text-slate-900 mb-3">ระบบเตือนอัคคีภัย (Fire Alarm System)</h3>
+              <p class="text-slate-600 mb-4">ระบบตรวจจับและแจ้งเตือนเมื่อเกิดเหตุไฟไหม้ ประกอบด้วยอุปกรณ์ตรวจจับหลายประเภท</p>
+              <ul class="text-sm text-slate-600 space-y-2">
+                <li>• สัญญาณเตือนไฟ (Smoke Detector)</li>
+                <li>• ตัวตรวจจับความร้อน (Heat Detector)</li>
+                <li>• ปุ่มกดแจ้งเหตุ (Manual Pull Station)</li>
+                <li>• กริ่งและไซเรนเตือนไฟ</li>
+              </ul>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Product Selection Guide -->
+    <section class="py-16">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <h2 class="text-xl font-bold text-slate-900 mb-8 text-center">วิธีเลือกอุปกรณ์ดับเพลิงให้เหมาะกับการใช้งาน</h2>
+
+        <div class="max-w-4xl mx-auto">
+          <div class="prose prose-lg max-w-none">
+            <p class="text-lg text-slate-700 leading-relaxed mb-6">การเลือกอุปกรณ์ดับเพลิงที่เหมาะสมต้องพิจารณาหลายปัจจัย เพื่อให้การป้องกันอัคคีภัยมีประสิทธิภาพสูงสุด</p>
+
+            <div class="grid md:grid-cols-2 gap-6 mb-8">
+              <div class="bg-primary-50 rounded-lg p-6">
+                <h3 class="font-bold text-slate-900 mb-3">1. พิจารณาประเภทไฟ</h3>
+                <p class="text-slate-700 text-sm">ไฟแบ่งเป็น 4 ประเภท (Class A, B, C, D) - เลือกถังดับเพลิงให้เหมาะกับประเภทไฟที่มีโอกาสเกิดในพื้นที่นั้น</p>
+              </div>
+              <div class="bg-primary-50 rounded-lg p-6">
+                <h3 class="font-bold text-slate-900 mb-3">2. ขนาดพื้นที่</h3>
+                <p class="text-slate-700 text-sm">พื้นที่ใหญ่ต้องการถังดับเพลิงขนาดใหญ่หรือจำนวนมากขึ้น คำนวณตามสูตร 1 กก. ต่อ 25 ตารางเมตร</p>
+              </div>
+              <div class="bg-primary-50 rounded-lg p-6">
+                <h3 class="font-bold text-slate-900 mb-3">3. มาตรฐานและการรับรอง</h3>
+                <p class="text-slate-700 text-sm">เลือกผลิตภัณฑ์ที่ได้รับมาตรฐาน มอก. และผ่านการทดสอบจากหน่วยงานที่เชื่อถือได้</p>
+              </div>
+              <div class="bg-primary-50 rounded-lg p-6">
+                <h3 class="font-bold text-slate-900 mb-3">4. การบำรุงรักษา</h3>
+                <p class="text-slate-700 text-sm">เลือกอุปกรณ์ที่ดูแลรักษาง่าย มีอะไหล่พร้อม ตรวจสอบความดันและวันหมดอายุเป็นประจำทุกปี</p>
+              </div>
+            </div>
+
+            <h3 class="text-lg font-bold text-slate-900 mb-4">ตารางเปรียบเทียบประเภทถังดับเพลิง</h3>
+            <div class="overflow-x-auto my-6">
+              <table class="w-full border-collapse">
+                <thead class="bg-primary-600 text-white">
+                  <tr>
+                    <th class="px-4 py-3 text-left text-sm font-semibold">ประเภทถังดับเพลิง</th>
+                    <th class="px-4 py-3 text-left text-sm font-semibold">ใช้กับไฟประเภท</th>
+                    <th class="px-4 py-3 text-left text-sm font-semibold">เหมาะกับ</th>
+                    <th class="px-4 py-3 text-left text-sm font-semibold">ข้อจำกัด</th>
+                  </tr>
+                </thead>
+                <tbody class="bg-white">
+                  <tr class="hover:bg-primary-50">
+                    <td class="px-4 py-3 border-b border-gray-200">ผงเคมีแห้ง (ABC)</td>
+                    <td class="px-4 py-3 border-b border-gray-200">A, B, C</td>
+                    <td class="px-4 py-3 border-b border-gray-200">บ้านเรือน สำนักงาน โรงงาน</td>
+                    <td class="px-4 py-3 border-b border-gray-200">ทำความสะอาดยากหลังใช้งาน</td>
+                  </tr>
+                  <tr class="hover:bg-primary-50">
+                    <td class="px-4 py-3 border-b border-gray-200">น้ำ (Water)</td>
+                    <td class="px-4 py-3 border-b border-gray-200">A เท่านั้น</td>
+                    <td class="px-4 py-3 border-b border-gray-200">โกดัง ที่เก็บของ อาคารพาณิชย์</td>
+                    <td class="px-4 py-3 border-b border-gray-200">ไม่ใช้กับไฟไฟฟ้าและน้ำมัน</td>
+                  </tr>
+                  <tr class="hover:bg-primary-50">
+                    <td class="px-4 py-3 border-b border-gray-200">โฟม (Foam)</td>
+                    <td class="px-4 py-3 border-b border-gray-200">A, B</td>
+                    <td class="px-4 py-3 border-b border-gray-200">สถานีบริการน้ำมัน ท่าเรือ</td>
+                    <td class="px-4 py-3 border-b border-gray-200">ไม่ใช้กับไฟประเภท C และ D</td>
+                  </tr>
+                  <tr class="hover:bg-primary-50">
+                    <td class="px-4 py-3 border-b border-gray-200">CO2</td>
+                    <td class="px-4 py-3 border-b border-gray-200">B, ไฟฟ้า</td>
+                    <td class="px-4 py-3 border-b border-gray-200">ห้องเซิร์ฟเวอร์ ห้องไฟฟ้า</td>
+                    <td class="px-4 py-3 border-b border-gray-200">ไม่ใช้กับไฟประเภท A</td>
+                  </tr>
+                </tbody>
+              </table>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- FAQ Section -->
+    <section class="py-16 bg-gray-50">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <h2 class="text-xl font-bold text-slate-900 mb-8 text-center">คำถามที่พบบ่อยเกี่ยวกับอุปกรณ์ดับเพลิง</h2>
+
+        <div class="max-w-4xl mx-auto space-y-4">
+          <div class="bg-white rounded-lg p-6">
+            <h3 class="font-bold text-slate-900 mb-2">1. ถังดับเพลิงมีอายุการใช้งานนานเท่าไหร่?</h3>
+            <p class="text-slate-700">ถังดับเพลิงมีอายุการใช้งานประมาณ 10-20 ปี ขึ้นอยู่กับประเภทและการบำรุงรักษา แต่ต้องเปลี่ยนผงเคมีหรือน้ำยาดับเพลิงทุก 5 ปี หรือตามที่ผู้ผลิตแนะนำ</p>
+          </div>
+
+          <div class="bg-white rounded-lg p-6">
+            <h3 class="font-bold text-slate-900 mb-2">2. ควรติดตั้งถังดับเพลิงกี่ลูกในบ้าน?</h3>
+            <p class="text-slate-700">สำหรับบ้านพักอาศัยทั่วไป แนะนำให้ติดตั้งถังดับเพลิงขนาด 2-4 กก. อย่างน้อย 1 ลูกต่อชั้น โดยเฉพาะใกล้ครัวและที่จอดรถ ส่วนอาคารพาณิชย์ต้องคำนวณตามขนาดพื้นที่และประเภทการใช้งาน</p>
+          </div>
+
+          <div class="bg-white rounded-lg p-6">
+            <h3 class="font-bold text-slate-900 mb-2">3. ถังดับเพลิงชนิดไหนเหมาะกับห้องเซิร์ฟเวอร์?</h3>
+            <p class="text-slate-700">ห้องเซิร์ฟเวอร์และห้องที่มีอุปกรณ์ไฟฟ้ามากควรใช้ถังดับเพลิงชนิด CO2 หรือผงเคมีแห้ง เพราะไม่ทำลายอุปกรณ์และปลอดภัยสำหรับไฟฟ้า ห้ามใช้ถังดับเพลิงชนิดน้ำเด็ดขาด</p>
+          </div>
+
+          <div class="bg-white rounded-lg p-6">
+            <h3 class="font-bold text-slate-900 mb-2">4. การติดตั้งระบบดับเพลิงมีข้อกำหนดอะไรบ้าง?</h3>
+            <p class="text-slate-700">การติดตั้งต้องปฏิบัติตามกฎหมายควบคุมอาคารและมาตรฐาน มอก. โดยอาคารประเภทต่างๆ มีข้อกำหนดแตกต่างกัน เช่น โรงแรม โรงงาน ห้างสรรพสินค้าต้องมีระบบดับเพลิงที่ครบถ้วนตามขนาดและการใช้งาน</p>
+          </div>
+
+          <div class="bg-white rounded-lg p-6">
+            <h3 class="font-bold text-slate-900 mb-2">5. บริษัทของเราให้บริการติดตั้งและบำรุงรักษาอุปกรณ์ดับเพลิงหรือไม่?</h3>
+            <p class="text-slate-700">ใช่ บริษัท ดีล พลัส เทค ให้บริการครบวงจร ตั้งแต่ให้คำปรึกษา ออกแบบระบบ จัดหาและติดตั้งอุปกรณ์ดับเพลิง พร้อมทั้งบริการตรวจสอบและบำรุงรักษาตามมาตรฐาน ติดต่อสอบถามรายละเอียดได้ที่ Line @JPPSELECTION</p>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- CTA Section -->
+    <section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white text-center">
+      <div class="max-w-4xl mx-auto px-4">
+        <h2 class="text-2xl md:text-3xl font-bold mb-6">สนใจสินค้าของเรา?</h2>
+        <p class="text-lg text-white/80 mb-8 max-w-2xl mx-auto">
+          ติดต่อเราวันนี้เพื่อรับคำแนะนำและราคาพิเศษ
+        </p>
+        <div class="flex flex-wrap justify-center gap-4">
+          <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" class="bg-white text-primary-700 hover:bg-primary-50 py-3 px-8 rounded-xl font-semibold flex items-center gap-2">
+            <span>แชท</span>
+            <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"><path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/></svg>
+          </a>
+          <a href="tel:0905551415" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-8 rounded-xl font-semibold flex items-center gap-2">
+            <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z"/>
+            </svg>
+            <span>090-555-1415</span>
+          </a>
+        </div>
+      </div>
+    </section>
+  </main>
+
+  <Footer slot="footer" />
+  <StickyBottomCTA phone="0905551415" lineUrl="https://line.me/ti/p/~JPPSELECTION" slot="after-footer" />
+</BaseLayout>
--- a/src/pages/อุปกรณ์ปรับอากาศ.astro
+++ b/src/pages/อุปกรณ์ปรับอากาศ.astro
@@ -0,0 +1,262 @@
+---
+import BaseLayout from '@/layouts/BaseLayout.astro';
+---
+
+<BaseLayout title="อุปกรณ์ปรับอากาศ | ระบบปรับอากาศคุณภาพสูง ประหยัดพลังงาน" description="อุปกรณ์ปรับอากาศคุณภาพสูง ระบบ VRF, แอร์ธรรมดา, พัดลมและอุปกรณ์เสริม พร้อมบริการติดตั้งและดูแล">
+  <section class="bg-gradient-to-br from-primary-700 to-primary-600 text-white py-12">
+    <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+      <nav class="text-sm mb-4 text-primary-100">
+        <a href="/" class="hover:text-white">หน้าแรก</a> / <a href="/all-products" class="hover:text-white">สินค้าทั้งหมด</a> / <span class="text-white">อุปกรณ์ปรับอากาศ</span>
+      </nav>
+      <div class="grid lg:grid-cols-2 gap-8 items-center">
+        <div class="img-hover rounded-2xl overflow-hidden bg-white/10">
+          <img src="/images/products-raw/ball-jet/main-ball-jet.jpg" alt="อุปกรณ์ปรับอากาศ" class="w-full" loading="eager" />
+        </div>
+        <div>
+          <span class="text-sm text-primary-200 font-medium">ระบบปรับอากาศ</span>
+          <h1 class="text-3xl lg:text-4xl font-bold mt-2 mb-4">อุปกรณ์ปรับอากาศ</h1>
+          <p class="text-primary-100 text-lg mb-6">ระบบปรับอากาศคุณภาพสูง ตั้งแต่แอร์ติดผนังจนถึงระบบ VRF สำหรับอาคารขนาดใหญ่ พร้อมบริการติดตั้งและดูแลครบวงจร</p>
+          <div class="flex flex-wrap gap-4">
+            <a href="/contact-us" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-6 rounded-xl font-semibold">สอบถามราคา</a>
+            <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" class="bg-white/10 hover:bg-white/20 text-white py-3 px-6 rounded-xl font-semibold border border-white/30 flex items-center gap-2">
+              <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"><path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/></svg>
+              แชท LINE
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </section>
+
+  <!-- Services Section -->
+  <section class="py-16 bg-neutral-50">
+    <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+      <div class="text-center mb-12">
+        <h2 class="text-3xl lg:text-4xl font-bold text-primary-700 mb-4">บริการของเรา</h2>
+        <p class="text-neutral-600 max-w-2xl mx-auto">ครบวงจร ตั้งแต่ขายจนถึงดูแลหลังการขาย</p>
+      </div>
+      <div class="grid md:grid-cols-2 lg:grid-cols-4 gap-6">
+        <div class="bg-white rounded-xl p-6 shadow-sm hover:shadow-md transition-shadow text-center">
+          <div class="text-4xl mb-4">🔧</div>
+          <h3 class="text-lg font-semibold text-neutral-900 mb-2">ติดตั้งแอร์ใหม่</h3>
+          <p class="text-sm text-neutral-600">บริการติดตั้งแอร์ทุกประเภท พร้อม warranty 1 ปี</p>
+        </div>
+        <div class="bg-white rounded-xl p-6 shadow-sm hover:shadow-md transition-shadow text-center">
+          <div class="text-4xl mb-4">🔩</div>
+          <h3 class="text-lg font-semibold text-neutral-900 mb-2">ซ่อมและบำรุงรักษา</h3>
+          <p class="text-sm text-neutral-600">บริการซ่อมแอร์ ล้างแอร์ เติมน้ำยา</p>
+        </div>
+        <div class="bg-white rounded-xl p-6 shadow-sm hover:shadow-md transition-shadow text-center">
+          <div class="text-4xl mb-4">📐</div>
+          <h3 class="text-lg font-semibold text-neutral-900 mb-2">ออกแบบระบบ</h3>
+          <p class="text-sm text-neutral-600">ออกแบบระบบปรับอากาศตามความต้องการ</p>
+        </div>
+        <div class="bg-white rounded-xl p-6 shadow-sm hover:shadow-md transition-shadow text-center">
+          <div class="text-4xl mb-4">🛒</div>
+          <h3 class="text-lg font-semibold text-neutral-900 mb-2">จำหน่ายอะไหล่</h3>
+          <p class="text-sm text-neutral-600">อะไหล่แอร์ทุกยี่ห้อ ราคาย่อมเยา</p>
+        </div>
+      </div>
+    </div>
+  </section>
+
+  <!-- Types Section -->
+  <section class="py-16 bg-white">
+    <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+      <div class="text-center mb-12">
+        <h2 class="text-3xl lg:text-4xl font-bold text-primary-700 mb-4">ประเภทอุปกรณ์</h2>
+        <p class="text-neutral-600 max-w-2xl mx-auto">เลือกระบบตามความต้องการใช้งาน</p>
+      </div>
+      <div class="grid md:grid-cols-2 lg:grid-cols-4 gap-6">
+        <!-- แอร์ติดผนัง -->
+        <div class="bg-white rounded-2xl overflow-hidden shadow-sm hover:shadow-xl transition-all border border-neutral-200">
+          <div class="aspect-video overflow-hidden">
+            <img src="/images/grilles/supply-air-content.jpg" alt="แอร์ติดผนัง" class="w-full h-full object-cover" loading="lazy" />
+          </div>
+          <div class="p-5">
+            <h3 class="text-lg font-bold text-neutral-900 mb-2">แอร์ติดผนัง</h3>
+            <div class="text-sm text-primary-600 font-medium mb-3">9,000-24,000 BTU</div>
+            <ul class="space-y-1">
+              <li class="flex items-center text-sm text-neutral-600"><span class="text-primary-600 mr-2">✓</span>เหมาะสำหรับห้องขนาดเล็ก-กลาง</li>
+              <li class="flex items-center text-sm text-neutral-600"><span class="text-primary-600 mr-2">✓</span>ติดตั้งง่าย</li>
+              <li class="flex items-center text-sm text-neutral-600"><span class="text-primary-600 mr-2">✓</span>ราคาย่อมเยา</li>
+            </ul>
+          </div>
+        </div>
+        <!-- แอร์ตั้งตู้ -->
+        <div class="bg-white rounded-2xl overflow-hidden shadow-sm hover:shadow-xl transition-all border border-neutral-200">
+          <div class="aspect-video overflow-hidden">
+            <img src="/images/grilles/air-grille-content.jpg" alt="แอร์ตั้งตู้" class="w-full h-full object-cover" loading="lazy" />
+          </div>
+          <div class="p-5">
+            <h3 class="text-lg font-bold text-neutral-900 mb-2">แอร์ตั้งตู้</h3>
+            <div class="text-sm text-primary-600 font-medium mb-3">18,000-48,000 BTU</div>
+            <ul class="space-y-1">
+              <li class="flex items-center text-sm text-neutral-600"><span class="text-primary-600 mr-2">✓</span>เหมาะสำหรับห้องขนาดใหญ่</li>
+              <li class="flex items-center text-sm text-neutral-600"><span class="text-primary-600 mr-2">✓</span>กระจายความเย็นสม่ำเสมอ</li>
+              <li class="flex items-center text-sm text-neutral-600"><span class="text-primary-600 mr-2">✓</span>ดีไซน์กลมกลืน</li>
+            </ul>
+          </div>
+        </div>
+        <!-- แอร์ฝังเพดาน -->
+        <div class="bg-white rounded-2xl overflow-hidden shadow-sm hover:shadow-xl transition-all border border-neutral-200">
+          <div class="aspect-video overflow-hidden">
+            <img src="/images/grilles/supply-air-content.jpg" alt="แอร์ฝังเพดาน" class="w-full h-full object-cover" loading="lazy" />
+          </div>
+          <div class="p-5">
+            <h3 class="text-lg font-bold text-neutral-900 mb-2">แอร์ฝังเพดาน</h3>
+            <div class="text-sm text-primary-600 font-medium mb-3">24,000-60,000 BTU</div>
+            <ul class="space-y-1">
+              <li class="flex items-center text-sm text-neutral-600"><span class="text-primary-600 mr-2">✓</span>ซ่อนเครื่องในเพดาน</li>
+              <li class="flex items-center text-sm text-neutral-600"><span class="text-primary-600 mr-2">✓</span>เหมาะสำหรับออฟฟิศ</li>
+              <li class="flex items-center text-sm text-neutral-600"><span class="text-primary-600 mr-2">✓</span>ควบคุมอุณหภูมิเป็นโซน</li>
+            </ul>
+          </div>
+        </div>
+        <!-- ระบบ VRF -->
+        <div class="bg-white rounded-2xl overflow-hidden shadow-sm hover:shadow-xl transition-all border border-neutral-200">
+          <div class="aspect-video overflow-hidden">
+            <img src="/images/grilles/linear-slot-content.jpg" alt="ระบบ VRF" class="w-full h-full object-cover" loading="lazy" />
+          </div>
+          <div class="p-5">
+            <h3 class="text-lg font-bold text-neutral-900 mb-2">ระบบ VRF</h3>
+            <div class="text-sm text-primary-600 font-medium mb-3">3-16 แรงม้า</div>
+            <ul class="space-y-1">
+              <li class="flex items-center text-sm text-neutral-600"><span class="text-primary-600 mr-2">✓</span>ควบคุมหลายห้องพร้อมกัน</li>
+              <li class="flex items-center text-sm text-neutral-600"><span class="text-primary-600 mr-2">✓</span>ประหยัดพลังงาน</li>
+              <li class="flex items-center text-sm text-neutral-600"><span class="text-primary-600 mr-2">✓</span>เหมาะสำหรับอาคารขนาดใหญ่</li>
+            </ul>
+          </div>
+        </div>
+      </div>
+    </div>
+  </section>
+
+  <!-- Selection Guide -->
+  <section class="py-16 bg-primary-700 text-white">
+    <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+      <div class="text-center mb-12">
+        <h2 class="text-3xl lg:text-4xl font-bold mb-4">แนะนำการเลือกขนาดแอร์</h2>
+        <p class="text-primary-100 max-w-2xl mx-auto">เลือกขนาด BTU ให้เหมาะกับพื้นที่</p>
+      </div>
+      <div class="overflow-x-auto">
+        <table class="w-full min-w-[500px]">
+          <thead>
+            <tr class="border-b border-white/20">
+              <th class="text-left py-3 px-4 font-semibold">ขนาดห้อง</th>
+              <th class="text-left py-3 px-4 font-semibold">BTU ที่เหมาะสม</th>
+              <th class="text-left py-3 px-4 font-semibold">ประเภทแนะนำ</th>
+            </tr>
+          </thead>
+          <tbody>
+            <tr class="border-b border-white/10 hover:bg-white/5"><td class="py-3 px-4">ไม่เกิน 15 ตร.ม.</td><td class="py-3 px-4 font-semibold">9,000 BTU</td><td class="py-3 px-4">แอร์ติดผนัง</td></tr>
+            <tr class="border-b border-white/10 hover:bg-white/5"><td class="py-3 px-4">15-25 ตร.ม.</td><td class="py-3 px-4 font-semibold">12,000-18,000 BTU</td><td class="py-3 px-4">แอร์ติดผนัง/ตั้งตู้</td></tr>
+            <tr class="border-b border-white/10 hover:bg-white/5"><td class="py-3 px-4">25-40 ตร.ม.</td><td class="py-3 px-4 font-semibold">18,000-24,000 BTU</td><td class="py-3 px-4">แอร์ตั้งตู้</td></tr>
+            <tr class="border-b border-white/10 hover:bg-white/5"><td class="py-3 px-4">40-60 ตร.ม.</td><td class="py-3 px-4 font-semibold">30,000-36,000 BTU</td><td class="py-3 px-4">แอร์ฝังเพดาน</td></tr>
+            <tr class="border-b border-white/10 hover:bg-white/5"><td class="py-3 px-4">มากกว่า 60 ตร.ม.</td><td class="py-3 px-4 font-semibold">48,000+ BTU / VRF</td><td class="py-3 px-4">ระบบ VRF</td></tr>
+          </tbody>
+        </table>
+      </div>
+      <p class="text-sm text-white/70 mt-4 text-center">* คำแนะนำเป็นเพียงแนวทางทั่วไป ขนาดที่เหมาะสมขึ้นอยู่กับปัจจัยอื่น เช่น ความสูงของห้อง จำนวนคน ทิศทางแดด</p>
+    </div>
+  </section>
+
+  <!-- Accessories Section -->
+  <section class="py-16 bg-white">
+    <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+      <div class="text-center mb-12">
+        <h2 class="text-3xl lg:text-4xl font-bold text-primary-700 mb-4">อุปกรณ์เสริม</h2>
+        <p class="text-neutral-600 max-w-2xl mx-auto">อุปกรณ์และส่วนประกอบครบครัน</p>
+      </div>
+      <div class="grid grid-cols-2 md:grid-cols-4 gap-6">
+        <div class="bg-white rounded-xl p-4 shadow-sm hover:shadow-md transition-shadow text-center border border-neutral-200">
+          <div class="aspect-square rounded-lg overflow-hidden mb-3">
+            <img src="/images/grilles/linear-bar.jpg" alt="คอยล์ร้อน" class="w-full h-full object-cover" loading="lazy" />
+          </div>
+          <h4 class="font-medium text-neutral-900">คอยล์ร้อน</h4>
+        </div>
+        <div class="bg-white rounded-xl p-4 shadow-sm hover:shadow-md transition-shadow text-center border border-neutral-200">
+          <div class="aspect-square rounded-lg overflow-hidden mb-3">
+            <img src="/images/grilles/fresh-air-hing-type.jpg" alt="พัดลมระบายอากาศ" class="w-full h-full object-cover" loading="lazy" />
+          </div>
+          <h4 class="font-medium text-neutral-900">พัดลมระบายอากาศ</h4>
+        </div>
+        <div class="bg-white rounded-xl p-4 shadow-sm hover:shadow-md transition-shadow text-center border border-neutral-200">
+          <div class="aspect-square rounded-lg overflow-hidden mb-3">
+            <img src="/images/grilles/return-air.jpg" alt="ท่อลมแอร์" class="w-full h-full object-cover" loading="lazy" />
+          </div>
+          <h4 class="font-medium text-neutral-900">ท่อลมแอร์</h4>
+        </div>
+        <div class="bg-white rounded-xl p-4 shadow-sm hover:shadow-md transition-shadow text-center border border-neutral-200">
+          <div class="aspect-square rounded-lg overflow-hidden mb-3">
+            <img src="/images/grilles/eye-ball.jpg" alt="ควบคุมอุณหภูมิ" class="w-full h-full object-cover" loading="lazy" />
+          </div>
+          <h4 class="font-medium text-neutral-900">ควบคุมอุณหภูมิ</h4>
+        </div>
+      </div>
+    </div>
+  </section>
+
+  <!-- FAQ Section -->
+  <section class="py-16 bg-neutral-50">
+    <div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8">
+      <div class="text-center mb-12">
+        <h2 class="text-3xl lg:text-4xl font-bold text-primary-700 mb-4">คำถามที่พบบ่อย</h2>
+        <p class="text-neutral-600 max-w-2xl mx-auto">ข้อมูลเพิ่มเติมเกี่ยวกับระบบปรับอากาศ</p>
+      </div>
+      <div class="space-y-4">
+        <details class="group bg-white rounded-xl shadow-sm">
+          <summary class="flex items-center justify-between p-5 cursor-pointer hover:bg-neutral-50">
+            <span class="font-medium text-neutral-900">ควรเลือกแอร์ขนาดเท่าไหร่?</span>
+            <span class="ml-4 flex-shrink-0 text-primary-600 group-open:rotate-180 transition-transform">
+              <svg class="w-5 h-5" 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>
+            </span>
+          </summary>
+          <div class="px-5 pb-5 text-neutral-600">ขึ้นอยู่กับขนาดห้อง โดยทั่วไปห้อง 15 ตร.ม. ใช้ 9,000 BTU ห้อง 20-25 ตร.ม. ใช้ 12,000-18,000 BTU</div>
+        </details>
+        <details class="group bg-white rounded-xl shadow-sm">
+          <summary class="flex items-center justify-between p-5 cursor-pointer hover:bg-neutral-50">
+            <span class="font-medium text-neutral-900">แอร์ Inverter ดีกว่าอย่างไร?</span>
+            <span class="ml-4 flex-shrink-0 text-primary-600 group-open:rotate-180 transition-transform">
+              <svg class="w-5 h-5" 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>
+            </span>
+          </summary>
+          <div class="px-5 pb-5 text-neutral-600">แอร์ Inverter ประหยัดไฟกว่า 30-50% เพราะปรับความเร็วคอมเพรสเซอร์ได้ และทำความเย็นเร็วกว่า</div>
+        </details>
+        <details class="group bg-white rounded-xl shadow-sm">
+          <summary class="flex items-center justify-between p-5 cursor-pointer hover:bg-neutral-50">
+            <span class="font-medium text-neutral-900">ควรล้างแอร์บ่อยแค่ไหน?</span>
+            <span class="ml-4 flex-shrink-0 text-primary-600 group-open:rotate-180 transition-transform">
+              <svg class="w-5 h-5" 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>
+            </span>
+          </summary>
+          <div class="px-5 pb-5 text-neutral-600">แนะนำล้างแอร์อย่างน้อยปีละ 2 ครั้ง เพื่อให้เครื่องทำงานได้อย่างมีประสิทธิภาพและยืดอายุการใช้งาน</div>
+        </details>
+        <details class="group bg-white rounded-xl shadow-sm">
+          <summary class="flex items-center justify-between p-5 cursor-pointer hover:bg-neutral-50">
+            <span class="font-medium text-neutral-900">รับประกันอะไรบ้าง?</span>
+            <span class="ml-4 flex-shrink-0 text-primary-600 group-open:rotate-180 transition-transform">
+              <svg class="w-5 h-5" 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>
+            </span>
+          </summary>
+          <div class="px-5 pb-5 text-neutral-600">ประกันเครื่อง 1-5 ปี ตามยี่ห้อ ประกันการติดตั้ง 30 วัน บริการหลังการขายตลอด 24 ชม.</div>
+        </details>
+      </div>
+    </div>
+  </section>
+
+  <!-- CTA Section -->
+  <section class="py-16 bg-gradient-to-br from-accent-500 to-accent-600 text-white">
+    <div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
+      <h2 class="text-3xl lg:text-4xl font-bold mb-4">ต้องการคำแนะนำเพิ่มเติม?</h2>
+      <p class="text-lg text-white/80 mb-8">ทีมงานผู้เชี่ยวชาญพร้อมให้บริการให้คำปรึกษาฟรี สำหรับการเลือกระบบปรับอากาศที่เหมาะสมกับพื้นที่ของคุณ</p>
+      <div class="flex flex-wrap justify-center gap-4">
+        <a href="/contact-us" class="bg-white text-primary-700 py-3 px-8 rounded-xl font-semibold hover:bg-primary-50">ติดต่อสอบถาม</a>
+        <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" class="bg-white/10 hover:bg-white/20 text-white py-3 px-8 rounded-xl font-semibold border border-white/30 flex items-center gap-2">
+          <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"><path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/></svg>
+          แชท LINE
+        </a>
+      </div>
+    </div>
+  </section>
+</BaseLayout>
--- a/src/pages/เครื่องเชื่อม-hdpe.astro
+++ b/src/pages/เครื่องเชื่อม-hdpe.astro
@@ -0,0 +1,249 @@
+---
+import BaseLayout from '@/layouts/BaseLayout.astro';
+---
+
+<script type="application/ld+json">
+{
+  "@context": "https://schema.org",
+  "@type": "Product",
+  "name": "เครื่องเชื่อม HDPE",
+  "description": "เครื่องเชื่อมท่อ HDPE คุณภาพสูง เหมาะสำหรับงานเชื่อมท่อ HDPE ระบบประปา ระบบน้ำ งานอุตสาหกรรม ราคาพิเศษ ส่งฟรี",
+  "image": "https://dealplustech.co.th/images/HDPE-welding-crop.jpg",
+  "offers": {
+    "@type": "Offer",
+    "url": "https://dealplustech.co.th/เครื่องเชื่อม-hdpe",
+    "priceCurrency": "THB",
+    "availability": "https://schema.org/InStock"
+  }
+}
+</script>
+
+<BaseLayout title="เครื่องเชื่อมท่อ HDPE (HDPE Pipe Welding Machine)" description="จำหน่ายเครื่องเชื่อมท่อ HDPE คุณภาพสูง ราคาโรงงาน เครื่องเชื่อมแบบ Butt Fusion และ Electrofusion">
+  <main class="bg-white min-h-screen">
+    <!-- Product Hero Section -->
+    <section class="bg-gradient-to-br from-primary-700 to-primary-600 text-white py-16">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="grid lg:grid-cols-2 gap-12 items-center">
+          <div class="order-2 lg:order-1">
+            <div class="rounded-2xl overflow-hidden bg-white/10">
+              <img src="/images/HDPE-welding-crop.jpg" alt="เครื่องเชื่อมท่อ HDPE" class="w-full" width="600" height="400" loading="eager" />
+            </div>
+          </div>
+          <div class="order-1 lg:order-2">
+            <span class="inline-block px-4 py-1.5 bg-white/20 text-white rounded-full text-sm font-medium mb-4">เครื่องเชื่อมท่อ</span>
+            <h1 class="text-3xl sm:text-4xl lg:text-5xl font-bold mb-4">เครื่องเชื่อมท่อ HDPE</h1>
+            <p class="text-lg sm:text-xl text-white/80 mb-8 leading-relaxed">
+              จำหน่ายเครื่องเชื่อมท่อ HDPE คุณภาพสูง ราคาโรงงาน สำหรับงานเชื่อมท่อ HDPE ทุกขนาด พร้อมบริการติดตั้งและฝึกอบรมการใช้งานฟรี
+            </p>
+            <div class="flex flex-wrap gap-4 mb-8">
+              <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" class="bg-white text-primary-700 hover:bg-primary-50 px-6 py-3 rounded-xl font-semibold flex items-center gap-2 transition-all">
+                <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"><path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/></svg>
+                แชท
+              </a>
+              <a href="tel:0905551415" class="bg-white/10 hover:bg-white/20 text-white px-6 py-3 rounded-xl font-semibold border border-white/30 flex items-center gap-2">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z"/></svg>
+                090-555-1415
+              </a>
+              <a href="#pricelist" data-price-button class="hidden bg-white text-primary-700 hover:bg-primary-50 px-6 py-3 rounded-xl font-semibold flex items-center gap-2">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/>
+                </svg>
+                ราคาสินค้า
+              </a>
+            </div>
+            <div class="flex flex-wrap gap-6">
+              <div class="flex items-center gap-2 text-white/80">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" /></svg>
+                <span>เครื่องเชื่อม HDPE คุณภาพสูง มาตรฐาน ISO</span>
+              </div>
+              <div class="flex items-center gap-2 text-white/80">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" /></svg>
+                <span>ราคาโรงงาน คุ้มค่าการลงทุน</span>
+              </div>
+              <div class="flex items-center gap-2 text-white/80">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" /></svg>
+                <span>บริการติดตั้งและฝึกอบรมฟรี</span>
+              </div>
+              <div class="flex items-center gap-2 text-white/80">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" /></svg>
+                <span>อะไหล่และบริการซ่อมบำรุง</span>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Product Details -->
+    <section class="py-16 bg-white">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl font-bold text-primary-700 mb-8">รายละเอียดสินค้า</h2>
+          <div class="prose prose-lg max-w-none">
+            <p class="text-lg text-neutral-700 leading-relaxed mb-4">
+              <strong>เครื่องเชื่อมท่อ HDPE</strong> เป็นอุปกรณ์สำคัญสำหรับงานติดตั้งระบบท่อ HDPE ใช้สำหรับเชื่อมต่อท่อ HDPE เข้าด้วยกันอย่างแน่นสนิท ไม่มีรอยรั่ว เหมาะสำหรับงานระบบประปา งานชลประทาน งานระบายน้ำ และงานอุตสาหกรรม
+            </p>
+
+            <h3 class="text-xl font-bold text-primary-700 mt-8 mb-4">ประเภทเครื่องเชื่อมท่อ HDPE</h3>
+            <ul class="list-disc pl-6 mb-4 space-y-2 text-neutral-700">
+              <li>เครื่องเชื่อมแบบ <strong>Butt Fusion</strong> (เชื่อมปายท่อ) - เชื่อมท่อด้วยความร้อนจากแผ่นเคลือบสารกาว ที่อุณหภูมิ 180-210°C</li>
+              <li>เครื่องเชื่อมแบบ <strong>Electrofusion</strong> (เชื่อมด้วยไฟฟ้า) - ใช้ข้อต่อที่มีสายไฟฝังอยู่ภายใน เมื่อผ่านกระแสไฟฟ้าจะเกิดความร้อนหลอมละลายผิวท่อ</li>
+              <li>เครื่องเชื่อมแบบ <strong>Socket Fusion</strong> (เชื่อมซ็อกเก็ต) - เหมาะสำหรับท่อขนาดเล็กถึงขนาดกลาง</li>
+            </ul>
+
+            <h3 class="text-xl font-bold text-primary-700 mt-8 mb-4">คุณสมบัติเด่นของเครื่องเชื่อม HDPE</h3>
+            <ul class="list-disc pl-6 mb-4 space-y-2 text-neutral-700">
+              <li>คุณภาพสูง มาตรฐาน <strong>ISO</strong></li>
+              <li>ราคาโรงงาน คุ้มค่าการลงทุน</li>
+              <li>บริการติดตั้งและฝึกอบรมฟรี</li>
+              <li>อะไหล่และบริการซ่อมบำรุง</li>
+              <li>รับประกันสินค้า 1 ปี</li>
+            </ul>
+
+            <h3 class="text-xl font-bold text-primary-700 mt-8 mb-4">ขนาดท่อที่รองรับ</h3>
+            <p class="text-lg text-neutral-700 leading-relaxed mb-4">
+              เครื่องเชื่อมท่อ HDPE สามารถรองรับท่อขนาดตั้งแต่ <strong>16 มม. ถึง 1,200 มม.</strong> ตอบสนองความต้องการใช้งานทุกขนาด
+            </p>
+
+            <h3 class="text-xl font-bold text-primary-700 mt-8 mb-4">การใช้งาน</h3>
+            <ul class="list-disc pl-6 mb-4 space-y-2 text-neutral-700">
+              <li>งานระบบประปา</li>
+              <li>งานชลประทาน</li>
+              <li>งานระบายน้ำทิ้ง</li>
+              <li>งานร้อยสายไฟ</li>
+              <li>งานส่งน้ำโรงงานอุตสาหกรรม</li>
+            </ul>
+
+            <div class="mt-8">
+              <img src="/images/products-misc/HDPE2.jpg" alt="เครื่องเชื่อมท่อ HDPE" class="w-full h-auto rounded-lg shadow-md" width="800" height="600" loading="lazy" />
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Welding Type Guide -->
+    <section id="welding-types" class="py-16 bg-neutral-50">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl font-bold text-primary-700 mb-8">ประเภทการเชื่อม HDPE</h2>
+          <div class="grid md:grid-cols-3 gap-6">
+            <div class="bg-blue-50 p-6 rounded-xl">
+              <h3 class="font-bold text-primary-800 mb-3">Butt Fusion</h3>
+              <p class="text-neutral-700 text-sm mb-3">เชื่อมปลายท่อเข้าด้วยกันโดยใช้ความร้อนจากแผ่นร้อน</p>
+              <ul class="text-sm text-neutral-600 space-y-1">
+                <li>• เหมาะกับท่อขนาดใหญ่</li>
+                <li>• ได้รอยต่อแข็งแรงมาก</li>
+                <li>• ใช้เวลานานกว่า</li>
+              </ul>
+            </div>
+            <div class="bg-green-50 p-6 rounded-xl">
+              <h3 class="font-bold text-primary-800 mb-3">Electrofusion</h3>
+              <p class="text-neutral-700 text-sm mb-3">ใช้ข้อต่อพิเศษที่มีขดลวดทำความร้อนข้างใน</p>
+              <ul class="text-sm text-neutral-600 space-y-1">
+                <li>• เหมาะกับท่อขนาดเล็ก-กลาง</li>
+                <li>• ติดตั้งง่ายกว่า</li>
+                <li>• ต้องใช้ข้อต่อ Electrofitting</li>
+              </ul>
+            </div>
+            <div class="bg-orange-50 p-6 rounded-xl">
+              <h3 class="font-bold text-primary-800 mb-3">Socket Fusion</h3>
+              <p class="text-neutral-700 text-sm mb-3">สวมท่อเข้ากับข้อต่อที่ร้อน</p>
+              <ul class="text-sm text-neutral-600 space-y-1">
+                <li>• เหมาะกับท่อขนาดเล็ก</li>
+                <li>• ใช้เครื่องมือน้อย</li>
+                <li>• ราคาประหยัด</li>
+              </ul>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Specifications -->
+    <section id="specs" class="py-16 bg-white">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl font-bold text-primary-700 mb-8">ข้อมูลจำเพาะเครื่องเชื่อม HDPE</h2>
+          <div class="grid md:grid-cols-2 gap-6">
+            <div class="bg-neutral-50 p-6 rounded-xl">
+              <h3 class="font-bold text-primary-800 mb-3">สิ่งที่ต้องมี</h3>
+              <ul class="space-y-2 text-neutral-700">
+                <li class="flex items-start gap-2"><span class="text-primary-600">✓</span> เครื่องเชื่อม (Butt Fusion หรือ Electrofusion)</li>
+                <li class="flex items-start gap-2"><span class="text-primary-600">✓</span> แผ่นร้อน (สำหรับ Butt Fusion)</li>
+                <li class="flex items-start gap-2"><span class="text-primary-600">✓</span> ข้อต่อ Electrofitting (สำหรับ Electrofusion)</li>
+                <li class="flex items-start gap-2"><span class="text-primary-600">✓</span> มีดตัดท่อ</li>
+                <li class="flex items-start gap-2"><span class="text-primary-600">✓</span> เครื่องปอนลม</li>
+              </ul>
+            </div>
+            <div class="bg-neutral-50 p-6 rounded-xl">
+              <h3 class="font-bold text-primary-800 mb-3">ข้อควรระวัง</h3>
+              <ul class="space-y-2 text-neutral-700">
+                <li class="flex items-start gap-2"><span class="text-amber-500">⚠️</span> อุณหภูมิเครื่องต้องถึง 210-230°C</li>
+                <li class="flex items-start gap-2"><span class="text-amber-500">⚠️</span> ทำความสะอาดปลายท่อก่อนเชื่อม</li>
+                <li class="flex items-start gap-2"><span class="text-amber-500">⚠️</span> ให้เวลาเย็นตัวตามกำหนด</li>
+                <li class="flex items-start gap-2"><span class="text-amber-500">⚠️</span> ตรวจสอบแรงดันก่อนใช้งาน</li>
+              </ul>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- FAQ -->
+    <section id="faq" class="py-16 bg-neutral-50">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl font-bold text-primary-700 mb-8">คำถามที่พบบ่อย</h2>
+          <div class="space-y-4">
+            <div class="bg-white rounded-xl p-6">
+              <h3 class="font-semibold text-primary-800 mb-2">Q: เชื่อม HDPE ใช้เครื่องอะไร?</h3>
+              <p class="text-neutral-700">ขึ้นอยู่กับขนาดท่อ ท่อขนาดใหญ่ใช้ Butt Fusion ท่อขนาดเล็ก-กลางใช้ Electrofusion หรือ Socket Fusion</p>
+            </div>
+            <div class="bg-white rounded-xl p-6">
+              <h3 class="font-semibold text-primary-800 mb-2">Q: ต้องมีใบรับรองไหม?</h3>
+              <p class="text-neutral-700">สำหรับงานระบบน้ำดื่มหรืองานขนาดใหญ่ ผู้เชื่อมควรมีใบรับรองการเชื่อม (Welder Certification) เพื่อรับประกันคุณภาพรอยต่อ</p>
+            </div>
+            <div class="bg-white rounded-xl p-6">
+              <h3 class="font-semibold text-primary-800 mb-2">Q: รอยต่อที่เชื่อมแน่นไหม?</h3>
+              <p class="text-neutral-700">ถ้าเชื่อมถูกวิธี รอยต่อจะแข็งแรงเทียบเท่าตัวท่อ ไม่มีรอยรั่ว และทนแรงดันได้ตามสเปค</p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- PDF Section -->
+    <section id="pricelist" class="py-16 bg-neutral-100">
+      <div class="max-w-3xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="bg-white rounded-2xl p-8 shadow-lg">
+          <h2 class="text-xl font-bold text-primary-700 mb-6 text-center">ดาวน์โหลดราคาสินค้า</h2>
+          <a href="/documents/Price List HDPE TAP.pdf" target="_blank" class="flex items-center gap-4 p-4 bg-neutral-50 rounded-xl hover:bg-neutral-100 transition-colors group">
+            <svg class="w-10 h-10 text-red-600 flex-shrink-0" fill="currentColor" viewBox="0 0 24 24"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6zm-1 9V3.5L18.5 9H13zM8 13h8v2H8v-2zm0 4h8v2H8v-2zm0-8h2v2H8V9z"/></svg>
+            <div>
+              <div class="font-semibold text-neutral-900 group-hover:text-primary-600 transition-colors">Price List HDPE</div>
+              <div class="text-sm text-neutral-500">PDF - ดาวน์โหลดราคา</div>
+            </div>
+          </a>
+        </div>
+      </div>
+    </section>
+
+    <!-- Contact CTA -->
+    <section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white">
+      <div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
+        <h2 class="text-3xl font-bold mb-6">สนใจสินค้าของเรา?</h2>
+        <p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้เพื่อรับคำแนะนำและราคาพิเศษ</p>
+        <div class="flex flex-wrap justify-center gap-4">
+          <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" class="bg-white text-primary-700 px-8 py-4 rounded-xl font-semibold flex items-center gap-2">
+            <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"><path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/></svg>
+            แชท
+          </a>
+          <a href="tel:0905551415" class="bg-white/10 hover:bg-white/20 text-white px-8 py-4 rounded-xl font-semibold border border-white/30">
+            โทร 090-555-1415
+          </a>
+        </div>
+      </div>
+    </section>
+  </main>
+</BaseLayout>
--- a/src/pages/เครื่องเชื่อม-ppr.astro
+++ b/src/pages/เครื่องเชื่อม-ppr.astro
@@ -0,0 +1,261 @@
+---
+import BaseLayout from '@/layouts/BaseLayout.astro';
+import Header from '@/components/common/Header.astro';
+import Footer from '@/components/common/Footer.astro';
+---
+
+<BaseLayout title="เครื่องเชื่อมท่อพีพีอาร์ | PPR Welding Machine - ดีล พลัส เทค" description="จำหน่ายเครื่องเชื่อมท่อพีพีอาร์คุณภาพสูง ราคาโรงงาน ส่งฟรี กทม. ปริมณฑล">
+  <Header slot="header" />
+
+  <main class="bg-white min-h-screen">
+    <!-- Product Hero Section -->
+    <section class="bg-gradient-to-br from-primary-700 to-primary-600 text-white py-16">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="grid lg:grid-cols-2 gap-12 items-start">
+          <div class="lg:sticky lg:top-24">
+            <div class="rounded-2xl overflow-hidden bg-white/10 p-2">
+              <img src="/images/products-misc/ppr-welding-machine-main.jpg" alt="เครื่องเชื่อมท่อพีพีอาร์" class="w-full h-auto rounded-xl" width="600" height="400" loading="eager" fetchpriority="high" decoding="sync" onerror="this.src='/images/logo/dealplustech-logo.png'" />
+            </div>
+          </div>
+
+          <div>
+            <span class="inline-block px-4 py-1.5 bg-white/20 text-white rounded-full text-sm font-medium mb-4">
+              เครื่องเชื่อมท่อ
+            </span>
+            <h1 class="text-3xl sm:text-4xl lg:text-5xl font-bold mb-4">เครื่องเชื่อมท่อพีพีอาร์ | PPR Welding Machine</h1>
+            <p class="text-lg sm:text-xl text-white/80 mb-8 leading-relaxed">
+              จำหน่ายเครื่องเชื่อมท่อพีพีอาร์คุณภาพสูง ราคาโรงงาน ส่งฟรี กรุงเทพมหานคร และปริมณฑล
+            </p>
+
+            <div class="flex flex-wrap gap-4 mb-8">
+              <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" class="bg-white text-primary-700 hover:bg-primary-50 py-3 px-6 rounded-xl font-semibold flex items-center gap-2">
+                <span>แชท</span>
+                <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"><path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/></svg>
+              </a>
+              <a href="tel:0905551415" class="bg-white/10 hover:bg-white/20 text-white py-3 px-6 rounded-xl font-semibold border border-white/30 flex items-center gap-2">
+                <span>090-555-1415</span>
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z"/>
+                </svg>
+              </a>
+            </div>
+
+            <div class="space-y-4">
+              <div class="flex items-start space-x-3">
+                <svg class="w-6 h-6 text-white mt-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span class="text-lg text-white/80">มาตรฐานเยอรมัน DVGW</span>
+              </div>
+              <div class="flex items-start space-x-3">
+                <svg class="w-6 h-6 text-white mt-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span class="text-lg text-white/80">คุณภาพสูง มาตรฐานอุตสาหกรรม</span>
+              </div>
+              <div class="flex items-start space-x-3">
+                <svg class="w-6 h-6 text-white mt-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span class="text-lg text-white/80">ราคาโรงงาน คุ้มค่า</span>
+              </div>
+              <div class="flex items-start space-x-3">
+                <svg class="w-6 h-6 text-white mt-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span class="text-lg text-white/80">จัดส่งรวดเร็ว ส่งฟรี กทม. ปริมณฑล</span>
+              </div>
+              <div class="flex items-start space-x-3">
+                <svg class="w-6 h-6 text-white mt-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                </svg>
+                <span class="text-lg text-white/80">รับประกันสินค้า</span>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Product Details -->
+    <section class="py-16">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-xl font-bold text-slate-900 mb-8">รายละเอียดสินค้า</h2>
+          <div class="prose prose-lg max-w-none mb-8">
+            <p class="text-lg text-slate-700 leading-relaxed mb-4"><strong>เครื่องเชื่อม PPR</strong> ในการติดตั้งท่อไทยพีพี-อาร์ หรือท่อ PPR สามารถเชื่อมต่อท่อเข้าหากันได้หลายวิธีขึ้นอยู่กับขนาด และประเภทการใช้งานโดยรวมมี 2 แบบคือ "การเชื่อมสอด" และ "การเชื่อมชน"</p>
+
+            <p class="text-lg text-slate-700 leading-relaxed mb-4"><strong>วิธีการเชื่อมท่อ PPR:</strong></p>
+            <ul class="list-disc pl-6 mb-4 space-y-2">
+              <li><strong>เครื่องเชื่อม PPR แบบการเชื่อมสอด (Socket Fusion)</strong> - ใช้ความร้อนที่ 250-260 องศาเซลเซียส ทำการหลอมละลายปลายท่อพีพีอาร์และข้อต่อท่อพีพีอาร์ ให้ประสานเป็นเนื้อเดียวกันไม่เกิดการรั่วซึม</li>
+              <li><strong>เครื่องเชื่อม PPR แบบการเชื่อมชน (Butt Fusion)</strong> - สำหรับท่อขนาดใหญ่ ด้วยการหลอมด้วยความร้อนแล้วเชื่อมชนให้เป็นเนื้อเดียวกัน ไม่มีวันรั่วซึม</li>
+              <li><strong>เครื่องเชื่อม PPR แบบ Electro Fusion (E.F.)</strong> - เทคโนโลยีที่ดีที่สุด สำหรับท่อขนาดใหญ่ D75-D315 สะดวกต่อการติดตั้งในที่แคบ</li>
+            </ul>
+
+            <p class="text-lg text-slate-700 leading-relaxed mb-4"><strong>ข้อดีของการติดตั้งด้วยเครื่องเชื่อม PPR:</strong></p>
+            <ul class="list-disc pl-6 mb-4 space-y-2">
+              <li>ไม่ต้องใช้กาวหรือน้ำยาประสาน</li>
+              <li>ระบบการติดตั้งสะอาดและปลอดภัย</li>
+              <li>ไม่เกิดประกายไฟ ควัน หรือกลิ่นจากสารเคมี</li>
+              <li>เชื่อมต่อแน่นสนิท ไม่มีการรั่วซึม</li>
+              <li>อายุการใช้งานยาวนาน</li>
+            </ul>
+
+            <p class="text-lg text-slate-700 leading-relaxed mb-4"><strong>มาตรฐาน:</strong> DVGW (เยอรมัน), มาตรฐานอุตสาหกรรม</p>
+            <p class="text-lg text-slate-700 leading-relaxed mb-4"><strong>การใช้งาน:</strong></p>
+            <ul class="list-disc pl-6 mb-4 space-y-2">
+              <li>งานระบบประปาในอาคาร</li>
+              <li>งานระบบน้ำร้อนและน้ำเย็น</li>
+              <li>งานโรงแรม โรงพยาบาล</li>
+              <li>งานโรงงานอุตสาหกรรม</li>
+            </ul>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Product Price Table -->
+    <section class="py-16 bg-gray-50">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-xl font-bold text-slate-900 mb-12 text-center">เครื่องเชื่อมพร้อมหัวเชื่อม Welding Machine</h2>
+
+          <div class="overflow-x-auto">
+            <table class="w-full border-collapse bg-white rounded-lg overflow-hidden" style="font-size: 14px;">
+              <thead class="bg-primary-600 text-white">
+                <tr>
+                  <th class="px-4 py-3 text-center">รายการ</th>
+                  <th class="px-4 py-3 text-center">Code</th>
+                  <th class="px-4 py-3 text-center">Size (mm)</th>
+                  <th class="px-4 py-3 text-center">Unit Price (Baht/PSC.)</th>
+                </tr>
+              </thead>
+              <tbody>
+                <tr style="background: white;"><td rowspan="5" class="px-4 py-3 text-center vertical-align: middle;">ใช้กับท่อขนาด 1/2"-1"<br/><img src="/images/products-misc/D20-32small.jpg" alt="D20-32 Small" style="object-fit: contain; margin: auto;" width="80" height="80" loading="lazy" decoding="async" /></td><td style="padding: 12px; text-align: center;">411W020-032S</td><td style="padding: 12px; text-align: center;">D20-32 (Small)</td><td style="padding: 12px; text-align: center;">5,957.00</td></tr>
+                <tr style="background: #f9fafb;"><td style="padding: 12px; text-align: center;">411W020-032L</td><td style="padding: 12px; text-align: center;">D20-32 (Large)</td><td style="padding: 12px; text-align: center;">8,676.00</td></tr>
+                <tr style="background: white;"><td style="padding: 12px; text-align: center;">411W020-063</td><td style="padding: 12px; text-align: center;">D20-63</td><td style="padding: 12px; text-align: center;">11,748.00</td></tr>
+                <tr style="background: #f9fafb;"><td style="padding: 12px; text-align: center;">411W075-110</td><td style="padding: 12px; text-align: center;">D75-110</td><td style="padding: 12px; text-align: center;">15,362.00</td></tr>
+                <tr style="background: white;"><td style="padding: 12px; text-align: center;">411W125-000</td><td style="padding: 12px; text-align: center;">D125</td><td style="padding: 12px; text-align: center;">33,000.00</td></tr>
+                <tr><td colspan="4" style="border-bottom: 2px solid #15803d; height: 8px;"></td></tr>
+
+                <tr style="background: white;"><td rowspan="3" class="px-4 py-3 text-center vertical-align: middle;">หัวเจาะอานม้า Aiguille<br/><img src="/images/products-misc/D25-32-40.jpg" alt="Aiguille" style="object-fit: contain; margin: auto;" width="80" height="80" loading="lazy" decoding="async" /></td><td style="padding: 12px; text-align: center;">401A025-000</td><td style="padding: 12px; text-align: center;">D25</td><td style="padding: 12px; text-align: center;">770.00</td></tr>
+                <tr style="background: #f9fafb;"><td style="padding: 12px; text-align: center;">401A032-000</td><td style="padding: 12px; text-align: center;">D32</td><td style="padding: 12px; text-align: center;">858.00</td></tr>
+                <tr style="background: white;"><td style="padding: 12px; text-align: center;">401A040-000</td><td style="padding: 12px; text-align: center;">D40</td><td style="padding: 12px; text-align: center;">1,180.00</td></tr>
+                <tr><td colspan="4" style="border-bottom: 2px solid #15803d; height: 8px;"></td></tr>
+
+                <tr style="background: white;"><td rowspan="18" class="px-4 py-3 text-center vertical-align: middle;">หัวเชื่อมอานม้า Welding Saddle Mould<br/><img src="/images/products-misc/D50-25.jpg" alt="Welding Saddle Mould" style="object-fit: contain; margin: auto;" width="80" height="80" loading="lazy" decoding="async" /></td><td style="padding: 12px; text-align: center;">411S050-025</td><td style="padding: 12px; text-align: center;">D50-25</td><td style="padding: 12px; text-align: center;">1,206.00</td></tr>
+                <tr style="background: #f9fafb;"><td style="padding: 12px; text-align: center;">411S063-025</td><td style="padding: 12px; text-align: center;">D63-25</td><td style="padding: 12px; text-align: center;">1,206.00</td></tr>
+                <tr style="background: white;"><td style="padding: 12px; text-align: center;">411S063-032</td><td style="padding: 12px; text-align: center;">D63-32</td><td style="padding: 12px; text-align: center;">1,815.00</td></tr>
+                <tr style="background: #f9fafb;"><td style="padding: 12px; text-align: center;">411S075-025</td><td style="padding: 12px; text-align: center;">D75-25</td><td style="padding: 12px; text-align: center;">1,307.00</td></tr>
+                <tr style="background: white;"><td style="padding: 12px; text-align: center;">411S075-032</td><td style="padding: 12px; text-align: center;">D75-32</td><td style="padding: 12px; text-align: center;">1,930.00</td></tr>
+                <tr style="background: #f9fafb;"><td style="padding: 12px; text-align: center;">411S090-025</td><td style="padding: 12px; text-align: center;">D90-25</td><td style="padding: 12px; text-align: center;">1,575.00</td></tr>
+                <tr style="background: white;"><td style="padding: 12px; text-align: center;">411S090-032</td><td style="padding: 12px; text-align: center;">D90-32</td><td style="padding: 12px; text-align: center;">1,815.00</td></tr>
+                <tr style="background: #f9fafb;"><td style="padding: 12px; text-align: center;">411S090-040</td><td style="padding: 12px; text-align: center;">D90-40</td><td style="padding: 12px; text-align: center;">2,480.00</td></tr>
+                <tr style="background: white;"><td style="padding: 12px; text-align: center;">411S110-025</td><td style="padding: 12px; text-align: center;">D110-25</td><td style="padding: 12px; text-align: center;">1,660.00</td></tr>
+                <tr style="background: #f9fafb;"><td style="padding: 12px; text-align: center;">411S110-032</td><td style="padding: 12px; text-align: center;">D110-32</td><td style="padding: 12px; text-align: center;">1,910.00</td></tr>
+                <tr style="background: white;"><td style="padding: 12px; text-align: center;">411S110-040</td><td style="padding: 12px; text-align: center;">D110-40</td><td style="padding: 12px; text-align: center;">2,480.00</td></tr>
+                <tr style="background: #f9fafb;"><td style="padding: 12px; text-align: center;">411S125-025</td><td style="padding: 12px; text-align: center;">D125-25</td><td style="padding: 12px; text-align: center;">1,970.00</td></tr>
+                <tr style="background: white;"><td style="padding: 12px; text-align: center;">411S125-032</td><td style="padding: 12px; text-align: center;">D125-32</td><td style="padding: 12px; text-align: center;">2,270.00</td></tr>
+                <tr style="background: #f9fafb;"><td style="padding: 12px; text-align: center;">411S125-040</td><td style="padding: 12px; text-align: center;">D125-40</td><td style="padding: 12px; text-align: center;">2,680.00</td></tr>
+                <tr style="background: white;"><td style="padding: 12px; text-align: center;">411S160-025</td><td style="padding: 12px; text-align: center;">D160-25</td><td style="padding: 12px; text-align: center;">1,940.00</td></tr>
+                <tr style="background: #f9fafb;"><td style="padding: 12px; text-align: center;">411S160-032</td><td style="padding: 12px; text-align: center;">D160-32</td><td style="padding: 12px; text-align: center;">2,230.00</td></tr>
+                <tr style="background: white;"><td style="padding: 12px; text-align: center;">411S160-040</td><td style="padding: 12px; text-align: center;">D160-40</td><td style="padding: 12px; text-align: center;">2,680.00</td></tr>
+                <tr><td colspan="4" style="border-bottom: 2px solid #15803d; height: 8px;"></td></tr>
+
+                <tr style="background: white;"><td rowspan="2" class="px-4 py-3 text-center vertical-align: middle;">หัวเชื่อมแท่งซ่อม Repairing Stick Mould<br/><img src="/images/products-misc/D7.jpg" alt="Repairing Stick Mould" style="object-fit: contain; margin: auto;" width="80" height="80" loading="lazy" decoding="async" /></td><td style="padding: 12px; text-align: center;">401R007-000</td><td style="padding: 12px; text-align: center;">D7</td><td style="padding: 12px; text-align: center;">679.00</td></tr>
+                <tr style="background: #f9fafb;"><td style="padding: 12px; text-align: center;">401R011-000</td><td style="padding: 12px; text-align: center;">D11</td><td style="padding: 12px; text-align: center;">679.00</td></tr>
+                <tr><td colspan="4" style="border-bottom: 2px solid #15803d; height: 8px;"></td></tr>
+
+                <tr style="background: white;"><td rowspan="10" class="px-4 py-3 text-center vertical-align: middle;">หัวเชื่อม Welding Mould<br/><img src="/images/products-misc/D20.jpg" alt="Welding Mould" style="object-fit: contain; margin: auto;" width="80" height="80" loading="lazy" decoding="async" /></td><td style="padding: 12px; text-align: center;">401W020-000</td><td style="padding: 12px; text-align: center;">D20</td><td style="padding: 12px; text-align: center;">504.00</td></tr>
+                <tr style="background: #f9fafb;"><td style="padding: 12px; text-align: center;">401W025-000</td><td style="padding: 12px; text-align: center;">D25</td><td style="padding: 12px; text-align: center;">603.00</td></tr>
+                <tr style="background: white;"><td style="padding: 12px; text-align: center;">401W032-000</td><td style="padding: 12px; text-align: center;">D32</td><td style="padding: 12px; text-align: center;">705.00</td></tr>
+                <tr style="background: #f9fafb;"><td style="padding: 12px; text-align: center;">401W040-000</td><td style="padding: 12px; text-align: center;">D40</td><td style="padding: 12px; text-align: center;">1,387.00</td></tr>
+                <tr style="background: white;"><td style="padding: 12px; text-align: center;">401W050-000</td><td style="padding: 12px; text-align: center;">D50</td><td style="padding: 12px; text-align: center;">1,708.00</td></tr>
+                <tr style="background: #f9fafb;"><td style="padding: 12px; text-align: center;">401W063-000</td><td style="padding: 12px; text-align: center;">D63</td><td style="padding: 12px; text-align: center;">2,311.00</td></tr>
+                <tr style="background: white;"><td style="padding: 12px; text-align: center;">401W075-000</td><td style="padding: 12px; text-align: center;">D75</td><td style="padding: 12px; text-align: center;">3,013.00</td></tr>
+                <tr style="background: #f9fafb;"><td style="padding: 12px; text-align: center;">401W090-000</td><td style="padding: 12px; text-align: center;">D90</td><td style="padding: 12px; text-align: center;">3,515.00</td></tr>
+                <tr style="background: white;"><td style="padding: 12px; text-align: center;">401W110-000</td><td style="padding: 12px; text-align: center;">D110</td><td style="padding: 12px; text-align: center;">4,078.00</td></tr>
+                <tr style="background: #f9fafb;"><td style="padding: 12px; text-align: center;">401W125-000</td><td style="padding: 12px; text-align: center;">D125</td><td style="padding: 12px; text-align: center;">7,050.00</td></tr>
+              </tbody>
+            </table>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Temperature Guide -->
+    <section id="temperature" class="py-16">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-xl font-bold text-slate-900 mb-8">อุณหภูมิการเชื่อม PPR</h2>
+          <div class="overflow-x-auto">
+            <table class="w-full border-collapse bg-gray-50 rounded-lg">
+              <thead>
+                <tr class="bg-primary-600 text-white">
+                  <th class="px-4 py-3 text-left">ขนาดท่อ (มม.)</th>
+                  <th class="px-4 py-3 text-center">อุณหภูมิ (°C)</th>
+                  <th class="px-4 py-3 text-center">เวลาเล็น (วินาที)</th>
+                  <th class="px-4 py-3 text-center">เวลาเชื่อม (วินาที)</th>
+                </tr>
+              </thead>
+              <tbody class="divide-y">
+                <tr><td class="px-4 py-2 font-medium">20-32</td><td class="px-4 py-2 text-center">260</td><td class="px-4 py-2 text-center">4-5</td><td class="px-4 py-2 text-center">4-6</td></tr>
+                <tr><td class="px-4 py-2 font-medium">40-50</td><td class="px-4 py-2 text-center">260-270</td><td class="px-4 py-2 text-center">5-7</td><td class="px-4 py-2 text-center">6-8</td></tr>
+                <tr><td class="px-4 py-2 font-medium">63-75</td><td class="px-4 py-2 text-center">270-280</td><td class="px-4 py-2 text-center">7-10</td><td class="px-4 py-2 text-center">8-12</td></tr>
+                <tr><td class="px-4 py-2 font-medium">90-110</td><td class="px-4 py-2 text-center">280-290</td><td class="px-4 py-2 text-center">10-13</td><td class="px-4 py-2 text-center">12-16</td></tr>
+              </tbody>
+            </table>
+          </div>
+          <p class="text-sm text-slate-600 mt-4">* ค่าเป็นเพียงเป็นแนะนำ ควรตรวจสอบตามคำแนะนำของผู้ผลิตเครื่อง</p>
+        </div>
+      </div>
+    </section>
+
+    <!-- FAQ Section -->
+    <section id="faq" class="py-16 bg-gray-50">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-xl font-bold text-slate-900 mb-8">คำถามที่พบบ่อย</h2>
+          <div class="space-y-4">
+            <div class="bg-white rounded-lg p-4">
+              <h3 class="font-semibold text-slate-900 mb-2">Q: PPR ต้องเชื่อมที่อุณหภูมิเท่าไหร่?</h3>
+              <p class="text-slate-700">อุณหภูมิมาตรฐานคือ 260°C สำหรับท่อขนาดเล็ก-กลาง สำหรับท่อขนาดใหญ่อาจต้องเพิ่มเป็น 270-290°C</p>
+            </div>
+            <div class="bg-white rounded-lg p-4">
+              <h3 class="font-semibold text-slate-900 mb-2">Q: เชื่อมแล้วรอยต่อแน่นไหม?</h3>
+              <p class="text-slate-700">ถ้าเชื่อมถูกวิธี รอยต่อจะเป็นชิ้นเดียวกับตัวท่อ ไม่มีรอยรั่ว แข็งแรงเทียบเท่าตัวท่อ</p>
+            </div>
+            <div class="bg-white rounded-lg p-4">
+              <h3 class="font-semibold text-slate-900 mb-2">Q: ใช้เวลานานแค่ไหนกว่าจะเชื่อมได้?</h3>
+              <p class="text-slate-700">ใช้เวลาฝึกฝนประมาณ 1-2 วันก็สามารถเชื่อมได้อย่างมีคุณภาพ สำคัญคือการฝึกฝนและใช้อุปกรณ์ที่ถูกต้อง</p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- CTA Section -->
+    <section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white text-center">
+      <div class="max-w-4xl mx-auto px-4">
+        <h2 class="text-2xl md:text-3xl font-bold mb-6">สนใจสินค้าของเรา?</h2>
+        <p class="text-lg text-white/80 mb-8 max-w-2xl mx-auto">
+          ติดต่อเราวันนี้เพื่อรับคำแนะนำและราคาพิเศษ
+        </p>
+        <div class="flex flex-wrap justify-center gap-4">
+          <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" class="bg-white text-primary-700 hover:bg-primary-50 py-3 px-8 rounded-xl font-semibold flex items-center gap-2">
+            <span>แชท</span>
+            <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"><path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/></svg>
+          </a>
+          <a href="tel:0905551415" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-8 rounded-xl font-semibold flex items-center gap-2">
+            <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z"/>
+            </svg>
+            <span>090-555-1415</span>
+          </a>
+        </div>
+      </div>
+    </section>
+  </main>
+
+  <Footer slot="footer" />
+</BaseLayout>
--- a/src/pages/เทอร์โมเบรค-thermobreak.astro
+++ b/src/pages/เทอร์โมเบรค-thermobreak.astro
@@ -0,0 +1,341 @@
+---
+import BaseLayout from '@/layouts/BaseLayout.astro';
+import Header from '@/components/common/Header.astro';
+import Footer from '@/components/common/Footer.astro';
+import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
+---
+
+<script type="application/ld+json">
+{
+  "@context": "https://schema.org",
+  "@type": "Product",
+  "name": "ฉนวนหุ้มท่อแอร์ ฉนวนหุ้มท่อน้ำ เทอร์โมเบรค (Thermobreak)",
+  "description": "จำหน่ายฉนวนหุ้มท่อแอร์ ฉนวนหุ้มท่อน้ำ เทอร์โมเบรค (Thermobreak)คุณภาพสูง ราคาโรงงาน ส่งฟรี กทม. ปริมณฑล",
+  "image": "https://dealplustech.co.th/images/thermobreak/thermobreak-solarblock.png",
+  "offers": {
+    "@type": "Offer",
+    "url": "https://dealplustech.co.th/เทอร์โมเบรค-thermobreak",
+    "priceCurrency": "THB",
+    "availability": "https://schema.org/InStock"
+  }
+}
+</script>
+
+<BaseLayout title="ฉนวนหุ้มท่อแอร์ ฉนวนหุ้มท่อน้ำ เทอร์โมเบรค (Thermobreak)" description="จำหน่ายฉนวนหุ้มท่อแอร์ ฉนวนหุ้มท่อน้ำ เทอร์โมเบรค (Thermobreak)คุณภาพสูง ราคาโรงงาน ส่งฟรี กทม. ปริมณฑล">
+  <Header slot="header" />
+
+  <main class="bg-white min-h-screen pb-24 md:pb-0">
+    <!-- Hero Section -->
+    <section class="bg-gradient-to-br from-primary-700 to-primary-600 text-white py-12">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <nav class="text-sm mb-4 text-primary-100">
+          <a href="/" class="hover:text-white">หน้าแรก</a> / <a href="/all-products" class="hover:text-white">สินค้าทั้งหมด</a> / <span class="text-white">เทอร์โมเบรค Thermobreak</span>
+        </nav>
+        <div class="grid lg:grid-cols-2 gap-8 items-center">
+          <div class="img-hover rounded-2xl overflow-hidden bg-white/10">
+            <img src="/images/thermobreak/thermobreak-solarblock.png" alt="เทอร์โมเบรค Thermobreak" class="w-full" loading="eager" />
+          </div>
+          <div>
+            <span class="text-sm text-primary-200 font-medium">ฉนวนและรั้ว</span>
+            <h1 class="text-3xl lg:text-4xl font-bold mt-2 mb-4">เทอร์โมเบรค Thermobreak</h1>
+            <p class="text-primary-100 text-lg mb-6">ฉนวนเทอร์โมเบรค คุณภาพสูงจากออสเตรเลีย ป้องกันความร้อนได้ดีเยี่ยม มาตรฐาน FM และ UL</p>
+            <div class="flex flex-wrap gap-4 mb-8">
+              <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" class="bg-white/10 hover:bg-white/20 text-white py-3 px-6 rounded-xl font-semibold border border-white/30 flex items-center gap-2">
+                <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"><path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/></svg>
+                แชท
+              </a>
+              <a href="tel:0905551415" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-6 rounded-xl font-semibold flex items-center gap-2">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z"/>
+                </svg>
+                090-555-1415
+              </a>
+              <a href="#pricelist" data-price-button class="hidden bg-white text-primary-700 hover:bg-primary-50 py-3 px-6 rounded-xl font-semibold flex items-center gap-2">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/>
+                </svg>
+                ราคาสินค้า
+              </a>
+            </div>
+            <div class="flex flex-wrap gap-4 text-primary-100 text-sm">
+              <div class="flex items-center gap-1">
+                <svg class="w-5 h-5 text-accent-500" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" /></svg>
+                <span>ค่าการนำความร้อนต่ำ 0.032 W/m•K</span>
+              </div>
+              <div class="flex items-center gap-1">
+                <svg class="w-5 h-5 text-accent-500" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" /></svg>
+                <span>มาตรฐาน FM และ UL</span>
+              </div>
+              <div class="flex items-center gap-1">
+                <svg class="w-5 h-5 text-accent-500" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" /></svg>
+                <span>รับประกัน 10 ปี</span>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Product Details Section -->
+    <section class="py-16 px-4">
+      <div class="max-w-7xl mx-auto">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl font-bold text-neutral-900 mb-8">รายละเอียดสินค้า</h2>
+
+          <div class="mb-8">
+            <img src="/images/thermobreak/thermobreak-banner.png" alt="Thermobreak Banner" class="w-full h-auto rounded-xl shadow-md" loading="lazy" />
+          </div>
+
+          <p class="text-lg text-neutral-700 leading-relaxed mb-6">
+            <strong>ตัวแทนจำหน่ายท่อฉนวนกันความร้อน ฉนวนหุ้มท่อแอร์ ฉนวนหุ้มท่อน้ำ เทอร์โมเบรค (Thermobreak)</strong> ทุกรุ่น สามารถให้คำปรึกษาเกี่ยวกับฉนวนกันความร้อนและราคาเริ่มต้นหรืองบประมาณที่ต้องการ รวมถึงบริการส่งฟรี
+          </p>
+
+          <p class="text-lg text-neutral-700 leading-relaxed mb-6">
+            ฉนวนหุ้มท่อแอร์ ฉนวนหุ้มท่อน้ำ ฉนวนกันความร้อน เทอร์โมเบรค (Thermobreak) ถูกคิดค้นมาจากประเทศออสเตรเลีย มากกว่า 30 ปี และมีการรับประกันจากลูกค้าทั่วโลกแล้ว
+          </p>
+
+          <h3 class="text-xl font-bold text-neutral-900 mt-8 mb-4">ทำไมต้องเลือกใช้ เทอร์โมเบรค (Thermobreak)</h3>
+          <p class="text-lg text-neutral-700 leading-relaxed mb-6">
+            ฉนวนหุ้มท่อแอร์ ฉนวนหุ้มท่อน้ำ ฉนวนกันความร้อน เทอร์โมเบรค (Thermobreak) เป็นผู้นำนวัตกรรมผลิตฉนวน polygon foam คุณภาพสูงที่เป็นที่ยอมรับทั่วโลก ดังนี้
+          </p>
+          <ul class="list-disc pl-6 space-y-2 text-lg text-neutral-700 mb-6">
+            <li>ฉนวนนำความร้อนและไฟฟ้าต่ำและมีอัตรากันน้ำซึมหรือความชื้นต่ำ</li>
+            <li>มีการทดสอบจากสถาบันที่เกี่ยวข้อง เพื่อความมั่นใจในคุณภาพฉนวน</li>
+            <li>ใช้งานได้อย่างมีประสิทธิภาพ</li>
+            <li>ผลิตจากวัตถุดิบคุณภาพสูง</li>
+            <li>ถูกต้องตามหลักการกันไฟและความร้อนตามหลักสากล</li>
+            <li>ลูกค้าเชื่อถือและเลือกใช้มามากกว่า 30 ปี</li>
+            <li>ติดตั้ง ดัด ตัดง่าย สะดวก และรวดเร็ว</li>
+          </ul>
+
+          <p class="text-lg text-neutral-700 leading-relaxed mt-6">
+            ผลิตภัณฑ์ฉนวนกันความร้อน ฉนวนหุ้มท่อแอร์ ฉนวนหุ้มท่อน้ำ เทอร์โมเบรค (Thermobreak) เป็นผลิตภัณฑ์สำหรับงานฉนวนระบบปรับอากาศและฉนวนงานหุ้มท่อแอร์ จึงต้องมีการผ่านการรับรองมาตรฐานเกี่ยวกับการติดไฟของวัสดุ ซึ่งเทอร์โมเบรค (Thermobreak) ได้รับการรับรองผ่านมาตรฐานมากมายทั้ง Factory Mutual (FM) และ UL
+          </p>
+
+          <h3 class="text-xl font-bold text-neutral-900 mt-8 mb-4">มาตรฐานการรับรองไฟและควัน</h3>
+          <ul class="list-disc pl-6 space-y-2 text-lg text-neutral-700 mb-6">
+            <li>BRITISH (BS476 Part 6&7 Class 0)</li>
+            <li>ASTM E84, UL723 (25/50)</li>
+            <li>EUROPEAN STANDARD EN 13501-1 (EUROCLASS)</li>
+            <li>AUSTRALIAN (AS 1530.3)</li>
+            <li>ISO STANDARD (ISO 5659-2)</li>
+          </ul>
+
+          <h3 class="text-xl font-bold text-neutral-900 mt-8 mb-4">เทคโนโลยีเพื่อผลิตภัณฑ์ที่เหนือกว่า</h3>
+          <p class="text-lg text-neutral-700 leading-relaxed mb-6">
+            <strong>Physically cross linked</strong> ทำให้เราได้ผลิตภัณฑ์ที่มีขนาดเซลล์เล็กลงและการกระจายของเซลล์เป็นไปอย่างสม่ำเสมอทำให้ได้ค่าการนำความร้อนที่ต่ำ (0.032 W/m.K) มีความเสถียร และมีการแทรกซึมไอน้ำที่น้อย เป็นจุดประสงค์หลักของฉนวนกันความร้อนด้วยค่าการนำความร้อนที่ต่ำเพียง 0.032 W/m.K
+          </p>
+
+          <h3 class="text-xl font-bold text-neutral-900 mt-8 mb-4">ค่าการซึมผ่านของไอน้ำที่เกือบจะเป็น 0</h3>
+          <p class="text-lg text-neutral-700 leading-relaxed mb-4">
+            เราสามารถยืนยันได้ว่าผลิตภัณฑ์ เทอร์โมเบรค (Thermobreak) จะมีค่าการนำความร้อนที่คงที่เป็นระยะเวลามากกว่า 10 ปี ซึ่งจะทำให้ลดค่าใช้จ่ายในการซ่อมบำรุงของระบบฉนวน
+          </p>
+          <ul class="list-disc pl-6 space-y-2 text-lg text-neutral-700 mb-6">
+            <li>Vapour Permeability = 2.3 x 10⁻¹⁵ kg/Pa.s.m</li>
+            <li>Permeability Resistance Factor : μ > 80,000</li>
+          </ul>
+
+          <h3 class="text-xl font-bold text-neutral-900 mt-8 mb-4">ความยั่งยืนและประโยชน์กับสิ่งแวดล้อม</h3>
+          <p class="text-lg text-neutral-700 leading-relaxed">
+            ความยั่งยืนของอาคาร (Building Sustainability), คุณภาพอากาศภายในอาคาร (Indoor Air Quality) และสุขภาพและความปลอดภัยของผู้ใช้อาคาร (Health & Safety) เป็นปัจจัยหลักในคอนเซปของอาคารเขียว (Green Building)
+          </p>
+          <p class="text-lg text-neutral-700 leading-relaxed mt-4">
+            ผลิตภัณฑ์ เทอร์โมเบรค (Thermobreak) ได้มีการริเริ่มทำในด้านของผลิตภัณฑ์อาคารเขียว ในอาคารที่ต้องการทำอาคารเขียวและมีการใช้ฉนวนกันความร้อน เทอร์โมเบรค (Thermobreak) จะได้รับคะแนนเครดิตเพิ่มขึ้น เช่น LEED และ Estidama
+          </p>
+          <ul class="list-disc pl-6 space-y-2 text-lg text-neutral-700 mt-4">
+            <li>Green Star Compliant (VOC)</li>
+            <li>No CFCs of HCFCs</li>
+            <li>Zero Ozone Depletion Potential (Zero ODP)</li>
+            <li>Low GWP</li>
+            <li>Fibre Free</li>
+            <li>Zero PVC, Zero Formaldehyde</li>
+            <li>Compliance to RoHS Directive</li>
+            <li>Compliance to REACH Directive</li>
+            <li>Resistance to Mould Growth</li>
+            <li>DUBAI GBR Approved</li>
+          </ul>
+        </div>
+      </div>
+    </section>
+
+    <!-- Product Line Section -->
+    <section class="py-16 px-4 bg-neutral-50">
+      <div class="max-w-7xl mx-auto">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl font-bold text-neutral-900 mb-8 text-center">ผลิตภัณฑ์เทอร์โมเบรคทั้งหมด</h2>
+          <p class="text-lg text-neutral-700 mb-8 text-center">เราจำหน่ายผลิตภัณฑ์เทอร์โมเบรคครบทุกประเภทสำหรับทุกการใช้งาน ตั้งแต่งานระบบปรับอากาศ งานอุตสาหกรรม จนถึงงานขนส่ง</p>
+
+          <!-- Thermal Insulation Products -->
+          <h3 class="text-lg font-bold text-neutral-900 mb-4">ฉนวนกันความร้อน (Thermal Insulation)</h3>
+          <div class="grid md:grid-cols-2 lg:grid-cols-3 gap-6 mb-8">
+            <div class="bg-white p-5 rounded-xl shadow-sm">
+              <h4 class="font-bold text-neutral-900 mb-2">Thermobreak LS</h4>
+              <p class="text-neutral-700 text-sm mb-3">ฉนวนแบบม้วนและแผ่น สำหรับงานทั่วไป เหมาะกับถังน้ำ ท่อขนาดใหญ่ และอุปกรณ์</p>
+              <ul class="text-sm text-neutral-600 space-y-1">
+                <li>• ความหนา: 5-50 มม.</li>
+                <li>• ขนาดม้วน: ตามสั่ง</li>
+                <li>• การนำความร้อน: 0.032 W/m.K</li>
+              </ul>
+            </div>
+            <div class="bg-white p-5 rounded-xl shadow-sm">
+              <h4 class="font-bold text-neutral-900 mb-2">Thermobreak LS Tube</h4>
+              <p class="text-neutral-700 text-sm mb-3">ฉนวนหุ้มท่อแบบสำเร็จรูป สำหรับท่อระบบปรับอากาศและท่อน้ำ</p>
+              <ul class="text-sm text-neutral-600 space-y-1">
+                <li>• ความยาว: 2 เมตร/เส้น</li>
+                <li>• ขนาด: 6.35-273.10 มม.</li>
+                <li>• ความหนา: 15-50 มม.</li>
+              </ul>
+            </div>
+            <div class="bg-white p-5 rounded-xl shadow-sm">
+              <h4 class="font-bold text-neutral-900 mb-2">Thermobreak LS-F Tube <span class="text-red-600 text-xs">Fire-Rated</span></h4>
+              <p class="text-neutral-700 text-sm mb-3">ฉนวนหุ้มท่อแบบทนไฟ สำหรับพื้นที่ที่ต้องการความปลอดภัยทางไฟ</p>
+              <ul class="text-sm text-neutral-600 space-y-1">
+                <li>• มาตรฐานกันไฟ: FM Approved</li>
+                <li>• ขนาด: ตามสั่ง</li>
+                <li>• ความยาว: 2 เมตร/เส้น</li>
+              </ul>
+            </div>
+            <div class="bg-white p-5 rounded-xl shadow-sm">
+              <h4 class="font-bold text-neutral-900 mb-2">Thermobreak No Clad</h4>
+              <p class="text-neutral-700 text-sm mb-3">ฉนวนสำหรับติดตั้งภายนอก ไม่ต้องใช้แผ่นเคลือบเพิ่ม</p>
+              <ul class="text-sm text-neutral-600 space-y-1">
+                <li>• ทนทานต่อ UV และสภาพอากาศ</li>
+                <li>• ติดตั้งง่าย</li>
+                <li>• เหมาะกับงานภายนอก</li>
+              </ul>
+            </div>
+            <div class="bg-white p-5 rounded-xl shadow-sm">
+              <h4 class="font-bold text-neutral-900 mb-2">Thermobreak Solar</h4>
+              <p class="text-neutral-700 text-sm mb-3">ฉนวนสำหรับระบบพลังงานแสงอาทิตย์ ทนความร้อนสูงถึง 160°C</p>
+              <ul class="text-sm text-neutral-600 space-y-1">
+                <li>• ทนความร้อน: สูงสุด 160°C</li>
+                <li>• ประสิทธิภาพสูง</li>
+                <li>• อายุการใช้งานยาวนาน</li>
+              </ul>
+            </div>
+            <div class="bg-white p-5 rounded-xl shadow-sm">
+              <h4 class="font-bold text-neutral-900 mb-2">Thermobreak Solarblock</h4>
+              <p class="text-neutral-700 text-sm mb-3">ฉนวนแผ่นสำหรับแผงโซลาร์เซลล์</p>
+              <ul class="text-sm text-neutral-600 space-y-1">
+                <li>• รูปแบบ: แผ่น</li>
+                <li>• ทนความร้อนสูง</li>
+                <li>• ติดตั้งใต้แผงโซลาร์</li>
+              </ul>
+            </div>
+          </div>
+
+          <!-- Acoustic Products -->
+          <h3 class="text-lg font-bold text-neutral-900 mb-4">ฉนวนป้องกันเสียง (Acoustic Insulation)</h3>
+          <div class="grid md:grid-cols-2 lg:grid-cols-3 gap-6 mb-8">
+            <div class="bg-blue-50 p-5 rounded-xl">
+              <h4 class="font-bold text-neutral-900 mb-2">Thermobreak AcoustiPlus</h4>
+              <p class="text-neutral-700 text-sm mb-3">ฉนวนดูดซับเสียง สำหรับลดเสียงรบกวนในอาคาร</p>
+              <ul class="text-sm text-neutral-600 space-y-1">
+                <li>• ดูดซับเสียงได้ดี</li>
+                <li>• เหมาะกับห้องประชุม โรงแรม รง.</li>
+                <li>• ติดตั้งง่าย</li>
+              </ul>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Thickness Guide Section -->
+    <section class="py-16 px-4">
+      <div class="max-w-7xl mx-auto">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl font-bold text-neutral-900 mb-8 text-center">คำแนะนำการเลือกความหนาฉนวน</h2>
+          <div class="overflow-x-auto">
+            <table class="w-full border-collapse bg-white rounded-xl shadow-sm">
+              <thead>
+                <tr class="bg-primary-600 text-white">
+                  <th class="px-4 py-3 text-left rounded-tl-xl">ขนาดท่อ (นิ้ว)</th>
+                  <th class="px-4 py-3 text-center">ท่อน้ำเย็น (มม.)</th>
+                  <th class="px-4 py-3 text-center">ท่อลมเย็น (มม.)</th>
+                  <th class="px-4 py-3 text-center rounded-tr-xl">ท่อน้ำร้อน (มม.)</th>
+                </tr>
+              </thead>
+              <tbody class="divide-y divide-neutral-200">
+                <tr><td class="px-4 py-3">1/2"</td><td class="px-4 py-3 text-center">15-20</td><td class="px-4 py-3 text-center">20-25</td><td class="px-4 py-3 text-center">20-25</td></tr>
+                <tr class="bg-neutral-50"><td class="px-4 py-3">3/4"</td><td class="px-4 py-3 text-center">15-20</td><td class="px-4 py-3 text-center">20-25</td><td class="px-4 py-3 text-center">25-30</td></tr>
+                <tr><td class="px-4 py-3">1"</td><td class="px-4 py-3 text-center">20-25</td><td class="px-4 py-3 text-center">25-30</td><td class="px-4 py-3 text-center">25-30</td></tr>
+                <tr class="bg-neutral-50"><td class="px-4 py-3">1-1/2"</td><td class="px-4 py-3 text-center">20-25</td><td class="px-4 py-3 text-center">25-30</td><td class="px-4 py-3 text-center">30-40</td></tr>
+                <tr><td class="px-4 py-3">2"</td><td class="px-4 py-3 text-center">25-30</td><td class="px-4 py-3 text-center">30-40</td><td class="px-4 py-3 text-center">30-40</td></tr>
+                <tr class="bg-neutral-50"><td class="px-4 py-3">3"</td><td class="px-4 py-3 text-center">25-30</td><td class="px-4 py-3 text-center">30-40</td><td class="px-4 py-3 text-center">40-50</td></tr>
+                <tr><td class="px-4 py-3">4"</td><td class="px-4 py-3 text-center">30-40</td><td class="px-4 py-3 text-center">40-50</td><td class="px-4 py-3 text-center">40-50</td></tr>
+                <tr class="bg-neutral-50"><td class="px-4 py-3">6"</td><td class="px-4 py-3 text-center">30-40</td><td class="px-4 py-3 text-center">40-50</td><td class="px-4 py-3 text-center">50-60</td></tr>
+              </tbody>
+            </table>
+          </div>
+          <p class="text-sm text-neutral-600 mt-4 text-center">* ความหนาที่แนะนำขึ้นอยู่กับอุณหภูมิทำงานและสภาพแวดล้อม ติดต่อเราเพื่อขอคำแนะนำที่เหมาะสม</p>
+        </div>
+      </div>
+    </section>
+
+    <!-- FAQ Section -->
+    <section class="py-16 px-4 bg-neutral-50">
+      <div class="max-w-7xl mx-auto">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-2xl font-bold text-neutral-900 mb-8 text-center">คำถามที่พบบ่อย</h2>
+          <div class="space-y-4">
+            <div class="bg-white rounded-xl p-4 shadow-sm">
+              <h3 class="font-semibold text-neutral-900 mb-2">Q: เทอร์โมเบรคต่างจากฉนวนยี่ห้ออื่นอย่างไร?</h3>
+              <p class="text-neutral-700">เทอร์โมเบรคใช้เทคโนโลยี Physically Cross-Linked ซึ่งให้ขนาดเซลล์เล็กและกระจายสม่ำเสมอ ทำให้ได้ค่าการนำความร้อนต่ำกว่า (0.032 W/m.K) และมีอายุการใช้งานยาวนานกว่า 10 ปีโดยไม่เสื่อมประสิทธิภาพ</p>
+            </div>
+            <div class="bg-white rounded-xl p-4 shadow-sm">
+              <h3 class="font-semibold text-neutral-900 mb-2">Q: เลือกความหนาฉนวนอย่างไร?</h3>
+              <p class="text-neutral-700">การเลือกความหนาขึ้นอยู่กับ: 1) ขนาดท่อ 2) อุณหภูมิของไหลในท่อ 3) อุณหภูมิแวดล้อม 4) ความชื้น โดยทั่วไปท่อน้ำเย็นควรใช้ 15-25 มม. ท่อลมเย็น 20-40 มม. และท่อน้ำร้อน 25-50 มม.</p>
+            </div>
+            <div class="bg-white rounded-xl p-4 shadow-sm">
+              <h3 class="font-semibold text-neutral-900 mb-2">Q: ใช้ภายนอกอาคารได้ไหม?</h3>
+              <p class="text-neutral-700">ได้ สำหรับการใช้ภายนอกแนะนำใช้ Thermobreak No Clad ที่ออกแบบมาให้ทนทานต่อ UV และสภาพอากาศโดยไม่ต้องติดตั้งแผ่นเคลือบเพิ่มเติม</p>
+            </div>
+            <div class="bg-white rounded-xl p-4 shadow-sm">
+              <h3 class="font-semibold text-neutral-900 mb-2">Q: รับประกันอายุการใช้งานเท่าไหร่?</h3>
+              <p class="text-neutral-700">เทอร์โมเบรคมีการรับประกันประสิทธิภาพการนำความร้อนคงที่มากกว่า 10 ปี ซึ่งหมายความว่าค่า 0.032 W/m.K จะไม่เปลี่ยนแปลงตลอดอายุการใช้งาน</p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Price Download Section -->
+    <section id="pricelist" class="py-16 px-4 bg-gradient-to-br from-primary-700 to-primary-600">
+      <div class="max-w-4xl mx-auto text-center">
+        <h2 class="text-2xl font-bold text-white mb-6">ดาวน์โหลดราคาสินค้า</h2>
+        <a href="/documents/2026-New Update Thermobreak Price List.pdf" target="_blank" class="inline-flex items-center gap-4 p-6 bg-white rounded-xl hover:bg-neutral-100 transition-colors group">
+          <svg class="w-12 h-12 text-red-600 flex-shrink-0" fill="currentColor" viewBox="0 0 24 24"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6zm-1 9V3.5L18.5 9H13zM8 13h8v2H8v-2zm0 4h8v2H8v-2zm0-8h2v2H8V9z"/></svg>
+          <div class="text-left">
+            <div class="font-semibold text-neutral-900 group-hover:text-primary-600 transition-colors">Thermobreak Price List 2026</div>
+            <div class="text-sm text-neutral-500">PDF - ดาวน์โหลดราคา</div>
+          </div>
+        </a>
+      </div>
+    </section>
+
+    <!-- Contact CTA Section -->
+    <section class="py-16 px-4 bg-gradient-to-br from-primary-700 to-primary-600 text-white text-center">
+      <div class="max-w-4xl mx-auto">
+        <h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2>
+        <p class="text-lg text-primary-100 mb-8">ติดต่อ 090-555-1415 หรือแอดไลน์ @JPPSELECTION</p>
+        <div class="flex flex-wrap justify-center gap-4">
+          <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" class="bg-white text-primary-700 py-3 px-8 rounded-xl font-semibold hover:bg-primary-50 flex items-center gap-2">
+            <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"><path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/></svg>
+            แชท
+          </a>
+          <a href="tel:0905551415" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-8 rounded-xl font-semibold flex items-center gap-2">
+            <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z"/>
+            </svg>
+            090-555-1415
+          </a>
+        </div>
+      </div>
+    </section>
+  </main>
+
+  <Footer slot="footer" />
+
+  <StickyBottomCTA phone="0905551415" lineUrl="https://line.me/ti/p/~JPPSELECTION" slot="after-footer" />
+</BaseLayout>
--- a/src/pages/เม็กกรู๊ฟ-คับปลิ้ง.astro
+++ b/src/pages/เม็กกรู๊ฟ-คับปลิ้ง.astro
@@ -0,0 +1,368 @@
+---
+import BaseLayout from '@/layouts/BaseLayout.astro';
+import Header from '@/components/common/Header.astro';
+import Footer from '@/components/common/Footer.astro';
+import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
+---
+
+<BaseLayout title="ข้อต่อกรู๊ฟคับปลิ้ง | MECH Grooved Coupling - ดีล พลัส เทค" description="ข้อต่อกรู๊ฟคับปลิ้ง (Grooved Coupling) ทดแทนการเชื่อม ติดตั้งง่าย ไร้ประกายไฟ ผลิตจาก Ductile Iron มาตรฐาน UL/FM/Vds/DVGW/LPCB ราคาโรงงาน ส่งฟรี กทม. ปริมณฑล">
+  <Header slot="header" />
+
+  <main class="bg-white min-h-screen pb-24 md:pb-0">
+    <!-- Mobile: Full-width Hero Image -->
+    <section class="md:hidden">
+      <div class="w-full aspect-square bg-gray-100">
+        <img src="/images/products-misc/MECH_001.jpg" alt="ข้อต่อกรู๊ฟคับปลิ้ง | MECH Grooved Coupling" class="w-full h-full object-cover" width="600" height="600" loading="eager" fetchpriority="high" onerror="this.src='/images/logo/dealplustech-logo.png'" />
+      </div>
+    </section>
+
+    <!-- Product Info Section -->
+    <section class="px-4 py-6 md:px-0 md:py-0">
+      <!-- Mobile: Stacked Content -->
+      <div class="md:hidden">
+        <h1 class="text-2xl font-bold text-slate-900 mb-2">ข้อต่อกรู๊ฟคับปลิ้ง | MECH Grooved Coupling</h1>
+        <p class="text-base text-slate-600 mb-6 leading-relaxed">ทดแทนการเชื่อม ติดตั้งง่าย ไร้ประกายไฟ ผลิตจาก Ductile Iron (เหล็กหล่อเหนียว) แข็งแรง ทนทาน มาตรฐาน UL/FM/Vds/DVGW/LPCB ราคาโรงงาน ส่งฟรี กรุงเทพมหานคร และปริมณฑล</p>
+        <div class="space-y-2 mb-6">
+          <div class="flex items-center gap-2 text-slate-700">
+            <svg class="w-5 h-5 text-emerald-600 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+            </svg>
+            <span>ติดตั้งเร็วกว่า <strong>5 เท่า</strong> เมื่อเทียบกับการเชื่อม</span>
+          </div>
+          <div class="flex items-center gap-2 text-slate-700">
+            <svg class="w-5 h-5 text-emerald-600 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+            </svg>
+            <span>ประหยัดค่าใช้จ่าย <strong>25-40%</strong></span>
+          </div>
+          <div class="flex items-center gap-2 text-slate-700">
+            <svg class="w-5 h-5 text-emerald-600 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+            </svg>
+            <span>มาตรฐาน <strong>UL/FM/Vds/DVGW/LPCB</strong></span>
+          </div>
+        </div>
+      </div>
+
+      <!-- Desktop: Side-by-side (Hero Section) -->
+      <div class="hidden md:block bg-gradient-to-br from-primary-700 to-primary-600">
+        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-16">
+          <div class="grid lg:grid-cols-2 gap-12 items-start">
+            <div class="lg:sticky lg:top-24">
+              <div class="rounded-2xl overflow-hidden bg-white/10 p-2">
+                <img src="/images/products-misc/MECH_001.jpg" alt="ข้อต่อกรู๊ฟคับปลิ้ง | MECH Grooved Coupling" class="w-full h-auto rounded-xl" width="600" height="400" loading="eager" fetchpriority="high" decoding="sync" onerror="this.src='/images/logo/dealplustech-logo.png'" />
+              </div>
+            </div>
+            <div>
+              <span class="inline-block px-4 py-1.5 bg-white/20 text-white rounded-full text-sm font-medium mb-4">
+                ข้อต่อท่อ
+              </span>
+              <h1 class="text-3xl sm:text-4xl lg:text-5xl font-bold text-white mb-4">ข้อต่อกรู๊ฟคับปลิ้ง | MECH Grooved Coupling</h1>
+              <p class="text-lg sm:text-xl text-white/80 mb-8 leading-relaxed">
+                ทดแทนการเชื่อม ติดตั้งง่าย ไร้ประกายไฟ ผลิตจาก Ductile Iron (เหล็กหล่อเหนียว) แข็งแรง ทนทาน มาตรฐาน UL/FM/Vds/DVGW/LPCB ราคาโรงงาน ส่งฟรี กรุงเทพมหานคร และปริมณฑล
+              </p>
+              <div class="flex flex-wrap gap-4 mb-8">
+                <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" class="bg-white text-primary-700 hover:bg-primary-50 py-3 px-6 rounded-xl font-semibold flex items-center gap-2">
+                  <span>แชท</span>
+                  <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"><path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/></svg>
+                </a>
+                <a href="tel:0905551415" class="bg-white/10 hover:bg-white/20 text-white py-3 px-6 rounded-xl font-semibold border border-white/30 flex items-center gap-2">
+                  <span>090-555-1415</span>
+                  <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z"/>
+                  </svg>
+                </a>
+                <a href="#pricelist" data-price-button class="hidden bg-white text-primary-700 hover:bg-primary-50 py-3 px-6 rounded-xl font-semibold flex items-center gap-2">
+                  <span>ราคาสินค้า</span>
+                  <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/>
+                  </svg>
+                </a>
+              </div>
+              <div class="space-y-4">
+                <div class="flex items-start space-x-3">
+                  <svg class="w-6 h-6 text-white mt-1 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                  </svg>
+                  <span class="text-lg text-white/80">ติดตั้งเร็วกว่า <strong>5 เท่า</strong> เมื่อเทียบกับการเชื่อม</span>
+                </div>
+                <div class="flex items-start space-x-3">
+                  <svg class="w-6 h-6 text-white mt-1 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                  </svg>
+                  <span class="text-lg text-white/80">ประหยัดค่าใช้จ่าย <strong>25-40%</strong></span>
+                </div>
+                <div class="flex items-start space-x-3">
+                  <svg class="w-6 h-6 text-white mt-1 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                  </svg>
+                  <span class="text-lg text-white/80">มาตรฐาน <strong>UL/FM/Vds/DVGW/LPCB</strong></span>
+                </div>
+                <div class="flex items-start space-x-3">
+                  <svg class="w-6 h-6 text-white mt-1 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                  </svg>
+                  <span class="text-lg text-white/80">ไม่ก่อให้เกิดประกายไฟ ปลอดภัยต่องานดับเพลิง</span>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Product Details -->
+    <section class="py-16">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-xl sm:text-xl font-bold text-slate-900 mb-8">รายละเอียดสินค้า</h2>
+          <div class="prose prose-lg max-w-none">
+
+            <h3 class="text-lg sm:text-xl font-bold text-slate-900 mt-8 mb-4">ข้อต่อกรู๊ฟคับปลิ้ง (Grooved Coupling) คืออะไร?</h3>
+            <p class="text-lg text-slate-700 leading-relaxed mb-6">
+              <strong>ข้อต่อกรู๊ฟคับปลิ้ง (Grooved Coupling)</strong> คือนวัตกรรมเพื่อการติดตั้งที่ทดแทนการเชื่อม สำหรับท่อเหล็กและท่อดับเพลิง โดยไม่ก่อให้เกิดประกายไฟ ติดตั้งง่าย สะดวก รวดเร็ว และประหยัดค่าใช้จ่าย
+            </p>
+
+            <h3 class="text-lg sm:text-xl font-bold text-slate-900 mt-8 mb-4">จุดเด่นของ MECH Grooved Coupling</h3>
+            <div class="grid md:grid-cols-3 gap-6 mb-8">
+              <div class="bg-primary-50 rounded-xl p-6 text-center">
+                <div class="text-3xl font-bold text-primary-600 mb-2">5 เท่า</div>
+                <div class="text-slate-700">ติดตั้งเร็วกว่า</div>
+              </div>
+              <div class="bg-orange-50 rounded-xl p-6 text-center">
+                <div class="text-3xl font-bold text-orange-600 mb-2">25-40%</div>
+                <div class="text-slate-700">ประหยัดค่าใช้จ่าย</div>
+              </div>
+              <div class="bg-slate-100 rounded-xl p-6 text-center">
+                <div class="text-3xl font-bold text-slate-700 mb-2">5 มาตรฐาน</div>
+                <div class="text-slate-700">UL/FM/Vds/DVGW/LPCB</div>
+              </div>
+            </div>
+
+            <h3 class="text-lg sm:text-xl font-bold text-slate-900 mt-8 mb-4">วัสดุและคุณภาพ</h3>
+            <p class="text-lg text-slate-700 leading-relaxed mb-6">
+              ผลิตจาก <strong>Ductile Iron (เหล็กหล่อเหนียว)</strong> — แข็งแรง ทนทาน เหมาะสำหรับงานหนักและงานอุตสาหกรรม ด้วยคุณภาพที่ผ่านการรับรองมาตรฐานระดับสากล
+            </p>
+
+            <h3 class="text-lg sm:text-xl font-bold text-slate-900 mt-8 mb-4">ขนาดและแรงดัน</h3>
+            <div class="overflow-x-auto mb-6">
+              <table class="min-w-full bg-white border border-gray-200 rounded-lg overflow-hidden">
+                <thead class="bg-gray-100">
+                  <tr>
+                    <th class="px-6 py-3 text-left text-sm font-semibold text-slate-900">รายการ</th>
+                    <th class="px-6 py-3 text-left text-sm font-semibold text-slate-900">ข้อมูล</th>
+                  </tr>
+                </thead>
+                <tbody class="divide-y divide-gray-200">
+                  <tr>
+                    <td class="px-6 py-3 text-sm text-slate-700">ขนาดท่อ</td>
+                    <td class="px-6 py-3 text-sm font-medium text-slate-900">1" – 32"</td>
+                  </tr>
+                  <tr class="bg-gray-50">
+                    <td class="px-6 py-3 text-sm text-slate-700">แรงดันใช้งาน</td>
+                    <td class="px-6 py-3 text-sm font-medium text-slate-900">225 - 750 psi</td>
+                  </tr>
+                </tbody>
+              </table>
+            </div>
+
+            <h3 class="text-lg sm:text-xl font-bold text-slate-900 mt-8 mb-4">การใช้งาน</h3>
+            <div class="grid grid-cols-2 md:grid-cols-4 gap-4 mb-6">
+              <div class="bg-red-50 rounded-lg p-4 text-center">
+                <svg class="w-10 h-10 text-red-600 mx-auto mb-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17.657 18.657A8 8 0 016.343 7.343S7 9 9 10c0-2 .5-5 2.986-7C14 5 16.09 5.777 17.656 7.343A7.975 7.975 0 0120 13a7.975 7.975 0 01-2.343 5.657z"/>
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.879 16.121A3 3 0 1012.015 11L11 14H9c0 .768.293 1.536.879 2.121z"/>
+                </svg>
+                <div class="font-semibold text-slate-900">ระบบดับเพลิง</div>
+              </div>
+              <div class="bg-blue-50 rounded-lg p-4 text-center">
+                <svg class="w-10 h-10 text-blue-600 mx-auto mb-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19.428 15.428a2 2 0 00-1.022-.547l-2.387-.477a6 6 0 00-3.86.517l-.318.158a6 6 0 01-3.86.517L6.05 15.21a2 2 0 00-1.806.547M8 4h8l-1 1v5.172a2 2 0 00.586 1.414l5 5c1.26 1.26.367 3.414-1.415 3.414H4.828c-1.782 0-2.674-2.154-1.414-3.414l5-5A2 2 0 009 10.172V5L8 4z"/>
+                </svg>
+                <div class="font-semibold text-slate-900">ระบบประปา</div>
+              </div>
+              <div class="bg-green-50 rounded-lg p-4 text-center">
+                <svg class="w-10 h-10 text-green-600 mx-auto mb-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.75 17L9 20l-1 1h8l-1-1-.75-3M3 13h18M5 17h14a2 2 0 002-2V5a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"/>
+                </svg>
+                <div class="font-semibold text-slate-900">HVAC</div>
+              </div>
+              <div class="bg-purple-50 rounded-lg p-4 text-center">
+                <svg class="w-10 h-10 text-purple-600 mx-auto mb-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 21V5a2 2 0 00-2-2H7a2 2 0 00-2 2v16m14 0h2m-2 0h-5m-9 0H3m2 0h5M9 7h1m-1 4h1m4-4h1m-1 4h1m-5 10v-5a1 1 0 011-1h2a1 1 0 011 1v5m-4 0h4"/>
+                </svg>
+                <div class="font-semibold text-slate-900">อุตสาหกรรม</div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Quick Mech Coupling Section -->
+    <section class="py-16 bg-gray-50">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-xl sm:text-xl font-bold text-slate-900 mb-8">Quick Mech Coupling</h2>
+          <div class="bg-white rounded-2xl shadow-lg overflow-hidden">
+            <div class="grid md:grid-cols-2 gap-8 p-8">
+              <div>
+                <h3 class="text-lg font-bold text-slate-900 mb-4">คุณสมบัติเด่น</h3>
+                <ul class="space-y-3">
+                  <li class="flex items-start space-x-3">
+                    <svg class="w-5 h-5 text-primary-600 mt-0.5 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                      <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                    </svg>
+                    <span class="text-slate-700">ปะเก็บยาง EPDM ชนิด Pre-Lubricated พร้อมติดตั้ง</span>
+                  </li>
+                  <li class="flex items-start space-x-3">
+                    <svg class="w-5 h-5 text-primary-600 mt-0.5 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                      <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                    </svg>
+                    <span class="text-slate-700">มาตรฐาน UL/FM สำหรับระบบดับเพลิง</span>
+                  </li>
+                  <li class="flex items-start space-x-3">
+                    <svg class="w-5 h-5 text-primary-600 mt-0.5 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                      <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                    </svg>
+                    <span class="text-slate-700">ติดตั้งง่าย รวดเร็ว ไม่ต้องใช้เครื่องมือพิเศษ</span>
+                  </li>
+                  <li class="flex items-start space-x-3">
+                    <svg class="w-5 h-5 text-primary-600 mt-0.5 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                      <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                    </svg>
+                    <span class="text-slate-700">รับแรงดันได้สูง ทนทาน</span>
+                  </li>
+                </ul>
+              </div>
+              <div class="flex items-center justify-center">
+                <div class="bg-primary-100 rounded-xl p-8 text-center">
+                  <svg class="w-16 h-16 text-primary-600 mx-auto mb-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z"/>
+                  </svg>
+                  <div class="font-bold text-primary-700 text-lg">UL/FM Certified</div>
+                  <div class="text-primary-600 text-sm">มาตรฐานระบบดับเพลิง</div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Comparison Section -->
+    <section class="py-16">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-xl sm:text-xl font-bold text-slate-900 mb-8">เปรียบเทียบ Grooved Coupling กับ การเชื่อม</h2>
+          <div class="overflow-x-auto">
+            <table class="min-w-full bg-white border border-gray-200 rounded-lg overflow-hidden">
+              <thead class="bg-primary-600 text-white">
+                <tr>
+                  <th class="px-6 py-3 text-left text-sm font-semibold">รายการ</th>
+                  <th class="px-6 py-3 text-left text-sm font-semibold">Grooved Coupling</th>
+                  <th class="px-6 py-3 text-left text-sm font-semibold">การเชื่อม</th>
+                </tr>
+              </thead>
+              <tbody class="divide-y divide-gray-200">
+                <tr>
+                  <td class="px-6 py-3 text-sm font-medium text-slate-900">ความเร็วติดตั้ง</td>
+                  <td class="px-6 py-3 text-sm text-primary-600 font-semibold">เร็วกว่า 5 เท่า</td>
+                  <td class="px-6 py-3 text-sm text-slate-600">ใช้เวลานาน</td>
+                </tr>
+                <tr class="bg-gray-50">
+                  <td class="px-6 py-3 text-sm font-medium text-slate-900">ความปลอดภัย</td>
+                  <td class="px-6 py-3 text-sm text-primary-600 font-semibold">ไม่มีประกายไฟ</td>
+                  <td class="px-6 py-3 text-sm text-slate-600">มีความเสี่ยงจากประกายไฟ</td>
+                </tr>
+                <tr>
+                  <td class="px-6 py-3 text-sm font-medium text-slate-900">ความยืดหยุ่น</td>
+                  <td class="px-6 py-3 text-sm text-primary-600 font-semibold">ถอดแยกได้ง่าย</td>
+                  <td class="px-6 py-3 text-sm text-slate-600">ตัดออกทั้งส่วน</td>
+                </tr>
+                <tr class="bg-gray-50">
+                  <td class="px-6 py-3 text-sm font-medium text-slate-900">ค่าใช้จ่าย</td>
+                  <td class="px-6 py-3 text-sm text-primary-600 font-semibold">ประหยัด 25-40%</td>
+                  <td class="px-6 py-3 text-sm text-slate-600">ค่าใช้จ่ายสูงกว่า</td>
+                </tr>
+                <tr>
+                  <td class="px-6 py-3 text-sm font-medium text-slate-900">ช่างที่ต้องการ</td>
+                  <td class="px-6 py-3 text-sm text-primary-600 font-semibold">ผ่านการฝึกอบรมมาตรฐาน</td>
+                  <td class="px-6 py-3 text-sm text-slate-600">ช่างเชื่อมผีเสื้อสมุทร</td>
+                </tr>
+              </tbody>
+            </table>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- FAQ Section -->
+    <section id="faq" class="py-16 bg-gray-50">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="max-w-4xl mx-auto">
+          <h2 class="text-xl font-bold text-slate-900 mb-8">คำถามที่พบบ่อย</h2>
+          <div class="space-y-4">
+            <div class="bg-white rounded-lg p-4 shadow-sm">
+              <h3 class="font-semibold text-slate-900 mb-2">Q: Grooved Coupling กับ Flange ต่างกันอย่างไร?</h3>
+              <p class="text-slate-700">Groove coupling ใช้ร่องที่ตัดที่ตัวท่อและข้อต่อมีบ่ายึด ติดตั้งง่ายและรวดเร็วกว่า Flange ที่ต้องเชื่อมหรือสกรูข้อต่อเข้ากับท่อ</p>
+            </div>
+            <div class="bg-white rounded-lg p-4 shadow-sm">
+              <h3 class="font-semibold text-slate-900 mb-2">Q: ข้อต่อหลุดได้ไหม?</h3>
+              <p class="text-slate-700">ถ้าติดตั้งถูกวิธีและใช้แรงบิดที่ถูกต้อง ข้อต่อจะแน่นหนาวไม่หลุด สำคัญคือต้องตรวจสอบสภาพและขันสกรูใหม่ตามระยะเวลาที่กำหนด</p>
+            </div>
+            <div class="bg-white rounded-lg p-4 shadow-sm">
+              <h3 class="font-semibold text-slate-900 mb-2">Q: ใช้กับท่อวัสดุอะไรได้บ้าง?</h3>
+              <p class="text-slate-700">Groove coupling ใช้ได้กับท่อเหล็ก (แบบลดน้ำหนัก, แบบหนา), ท่อสแตนเลส, ท่อ HDPE, ท่อ PVC และท่อ GRP</p>
+            </div>
+            <div class="bg-white rounded-lg p-4 shadow-sm">
+              <h3 class="font-semibold text-slate-900 mb-2">Q: ทำไมต้องเลือก MECH Grooved Coupling?</h3>
+              <p class="text-slate-700">MECH ได้รับการรับรองมาตรฐาน UL/FM/Vds/DVGW/LPCB ทั้ง 5 มาตรฐาน ผลิตจาก Ductile Iron คุณภาพสูง ติดตั้งเร็วกว่า 5 เท่า และประหยัดค่าใช้จ่าย 25-40%</p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Price List Section -->
+    <section id="pricelist" class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="max-w-lg mx-auto">
+          <h2 class="text-lg sm:text-xl font-bold mb-6 text-center">ดาวน์โหลดราคาสินค้า</h2>
+          <a href="/documents/Price List MECH_V13-2021 [260864](1).pdf" target="_blank" class="flex items-center gap-4 p-4 bg-white rounded-xl shadow-sm hover:shadow-md transition-shadow group">
+            <svg class="w-10 h-10 text-red-600 flex-shrink-0" fill="currentColor" viewBox="0 0 24 24"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6zm-1 9V3.5L18.5 9H13zM8 13h8v2H8v-2zm0 4h8v2H8v-2zm0-8h2v2H8V9z"/></svg>
+            <div>
+              <div class="font-semibold text-slate-900 group-hover:text-primary-600 transition-colors">ราคาสินค้า MECH V13-2021</div>
+              <div class="text-sm text-slate-500">PDF - ดาวน์โหลดราคา</div>
+            </div>
+          </a>
+        </div>
+      </div>
+    </section>
+
+    <!-- CTA Section -->
+    <section class="py-16 bg-gradient-to-br from-accent-500 to-accent-600 text-white text-center">
+      <div class="max-w-4xl mx-auto px-4">
+        <h2 class="text-2xl md:text-3xl font-bold mb-6">สนใจสินค้าของเรา?</h2>
+        <p class="text-lg text-white/80 mb-8 max-w-2xl mx-auto">
+          ติดต่อเราวันนี้เพื่อรับคำแนะนำและราคาพิเศษ
+        </p>
+        <div class="flex flex-wrap justify-center gap-4">
+          <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" class="bg-white text-accent-600 hover:bg-gray-100 py-3 px-8 rounded-xl font-semibold flex items-center gap-2">
+            <span>แชท</span>
+            <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"><path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/></svg>
+          </a>
+          <a href="tel:0905551415" class="bg-white/10 hover:bg-white/20 text-white py-3 px-8 rounded-xl font-semibold border border-white/30 flex items-center gap-2">
+            <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z"/>
+            </svg>
+            <span>090-555-1415</span>
+          </a>
+        </div>
+      </div>
+    </section>
+  </main>
+
+  <Footer slot="footer" />
+  <StickyBottomCTA phone="0905551415" lineUrl="https://line.me/ti/p/~JPPSELECTION" slot="after-footer" />
+</BaseLayout>
--- a/src/styles/global.css
+++ b/src/styles/global.css
@@ -0,0 +1,205 @@
+@import "tailwindcss";
+@plugin "@tailwindcss/typography";
+
+@theme {
+  /* Primary - Green */
+  --color-primary-50: #ecfdf5;
+  --color-primary-100: #d1fae5;
+  --color-primary-200: #a7f3d0;
+  --color-primary-300: #6ee7b7;
+  --color-primary-400: #4ab87a;
+  --color-primary-500: #3f8b6d;
+  --color-primary-600: #2d6a4f;
+  --color-primary-700: #1b4332;
+  --color-primary-800: #081c15;
+  --color-primary-900: #041a0f;
+
+  /* Accent - Orange */
+  --color-accent-50: #fff7ed;
+  --color-accent-100: #ffedd5;
+  --color-accent-200: #fed7aa;
+  --color-accent-300: #fdba74;
+  --color-accent-400: #fb923c;
+  --color-accent-500: #e35c1c;
+  --color-accent-600: #c2410c;
+  --color-accent-700: #9a3412;
+  --color-accent-800: #7c2d12;
+  --color-accent-900: #431407;
+
+  /* Neutrals */
+  --color-neutral-50: #fafafa;
+  --color-neutral-100: #f5f5f5;
+  --color-neutral-200: #e5e5e5;
+  --color-neutral-300: #d4d4d4;
+  --color-neutral-400: #a3a3a3;
+  --color-neutral-500: #737373;
+  --color-neutral-600: #525252;
+  --color-neutral-700: #404040;
+  --color-neutral-800: #262626;
+  --color-neutral-900: #171717;
+
+  /* Radius */
+  --radius-sm: 0.25rem;
+  --radius-md: 0.5rem;
+  --radius-lg: 0.75rem;
+  --radius-xl: 1rem;
+  --radius-2xl: 1.5rem;
+  --radius-full: 9999px;
+
+  /* Font */
+  --font-sans: "Kanit", "Noto Sans Thai", system-ui, sans-serif;
+}
+
+@layer base {
+  html {
+    scroll-behavior: smooth;
+  }
+
+  body {
+    @apply font-sans text-neutral-800 antialiased;
+  }
+
+  h1, h2, h3, h4, h5, h6 {
+    @apply font-sans font-medium tracking-tight;
+  }
+}
+
+/* Animations */
+@keyframes fadeIn {
+  from {
+    opacity: 0;
+    transform: translateY(10px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
+@keyframes zoomIn {
+  from {
+    opacity: 0;
+    transform: scale(0.95);
+  }
+  to {
+    opacity: 1;
+    transform: scale(1);
+  }
+}
+
+@keyframes float {
+  0%, 100% {
+    transform: translateY(0px);
+  }
+  50% {
+    transform: translateY(-10px);
+  }
+}
+
+@keyframes orb-drift {
+  0%, 100% {
+    transform: translate(0, 0) scale(1);
+    opacity: 0.3;
+  }
+  33% {
+    transform: translate(20px, -20px) scale(1.1);
+    opacity: 0.4;
+  }
+  66% {
+    transform: translate(-10px, 10px) scale(0.95);
+    opacity: 0.25;
+  }
+}
+
+@keyframes orb-drift-2 {
+  0%, 100% {
+    transform: translate(0, 0) scale(1);
+    opacity: 0.25;
+  }
+  33% {
+    transform: translate(-25px, 15px) scale(1.05);
+    opacity: 0.35;
+  }
+  66% {
+    transform: translate(15px, -10px) scale(0.98);
+    opacity: 0.2;
+  }
+}
+
+@keyframes orb-drift-3 {
+  0%, 100% {
+    transform: translate(-50%, -50%) scale(1);
+    opacity: 0.15;
+  }
+  50% {
+    transform: translate(-45%, -55%) scale(1.1);
+    opacity: 0.25;
+  }
+}
+
+.animate-float {
+  animation: float 3s ease-in-out infinite;
+}
+
+.animate-float-delayed-1 {
+  animation: float 3s ease-in-out infinite;
+  animation-delay: 0.5s;
+}
+
+.animate-float-delayed-2 {
+  animation: float 3s ease-in-out infinite;
+  animation-delay: 1s;
+}
+
+.animate-float-delayed-3 {
+  animation: float 3s ease-in-out infinite;
+  animation-delay: 1.5s;
+}
+
+.animate-orb-1 {
+  animation: orb-drift 8s ease-in-out infinite;
+}
+
+.animate-orb-2 {
+  animation: orb-drift-2 10s ease-in-out infinite;
+}
+
+.animate-orb-3 {
+  animation: orb-drift-3 12s ease-in-out infinite;
+}
+
+.animate-fade-in {
+  animation: fadeIn 0.3s ease-out forwards;
+}
+
+.animate-zoom-in {
+  animation: zoomIn 0.3s ease-out forwards;
+}
+
+/* Stagger animations for grids */
+.stagger-container > * {
+  opacity: 0;
+  animation: fadeIn 0.4s ease-out forwards;
+}
+
+.stagger-container > *:nth-child(1) { animation-delay: 0ms; }
+.stagger-container > *:nth-child(2) { animation-delay: 50ms; }
+.stagger-container > *:nth-child(3) { animation-delay: 100ms; }
+.stagger-container > *:nth-child(4) { animation-delay: 150ms; }
+.stagger-container > *:nth-child(5) { animation-delay: 200ms; }
+.stagger-container > *:nth-child(6) { animation-delay: 250ms; }
+.stagger-container > *:nth-child(7) { animation-delay: 300ms; }
+.stagger-container > *:nth-child(8) { animation-delay: 350ms; }
+
+/* Image hover zoom */
+.img-hover {
+  @apply overflow-hidden;
+}
+
+.img-hover img {
+  @apply transition-transform duration-300 ease-out;
+}
+
+.img-hover:hover img {
+  @apply scale-105;
+}
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -0,0 +1,12 @@
+{
+  "extends": "astro/tsconfigs/strict",
+  "compilerOptions": {
+    "baseUrl": ".",
+    "paths": {
+      "@/*": ["./src/*"],
+      "@components/*": ["./src/components/*"],
+      "@layouts/*": ["./src/layouts/*"],
+      "@styles/*": ["./src/styles/*"]
+    }
+  }
+}