Company Profile Landing Page

A modern, dark-themed technology company profile landing page built with Next.js 16, React 19, Tailwind CSS v4, and Framer Motion.

✨ Features

• Dark neon-glow design with cyan, purple, green, and pink accents
• Fully responsive — mobile-first with Tailwind breakpoints
• Scroll-reveal animations powered by Framer Motion
• Interactive sections:
  • Hero with floating geometric shapes and particle effects
  • About with company stats and core values
  • Services (6 technology categories)
  • Animated counters (clients, projects, satisfaction)
  • Tech stack grid (16 technologies)
  • Portfolio project cards with hover effects
  • Process timeline (5-step methodology)
  • Team member profiles
  • Testimonials carousel
  • Call-to-action section
  • Contact form with office info
  • Multi-column footer with newsletter signup
• Glass morphism UI elements
• Custom scrollbar and noise overlay texture
• UNSplash images for visual content

🛠 Tech Stack

🚀 Getting Started

# Install dependencies
npm install

# Start dev server
npm run dev

# Build for production
npm run build

# Start production server
npm run start

Open http://localhost:3000 in your browser.

📁 Project Structure

src/
├── app/
│   ├── globals.css        # Tailwind v4 config, theme, animations
│   ├── layout.tsx         # Root layout with fonts & metadata
│   └── page.tsx           # Main landing page (composes all sections)
├── components/
│   ├── landing/           # 15 landing section components
│   │   ├── AnimatedSection.tsx   # Reusable scroll-reveal wrapper
│   │   ├── Navbar.tsx
│   │   ├── Hero.tsx
│   │   ├── About.tsx
│   │   ├── Services.tsx
│   │   ├── Stats.tsx
│   │   ├── TechStack.tsx
│   │   ├── Portfolio.tsx
│   │   ├── Process.tsx
│   │   ├── Team.tsx
│   │   ├── Testimonials.tsx
│   │   ├── CTA.tsx
│   │   ├── Contact.tsx
│   │   └── Footer.tsx
│   └── ui/                # shadcn/ui primitives (button, input, toast)
├── hooks/
│   └── use-toast.ts
└── lib/
    └── utils.ts           # cn() utility (clsx + tailwind-merge)

🎨 Customization

• Colors & theme: Edit src/app/globals.css — the @theme inline block and :root CSS variables
• Content: All text, stats, team members, services, etc. are inline data arrays in each component
• Images: Replace Unsplash URLs with your own images
• Brand name: Currently "Company" — update in every component's data arrays and layout.tsx metadata

📄 License

MIT