f47949c4b3
Per user spec, restructured home page:
1. Hero copy (X1 + X2):
- badge: "เราจะช่วยคุณเพิ่มกำไร"
- title: "เราช่วยวางระบบงาน และใช้สถิติวางกลยุทธ์ทางการตลาด"
- subtitle unchanged
- replaced old "เว็บขายไม่ได้ โฆษณาเปลือง..." headline
2. Hero 2-column layout (text | pain stack):
- Left 50%: badge, title, accent line, subtitle, CTA
- Right 50%: 4 pain cards in vertical stack with colored
surfaces (yellow, purple-soft, mint, teal) — staggered
fade-in animation, each card has eyebrow "คุณกำลังเจอปัญหา"
+ pain question
- Pain cards on right: "ยิ่งขาย กำไรยิ่งลด?", "มีเว็บไซต์
เหมือนไม่มี?", "พนักงานทำงานได้น้อยกว่าที่ต้องการ?",
"เอา AI มาให้ใช้ แต่งานไม่ได้มากขึ้นตามที่คิด?"
- Responsive: stacks vertically on mobile (<1024px)
- Pain card surfaces match bento tile vocabulary
3. Services section: 4x1 → 2x2 layout:
- Each tile now span 6 (6+6 per row, 2 rows)
- 4 tiles total: AI Consult (yellow), Automation (purple-soft),
Marketing (mint), Web (soft)
4. Section title (X2):
- "เริ่มจากอันที่ปวดที่สุด ค่อยขยายไปอันอื่น"
→ "เลือกบริการที่ตรงกับปัญหาของคุณ"
Co-Authored-By: Claude <noreply@anthropic.com>
Astro Starter Kit: Minimal
npm create astro@latest -- --template minimal
🧑🚀 Seasoned astronaut? Delete this file. Have fun!
🚀 Project Structure
Inside of your Astro project, you'll see the following folders and files:
/
├── public/
├── src/
│ └── pages/
│ └── index.astro
└── package.json
Astro looks for .astro or .md files in the src/pages/ directory. Each page is exposed as a route based on its file name.
There's nothing special about src/components/, but that's where we like to put any Astro/React/Vue/Svelte/Preact components.
Any static assets, like images, can be placed in the public/ directory.
🧞 Commands
All commands are run from the root of the project, from a terminal:
| Command | Action |
|---|---|
npm install |
Installs dependencies |
npm run dev |
Starts local dev server at localhost:4321 |
npm run build |
Build your production site to ./dist/ |
npm run preview |
Preview your build locally, before deploying |
npm run astro ... |
Run CLI commands like astro add, astro check |
npm run astro -- --help |
Get help using the Astro CLI |
👀 Want to learn more?
Feel free to check our documentation or jump into our Discord server.