commit 563e4a5844da7c99d2093351d5d87a6047da56ee Author: Omair Saleh Date: Sun Mar 8 23:50:14 2026 +0800 Initial: Taawunu.org — social impact studio website 5 pages (Home, Approach, Projects, About, Support) 11 field photos from Lolo Camp Full brand identity implementation Mobile-responsive, optimized images diff --git a/Dockerfile b/Dockerfile new file mode 100644 index 0000000..040c466 --- /dev/null +++ b/Dockerfile @@ -0,0 +1,4 @@ +FROM nginx:alpine +COPY nginx.conf /etc/nginx/conf.d/default.conf +COPY html/ /usr/share/nginx/html/ +EXPOSE 80 diff --git a/html/404.html b/html/404.html new file mode 100644 index 0000000..9753cc3 --- /dev/null +++ b/html/404.html @@ -0,0 +1,42 @@ + + + + + + Page Not Found — Taawunu + + + + + +
+
+
404
+

Page not found.

+

The page you're looking for doesn't exist or has been moved.

+ Back to Home +
+
+ + + diff --git a/html/about/index.html b/html/about/index.html new file mode 100644 index 0000000..87a9e98 --- /dev/null +++ b/html/about/index.html @@ -0,0 +1,190 @@ + + + + + + About — Taawunu + + + + + + + + +
+
+
About Us
+

We build the system
that builds the community.

+

Taawunu is a social impact studio — not a charity, not an NGO, not a tech startup. We exist in the space between them, connecting funders, charity partners, and communities to create permanent infrastructure.

+
+
+ + +
+
+
What We Are
+
+

A social impact studio.

+
+

