dealplustech-astro/src/pages/อุปกรณ์ปรับอากาศ/index.astro

---
import BaseLayout from '@/layouts/BaseLayout.astro';
import Header from '@/components/common/Header.astro';
import Footer from '@/components/common/Footer.astro';
---

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "Product",
  "name": "อุปกรณ์ปรับอากาศ",
  "description": "อุปกรณ์ปรับอากาศ หัวจ่ายแอร์ กริลแอร์ คุณภาพสูง ราคาโรงงาน ส่งฟรี กทม. ปริมณฑล",
  "image": "https://dealplustech.co.th/images/products-raw/ball-jet/main-ball-jet.jpg",
  "offers": {
    "@type": "Offer",
    "url": "https://dealplustech.co.th/อุปกรณ์ปรับอากาศ",
    "priceCurrency": "THB",
    "availability": "https://schema.org/InStock"
  }
}
</script>

<BaseLayout title="อุปกรณ์ปรับอากาศ" description="อุปกรณ์ปรับอากาศ หัวจ่ายแอร์ กริลแอร์ คุณภาพสูง ราคาโรงงาน ส่งฟรี กทม. ปริมณฑล">
  <Header slot="header" />
  
  <main class="bg-white min-h-screen">
    <!-- Category Hero Section -->
    <section class="hero-gradient py-16">
      <div class="container-custom">
        <div class="grid lg:grid-cols-2 gap-12 items-center">
          <div>
            <div class="card-glass p-2">
              <img src="/images/products-raw/ball-jet/main-ball-jet.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">
              <a href="https://line.me/ti/p/~dealplustech" target="_blank" class="btn-white 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="btn-white 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="flex flex-wrap gap-6 mt-8">
              <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>
    
    <!-- Products -->
    <section class="section bg-secondary-50">
      <div class="container-custom">
        <div class="text-center mb-12">
          <h2 class="section-title">สินค้าในหมวดนี้</h2>
        </div>
        
        <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-6">
          <a href="/หัวจ่ายแอร์-ball-jet" class="card-hover group overflow-hidden block">
            <div class="relative h-48 overflow-hidden img-zoom">
              <img src="/images/products-raw/ball-jet/main-ball-jet.jpg" alt="หัวจ่ายแอร์" class="w-full h-full object-cover" width="400" height="300" loading="lazy" decoding="async" onerror="this.src='/images/logo/dealplustech-logo.png'" />
            </div>
            <div class="p-4 text-center bg-white">
              <h3 class="text-lg font-bold text-secondary-900 group-hover:text-primary-600 transition-colors">หัวจ่ายแอร์</h3>
            </div>
          </a>
          <a href="/grilles" class="card-hover group overflow-hidden block">
            <div class="relative h-48 overflow-hidden img-zoom">
              <img src="/images/products-cropped/grilles_000C.jpg" alt="กริลแอร์" class="w-full h-full object-cover" width="400" height="300" loading="lazy" decoding="async" onerror="this.src='/images/logo/dealplustech-logo.png'" />
            </div>
            <div class="p-4 text-center bg-white">
              <h3 class="text-lg font-bold text-secondary-900 group-hover:text-primary-600 transition-colors">กริลแอร์</h3>
            </div>
          </a>
          <a href="/durgo-avvs" class="card-hover group overflow-hidden block">
            <div class="relative h-48 overflow-hidden img-zoom">
              <img src="/images/products-cropped/durgo_000C.jpg" alt="DURGO วาล์วเติมอากาศ" class="w-full h-full object-cover" width="400" height="300" loading="lazy" decoding="async" onerror="this.src='/images/logo/dealplustech-logo.png'" />
            </div>
            <div class="p-4 text-center bg-white">
              <h3 class="text-lg font-bold text-secondary-900 group-hover:text-primary-600 transition-colors">DURGO วาล์วเติมอากาศ</h3>
            </div>
          </a>
        </div>
      </div>
    </section>
    
    <!-- Equipment Types Guide -->
    <section class="section bg-white">
      <div class="container-custom">
        <div class="text-center mb-12">
          <h2 class="section-title">ประเภทอุปกรณ์ปรับอากาศ</h2>
          <p class="section-subtitle">คู่มือเลือกซื้ออุปกรณ์กระจายลมเย็นสำหรับระบบปรับอากาศ</p>
        </div>
        
        <div class="grid md:grid-cols-2 gap-8">
          <!-- Air Diffuser (หัวจ่ายแอร์) -->
          <div class="card-hover p-6 bg-gray-50 rounded-xl">
            <div class="flex items-center gap-3 mb-4">
              <div class="w-12 h-12 bg-primary-100 rounded-lg flex items-center justify-center">
                <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.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>
              <h3 class="text-xl font-bold text-secondary-900">หัวจ่ายแอร์ (Air Diffuser)</h3>
            </div>
            <p class="text-secondary-600 mb-4">
              หัวจ่ายแอร์ หรือ Air Diffuser เป็นอุปกรณ์ที่ใช้กระจายลมเย็นจากระบบปรับอากาศให้กระจายอย่างสม่ำเสมอทั่วทั้งห้อง มีรูปแบบหลากหลาย เช่น หัวจ่ายแบบ Ball Jet, หัวจ่ายแบบ Jet Nozzle และหัวจ่ายแบบ Square Diffuser
            </p>
            <ul class="space-y-2 text-secondary-600">
              <li class="flex items-center gap-2">
                <svg class="w-4 h-4 text-primary-600 flex-shrink-0" fill="currentColor" viewBox="0 0 20 20">
                  <path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
                </svg>
                <span>กระจายลมเย็นอย่างสม่ำเสมอ</span>
              </li>
              <li class="flex items-center gap-2">
                <svg class="w-4 h-4 text-primary-600 flex-shrink-0" fill="currentColor" viewBox="0 0 20 20">
                  <path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
                </svg>
                <span>ปรับทิศทางลมได้ตามต้องการ</span>
              </li>
              <li class="flex items-center gap-2">
                <svg class="w-4 h-4 text-primary-600 flex-shrink-0" fill="currentColor" viewBox="0 0 20 20">
                  <path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
                </svg>
                <span>ติดตั้งง่าย ใช้งานได้ทันที</span>
              </li>
            </ul>
          </div>
          
          <!-- Grille (กริลแอร์) -->
          <div class="card-hover p-6 bg-gray-50 rounded-xl">
            <div class="flex items-center gap-3 mb-4">
              <div class="w-12 h-12 bg-primary-100 rounded-lg flex items-center justify-center">
                <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 5a1 1 0 011-1h14a1 1 0 011 1v2a1 1 0 01-1 1H5a1 1 0 01-1-1V5zM4 13a1 1 0 011-1h6a1 1 0 011 1v6a1 1 0 01-1 1H5a1 1 0 01-1-1v-6zM16 13a1 1 0 011-1h2a1 1 0 011 1v6a1 1 0 01-1 1h-2a1 1 0 01-1-1v-6z" />
                </svg>
              </div>
              <h3 class="text-xl font-bold text-secondary-900">กริลแอร์ (Air Grille)</h3>
            </div>
            <p class="text-secondary-600 mb-4">
              กริลแอร์ หรือ Air Grille เป็นอุปกรณ์ติดตั้งที่ช่องลมออกของระบบปรับอากาศ ทำหน้าที่ควบคุมทิศทางและปริมาณลมที่ออกมา มีทั้งแบบ Fixed Grille และ Adjustable Grille
            </p>
            <ul class="space-y-2 text-secondary-600">
              <li class="flex items-center gap-2">
                <svg class="w-4 h-4 text-primary-600 flex-shrink-0" fill="currentColor" viewBox="0 0 20 20">
                  <path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
                </svg>
                <span>ควบคุมทิศทางลมได้</span>
              </li>
              <li class="flex items-center gap-2">
                <svg class="w-4 h-4 text-primary-600 flex-shrink-0" fill="currentColor" viewBox="0 0 20 20">
                  <path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
                </svg>
                <span>วัสดุคุณภาพสูง ทนทาน</span>
              </li>
              <li class="flex items-center gap-2">
                <svg class="w-4 h-4 text-primary-600 flex-shrink-0" fill="currentColor" viewBox="0 0 20 20">
                  <path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
                </svg>
                <span>ออกแบบสวยงาม ทันสมัย</span>
              </li>
            </ul>
          </div>
          
          <!-- Register -->
          <div class="card-hover p-6 bg-gray-50 rounded-xl">
            <div class="flex items-center gap-3 mb-4">
              <div class="w-12 h-12 bg-primary-100 rounded-lg flex items-center justify-center">
                <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 6V4m0 2a2 2 0 100 4m0-4a2 2 0 110 4m-6 8a2 2 0 100-4m0 4a2 2 0 110-4m0 4v2m0-6V4m6 6v10m6-2a2 2 0 100-4m0 4a2 2 0 110-4m0 4v2m0-6V4" />
                </svg>
              </div>
              <h3 class="text-xl font-bold text-secondary-900">รีจิสเตอร์ (Register)</h3>
            </div>
            <p class="text-secondary-600 mb-4">
              รีจิสเตอร์ (Register) คืออุปกรณ์ที่มีทั้งส่วนของ Grille และ Damper รวมกัน สามารถปรับการไหลของลมและปิด-เปิดช่องลมได้ มักใช้ในระบบที่ต้องการควบคุมลมเป็นพิเศษ
            </p>
            <ul class="space-y-2 text-secondary-600">
              <li class="flex items-center gap-2">
                <svg class="w-4 h-4 text-primary-600 flex-shrink-0" fill="currentColor" viewBox="0 0 20 20">
                  <path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
                </svg>
                <span>ปรับปริมาณลมได้</span>
              </li>
              <li class="flex items-center gap-2">
                <svg class="w-4 h-4 text-primary-600 flex-shrink-0" fill="currentColor" viewBox="0 0 20 20">
                  <path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
                </svg>
                <span>ปิด-เปิดช่องลมได้</span>
              </li>
              <li class="flex items-center gap-2">
                <svg class="w-4 h-4 text-primary-600 flex-shrink-0" fill="currentColor" viewBox="0 0 20 20">
                  <path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
                </svg>
                <span>เหมาะสำหรับห้องที่ต้องการควบคุมอุณหภูมิเฉพาะส่วน</span>
              </li>
            </ul>
          </div>
          
          <!-- Damper -->
          <div class="card-hover p-6 bg-gray-50 rounded-xl">
            <div class="flex items-center gap-3 mb-4">
              <div class="w-12 h-12 bg-primary-100 rounded-lg flex items-center justify-center">
                <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="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-xl font-bold text-secondary-900">แดมเปอร์ (Damper)</h3>
            </div>
            <p class="text-secondary-600 mb-4">
              แดมเปอร์ (Damper) เป็นอุปกรณ์ควบคุมการไหลของอากาศในท่อลม ช่วยปรับและควบคุมปริมาณลมที่ไหลในแต่ละพื้นที่ของระบบปรับอากาศ มีทั้งแบบ Manual และ Automatic
            </p>
            <ul class="space-y-2 text-secondary-600">
              <li class="flex items-center gap-2">
                <svg class="w-4 h-4 text-primary-600 flex-shrink-0" fill="currentColor" viewBox="0 0 20 20">
                  <path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
                </svg>
                <span>ควบคุมปริมาณลมในแต่ละโซน</span>
              </li>
              <li class="flex items-center gap-2">
                <svg class="w-4 h-4 text-primary-600 flex-shrink-0" fill="currentColor" viewBox="0 0 20 20">
                  <path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
                </svg>
                <span>ปรับสมดุลระบบลมได้</span>
              </li>
              <li class="flex items-center gap-2">
                <svg class="w-4 h-4 text-primary-600 flex-shrink-0" fill="currentColor" viewBox="0 0 20 20">
                  <path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
                </svg>
                <span>มีทั้งแบบ Manual และ Automatic</span>
              </li>
            </ul>
          </div>
        </div>
      </div>
    </section>
    
    <!-- Product Selection Guide -->
    <section class="section bg-gray-50">
      <div class="container-custom">
        <div class="text-center mb-12">
          <h2 class="section-title">คู่มือเลือกอุปกรณ์ปรับอากาศ</h2>
          <p class="section-subtitle">วิธีเลือกอุปกรณ์กระจายลมเย็นที่เหมาะสมกับการใช้งาน</p>
        </div>
        
        <div class="grid md:grid-cols-3 gap-8">
          <!-- Step 1 -->
          <div class="text-center">
            <div class="w-16 h-16 bg-accent-500 text-white rounded-full flex items-center justify-center text-2xl font-bold mx-auto mb-4">
              1
            </div>
            <h3 class="text-xl font-bold text-secondary-900 mb-3">พิจารณาขนาดห้อง</h3>
            <p class="text-secondary-600">
              วัดขนาดพื้นที่ใช้งาน ความสูงเพดาน และปริมาณลมที่ต้องการ (CFM) เพื่อเลือกขนาดอุปกรณ์ที่เหมาะสม
            </p>
          </div>
          
          <!-- Step 2 -->
          <div class="text-center">
            <div class="w-16 h-16 bg-accent-500 text-white rounded-full flex items-center justify-center text-2xl font-bold mx-auto mb-4">
              2
            </div>
            <h3 class="text-xl font-bold text-secondary-900 mb-3">เลือกประเภทอุปกรณ์</h3>
            <p class="text-secondary-600">
              เลือกประเภทตามการใช้งาน หัวจ่ายแอร์สำหรับการกระจายลมทั่วไป กริลแอร์สำหรับติดตั้งผนัง หรือแดมเปอร์สำหรับควบคุมลม
            </p>
          </div>
          
          <!-- Step 3 -->
          <div class="text-center">
            <div class="w-16 h-16 bg-accent-500 text-white rounded-full flex items-center justify-center text-2xl font-bold mx-auto mb-4">
              3
            </div>
            <h3 class="text-xl font-bold text-secondary-900 mb-3">ตรวจสอบวัสดุและคุณภาพ</h3>
            <p class="text-secondary-600">
              เลือกอุปกรณ์ที่ผลิตจากวัสดุคุณภาพสูง ทนต่อการกัดกร่อน และมีความแข็งแรงทนทาน เหมาะสำหรับการใช้งานระยะยาว
            </p>
          </div>
        </div>
        
        <div class="mt-12 p-6 bg-white rounded-xl border border-gray-200">
          <h3 class="text-xl font-bold text-secondary-900 mb-4 text-center">ปัจจัยสำคัญในการเลือกซื้อ</h3>
          <div class="grid md:grid-cols-2 lg:grid-cols-4 gap-4">
            <div class="flex items-start gap-3">
              <svg class="w-5 h-5 text-primary-600 flex-shrink-0 mt-0.5" fill="currentColor" viewBox="0 0 20 20">
                <path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
              </svg>
              <div>
                <h4 class="font-semibold text-secondary-900">ขนาดท่อลม</h4>
                <p class="text-sm text-secondary-600">ต้องตรงกับขนาดท่อลมที่ติดตั้ง</p>
              </div>
            </div>
            <div class="flex items-start gap-3">
              <svg class="w-5 h-5 text-primary-600 flex-shrink-0 mt-0.5" fill="currentColor" viewBox="0 0 20 20">
                <path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
              </svg>
              <div>
                <h4 class="font-semibold text-secondary-900">อัตราการไหลของลม</h4>
                <p class="text-sm text-secondary-600">ตรวจสอบ CFM ที่เหมาะสมกับพื้นที่</p>
              </div>
            </div>
            <div class="flex items-start gap-3">
              <svg class="w-5 h-5 text-primary-600 flex-shrink-0 mt-0.5" fill="currentColor" viewBox="0 0 20 20">
                <path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
              </svg>
              <div>
                <h4 class="font-semibold text-secondary-900">ระดับเสียง</h4>
                <p class="text-sm text-secondary-600">เลือกอุปกรณ์ที่สร้างเสียงรบกวนต่ำ</p>
              </div>
            </div>
            <div class="flex items-start gap-3">
              <svg class="w-5 h-5 text-primary-600 flex-shrink-0 mt-0.5" fill="currentColor" viewBox="0 0 20 20">
                <path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
              </svg>
              <div>
                <h4 class="font-semibold text-secondary-900">การบำรุงรักษา</h4>
                <p class="text-sm text-secondary-600">เลือกที่ทำความสะอาดง่าย</p>
              </div>
            </div>
          </div>
        </div>
      </div>
    </section>
    
    <!-- FAQ Section -->
    <section class="section bg-white">
      <div class="container-custom">
        <div class="text-center mb-12">
          <h2 class="section-title">คำถามที่พบบ่อยเกี่ยวกับอุปกรณ์ปรับอากาศ</h2>
          <p class="section-subtitle">คำตอบสำหรับคำถามที่ลูกค้ามักสอบถามเกี่ยวกับอุปกรณ์กระจายลมเย็น</p>
        </div>
        
        <div class="max-w-3xl mx-auto space-y-4">
          <!-- FAQ 1 -->
          <div class="border border-gray-200 rounded-xl overflow-hidden">
            <details class="group">
              <summary class="flex items-center justify-between p-5 cursor-pointer bg-gray-50 hover:bg-gray-100 transition-colors">
                <h3 class="font-semibold text-secondary-900 text-lg">หัวจ่ายแอร์แบบไหนดีที่สุดสำหรับห้องปรับอากาศ?</h3>
                <svg class="w-5 h-5 text-secondary-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-5 bg-white border-t border-gray-200">
                <p class="text-secondary-600">
                  หัวจ่ายแอร์แบบ Ball Jet เป็นที่นิยมที่สุดสำหรับห้องปรับอากาศทั่วไป เพราะสามารถปรับทิศทางลมได้หลายทิศทาง และกระจายลมเย็นอย่างสม่ำเสมอ สำหรับห้องที่ต้องการลมเย็นเร็ว ควรเลือก Jet Nozzle ที่มีความเร็วลมสูงกว่า
                </p>
              </div>
            </details>
          </div>
          
          <!-- FAQ 2 -->
          <div class="border border-gray-200 rounded-xl overflow-hidden">
            <details class="group">
              <summary class="flex items-center justify-between p-5 cursor-pointer bg-gray-50 hover:bg-gray-100 transition-colors">
                <h3 class="font-semibold text-secondary-900 text-lg">ควรเลือกขนาดอุปกรณ์ปรับอากาศอย่างไร?</h3>
                <svg class="w-5 h-5 text-secondary-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-5 bg-white border-t border-gray-200">
                <p class="text-secondary-600">
                  การเลือกขนาดต้องพิจารณาจากขนาดพื้นที่ ความสูงเพดาน และกำลัง BTU ของเครื่องปรับอากาศ โดยทั่วไปหัวจ่ายแอร์ควรมีขนาดใหญ่กว่าท่อลมที่เชื่อมต่อประมาณ 1-2 นิ้ว เพื่อให้ลมไหลผ่านได้สะดวก ควรปรึกษาผู้เชี่ยวชาญเพื่อการคำนวณที่แม่นยำ
                </p>
              </div>
            </details>
          </div>
          
          <!-- FAQ 3 -->
          <div class="border border-gray-200 rounded-xl overflow-hidden">
            <details class="group">
              <summary class="flex items-center justify-between p-5 cursor-pointer bg-gray-50 hover:bg-gray-100 transition-colors">
                <h3 class="font-semibold text-secondary-900 text-lg">อุปกรณ์ปรับอากาศต้องบำรุงรักษาบ่อยแค่ไหน?</h3>
                <svg class="w-5 h-5 text-secondary-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-5 bg-white border-t border-gray-200">
                <p class="text-secondary-600">
                  ควรทำความสะอาดอุปกรณ์ปรับอากาศอย่างน้อย 3-4 ครั้งต่อปี โดยเฉพาะในช่วงฤดูร้อนที่ใช้งานหนัก การทำความสะอาดรวมถึงการถอดล้าง เป่าลมออก และตรวจสอบสภาพการทำงาน หากพบว่าลมออกน้อยลงหรือมีเสียงผิดปกติ ควรตรวจสอบและซ่อมแซมทันที
                </p>
              </div>
            </details>
          </div>
          
          <!-- FAQ 4 -->
          <div class="border border-gray-200 rounded-xl overflow-hidden">
            <details class="group">
              <summary class="flex items-center justify-between p-5 cursor-pointer bg-gray-50 hover:bg-gray-100 transition-colors">
                <h3 class="font-semibold text-secondary-900 text-lg">กริลแอร์และหัวจ่ายแอร์ต่างกันอย่างไร?</h3>
                <svg class="w-5 h-5 text-secondary-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-5 bg-white border-t border-gray-200">
                <p class="text-secondary-600">
                  กริลแอร์ (Air Grille) เป็นอุปกรณ์ที่ติดตั้งที่ช่องลมออกเพื่อควบคุมทิศทางลม เน้นการตกแต่งและความสวยงาม ส่วนหัวจ่ายแอร์ (Air Diffuser) เน้นการกระจายลมให้ทั่วถึง มักติดตั้งที่เพดานหรือผนังบน การเลือกขึ้นอยู่กับตำแหน่งที่ติดตั้งและวัตถุประสงค์การใช้งาน
                </p>
              </div>
            </details>
          </div>
          
          <!-- FAQ 5 -->
          <div class="border border-gray-200 rounded-xl overflow-hidden">
            <details class="group">
              <summary class="flex items-center justify-between p-5 cursor-pointer bg-gray-50 hover:bg-gray-100 transition-colors">
                <h3 class="font-semibold text-secondary-900 text-lg">อุปกรณ์ปรับอากาศช่วยประหยัดพลังงานได้อย่างไร?</h3>
                <svg class="w-5 h-5 text-secondary-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-5 bg-white border-t border-gray-200">
                <p class="text-secondary-600">
                  อุปกรณ์ปรับอากาศที่มีคุณภาพช่วยให้ลมเย็นกระจายตัวได้ดี ทำให้เครื่องปรับอากาศทำงานน้อยลงและควบคุมอุณหภูมิได้แม่นยำ การใช้แดมเปอร์ช่วยปรับการไหลของลมในแต่ละโซน ทำให้ไม่ต้องเปิดเครื่องปรับอากาศทั้งหมด ช่วยประหยัดพลังงานได้มากถึง 20-30%
                </p>
              </div>
            </details>
          </div>
        </div>
      </div>
    </section>
    
    <!-- Contact CTA -->
    <section class="cta-gradient py-16">
      <div class="container-custom text-center">
        <h2 class="text-2xl sm:text-3xl font-bold text-white 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/~dealplustech" target="_blank" class="btn-white flex items-center gap-2">
            <span>แชท</span>
          </a>
          <a href="tel:0905551415" class="btn-white">
            โทร 090-555-1415
          </a>
        </div>
      </div>
    </section>
  </main>
  
  <Footer slot="footer" />
</BaseLayout>