feat: Enhance Village platform section with Home AI governance details

- Add detailed Home AI card showing 6 governance services per response
- Add governance-protected features list (RAG Help Centre, Document OCR, etc.)
- Include production metrics (11+ months, single-tenant deployment note)
- Add technical verification section explaining the governance stack
- Improve layout with 2-column grid design
- Add research integrity disclaimer per inst_016

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
TheFlow 2025-12-09 13:45:43 +13:00
parent c50af8c5a5
commit e7dc7bf1ae

View file

@ -559,31 +559,130 @@ Handles plural moral values without imposing hierarchy—facilitates human judgm
</div>
</section>
<!-- Village Platform Promotion -->
<section class="bg-gradient-to-r from-teal-600 to-emerald-600 text-white py-12 border-b-4 border-teal-800">
<!-- Village Platform & Home AI - Production Evidence -->
<section class="bg-gradient-to-r from-teal-600 to-emerald-600 text-white py-16 border-b-4 border-teal-800">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="flex flex-col md:flex-row items-center gap-6">
<div class="flex-shrink-0 text-6xl">🏘️</div>
<div class="flex-1 text-center md:text-left">
<div class="inline-block bg-teal-800 text-teal-200 px-3 py-1 rounded-full text-xs font-semibold uppercase tracking-wide mb-2" data-i18n="village_promo.badge">
Production Implementation
<!-- Main Header -->
<div class="text-center mb-12">
<div class="inline-block bg-teal-800 text-teal-200 px-3 py-1 rounded-full text-xs font-semibold uppercase tracking-wide mb-4">
Production Evidence
</div>
<h2 class="text-4xl font-bold mb-4">Tractatus in Production: The Village Platform</h2>
<p class="text-xl text-teal-100 max-w-3xl mx-auto">
Our research has produced a practical outcome. Home AI applies all six Tractatus governance services to every user interaction in a live community platform.
</p>
</div>
<div class="grid grid-cols-1 lg:grid-cols-2 gap-8 mb-12">
<!-- Home AI Card -->
<div class="bg-white/10 backdrop-blur-sm rounded-xl p-8 border border-white/20">
<div class="flex items-center gap-4 mb-6">
<div class="w-16 h-16 rounded-xl bg-teal-500 flex items-center justify-center text-3xl">
🏠
</div>
<div>
<h3 class="text-2xl font-bold">Home AI</h3>
<p class="text-teal-200">Six Services Per Response</p>
</div>
</div>
<h2 class="text-3xl font-bold mb-2" data-i18n="village_promo.heading">See Tractatus in Action</h2>
<p class="text-lg font-semibold text-teal-100 mb-2" data-i18n="village_promo.subheading">The Village Platform</p>
<p class="text-base text-teal-50 mb-4" data-i18n="village_promo.description">
Our research into architectural AI governance has produced a practical outcome: the Village platform. Member-owned community spaces with sovereign data, governed AI assistance, and genuine privacy by design. See what structurally-constrained AI looks like in production—real communities operating with these architectural safeguards.
<p class="text-teal-50 mb-6 leading-relaxed">
Every Home AI response passes through the complete Tractatus governance stack before reaching the user. BoundaryEnforcer blocks values judgments, CrossReferenceValidator prevents prompt injection, ContextPressureMonitor tracks session health.
</p>
<div class="flex flex-col sm:flex-row gap-3 justify-center md:justify-start">
<a href="https://mysovereignty.digital"
target="_blank"
rel="noopener noreferrer"
class="inline-block bg-white text-teal-700 px-6 py-3 rounded-lg font-semibold hover:bg-teal-50 transition-all shadow-lg hover:shadow-xl"
data-i18n="village_promo.cta">
Explore the Village →
</a>
<div class="grid grid-cols-2 gap-4 mb-6">
<div class="bg-white/10 rounded-lg p-4 text-center">
<div class="text-3xl font-bold">6</div>
<div class="text-sm text-teal-200">Governance services per response</div>
</div>
<div class="bg-white/10 rounded-lg p-4 text-center">
<div class="text-3xl font-bold">11+</div>
<div class="text-sm text-teal-200">Months in production</div>
</div>
</div>
<p class="text-sm text-teal-200 italic">
These figures reflect single-tenant deployment. Multi-tenant validation pending.
</p>
</div>
<!-- Governed Features Card -->
<div class="bg-white/10 backdrop-blur-sm rounded-xl p-8 border border-white/20">
<h3 class="text-xl font-bold mb-6">Governance-Protected Features</h3>
<ul class="space-y-4">
<li class="flex items-start gap-3">
<div class="w-8 h-8 rounded-lg bg-teal-500 flex items-center justify-center flex-shrink-0">
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8.228 9c.549-1.165 2.03-2 3.772-2 2.21 0 4 1.343 4 3 0 1.4-1.278 2.575-3.006 2.907-.542.104-.994.54-.994 1.093m0 3h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"/>
</svg>
</div>
<div>
<div class="font-semibold">RAG-Based Help Centre</div>
<div class="text-sm text-teal-200">Vector search with permission-aware retrieval</div>
</div>
</li>
<li class="flex items-start gap-3">
<div class="w-8 h-8 rounded-lg bg-teal-500 flex items-center justify-center flex-shrink-0">
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/>
</svg>
</div>
<div>
<div class="font-semibold">Document OCR</div>
<div class="text-sm text-teal-200">Automated text extraction under consent controls</div>
</div>
</li>
<li class="flex items-start gap-3">
<div class="w-8 h-8 rounded-lg bg-teal-500 flex items-center justify-center flex-shrink-0">
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z"/>
</svg>
</div>
<div>
<div class="font-semibold">Story Assistance</div>
<div class="text-sm text-teal-200">Content suggestions filtered through BoundaryEnforcer</div>
</div>
</li>
<li class="flex items-start gap-3">
<div class="w-8 h-8 rounded-lg bg-teal-500 flex items-center justify-center flex-shrink-0">
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2"/>
</svg>
</div>
<div>
<div class="font-semibold">AI Memory Transparency</div>
<div class="text-sm text-teal-200">User-controlled summarisation with audit dashboard</div>
</div>
</li>
</ul>
</div>
</div>
<!-- CTA Row -->
<div class="flex flex-col sm:flex-row gap-4 justify-center">
<a href="https://mysovereignty.digital"
target="_blank"
rel="noopener noreferrer"
class="inline-block bg-white text-teal-700 px-8 py-3 rounded-lg font-semibold hover:bg-teal-50 transition-all shadow-lg hover:shadow-xl text-center">
Explore the Village →
</a>
<a href="/village-case-study.html"
class="inline-block bg-teal-800 text-white px-8 py-3 rounded-lg font-semibold hover:bg-teal-900 transition-all border-2 border-teal-400 text-center">
Technical Case Study →
</a>
</div>
<!-- Honest Limitations -->
<div class="mt-8 bg-teal-800/50 rounded-lg p-4 text-center">
<p class="text-sm text-teal-100">
<strong>Limitations:</strong> Single implementation, self-reported metrics, operator-developer overlap.
Independent audit and multi-site validation scheduled for 2026.
</p>
</div>
</div>
</section>