Taawunu (تَعَاوُنُوا) comes from the Quranic verse: "And cooperate in righteousness and piety" (Al-Ma'idah 5:2). The word is a plural imperative — it's not one person saving the world. It's a command to work together.

+

We are a small, focused team that designs, manages, and verifies community development projects for marginalized populations. We partner with registered charities (who handle donations and provide tax receipts) and local implementation organisations (who coordinate ground-level work).

+

What we bring:

+
    +
  • Project design — the 4-pillar sequential model
    • +
  • Budget management — every pound tracked and reported
    • +
  • Monitoring & evaluation — field visits, honest reports
    • +
  • Technology — dashboards, data systems, digital infrastructure
    • +
  • Fundraising strategy — campaign design for charity partners
    • +
+

What we don't do: We don't collect donations directly. We don't issue tax receipts. We don't operate as a registered charity. This is intentional — it keeps us focused on design, management, and accountability rather than fundraising compliance.

+
+
+
+ + +
+
وَتَعَاوَنُوا عَلَى الْبِرِّ وَالتَّقْوَىٰ
+
"And cooperate in righteousness and piety."
+
Al-Ma'idah 5:2
+
+ + +
+
+
The Team
+
+

Small team. Real work.

+

We're a lean team — intentionally. Overhead stays low, accountability stays high. Everyone is hands-on.

+
+
+
OS
+
Omair Saleh
+
Co-Founder & Technical Lead
+

Builds the technology that powers the projects — dashboards, financial tracking, communication systems. Also leads project design and stakeholder coordination. Background in software engineering and charity technology (QuikCue, CharityRight).

+
+
+
SH
+
Sheikh Hamid
+
Ground Implementation Lead
+

Leads UDES UK, our ground implementation partner. Coordinates with the Lolo community, manages local labour, oversees construction and infrastructure work. Has deep relationships with community leaders and local authorities.

+
+
+
SA
+
Saiqa Ahmed
+
Fundraising Partner (SWAN London)
+

Leads SWAN London, our primary UK fundraising partner. Provides the registered charity infrastructure for UK tax-efficient donations. Manages Stripe checkout, donor communications, and gift aid claims.

+
+
+
+
+ + +
+
+
Structure
+
+

How money flows — transparently.

+
+

Understanding how money moves through our ecosystem is critical to trust. Here's how it works:

+

1. Donors give to charity partners — SWAN London (UK), HFA (Australia). These are registered charities with full regulatory compliance. They issue tax receipts.

+

2. Charity partners fund projects — Funds are disbursed to project budgets based on agreed milestones. Every disbursement requires documentation.

+

3. Taawunu manages the projects — We design the intervention, manage the budget, coordinate implementation, and provide monitoring. Our professional service fees are openly listed in every budget.

+

4. Local partners implement on the ground — UDES coordinates community labour, manages materials, and oversees construction.

+

5. Taawunu verifies and reports — Independent M&E visits. Published reports with photos, financials, and honest assessments of what worked and what didn't.

+

Taawunu's management fees are always disclosed. In the Lolo project, they total £2,606 (6% of the total £43K budget) — covering project design, coordination, reporting, and two on-site M&E visits.

+
+
+
+ + +
+
+
Get In Touch
+
+

Let's build something together.

+

Whether you're a donor, a charity partner, a foundation, or just someone who cares — we'd like to hear from you.

+ +
+
+
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+ +
+
+
+

Direct Contact

+

Email:
hello@taawunu.org

+

For partnerships & institutional enquiries:
omair@taawunu.org

+

Social Media:
+ LinkedIn · Instagram +

+
+

For technical services (dashboards, data systems, charity technology), visit our professional services arm: Haqiqah Consulting

+
+
+
+
+
+ + + + + + diff --git a/html/approach/index.html b/html/approach/index.html new file mode 100644 index 0000000..ab1e69e --- /dev/null +++ b/html/approach/index.html @@ -0,0 +1,188 @@ + + + + + + Our Approach — Taawunu + + + + + + + + +
+
+
Our Approach
+

Four pillars.
One sequence.
No shortcuts.

+

Every project follows the same proven order: secure water, establish food production, create livelihoods, then build education. Each pillar depends on the one before it.

+
+
+ + +
+
+
+
Water
+
→
+
Food
+
→
+
Livelihoods
+
→
+
Education
+
+ + +
+
+ Working the red laterite earth at Lolo, April 2024 +
+
+
Pillar 1
+

Water

+

Without clean water, nothing else is possible. Dirty water causes disease, absorbs time (women walk kilometres to collect it), and can't support agriculture at scale.

+

What we build: Solar-powered boreholes (70m+ depth), elevated storage tanks (5,000L+), gravity-fed distribution. The well runs on sun — no fuel costs, no moving parts to fail.

+

At Lolo: 10,000 litres/day from a single borehole.

+
+
+ + +
+
+ Community members working together at the farm, April 2024 +
+
+
Pillar 2
+

Food

+

With water secured, we establish food production systems. At Lolo, this means aquaculture — 10 earthen ponds stocked with catfish, with capacity for 35,000 fish across 3 harvest cycles per year.

+

Why fish? Catfish grow fast (harvest-ready in 6 months), protein-dense, culturally preferred, and the ponds double as water storage. The community feeds itself and generates surplus for sale.

+

Projected: £92,000 annual revenue from fish sales.

+
+
+ + +
+
+ Team consulting with community members in the field +
+
+
Pillar 3
+

Livelihoods

+

Surplus food creates economic opportunity. Fish is sold at local markets. Revenue funds operations, creates employment, and builds an economy that doesn't depend on outside funding.

+

Economic model: The community owns and operates the farm. Revenue covers operational costs first, then reinvestment, then community projects. External funding becomes unnecessary within 12-18 months of first harvest.

+

ROI: 167% over 3 years from a £43K investment.

+
+
+ + +
+
+ Children at the community learning center, Lolo Camp, February 2025 +
+
+
Pillar 4
+

Education

+

Education is the final pillar because it must be sustained. A school funded by a one-off campaign closes when the campaign ends. A school funded by a fish farm runs forever.

+

At Lolo today: Children study Quran on wooden boards, sitting on the earth beneath a tin roof. They have teachers but no furniture, no materials, no light after sunset. The aquaculture revenue will fund a permanent school with solar lighting, desks, and trained teachers.

+

Target: Permanent school operational within Year 2.

+
+
+
+
+ + +
+
+
Why This Order
+
+

The sequence is not arbitrary.

+
+
+
→
+

Skip water?

+

Fish ponds need 50,000+ litres. Without a reliable water source, the entire food system fails. Every aquaculture project in arid regions that skipped water infrastructure has collapsed.

+
+
+
→
+

Skip food?

+

A community that can't feed itself can't attend school, can't work consistently, can't plan beyond the next meal. Food security is the prerequisite for all economic activity.

+
+
+
→
+

Skip livelihoods?

+

A school without an economic base closes when the funding cycle ends. Sustainable education requires a self-funding mechanism — and that means a functioning local economy.

+
+
+
+
+ + +
+
+
Radical Transparency
+
+

We publish everything.

+

Budgets. Receipts. Setbacks. Failures. If something goes wrong — and it will — we tell you. We believe that honest reporting builds more trust than polished marketing.

+ +
+

Example: The Solar Battery Incident

+

In February 2025, we arrived at Lolo for an M&E visit to find our solar batteries destroyed. Someone had rewired them incorrectly — a month of stored power, gone. We replaced them, revised the security protocol, and moved on.

+

We could have hidden this. Instead, we photographed the damage, documented the cost, and published it in our M&E report. Because if you're going to trust us with your money, you need to know we'll tell you the truth — even when the truth is uncomfortable.

+
+
+
+ + +
+

Ready to see the model in action?

+

Explore our flagship project in Lolo, Cameroon — or reach out to discuss how we can apply this model to your community.

+
+ View Projects + Get In Touch +
+
+ + + + + + diff --git a/html/css/style.css b/html/css/style.css new file mode 100644 index 0000000..fdbe536 --- /dev/null +++ b/html/css/style.css @@ -0,0 +1,990 @@ +/* ══════════════════════════════════════════════════ + TAAWUNU.ORG — Global Stylesheet + ══════════════════════════════════════════════════ */ + +@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,400;0,9..144,600;0,9..144,700;0,9..144,900;1,9..144,400;1,9..144,700&family=Source+Sans+3:ital,wght@0,300;0,400;0,600;0,700&family=JetBrains+Mono:wght@400;500&family=Caveat:wght@400;700&family=Noto+Naskh+Arabic:wght@400;700&display=swap'); + +/* ─── Variables ─── */ +:root { + --earth: #6B3A2A; + --green: #2D6A4F; + --gold: #C9A84C; + --water: #2578A1; + --deep: #3D1F15; + --cream: #F5EFE0; + --light-cream: #FAF7F2; + --paper: #FFFDF9; + --ink: #1A1A1A; + --muted: #9C9488; + --error: #A1392A; + --font-display: 'Fraunces', Georgia, serif; + --font-body: 'Source Sans 3', sans-serif; + --font-mono: 'JetBrains Mono', monospace; + --font-hand: 'Caveat', cursive; + --font-arabic: 'Noto Naskh Arabic', serif; + --max-w: 1200px; + --max-content: 720px; +} + +/* ─── Reset ─── */ +*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; } +html { scroll-behavior: smooth; -webkit-font-smoothing: antialiased; } +body { + font-family: var(--font-body); + color: var(--ink); + background: var(--paper); + line-height: 1.6; + font-size: 16px; +} +img { max-width: 100%; height: auto; display: block; } +a { color: var(--green); text-decoration: none; transition: color 0.2s; } +a:hover { color: var(--earth); } + +/* ─── Utilities ─── */ +.container { max-width: var(--max-w); margin: 0 auto; padding: 0 24px; } +.narrow { max-width: var(--max-content); } +.text-center { text-align: center; } +.text-muted { color: var(--muted); } +.text-earth { color: var(--earth); } +.text-green { color: var(--green); } +.text-gold { color: var(--gold); } +.text-cream { color: var(--cream); } +.bg-cream { background: var(--cream); } +.bg-light { background: var(--light-cream); } +.bg-deep { background: var(--deep); color: var(--cream); } +.mt-1 { margin-top: 8px; } +.mt-2 { margin-top: 16px; } +.mt-3 { margin-top: 24px; } +.mt-4 { margin-top: 40px; } +.mt-5 { margin-top: 64px; } +.mb-2 { margin-bottom: 16px; } +.mb-3 { margin-bottom: 24px; } +.mb-4 { margin-bottom: 40px; } + +/* ─── Typography ─── */ +h1, h2, h3 { font-family: var(--font-display); color: var(--deep); } +h1 { font-weight: 900; font-size: clamp(2.2rem, 5vw, 3.5rem); line-height: 1.08; letter-spacing: -0.015em; } +h2 { font-weight: 700; font-size: clamp(1.6rem, 3.5vw, 2.5rem); line-height: 1.15; margin-bottom: 16px; } +h3 { font-weight: 700; font-size: 1.25rem; margin-bottom: 8px; } +p { margin-bottom: 16px; max-width: 720px; } +.label { + font-family: var(--font-mono); + font-size: 11px; + letter-spacing: 0.12em; + text-transform: uppercase; + color: var(--muted); +} +.quote { + font-family: var(--font-hand); + font-size: clamp(1.2rem, 2.5vw, 1.6rem); + font-weight: 700; + color: var(--deep); + line-height: 1.35; +} +.arabic-display { + font-family: var(--font-arabic); + font-weight: 700; + direction: rtl; +} + +/* ─── Navigation ─── */ +.nav { + position: fixed; + top: 0; + left: 0; + right: 0; + z-index: 100; + background: rgba(255, 253, 249, 0.92); + backdrop-filter: blur(12px); + -webkit-backdrop-filter: blur(12px); + border-bottom: 1px solid rgba(156, 148, 136, 0.15); + transition: background 0.3s, box-shadow 0.3s; +} +.nav.scrolled { + box-shadow: 0 2px 16px rgba(61, 31, 21, 0.06); +} +.nav-inner { + max-width: var(--max-w); + margin: 0 auto; + padding: 0 24px; + display: flex; + align-items: center; + justify-content: space-between; + height: 64px; +} +.nav-brand { + display: flex; + align-items: center; + gap: 10px; + text-decoration: none; +} +.nav-brand .mark { + width: 32px; + height: 32px; +} +.nav-brand .wordmark { + font-family: var(--font-display); + font-weight: 600; + font-size: 18px; + color: var(--deep); + letter-spacing: 0.03em; +} +.nav-links { + display: flex; + align-items: center; + gap: 32px; + list-style: none; +} +.nav-links a { + font-size: 14px; + font-weight: 600; + color: var(--deep); + letter-spacing: 0.01em; + position: relative; + padding: 4px 0; +} +.nav-links a::after { + content: ''; + position: absolute; + bottom: -2px; + left: 0; + width: 0; + height: 2px; + background: var(--gold); + transition: width 0.3s; +} +.nav-links a:hover::after, +.nav-links a.active::after { width: 100%; } +.nav-cta { + background: var(--green); + color: white !important; + padding: 8px 20px; + border-radius: 4px; + font-size: 13px; + font-weight: 600; + letter-spacing: 0.02em; + transition: background 0.2s; +} +.nav-cta:hover { background: #245a42; } +.nav-cta::after { display: none !important; } + +/* Mobile nav */ +.nav-toggle { + display: none; + background: none; + border: none; + cursor: pointer; + width: 32px; + height: 32px; + position: relative; +} +.nav-toggle span { + display: block; + width: 22px; + height: 2px; + background: var(--deep); + position: absolute; + left: 5px; + transition: all 0.3s; +} +.nav-toggle span:nth-child(1) { top: 9px; } +.nav-toggle span:nth-child(2) { top: 15px; } +.nav-toggle span:nth-child(3) { top: 21px; } + +@media (max-width: 768px) { + .nav-toggle { display: block; } + .nav-links { + display: none; + position: absolute; + top: 64px; + left: 0; + right: 0; + background: var(--paper); + flex-direction: column; + padding: 24px; + gap: 16px; + border-bottom: 1px solid rgba(156, 148, 136, 0.15); + box-shadow: 0 8px 24px rgba(61, 31, 21, 0.08); + } + .nav-links.open { display: flex; } +} + +/* ─── Hero Section ─── */ +.hero { + position: relative; + min-height: 100vh; + display: flex; + align-items: center; + overflow: hidden; +} +.hero-bg { + position: absolute; + inset: 0; + z-index: 0; +} +.hero-bg img { + width: 100%; + height: 100%; + object-fit: cover; +} +.hero-overlay { + position: absolute; + inset: 0; + background: linear-gradient( + to bottom, + rgba(61, 31, 21, 0.3) 0%, + rgba(61, 31, 21, 0.5) 40%, + rgba(61, 31, 21, 0.85) 100% + ); +} +.hero-content { + position: relative; + z-index: 1; + max-width: var(--max-w); + margin: 0 auto; + padding: 120px 24px 80px; + color: var(--cream); +} +.hero-arabic { + font-family: var(--font-arabic); + font-size: clamp(2rem, 5vw, 3.5rem); + font-weight: 700; + direction: rtl; + color: var(--gold); + margin-bottom: 8px; + opacity: 0.9; +} +.hero h1 { + color: var(--cream); + margin-bottom: 20px; + max-width: 700px; +} +.hero-sub { + font-size: clamp(1rem, 2vw, 1.2rem); + max-width: 560px; + line-height: 1.7; + color: rgba(245, 239, 224, 0.85); + margin-bottom: 32px; +} +.hero-ctas { + display: flex; + gap: 16px; + flex-wrap: wrap; +} + +/* ─── Buttons ─── */ +.btn { + display: inline-flex; + align-items: center; + gap: 8px; + font-family: var(--font-body); + font-weight: 600; + font-size: 15px; + padding: 14px 28px; + border-radius: 4px; + border: none; + cursor: pointer; + transition: all 0.2s; + text-decoration: none; + letter-spacing: 0.01em; +} +.btn-primary { + background: var(--green); + color: white; +} +.btn-primary:hover { background: #245a42; color: white; } +.btn-outline { + background: transparent; + color: var(--cream); + border: 1.5px solid rgba(245, 239, 224, 0.5); +} +.btn-outline:hover { + background: rgba(245, 239, 224, 0.1); + border-color: var(--cream); + color: var(--cream); +} +.btn-gold { + background: var(--gold); + color: var(--deep); +} +.btn-gold:hover { background: #b8972f; color: var(--deep); } + +/* ─── Metric Row ─── */ +.metrics { + display: grid; + grid-template-columns: repeat(4, 1fr); + gap: 32px; + padding: 64px 0; +} +.metric { + text-align: center; +} +.metric-number { + font-family: var(--font-mono); + font-size: clamp(2rem, 4vw, 3rem); + color: var(--earth); + line-height: 1; + margin-bottom: 8px; +} +.metric-rule { + width: 48px; + height: 1px; + background: var(--earth); + margin: 8px auto 12px; +} +.metric-label { + font-size: 13px; + color: var(--muted); + text-transform: uppercase; + letter-spacing: 0.06em; +} + +@media (max-width: 768px) { + .metrics { grid-template-columns: repeat(2, 1fr); gap: 24px; } +} + +/* ─── Section Styles ─── */ +.section { + padding: 80px 0; +} +.section-label { + font-family: var(--font-mono); + font-size: 11px; + letter-spacing: 0.12em; + text-transform: uppercase; + color: var(--muted); + margin-bottom: 8px; +} +.section-gold-rule { + width: 60px; + height: 2px; + background: var(--gold); + margin-bottom: 24px; +} + +/* ─── 4-Pillar Cards ─── */ +.pillars { + display: grid; + grid-template-columns: repeat(4, 1fr); + gap: 20px; +} +.pillar-card { + background: var(--paper); + border-radius: 4px; + padding: 32px 24px; + border-top: 4px solid var(--muted); + transition: all 0.25s; + box-shadow: 0 1px 4px rgba(61, 31, 21, 0.05); +} +.pillar-card:hover { + transform: translateY(-4px); + box-shadow: 0 8px 24px rgba(61, 31, 21, 0.08); +} +.pillar-card:hover .pillar-border { height: 6px; } +.pillar-icon { + width: 40px; + height: 40px; + margin-bottom: 16px; +} +.pillar-name { + font-family: var(--font-display); + font-weight: 700; + font-size: 1.15rem; + margin-bottom: 8px; +} +.pillar-desc { + font-size: 14px; + color: #666; + line-height: 1.5; + margin-bottom: 0; +} + +.pillar-water { border-top-color: var(--water); } +.pillar-food { border-top-color: var(--green); } +.pillar-livelihood { border-top-color: var(--earth); } +.pillar-education { border-top-color: var(--gold); } + +.pillar-water .pillar-name { color: var(--water); } +.pillar-food .pillar-name { color: var(--green); } +.pillar-livelihood .pillar-name { color: var(--earth); } +.pillar-education .pillar-name { color: var(--gold); } + +/* Pillar flow arrow */ +.pillar-flow { + display: flex; + align-items: center; + justify-content: center; + gap: 24px; + margin-bottom: 48px; + flex-wrap: wrap; +} +.pillar-flow-item { + display: flex; + align-items: center; + gap: 8px; + font-family: var(--font-body); + font-weight: 600; + font-size: 14px; +} +.pillar-flow-dot { + width: 10px; + height: 10px; + border-radius: 50%; +} +.pillar-flow-arrow { + color: var(--muted); + font-size: 18px; +} + +@media (max-width: 768px) { + .pillars { grid-template-columns: 1fr 1fr; } +} +@media (max-width: 480px) { + .pillars { grid-template-columns: 1fr; } +} + +/* ─── Story Block (alternating photo + text) ─── */ +.story-block { + display: grid; + grid-template-columns: 1fr 1fr; + min-height: 500px; + overflow: hidden; +} +.story-block.reverse { direction: rtl; } +.story-block.reverse > * { direction: ltr; } +.story-photo { + overflow: hidden; +} +.story-photo img { + width: 100%; + height: 100%; + object-fit: cover; + transition: transform 0.6s; +} +.story-block:hover .story-photo img { + transform: scale(1.03); +} +.story-text { + padding: 64px 48px; + display: flex; + flex-direction: column; + justify-content: center; + background: var(--light-cream); +} +.story-text h2 { margin-bottom: 16px; } +.story-text p { color: #555; } +.story-text .quote { + margin-top: 24px; + padding-left: 20px; + border-left: 3px solid var(--gold); +} +.story-text .quote-attr { + font-family: var(--font-body); + font-size: 13px; + color: var(--muted); + font-weight: 400; + margin-top: 8px; +} + +@media (max-width: 768px) { + .story-block, + .story-block.reverse { grid-template-columns: 1fr; direction: ltr; } + .story-text { padding: 40px 24px; } +} + +/* ─── Photo Caption Bar ─── */ +.caption-bar { + background: var(--cream); + padding: 10px 24px; + font-size: 13px; + color: var(--muted); +} + +/* ─── Transparency / Budget ─── */ +.budget-table { + width: 100%; + border-collapse: collapse; + margin-top: 24px; +} +.budget-table th { + text-align: left; + font-size: 12px; + text-transform: uppercase; + letter-spacing: 0.05em; + color: var(--muted); + padding: 12px 16px; + border-bottom: 2px solid var(--earth); +} +.budget-table td { + padding: 14px 16px; + border-bottom: 1px solid rgba(156, 148, 136, 0.15); + font-size: 15px; +} +.budget-table td:last-child { + font-family: var(--font-mono); + text-align: right; + font-size: 14px; +} +.budget-table tr:nth-child(even) { background: var(--light-cream); } +.budget-table tfoot td { + font-weight: 700; + border-top: 2px solid var(--earth); + border-bottom: none; + color: var(--deep); +} + +/* ─── Timeline ─── */ +.timeline { + position: relative; + padding-left: 32px; +} +.timeline::before { + content: ''; + position: absolute; + left: 7px; + top: 0; + bottom: 0; + width: 2px; + background: var(--earth); + opacity: 0.3; +} +.timeline-item { + position: relative; + margin-bottom: 32px; + padding-left: 24px; +} +.timeline-dot { + position: absolute; + left: -28px; + top: 4px; + width: 16px; + height: 16px; + border-radius: 50%; + border: 3px solid; + background: var(--paper); +} +.timeline-dot.done { border-color: var(--green); background: var(--green); } +.timeline-dot.active { border-color: var(--gold); background: var(--gold); } +.timeline-dot.planned { border-color: var(--muted); } +.timeline-dot.issue { border-color: var(--error); background: var(--error); } +.timeline-date { + font-family: var(--font-mono); + font-size: 11px; + color: var(--muted); + letter-spacing: 0.05em; + margin-bottom: 4px; +} +.timeline-title { + font-weight: 600; + font-size: 16px; + color: var(--deep); + margin-bottom: 4px; +} +.timeline-desc { + font-size: 14px; + color: #666; +} + +/* ─── CTA Banner ─── */ +.cta-banner { + background: var(--deep); + color: var(--cream); + padding: 80px 24px; + text-align: center; +} +.cta-banner h2 { + color: var(--cream); + margin-bottom: 16px; +} +.cta-banner p { + max-width: 560px; + margin: 0 auto 32px; + color: rgba(245, 239, 224, 0.75); +} +.cta-banner .cta-buttons { + display: flex; + justify-content: center; + gap: 16px; + flex-wrap: wrap; +} + +/* ─── Partner Logos ─── */ +.partners { + display: flex; + align-items: center; + justify-content: center; + gap: 48px; + flex-wrap: wrap; + padding: 40px 0; +} +.partner { + font-family: var(--font-body); + font-weight: 700; + font-size: 14px; + color: var(--muted); + text-transform: uppercase; + letter-spacing: 0.08em; + opacity: 0.6; + transition: opacity 0.2s; +} +.partner:hover { opacity: 1; } + +/* ─── Footer ─── */ +.footer { + background: var(--deep); + color: rgba(245, 239, 224, 0.6); + padding: 64px 0 32px; +} +.footer-grid { + display: grid; + grid-template-columns: 2fr 1fr 1fr 1fr; + gap: 40px; + margin-bottom: 48px; +} +.footer-brand .footer-arabic { + font-family: var(--font-arabic); + font-size: 28px; + font-weight: 700; + color: var(--gold); + direction: rtl; + margin-bottom: 4px; +} +.footer-brand .footer-wordmark { + font-family: var(--font-display); + font-weight: 600; + font-size: 16px; + color: var(--cream); + letter-spacing: 0.05em; + margin-bottom: 16px; +} +.footer-brand p { + font-size: 13px; + line-height: 1.6; + max-width: 280px; +} +.footer h4 { + font-family: var(--font-body); + font-weight: 600; + font-size: 13px; + text-transform: uppercase; + letter-spacing: 0.08em; + color: var(--cream); + margin-bottom: 16px; +} +.footer ul { + list-style: none; +} +.footer li { + margin-bottom: 8px; +} +.footer li a { + color: rgba(245, 239, 224, 0.6); + font-size: 14px; + transition: color 0.2s; +} +.footer li a:hover { color: var(--gold); } +.footer-bottom { + border-top: 1px solid rgba(245, 239, 224, 0.1); + padding-top: 24px; + display: flex; + justify-content: space-between; + align-items: center; + flex-wrap: wrap; + gap: 16px; +} +.footer-bottom p { + font-size: 12px; + margin: 0; +} +.footer-legal { + font-size: 11px; + max-width: 600px; + line-height: 1.5; + color: rgba(245, 239, 224, 0.4); +} + +@media (max-width: 768px) { + .footer-grid { grid-template-columns: 1fr 1fr; } +} +@media (max-width: 480px) { + .footer-grid { grid-template-columns: 1fr; } +} + +/* ─── Project Cards ─── */ +.project-grid { + display: grid; + grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); + gap: 24px; +} +.project-card { + border-radius: 4px; + overflow: hidden; + background: white; + box-shadow: 0 1px 6px rgba(61, 31, 21, 0.06); + transition: all 0.25s; +} +.project-card:hover { + transform: translateY(-4px); + box-shadow: 0 8px 24px rgba(61, 31, 21, 0.1); +} +.project-card-img { + height: 200px; + overflow: hidden; +} +.project-card-img img { + width: 100%; + height: 100%; + object-fit: cover; + transition: transform 0.4s; +} +.project-card:hover .project-card-img img { + transform: scale(1.05); +} +.project-card-body { + padding: 24px; +} +.project-card-status { + display: inline-block; + font-size: 11px; + font-weight: 600; + text-transform: uppercase; + letter-spacing: 0.08em; + padding: 3px 10px; + border-radius: 3px; + margin-bottom: 12px; +} +.status-active { background: rgba(45, 106, 79, 0.1); color: var(--green); } +.status-planned { background: rgba(156, 148, 136, 0.15); color: var(--muted); } +.project-card-title { + font-family: var(--font-display); + font-weight: 700; + font-size: 1.15rem; + margin-bottom: 8px; + color: var(--deep); +} +.project-card-desc { + font-size: 14px; + color: #666; + line-height: 1.5; + margin-bottom: 16px; +} +.project-card-metrics { + display: flex; + gap: 24px; + padding-top: 16px; + border-top: 1px solid rgba(156, 148, 136, 0.12); +} +.project-card-metric { + text-align: center; +} +.project-card-metric .num { + font-family: var(--font-mono); + font-size: 18px; + color: var(--earth); + font-weight: 500; +} +.project-card-metric .lbl { + font-size: 10px; + text-transform: uppercase; + letter-spacing: 0.06em; + color: var(--muted); +} + +/* ─── Verse Callout ─── */ +.verse-callout { + text-align: center; + padding: 80px 24px; + background: var(--deep); +} +.verse-arabic { + font-family: var(--font-arabic); + font-size: clamp(1.6rem, 3.5vw, 2.5rem); + font-weight: 700; + color: var(--gold); + direction: rtl; + margin-bottom: 16px; +} +.verse-english { + font-family: var(--font-display); + font-size: clamp(1rem, 2vw, 1.3rem); + font-style: italic; + color: var(--cream); + max-width: 540px; + margin: 0 auto 8px; +} +.verse-ref { + font-size: 13px; + color: var(--muted); +} + +/* ─── Approach / How We Work ─── */ +.approach-steps { + display: grid; + grid-template-columns: repeat(3, 1fr); + gap: 32px; + margin-top: 40px; +} +.approach-step { + padding: 32px; + background: var(--paper); + border-radius: 4px; + border-left: 3px solid var(--gold); +} +.approach-step-num { + font-family: var(--font-mono); + font-size: 32px; + color: var(--gold); + opacity: 0.5; + margin-bottom: 8px; +} +.approach-step h3 { color: var(--deep); } +.approach-step p { + font-size: 14px; + color: #666; + margin-bottom: 0; +} + +@media (max-width: 768px) { + .approach-steps { grid-template-columns: 1fr; } +} + +/* ─── About Page ─── */ +.team-grid { + display: grid; + grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); + gap: 32px; +} +.team-card { + text-align: center; + padding: 32px; +} +.team-avatar { + width: 80px; + height: 80px; + border-radius: 50%; + margin: 0 auto 16px; + background: var(--cream); + display: flex; + align-items: center; + justify-content: center; + font-family: var(--font-display); + font-weight: 700; + font-size: 24px; + color: var(--earth); +} +.team-name { + font-family: var(--font-display); + font-weight: 700; + font-size: 1.1rem; + color: var(--deep); + margin-bottom: 4px; +} +.team-role { + font-size: 13px; + color: var(--muted); + text-transform: uppercase; + letter-spacing: 0.06em; +} + +/* ─── Page Hero (inner pages) ─── */ +.page-hero { + padding: 120px 0 60px; + background: var(--cream); +} +.page-hero .label { margin-bottom: 8px; } +.page-hero h1 { margin-bottom: 16px; } +.page-hero p { + font-size: 18px; + color: #666; + max-width: 600px; +} + +/* ─── Prose ─── */ +.prose { + font-size: 17px; + line-height: 1.75; +} +.prose p { margin-bottom: 20px; } +.prose h2 { + margin-top: 48px; + margin-bottom: 16px; +} +.prose h3 { + margin-top: 32px; + margin-bottom: 12px; +} +.prose img { + border-radius: 4px; + margin: 32px 0; +} + +/* ─── Animations ─── */ +.fade-up { + opacity: 0; + transform: translateY(24px); + transition: opacity 0.6s ease, transform 0.6s ease; +} +.fade-up.visible { + opacity: 1; + transform: translateY(0); +} + +/* ─── Support Page ─── */ +.support-cards { + display: grid; + grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); + gap: 24px; +} +.support-card { + background: white; + border-radius: 4px; + padding: 32px; + box-shadow: 0 1px 6px rgba(61, 31, 21, 0.06); + border-top: 4px solid var(--green); + transition: all 0.25s; +} +.support-card:hover { + transform: translateY(-4px); + box-shadow: 0 8px 24px rgba(61, 31, 21, 0.1); +} +.support-card h3 { margin-bottom: 12px; color: var(--deep); } +.support-card p { + font-size: 14px; + color: #666; + margin-bottom: 20px; +} +.support-card .btn { width: 100%; justify-content: center; } + +/* ─── Contact Form ─── */ +.form-group { + margin-bottom: 20px; +} +.form-group label { + display: block; + font-weight: 600; + font-size: 14px; + margin-bottom: 6px; + color: var(--deep); +} +.form-group input, +.form-group textarea, +.form-group select { + width: 100%; + padding: 12px 16px; + border: 1.5px solid rgba(156, 148, 136, 0.3); + border-radius: 4px; + font-family: var(--font-body); + font-size: 15px; + background: white; + transition: border-color 0.2s; +} +.form-group input:focus, +.form-group textarea:focus, +.form-group select:focus { + outline: none; + border-color: var(--green); +} +.form-group textarea { + min-height: 120px; + resize: vertical; +} diff --git a/html/images/boy-holding-alluha.jpg b/html/images/boy-holding-alluha.jpg new file mode 100644 index 0000000..807991d Binary files /dev/null and b/html/images/boy-holding-alluha.jpg differ diff --git a/html/images/children-learning-center.jpg b/html/images/children-learning-center.jpg new file mode 100644 index 0000000..e911b9f Binary files /dev/null and b/html/images/children-learning-center.jpg differ diff --git a/html/images/children-quran-study.jpg b/html/images/children-quran-study.jpg new file mode 100644 index 0000000..db89db4 Binary files /dev/null and b/html/images/children-quran-study.jpg differ diff --git a/html/images/community-farming-wide.jpg b/html/images/community-farming-wide.jpg new file mode 100644 index 0000000..d14bf59 Binary files /dev/null and b/html/images/community-farming-wide.jpg differ diff --git a/html/images/community-planting.jpg b/html/images/community-planting.jpg new file mode 100644 index 0000000..a016608 Binary files /dev/null and b/html/images/community-planting.jpg differ diff --git a/html/images/favicon.svg b/html/images/favicon.svg new file mode 100644 index 0000000..8dfc85a --- /dev/null +++ b/html/images/favicon.svg @@ -0,0 +1,6 @@ + + + + + + \ No newline at end of file diff --git a/html/images/girl-writing-alluha.jpg b/html/images/girl-writing-alluha.jpg new file mode 100644 index 0000000..35afb9f Binary files /dev/null and b/html/images/girl-writing-alluha.jpg differ diff --git a/html/images/hero-community-farming.jpg b/html/images/hero-community-farming.jpg new file mode 100644 index 0000000..6f330c4 Binary files /dev/null and b/html/images/hero-community-farming.jpg differ diff --git a/html/images/hfa-field-work.jpg b/html/images/hfa-field-work.jpg new file mode 100644 index 0000000..142175a Binary files /dev/null and b/html/images/hfa-field-work.jpg differ diff --git a/html/images/jungle-trek.jpg b/html/images/jungle-trek.jpg new file mode 100644 index 0000000..bde9193 Binary files /dev/null and b/html/images/jungle-trek.jpg differ diff --git a/html/images/team-field-discussion.jpg b/html/images/team-field-discussion.jpg new file mode 100644 index 0000000..6f6961a Binary files /dev/null and b/html/images/team-field-discussion.jpg differ diff --git a/html/images/tilling-soil.jpg b/html/images/tilling-soil.jpg new file mode 100644 index 0000000..5acf802 Binary files /dev/null and b/html/images/tilling-soil.jpg differ diff --git a/html/index.html b/html/index.html new file mode 100644 index 0000000..f2596ee --- /dev/null +++ b/html/index.html @@ -0,0 +1,299 @@ + + + + + + Taawunu — From the ground up + + + + + + + + + + + + + + + +
+
+ Community members working together at the Lolo Farm, Cameroon, April 2024 +
+
+
+
تَعَاوُنُوا
+

From aid to independence — one community at a time.

+

We design community development projects engineered to make themselves unnecessary. Water first. Then food. Then livelihoods. Then education. In that order.

+
+ See Our Work + How It Works +
+
+
+ + +
+
+
+
+
12,000
+
+
Refugees Reached
+
+
+
10
+
+
Fish Ponds Built
+
+
+
10,000L
+
+
Clean Water / Day
+
+
+
4
+
+
Pillar Model
+
+
+
+
+ + +
+
+
The Challenge
+
+

Aid creates dependency.
Infrastructure creates freedom.

+

For over a decade, 12,000 refugees from the Central African Republic have lived in Lolo Camp, Cameroon. The World Food Programme cut rations to 50%. Pulses, oil, salt — gone from the basket. The world's response: give them just enough to survive, never enough to thrive.

+

This is not a poverty problem. It's a design problem. The resources exist — water underground, fish in rivers, fertile soil, capable people. What's missing is the system that connects resources to people and people to self-sufficiency.

+

Taawunu builds that system.

+
+
+ + +
+
+
Our Model
+
+

Four pillars. One sequence. No shortcuts.

+

Each pillar depends on the one before it. Water before food. Food before livelihoods. All three before education can be sustained. This isn't theory — it's the proven order of community development.

+ +
+
Water
+
→
+
Food
+
→
+
Livelihoods
+
→
+
Education
+
+ +
+
+ +
Water
+

Clean water is the foundation of everything. A 70m borehole now pumps 10,000 litres daily — enough for the community and the aquaculture project.

+
+
+ +
Food
+

10 fish ponds with capacity for 35,000 catfish across 3 harvest cycles per year. The community feeds itself — no more waiting for WFP trucks.

+
+
+ +
Livelihoods
+

Surplus fish are sold at local markets. Revenue funds operations, creates jobs, and builds an economy that doesn't depend on outside funding.

+
+
+ +
Education
+

When a community can feed and sustain itself, it can build schools. Revenue from the farm funds teachers, materials, and permanent learning spaces.

+
+
+
+
+ + +
+
+ Community members and team planting at the Lolo Farm site, April 2024 +
+
+
Flagship Project
+

The Lolo Aquaculture Project

+

In the Adamawa Region of Cameroon, 12,000 CAR refugees decided to stop waiting. With a £43,006 investment, they're building a self-sustaining fish farm that projects £92,000 in annual revenue.

+

10 earthen ponds. 35,000 fish capacity. 3 harvest cycles per year. A community-run enterprise that makes foreign aid unnecessary.

+ Explore the Project → +
+
+ +
+
+ Children studying Quran on wooden boards at Lolo Camp, February 2025 +
+
+
Why Education Comes Last
+

First the well. Then the farm. Then the school.

+

These children study Quran on wooden boards, sitting on the red earth beside the mosque. They have no desk, no textbook, no light after sunset. But they have a teacher. And this year — they'll have a school.

+

Education is the final pillar because it must be sustained. A school funded by a campaign closes when the campaign ends. A school funded by a fish farm runs forever.

+
+ "We have started to stand on our own feet. We see a future for our children unfolding." +
— Community elder, Lolo Camp
+
+
+
+ + +
+
وَتَعَاوَنُوا عَلَى الْبِرِّ وَالتَّقْوَىٰ
+
"And cooperate in righteousness and piety."
+
Al-Ma'idah 5:2
+
+ + +
+
+
How We Work
+
+

Design. Manage. Verify.

+

Taawunu is a social impact studio — not a charity, not an NGO. We partner with registered charity organisations who handle donations, while we provide the expertise to turn those funds into permanent infrastructure.

+ +
+
+
01
+

Design

+

We assess community needs, design the sequential intervention (Water→Food→Livelihoods→Education), create budgets, and build the project plan with measurable milestones.

+
+
+
02
+

Manage

+

We coordinate between funders, charity partners, and local implementation teams. Every pound is tracked. Every phase is documented. We publish setbacks alongside successes.

+
+
+
03
+

Verify

+

Independent monitoring and evaluation. On-the-ground field visits. Published reports with photos, financials, and honest assessments. No spin — just truth.

+
+
+
+
+ + +
+
+
Our Partners
+
+
SWAN London
+
HFA Australia
+
UDES UK
+
Omega Ventures
+
+
+
+ + +
+

Every project we design is engineered
to make itself unnecessary.

+

Whether you're a donor looking to fund lasting change, a charity seeking implementation partners, or a foundation exploring new approaches — we'd like to hear from you.

+
+ Support a Project + Partner With Us +
+
+ + + + + + + + + diff --git a/html/projects/index.html b/html/projects/index.html new file mode 100644 index 0000000..3bfa15d --- /dev/null +++ b/html/projects/index.html @@ -0,0 +1,216 @@ + + + + + + Projects — Taawunu + + + + + + + + +
+
+
Our Projects
+

Building self-sufficiency,
one project at a time.

+

Every project follows our 4-pillar model: Water → Food → Livelihoods → Education. Every budget is public. Every setback is documented.

+
+
+ + +
+
+
Flagship Project
+
+

Lolo Aquaculture Project

+

Lolo Refugee Camp, Adamawa Region, Cameroon. 12,000 CAR refugees building a community-owned fish farm to replace dependence on shrinking WFP food rations.

+ + +
+
£43K
Total Budget
+
£92K
Projected Annual Revenue
+
10
Fish Ponds
+
167%
3-Year ROI
+
+ + +
+ Community farming at Lolo + Planting at the Lolo site + Team surveying the farm site through dense vegetation +
+
Team and community members during the first field assessment trip, April 2024. Lolo Camp, Cameroon.
+ + +

Project Timeline

+
+
+
+
APR 2024
+
Phase 0 — Assessment & Design
+
First field trip. Site assessment, community consultation, soil testing, budget development. Partnership agreements with UDES and local authorities.
+
+
+
+
JUL–DEC 2024
+
Phase 1 — Infrastructure
+
10 earthen ponds excavated. Hatchery structure built. Solar panels installed. Land cleared and prepared. Community labour coordinated.
+
+
+
+
JAN–MAR 2025
+
Phase 1A — Water & Power
+
Borehole drilled to 70m. 5,000L elevated tank installed. Solar batteries replaced after tampering incident. Water infrastructure now operational.
+
+
+
+
APR–JUN 2025
+
Phase 2 — Stocking & First Cycle
+
Broodstock acquisition. Hatchery commissioning. First stocking of 5 ponds. Feed procurement and feeding protocol established.
+
+
+
+
OCT 2025
+
Phase 3 — First Harvest
+
6 months after stocking. First commercial harvest. Revenue generation begins. Market linkages activated.
+
+
+
+
2026
+
Phase 4 — Full Operations
+
All 10 ponds in rotation. 3 harvest cycles per year. Full self-sufficiency. Community management committee running operations independently.
+
+
+ + +

Budget Transparency

+

Full budget breakdown. Updated after each phase.

+ + + + + + + + + + + + + + + + + + + +
ItemAmount
Land acquisition & preparation£4,200
Pond construction (10 ponds)£8,500
Hatchery construction£3,800
Borehole & water infrastructure£6,200
Solar power system£4,800
Broodstock & fingerlings£3,200
Feed (Year 1)£5,500
Equipment & tools£2,400
Training & capacity building£1,800
Project management & M&E£2,606
Total£43,006
+
+
+ + +
+
+
More Projects
+
+

What's next.

+
+
+
+ Field assessment for water well site +
+
+
Planned
+
Solar Water Well — Lolo Extension
+

A second borehole serving the northern section of the camp. Solar-powered, gravity-fed distribution. Target: additional 10,000L/day for 4,000+ residents.

+
+
£5K
Target
+
4,000+
People
+
+
+
+ +
+
+ Girl writing Quran on wooden board at Lolo Camp +
+
+
Planned — Phase 4
+
Lolo Community School
+

A permanent learning space funded by aquaculture revenue. Solar lighting, desks, trained teachers. Designed to outlast any single funding cycle.

+
+
200+
Students
+
Self
Funded
+
+
+
+ +
+
+ Boy showing his Quran wooden board +
+
+
Planned
+
Quran Preservation Programme
+

Supporting the traditional alluha (wooden board) Quran schools with materials, lighting, and teacher training — preserving an ancient learning tradition.

+
+
3
Schools
+
100+
Children
+
+
+
+
+
+
+ +
+

Want to support a project?

+

Donations are processed by our registered charity partners. You receive full tax benefits and complete transparency on how your funds are used.

+
+ Support a Project + Discuss Partnership +
+
+ + + + + + diff --git a/html/support/index.html b/html/support/index.html new file mode 100644 index 0000000..eb213fd --- /dev/null +++ b/html/support/index.html @@ -0,0 +1,176 @@ + + + + + + Support a Project — Taawunu + + + + + + + + +
+
+
Support a Project
+

Your sadaqah jariyah.
Their self-sufficiency.

+

Donations are processed by our registered charity partners, who issue tax receipts. Taawunu provides project management and full transparency on how your funds are used.

+
+
+ + +
+
+
How It Works
+
+

Three simple steps.

+ +
+
+
01
+

Choose a project

+

Select the project you want to support below. Each project has full budget transparency — you'll know exactly where your money goes.

+
+
+
02
+

Donate via charity partner

+

You'll be directed to our charity partner's secure payment page. They're a UK-registered charity — your donation is tax-deductible and Gift Aid eligible.

+
+
+
03
+

Receive updates

+

We publish regular project updates with photos, financials, and honest reporting. You'll see exactly what your contribution built.

+
+
+
+
+ + +
+
+
Active Projects
+
+

Where your support goes.

+ +
+
+
💧 Water
+

Solar Water Well — Lolo Camp

+

Fund a solar-powered borehole providing 10,000 litres of clean water daily to 4,000+ refugees. No fuel costs, no recurring expenses — powered by the sun.

+
+
Target
£5,000
+
Type
Sadaqah Jariyah
+
+ Donate via SWAN London → +

Donations processed by SWAN London, UK registered charity. Gift Aid eligible.

+
+ +
+
🌾 Food
+

Lolo Aquaculture — Phase 2

+

Fund the next phase of the community fish farm: broodstock acquisition, hatchery commissioning, and first pond stocking. This is the step that turns infrastructure into food.

+
+
Target
£8,700
+
Type
Zakat Eligible
+
+ Donate via SWAN London → +

Donations processed by SWAN London, UK registered charity. Gift Aid eligible.

+
+ +
+
📚 Education
+

Quran School Materials

+

Provide writing boards (alluha), ink, and solar lights for the traditional Quran schools at Lolo Camp. A small investment with deep cultural significance.

+
+
Target
£500
+
Type
Sadaqah
+
+ Donate via SWAN London → +

Donations processed by SWAN London, UK registered charity. Gift Aid eligible.

+
+
+
+
+ + +
+
+
Other Ways to Help
+
+

Not just money.

+ +
+
+

Share Our Work

+

Follow @taawunu on social media. Share our project updates with your community, mosque, or network. Awareness is free and powerful.

+
+
+

Professional Skills

+

Aquaculture expertise, water engineering, agricultural science, grant writing, Arabic translation. If you have skills we need, reach out.

+
+
+

Institutional Partnership

+

Foundations, NGOs, and government agencies — we're seeking partnerships to scale the 4-pillar model to other communities. Let's talk.

+
+
+
+
+ + +
+
+
+

Full transparency. Always.

+

Every project budget is published in full. Our management fees are openly listed. We report setbacks alongside successes. If something breaks, you'll hear about it from us first.

+ See Our Budgets → +
+
+
+ +
+
وَتَعَاوَنُوا عَلَى الْبِرِّ وَالتَّقْوَىٰ
+
"And cooperate in righteousness and piety."
+
Al-Ma'idah 5:2
+
+ + + + + + diff --git a/nginx.conf b/nginx.conf new file mode 100644 index 0000000..90b9887 --- /dev/null +++ b/nginx.conf @@ -0,0 +1,32 @@ +server { + listen 80; + server_name taawunu.org www.taawunu.org taawunu.com www.taawunu.com taawunu.quikcue.com; + root /usr/share/nginx/html; + index index.html; + + absolute_redirect off; + + location / { + try_files $uri $uri/ $uri/index.html /index.html; + } + + location /css/ { + expires 30d; + add_header Cache-Control "public, immutable"; + } + + location /images/ { + expires 30d; + add_header Cache-Control "public, immutable"; + } + + add_header X-Frame-Options "SAMEORIGIN" always; + add_header X-Content-Type-Options "nosniff" always; + add_header Referrer-Policy "strict-origin-when-cross-origin" always; + + gzip on; + gzip_types text/html text/css application/javascript text/plain image/svg+xml; + gzip_min_length 256; + + error_page 404 /404.html; +}