Alignment - AI Built for Reflective Wellbeing

A Next.js website for Alignment, an AI-supported inner-work platform that meets you where you're at.

Features

• 🎨 Modern, responsive design with Tailwind CSS
• 📱 Mobile-first approach with hamburger menu
• ✨ Smooth animations and transitions
• 🎯 Clean, accessible UI components

Tech Stack

• Framework: Next.js 14 (App Router)
• Styling: Tailwind CSS
• Icons: Lucide React
• Fonts: DM Sans & Playfair Display (Google Fonts)

Getting Started

1. Install dependencies:

npm install

2. Run the development server:

npm run dev

3. Open your browser:

Navigate to http://localhost:3000

Project Structure

src/
├── app/
│   ├── globals.css      # Global styles & Tailwind config
│   ├── layout.tsx       # Root layout with metadata
│   └── page.tsx         # Home page
├── components/
│   ├── Header.tsx       # Navigation header
│   ├── Hero.tsx         # Hero section with CTA
│   ├── HowItWorks.tsx   # Steps/process section
│   ├── BuiltForRealLife.tsx  # Community cards
│   ├── TargetAudience.tsx    # Audience cards
│   ├── Footer.tsx       # Footer with links
│   ├── Logo.tsx         # SVG logo component
│   └── PhoneMockup.tsx  # Phone chat mockup

Color Palette

• Teal (Primary): #0D9488
• Navy (Secondary): #0F1D2F
• Cream (Background): #F5F0E8
• Sand (Accent): #E8DFD0

Scripts

• npm run dev - Start development server
• npm run build - Build for production
• npm run start - Start production server
• npm run lint - Run ESLint

License

MIT