Expand Ubuntu_EdTech_Client_Brief.html with all missing strategic sections

[Copilot]

The HTML brief was a stub — only cover, executive summary, and competitor table were present. Six strategic sections referenced in the nav were missing entirely, along with the Aflatoun deep-dive and the full executive pull-quote.

Changes

Aflatoun deep-dive (§02a) — added inside #competitor as a three-card block: strengths, model gaps, and Ubuntu-EdTech's counter-positioning.

#positioning (§03) — three-pillar grid (Ubuntu / Afro-Futurism / EdTech), four defensibility cards, and the full executive pull-quote extended to include the "54 countries as launch market — not growth target" line.

#csr (§04) — Feed a Mother and Help a Sista programme cards with How It Works / Why It Matters copy, stat row, and blended-finance framing.

#blueprint (§05) — 10-card product grid spanning all four delivery phases.

#design (§06) — 7-colour palette with hover-reveal hex swatches, three typography cards (Bricolage Grotesque / Manrope / Space Mono), and a full tone-of-voice table (Never Say → Say This Instead).

#roadmap (§07) — four phase blocks (Foundation / Core Platform / Mobile & Scale / Movement) with bullet deliverables per phase.

#closing (§08) — executive closing quote, next-steps copy, CSR/Pan-African badges, and contact metadata.

Nav — added Closing link; corrected static nav-page counter from 01 / 08 → 01 / 09 to match the 9 sections the JS scroll handler now counts dynamically.

Original prompt

Update Ubuntu_EdTech_Client_Brief.html to include the missing sections and full content from README.md. Current HTML contains cover, summary and competitor sections but is missing the full Positioning, CSR, Blueprint, Design, Roadmap and Closing sections as well as the Aflatoun deep-dive and the full executive pull-quote. Make a single commit that replaces the existing Ubuntu_EdTech_Client_Brief.html with an expanded version that:

• Preserves the existing structure, head, CSS, navigation, and script at the bottom.

• Inserts the following new sections (each as a

  element with a unique id matching the nav links) in this order after the existing #competitor section and before the <script> tag:

  1. — "03 · Strategic Positioning" and full content under the "PILLAR 01/02/03" headings and "How Ubuntu Becomes Pedagogy" subpoints exactly as in the README. Use the same classes (.slide, .tag, .section-title, .rule, p.body) and include lists for pillars and the prose paragraphs.
  2. — "04 · CSR Programmes" with the two pillar subsections "Feed a Mother" and "Help a Sista" and the "Why CSR Is a Competitive Weapon" subsections drawn from the README. Keep the content structure (headings, short paragraphs, bullets and the callouts like "→ Learning completion = maternal nutrition contribution" and "→ Child's learning = women's economic activation").
  3. — "05 · Website & Platform Blueprint" including the Site Architecture header, "Build First" items (Homepage/Hero), Core Product Page, Replicate + Reinvent Aflatoun, Unique CSR pages, Partner Acquisition, Funder Acquisition, Emotional Proof Layer, Unique Editorial, Conversion Page, and Community Stories bullet points — preserve the README copy and hierarchy. Use lists and subheadings to keep readability.
  4. — "06 · Design Direction" with Visual Identity, the color palette names and hex codes, Typography Direction description, Imagery Principles and Tone of Voice "Language Inversion" mapping (the two-column comparison). Recreate the palette as a simple HTML .palette-row with .swatch divs labeled with the hex codes and names (you can reuse the CSS .palette-row/.swatch/.swatch-label). Include the Tone of Voice mapping as a small table or definition list, preserving the phrasing from README.
  5. — "07 · Build Roadmap" with the four phases (Phase 1–4) and the detailed bullets for each phase from the README. Use the existing .roadmap and .phase classes and include the Phase headers (ph-1..ph-4) and lists exactly as written.
  6. — "08 · Closing" containing the closing paragraphs and the badges/lines: "♥ Feed a Mother", "♥ Help a Sista", "Pan-African · 54 Countries", "Prepared for Client Review · Ubuntu EdTech Platform", Brief Type, Date — matching the README copy. Use existing .closing-content markup and classes to keep styles consistent.

• Also: expand the truncated pull-quote in the Executive Summary to the full sentence from README: "We are not building another Duolingo for financial skills. We are building the first learning platform where Ubuntu is the curriculum, Afro-Futurism is the destination, and community care is the infrastructure." and ensure it appears in the .pull-quote block.

• Add the "Aflatoun Deep Dive — What Works & What Doesn't" content under the Competitor section below the competitor table. Use heading h3 and a series of check/close bullets matching the README's ✓/✗ items. Keep the phrasing exactly as in the README.

• Do not modify unrelated content (styles, navigation, script). Ensure all new textual content is HTML-escaped where necessary and uses the repo's existing typography classes (p.body, p.lead, h2.section-title, .tag, .rule, .pull-quote, etc.) so it inherits styles.

• After change: total number of

  elements should equal 8 (cover + summary + competitor + positioning + csr + blueprint + design + roadmap + closing). Ensure nav page counter (JS) will display the updated count automatically.

Make the change as a single commit on a new branch and open a pull request titled: "Add full sections and content from README into Ubuntu_EdTech_Client_Brief.html" with a clear description of what was added.

Repository: Tich-Labs/Ubuntu-Edtech

Do not open or modify other files.

The following is the prior conversation context from the user's chat exploration (may be truncated):

User: please confimr the font size ant type for this repo

Assistant: Direct answer — fonts and the main sizes used in the repo's HTML/CSS:

Fonts

• Manrope — used as the document/body font (font-family: 'Manrope', sans‑serif). Used for most paragraph/body text.
• Bricolage Grotesque — used for large headings, display text and some card headings (font-family: 'Bricolage Grotesque', sans‑serif).
• Space Mono — us...

This pull request was created from Copilot chat.