---
import Base from '../layouts/Base.astro';
import Navigation from '../components/Navigation.astro';
import Footer from '../components/Footer.astro';
import PageHero from '../components/PageHero.astro';
---

<Base title="นโยบายความเป็นส่วนตัว | MoreminiMore - รับทำเว็บไซต์ SEO AI Chatbot">
  <Navigation />

  <PageHero 
    badge="กฎหมาย"
    title="นโยบายความเป็นส่วนตัว"
    subtitle="มีผลบังคับใช้วันที่ 5 พฤษภาคม 2569"
  />

  <section class="section legal-section">
    <div class="container">
      <div class="legal-content">
        <p class="legal-intro">บริษัท มอร์มินิมอร์ จำกัด ให้ความสำคัญกับการคุ้มครองข้อมูลส่วนบุคคลของท่าน</p>

        <div class="legal-section">
          <h2>1. ข้อมูลส่วนบุคคลที่เราเก็บรวบรวม</h2>
          <p>ข้อมูลส่วนบุคคลที่บริษัทฯ อาจเก็บรวบรวมจากท่าน อาจรวมถึง:</p>
          <ul>
            <li><strong>ข้อมูลส่วนบุคคลทั่วไป:</strong> ชื่อ-นามสกุล ที่อยู่อีเมล หมายเลขโทรศัพท์</li>
            <li><strong>ข้อมูลการติดต่อ:</strong> ข้อมูลการติดต่อที่ท่านให้ไว้เมื่อลงทะเบียนหรือกรอกแบบฟอร์ม</li>
            <li><strong>ข้อมูลการใช้งาน:</strong> IP address, ข้อมูลการเข้าชมเว็บไซต์, คุกกี้</li>
          </ul>
        </div>

        <div class="legal-section">
          <h2>2. วัตถุประสงค์ในการเก็บรวบรวมข้อมูล</h2>
          <p>เราเก็บรวบรวมข้อมูลส่วนบุคคลเพื่อวัตถุประสงค์ดังต่อไปนี้:</p>
          <ul>
            <li>เพื่อให้บริการและดูแลลูกค้า</li>
            <li>เพื่อติดต่อสื่อสารกับท่าน</li>
            <li>เพื่อปรับปรุงการให้บริการ</li>
            <li>เพื่อปฏิบัติตามกฎหมาย</li>
          </ul>
        </div>

        <div class="legal-section">
          <h2>3. การคุ้มครองข้อมูล</h2>
          <p>เรามีมาตรการรักษาความปลอดภัยที่เหมาะสมเพื่อป้องกันการสูญหาย เข้าถึง ใช้ เปลี่ยนแปลง หรือเปิดเผยข้อมูลส่วนบุคคลโดยไม่ได้รับอนุญาต</p>
        </div>

        <div class="legal-section">
          <h2>4. สิทธิของท่าน</h2>
          <p>ท่านมีสิทธิในการเข้าถึง แก้ไข ลบ หรือระงับการใช้ข้อมูลส่วนบุคคลของท่าน กรุณาติดต่อเราผ่านช่องทางที่ระบุในเว็บไซต์</p>
        </div>
      </div>
    </div>
  </section>

  <Footer />
</Base>

<style>
  .legal-section { background: var(--color-white); }
  .legal-content { max-width: 800px; margin: 0 auto; }
  .legal-intro {
    font-size: 18px;
    color: var(--color-medium-gray);
    margin-bottom: 48px;
    line-height: 1.7;
  }
  .legal-section {
    margin-bottom: 48px;
  }
  .legal-section h2 {
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 20px;
    color: var(--color-black);
  }
  .legal-section p {
    font-size: 16px;
    color: #444;
    line-height: 1.8;
    margin-bottom: 16px;
  }
  .legal-section ul {
    margin-left: 24px;
    margin-bottom: 16px;
  }
  .legal-section li {
    font-size: 16px;
    color: #444;
    line-height: 1.8;
    margin-bottom: 8px;
  }
</style>