---
import Layout from '../layouts/Layout.astro'
---

<Layout title="พัฒนาแอปพลิเคชัน | MoreminiMore">
  <section class="relative py-32 bg-gradient-to-br from-purple-50 to-pink-50 overflow-hidden">
    <div class="absolute inset-0">
      <img src="/images/hero/strategy-ai.png" alt="App Development" class="w-full h-full object-cover opacity-10" loading="eager" />
    </div>
    <div class="container mx-auto px-4 relative z-10">
      <div class="max-w-4xl mx-auto text-center">
        <div class="text-8xl mb-6">📱</div>
        <h1 class="text-5xl md:text-7xl font-bold mb-8 text-secondary">พัฒนาแอปพลิเคชัน</h1>
        <p class="text-2xl text-gray-600 mb-10">แอปมือถือ iOS และ Android ใช้งานง่าย ประสิทธิภาพสูง</p>
        <div class="flex flex-col sm:flex-row gap-5 justify-center">
          <a href="tel:0809955945" class="btn-accent text-xl shadow-xl">📞 080-995-5945</a>
          <a href="https://line.me/" target="_blank" rel="noopener noreferrer" class="btn-secondary text-xl shadow-xl">💬 เพิ่ม Line</a>
        </div>
      </div>
    </div>
  </section>

  <section class="py-20 bg-white">
    <div class="container mx-auto px-4 max-w-5xl">
      <h2 class="text-4xl font-bold mb-8 text-center text-secondary">บริการพัฒนาแอป</h2>
      <div class="grid md:grid-cols-2 gap-8 mb-12">
        <div class="glass p-8 rounded-2xl border border-gray-200 card-hover">
          <div class="text-5xl mb-4">🍎</div>
          <h3 class="text-2xl font-bold mb-3">iOS App</h3>
          <p class="text-gray-600">แอป iPhone และ iPad_native performance</p>
        </div>
        <div class="glass p-8 rounded-2xl border border-gray-200 card-hover">
          <div class="text-5xl mb-4">🤖</div>
          <h3 class="text-2xl font-bold mb-3">Android App</h3>
          <p class="text-gray-600">แอป Android ครอบคลุมทุกอุปกรณ์</p>
        </div>
      </div>
      <div class="text-center">
        <a href="tel:0809955945" class="btn-accent text-xl shadow-xl inline-block">📞 ปรึกษาฟรี</a>
      </div>
    </div>
  </section>
</Layout>
