Fix animated hero background position and update Header menu

1. Fixed animated hero background - now inside the hero section with proper class structure
2. Changed อุปกรณ์ดับเพลิง to ตู้ดับเพลิง in Header main menu
This commit is contained in:
Kunthawat Greethong
2026-05-24 11:57:17 +07:00
parent b4a41c3ed4
commit e82f4b39f2
28 changed files with 55 additions and 55 deletions

View File

@@ -9,7 +9,7 @@ import Footer from '@/components/common/Footer.astro';
<main class="bg-white min-h-screen">
<!-- Hero Section -->
<section class="relative bg-gradient-to-br from-primary-800 via-primary-700 to-primary-900 text-white py-16 lg:py-24 overflow-hidden">
<section class="relative bg-gradient-to-br from-primary-800 via-primary-700 to-primary-900 text-white py-16 lg:py-24 overflow-hidden relative overflow-hidden">>
<!-- Animated Background -->
<div class="absolute inset-0 overflow-hidden pointer-events-none">
<div class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[800px] h-[800px] bg-gradient-to-br from-primary-400/30 via-primary-500/15 to-transparent rounded-full blur-[100px] animate-mesh-1"></div>
@@ -245,7 +245,7 @@ import Footer from '@/components/common/Footer.astro';
</section>
<!-- Download Section -->
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white">
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white relative overflow-hidden">>
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10">
<div class="max-w-lg mx-auto text-center">
<h2 class="text-xl font-bold mb-6">📥 ดาวน์โหลดราคาสินค้า Aeroflex</h2>

View File

