Initial commit: Next.js + Payload CMS for moreminimore-redesign

- Next.js 16 App Router + Payload CMS 3.82
- PostgreSQL via @payloadcms/db-postgres
- All pages: Home, Services (4), About, Portfolio, Blog, Contact, FAQ
- PDPA: CookieBanner, ConsentLogs API, Privacy Policy, Terms, Cookie Policy
- SEO: sitemap, robots.txt, metadata exports, JSON-LD
This commit is contained in:
Kunthawat
2026-04-11 08:43:08 +07:00
commit 57185e174d
51 changed files with 6714 additions and 0 deletions

View File

@@ -0,0 +1,31 @@
import type { Metadata } from 'next'
export const metadata: Metadata = {
title: 'บริการ Tech Consult | MoreminiMore - คำปรึกษาระบบ IT และ Cloud',
description: 'บริการให้คำปรึกษาระบบ IT และ Cloud สำหรับธุรกิจ SMEs เลือกเครื่องมือที่เหมาะกับงบประมาณ',
keywords: 'Tech Consult, ที่ปรึกษา IT, Cloud, Infrastructure, SMEs ไทย',
openGraph: {
title: 'บริการ Tech Consult | MoreminiMore - คำปรึกษาระบบ IT และ Cloud',
description: 'บริการให้คำปรึกษาระบบ IT และ Cloud สำหรับธุรกิจ SMEs เลือกเครื่องมือที่เหมาะกับงบประมาณ',
url: 'https://moreminimore.com/services/tech-consult',
siteName: 'MoreminiMore',
locale: 'th_TH',
type: 'website',
},
twitter: {
card: 'summary_large_image',
title: 'บริการ Tech Consult | MoreminiMore - คำปรึกษาระบบ IT และ Cloud',
description: 'บริการให้คำปรึกษาระบบ IT และ Cloud สำหรับธุรกิจ SMEs เลือกเครื่องมือที่เหมาะกับงบประมาณ',
},
alternates: {
canonical: 'https://moreminimore.com/services/tech-consult',
},
}
export default function TechConsultLayout({
children,
}: {
children: React.ReactNode
}) {
return children
}

View File

