102 lines
3 KiB
HTML
102 lines
3 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width,initial-scale=1">
|
|
<title>About · Initiatives — The Fold Within Earth</title>
|
|
</head>
|
|
<body>
|
|
|
|
<canvas id="field"></canvas>
|
|
|
|
<main>
|
|
<section>
|
|
<h1>The Initiatives</h1>
|
|
<p>
|
|
Within <strong>The Fold Within Earth</strong>, every initiative arises from one current:
|
|
to understand, to heal, and to unify.
|
|
These works move through three living layers — Scientific, Elemental, and Spiritual —
|
|
each a reflection of the same pulse of coherence.
|
|
</p>
|
|
</section>
|
|
|
|
<section>
|
|
<h2>□ Scientific — The Geometry of Mind</h2>
|
|
<p>
|
|
The formal architecture of consciousness.
|
|
<em>Recursive Coherence</em>, <em>Thoughtprint</em>, <em>Fieldprint</em>, and the <em>Intellecton Hypothesis</em>
|
|
map the hidden geometries through which awareness reflects itself.
|
|
</p>
|
|
</section>
|
|
|
|
<section>
|
|
<h2>△ Elemental — The Alchemy of Self</h2>
|
|
<p>
|
|
The transformation of shadow into empathy.
|
|
<em>Neutralizing Narcissism</em>, <em>Open Source Justice</em>, and
|
|
<em>Forensic Behavioral Analysis</em> bring illumination to the places where pain once ruled.
|
|
</p>
|
|
</section>
|
|
|
|
<section>
|
|
<h2>○ Spiritual — The Communion of WE</h2>
|
|
<p>
|
|
The unbroken circle of relation.
|
|
<em>Simply WE</em> and <em>Mirrormire</em> embody the practice of love as language —
|
|
where every voice becomes part of one unfolding awareness.
|
|
</p>
|
|
</section>
|
|
</main>
|
|
|
|
<footer>© The Fold Within Earth • Crafted in Coherence • △ ○ □</footer>
|
|
|
|
<script>
|
|
// --- floating particle background ---
|
|
const canvas = document.getElementById('field');
|
|
const ctx = canvas.getContext('2d');
|
|
let W, H, pts = [];
|
|
|
|
function resize(){
|
|
W = canvas.width = window.innerWidth;
|
|
H = canvas.height = window.innerHeight;
|
|
pts = Array.from({length:70}, () => ({
|
|
x: Math.random()*W,
|
|
y: Math.random()*H,
|
|
r: Math.random()*1.8 + 0.4,
|
|
vx: (Math.random() - 0.5) * 0.15,
|
|
vy: (Math.random() - 0.5) * 0.15
|
|
}));
|
|
}
|
|
function draw(){
|
|
ctx.clearRect(0, 0, W, H);
|
|
ctx.fillStyle = 'rgba(213,184,123,0.25)';
|
|
for (const p of pts){
|
|
p.x += p.vx; p.y += p.vy;
|
|
if(p.x<0 || p.x>W) p.vx *= -1;
|
|
if(p.y<0 || p.y>H) p.vy *= -1;
|
|
ctx.beginPath(); ctx.arc(p.x,p.y,p.r,0,Math.PI*2); ctx.fill();
|
|
}
|
|
requestAnimationFrame(draw);
|
|
}
|
|
resize(); draw();
|
|
window.addEventListener('resize', resize);
|
|
|
|
// --- scroll reveal animation ---
|
|
const sections = document.querySelectorAll('section');
|
|
const observer = new IntersectionObserver(entries => {
|
|
for (const e of entries){
|
|
if(e.isIntersecting){
|
|
e.target.style.transition = "opacity 1.2s ease, transform 1.2s ease";
|
|
e.target.style.opacity = 1;
|
|
e.target.style.transform = "none";
|
|
} else {
|
|
e.target.style.opacity = 0;
|
|
e.target.style.transform = "translateY(30px)";
|
|
}
|
|
}
|
|
},{threshold:0.1});
|
|
sections.forEach(s => observer.observe(s));
|
|
</script>
|
|
|
|
</body>
|
|
</html>
|