@@ -62,7 +62,7 @@ const categories = [
<BaseLayout title="สินค้าทั้งหมด - ดีล พลัส เทค" description="สินค้าระบบน้ำคุณภาพสูง ท่อ PPR ท่อ HDPE อุปกรณ์วาล์ว ปั๊มน้ำ เครื่องเชื่อมท่อ">
<!-- Hero -->
<section class="relative bg-gradient-to-br from-primary-800 via-primary-700 to-primary-900 text-white py-16 overflow-hidden">
<section class="relative bg-gradient-to-br from-primary-800 via-primary-700 to-primary-900 text-white py-16 overflow-hidden relative overflow-hidden">>
<!-- Animated Background -->
<div class="absolute inset-0 overflow-hidden pointer-events-none">
<div class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[800px] h-[800px] bg-gradient-to-br from-primary-400/30 via-primary-500/15 to-transparent rounded-full blur-[100px] animate-mesh-1"></div>
@@ -129,7 +129,7 @@ const categories = [
</section>
<!-- CTA -->
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white">
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white relative overflow-hidden">>
<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>

View File

@@ -9,7 +9,7 @@ import Footer from '@/components/common/Footer.astro';
<main class="bg-white min-h-screen">
<!-- Hero Section -->
<section class="relative bg-gradient-to-br from-primary-800 via-primary-700 to-primary-900 text-white py-16 lg:py-24 overflow-hidden">
<section class="relative bg-gradient-to-br from-primary-800 via-primary-700 to-primary-900 text-white py-16 lg:py-24 overflow-hidden relative overflow-hidden">>
<!-- Animated Background -->
<div class="absolute inset-0 overflow-hidden pointer-events-none">
<div class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[800px] h-[800px] bg-gradient-to-br from-primary-400/30 via-primary-500/15 to-transparent rounded-full blur-[100px] animate-mesh-1"></div>
@@ -260,7 +260,7 @@ import Footer from '@/components/common/Footer.astro';
</section>
<!-- Download Section -->
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white">
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white relative overflow-hidden">>
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10">
<div class="max-w-lg mx-auto text-center">
<h2 class="text-xl font-bold mb-6">📥 ดาวน์โหลดราคาสินค้า Armaflex</h2>

View File

@@ -4,7 +4,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<BaseLayout title="ติดต่อเรา - ดีล พลัส เทค" description="ติดต่อ ดีล พลัส เทค จำกัด โทร 090-555-1415 แอดไลน์ @JPPSELECTION">
<!-- Hero -->
<section class="relative bg-gradient-to-br from-primary-800 via-primary-700 to-primary-900 text-white py-16 overflow-hidden">
<section class="relative bg-gradient-to-br from-primary-800 via-primary-700 to-primary-900 text-white py-16 overflow-hidden relative overflow-hidden">>
<!-- Animated Background -->
<div class="absolute inset-0 overflow-hidden pointer-events-none">
<div class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[800px] h-[800px] bg-gradient-to-br from-primary-400/30 via-primary-500/15 to-transparent rounded-full blur-[100px] animate-mesh-1"></div>

View File

@@ -5,7 +5,7 @@ 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="relative bg-gradient-to-br from-primary-800 via-primary-700 to-primary-900 text-white py-16 overflow-hidden">
<section class="relative bg-gradient-to-br from-primary-800 via-primary-700 to-primary-900 text-white py-16 overflow-hidden relative overflow-hidden">>
<!-- Animated Background -->
<div class="absolute inset-0 overflow-hidden pointer-events-none">
<div class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[800px] h-[800px] bg-gradient-to-br from-primary-400/30 via-primary-500/15 to-transparent rounded-full blur-[100px] animate-mesh-1"></div>
@@ -289,7 +289,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
</section>
<!-- Contact CTA -->
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white">
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white relative overflow-hidden">>
<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">

View File

@@ -5,7 +5,7 @@ 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="relative bg-gradient-to-br from-primary-800 via-primary-700 to-primary-900 text-white py-16 overflow-hidden">
<section class="relative bg-gradient-to-br from-primary-800 via-primary-700 to-primary-900 text-white py-16 overflow-hidden relative overflow-hidden">>
<!-- Animated Background -->
<div class="absolute inset-0 overflow-hidden pointer-events-none">
<div class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[800px] h-[800px] bg-gradient-to-br from-primary-400/30 via-primary-500/15 to-transparent rounded-full blur-[100px] animate-mesh-1"></div>
@@ -295,7 +295,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
</section>
<!-- Contact CTA -->
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white">
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white relative overflow-hidden">>
<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">

View File

@@ -9,7 +9,7 @@ import Footer from '@/components/common/Footer.astro';
<main class="bg-white min-h-screen">
<!-- Hero Section -->
<section class="relative bg-gradient-to-br from-primary-800 via-primary-700 to-primary-900 text-white py-16 lg:py-24 overflow-hidden">
<section class="relative bg-gradient-to-br from-primary-800 via-primary-700 to-primary-900 text-white py-16 lg:py-24 overflow-hidden relative overflow-hidden">>
<!-- Animated Background -->
<div class="absolute inset-0 overflow-hidden pointer-events-none">
<div class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[800px] h-[800px] bg-gradient-to-br from-primary-400/30 via-primary-500/15 to-transparent rounded-full blur-[100px] animate-mesh-1"></div>
@@ -244,7 +244,7 @@ import Footer from '@/components/common/Footer.astro';
</section>
<!-- Download Section -->
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white">
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white relative overflow-hidden">>
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10">
<div class="max-w-lg mx-auto text-center">
<h2 class="text-xl font-bold mb-6">📥 ดาวน์โหลดราคาสินค้า Maxflex FR</h2>

View File

@@ -5,7 +5,7 @@ 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="relative bg-gradient-to-br from-primary-800 via-primary-700 to-primary-900 text-white py-16 overflow-hidden">
<section class="relative bg-gradient-to-br from-primary-800 via-primary-700 to-primary-900 text-white py-16 overflow-hidden relative overflow-hidden">>
<!-- Animated Background -->
<div class="absolute inset-0 overflow-hidden pointer-events-none">
<div class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[800px] h-[800px] bg-gradient-to-br from-primary-400/30 via-primary-500/15 to-transparent rounded-full blur-[100px] animate-mesh-1"></div>
@@ -193,7 +193,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
</section>
<!-- Contact CTA -->
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white">
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white relative overflow-hidden">>
<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">

View File

@@ -4,7 +4,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<BaseLayout title="ผลงาน - ดีล พลัส เทค" description="ผลงานติดตั้งระบบน้ำของ ดีล พลัส เทค จำกัด">
<!-- Hero -->
<section class="relative bg-gradient-to-br from-primary-800 via-primary-700 to-primary-900 text-white py-16 overflow-hidden">
<section class="relative bg-gradient-to-br from-primary-800 via-primary-700 to-primary-900 text-white py-16 overflow-hidden relative overflow-hidden">>
<!-- Animated Background -->
<div class="absolute inset-0 overflow-hidden pointer-events-none">
<div class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[800px] h-[800px] bg-gradient-to-br from-primary-400/30 via-primary-500/15 to-transparent rounded-full blur-[100px] animate-mesh-1"></div>
@@ -163,7 +163,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
</section>
<!-- CTA -->
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white">
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white relative overflow-hidden">>
<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>

View File

@@ -26,7 +26,7 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
<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">
<section class="bg-gradient-to-br from-primary-700 to-primary-600 text-white py-12 relative overflow-hidden">>
<!-- Animated Background -->
<div class="absolute inset-0 overflow-hidden pointer-events-none">
@@ -211,7 +211,7 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
</section>
<!-- Contact CTA -->
<section class="py-16 px-4 bg-gradient-to-br from-primary-700 to-primary-600 text-white text-center">
<section class="py-16 px-4 bg-gradient-to-br from-primary-700 to-primary-600 text-white text-center relative overflow-hidden">>
<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>

View File

@@ -5,7 +5,7 @@ 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="relative bg-gradient-to-br from-primary-800 via-primary-700 to-primary-900 text-white py-16 overflow-hidden">
<section class="relative bg-gradient-to-br from-primary-800 via-primary-700 to-primary-900 text-white py-16 overflow-hidden relative overflow-hidden">>
<!-- Animated Background -->
<div class="absolute inset-0 overflow-hidden pointer-events-none">
<div class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[800px] h-[800px] bg-gradient-to-br from-primary-400/30 via-primary-500/15 to-transparent rounded-full blur-[100px] animate-mesh-1"></div>
@@ -321,7 +321,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
</section>
<!-- Contact CTA -->
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white">
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white relative overflow-hidden">>
<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">

View File

@@ -26,7 +26,7 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
<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">
<section class="bg-gradient-to-br from-primary-700 to-primary-600 text-white py-12 relative overflow-hidden">>
<!-- Animated Background -->
<div class="absolute inset-0 overflow-hidden pointer-events-none">
@@ -210,7 +210,7 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
</section>
<!-- Contact CTA -->
<section class="py-16 px-4 bg-gradient-to-br from-primary-700 to-primary-600 text-white text-center">
<section class="py-16 px-4 bg-gradient-to-br from-primary-700 to-primary-600 text-white text-center relative overflow-hidden">>
<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>

View File

@@ -344,7 +344,7 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
</section>
<!-- CTA Section -->
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white text-center">
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white text-center relative overflow-hidden">>
<!-- Animated Background -->
<div class="absolute inset-0 overflow-hidden pointer-events-none">

View File

@@ -5,7 +5,7 @@ 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">
<section class="bg-gradient-to-br from-primary-700 to-primary-600 text-white relative overflow-hidden">>
<!-- Animated Background -->
<div class="absolute inset-0 overflow-hidden pointer-events-none">
@@ -131,7 +131,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
</section>
<!-- CTA -->
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white">
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white relative overflow-hidden">>
<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>

View File

@@ -5,7 +5,7 @@ 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">
<section class="bg-gradient-to-br from-primary-700 to-primary-600 text-white relative overflow-hidden">>
<!-- Animated Background -->
<div class="absolute inset-0 overflow-hidden pointer-events-none">
@@ -123,7 +123,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
</section>
<!-- CTA -->
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white">
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white relative overflow-hidden">>
<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>

View File

@@ -5,7 +5,7 @@ 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">
<section class="bg-gradient-to-br from-primary-700 to-primary-600 text-white relative overflow-hidden">>
<!-- Animated Background -->
<div class="absolute inset-0 overflow-hidden pointer-events-none">
@@ -142,7 +142,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
</section>
<!-- CTA -->
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white">
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white relative overflow-hidden">>
<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>

View File

@@ -5,7 +5,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<BaseLayout title="ท่อ Syler | ท่อเหล็กบุพีอี" description="จำหน่ายท่อ Syler ท่อเหล็กบุพีอีคุณภาพสูง ราคาโรงงาน ส่งฟรี กทม. ปริมณฑล">
<main class="bg-white min-h-screen">
<!-- Product Hero Section -->
<section class="relative bg-gradient-to-br from-primary-800 via-primary-700 to-primary-900 text-white py-16 overflow-hidden">
<section class="relative bg-gradient-to-br from-primary-800 via-primary-700 to-primary-900 text-white py-16 overflow-hidden relative overflow-hidden">>
<!-- Animated Background -->
<div class="absolute inset-0 overflow-hidden pointer-events-none">
<div class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[800px] h-[800px] bg-gradient-to-br from-primary-400/30 via-primary-500/15 to-transparent rounded-full blur-[100px] animate-mesh-1"></div>
@@ -338,7 +338,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
</section>
<!-- Contact CTA -->
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white">
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white relative overflow-hidden">>
<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">

View File

@@ -5,7 +5,7 @@ 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">
<section class="bg-gradient-to-br from-primary-700 to-primary-600 text-white relative overflow-hidden">>
<!-- Animated Background -->
<div class="absolute inset-0 overflow-hidden pointer-events-none">
@@ -142,7 +142,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
</section>
<!-- CTA -->
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white">
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white relative overflow-hidden">>
<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>

View File

@@ -2,7 +2,7 @@
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">
<section class="bg-gradient-to-br from-primary-700 to-primary-600 text-white py-12 relative overflow-hidden">>
<!-- Animated Background -->
<div class="absolute inset-0 overflow-hidden pointer-events-none">
@@ -242,7 +242,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
</section>
<!-- CTA -->
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white text-center">
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white text-center relative overflow-hidden">>
<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>

View File

@@ -5,7 +5,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<BaseLayout title="ระบบน้ำ - วาล์ว ปั๊มน้ำ ระบบกรองน้ำ" description="ระบบน้ำครบวงจร วาล์ว ปั๊มน้ำ ระบบกรองน้ำ คุณภาพสูง ราคาโรงงาน ส่งฟรี กรุงเทพมหานคร ปริมณฑล">
<main class="bg-white min-h-screen">
<!-- Category Hero Section -->
<section class="relative bg-gradient-to-br from-primary-800 via-primary-700 to-primary-900 text-white py-16 overflow-hidden">
<section class="relative bg-gradient-to-br from-primary-800 via-primary-700 to-primary-900 text-white py-16 overflow-hidden relative overflow-hidden">>
<!-- Animated Background -->
<div class="absolute inset-0 overflow-hidden pointer-events-none">
<div class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[800px] h-[800px] bg-gradient-to-br from-primary-400/30 via-primary-500/15 to-transparent rounded-full blur-[100px] animate-mesh-1"></div>
@@ -104,7 +104,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
</section>
<!-- Contact CTA -->
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white">
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white relative overflow-hidden">>
<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>

View File

@@ -26,7 +26,7 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
<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">
<section class="bg-gradient-to-br from-primary-700 to-primary-600 text-white py-12 relative overflow-hidden">>
<!-- Animated Background -->
<div class="absolute inset-0 overflow-hidden pointer-events-none">
@@ -549,7 +549,7 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
</section>
<!-- Contact CTA -->
<section class="py-16 px-4 bg-gradient-to-br from-primary-700 to-primary-600 text-white text-center">
<section class="py-16 px-4 bg-gradient-to-br from-primary-700 to-primary-600 text-white text-center relative overflow-hidden">>
<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>

View File

@@ -3,7 +3,7 @@ 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">
<section class="bg-gradient-to-br from-primary-700 to-primary-600 text-white py-12 relative overflow-hidden">>
<!-- Animated Background -->
<div class="absolute inset-0 overflow-hidden pointer-events-none">
@@ -233,7 +233,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
</section>
<!-- CTA Section -->
<section class="py-16 bg-gradient-to-br from-accent-500 to-accent-600 text-white">
<section class="py-16 bg-gradient-to-br from-accent-500 to-accent-600 text-white relative overflow-hidden">>
<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>

View File

@@ -21,7 +21,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<BaseLayout title="วาล์ว (Valve) - วาล์วน้ำทุกประเภท" description="จำหน่ายวาล์ว (Valve) - วาล์วน้ำทุกประเภทคุณภาพสูง ราคาโรงงาน ส่งฟรี กทม. ปริมณฑล">
<main class="bg-white min-h-screen">
<!-- Product Hero Section -->
<section class="relative bg-gradient-to-br from-primary-800 via-primary-700 to-primary-900 text-white py-16 overflow-hidden">
<section class="relative bg-gradient-to-br from-primary-800 via-primary-700 to-primary-900 text-white py-16 overflow-hidden relative overflow-hidden">>
<!-- Animated Background -->
<div class="absolute inset-0 overflow-hidden pointer-events-none">
<div class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[800px] h-[800px] bg-gradient-to-br from-primary-400/30 via-primary-500/15 to-transparent rounded-full blur-[100px] animate-mesh-1"></div>
@@ -229,7 +229,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
</section>
<!-- CTA Section -->
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white">
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white relative overflow-hidden">>
<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>

View File

@@ -3,7 +3,7 @@ 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">
<section class="bg-gradient-to-br from-primary-700 to-primary-600 text-white py-12 relative overflow-hidden">>
<!-- Animated Background -->
<div class="absolute inset-0 overflow-hidden pointer-events-none">
@@ -279,7 +279,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
</section>
<!-- CTA Section -->
<section class="py-16 bg-gradient-to-br from-accent-500 to-accent-600 text-white">
<section class="py-16 bg-gradient-to-br from-accent-500 to-accent-600 text-white relative overflow-hidden">>
<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>

View File

@@ -21,7 +21,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<BaseLayout title="เครื่องเชื่อมท่อ HDPE (HDPE Pipe Welding Machine)" description="จำหน่ายเครื่องเชื่อมท่อ HDPE คุณภาพสูง ราคาโรงงาน เครื่องเชื่อมแบบ Butt Fusion และ Electrofusion">
<main class="bg-white min-h-screen">
<!-- Product Hero Section -->
<section class="relative bg-gradient-to-br from-primary-800 via-primary-700 to-primary-900 text-white py-16 overflow-hidden">
<section class="relative bg-gradient-to-br from-primary-800 via-primary-700 to-primary-900 text-white py-16 overflow-hidden relative overflow-hidden">>
<!-- Animated Background -->
<div class="absolute inset-0 overflow-hidden pointer-events-none">
<div class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[800px] h-[800px] bg-gradient-to-br from-primary-400/30 via-primary-500/15 to-transparent rounded-full blur-[100px] animate-mesh-1"></div>
@@ -262,7 +262,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
</section>
<!-- Contact CTA -->
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white">
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white relative overflow-hidden">>
<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>

View File

@@ -9,7 +9,7 @@ import Footer from '@/components/common/Footer.astro';
<main class="bg-white min-h-screen">
<!-- Product Hero Section -->
<section class="relative bg-gradient-to-br from-primary-800 via-primary-700 to-primary-900 text-white py-16 overflow-hidden">
<section class="relative bg-gradient-to-br from-primary-800 via-primary-700 to-primary-900 text-white py-16 overflow-hidden relative overflow-hidden">>
<!-- Animated Background -->
<div class="absolute inset-0 overflow-hidden pointer-events-none">
<div class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[800px] h-[800px] bg-gradient-to-br from-primary-400/30 via-primary-500/15 to-transparent rounded-full blur-[100px] animate-mesh-1"></div>
@@ -267,7 +267,7 @@ import Footer from '@/components/common/Footer.astro';
</section>
<!-- CTA Section -->
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white text-center">
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white text-center relative overflow-hidden">>
<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">

View File

@@ -26,7 +26,7 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
<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">
<section class="bg-gradient-to-br from-primary-700 to-primary-600 text-white py-12 relative overflow-hidden">>
<!-- Animated Background -->
<div class="absolute inset-0 overflow-hidden pointer-events-none">
@@ -334,7 +334,7 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
</section>
<!-- Price Download Section -->
<section id="pricelist" class="py-16 px-4 bg-gradient-to-br from-primary-700 to-primary-600">
<section id="pricelist" class="py-16 px-4 bg-gradient-to-br from-primary-700 to-primary-600 relative overflow-hidden">>
<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">
@@ -348,7 +348,7 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
</section>
<!-- Contact CTA Section -->
<section class="py-16 px-4 bg-gradient-to-br from-primary-700 to-primary-600 text-white text-center">
<section class="py-16 px-4 bg-gradient-to-br from-primary-700 to-primary-600 text-white text-center relative overflow-hidden">>
<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>

View File

@@ -325,7 +325,7 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
</section>
<!-- Price List Section -->
<section id="pricelist" class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white">
<section id="pricelist" class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white relative overflow-hidden">>
<!-- Animated Background -->
<div class="absolute inset-0 overflow-hidden pointer-events-none">
@@ -374,7 +374,7 @@ import StickyBottomCTA from '@/components/common/StickyBottomCTA.astro';
</section>
<!-- CTA Section -->
<section class="py-16 bg-gradient-to-br from-accent-500 to-accent-600 text-white text-center">
<section class="py-16 bg-gradient-to-br from-accent-500 to-accent-600 text-white text-center relative overflow-hidden">>
<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">