@@ -133,29 +133,104 @@ <h4 class="text-xl font-semibold text-gray-700 mb-4">
133133 </ a >
134134 </ section >
135135 < br > < br >
136- < section id ="pillars " class ="content-section ">
137- < div class ="text-center mb-12 ">
138- < h2 class ="text-3xl md:text-4xl font-bold text-gray-900 mb-4 "> The Eight Pillars of TL</ h2 >
139- < p class ="text-lg text-gray-600 max-w-3xl mx-auto ">
140- The TL framework is founded on eight core principles that create a robust, verifiable, and accountable system. Click each pillar to explore its institutional role.
141- </ p >
142- </ div >
143-
144- < div class ="grid md:grid-cols-3 gap-8 ">
145- < div class ="md:col-span-1 ">
146- < div id ="pillar-nav " class ="space-y-3 sticky top-24 ">
147- < button class ="pillar-button active " data-pillar ="1 "> 1. Epistemic Hold</ button > < br >
148- < button class ="pillar-button " data-pillar ="2 "> 2. Immutable Ledger</ button > < br >
149- < button class ="pillar-button " data-pillar ="3 "> 3. Goukassian Principle</ button > < br >
150- < button class ="pillar-button " data-pillar ="4 "> 4. Decision Logs</ button > < br >
151- < button class ="pillar-button " data-pillar ="5 "> 5. Economic Rights & Transparency</ button > < br >
152- < button class ="pillar-button " data-pillar ="6 "> 6. Sustainable Capital Allocation</ button > < br >
153- < button class ="pillar-button " data-pillar ="7 "> 7. Hybrid Shield</ button > < br >
154- < button class ="pillar-button " data-pillar ="8 "> 8. Anchors</ button > < br >
136+ <!-- Problem Section -->
137+ < section id ="problem " class ="bg-slate-100 py-16 sm:py-24 ">
138+ < div class ="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 ">
139+ < div class ="text-center ">
140+ < h2 class ="text-3xl font-bold tracking-tight text-slate-900 sm:text-4xl ">
141+ Structural Failures in Current Systems
142+ </ h2 >
143+ < p class ="mt-4 text-lg leading-8 text-slate-600 max-w-3xl mx-auto ">
144+ TL is designed to address specific, critical failure modes where current audit and compliance structures are insufficient.
145+ These failures exist across financial, health, and logistical systems, often due to fragmented data and a lack of non-repudiable evidence.
146+ </ p >
147+ </ div >
148+ < div class ="mt-16 grid grid-cols-1 md:grid-cols-3 gap-8 ">
149+ < div class ="bg-white p-6 rounded-lg shadow-lg ">
150+ < h3 class ="text-lg font-semibold text-slate-900 "> Financial & State Systems</ h3 >
151+ < ul class ="mt-2 text-slate-600 list-disc list-inside space-y-1 ">
152+ < li > Trade-based money laundering</ li >
153+ < li > Insider collusion and model gaming</ li >
154+ < li > Rapid routing theft & spoofing</ li >
155+ < li > Ineffective post-hoc SAR auditing</ li >
156+ < li > CBDC and RTGS vulnerability</ li >
157+ </ ul >
158+ </ div >
159+ < div class ="bg-white p-6 rounded-lg shadow-lg ">
160+ < h3 class ="text-lg font-semibold text-slate-900 "> Human Safety & Public Welfare</ h3 >
161+ < ul class ="mt-2 text-slate-600 list-disc list-inside space-y-1 ">
162+ < li > Compromised clinical device approvals</ li >
163+ < li > Pharmaceutical supply-chain forgery</ li >
164+ < li > AI diagnostic model opacity</ li >
165+ < li > Procurement & emergency response fraud</ li >
166+ < li > Critical infrastructure (energy, telecom) gaps</ li >
167+ </ ul >
168+ </ div >
169+ < div class ="bg-white p-6 rounded-lg shadow-lg ">
170+ < h3 class ="text-lg font-semibold text-slate-900 "> Global Supply & Environment</ h3 >
171+ < ul class ="mt-2 text-slate-600 list-disc list-inside space-y-1 ">
172+ < li > Cross-border supply-chain forgery</ li >
173+ < li > Falsified bills of lading and invoices</ li >
174+ < li > ESG & environmental compliance gaps</ li >
175+ < li > Public record and registry tampering</ li >
176+ < li > Institutional AI governance failures</ li >
177+ </ ul >
155178 </ div >
156179 </ div >
157-
158- < div id ="pillar-content " class ="md:col-span-2 bg-white p-6 md:p-8 rounded-lg shadow-lg border border-gray-200 min-h-[400px] ">
180+ </ div >
181+ </ section >
182+
183+ <!-- Pillars Section -->
184+ < section id ="pillars " class ="py-16 sm:py-24 ">
185+ < div class ="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 ">
186+ < div class ="text-center ">
187+ < h2 class ="text-3xl font-bold tracking-tight text-slate-900 sm:text-4xl ">
188+ TL Core Architecture: The Eight Pillars
189+ </ h2 >
190+ < p class ="mt-4 text-lg leading-8 text-slate-600 max-w-3xl mx-auto ">
191+ The TL framework is built on eight interdependent principles that form a complete evidentiary system.
192+ Click on any pillar to understand its specific institutional role.
193+ </ p >
194+ </ div >
195+ < div class ="mt-16 grid grid-cols-1 lg:grid-cols-3 gap-8 ">
196+ < div class ="grid grid-cols-2 gap-4 ">
197+ < button data-pillar ="p1 " class ="pillar-button text-left p-4 bg-white rounded-lg shadow-lg hover:shadow-xl hover:bg-slate-50 border border-slate-200 ">
198+ < span class ="font-semibold block text-blue-700 "> 1. Epistemic Hold</ span >
199+ < span class ="text-sm text-slate-500 "> Enforced pause on uncertainty</ span >
200+ </ button >
201+ < button data-pillar ="p2 " class ="pillar-button text-left p-4 bg-white rounded-lg shadow-lg hover:shadow-xl hover:bg-slate-50 border border-slate-200 ">
202+ < span class ="font-semibold block text-blue-700 "> 2. Immutable Ledger</ span >
203+ < span class ="text-sm text-slate-500 "> Verifiable decision chain</ span >
204+ </ button >
205+ < button data-pillar ="p3 " class ="pillar-button text-left p-4 bg-white rounded-lg shadow-lg hover:shadow-xl hover:bg-slate-50 border border-slate-200 ">
206+ < span class ="font-semibold block text-blue-700 "> 3. Goukassian Principle</ span >
207+ < span class ="text-sm text-slate-500 "> Proof of knowledge</ span >
208+ </ button >
209+ < button data-pillar ="p4 " class ="pillar-button text-left p-4 bg-white rounded-lg shadow-lg hover:shadow-xl hover:bg-slate-50 border border-slate-200 ">
210+ < span class ="font-semibold block text-blue-700 "> 4. Decision Logs</ span >
211+ < span class ="text-sm text-slate-500 "> Forensic trace of reasoning</ span >
212+ </ button >
213+ < button data-pillar ="p5 " class ="pillar-button text-left p-4 bg-white rounded-lg shadow-lg hover:shadow-xl hover:bg-slate-50 border border-slate-200 ">
214+ < span class ="font-semibold block text-blue-700 "> 5. Economic Rights Mandate</ span >
215+ < span class ="text-sm text-slate-500 "> Aligned transparency</ span >
216+ </ button >
217+ < button data-pillar ="p6 " class ="pillar-button text-left p-4 bg-white rounded-lg shadow-lg hover:shadow-xl hover:bg-slate-50 border border-slate-200 ">
218+ < span class ="font-semibold block text-blue-700 "> 6. Sustainable Capital Mandate</ span >
219+ < span class ="text-sm text-slate-500 "> Evidence-bound obligations</ span >
220+ </ button >
221+ < button data-pillar ="p7 " class ="pillar-button text-left p-4 bg-white rounded-lg shadow-lg hover:shadow-xl hover:bg-slate-50 border border-slate-200 ">
222+ < span class ="font-semibold block text-blue-700 "> 7. Hybrid Shield</ span >
223+ < span class ="text-sm text-slate-500 "> Cryptographic & human protection</ span >
224+ </ button >
225+ < button data-pillar ="p8 " class ="pillar-button text-left p-4 bg-white rounded-lg shadow-lg hover:shadow-xl hover:bg-slate-50 border border-slate-200 ">
226+ < span class ="font-semibold block text-blue-700 "> 8. Anchors</ span >
227+ < span class ="text-sm text-slate-500 "> Sovereign-grade permanence</ span >
228+ </ button >
229+ </ div >
230+ < div id ="pillar-details-container " class ="lg:col-span-2 bg-white p-8 rounded-lg shadow-xl min-h-[300px] flex flex-col justify-center ">
231+ < h3 class ="text-xl font-bold text-slate-900 "> Click a Pillar to View Details</ h3 >
232+ < p class ="mt-2 text-slate-600 "> Select one of the eight pillars to the left to read its full institutional definition and operational role in the TL system.</ p >
233+ </ div >
159234 </ div >
160235 </ div >
161236 </ section >
0 commit comments