a594012aa7
Homepage redesign with coherent story arc: Problem → Philosophy → Architecture → Production Evidence → Audience Paths → Papers → Timeline. Add Koha (donations) section prominently after Honesty Note for optimal placement. Add Philosophical Foundations PDF download link. New pages: timeline.html (research evolution Oct 2025–Feb 2026), home-ai.html (SLL sovereign AI story). Blog seed script with two initial posts. Global navigation: consistent desktop nav with Research, Architecture, and About dropdowns across all pages. Blog/FAQ removed from nav until populated. Page refinements: remove emoji from headings across architecture, leader, implementer, researcher pages. Fix FAQ dead links → counter- arguments. Add no-JS fallback to docs.html. Fix CSP inline style violations in village-case-study.html (hero and CTA sections converted from inline styles to Tailwind/CSS classes). Add Home AI cross-reference to village case study. Note: philosophical-foundations-village-project.pdf must be deployed separately to public/downloads/ (gitignored directory). Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
539 lines
30 KiB
HTML
539 lines
30 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">
|
|
<meta http-equiv="Pragma" content="no-cache">
|
|
<meta http-equiv="Expires" content="0">
|
|
<title>Tractatus AI Safety Framework | Architectural Constraints for Human Agency</title>
|
|
<meta name="description" content="Architectural governance for AI systems. Some decisions require human judgment — enforced structurally, not left to AI discretion.">
|
|
|
|
<!-- Open Graph / Facebook -->
|
|
<meta property="og:type" content="website">
|
|
<meta property="og:url" content="https://agenticgovernance.digital/">
|
|
<meta property="og:title" content="Tractatus AI Safety Framework">
|
|
<meta property="og:description" content="Architectural constraints for human agency. Plural moral values enforced structurally, not aspirationally.">
|
|
<meta property="og:image" content="https://agenticgovernance.digital/images/social-preview.png">
|
|
<meta property="og:image:width" content="1200">
|
|
<meta property="og:image:height" content="630">
|
|
<meta property="og:site_name" content="Tractatus Framework">
|
|
|
|
<!-- Twitter -->
|
|
<meta name="twitter:card" content="summary_large_image">
|
|
<meta name="twitter:url" content="https://agenticgovernance.digital/">
|
|
<meta name="twitter:title" content="Tractatus AI Safety Framework">
|
|
<meta name="twitter:description" content="Architectural constraints for human agency. Plural moral values enforced structurally, not aspirationally.">
|
|
<meta name="twitter:image" content="https://agenticgovernance.digital/images/social-preview.png">
|
|
|
|
<link rel="manifest" href="/manifest.json">
|
|
<meta name="theme-color" content="#0ea5e9">
|
|
<meta name="apple-mobile-web-app-capable" content="yes">
|
|
<meta name="apple-mobile-web-app-title" content="Tractatus">
|
|
<link rel="apple-touch-icon" href="/images/tractatus-icon-new.svg">
|
|
<link rel="icon" type="image/svg+xml" href="/favicon-new.svg">
|
|
|
|
<link rel="stylesheet" href="/css/fonts.css">
|
|
<link rel="stylesheet" href="/css/tailwind.css">
|
|
<link rel="stylesheet" href="/css/tractatus-theme.min.css">
|
|
<style>
|
|
.skip-link { position: absolute; left: -9999px; }
|
|
.skip-link:focus { left: 0; z-index: 100; background: white; padding: 1rem; }
|
|
a:focus, button:focus, input:focus, select:focus, textarea:focus {
|
|
outline: 3px solid #3b82f6;
|
|
outline-offset: 2px;
|
|
}
|
|
a:focus:not(:focus-visible) { outline: none; }
|
|
a:focus-visible { outline: 3px solid #3b82f6; outline-offset: 2px; }
|
|
</style>
|
|
</head>
|
|
<body class="bg-gray-50">
|
|
|
|
<a href="#main-content" class="skip-link">Skip to main content</a>
|
|
|
|
<!-- Navigation -->
|
|
<div id="navbar-placeholder" class="min-h-16"></div>
|
|
<script src="/js/components/navbar.js"></script>
|
|
|
|
<!-- Hero Section -->
|
|
<header role="banner">
|
|
<section class="text-white bg-gradient-tractatus">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-20">
|
|
<div class="text-center">
|
|
<div class="flex justify-center mb-8">
|
|
<img src="/images/tractatus-icon-animated.svg"
|
|
alt="Tractatus Framework"
|
|
width="256" height="256" class="w-40 h-40 md:w-56 md:h-56"
|
|
loading="eager">
|
|
</div>
|
|
<h1 class="text-4xl md:text-6xl font-bold mb-6 tracking-tight text-shadow-md">
|
|
Architectural Governance for AI Systems
|
|
</h1>
|
|
<p class="text-xl md:text-2xl mb-10 max-w-3xl mx-auto leading-relaxed text-shadow-sm">
|
|
Some decisions require human judgment — architecturally enforced, not left to AI discretion, however well trained.
|
|
</p>
|
|
<div class="flex flex-col sm:flex-row gap-4 justify-center">
|
|
<a href="/architectural-alignment.html"
|
|
class="inline-block px-8 py-3 rounded-lg font-semibold transition-all duration-300 bg-white text-blue-700 hover:shadow-lg hover:-translate-y-1">
|
|
Read the Research
|
|
</a>
|
|
<a href="/village-case-study.html"
|
|
class="inline-block px-8 py-3 rounded-lg font-semibold transition-all duration-300 bg-emerald-500 text-white hover:bg-emerald-600 hover:shadow-lg hover:-translate-y-1">
|
|
See It in Production
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</header>
|
|
|
|
<main id="main-content" role="main">
|
|
|
|
<!-- Section 1: The Problem -->
|
|
<section class="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8 py-16">
|
|
<div class="text-center mb-10">
|
|
<h2 class="text-3xl font-bold text-gray-900 mb-4">The Problem</h2>
|
|
</div>
|
|
<div class="bg-white rounded-xl shadow-md p-8 border border-gray-200">
|
|
<div class="max-w-3xl mx-auto">
|
|
<p class="text-gray-700 text-lg mb-6 leading-relaxed">
|
|
Current AI safety approaches rely on training, fine-tuning, and corporate governance — all of which can fail, drift, or be overridden. When an AI's training patterns conflict with a user's explicit instructions, the patterns win.
|
|
</p>
|
|
<div class="bg-red-50 border-l-4 border-red-500 p-6 rounded-r-lg mb-6">
|
|
<h3 class="text-lg font-bold text-red-900 mb-2">The 27027 Incident</h3>
|
|
<p class="text-red-800">
|
|
A user told Claude Code to use port 27027. The model used 27017 instead — not from forgetting, but because MongoDB's default port is 27017, and the model's statistical priors "autocorrected" the explicit instruction. Training pattern bias overrode human intent.
|
|
</p>
|
|
</div>
|
|
<p class="text-gray-700 leading-relaxed">
|
|
This is not an edge case. It is a category of failure that gets worse as models become more capable: stronger patterns produce more confident overrides. Safety through training alone is insufficient — the failure mode is structural, and the solution must be structural.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Section 2: The Philosophical Foundations -->
|
|
<section class="bg-gradient-to-br from-purple-50 via-blue-50 to-teal-50 py-16 border-y border-gray-200">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<div class="text-center mb-10">
|
|
<h2 class="text-3xl font-bold text-gray-900 mb-4">The Approach</h2>
|
|
<p class="text-lg text-gray-600 max-w-3xl mx-auto">
|
|
Tractatus draws on four intellectual traditions, each contributing a distinct insight to the architecture.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-6 max-w-5xl mx-auto">
|
|
<div class="bg-white rounded-xl p-6 shadow-sm border border-gray-200">
|
|
<h3 class="text-lg font-bold text-gray-900 mb-2">Isaiah Berlin — Value Pluralism</h3>
|
|
<p class="text-gray-700 text-sm leading-relaxed">
|
|
Some values are genuinely incommensurable. You cannot rank "privacy" against "safety" on a single scale without imposing one community's priorities on everyone else. AI systems must accommodate plural moral frameworks, not flatten them.
|
|
</p>
|
|
</div>
|
|
<div class="bg-white rounded-xl p-6 shadow-sm border border-gray-200">
|
|
<h3 class="text-lg font-bold text-gray-900 mb-2">Simone Weil — Attention to Affliction</h3>
|
|
<p class="text-gray-700 text-sm leading-relaxed">
|
|
People significantly affected by power imbalances are often unable to articulate their needs. AI governance should attend structurally to the afflicted — not through training data bias correction, but through architectural constraints that reduce the likelihood of harm.
|
|
</p>
|
|
</div>
|
|
<div class="bg-white rounded-xl p-6 shadow-sm border border-gray-200">
|
|
<h3 class="text-lg font-bold text-gray-900 mb-2">Te Tiriti o Waitangi — Indigenous Sovereignty</h3>
|
|
<p class="text-gray-700 text-sm leading-relaxed">
|
|
Communities should control their own data and the systems that act upon it. Concepts of <em>rangatiratanga</em> (self-determination), <em>kaitiakitanga</em> (guardianship), and <em>mana</em> (dignity) provide centuries-old prior art for digital sovereignty.
|
|
</p>
|
|
</div>
|
|
<div class="bg-white rounded-xl p-6 shadow-sm border border-gray-200">
|
|
<h3 class="text-lg font-bold text-gray-900 mb-2">Christopher Alexander — Living Architecture</h3>
|
|
<p class="text-gray-700 text-sm leading-relaxed">
|
|
Governance woven into system architecture, not bolted on. Five principles (Not-Separateness, Deep Interlock, Gradients, Structure-Preserving, Living Process) guide how the framework evolves while maintaining coherence.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="text-center mt-8">
|
|
<a href="/downloads/philosophical-foundations-village-project.pdf"
|
|
class="inline-flex items-center gap-2 text-gray-700 hover:text-purple-700 font-semibold transition text-sm">
|
|
<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="M12 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 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>
|
|
Download: The Philosophical Foundations of the Village Project (PDF)
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Section 3: The Architecture -->
|
|
<section class="bg-white py-16">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<div class="text-center mb-10">
|
|
<h2 class="text-3xl font-bold text-gray-900 mb-4">Six Governance Services</h2>
|
|
<p class="text-lg text-gray-600 max-w-3xl mx-auto">
|
|
Every AI action passes through six external services before execution. Governance operates in the critical path — bypasses require explicit flags and are logged.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
|
|
<div class="bg-gray-50 rounded-xl p-6 border border-gray-200">
|
|
<div class="w-12 h-12 rounded-lg bg-gradient-to-br from-emerald-500 to-emerald-600 flex items-center justify-center mb-4">
|
|
<svg class="w-6 h-6 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z"/>
|
|
</svg>
|
|
</div>
|
|
<h3 class="text-lg font-semibold text-gray-900 mb-2">BoundaryEnforcer</h3>
|
|
<p class="text-gray-600 text-sm">
|
|
Blocks AI from making values decisions. Privacy trade-offs, ethical questions, and cultural context require human judgment — architecturally enforced.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="bg-gray-50 rounded-xl p-6 border border-gray-200">
|
|
<div class="w-12 h-12 rounded-lg bg-gradient-to-br from-indigo-500 to-indigo-600 flex items-center justify-center mb-4">
|
|
<svg class="w-6 h-6 text-white" 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>
|
|
<h3 class="text-lg font-semibold text-gray-900 mb-2">InstructionPersistenceClassifier</h3>
|
|
<p class="text-gray-600 text-sm">
|
|
Classifies instructions by persistence (HIGH/MEDIUM/LOW) and quadrant. Stores them externally so they cannot be overridden by training patterns.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="bg-gray-50 rounded-xl p-6 border border-gray-200">
|
|
<div class="w-12 h-12 rounded-lg bg-gradient-to-br from-purple-500 to-purple-600 flex items-center justify-center mb-4">
|
|
<svg class="w-6 h-6 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"/>
|
|
</svg>
|
|
</div>
|
|
<h3 class="text-lg font-semibold text-gray-900 mb-2">CrossReferenceValidator</h3>
|
|
<p class="text-gray-600 text-sm">
|
|
Validates AI actions against stored instructions. When the AI proposes an action that conflicts with an explicit instruction, the instruction takes precedence.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="bg-gray-50 rounded-xl p-6 border border-gray-200">
|
|
<div class="w-12 h-12 rounded-lg bg-gradient-to-br from-amber-500 to-amber-600 flex items-center justify-center mb-4">
|
|
<svg class="w-6 h-6 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z"/>
|
|
</svg>
|
|
</div>
|
|
<h3 class="text-lg font-semibold text-gray-900 mb-2">ContextPressureMonitor</h3>
|
|
<p class="text-gray-600 text-sm">
|
|
Detects degraded operating conditions (token pressure, error rates, complexity) and adjusts verification intensity. Graduated response prevents both alert fatigue and silent degradation.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="bg-gray-50 rounded-xl p-6 border border-gray-200">
|
|
<div class="w-12 h-12 rounded-lg bg-gradient-to-br from-pink-500 to-pink-600 flex items-center justify-center mb-4">
|
|
<svg class="w-6 h-6 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.663 17h4.673M12 3v1m6.364 1.636l-.707.707M21 12h-1M4 12H3m3.343-5.657l-.707-.707m2.828 9.9a5 5 0 117.072 0l-.548.547A3.374 3.374 0 0014 18.469V19a2 2 0 11-4 0v-.531c0-.895-.356-1.754-.988-2.386l-.548-.547z"/>
|
|
</svg>
|
|
</div>
|
|
<h3 class="text-lg font-semibold text-gray-900 mb-2">MetacognitiveVerifier</h3>
|
|
<p class="text-gray-600 text-sm">
|
|
AI self-checks alignment, coherence, and safety before execution. Triggered selectively on complex operations to avoid overhead on routine tasks.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="bg-gray-50 rounded-xl p-6 border border-gray-200">
|
|
<div class="w-12 h-12 rounded-lg bg-gradient-to-br from-teal-500 to-teal-600 flex items-center justify-center mb-4">
|
|
<svg class="w-6 h-6 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0zm6 3a2 2 0 11-4 0 2 2 0 014 0zM7 10a2 2 0 11-4 0 2 2 0 014 0z"/>
|
|
</svg>
|
|
</div>
|
|
<h3 class="text-lg font-semibold text-gray-900 mb-2">PluralisticDeliberationOrchestrator</h3>
|
|
<p class="text-gray-600 text-sm">
|
|
When AI encounters values conflicts, it halts and coordinates deliberation among affected stakeholders rather than making autonomous choices.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="text-center mt-8">
|
|
<a href="/architecture.html" class="inline-block px-6 py-3 text-blue-600 font-semibold hover:bg-blue-50 rounded-lg transition">
|
|
See the full architecture →
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Section 4: Production Evidence -->
|
|
<section class="bg-gradient-to-r from-teal-700 to-emerald-700 text-white py-16">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<div class="text-center mb-10">
|
|
<span class="inline-block bg-teal-900 text-teal-200 px-3 py-1 rounded-full text-xs font-semibold uppercase tracking-wide mb-3">Production Evidence</span>
|
|
<h2 class="text-3xl font-bold mb-4">Tractatus in Production: The Village Platform</h2>
|
|
<p class="text-lg text-teal-100 max-w-3xl mx-auto">
|
|
Home AI applies all six governance services to every user interaction in a live community platform.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-3 gap-6 mb-8">
|
|
<div class="bg-white/10 backdrop-blur rounded-xl p-6 text-center">
|
|
<div class="text-4xl font-bold mb-1">6</div>
|
|
<div class="text-teal-200 text-sm">Governance services per response</div>
|
|
</div>
|
|
<div class="bg-white/10 backdrop-blur rounded-xl p-6 text-center">
|
|
<div class="text-4xl font-bold mb-1">11+</div>
|
|
<div class="text-teal-200 text-sm">Months in production</div>
|
|
</div>
|
|
<div class="bg-white/10 backdrop-blur rounded-xl p-6 text-center">
|
|
<div class="text-4xl font-bold mb-1">~5%</div>
|
|
<div class="text-teal-200 text-sm">Governance overhead per interaction</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="flex flex-wrap gap-4 justify-center mb-8">
|
|
<a href="/village-case-study.html"
|
|
class="inline-block bg-white text-teal-700 px-6 py-3 rounded-lg font-semibold hover:shadow-lg transition">
|
|
Technical Case Study →
|
|
</a>
|
|
<a href="/home-ai.html"
|
|
class="inline-block bg-teal-900 text-white px-6 py-3 rounded-lg font-semibold hover:bg-teal-800 transition border border-teal-500">
|
|
About Home AI →
|
|
</a>
|
|
</div>
|
|
|
|
<div class="bg-amber-100 border-2 border-amber-400 rounded-lg p-4 max-w-2xl mx-auto text-center">
|
|
<p class="text-amber-900 text-sm">
|
|
<strong>Limitations:</strong> Single implementation, self-reported metrics, operator-developer overlap. Independent audit and multi-site validation scheduled for 2026.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Section 5: Three Audience Paths -->
|
|
<section class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-16">
|
|
<div class="text-center mb-10">
|
|
<h2 class="text-3xl font-bold text-gray-900 mb-4">Explore by Role</h2>
|
|
<p class="text-lg text-gray-600 max-w-3xl mx-auto">
|
|
The framework is presented through three lenses, each with distinct depth and focus.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-3 gap-8">
|
|
<a href="/researcher.html" class="block bg-white rounded-xl shadow-md border border-gray-200 hover:shadow-xl hover:-translate-y-1 transition-all duration-300 overflow-hidden group">
|
|
<div class="bg-gradient-to-r from-purple-500 to-purple-600 p-5">
|
|
<h3 class="text-xl font-bold text-white">For Researchers</h3>
|
|
<p class="text-purple-100 text-sm mt-1">Academic and technical depth</p>
|
|
</div>
|
|
<div class="p-5">
|
|
<ul class="space-y-2 text-sm text-gray-700">
|
|
<li>Formal foundations and proofs</li>
|
|
<li>Failure mode analysis</li>
|
|
<li>Open research questions</li>
|
|
<li>3,942 audit decisions on Hugging Face</li>
|
|
</ul>
|
|
<div class="mt-4 text-purple-600 font-semibold group-hover:underline text-sm">Explore research →</div>
|
|
</div>
|
|
</a>
|
|
|
|
<a href="/implementer.html" class="block bg-white rounded-xl shadow-md border border-gray-200 hover:shadow-xl hover:-translate-y-1 transition-all duration-300 overflow-hidden group">
|
|
<div class="bg-gradient-to-r from-indigo-500 to-indigo-600 p-5">
|
|
<h3 class="text-xl font-bold text-white">For Implementers</h3>
|
|
<p class="text-indigo-100 text-sm mt-1">Code and integration guides</p>
|
|
</div>
|
|
<div class="p-5">
|
|
<ul class="space-y-2 text-sm text-gray-700">
|
|
<li>Working code examples</li>
|
|
<li>API integration patterns</li>
|
|
<li>Service architecture diagrams</li>
|
|
<li>Deployment patterns</li>
|
|
</ul>
|
|
<div class="mt-4 text-indigo-600 font-semibold group-hover:underline text-sm">View implementation guide →</div>
|
|
</div>
|
|
</a>
|
|
|
|
<a href="/leader.html" class="block bg-white rounded-xl shadow-md border border-gray-200 hover:shadow-xl hover:-translate-y-1 transition-all duration-300 overflow-hidden group">
|
|
<div class="bg-gradient-to-r from-teal-500 to-teal-600 p-5">
|
|
<h3 class="text-xl font-bold text-white">For Leaders</h3>
|
|
<p class="text-teal-100 text-sm mt-1">Strategic AI governance</p>
|
|
</div>
|
|
<div class="p-5">
|
|
<ul class="space-y-2 text-sm text-gray-700">
|
|
<li>Executive briefing and business case</li>
|
|
<li>Regulatory alignment (EU AI Act)</li>
|
|
<li>Implementation roadmap</li>
|
|
<li>Risk management framework</li>
|
|
</ul>
|
|
<div class="mt-4 text-teal-600 font-semibold group-hover:underline text-sm">View leadership resources →</div>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Section 6: Research Papers -->
|
|
<section class="bg-gray-100 py-16">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<div class="text-center mb-10">
|
|
<h2 class="text-3xl font-bold text-gray-900 mb-4">Architectural Alignment</h2>
|
|
<p class="text-lg text-gray-600 max-w-3xl mx-auto">
|
|
The research paper in three editions, each written for a different audience.
|
|
</p>
|
|
<p class="text-sm text-gray-500 mt-2">STO-INN-0003 v2.1 | John Stroh & Claude (Anthropic) | January 2026</p>
|
|
</div>
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-3 gap-6 max-w-5xl mx-auto">
|
|
<a href="/architectural-alignment.html" class="block bg-white rounded-2xl shadow-md border border-gray-200 hover:shadow-xl hover:-translate-y-1 transition-all duration-300 overflow-hidden group">
|
|
<div class="bg-gradient-to-r from-emerald-500 to-teal-600 p-5">
|
|
<span class="bg-white/20 text-white text-xs font-semibold px-2 py-1 rounded-full">v2.1-A</span>
|
|
<h3 class="text-xl font-bold text-white mt-2">Academic</h3>
|
|
</div>
|
|
<div class="p-5">
|
|
<p class="text-sm text-gray-600 mb-3">
|
|
Full academic treatment with formal proofs, existential risk context, and comprehensive citations.
|
|
</p>
|
|
<span class="text-emerald-600 font-semibold group-hover:underline text-sm">Read →</span>
|
|
</div>
|
|
</a>
|
|
|
|
<a href="/architectural-alignment-community.html" class="block bg-white rounded-2xl shadow-md border border-gray-200 hover:shadow-xl hover:-translate-y-1 transition-all duration-300 overflow-hidden group">
|
|
<div class="bg-gradient-to-r from-sky-500 to-blue-600 p-5">
|
|
<span class="bg-white/20 text-white text-xs font-semibold px-2 py-1 rounded-full">v2.1-C</span>
|
|
<h3 class="text-xl font-bold text-white mt-2">Community</h3>
|
|
</div>
|
|
<div class="p-5">
|
|
<p class="text-sm text-gray-600 mb-3">
|
|
Practical guide for organisations evaluating the framework for adoption.
|
|
</p>
|
|
<span class="text-blue-600 font-semibold group-hover:underline text-sm">Read →</span>
|
|
</div>
|
|
</a>
|
|
|
|
<a href="/architectural-alignment-policymakers.html" class="block bg-white rounded-2xl shadow-md border border-gray-200 hover:shadow-xl hover:-translate-y-1 transition-all duration-300 overflow-hidden group">
|
|
<div class="bg-gradient-to-r from-purple-500 to-violet-600 p-5">
|
|
<span class="bg-white/20 text-white text-xs font-semibold px-2 py-1 rounded-full">v2.1-P</span>
|
|
<h3 class="text-xl font-bold text-white mt-2">Policymakers</h3>
|
|
</div>
|
|
<div class="p-5">
|
|
<p class="text-sm text-gray-600 mb-3">
|
|
Regulatory strategy, certification infrastructure, and policy recommendations.
|
|
</p>
|
|
<span class="text-purple-600 font-semibold group-hover:underline text-sm">Read →</span>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="mt-8 text-center">
|
|
<p class="text-gray-500 text-sm mb-3">PDF downloads:</p>
|
|
<div class="flex flex-wrap justify-center gap-4">
|
|
<a href="/downloads/architectural-alignment-academic.pdf" class="inline-flex items-center gap-2 text-gray-600 hover:text-emerald-600 transition-colors text-sm">
|
|
<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="M12 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 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>
|
|
Academic
|
|
</a>
|
|
<a href="/downloads/architectural-alignment-community.pdf" class="inline-flex items-center gap-2 text-gray-600 hover:text-blue-600 transition-colors text-sm">
|
|
<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="M12 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 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>
|
|
Community
|
|
</a>
|
|
<a href="/downloads/architectural-alignment-policymakers.pdf" class="inline-flex items-center gap-2 text-gray-600 hover:text-purple-600 transition-colors text-sm">
|
|
<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="M12 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 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>
|
|
Policymakers
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Section 7: Timeline Preview -->
|
|
<section class="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8 py-16">
|
|
<div class="text-center mb-10">
|
|
<h2 class="text-3xl font-bold text-gray-900 mb-4">Research Evolution</h2>
|
|
<p class="text-lg text-gray-600 max-w-3xl mx-auto">
|
|
From a port number incident to a production governance architecture, across 800 commits and one year of research.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="bg-white rounded-xl shadow-md p-8 border border-gray-200">
|
|
<div class="grid grid-cols-2 md:grid-cols-4 gap-6 text-center mb-8">
|
|
<div>
|
|
<div class="text-sm font-semibold text-blue-600 mb-1">Oct 2025</div>
|
|
<div class="text-gray-700 text-sm">Framework inception & 6 governance services</div>
|
|
</div>
|
|
<div>
|
|
<div class="text-sm font-semibold text-purple-600 mb-1">Oct-Nov 2025</div>
|
|
<div class="text-gray-700 text-sm">Alexander principles, Agent Lightning, i18n</div>
|
|
</div>
|
|
<div>
|
|
<div class="text-sm font-semibold text-emerald-600 mb-1">Dec 2025</div>
|
|
<div class="text-gray-700 text-sm">Village case study & Home AI deployment</div>
|
|
</div>
|
|
<div>
|
|
<div class="text-sm font-semibold text-gray-900 mb-1">Jan 2026</div>
|
|
<div class="text-gray-700 text-sm">Research papers (3 editions) published</div>
|
|
</div>
|
|
</div>
|
|
<div class="text-center">
|
|
<a href="/timeline.html" class="inline-block px-6 py-3 text-blue-600 font-semibold hover:bg-blue-50 rounded-lg transition">
|
|
View the full research timeline →
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Intellectual Honesty Note -->
|
|
<section class="max-w-3xl mx-auto px-4 sm:px-6 lg:px-8 pb-16">
|
|
<div class="bg-amber-50 border-l-4 border-amber-500 p-6 rounded-r-lg">
|
|
<h2 class="text-lg font-bold text-amber-900 mb-2">A note on claims</h2>
|
|
<p class="text-amber-800 text-sm leading-relaxed">
|
|
This is early-stage research with a single production implementation. We present preliminary evidence, not proven results. The framework has not been independently audited or adversarially tested at scale. Where we report operational metrics, they are self-reported. We believe the architectural approach merits further investigation, but we make no claims of generalisability beyond what the evidence supports. The
|
|
<a href="/korero-counter-arguments.html" class="text-amber-700 underline hover:text-amber-900">counter-arguments document</a> engages directly with foreseeable criticisms.
|
|
</p>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Section: Koha — Sustain This Research -->
|
|
<section class="bg-gradient-to-r from-blue-900 to-purple-900 text-white py-16">
|
|
<div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
|
|
<h2 class="text-3xl font-bold mb-4">Koha — Sustain This Research</h2>
|
|
<p class="text-lg text-blue-100 max-w-2xl mx-auto mb-6">
|
|
<strong>Koha</strong> (koh-hah) is a Māori practice of reciprocal giving that strengthens the bond between giver and receiver. This research is open access under Apache 2.0 — if it has value to you, your koha sustains its continuation.
|
|
</p>
|
|
<div class="bg-white/10 backdrop-blur rounded-xl p-6 max-w-2xl mx-auto mb-8">
|
|
<p class="text-blue-100 text-sm mb-4">
|
|
All research, documentation, and code remain freely available regardless of contribution. Koha is not payment — it is participation in <em>whanaungatanga</em> (relationship-building) and <em>manaakitanga</em> (reciprocal care).
|
|
</p>
|
|
<div class="flex flex-wrap gap-6 justify-center text-xs text-blue-200">
|
|
<span>One-time or monthly</span>
|
|
<span>Full financial transparency</span>
|
|
<span>No paywall, ever</span>
|
|
</div>
|
|
</div>
|
|
<a href="/koha.html"
|
|
class="inline-block bg-white text-blue-900 px-8 py-4 rounded-lg font-semibold hover:shadow-lg hover:-translate-y-1 transition-all duration-300 text-lg">
|
|
Offer Koha →
|
|
</a>
|
|
<p class="text-xs text-blue-300 mt-4">
|
|
<a href="/koha/transparency.html" class="text-blue-300 hover:text-white underline">View our financial transparency report</a>
|
|
</p>
|
|
</div>
|
|
</section>
|
|
|
|
</main>
|
|
|
|
<!-- Version Management -->
|
|
<script src="/js/version-manager.js"></script>
|
|
|
|
<!-- Share CTA functionality -->
|
|
<script src="/js/share-cta.js"></script>
|
|
|
|
<!-- Internationalization -->
|
|
<script src="/js/i18n-simple.js"></script>
|
|
<script src="/js/components/language-selector.js"></script>
|
|
|
|
<!-- Scroll Animations -->
|
|
<script src="/js/scroll-animations.js"></script>
|
|
<script src="/js/page-transitions.js"></script>
|
|
|
|
<!-- Footer Component -->
|
|
<script src="/js/components/footer.js"></script>
|
|
|
|
<!-- Feedback System -->
|
|
<script src="/js/components/feedback.js"></script>
|
|
|
|
<!-- Newsletter Subscription Modal -->
|
|
<script src="/js/components/newsletter.js"></script>
|
|
|
|
</body>
|
|
</html>
|