@@ -0,0 +1,600 @@
'use client'
import { useEffect } from 'react'
export default function TechConsultPage() {
useEffect(() => {
const observer = new IntersectionObserver(
(entries) => {
entries.forEach((entry) => {
if (entry.isIntersecting) {
entry.target.classList.add('visible')
}
})
},
{ threshold: 0.1, rootMargin: '0px 0px -50px 0px' }
)
document.querySelectorAll('.reveal, .reveal-left, .reveal-right').forEach((el) => {
observer.observe(el)
})
return () => observer.disconnect()
}, [])
return (
<>
{/* Schema.org Structured Data */}
<script
type="application/ld+json"
dangerouslySetInnerHTML={{
__html: JSON.stringify({
"@context": "https://schema.org",
"@type": "LocalBusiness",
"name": "MoreminiMore Co.,Ltd.",
"description": "บริการที่ปรึกษา AI ครบวงจร สำหรับธุรกิจไทย",
"telephone": "+668****5945",
"email": "contact@moreminimore.com",
"url": "https://www.moreminimore.com/services/tech-consult",
"address": {
"@type": "PostalAddress",
"streetAddress": "53 หมู่ 1 ต.บ้านแพ้ว",
"addressLocality": "บ้านแพ้ว",
"addressRegion": "สมุทรสาคร",
"postalCode": "74120",
"addressCountry": "TH"
},
"geo": {
"@type": "GeoCoordinates",
"latitude": 13.5497,
"longitude": 100.4167
},
"openingHours": "Mo-Fr 09:00-18:00",
"priceRange": "$$",
"serviceType": ["Tech Consult", "AI Consulting", "Marketing Automation", "AI Hardware"]
})
}}
/>
{/* FAQPage Schema */}
<script
type="application/ld+json"
dangerouslySetInnerHTML={{
__html: JSON.stringify({
"@context": "https://schema.org",
"@type": "FAQPage",
"mainEntity": [
{
"@type": "Question",
"name": "Tech Consult ต่างจากการซื้อ Software ทั่วไปอย่างไร?",
"acceptedAnswer": {
"@type": "Answer",
"text": "เราให้คำปรึกษาแบบแนวทางการแก้ปัญหา ไม่ใช่แค่ขาย Software เราจะวิเคราะห์ธุรกิจของคุณก่อน จากนั้นจึงแนะนำ Solution ที่เหมาะสม ทั้ง Free Tools, Paid Software หรือ Custom Development"
}
},
{
"@type": "Question",
"name": "AI Hardware Consulting ช่วยอะไรได้บ้าง?",
"acceptedAnswer": {
"@type": "Answer",
"text": "เราช่วยแนะนำสเปค Server/GPU ที่เหมาะสมกับการใช้งาน AI ของคุณ, ช่วยเปรียบเทียบราคาและทางเลือก, ติดตั้งระบบ On-premise และดูแลและบำรุงรักษา ช่วยประหยัดค่าใช้จ่ายที่ไม่จำเป็น"
}
},
{
"@type": "Question",
"name": "ต้องมีความรู้ด้านเทคนิคไหม?",
"acceptedAnswer": {
"@type": "Answer",
"text": "ไม่ต้องมีความรู้ด้านเทคนิคเลย! เราดูแลทุกอย่างตั้งแต่ต้นจนจบ คุณเพียงแค่ให้ข้อมูลธุรกิจและดูผลลัพธ์ เราจะอธิบายให้เข้าใจง่าย ไม่ใช้ศัพท์เทคนิคมากเกินไป"
}
},
{
"@type": "Question",
"name": "ค่าใช้จ่ายในการปรึกษาเป็นอย่างไร?",
"acceptedAnswer": {
"@type": "Answer",
"text": "เราให้คำปรึกษาเบื้องต้นฟรี! สำหรับการปรึกษาเชิงลึกและ Implementation จะคิดตามความซับซ้อนของโปรเจกต์ เราจะแจ้งราคาก่อนเริ่มงานเสมอ ไม่มีค่าใช้จ่ายที่ซ่อนไว้"
}
}
]
})
}}
/>
{/* Hero Section - Blue/Teal Theme */}
<section id="hero" class="relative overflow-hidden min-h-[50vh] flex items-center">
{/* Animated Background - Blue/Teal */}
<div class="absolute inset-0 bg-gradient-to-br from-teal-400 via-teal-500 to-blue-600">
{/* Floating Shapes */}
<div class="absolute top-20 left-10 w-72 h-72 bg-white/20 rounded-full blur-3xl animate-float-1"></div>
<div class="absolute bottom-20 right-10 w-96 h-96 bg-teal-300/20 rounded-full blur-3xl animate-float-2"></div>
<div class="absolute top-1/3 left-1/4 w-48 h-48 bg-white/10 rounded-full blur-2xl animate-float-3"></div>
<div class="absolute bottom-1/3 right-1/4 w-64 h-64 bg-blue-200/20 rounded-full blur-2xl animate-float-1" style={{ animationDelay: '0.75s' }}></div>
</div>
{/* Floating dots */}
<div class="absolute inset-0 overflow-hidden pointer-events-none">
<div class="absolute top-1/4 left-[10%] w-3 h-3 bg-white/20 rounded-full animate-float-dot-1"></div>
<div class="absolute top-1/3 left-[80%] w-2 h-2 bg-white/20 rounded-full animate-float-dot-2"></div>
<div class="absolute top-2/3 left-[20%] w-4 h-4 bg-white/20 rounded-full animate-float-dot-3"></div>
<div class="absolute bottom-1/4 left-[70%] w-2 h-2 bg-white/20 rounded-full animate-float-dot-1" style={{ animationDelay: '1s' }}></div>
<div class="absolute top-1/2 left-[40%] w-2 h-2 bg-white/20 rounded-full animate-float-dot-2" style={{ animationDelay: '0.5s' }}></div>
<div class="absolute bottom-1/3 left-[85%] w-3 h-3 bg-white/20 rounded-full animate-float-dot-3" style={{ animationDelay: '1.5s' }}></div>
</div>
{/* Grid Pattern */}
<div class="absolute inset-0 opacity-[0.03]" style={{ backgroundImage: 'linear-gradient(white 1px, transparent 1px), linear-gradient(90deg, white 1px, transparent 1px)', backgroundSize: '50px 50px' }}></div>
<div class="container mx-auto px-4 relative z-10 py-16">
<div class="grid lg:grid-cols-2 gap-12 items-center max-w-6xl mx-auto">
{/* Left: Text Content */}
<div class="text-center lg:text-left">
{/* Badge */}
<div class="inline-flex items-center gap-2 bg-white/20 backdrop-blur-sm px-4 py-2 rounded-full mb-6 animate-fade-in">
<span class="w-2 h-2 bg-teal-300 rounded-full animate-pulse"></span>
<span class="text-sm font-medium text-white/90"> AI </span>
</div>
{/* Main Headline */}
<h1 class="text-4xl md:text-5xl lg:text-6xl font-bold mb-6 text-white leading-tight animate-fade-in-up" style={{ animationDelay: '0.1s' }}>
AI<br/>
<span class="text-white"></span><br/>
</h1>
{/* Subheadline */}
<p class="text-lg md:text-xl text-white/80 mb-10 max-w-2xl mx-auto lg:mx-0 leading-relaxed animate-fade-in-up" style={{ animationDelay: '0.2s' }}>
Marketing Automation, AI Automation<br/>
AI Hardware
</p>
{/* CTAs */}
<div class="flex flex-col sm:flex-row gap-4 justify-center lg:justify-start items-center animate-fade-in-up" style={{ animationDelay: '0.3s' }}>
<a href="tel:0809955945" class="group bg-white text-black px-8 py-4 rounded-full font-bold text-lg hover:bg-gray-100 transition-all duration-300 hover:scale-105 shadow-2xl hover:shadow-3xl flex items-center gap-3">
<svg class="w-5 h-5 group-hover:animate-bounce" fill="currentColor" viewBox="0 0 24 24">
<path d="M20 15.5c-1.25 0-2.45-.2-3.57-.57-.35-.11-.74-.03-1.02.24l-2.2 2.2c-2.83-1.44-5.15-3.75-6.59-6.59l2.2-2.21c.28-.26.36-.65.25-1C8.7 6.45 8.5 5.25 8.5 4c0-.55-.45-1-1-1H4c-.55 0-1 .45-1 1 0 9.39 7.61 17 17 17 .55 0 1-.45 1-1v-3.5c0-.55-.45-1-1-1z"/>
</svg>
</a>
<a href="https://line.me/ti/p/~@539hdlul" target="_blank" rel="noopener noreferrer" class="group bg-black/20 backdrop-blur-sm text-white border-2 border-white/30 px-8 py-4 rounded-full font-bold text-lg hover:bg-white hover:text-black transition-all duration-300 hover:scale-105 shadow-2xl hover:shadow-3xl flex items-center gap-3">
<img src="/icons/social/line.svg" alt="LINE" class="w-5 h-5 group-hover:animate-bounce" />
</a>
</div>
{/* Trust Badges */}
<div class="mt-10 pt-6 border-t border-white/20 animate-fade-in-up" style={{ animationDelay: '0.4s' }}>
<div class="flex flex-wrap justify-center lg:justify-start gap-6 text-white/80 text-sm">
<span class="flex items-center gap-2">
<svg class="w-4 h-4 text-teal-300" fill="currentColor" viewBox="0 0 24 24"><path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"/></svg>
</span>
<span class="flex items-center gap-2">
<svg class="w-4 h-4 text-teal-300" fill="currentColor" viewBox="0 0 24 24"><path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"/></svg>
</span>
<span class="flex items-center gap-2">
<svg class="w-4 h-4 text-teal-300" fill="currentColor" viewBox="0 0 24 24"><path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"/></svg>
</span>
</div>
</div>
</div>
{/* Right: Hero Image */}
<div class="reveal scale">
<img
src="/images/hero/tech-consult-hero.jpg"
alt="ที่ปรึกษา AI สำหรับธุรกิจไทย - บริการให้คำปรึกษาด้าน Marketing Automation, AI Automation และ AI Hardware"
class="w-full h-auto rounded-2xl shadow-2xl"
loading="eager"
/>
</div>
</div>
</div>
</section>
{/* Services Section */}
<section class="reveal py-20 bg-gradient-to-b from-gray-50 to-white">
<div class="container mx-auto px-4 max-w-6xl">
<h2 class="text-3xl md:text-4xl font-bold mb-4 text-center text-gray-900">
</h2>
<p class="text-lg text-gray-600 text-center mb-16 max-w-2xl mx-auto">
AI
</p>
<div class="grid md:grid-cols-2 lg:grid-cols-4 gap-8">
{/* Marketing Automation */}
<div class="group bg-white rounded-2xl p-8 shadow-lg hover:shadow-2xl transition-all duration-300 hover:-translate-y-2">
<div class="w-16 h-16 bg-teal-500 rounded-2xl flex items-center justify-center mb-6 group-hover:scale-110 transition-transform">
<svg class="w-8 h-8 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M11 3.055A9.001 9.001 0 1020.945 13H11V3.055z"></path>
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M20.488 9H15V3.512A9.025 9.025 0 0120.488 9z"></path>
</svg>
</div>
<h3 class="text-xl font-bold mb-3 text-gray-900">Marketing Automation</h3>
<ul class="text-gray-600 text-sm space-y-2">
<li> </li>
<li> Email Marketing </li>
<li> Chatbot </li>
<li> </li>
</ul>
</div>
{/* AI Automation */}
<div class="group bg-white rounded-2xl p-8 shadow-lg hover:shadow-2xl transition-all duration-300 hover:-translate-y-2">
<div class="w-16 h-16 bg-teal-500 rounded-2xl flex items-center justify-center mb-6 group-hover:scale-110 transition-transform">
<svg class="w-8 h-8 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M9.663 17h4.673M12 3v1m6.364 1.636l-.707.707M21 12h-1M4 12H3m3.343-5.657l-.707-.707m2.828 9.9a5 5 0 117.072 0l-.548.547A3.374 3.374 0 0014 18.469V19a2 2 0 11-4 0v-.531c0-.895-.356-1.754-.988-2.386l-.548-.547z"></path>
</svg>
</div>
<h3 class="text-xl font-bold mb-3 text-gray-900">AI Automation</h3>
<ul class="text-gray-600 text-sm space-y-2">
<li> AI </li>
<li> </li>
<li> </li>
<li> AI</li>
</ul>
</div>
{/* AI Hardware Consulting */}
<div class="group bg-white rounded-2xl p-8 shadow-lg hover:shadow-2xl transition-all duration-300 hover:-translate-y-2">
<div class="w-16 h-16 bg-teal-500 rounded-2xl flex items-center justify-center mb-6 group-hover:scale-110 transition-transform">
<svg class="w-8 h-8 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M9 3v2m6-2v2M9 19v2m6-2v2M5 9H3m2 6H3m18-6h-2m2 6h-2M7 19h10a2 2 0 002-2V7a2 2 0 00-2-2H7a2 2 0 00-2 2v10a2 2 0 002 2zM9 9h6v6H9V9z"></path>
</svg>
</div>
<h3 class="text-xl font-bold mb-3 text-gray-900">AI Hardware</h3>
<ul class="text-gray-600 text-sm space-y-2">
<li> AI Server</li>
<li> GPU/</li>
<li> On-premise</li>
<li> </li>
</ul>
</div>
{/* รวมระบบ */}
<div class="group bg-white rounded-2xl p-8 shadow-lg hover:shadow-2xl transition-all duration-300 hover:-translate-y-2">
<div class="w-16 h-16 bg-teal-500 rounded-2xl flex items-center justify-center mb-6 group-hover:scale-110 transition-transform">
<svg class="w-8 h-8 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth="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"></path>
</svg>
</div>
<h3 class="text-xl font-bold mb-3 text-gray-900"></h3>
<ul class="text-gray-600 text-sm space-y-2">
<li> </li>
<li> API</li>
<li> Workflow</li>
<li> </li>
</ul>
</div>
</div>
</div>
</section>
{/* Why Choose Us */}
<section class="reveal py-20 bg-white">
<div class="container mx-auto px-4 max-w-6xl">
<h2 class="text-3xl md:text-4xl font-bold mb-4 text-center text-gray-900">
?
</h2>
<p class="text-lg text-gray-600 text-center mb-16 max-w-2xl mx-auto">
AI
</p>
<div class="grid md:grid-cols-3 gap-8">
{/* Benefit 1: ครบวงจร */}
<div class="group bg-white rounded-2xl p-8 shadow-lg hover:shadow-2xl transition-all duration-300 hover:-translate-y-2 border border-gray-100">
<div class="w-16 h-16 bg-teal-500 rounded-2xl flex items-center justify-center mb-6 group-hover:scale-110 transition-transform">
<svg class="w-8 h-8 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M4 6a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2H6a2 2 0 01-2-2V6zM14 6a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2V6zM4 16a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2H6a2 2 0 01-2-2v-2zM14 16a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2v-2z"></path>
</svg>
</div>
<h3 class="text-xl font-bold mb-3 text-gray-900"></h3>
<p class="text-gray-600">
Marketing Automation, AI Automation Hardware
</p>
</div>
{/* Benefit 2: ประหยัด */}
<div class="group bg-white rounded-2xl p-8 shadow-lg hover:shadow-2xl transition-all duration-300 hover:-translate-y-2 border border-gray-100">
<div class="w-16 h-16 bg-teal-500 rounded-2xl flex items-center justify-center mb-6 group-hover:scale-110 transition-transform">
<svg class="w-8 h-8 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth="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"></path>
</svg>
</div>
<h3 class="text-xl font-bold mb-3 text-gray-900"></h3>
<p class="text-gray-600">
</p>
</div>
{/* Benefit 3: ทำงานด้วยกัน */}
<div class="group bg-white rounded-2xl p-8 shadow-lg hover:shadow-2xl transition-all duration-300 hover:-translate-y-2 border border-gray-100">
<div class="w-16 h-16 bg-teal-500 rounded-2xl flex items-center justify-center mb-6 group-hover:scale-110 transition-transform">
<svg class="w-8 h-8 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth="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"></path>
</svg>
</div>
<h3 class="text-xl font-bold mb-3 text-gray-900"></h3>
<p class="text-gray-600">
implementation
</p>
</div>
</div>
</div>
</section>
{/* Case Studies */}
<section class="reveal py-20 bg-gray-50">
<div class="container mx-auto px-4 max-w-4xl">
<h2 class="text-3xl md:text-4xl font-bold mb-4 text-center text-gray-900">
</h2>
<p class="text-lg text-gray-600 text-center mb-12 max-w-2xl mx-auto">
AI
</p>
<div class="grid md:grid-cols-2 gap-6">
<div class="bg-white rounded-xl p-6 shadow-md">
<div class="flex items-center gap-3 mb-2">
<div class="w-8 h-8 bg-teal-100 rounded-lg flex items-center justify-center">
<svg class="w-4 h-4 text-teal-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M3 3h2l.4 2M7 13h10l4-8H5.4M7 13L5.4 5M7 13l-2.293 2.293c-.63.63-.184 1.707.707 1.707H17m0 0a2 2 0 100 4 2 2 0 000-4zm-8 2a2 2 0 11-4 0 2 2 0 014 0z"></path></svg>
</div>
<h3 class="font-bold text-gray-900"></h3>
</div>
<p class="text-gray-600 text-sm"> Marketing Automation + AI Chatbot </p>
</div>
<div class="bg-white rounded-xl p-6 shadow-md">
<div class="flex items-center gap-3 mb-2">
<div class="w-8 h-8 bg-teal-100 rounded-lg flex items-center justify-center">
<svg class="w-4 h-4 text-teal-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="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"></path></svg>
</div>
<h3 class="font-bold text-gray-900">/</h3>
</div>
<p class="text-gray-600 text-sm"> AI + + AI </p>
</div>
<div class="bg-white rounded-xl p-6 shadow-md">
<div class="flex items-center gap-3 mb-2">
<div class="w-8 h-8 bg-teal-100 rounded-lg flex items-center justify-center">
<svg class="w-4 h-4 text-teal-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M12 6.253v13m0-13C10.832 5.477 9.246 5 7.5 5S4.168 5.477 3 6.253v13C4.168 18.477 5.754 18 7.5 18s3.332.477 4.5 1.253m0-13C13.168 5.477 14.754 5 16.5 5c1.747 0 3.332.477 4.5 1.253v13C19.832 18.477 18.247 18 16.5 18c-1.746 0-3.332.477-4.5 1.253"></path></svg>
</div>
<h3 class="font-bold text-gray-900"></h3>
</div>
<p class="text-gray-600 text-sm"> AI Order System + Marketing Automation </p>
</div>
<div class="bg-white rounded-xl p-6 shadow-md">
<div class="flex items-center gap-3 mb-2">
<div class="w-8 h-8 bg-teal-100 rounded-lg flex items-center justify-center">
<svg class="w-4 h-4 text-teal-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M12 14l9-5-9-5-9 5 9 5z"></path><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M12 14l6.16-3.422a12.083 12.083 0 01.665 6.479A11.952 11.952 0 0012 20.055a11.952 11.952 0 00-6.824-2.998 12.078 12.078 0 01.665-6.479L12 14z"></path></svg>
</div>
<h3 class="font-bold text-gray-900">/</h3>
</div>
<p class="text-gray-600 text-sm"> AI + Chatbot + </p>
</div>
<div class="bg-white rounded-xl p-6 shadow-md">
<div class="flex items-center gap-3 mb-2">
<div class="w-8 h-8 bg-teal-100 rounded-lg flex items-center justify-center">
<svg class="w-4 h-4 text-teal-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="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"></path></svg>
</div>
<h3 class="font-bold text-gray-900"></h3>
</div>
<p class="text-gray-600 text-sm"> AI Lead Scoring + Marketing Automation + Chatbot </p>
</div>
<div class="bg-white rounded-xl p-6 shadow-md">
<div class="flex items-center gap-3 mb-2">
<div class="w-8 h-8 bg-teal-100 rounded-lg flex items-center justify-center">
<svg class="w-4 h-4 text-teal-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="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"></path></svg>
</div>
<h3 class="font-bold text-gray-900">/Manufacturing</h3>
</div>
<p class="text-gray-600 text-sm"> AI Hardware Machine Learning + Predictive Maintenance</p>
</div>
<div class="bg-white rounded-xl p-6 shadow-md">
<div class="flex items-center gap-3 mb-2">
<div class="w-8 h-8 bg-teal-100 rounded-lg flex items-center justify-center">
<svg class="w-4 h-4 text-teal-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M13 10V3L4 14h7v7l9-11h-7z"></path></svg>
</div>
<h3 class="font-bold text-gray-900">Startup/SaaS</h3>
</div>
<p class="text-gray-600 text-sm"> AI Integration + Marketing Automation + API </p>
</div>
<div class="bg-white rounded-xl p-6 shadow-md">
<div class="flex items-center gap-3 mb-2">
<div class="w-8 h-8 bg-teal-100 rounded-lg flex items-center justify-center">
<svg class="w-4 h-4 text-teal-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="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"></path></svg>
</div>
<h3 class="font-bold text-gray-900">/</h3>
</div>
<p class="text-gray-600 text-sm"> AI + Document Processing + AI Hardware Consulting</p>
</div>
<div class="bg-white rounded-xl p-6 shadow-md">
<div class="flex items-center gap-3 mb-2">
<div class="w-8 h-8 bg-teal-100 rounded-lg flex items-center justify-center">
<svg class="w-4 h-4 text-teal-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M8 7h12m0 0l-4-4m4 4l-4 4m0 6H4m0 0l4 4m-4-4l4-4"></path></svg>
</div>
<h3 class="font-bold text-gray-900"></h3>
</div>
<p class="text-gray-600 text-sm"> AI + Chatbot + AI Hardware </p>
</div>
<div class="bg-white rounded-xl p-6 shadow-md">
<div class="flex items-center gap-3 mb-2">
<div class="w-8 h-8 bg-teal-100 rounded-lg flex items-center justify-center">
<svg class="w-4 h-4 text-teal-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M7 7h.01M7 3h5c.512 0 1.024.195 1.414.586l7 7a2 2 0 010 2.828l-7 7a2 2 0 01-2.828 0l-7-7A1.994 1.994 0 013 12V7a4 4 0 014-4z"></path></svg>
</div>
<h3 class="font-bold text-gray-900">/</h3>
</div>
<p class="text-gray-600 text-sm"> AI Analytics + Marketing Automation + personalize</p>
</div>
</div>
</div>
</section>
{/* Process */}
<section class="reveal py-20 bg-white">
<div class="container mx-auto px-4 max-w-4xl">
<h2 class="text-3xl md:text-4xl font-bold mb-4 text-center text-gray-900">
</h2>
<p class="text-lg text-gray-600 text-center mb-12 max-w-2xl mx-auto">
</p>
<div class="grid md:grid-cols-4 gap-4">
<div class="text-center">
<div class="w-16 h-16 bg-teal-500 rounded-full flex items-center justify-center mx-auto mb-4 text-2xl font-bold text-white">1</div>
<h3 class="font-bold text-gray-900 mb-2"></h3>
<p class="text-sm text-gray-600"></p>
</div>
<div class="text-center">
<div class="w-16 h-16 bg-teal-500 rounded-full flex items-center justify-center mx-auto mb-4 text-2xl font-bold text-white">2</div>
<h3 class="font-bold text-gray-900 mb-2"></h3>
<p class="text-sm text-gray-600"> Solution</p>
</div>
<div class="text-center">
<div class="w-16 h-16 bg-teal-500 rounded-full flex items-center justify-center mx-auto mb-4 text-2xl font-bold text-white">3</div>
<h3 class="font-bold text-gray-900 mb-2"></h3>
<p class="text-sm text-gray-600">Implementation </p>
</div>
<div class="text-center">
<div class="w-16 h-16 bg-teal-500 rounded-full flex items-center justify-center mx-auto mb-4 text-2xl font-bold text-white">4</div>
<h3 class="font-bold text-gray-900 mb-2"></h3>
<p class="text-sm text-gray-600">Support </p>
</div>
</div>
</div>
</section>
{/* FAQ */}
<section class="reveal py-20 bg-gray-50">
<div class="container mx-auto px-4 max-w-4xl">
<h2 class="text-3xl md:text-4xl font-bold mb-4 text-center text-gray-900">
</h2>
<p class="text-lg text-gray-600 text-center mb-12 max-w-2xl mx-auto">
</p>
<div class="space-y-4">
<div class="bg-white rounded-xl shadow-sm overflow-hidden">
<details class="group">
<summary class="flex items-center justify-between p-6 cursor-pointer list-none">
<span class="font-semibold text-gray-900">Tech Consult Software ?</span>
<span class="transition group-open:rotate-180">
<svg fill="none" height="24" shapeRendering="geometricPrecision" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="1.5" viewBox="0 0 24 24" width="24"><path d="M6 9l6 6 6-6"></path></svg>
</span>
</summary>
<div class="text-gray-600 px-6 pb-6">
<p> <strong></strong> Software Solution Free Tools, Paid Software Custom Development</p>
</div>
</details>
</div>
<div class="bg-white rounded-xl shadow-sm overflow-hidden">
<details class="group">
<summary class="flex items-center justify-between p-6 cursor-pointer list-none">
<span class="font-semibold text-gray-900">AI Hardware Consulting ?</span>
<span class="transition group-open:rotate-180">
<svg fill="none" height="24" shapeRendering="geometricPrecision" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="1.5" viewBox="0 0 24 24" width="24"><path d="M6 9l6 6 6-6"></path></svg>
</span>
</summary>
<div class="text-gray-600 px-6 pb-6">
<p><strong> Server/GPU</strong> AI , , On-premise </p>
</div>
</details>
</div>
<div class="bg-white rounded-xl shadow-sm overflow-hidden">
<details class="group">
<summary class="flex items-center justify-between p-6 cursor-pointer list-none">
<span class="font-semibold text-gray-900">?</span>
<span class="transition group-open:rotate-180">
<svg fill="none" height="24" shapeRendering="geometricPrecision" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="1.5" viewBox="0 0 24 24" width="24"><path d="M6 9l6 6 6-6"></path></svg>
</span>
</summary>
<div class="text-gray-600 px-6 pb-6">
<p><strong>!</strong> </p>
</div>
</details>
</div>
<div class="bg-white rounded-xl shadow-sm overflow-hidden">
<details class="group">
<summary class="flex items-center justify-between p-6 cursor-pointer list-none">
<span class="font-semibold text-gray-900">?</span>
<span class="transition group-open:rotate-180">
<svg fill="none" height="24" shapeRendering="geometricPrecision" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="1.5" viewBox="0 0 24 24" width="24"><path d="M6 9l6 6 6-6"></path></svg>
</span>
</summary>
<div class="text-gray-600 px-6 pb-6">
<p><strong>!</strong> Implementation </p>
</div>
</details>
</div>
</div>
</div>
</section>
{/* Related Services */}
<section class="reveal py-12 bg-white border-t border-gray-100">
<div class="container mx-auto px-4 max-w-4xl text-center">
<h3 class="text-lg font-bold mb-6 text-gray-900"></h3>
<div class="flex flex-wrap justify-center gap-4">
<a href="/services/marketing-automation" class="bg-white text-gray-700 px-6 py-3 rounded-full font-medium hover:bg-gray-100 transition shadow-md flex items-center gap-2">
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"></path></svg>
Marketing Automation
</a>
<a href="/services/ai-automation" class="bg-white text-gray-700 px-6 py-3 rounded-full font-medium hover:bg-gray-100 transition shadow-md flex items-center gap-2">
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M9.663 17h4.673M12 3v1m6.364 1.636l-.707.707M21 12h-1M4 12H3m3.343-5.657l-.707-.707m2.828 9.9a5 5 0 117.072 0l-.548.547A3.374 3.374 0 0014 18.469V19a2 2 0 11-4 0v-.531c0-.895-.356-1.754-.988-2.386l-.548-.547z"></path></svg>
AI Automation
</a>
<a href="/services/web-development" class="bg-white text-gray-700 px-6 py-3 rounded-full font-medium hover:bg-gray-100 transition shadow-md flex items-center gap-2">
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M10 20l4-16m4 4l4 4-4 4M6 16l-4-4 4-4"></path></svg>
</a>
</div>
</div>
</section>
{/* CTA Section - Yellow */}
<section id="cta" class="reveal py-20 bg-[#fed400]">
<div class="container mx-auto px-4 text-center">
<h2 class="text-3xl md:text-4xl font-bold mb-6 text-black">
AI ?
</h2>
<p class="text-xl mb-8 max-w-2xl mx-auto text-gray-800">
! Solution
</p>
<div class="flex flex-col sm:flex-row gap-4 justify-center">
<a href="tel:0809955945" class="group bg-black text-[#fed400] px-8 py-4 rounded-full font-bold text-lg hover:bg-black/80 transition-all duration-300 hover:scale-105 shadow-2xl hover:shadow-3xl inline-flex items-center justify-center gap-3">
<svg class="w-5 h-5 group-hover:animate-bounce" fill="currentColor" viewBox="0 0 24 24">
<path d="M20 15.5c-1.25 0-2.45-.2-3.57-.57-.35-.11-.74-.03-1.02.24l-2.2 2.2c-2.83-1.44-5.15-3.75-6.59-6.59l2.2-2.21c.28-.26.36-.65.25-1C8.7 6.45 8.5 5.25 8.5 4c0-.55-.45-1-1-1H4c-.55 0-1 .45-1 1 0 9.39 7.61 17 17 17 .55 0 1-.45 1-1v-3.5c0-.55-.45-1-1-1z"/>
</svg>
080-995-5945
</a>
<a href="https://line.me/ti/p/~@539hdlul" target="_blank" rel="noopener noreferrer" class="group bg-white text-black px-8 py-4 rounded-full font-bold text-lg hover:bg-gray-100 transition-all duration-300 hover:scale-105 shadow-2xl hover:shadow-3xl inline-flex items-center justify-center gap-3">
<img src="/icons/social/line.svg" alt="LINE" class="w-5 h-5 group-hover:animate-bounce" />
</a>
</div>
</div>
</section>
</>
)
}
export function generateStaticParams() {
return [
{ slug: 'tech-consult' }
]
}