diff --git a/docs/adding-people.md b/docs/adding-people.md
new file mode 100644
index 0000000..b6ab7f0
--- /dev/null
+++ b/docs/adding-people.md
@@ -0,0 +1,143 @@
+# Adding New People to the Team Page
+
+This guide explains how to add new team members to the website. The system is designed to automatically display people based on existing component files.
+
+## Current System
+
+Currently, only **Adnan Fatayerji** appears on the people page because only his component exists in `src/components/people/People_Adnan.tsx`.
+
+## How to Add a New Person
+
+To add a new team member, follow these steps:
+
+### 1. Create the Person's Component
+
+Create a new file: `src/components/people/People_[Name].tsx`
+
+Example for John Doe:
+```typescript
+import { PersonTemplate } from '@/components/PersonTemplate'
+
+export const data = [
+ {
+ name: 'John Doe',
+ role: 'Software Engineer',
+ imageUrl: '/images/people/john_doe/john_doe.jpg',
+ xUrl: '#',
+ linkedinUrl: 'https://www.linkedin.com/in/johndoe/',
+ },
+]
+
+const biography = `
+
+ John is a passionate software engineer with expertise in modern web technologies.
+ He specializes in building scalable applications and has a keen interest in user experience design.
+
+
+ With over 5 years of experience in the tech industry, John has worked on various projects
+ ranging from startups to enterprise applications. He believes in writing clean, maintainable code
+ and is always eager to learn new technologies.
+
+`
+
+export function People_John() {
+ return
+}
+```
+
+### 2. Create the Person's Page Route
+
+Create a directory and page: `src/app/people/John_Doe/page.tsx`
+
+```typescript
+import { CallToAction } from '@/components/CallToAction'
+import { Faqs } from '@/components/Faqs'
+import { Footer } from '@/components/Footer'
+import { Header_darkbg } from '@/components/Header_darkbg'
+import { People_John } from '@/components/people/People_John'
+
+export default function JohnDoePage() {
+ return (
+ <>
+
+
+
+
+
+
+
+
+ )
+}
+```
+
+### 3. Update the People Data Registry
+
+Add the new person's data import to `src/lib/peopleData.ts`:
+
+```typescript
+// Add import
+import { data as johnData } from '@/components/people/People_John'
+
+// Add to getAllPeopleData function
+export function getAllPeopleData(): PersonData[] {
+ const allPeopleData: PersonData[] = []
+
+ try {
+ allPeopleData.push(...adnanData)
+ allPeopleData.push(...johnData) // Add this line
+ } catch (error) {
+ console.error('Error loading people data:', error)
+ }
+
+ return allPeopleData
+}
+```
+
+### 4. Add Person's Images
+
+Add the person's images to: `public/images/people/john_doe/`
+- `john_doe.jpg` (or .png, .jpeg)
+
+## Template System Benefits
+
+The system now uses a **centralized template** (`PersonTemplate.tsx`) for all individual people pages. This means:
+
+- **Global Styling**: Change image size, layout, or styling in `PersonTemplate.tsx` and it applies to ALL people's profiles
+- **Consistency**: All people pages have the same structure and design
+- **Easy Maintenance**: Update the template once instead of editing each person's component individually
+- **Responsive Design**: Template handles all responsive breakpoints uniformly
+
+### Customizing the Template
+
+To change styling for all people pages (like image size), edit `src/components/PersonTemplate.tsx`:
+
+```typescript
+// Example: To change image aspect ratio for all people
+
+```
+
+## Important Notes
+
+- **Data Structure**: Each person component must export a `data` array with the exact structure shown above
+- **Biography Format**: Use HTML string for rich text formatting in the biography
+- **Template Usage**: All person components should use `PersonTemplate` for consistency
+- **Naming Convention**:
+ - Component files: `People_[FirstName].tsx`
+ - Page directories: `[First_Last]/page.tsx`
+ - Image directories: `first_last/`
+- **Automatic Display**: Once all steps are completed, the person will automatically appear on the main people page
+- **URL Structure**: Individual pages will be accessible at `/people/First_Last`
+
+## Current Status
+
+- ✅ Adnan Fatayerji - Complete (component, page, images)
+- ❌ All other team members - Need to be added following the steps above
+
+The system is designed to be scalable - each new person added will automatically appear on the team page without needing to modify the main PeopleHero component.
diff --git a/src/app/people/Adnan_Fatayerji/page.tsx b/src/app/people/Adnan_Fatayerji/page.tsx
new file mode 100644
index 0000000..ec8c881
--- /dev/null
+++ b/src/app/people/Adnan_Fatayerji/page.tsx
@@ -0,0 +1,19 @@
+import { CallToAction } from '@/components/CallToAction'
+import { Faqs } from '@/components/Faqs'
+import { Footer } from '@/components/Footer'
+import { Header_darkbg } from '@/components/Header_darkbg'
+import { People_Adnan } from '@/components/people/People_Adnan'
+
+export default function AdnanFatayerjiPage() {
+ return (
+ <>
+
+
+
+
+
+
+
+
+ )
+}
diff --git a/src/app/people/page.tsx b/src/app/people/page.tsx
new file mode 100644
index 0000000..fb3538a
--- /dev/null
+++ b/src/app/people/page.tsx
@@ -0,0 +1,32 @@
+import { CallToAction } from '@/components/CallToAction'
+import { Faqs } from '@/components/Faqs'
+import { Footer } from '@/components/Footer'
+import { Header_darkbg } from '@/components/Header_darkbg'
+import { HomeAbout } from '@/components/HomeAbout'
+import { Hero } from '@/components/Hero'
+import { Pricing } from '@/components/Pricing'
+import { PrimaryFeatures } from '@/components/PrimaryFeatures'
+import { SecondaryFeatures } from '@/components/SecondaryFeatures'
+import { Testimonials } from '@/components/Testimonials'
+import { HomePrinciples } from '@/components/HomePrinciples'
+import { HomeMilestones } from '@/components/HomeMilestones'
+import { HomeVentures } from '@/components/HomeVentures'
+import { Quote } from '@/components/Quote'
+import { AboutHero } from '@/components/AboutHero'
+import { AboutMission } from '@/components/AboutMission'
+import { AboutExperience } from '@/components/AboutExperience'
+import { PeopleHero } from '@/components/PeopleHero'
+
+export default function People() {
+ return (
+ <>
+
+
+
+
+
+
+
+
+ )
+}
diff --git a/src/components/PeopleHero.tsx b/src/components/PeopleHero.tsx
new file mode 100644
index 0000000..bce3321
--- /dev/null
+++ b/src/components/PeopleHero.tsx
@@ -0,0 +1,65 @@
+import Link from 'next/link'
+import { getAllPeopleData, PersonData } from '@/lib/peopleData'
+
+// Function to convert name to URL slug
+function nameToSlug(name: string): string {
+ return name.replace(/\s+/g, '_')
+}
+
+export function PeopleHero() {
+ const people = getAllPeopleData()
+
+ return (
+
+
+
+
Our team
+
+ We're a dynamic group of individuals who are passionate about what we do and dedicated to delivering the
+ best results for our clients.
+
+ Adnan is a systems thinker and venture architect with a lifelong focus on reimagining how digital systems serve people. With a background spanning economics, strategy, and frontier technologies, his work bridges innovation and impact—bringing visionary ideas into scalable, grounded execution.
+
+
+ He has spent over a decade exploring how infrastructure, governance, and technology can evolve to empower communities, not just corporations. At OurWorld, Adnan leads strategy, growth, and ecosystem development, guiding ventures that are rooted in sovereignty, collective intelligence, and long-term resilience.
+
+`
+
+export function People_Adnan() {
+ return
+}
diff --git a/src/lib/peopleData.ts b/src/lib/peopleData.ts
new file mode 100644
index 0000000..cc06ac1
--- /dev/null
+++ b/src/lib/peopleData.ts
@@ -0,0 +1,31 @@
+// This file dynamically imports all people data from components
+// When new people components are added, they will automatically appear
+
+export interface PersonData {
+ name: string
+ role: string
+ imageUrl: string
+ xUrl: string
+ linkedinUrl: string
+}
+
+// Import all existing people data
+import { data as adnanData } from '@/components/people/People_Adnan'
+
+// Function to get all people data
+export function getAllPeopleData(): PersonData[] {
+ const allPeopleData: PersonData[] = []
+
+ // Add data from all existing people components
+ try {
+ allPeopleData.push(...adnanData)
+ } catch (error) {
+ console.error('Error loading Adnan data:', error)
+ }
+
+ // When new people components are created, add their imports here:
+ // import { data as newPersonData } from '@/components/people/People_NewPerson'
+ // allPeopleData.push(...newPersonData)
+
+ return allPeopleData
+}
+ +