// Home / Overview — cinematic globe hero + narrative (why · how · what it unlocks)
const { useState: uS, useEffect: uE, useMemo: uM, useRef: uR } = React;
// Count-up number that animates when scrolled into view
function CountUp({ value, dur = 1500, suffix = '%' }) {
const [v, setV] = uS(0);
const ref = uR(null);
const started = uR(false);
uE(() => {
const el = ref.current;
if (!el) return;
const io = new IntersectionObserver((entries) => {
entries.forEach((e) => {
if (e.isIntersecting && !started.current) {
started.current = true;
const start = performance.now();
const tick = (t) => {
const p = Math.min(1, (t - start) / dur);
const eased = 1 - Math.pow(1 - p, 3);
setV(value * eased);
if (p < 1) requestAnimationFrame(tick);
};
requestAnimationFrame(tick);
}
});
}, { threshold: 0.4 });
io.observe(el);
const fallback = setTimeout(() => { if (!started.current) setV(value); }, 1400);
return () => { io.disconnect(); clearTimeout(fallback); };
}, [value]);
return {Math.round(v)}{suffix};
}
// Fade/slide-up on scroll into view
function Reveal({ children, as = 'div', style, delay = 0 }) {
const ref = uR(null);
uE(() => {
const el = ref.current;
if (!el) return;
el.style.opacity = '0';
el.style.transform = 'translateY(26px)';
el.style.transition = `opacity .8s cubic-bezier(.22,.61,.36,1) ${delay}ms, transform .8s cubic-bezier(.22,.61,.36,1) ${delay}ms`;
const io = new IntersectionObserver((entries) => {
entries.forEach((e) => {
if (e.isIntersecting) { el.style.opacity = '1'; el.style.transform = 'none'; io.unobserve(el); }
});
}, { threshold: 0.15, rootMargin: '0px 0px -8% 0px' });
io.observe(el);
const fallback = setTimeout(() => { el.style.opacity = '1'; el.style.transform = 'none'; }, 1100);
return () => { io.disconnect(); clearTimeout(fallback); };
}, []);
return React.createElement(as, { ref, style }, children);
}
function RevealLine({ children, delay = 0, as = 'span', color }) {
const ref = uR(null);
uE(() => {
if (!ref.current) return;
const el = ref.current;
el.style.opacity = '0';
el.style.transform = 'translateY(14px)';
el.style.transition = 'opacity 720ms cubic-bezier(.22,.61,.36,1), transform 720ms cubic-bezier(.22,.61,.36,1)';
const t = setTimeout(() => { el.style.opacity = '1'; el.style.transform = 'translateY(0)'; }, delay);
return () => clearTimeout(t);
}, [delay]);
return React.createElement(as, { ref, style: { display: as === 'span' ? 'inline-block' : 'block', willChange: 'opacity, transform', color } }, children);
}
// Large glowing, draggable, auto-rotating globe for the dark hero
function HeroGlobe({ data }) {
const { countries, perCountry } = data.summary;
const [topo, setTopo] = uS(null);
const rotRef = uR(18);
const [, force] = uS(0);
const autoRef = uR(true);
const dragRef = uR(null);
const metric = 'ownEver';
const vals = perCountry.map((r) => r[metric]).filter((v) => typeof v === 'number');
const max = Math.max(...vals);
uE(() => {
let raf, last = performance.now();
const tick = (t) => {
const dt = t - last; last = t;
if (autoRef.current) { rotRef.current = (rotRef.current + dt * 0.011) % 360; force((n) => n + 1); }
raf = requestAnimationFrame(tick);
};
raf = requestAnimationFrame(tick);
return () => cancelAnimationFrame(raf);
}, []);
uE(() => {
function loadScript(src) {
return new Promise((res, rej) => {
if (document.querySelector(`script[src="${src}"]`)) { res(); return; }
const s = document.createElement('script');
s.src = src; s.async = true; s.onload = res; s.onerror = rej;
document.head.appendChild(s);
});
}
(async () => {
if (!window.d3) await loadScript('https://unpkg.com/d3@7.9.0/dist/d3.min.js');
if (!window.topojson) await loadScript('https://unpkg.com/topojson-client@3.1.0/dist/topojson-client.min.js');
const url = window.__resources?.worldAtlas || 'https://unpkg.com/world-atlas@2.0.2/countries-110m.json';
const r = await fetch(url);
setTopo(await r.json());
})();
}, []);
const isoToCountry = uM(() => {
const m = {};
const map = window.COUNTRY_ISO || {};
for (const c of countries) if (map[c]) m[map[c]] = c;
return m;
}, [countries, topo]);
const valFor = (name) => { const row = perCountry[countries.indexOf(name)]; return row ? row[metric] : null; };
const colorFor = (name) => {
const v = valFor(name);
if (v == null) return '#ece1d2';
const t = Math.min(1, v / max);
return `color-mix(in srgb, var(--brand) ${Math.round((0.28 + 0.72 * t) * 100)}%, #f0e6d8)`;
};
const W = 520, H = 520;
let path = null, geo = null, sphere = null, graticule = null;
if (window.d3 && topo && window.topojson) {
const projection = window.d3.geoOrthographic().scale(248).translate([W / 2, H / 2]).rotate([rotRef.current, -12, 0]).clipAngle(90);
path = window.d3.geoPath(projection);
geo = window.topojson.feature(topo, topo.objects.countries);
sphere = { type: 'Sphere' };
graticule = window.d3.geoGraticule10();
}
const onDown = (e) => { const x = (e.touches ? e.touches[0].clientX : e.clientX); dragRef.current = { x, rot: rotRef.current }; autoRef.current = false; };
const onMove = (e) => { if (!dragRef.current) return; const x = (e.touches ? e.touches[0].clientX : e.clientX); rotRef.current = dragRef.current.rot + (x - dragRef.current.x) * 0.45; force((n) => n + 1); };
const onUp = () => { if (!dragRef.current) return; dragRef.current = null; setTimeout(() => { autoRef.current = true; }, 2500); };
return (
{!path ?
Loading globe…
:
}
);
}
function HeroBlock({ data, setRoute }) {
return (
2026 EDITION•25 countries · 25,880 respondents
Cornell Bitcoin Adoption Index
A global study of awareness, ownership, understanding, and trust in bitcoin across
25 countries — exploring whether bitcoin will be a tool for financial freedom for all.
);
}
// Animated headline stats band
function ImpactBand({ data }) {
const g = data.summary.global;
const stats = [
{ v: Math.round(g.awareness * 100), label: 'have heard of bitcoin', base: 'All respondents' },
{ v: Math.round(g.knows21M * 100), label: 'can name the 21-million supply cap', base: 'Among those aware' },
{ v: Math.round(g.financialFreedom * 100), label: 'say it increases financial freedom', base: 'Among those aware · rated 5–7 of 1–7' },
];
return (
{stats.map((s, i) => (
{s.label}
{s.base}
))}
);
}
// A single woven voice from the interviews
function VoicePull({ data }) {
const all = data.quotes?.quotes || [];
const find = (c, re) => all.find((q) => q.country === c && !q.paraphrase && re.test(q.text));
let picks = [find('EL SALVADOR', /nobody controls/), find('TURKEY', /just paper/), find('VENEZUELA', /disappear/)].filter(Boolean);
if (picks.length < 3) picks = all.filter((q) => !q.paraphrase).slice(0, 3);
return (
);
}
function StoryBlock({ n, eyebrow, dark, children }) {
return (
{n}
{eyebrow}
{children}
);
}
function StorySection({ data }) {
const g = data.summary.global;
const aware = Math.round(g.awareness * 100);
const cap = Math.round(g.knows21M * 100);
return (
<>
Bitcoin is known by nearly everyone. Understood by few.
{aware}% of people have heard of bitcoin. Yet only {cap}% can name
its single most defining rule — that no more than 21 million will ever exist.
That gap is not a trivia problem. Bitcoin is increasingly discussed as a savings
technology, a hedge against inflation, and — in some countries — a way to move money
when the banking system fails people. When a technology this consequential is
recognized by almost everyone but genuinely understood by almost no one, the door
opens to hype, mis-selling, avoidable loss, and policy built on guesswork rather than
evidence.
We set out to replace speculation with data: around the world, what do ordinary
people actually know, believe, and do about bitcoin — and where might it matter most?
One questionnaire. 25 countries. 25,880 people.
Working with the survey firm Morning Consult, we fielded a single, carefully
translated questionnaire to nationally representative samples across 25 countries
between December 2024 and March 2025. The countries were chosen to span very
different worlds — high-inflation economies and stable reserve-currency holders,
places with near-universal banking and places where millions are unbanked.
The study pairs quantitative measures — awareness, ownership,
knowledge, and perceptions, all weighted to each country's population — with
qualitative responses on people's reasons and hesitations, so the
numbers come with the human "why" behind them.
Belief in bitcoin is strongest where the financial system is weakest.
Across the study, the people most likely to say bitcoin increases their financial
freedom are not in the wealthiest democracies — they are in countries living with
inflation, currency controls, or fragile institutions. Understanding that pattern
matters far beyond markets: it shapes how governments regulate, how aid and
remittances move, how the next generation saves, and whether a borderless money
becomes a tool for inclusion or another avenue for harm.