469 lines
37 KiB
HTML
469 lines
37 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en" class="h-full">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Global Infrastructure — Vault1984</title>
|
|
<script src="https://cdn.tailwindcss.com"></script>
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500;600&display=swap" rel="stylesheet">
|
|
<script>
|
|
tailwind.config = {
|
|
theme: {
|
|
extend: {
|
|
colors: {
|
|
accent: '#22C55E',
|
|
'accent-hover': '#16A34A',
|
|
navy: { 900: '#0A1628', 800: '#0f1e35', 700: '#162540', light: '#1a2d4a' },
|
|
gold: '#c9a84c',
|
|
},
|
|
fontFamily: { sans: ['Inter', 'sans-serif'], mono: ['JetBrains Mono', 'monospace'] }
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
<style>
|
|
body { background-color: #0A1628; }
|
|
@keyframes pulse-ring { 0% { r: 4; opacity: 0.6; } 100% { r: 14; opacity: 0; } }
|
|
@keyframes pulse-dot { 0%, 100% { opacity: 1; } 50% { opacity: 0.7; } }
|
|
.pulse-dot { animation: pulse-dot 2s ease-in-out infinite; }
|
|
.pulse-ring { animation: pulse-ring 2.4s ease-out infinite; }
|
|
.pulse-ring-2 { animation: pulse-ring 2.4s ease-out infinite 0.8s; }
|
|
.pulse-ring-gold { animation: pulse-ring 2.4s ease-out infinite; fill: #c9a84c !important; }
|
|
.pulse-ring-gold-2 { animation: pulse-ring 2.4s ease-out infinite 0.8s; fill: #c9a84c !important; }
|
|
</style>
|
|
</head>
|
|
<body class="font-sans text-gray-300 antialiased">
|
|
<!-- Nav -->
|
|
<nav class="fixed top-0 w-full z-50 bg-navy-900/80 backdrop-blur-md border-b border-white/5">
|
|
<div class="max-w-6xl mx-auto px-6 h-16 flex items-center justify-between">
|
|
<a href="/" class="font-mono font-semibold text-xl text-white tracking-tight">
|
|
vault<span class="text-accent">1984</span>
|
|
</a>
|
|
<div class="hidden md:flex items-center gap-6 text-sm">
|
|
<a href="#" class="text-gray-400 hover:text-white transition-colors">GitHub</a>
|
|
<a href="/install.html" class="text-gray-400 hover:text-white transition-colors">Self-host</a>
|
|
<a href="/app/" class="border border-gray-600 text-gray-300 hover:border-gray-400 hover:text-white px-4 py-1.5 rounded-lg transition-colors text-sm">Sign in</a>
|
|
<a href="/pricing.html" class="bg-accent hover:bg-accent-hover text-black font-medium px-4 py-1.5 rounded-lg transition-colors text-sm">Get hosted — $12/yr</a>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
<main class="pt-24 pb-20 px-6">
|
|
<div class="max-w-6xl mx-auto">
|
|
|
|
<!-- Hero -->
|
|
<div class="text-center mb-6">
|
|
<p class="text-accent text-xs font-mono uppercase tracking-widest mb-4">Global Infrastructure</p>
|
|
<h1 class="text-4xl md:text-5xl font-bold text-white mb-4">
|
|
Your vault. Everywhere you are.
|
|
</h1>
|
|
<p class="text-gray-400 text-lg max-w-2xl mx-auto">
|
|
31 AWS regions. Every continent. Pick your region at signup — your data stays there.
|
|
</p>
|
|
</div>
|
|
|
|
<!-- Security callout -->
|
|
<div class="max-w-2xl mx-auto mb-12 rounded-2xl border border-green-500/20 bg-green-500/5 p-6 text-center">
|
|
<h2 class="text-lg font-semibold text-white mb-2">Location is latency. Not security.</h2>
|
|
<p class="text-gray-400 text-sm leading-relaxed">
|
|
Your L2 encryption key is derived client-side from your Touch ID or security key.
|
|
It never leaves your device. Our servers store ciphertext they cannot decrypt —
|
|
regardless of who owns the rack, the building, or the country it sits in.
|
|
</p>
|
|
</div>
|
|
|
|
<!-- World Map -->
|
|
<div class="flex justify-center mb-16">
|
|
<svg viewBox="0 0 1000 500" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-full" style="max-height:600px;">
|
|
<!-- Ocean -->
|
|
<rect width="1000" height="500" fill="#0A1628"/>
|
|
|
|
<!-- Continents -->
|
|
<!-- North America -->
|
|
<path d="M50 80 L90 60 L130 55 L170 50 L200 55 L230 70 L250 65 L270 80 L260 100 L270 120 L265 140 L250 160 L240 180 L220 200 L210 220 L195 240 L180 250 L170 240 L160 220 L140 210 L130 200 L120 190 L100 180 L90 160 L75 140 L65 120 L55 100 Z" fill="#111f38" stroke="#1e3a5f" stroke-width="0.8"/>
|
|
<!-- Greenland -->
|
|
<path d="M280 30 L310 25 L340 30 L350 50 L340 70 L310 75 L290 65 L280 45 Z" fill="#111f38" stroke="#1e3a5f" stroke-width="0.8"/>
|
|
<!-- South America -->
|
|
<path d="M200 270 L220 260 L240 265 L260 275 L280 290 L290 310 L295 340 L290 370 L280 395 L265 415 L250 430 L240 440 L230 435 L225 420 L215 400 L205 380 L195 355 L190 330 L185 310 L188 290 Z" fill="#111f38" stroke="#1e3a5f" stroke-width="0.8"/>
|
|
<!-- Europe -->
|
|
<path d="M430 55 L450 50 L470 55 L490 50 L510 55 L520 70 L530 85 L525 100 L515 115 L505 125 L490 130 L480 125 L470 135 L455 130 L445 120 L435 110 L430 95 L425 80 Z" fill="#111f38" stroke="#1e3a5f" stroke-width="0.8"/>
|
|
<!-- UK/Ireland -->
|
|
<path d="M418 72 L428 67 L433 77 L428 87 L418 84 Z" fill="#111f38" stroke="#1e3a5f" stroke-width="0.8"/>
|
|
<!-- Iberian Peninsula -->
|
|
<path d="M430 105 L445 100 L455 105 L458 120 L448 130 L435 125 L428 115 Z" fill="#111f38" stroke="#1e3a5f" stroke-width="0.8"/>
|
|
<!-- Scandinavia -->
|
|
<path d="M478 20 L488 15 L498 20 L503 35 L508 50 L503 55 L493 50 L486 40 L480 30 Z" fill="#111f38" stroke="#1e3a5f" stroke-width="0.8"/>
|
|
<!-- Africa -->
|
|
<path d="M440 150 L460 145 L480 148 L500 155 L520 165 L535 180 L545 200 L550 225 L548 250 L540 280 L530 310 L515 335 L500 350 L485 355 L470 345 L458 325 L450 300 L445 275 L440 250 L435 225 L430 200 L432 175 Z" fill="#111f38" stroke="#1e3a5f" stroke-width="0.8"/>
|
|
<!-- Middle East / Arabia -->
|
|
<path d="M545 145 L575 140 L600 145 L620 155 L625 175 L615 190 L595 195 L575 185 L558 170 L548 158 Z" fill="#111f38" stroke="#1e3a5f" stroke-width="0.8"/>
|
|
<!-- Asia -->
|
|
<path d="M530 50 L560 40 L600 35 L640 30 L680 35 L720 45 L760 55 L790 70 L810 85 L830 100 L840 120 L835 140 L820 155 L800 165 L780 170 L760 160 L740 155 L720 150 L700 155 L680 165 L660 170 L640 165 L620 155 L600 150 L580 145 L560 140 L545 130 L535 115 L530 100 L525 80 L528 65 Z" fill="#111f38" stroke="#1e3a5f" stroke-width="0.8"/>
|
|
<!-- India -->
|
|
<path d="M640 170 L660 175 L670 195 L665 220 L650 240 L635 230 L625 210 L630 190 Z" fill="#111f38" stroke="#1e3a5f" stroke-width="0.8"/>
|
|
<!-- SE Asia / Malay -->
|
|
<path d="M700 170 L720 165 L740 170 L755 180 L750 195 L735 200 L720 195 L705 185 Z" fill="#111f38" stroke="#1e3a5f" stroke-width="0.8"/>
|
|
<!-- Indonesia -->
|
|
<path d="M718 215 L740 208 L762 213 L772 223 L760 228 L740 223 L722 220 Z" fill="#111f38" stroke="#1e3a5f" stroke-width="0.8"/>
|
|
<path d="M768 218 L788 213 L800 218 L802 228 L790 232 L772 228 Z" fill="#111f38" stroke="#1e3a5f" stroke-width="0.8"/>
|
|
<!-- Japan -->
|
|
<path d="M820 88 L830 78 L840 83 L838 100 L830 110 L822 105 Z" fill="#111f38" stroke="#1e3a5f" stroke-width="0.8"/>
|
|
<!-- Korea -->
|
|
<path d="M800 115 L812 110 L820 118 L815 130 L805 132 L800 124 Z" fill="#111f38" stroke="#1e3a5f" stroke-width="0.8"/>
|
|
<!-- Australia -->
|
|
<path d="M760 310 L790 300 L820 295 L850 300 L870 315 L875 340 L865 365 L845 380 L820 385 L795 375 L775 355 L765 335 Z" fill="#111f38" stroke="#1e3a5f" stroke-width="0.8"/>
|
|
|
|
<!-- ══════════════════════════════════════════ -->
|
|
<!-- DATACENTER NODES — All 30 AWS Regions -->
|
|
<!-- ══════════════════════════════════════════ -->
|
|
|
|
<!-- AMERICAS -->
|
|
<!-- us-east-1 Virginia -->
|
|
<circle cx="232" cy="185" r="10" fill="#22C55E" fill-opacity="0.15" class="pulse-ring"/>
|
|
<circle cx="232" cy="185" r="10" fill="#22C55E" fill-opacity="0.1" class="pulse-ring-2"/>
|
|
<circle cx="232" cy="185" r="3.5" fill="#22C55E" class="pulse-dot"/>
|
|
|
|
<!-- us-east-2 Ohio -->
|
|
<circle cx="215" cy="178" r="10" fill="#22C55E" fill-opacity="0.15" class="pulse-ring" style="animation-delay:0.3s"/>
|
|
<circle cx="215" cy="178" r="10" fill="#22C55E" fill-opacity="0.1" class="pulse-ring-2" style="animation-delay:1.1s"/>
|
|
<circle cx="215" cy="178" r="3.5" fill="#22C55E" class="pulse-dot" style="animation-delay:0.3s"/>
|
|
|
|
<!-- us-west-1 N.California -->
|
|
<circle cx="110" cy="183" r="10" fill="#22C55E" fill-opacity="0.15" class="pulse-ring" style="animation-delay:0.6s"/>
|
|
<circle cx="110" cy="183" r="10" fill="#22C55E" fill-opacity="0.1" class="pulse-ring-2" style="animation-delay:1.4s"/>
|
|
<circle cx="110" cy="183" r="3.5" fill="#22C55E" class="pulse-dot" style="animation-delay:0.6s"/>
|
|
|
|
<!-- us-west-2 Oregon -->
|
|
<circle cx="107" cy="168" r="10" fill="#22C55E" fill-opacity="0.15" class="pulse-ring" style="animation-delay:0.9s"/>
|
|
<circle cx="107" cy="168" r="10" fill="#22C55E" fill-opacity="0.1" class="pulse-ring-2" style="animation-delay:1.7s"/>
|
|
<circle cx="107" cy="168" r="3.5" fill="#22C55E" class="pulse-dot" style="animation-delay:0.9s"/>
|
|
|
|
<!-- ca-central-1 Montreal -->
|
|
<circle cx="230" cy="160" r="10" fill="#22C55E" fill-opacity="0.15" class="pulse-ring" style="animation-delay:1.2s"/>
|
|
<circle cx="230" cy="160" r="10" fill="#22C55E" fill-opacity="0.1" class="pulse-ring-2" style="animation-delay:2.0s"/>
|
|
<circle cx="230" cy="160" r="3.5" fill="#22C55E" class="pulse-dot" style="animation-delay:1.2s"/>
|
|
|
|
<!-- ca-west-1 Calgary -->
|
|
<circle cx="148" cy="152" r="10" fill="#22C55E" fill-opacity="0.15" class="pulse-ring" style="animation-delay:1.5s"/>
|
|
<circle cx="148" cy="152" r="10" fill="#22C55E" fill-opacity="0.1" class="pulse-ring-2" style="animation-delay:2.3s"/>
|
|
<circle cx="148" cy="152" r="3.5" fill="#22C55E" class="pulse-dot" style="animation-delay:1.5s"/>
|
|
|
|
<!-- sa-east-1 São Paulo -->
|
|
<circle cx="257" cy="342" r="10" fill="#22C55E" fill-opacity="0.15" class="pulse-ring" style="animation-delay:0.4s"/>
|
|
<circle cx="257" cy="342" r="10" fill="#22C55E" fill-opacity="0.1" class="pulse-ring-2" style="animation-delay:1.2s"/>
|
|
<circle cx="257" cy="342" r="3.5" fill="#22C55E" class="pulse-dot" style="animation-delay:0.4s"/>
|
|
|
|
<!-- EUROPE (dense cluster) -->
|
|
<!-- eu-west-1 Ireland -->
|
|
<circle cx="422" cy="97" r="10" fill="#22C55E" fill-opacity="0.15" class="pulse-ring" style="animation-delay:0.2s"/>
|
|
<circle cx="422" cy="97" r="10" fill="#22C55E" fill-opacity="0.1" class="pulse-ring-2" style="animation-delay:1.0s"/>
|
|
<circle cx="422" cy="97" r="3.5" fill="#22C55E" class="pulse-dot" style="animation-delay:0.2s"/>
|
|
|
|
<!-- eu-west-2 London -->
|
|
<circle cx="441" cy="96" r="10" fill="#22C55E" fill-opacity="0.15" class="pulse-ring" style="animation-delay:0.7s"/>
|
|
<circle cx="441" cy="96" r="10" fill="#22C55E" fill-opacity="0.1" class="pulse-ring-2" style="animation-delay:1.5s"/>
|
|
<circle cx="441" cy="96" r="3.5" fill="#22C55E" class="pulse-dot" style="animation-delay:0.7s"/>
|
|
|
|
<!-- eu-west-3 Paris -->
|
|
<circle cx="460" cy="103" r="10" fill="#22C55E" fill-opacity="0.15" class="pulse-ring" style="animation-delay:1.1s"/>
|
|
<circle cx="460" cy="103" r="10" fill="#22C55E" fill-opacity="0.1" class="pulse-ring-2" style="animation-delay:1.9s"/>
|
|
<circle cx="460" cy="103" r="3.5" fill="#22C55E" class="pulse-dot" style="animation-delay:1.1s"/>
|
|
|
|
<!-- eu-central-1 Frankfurt -->
|
|
<circle cx="479" cy="100" r="10" fill="#22C55E" fill-opacity="0.15" class="pulse-ring" style="animation-delay:0.5s"/>
|
|
<circle cx="479" cy="100" r="10" fill="#22C55E" fill-opacity="0.1" class="pulse-ring-2" style="animation-delay:1.3s"/>
|
|
<circle cx="479" cy="100" r="3.5" fill="#22C55E" class="pulse-dot" style="animation-delay:0.5s"/>
|
|
|
|
<!-- eu-central-2 Zurich — GOLD HQ NODE -->
|
|
<circle cx="481" cy="113" r="12" fill="#c9a84c" fill-opacity="0.2" class="pulse-ring-gold"/>
|
|
<circle cx="481" cy="113" r="12" fill="#c9a84c" fill-opacity="0.1" class="pulse-ring-gold-2"/>
|
|
<circle cx="481" cy="113" r="4.5" fill="#c9a84c" class="pulse-dot"/>
|
|
|
|
<!-- eu-south-1 Milan -->
|
|
<circle cx="483" cy="122" r="10" fill="#22C55E" fill-opacity="0.15" class="pulse-ring" style="animation-delay:1.3s"/>
|
|
<circle cx="483" cy="122" r="10" fill="#22C55E" fill-opacity="0.1" class="pulse-ring-2" style="animation-delay:2.1s"/>
|
|
<circle cx="483" cy="122" r="3.5" fill="#22C55E" class="pulse-dot" style="animation-delay:1.3s"/>
|
|
|
|
<!-- eu-south-2 Spain -->
|
|
<circle cx="447" cy="122" r="10" fill="#22C55E" fill-opacity="0.15" class="pulse-ring" style="animation-delay:0.8s"/>
|
|
<circle cx="447" cy="122" r="10" fill="#22C55E" fill-opacity="0.1" class="pulse-ring-2" style="animation-delay:1.6s"/>
|
|
<circle cx="447" cy="122" r="3.5" fill="#22C55E" class="pulse-dot" style="animation-delay:0.8s"/>
|
|
|
|
<!-- eu-north-1 Stockholm -->
|
|
<circle cx="496" cy="68" r="10" fill="#22C55E" fill-opacity="0.15" class="pulse-ring" style="animation-delay:1.6s"/>
|
|
<circle cx="496" cy="68" r="10" fill="#22C55E" fill-opacity="0.1" class="pulse-ring-2" style="animation-delay:2.4s"/>
|
|
<circle cx="496" cy="68" r="3.5" fill="#22C55E" class="pulse-dot" style="animation-delay:1.6s"/>
|
|
|
|
<!-- MIDDLE EAST -->
|
|
<!-- me-south-1 Bahrain -->
|
|
<circle cx="597" cy="173" r="10" fill="#22C55E" fill-opacity="0.15" class="pulse-ring" style="animation-delay:0.3s"/>
|
|
<circle cx="597" cy="173" r="10" fill="#22C55E" fill-opacity="0.1" class="pulse-ring-2" style="animation-delay:1.1s"/>
|
|
<circle cx="597" cy="173" r="3.5" fill="#22C55E" class="pulse-dot" style="animation-delay:0.3s"/>
|
|
|
|
<!-- me-central-1 UAE/Dubai -->
|
|
<circle cx="610" cy="181" r="10" fill="#22C55E" fill-opacity="0.15" class="pulse-ring" style="animation-delay:1.0s"/>
|
|
<circle cx="610" cy="181" r="10" fill="#22C55E" fill-opacity="0.1" class="pulse-ring-2" style="animation-delay:1.8s"/>
|
|
<circle cx="610" cy="181" r="3.5" fill="#22C55E" class="pulse-dot" style="animation-delay:1.0s"/>
|
|
|
|
<!-- il-central-1 Tel Aviv -->
|
|
<circle cx="553" cy="148" r="10" fill="#22C55E" fill-opacity="0.15" class="pulse-ring" style="animation-delay:0.6s"/>
|
|
<circle cx="553" cy="148" r="10" fill="#22C55E" fill-opacity="0.1" class="pulse-ring-2" style="animation-delay:1.4s"/>
|
|
<circle cx="553" cy="148" r="3.5" fill="#22C55E" class="pulse-dot" style="animation-delay:0.6s"/>
|
|
|
|
<!-- AFRICA -->
|
|
<!-- af-south-1 Cape Town -->
|
|
<circle cx="494" cy="372" r="10" fill="#22C55E" fill-opacity="0.15" class="pulse-ring" style="animation-delay:1.4s"/>
|
|
<circle cx="494" cy="372" r="10" fill="#22C55E" fill-opacity="0.1" class="pulse-ring-2" style="animation-delay:2.2s"/>
|
|
<circle cx="494" cy="372" r="3.5" fill="#22C55E" class="pulse-dot" style="animation-delay:1.4s"/>
|
|
|
|
<!-- ASIA -->
|
|
<!-- ap-south-1 Mumbai -->
|
|
<circle cx="640" cy="188" r="10" fill="#22C55E" fill-opacity="0.15" class="pulse-ring" style="animation-delay:0.2s"/>
|
|
<circle cx="640" cy="188" r="10" fill="#22C55E" fill-opacity="0.1" class="pulse-ring-2" style="animation-delay:1.0s"/>
|
|
<circle cx="640" cy="188" r="3.5" fill="#22C55E" class="pulse-dot" style="animation-delay:0.2s"/>
|
|
|
|
<!-- ap-south-2 Hyderabad -->
|
|
<circle cx="652" cy="199" r="10" fill="#22C55E" fill-opacity="0.15" class="pulse-ring" style="animation-delay:0.9s"/>
|
|
<circle cx="652" cy="199" r="10" fill="#22C55E" fill-opacity="0.1" class="pulse-ring-2" style="animation-delay:1.7s"/>
|
|
<circle cx="652" cy="199" r="3.5" fill="#22C55E" class="pulse-dot" style="animation-delay:0.9s"/>
|
|
|
|
<!-- ap-southeast-1 Singapore -->
|
|
<circle cx="726" cy="240" r="10" fill="#22C55E" fill-opacity="0.15" class="pulse-ring" style="animation-delay:0.4s"/>
|
|
<circle cx="726" cy="240" r="10" fill="#22C55E" fill-opacity="0.1" class="pulse-ring-2" style="animation-delay:1.2s"/>
|
|
<circle cx="726" cy="240" r="3.5" fill="#22C55E" class="pulse-dot" style="animation-delay:0.4s"/>
|
|
|
|
<!-- ap-southeast-3 Jakarta -->
|
|
<circle cx="730" cy="260" r="10" fill="#22C55E" fill-opacity="0.15" class="pulse-ring" style="animation-delay:1.1s"/>
|
|
<circle cx="730" cy="260" r="10" fill="#22C55E" fill-opacity="0.1" class="pulse-ring-2" style="animation-delay:1.9s"/>
|
|
<circle cx="730" cy="260" r="3.5" fill="#22C55E" class="pulse-dot" style="animation-delay:1.1s"/>
|
|
|
|
<!-- ap-southeast-2 Sydney -->
|
|
<circle cx="843" cy="365" r="10" fill="#22C55E" fill-opacity="0.15" class="pulse-ring" style="animation-delay:0.7s"/>
|
|
<circle cx="843" cy="365" r="10" fill="#22C55E" fill-opacity="0.1" class="pulse-ring-2" style="animation-delay:1.5s"/>
|
|
<circle cx="843" cy="365" r="3.5" fill="#22C55E" class="pulse-dot" style="animation-delay:0.7s"/>
|
|
|
|
<!-- ap-southeast-4 Melbourne -->
|
|
<circle cx="828" cy="378" r="10" fill="#22C55E" fill-opacity="0.15" class="pulse-ring" style="animation-delay:1.5s"/>
|
|
<circle cx="828" cy="378" r="10" fill="#22C55E" fill-opacity="0.1" class="pulse-ring-2" style="animation-delay:2.3s"/>
|
|
<circle cx="828" cy="378" r="3.5" fill="#22C55E" class="pulse-dot" style="animation-delay:1.5s"/>
|
|
|
|
<!-- ap-northeast-1 Tokyo -->
|
|
<circle cx="833" cy="130" r="10" fill="#22C55E" fill-opacity="0.15" class="pulse-ring" style="animation-delay:0.5s"/>
|
|
<circle cx="833" cy="130" r="10" fill="#22C55E" fill-opacity="0.1" class="pulse-ring-2" style="animation-delay:1.3s"/>
|
|
<circle cx="833" cy="130" r="3.5" fill="#22C55E" class="pulse-dot" style="animation-delay:0.5s"/>
|
|
|
|
<!-- ap-northeast-3 Osaka -->
|
|
<circle cx="827" cy="141" r="10" fill="#22C55E" fill-opacity="0.15" class="pulse-ring" style="animation-delay:1.2s"/>
|
|
<circle cx="827" cy="141" r="10" fill="#22C55E" fill-opacity="0.1" class="pulse-ring-2" style="animation-delay:2.0s"/>
|
|
<circle cx="827" cy="141" r="3.5" fill="#22C55E" class="pulse-dot" style="animation-delay:1.2s"/>
|
|
|
|
<!-- ap-northeast-2 Seoul -->
|
|
<circle cx="812" cy="128" r="10" fill="#22C55E" fill-opacity="0.15" class="pulse-ring" style="animation-delay:0.8s"/>
|
|
<circle cx="812" cy="128" r="10" fill="#22C55E" fill-opacity="0.1" class="pulse-ring-2" style="animation-delay:1.6s"/>
|
|
<circle cx="812" cy="128" r="3.5" fill="#22C55E" class="pulse-dot" style="animation-delay:0.8s"/>
|
|
|
|
<!-- ap-east-1 Hong Kong -->
|
|
<circle cx="789" cy="167" r="10" fill="#22C55E" fill-opacity="0.15" class="pulse-ring" style="animation-delay:0.1s"/>
|
|
<circle cx="789" cy="167" r="10" fill="#22C55E" fill-opacity="0.1" class="pulse-ring-2" style="animation-delay:0.9s"/>
|
|
<circle cx="789" cy="167" r="3.5" fill="#22C55E" class="pulse-dot" style="animation-delay:0.1s"/>
|
|
|
|
|
|
<!-- mx-central-1 Mexico City -->
|
|
<circle cx="158" cy="215" r="10" fill="#22C55E" fill-opacity="0.15" class="pulse-ring" style="animation-delay:1.8s"/>
|
|
<circle cx="158" cy="215" r="10" fill="#22C55E" fill-opacity="0.1" class="pulse-ring-2" style="animation-delay:2.6s"/>
|
|
<circle cx="158" cy="215" r="3.5" fill="#22C55E" class="pulse-dot" style="animation-delay:1.8s"/>
|
|
|
|
<!-- ap-southeast-5 Malaysia / Kuala Lumpur -->
|
|
<circle cx="718" cy="255" r="10" fill="#22C55E" fill-opacity="0.15" class="pulse-ring" style="animation-delay:0.6s"/>
|
|
<circle cx="718" cy="255" r="10" fill="#22C55E" fill-opacity="0.1" class="pulse-ring-2" style="animation-delay:1.4s"/>
|
|
<circle cx="718" cy="255" r="3.5" fill="#22C55E" class="pulse-dot" style="animation-delay:0.6s"/>
|
|
|
|
<!-- Legend -->
|
|
<circle cx="32" cy="468" r="5" fill="#c9a84c"/>
|
|
<text x="44" y="472" font-family="Inter, sans-serif" font-size="11" fill="#94a3b8">Headquarters (Zürich)</text>
|
|
<circle cx="32" cy="486" r="5" fill="#22C55E"/>
|
|
<text x="44" y="490" font-family="Inter, sans-serif" font-size="11" fill="#94a3b8">AWS Region (30 total)</text>
|
|
</svg>
|
|
</div>
|
|
|
|
<!-- Region Grid -->
|
|
<div class="mb-12">
|
|
<h2 class="text-xl font-semibold text-white text-center mb-8">All 31 regions</h2>
|
|
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-3 max-w-5xl mx-auto">
|
|
|
|
<!-- Americas -->
|
|
<div class="col-span-full">
|
|
<p class="text-xs font-mono text-gray-500 uppercase tracking-widest mb-3">Americas</p>
|
|
</div>
|
|
<div class="flex items-center gap-3 bg-white/3 rounded-lg px-4 py-3 border border-white/5">
|
|
<span class="w-2 h-2 rounded-full bg-accent flex-shrink-0"></span>
|
|
<div><div class="text-white text-sm font-medium">N. Virginia</div><div class="text-gray-500 text-xs font-mono">us-east-1</div></div>
|
|
</div>
|
|
<div class="flex items-center gap-3 bg-white/3 rounded-lg px-4 py-3 border border-white/5">
|
|
<span class="w-2 h-2 rounded-full bg-accent flex-shrink-0"></span>
|
|
<div><div class="text-white text-sm font-medium">Ohio</div><div class="text-gray-500 text-xs font-mono">us-east-2</div></div>
|
|
</div>
|
|
<div class="flex items-center gap-3 bg-white/3 rounded-lg px-4 py-3 border border-white/5">
|
|
<span class="w-2 h-2 rounded-full bg-accent flex-shrink-0"></span>
|
|
<div><div class="text-white text-sm font-medium">N. California</div><div class="text-gray-500 text-xs font-mono">us-west-1</div></div>
|
|
</div>
|
|
<div class="flex items-center gap-3 bg-white/3 rounded-lg px-4 py-3 border border-white/5">
|
|
<span class="w-2 h-2 rounded-full bg-accent flex-shrink-0"></span>
|
|
<div><div class="text-white text-sm font-medium">Oregon</div><div class="text-gray-500 text-xs font-mono">us-west-2</div></div>
|
|
</div>
|
|
<div class="flex items-center gap-3 bg-white/3 rounded-lg px-4 py-3 border border-white/5">
|
|
<span class="w-2 h-2 rounded-full bg-accent flex-shrink-0"></span>
|
|
<div><div class="text-white text-sm font-medium">Montreal</div><div class="text-gray-500 text-xs font-mono">ca-central-1</div></div>
|
|
</div>
|
|
<div class="flex items-center gap-3 bg-white/3 rounded-lg px-4 py-3 border border-white/5">
|
|
<span class="w-2 h-2 rounded-full bg-accent flex-shrink-0"></span>
|
|
<div><div class="text-white text-sm font-medium">Calgary</div><div class="text-gray-500 text-xs font-mono">ca-west-1</div></div>
|
|
</div>
|
|
<div class="flex items-center gap-3 bg-white/3 rounded-lg px-4 py-3 border border-white/5">
|
|
<span class="w-2 h-2 rounded-full bg-accent flex-shrink-0"></span>
|
|
<div><div class="text-white text-sm font-medium">Mexico City</div><div class="text-gray-500 text-xs font-mono">mx-central-1</div></div>
|
|
</div>
|
|
<div class="flex items-center gap-3 bg-white/3 rounded-lg px-4 py-3 border border-white/5">
|
|
<span class="w-2 h-2 rounded-full bg-accent flex-shrink-0"></span>
|
|
<div><div class="text-white text-sm font-medium">São Paulo</div><div class="text-gray-500 text-xs font-mono">sa-east-1</div></div>
|
|
</div>
|
|
|
|
<!-- Europe -->
|
|
<div class="col-span-full mt-4">
|
|
<p class="text-xs font-mono text-gray-500 uppercase tracking-widest mb-3">Europe</p>
|
|
</div>
|
|
<div class="flex items-center gap-3 bg-white/3 rounded-lg px-4 py-3 border border-white/5">
|
|
<span class="w-2 h-2 rounded-full bg-accent flex-shrink-0"></span>
|
|
<div><div class="text-white text-sm font-medium">Ireland</div><div class="text-gray-500 text-xs font-mono">eu-west-1</div></div>
|
|
</div>
|
|
<div class="flex items-center gap-3 bg-white/3 rounded-lg px-4 py-3 border border-white/5">
|
|
<span class="w-2 h-2 rounded-full bg-accent flex-shrink-0"></span>
|
|
<div><div class="text-white text-sm font-medium">London</div><div class="text-gray-500 text-xs font-mono">eu-west-2</div></div>
|
|
</div>
|
|
<div class="flex items-center gap-3 bg-white/3 rounded-lg px-4 py-3 border border-white/5">
|
|
<span class="w-2 h-2 rounded-full bg-accent flex-shrink-0"></span>
|
|
<div><div class="text-white text-sm font-medium">Paris</div><div class="text-gray-500 text-xs font-mono">eu-west-3</div></div>
|
|
</div>
|
|
<div class="flex items-center gap-3 bg-white/3 rounded-lg px-4 py-3 border border-white/5">
|
|
<span class="w-2 h-2 rounded-full bg-accent flex-shrink-0"></span>
|
|
<div><div class="text-white text-sm font-medium">Frankfurt</div><div class="text-gray-500 text-xs font-mono">eu-central-1</div></div>
|
|
</div>
|
|
<div class="flex items-center gap-3 bg-white/3 rounded-lg px-4 py-3 border border-gold/20 bg-gold/5">
|
|
<span class="w-2 h-2 rounded-full flex-shrink-0" style="background:#c9a84c"></span>
|
|
<div><div class="text-white text-sm font-medium">Zürich <span class="text-xs font-mono text-gold ml-1">HQ</span></div><div class="text-gray-500 text-xs font-mono">eu-central-2</div></div>
|
|
</div>
|
|
<div class="flex items-center gap-3 bg-white/3 rounded-lg px-4 py-3 border border-white/5">
|
|
<span class="w-2 h-2 rounded-full bg-accent flex-shrink-0"></span>
|
|
<div><div class="text-white text-sm font-medium">Milan</div><div class="text-gray-500 text-xs font-mono">eu-south-1</div></div>
|
|
</div>
|
|
<div class="flex items-center gap-3 bg-white/3 rounded-lg px-4 py-3 border border-white/5">
|
|
<span class="w-2 h-2 rounded-full bg-accent flex-shrink-0"></span>
|
|
<div><div class="text-white text-sm font-medium">Spain</div><div class="text-gray-500 text-xs font-mono">eu-south-2</div></div>
|
|
</div>
|
|
<div class="flex items-center gap-3 bg-white/3 rounded-lg px-4 py-3 border border-white/5">
|
|
<span class="w-2 h-2 rounded-full bg-accent flex-shrink-0"></span>
|
|
<div><div class="text-white text-sm font-medium">Stockholm</div><div class="text-gray-500 text-xs font-mono">eu-north-1</div></div>
|
|
</div>
|
|
|
|
<!-- Middle East & Africa -->
|
|
<div class="col-span-full mt-4">
|
|
<p class="text-xs font-mono text-gray-500 uppercase tracking-widest mb-3">Middle East & Africa</p>
|
|
</div>
|
|
<div class="flex items-center gap-3 bg-white/3 rounded-lg px-4 py-3 border border-white/5">
|
|
<span class="w-2 h-2 rounded-full bg-accent flex-shrink-0"></span>
|
|
<div><div class="text-white text-sm font-medium">Bahrain</div><div class="text-gray-500 text-xs font-mono">me-south-1</div></div>
|
|
</div>
|
|
<div class="flex items-center gap-3 bg-white/3 rounded-lg px-4 py-3 border border-white/5">
|
|
<span class="w-2 h-2 rounded-full bg-accent flex-shrink-0"></span>
|
|
<div><div class="text-white text-sm font-medium">UAE / Dubai</div><div class="text-gray-500 text-xs font-mono">me-central-1</div></div>
|
|
</div>
|
|
<div class="flex items-center gap-3 bg-white/3 rounded-lg px-4 py-3 border border-white/5">
|
|
<span class="w-2 h-2 rounded-full bg-accent flex-shrink-0"></span>
|
|
<div><div class="text-white text-sm font-medium">Tel Aviv</div><div class="text-gray-500 text-xs font-mono">il-central-1</div></div>
|
|
</div>
|
|
<div class="flex items-center gap-3 bg-white/3 rounded-lg px-4 py-3 border border-white/5">
|
|
<span class="w-2 h-2 rounded-full bg-accent flex-shrink-0"></span>
|
|
<div><div class="text-white text-sm font-medium">Cape Town</div><div class="text-gray-500 text-xs font-mono">af-south-1</div></div>
|
|
</div>
|
|
|
|
<!-- Asia Pacific -->
|
|
<div class="col-span-full mt-4">
|
|
<p class="text-xs font-mono text-gray-500 uppercase tracking-widest mb-3">Asia Pacific</p>
|
|
</div>
|
|
<div class="flex items-center gap-3 bg-white/3 rounded-lg px-4 py-3 border border-white/5">
|
|
<span class="w-2 h-2 rounded-full bg-accent flex-shrink-0"></span>
|
|
<div><div class="text-white text-sm font-medium">Mumbai</div><div class="text-gray-500 text-xs font-mono">ap-south-1</div></div>
|
|
</div>
|
|
<div class="flex items-center gap-3 bg-white/3 rounded-lg px-4 py-3 border border-white/5">
|
|
<span class="w-2 h-2 rounded-full bg-accent flex-shrink-0"></span>
|
|
<div><div class="text-white text-sm font-medium">Hyderabad</div><div class="text-gray-500 text-xs font-mono">ap-south-2</div></div>
|
|
</div>
|
|
<div class="flex items-center gap-3 bg-white/3 rounded-lg px-4 py-3 border border-white/5">
|
|
<span class="w-2 h-2 rounded-full bg-accent flex-shrink-0"></span>
|
|
<div><div class="text-white text-sm font-medium">Singapore</div><div class="text-gray-500 text-xs font-mono">ap-southeast-1</div></div>
|
|
</div>
|
|
<div class="flex items-center gap-3 bg-white/3 rounded-lg px-4 py-3 border border-white/5">
|
|
<span class="w-2 h-2 rounded-full bg-accent flex-shrink-0"></span>
|
|
<div><div class="text-white text-sm font-medium">Malaysia / KL</div><div class="text-gray-500 text-xs font-mono">ap-southeast-5</div></div>
|
|
</div>
|
|
<div class="flex items-center gap-3 bg-white/3 rounded-lg px-4 py-3 border border-white/5">
|
|
<span class="w-2 h-2 rounded-full bg-accent flex-shrink-0"></span>
|
|
<div><div class="text-white text-sm font-medium">Jakarta</div><div class="text-gray-500 text-xs font-mono">ap-southeast-3</div></div>
|
|
</div>
|
|
<div class="flex items-center gap-3 bg-white/3 rounded-lg px-4 py-3 border border-white/5">
|
|
<span class="w-2 h-2 rounded-full bg-accent flex-shrink-0"></span>
|
|
<div><div class="text-white text-sm font-medium">Sydney</div><div class="text-gray-500 text-xs font-mono">ap-southeast-2</div></div>
|
|
</div>
|
|
<div class="flex items-center gap-3 bg-white/3 rounded-lg px-4 py-3 border border-white/5">
|
|
<span class="w-2 h-2 rounded-full bg-accent flex-shrink-0"></span>
|
|
<div><div class="text-white text-sm font-medium">Melbourne</div><div class="text-gray-500 text-xs font-mono">ap-southeast-4</div></div>
|
|
</div>
|
|
<div class="flex items-center gap-3 bg-white/3 rounded-lg px-4 py-3 border border-white/5">
|
|
<span class="w-2 h-2 rounded-full bg-accent flex-shrink-0"></span>
|
|
<div><div class="text-white text-sm font-medium">Tokyo</div><div class="text-gray-500 text-xs font-mono">ap-northeast-1</div></div>
|
|
</div>
|
|
<div class="flex items-center gap-3 bg-white/3 rounded-lg px-4 py-3 border border-white/5">
|
|
<span class="w-2 h-2 rounded-full bg-accent flex-shrink-0"></span>
|
|
<div><div class="text-white text-sm font-medium">Osaka</div><div class="text-gray-500 text-xs font-mono">ap-northeast-3</div></div>
|
|
</div>
|
|
<div class="flex items-center gap-3 bg-white/3 rounded-lg px-4 py-3 border border-white/5">
|
|
<span class="w-2 h-2 rounded-full bg-accent flex-shrink-0"></span>
|
|
<div><div class="text-white text-sm font-medium">Seoul</div><div class="text-gray-500 text-xs font-mono">ap-northeast-2</div></div>
|
|
</div>
|
|
<div class="flex items-center gap-3 bg-white/3 rounded-lg px-4 py-3 border border-white/5">
|
|
<span class="w-2 h-2 rounded-full bg-accent flex-shrink-0"></span>
|
|
<div><div class="text-white text-sm font-medium">Hong Kong</div><div class="text-gray-500 text-xs font-mono">ap-east-1</div></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- CTA -->
|
|
<div class="text-center">
|
|
<a href="/pricing.html" class="inline-block bg-accent hover:bg-accent-hover text-black font-semibold px-8 py-3 rounded-lg transition-colors mr-4">
|
|
Get hosted — $12/yr
|
|
</a>
|
|
<a href="/install.html" class="inline-block border border-gray-600 text-gray-300 hover:border-gray-400 hover:text-white font-medium px-8 py-3 rounded-lg transition-colors">
|
|
Self-host instead
|
|
</a>
|
|
</div>
|
|
|
|
</div>
|
|
</main>
|
|
|
|
<!-- Footer -->
|
|
<footer class="border-t border-white/5 py-10 px-6">
|
|
<div class="max-w-6xl mx-auto flex flex-col md:flex-row items-center justify-between gap-4">
|
|
<span class="font-mono font-semibold text-white">vault<span class="text-accent">1984</span></span>
|
|
<div class="flex gap-6 text-sm text-gray-500">
|
|
<a href="/privacy.html" class="hover:text-gray-300 transition-colors">Privacy</a>
|
|
<a href="/terms.html" class="hover:text-gray-300 transition-colors">Terms</a>
|
|
<a href="/install.html" class="hover:text-gray-300 transition-colors">Self-host</a>
|
|
</div>
|
|
<span class="text-gray-600 text-sm">© 2025 Vault1984. All rights reserved.</span>
|
|
</div>
|
|
</footer>
|
|
</body>
|
|
</html>
|