411 lines
26 KiB
HTML
411 lines
26 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<title>BlackBox – Privacy and Security Ecosystem</title>
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=5.0, minimum-scale=0.5, viewport-fit=cover">
|
||
<meta name="description" content="BlackBox — physical device for multi-level privacy: VPN, anonymous email, private messenger, decentralized hosting, secure file transfer, crypto operations. Deep dynamic comparison — all in one device.">
|
||
<meta name="keywords" content="BlackBox, privacy, security, VPN, ecosystem, router, anonymous email, private messenger, decentralized hosting, secure file transfer, crypto operations">
|
||
<link href="/css/tailwind.min.css" rel="stylesheet">
|
||
<link href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@6.5.2/css/all.min.css" rel="stylesheet">
|
||
<link href="https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Montserrat+Alternates:wght@700;500&family=Montserrat:wght@700;500;400&family=Inter:wght@400;600&display=swap" rel="stylesheet">
|
||
<script src="/js/echarts.min.js"></script>
|
||
<link rel="stylesheet" href="/css/style.css">
|
||
<!-- Open Graph Meta Tags for Social Media -->
|
||
<meta property="og:title" content="BlackBox – Privacy and Security Ecosystem">
|
||
<meta property="og:description" content="BlackBox — physical device for multi-level privacy: VPN, anonymous email, private messenger, decentralized hosting, secure file transfer, crypto operations.">
|
||
<meta property="og:image" content="/images/scales.webp">
|
||
<meta property="og:url" content="https://bbox.wtf">
|
||
<meta property="og:type" content="website">
|
||
|
||
<!-- Twitter Card Meta Tags -->
|
||
<meta name="twitter:card" content="summary_large_image">
|
||
<meta name="twitter:title" content="BlackBox – Privacy and Security Ecosystem">
|
||
<meta name="twitter:description" content="BlackBox — physical device for multi-level privacy: VPN, anonymous email, private messenger, decentralized hosting, secure file transfer, crypto operations.">
|
||
<meta name="twitter:image" content="/images/scales.webp">
|
||
</head>
|
||
<body class="gradient-bg overflow-x-hidden">
|
||
|
||
<!-- HEADER -->
|
||
<header class="flex flex-wrap justify-between items-center px-5 md:px-10 py-7 bg-transparent z-10 relative">
|
||
<a href="/en/" class="flex items-center space-x-4">
|
||
<img src="/images/logo.webp" alt="bbox logo" class="w-14 h-14 rounded-lg shadow-lg">
|
||
<span class="font-montserrat font-bold text-2xl text-cyan-400 tracking-widest">BlackBox</span>
|
||
</a>
|
||
<nav class="hidden md:flex space-x-8 text-lg font-montserrat font-semibold">
|
||
<a href="/en/#features" class="hover:text-cyan-400 transition-colors">Features</a>
|
||
<a href="/en/#supercompare" class="hover:text-cyan-400 transition-colors">Comparison</a>
|
||
<a href="/en/#pricing" class="hover:text-cyan-400 transition-colors">Pricing</a>
|
||
<a href="/en/#testimonials" class="hover:text-cyan-400 transition-colors">Testimonials</a>
|
||
<a href="/pages/products.html" class="hover:text-cyan-400 transition-colors">Catalog</a>
|
||
</nav>
|
||
<a href="#order" class="pulse-cta rounded-xl px-7 py-3 bg-emerald-500 text-white text-lg font-bold shadow-lg hover:bg-emerald-400 transition-all duration-300 transform hover:scale-105" style="font-family: 'Montserrat', sans-serif; box-shadow: 0 0 15px 5px rgba(16, 185, 129, 0.5);">
|
||
Order Now
|
||
<i class="fas fa-lock ml-2"></i>
|
||
</a>
|
||
</header>
|
||
|
||
<!-- MAIN SECTION -->
|
||
<section class="pt-10 pb-14 md:pt-18 md:pb-32 px-5 lg:px-0 flex flex-col items-center text-center relative overflow-visible bg-gradient-to-b from-black/90 to-gray-950 z-0">
|
||
<div class="w-full mx-auto shadow-3d transition-all duration-300" style="background: url('/images/banner-image.webp') center/cover no-repeat; padding: 2rem; border-radius: 1rem;">
|
||
<h1 class="text-3xl md:text-5xl lg:text-6xl leading-tight mb-6 fade-up text-white" style="--delay:.1s; text-shadow: 0 2px 4px rgba(0,0,0,0.5);">
|
||
<span class="font-montserrat-alternates font-medium">Complete</span><br class="hidden md:inline">
|
||
<span class="font-bebas-neue">PRIVACY</span><br class="hidden lg:inline">
|
||
<span class="font-montserrat-alternates font-medium">Ecosystem</span><br>
|
||
<span class="text-cyan-400 font-montserrat">in one device</span>
|
||
</h1>
|
||
<p class="text-xl md:text-2xl max-w-2xl mx-auto mb-10 text-white fade-up" style="--delay:.3s">
|
||
BlackBox is not just a VPN.<br>
|
||
It's an innovative hardware solution that combines privacy tools, communication and tracking protection at a level impossible with regular VPN services and routers!
|
||
</p>
|
||
<div class="flex flex-col md:flex-row gap-4 items-center justify-center fade-up" style="--delay:.55s">
|
||
<a href="#order" class="pulse-cta px-12 py-4 rounded-2xl text-white font-extrabold font-montserrat bg-gradient-to-r from-emerald-500 to-green-500 text-2xl shadow-3d hover:from-emerald-400 hover:to-green-400 transform-gpu transition-all duration-300 hover:scale-105" style="box-shadow: 0 0 20px 8px rgba(16, 185, 129, 0.6);">Buy with discount</a>
|
||
<a href="#supercompare" class="px-10 py-4 rounded-2xl border-2 border-cyan-400 text-cyan-300 bg-transparent font-bold text-xl font-montserrat hover:bg-cyan-700/10 transition">Dynamic comparison</a>
|
||
</div>
|
||
</div>
|
||
<div class="mt-14 mb-8 relative flex justify-center fade-up" style="--delay:.85s;">
|
||
<img src="/images/scales.webp" alt="BlackBox Device" class="hero-3d rounded-3xl w-[370px] md:w-[470px] z-10" draggable="false">
|
||
<div class="absolute -bottom-4 left-1/2 -translate-x-1/2 w-72 h-16 bg-cyan-400/10 rounded-full blur-2xl z-0"></div>
|
||
</div>
|
||
<div class="mt-4 max-w-2xl mx-auto fade-up" style="--delay:1.1s;">
|
||
<span class="inline-flex items-center px-4 py-1 rounded-full bg-cyan-800/20 text-cyan-200 font-semibold text-lg animate-pulse">
|
||
<i class="fas fa-bolt text-yellow-300 mr-2"></i>
|
||
30% discount on pre-orders until June 1st!
|
||
</span>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- SUPER DYNAMIC COMPARISON -->
|
||
<section id="supercompare" class="max-w-5xl mx-auto py-14 px-5 fade-up" style="--delay:.1s">
|
||
<h2 class="text-3xl md:text-4xl font-black font-montserrat text-cyan-400 mb-5 text-center tracking-tight">
|
||
Dynamic comparison: <span class="text-white">BlackBox</span> vs VPN and routers
|
||
</h2>
|
||
<p class="text-lg text-gray-300 max-w-2xl mx-auto mb-10 text-center">
|
||
<span class="text-cyan-300 font-bold">BlackBox</span> is a <span class="underline">privacy ecosystem</span>. See how feature support expands compared to simple VPN services and hardware routers.
|
||
</p>
|
||
|
||
<div class="glass-card shadow-3d p-8 mb-8">
|
||
<div class="grid grid-cols-4 gap-4 mb-6">
|
||
<div class="col-span-1 font-bold text-gray-300 text-right pr-4">Features</div>
|
||
<div class="col-span-1 font-bold text-cyan-400 text-center">BlackBox</div>
|
||
<div class="col-span-1 font-bold text-blue-400 text-center">VPN Router</div>
|
||
<div class="col-span-1 font-bold text-purple-400 text-center">VPN Service</div>
|
||
</div>
|
||
|
||
<div id="featuresContainer">
|
||
<!-- Features will be inserted here by JS -->
|
||
</div>
|
||
|
||
<div class="text-gray-400 mt-6 text-base">
|
||
<i class="fas fa-info-circle text-cyan-300"></i>
|
||
<span class="ml-1">Hover over a row to see details about each feature</span>
|
||
</div>
|
||
<div id="dynCompareHint" class="font-mono text-sm mt-3 p-3 bg-gray-800/50 rounded-lg"></div>
|
||
</div>
|
||
</section>
|
||
|
||
|
||
<!-- FEATURES -->
|
||
<section id="features" class="max-w-7xl mx-auto mt-8 lg:mt-0 py-13 px-5">
|
||
<h2 class="text-3xl md:text-4xl font-bold font-montserrat text-cyan-400 mb-7 fade-up" style="--delay:.15s">BlackBox: Ecosystem Advantages</h2>
|
||
<div class="grid md:grid-cols-2 lg:grid-cols-3 gap-8 fade-up" style="--delay:.22s">
|
||
<div class="glass-card shadow-3d p-8 transition hover:scale-105">
|
||
<i class="fas fa-user-secret text-cyan-300 text-4xl mb-4"></i>
|
||
<h3 class="font-bold text-xl mb-2">All privacy tools</h3>
|
||
<p class="text-gray-300">VPN, messenger, email, files, wallet and hosting — in one mini-computer. No need to search for separate services!</p>
|
||
</div>
|
||
<div class="glass-card shadow-3d p-8 transition hover:scale-105">
|
||
<i class="fas fa-globe text-cyan-400 text-4xl mb-4"></i>
|
||
<h3 class="font-bold text-xl mb-2">Anonymous internet & darknet</h3>
|
||
<p class="text-gray-300">Secure access to all services, including onion and decentralized internet — even if blocked by your provider.</p>
|
||
</div>
|
||
<div class="glass-card shadow-3d p-8 transition hover:scale-105">
|
||
<i class="fas fa-comments text-purple-300 text-4xl mb-4"></i>
|
||
<h3 class="font-bold text-xl mb-2">Personal secure messenger</h3>
|
||
<p class="text-gray-300">Own platform for group and private chats without "leak" risks. All data stays with you!</p>
|
||
</div>
|
||
<div class="glass-card shadow-3d p-8 transition hover:scale-105">
|
||
<i class="fas fa-envelope-open-text text-yellow-300 text-4xl mb-4"></i>
|
||
<h3 class="font-bold text-xl mb-2">Anonymous email & file sharing</h3>
|
||
<p class="text-gray-300">Create email addresses in 1 click, share files without intermediaries or censorship.</p>
|
||
</div>
|
||
<div class="glass-card shadow-3d p-8 transition hover:scale-105">
|
||
<i class="fas fa-coins text-emerald-300 text-4xl mb-4"></i>
|
||
<h3 class="font-bold text-xl mb-2">Isolated crypto wallet</h3>
|
||
<p class="text-gray-300">Cold-wallet for storing and operating cryptocurrencies with maximum isolation from internet threats.</p>
|
||
</div>
|
||
<div class="glass-card shadow-3d p-8 transition hover:scale-105">
|
||
<i class="fas fa-users-cog text-pink-400 text-4xl mb-4"></i>
|
||
<h3 class="font-bold text-xl mb-2">Platform for all devices</h3>
|
||
<p class="text-gray-300">BlackBox works for single users as well as families or business groups. Unlimited connected devices.</p>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- PRODUCT SHOWCASE -->
|
||
<section id="products" class="max-w-6xl mx-auto py-12 fade-up" style="--delay:.1s">
|
||
<h2 class="text-3xl md:text-4xl font-extrabold mb-10 font-montserrat text-center text-cyan-400 px-6">BlackBox Product Line</h2>
|
||
|
||
<div class="flipbook-container relative h-96 md:h-[36rem] w-full">
|
||
<!-- BlackBox VPN (far left) -->
|
||
<div class="flipbook-page" data-page="1">
|
||
<div class="glass-card shadow-3d p-6 text-center h-full">
|
||
<div class="h-40 mb-4 flex items-center justify-center">
|
||
<img src="/images/bb_on_white-square.webp" alt="BlackBox VPN" class="h-full object-contain rounded-lg">
|
||
</div>
|
||
<h3 class="text-xl font-bold mb-3 text-cyan-300 product-title" data-product="BlackBox VPN">BlackBox VPN</h3>
|
||
<div class="inline-flex items-center px-3 py-1 rounded-full bg-cyan-800/20 text-cyan-200 font-bold mb-3 animate-pulse">
|
||
<span>99 €</span>
|
||
</div>
|
||
<p class="text-gray-300 mb-4 product-description">Creates a Wi-Fi hotspot with protected VPN. 512 MB RAM.</p>
|
||
<div class="flex justify-center gap-3">
|
||
<button class="buy-btn product-buy-btn">Buy</button>
|
||
<button onclick="window.location.href='/items/boxes/blackbox-vpn.html'" class="details-btn product-details-btn">Details</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- BlackBox Privacy Messenger/Cloud (left) -->
|
||
<div class="flipbook-page" data-page="2">
|
||
<div class="glass-card shadow-3d p-6 text-center h-full">
|
||
<div class="h-40 mb-4 flex items-center justify-center">
|
||
<img src="/images/bb_on_white-square.webp" alt="BlackBox Privacy" class="h-full object-contain rounded-lg">
|
||
</div>
|
||
<h3 class="text-xl font-bold mb-3 text-cyan-300 product-title" data-product="BlackBox Privacy Messenger/Cloud">BlackBox Privacy Messenger/Cloud</h3>
|
||
<div class="inline-flex items-center px-3 py-1 rounded-full bg-cyan-800/20 text-cyan-200 font-bold mb-3 animate-pulse">
|
||
<span>199 €</span>
|
||
</div>
|
||
<p class="text-gray-300 mb-4 product-description">Built-in Matrix Messenger or Nextcloud. 1 GB RAM. Full control over your data.</p>
|
||
<div class="flex justify-center gap-3">
|
||
<button class="buy-btn product-buy-btn">Buy</button>
|
||
<button onclick="window.location.href='/items/boxes/blackbox-privacy.html'" class="details-btn product-details-btn">Details</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- BlackBox 4GB (center) -->
|
||
<div class="flipbook-page active" data-page="3">
|
||
<div class="glass-card shadow-3d p-6 text-center h-full selected">
|
||
<div class="h-40 mb-4 flex items-center justify-center">
|
||
<img src="/images/bb_on_white-square.webp" alt="BlackBox 4GB" class="h-full object-contain rounded-lg">
|
||
</div>
|
||
<h3 class="text-xl font-bold mb-3 text-cyan-300 product-title" data-product="BlackBox 4GB">BlackBox 4GB</h3>
|
||
<div class="inline-flex items-center px-3 py-1 rounded-full bg-cyan-800/20 text-cyan-200 font-bold mb-3 animate-pulse">
|
||
<span>299 €</span>
|
||
</div>
|
||
<p class="text-gray-300 mb-4 product-description">All features of first models + remote desktop (Workspace). 4 GB RAM.</p>
|
||
<div class="flex justify-center gap-3">
|
||
<button class="buy-btn product-buy-btn">Buy</button>
|
||
<button onclick="window.location.href='/items/boxes/blackbox-4gb.html'" class="details-btn product-details-btn">Details</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- BlackBox Workstation (right) -->
|
||
<div class="flipbook-page" data-page="4">
|
||
<div class="glass-card shadow-3d p-6 text-center h-full">
|
||
<div class="h-40 mb-4 flex items-center justify-center">
|
||
<img src="/images/bb_on_white-square.webp" alt="BlackBox Workstation" class="h-full object-contain rounded-lg">
|
||
</div>
|
||
<h3 class="text-xl font-bold mb-3 text-cyan-300 product-title" data-product="BlackBox Workstation">BlackBox Workstation</h3>
|
||
<div class="inline-flex items-center px-3 py-1 rounded-full bg-cyan-800/20 text-cyan-200 font-bold mb-3 animate-pulse">
|
||
<span>499 €</span>
|
||
</div>
|
||
<p class="text-gray-300 mb-4 product-description">Full workstation. All features of previous models.</p>
|
||
<div class="flex justify-center gap-3">
|
||
<button class="buy-btn product-buy-btn">Buy</button>
|
||
<button onclick="window.location.href='/items/boxes/blackbox-workstation.html'" class="details-btn product-details-btn">Details</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- BlackBox AI (far right) -->
|
||
<div class="flipbook-page" data-page="5">
|
||
<div class="glass-card shadow-3d p-6 text-center h-full">
|
||
<div class="h-40 mb-4 flex items-center justify-center">
|
||
<img src="/images/bb_on_white-square.webp" alt="BlackBox AI" class="h-full object-contain rounded-lg">
|
||
</div>
|
||
<h3 class="text-xl font-bold mb-3 text-cyan-300 product-title" data-product="BlackBox AI">BlackBox AI</h3>
|
||
<div class="inline-flex items-center px-3 py-1 rounded-full bg-cyan-800/20 text-cyan-200 font-bold mb-3 animate-pulse" style="box-shadow: 0 0 10px 2px rgba(116, 250, 255, 0.3);">
|
||
<span>2999 €</span>
|
||
</div>
|
||
<p class="text-gray-300 mb-4 product-description">Includes all BlackBox technologies. Private artificial intelligence. Maximum autonomy and protection.</p>
|
||
<div class="flex justify-center gap-3">
|
||
<button class="buy-btn product-buy-btn">Buy</button>
|
||
<button onclick="window.location.href='/items/boxes/blackbox-ai.html'" class="details-btn product-details-btn">Details</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- BlackBox Shop -->
|
||
<div class="flipbook-page" data-page="6">
|
||
<div class="glass-card shadow-3d p-6 text-center h-full">
|
||
<div class="h-40 mb-4 flex items-center justify-center">
|
||
<img src="/images/bb_on_white-square.webp" alt="BlackBox Shop" class="h-full object-contain rounded-lg">
|
||
</div>
|
||
<h3 class="text-xl font-bold mb-3 text-cyan-300 product-title" data-product="BlackBox Shop">BlackBox Shop</h3>
|
||
<div class="inline-flex items-center px-3 py-1 rounded-full bg-cyan-800/20 text-cyan-200 font-bold mb-3 animate-pulse" style="box-shadow: 0 0 10px 2px rgba(116, 250, 255, 0.3);">
|
||
<span>from 499 €</span>
|
||
</div>
|
||
<p class="text-gray-300 mb-4 product-description">Create a Telegram store via bot. Upload products, descriptions, prices. Pay for goods with cryptocurrency. Complete anonymity for seller and buyer.</p>
|
||
<div class="flex justify-center gap-3">
|
||
<button class="buy-btn product-buy-btn">Buy</button>
|
||
<button onclick="window.location.href='/items/boxes/blackbox-shop.html'" class="details-btn product-details-btn">Details</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="flipbook-indicator-track"></div>
|
||
<div class="flipbook-indicator" style="transform: translateX(-150%);"></div>
|
||
|
||
</section>
|
||
|
||
|
||
<!-- PRICING & ORDER -->
|
||
<section id="order" class="max-w-3xl mx-auto mb-18 py-12 px-6 rounded-3xl glass-card mt-14 text-center border-2 border-cyan-500 relative fade-up" style="--delay:.1s">
|
||
<div class="absolute top-3 left-1/3 -translate-x-1/2 bg-gradient-to-r from-emerald-500 to-green-500 text-white text-lg font-black rounded-full px-8 py-2 shadow-xl animate-bounce" style="box-shadow: 0 0 15px 5px rgba(16, 185, 129, 0.5);">
|
||
-30% Only now!
|
||
</div>
|
||
<h2 class="text-3xl md:text-4xl font-extrabold mb-4 font-montserrat">Order BlackBox WorkStation with <span class="text-cyan-400">350 USD</span> discount</h2>
|
||
<p class="text-lg text-gray-200 mb-6 max-w-xl mx-auto">One-time payment — no subscriptions.<br> Worldwide shipping. Limited quantity available!</p>
|
||
<div class="flex flex-wrap items-center justify-center gap-8 mb-7">
|
||
<div class="text-left bg-gray-800/70 rounded-2xl p-6">
|
||
<div class="text-2xl">
|
||
<span class="text-cyan-400 font-bold">149 USD</span>
|
||
<span class="line-through text-gray-500 ml-2 text-lg">499 USD</span>
|
||
</div>
|
||
<div class="text-gray-400 text-xs mt-1">Special price for first 10 buyers</div>
|
||
<div class="mt-3 text-base text-green-300 font-bold">+ Free updates for one year</div>
|
||
</div>
|
||
<ul class="text-left space-y-2 text-sm text-gray-200">
|
||
<li><i class="fas fa-check mr-2 text-cyan-400"></i>30-day money back guarantee</li>
|
||
<li><i class="fas fa-check mr-2 text-cyan-400"></i>Worldwide shipping</li>
|
||
<li><i class="fas fa-check mr-2 text-cyan-400"></i>Personal support</li>
|
||
</ul>
|
||
</div>
|
||
<a href="https://bbox.rocks/#order" target="_blank" class="pulse-cta px-12 py-4 rounded-xl text-white font-extrabold font-montserrat bg-gradient-to-r from-cyan-400 via-emerald-400 to-cyan-500 shadow-3d text-2xl hover:bg-cyan-400 transform transition">Order Now</a>
|
||
<div class="mt-6 text-gray-300 text-base">Valid until <span class="inline-block text-cyan-300 rounded px-2 py-1 font-bold bg-cyan-800/30">June 1 2025</span> or while supplies last.</div>
|
||
</section>
|
||
|
||
|
||
<!-- TESTIMONIALS -->
|
||
<section id="testimonials" class="max-w-6xl mx-auto py-11 px-6 mt-4 fade-up" style="--delay:.1s">
|
||
<h2 class="text-3xl font-extrabold text-cyan-400 mb-7 text-center">What our users say?</h2>
|
||
<div class="grid md:grid-cols-3 gap-7 lg:gap-12">
|
||
<div class="glass-card p-7 shadow-3d flex flex-col items-center text-center">
|
||
<img src="https://randomuser.me/api/portraits/men/32.jpg" alt="Testimonial" class="w-14 h-14 rounded-full mb-3 shadow-lg">
|
||
<div class="mb-2 font-bold text-lg text-emerald-300">Andrew, startup founder</div>
|
||
<div class="text-gray-300 italic">"BlackBox is the first gadget I trust with my personal data. No logs, fast operation, great for working from anywhere in the world."</div>
|
||
</div>
|
||
<div class="glass-card p-7 shadow-3d flex flex-col items-center text-center border-2 border-cyan-400">
|
||
<img src="https://randomuser.me/api/portraits/women/43.jpg" alt="Testimonial" class="w-14 h-14 rounded-full mb-3 shadow-lg">
|
||
<div class="mb-2 font-bold text-lg text-cyan-300">Maria, mother</div>
|
||
<div class="text-gray-300 italic">"For us, BlackBox is a guarantee of internet safety for the whole family. Even children can use it without any setup."</div>
|
||
</div>
|
||
<div class="glass-card p-7 shadow-3d flex flex-col items-center text-center">
|
||
<img src="https://randomuser.me/api/portraits/men/67.jpg" alt="Testimonial" class="w-14 h-14 rounded-full mb-3 shadow-lg">
|
||
<div class="mb-2 font-bold text-lg text-purple-300">Vlad, programmer</div>
|
||
<div class="text-gray-300 italic">"Linux, open source, anonymity — everything works fast and thoughtfully. Great alternative to VPN services and routers."</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- FOOTER -->
|
||
<footer class="w-full mt-10 pt-7 pb-8 bg-black/60 flex flex-col items-center text-center text-gray-500 text-sm">
|
||
<img src="/images/logo.webp" alt="bbox logo" class="w-10 h-10 mx-auto mb-3">
|
||
<div class="mb-2">
|
||
<span class="font-montserrat font-bold text-cyan-400 text-lg">BlackBox</span> © 2022-2025. All rights reserved.<br>
|
||
</div>
|
||
<div class="flex justify-center space-x-6 mb-4">
|
||
<a href="https://t.me/bbox_wtf" target="_blank" class="text-cyan-300 hover:text-cyan-400 transition-colors" aria-label="Our Telegram channel">
|
||
<i class="fab fa-telegram text-2xl"></i> Telegram
|
||
</a>
|
||
<a href="https://vk.com/bbox_wtf" target="_blank" class="text-cyan-300 hover:text-cyan-400 transition-colors" aria-label="Our VK group">
|
||
<i class="fab fa-vk text-2xl"></i> VK
|
||
</a>
|
||
</div>
|
||
<div>
|
||
<a href="mailto:support@bbox.wtf" class="hover:underline text-cyan-300">Support</a>
|
||
|
|
||
<a href="/pages/faq.html" class="hover:underline text-cyan-300">FAQ</a>
|
||
|
|
||
<a href="https://bbox.rocks" class="hover:underline">Old unsupported site</a>
|
||
</div>
|
||
<div class="mt-4">
|
||
<span class="text-gray-400">bbox.wtf — next generation landing: BlackBox is not just a VPN, it's an ecosystem and your digital privacy.</span>
|
||
</div>
|
||
</footer>
|
||
|
||
<!-- PRODUCT DETAILS MODAL -->
|
||
<div id="productModal" class="fixed inset-0 bg-black/90 backdrop-blur-sm z-50 flex items-center justify-center p-4 hidden">
|
||
<div class="glass-card shadow-3d p-6 md:p-8 max-w-2xl w-full mx-4 pulse-border relative">
|
||
<span class="modal-close sticky top-0 right-0 text-2xl cursor-pointer text-cyan-400 hover:text-cyan-300 bg-gray-900/80 rounded-full w-10 h-10 flex items-center justify-center ml-auto mb-4" onclick="hideBlackBoxProductDetails()">×</span>
|
||
<h3 id="modalTitle" class="text-2xl font-bold mb-6 text-cyan-400 text-center"></h3>
|
||
<p id="modalDescription" class="text-gray-300 mb-6 text-lg"></p>
|
||
<button class="w-full py-3 buy-btn text-lg font-bold" onclick="hideProductDetails(); showCryptoModal()">Buy Now</button>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- CRYPTO PAYMENT MODAL -->
|
||
<div id="cryptoModal" class="fixed inset-0 bg-black/90 backdrop-blur-sm z-50 flex items-center justify-center p-4 hidden">
|
||
<div class="glass-card shadow-3d p-4 md:p-8 max-w-4xl w-full mx-4 pulse-border relative overflow-y-auto" style="max-height: 90vh;">
|
||
<span class="modal-close sticky top-0 right-0 text-2xl cursor-pointer text-cyan-400 hover:text-cyan-300 bg-gray-900/80 rounded-full w-10 h-10 flex items-center justify-center ml-auto mb-2" onclick="hideCryptoModal()">×</span>
|
||
<h3 class="text-2xl font-bold mb-6 text-cyan-400 text-center">Crypto Payment</h3>
|
||
<div class="flex flex-col md:flex-row gap-8">
|
||
<div class="flex-1 flex flex-col items-center">
|
||
<div class="w-64 h-64 bg-white p-4 rounded-lg mb-4 flex items-center justify-center">
|
||
<img src="/images/wallet_ltc.webp" alt="LTC QR code" class="w-full h-full object-contain">
|
||
</div>
|
||
<p class="text-gray-300 text-center">Litecoin (LTC)</p>
|
||
<p class="text-cyan-300 text-center mt-2" id="paymentAmount">Payment amount: [Amount]</p>
|
||
</div>
|
||
<div class="flex-1">
|
||
<div class="bg-gray-800/50 p-6 rounded-lg h-full">
|
||
<h4 class="text-xl font-bold mb-4 text-cyan-300">Payment instructions:</h4>
|
||
<ol class="text-gray-300 space-y-3 text-lg">
|
||
<li>1. Open crypto wallet on your device</li>
|
||
<li>2. Click "Send" and select LTC wallet</li>
|
||
<li>3. Scan the corresponding QR code</li>
|
||
<li>4. Enter exact amount</li>
|
||
<li>5. Confirm transaction</li>
|
||
<li>6. After network confirmation (usually 2-5 min) your order will be processed</li>
|
||
<li>7. Log in to our Telegram bot and enter 3 parameters: sending wallet, exact time and exact amount, the bot will give you access to your personal account.</li>
|
||
</ol>
|
||
<div class="mt-6 space-y-4">
|
||
<div class="p-4 bg-gray-900 rounded-lg">
|
||
<p class="text-cyan-300 font-mono break-all">LTC: ltc1q0rq7shseegk0g44rd04e2w9psl6qn3hsnzj3j5</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<script src="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@6.5.2/js/all.min.js"></script>
|
||
<script src="/js/features.js"></script>
|
||
<script src="/js/flipbook.js"></script>
|
||
<script src="/js/fade-up.js"></script>
|
||
<script src="/js/products.js"></script>
|
||
<!-- Yandex.Metrika counter -->
|
||
<script type="text/javascript" >
|
||
(function(m,e,t,r,i,k,a){m[i]=m[i]||function(){(m[i].a=m[i].a||[]).push(arguments)};
|
||
m[i].l=1*new Date();
|
||
for (var j = 0; j < document.scripts.length; j++) {if (document.scripts[j].src === r) { return; }}
|
||
k=e.createElement(t),a=e.getElementsByTagName(t)[0],k.async=1,k.src=r,a.parentNode.insertBefore(k,a)})
|
||
(window, document, "script", "https://mc.yandex.ru/metrika/tag.js", "ym");
|
||
|
||
ym(55764994, "init", {
|
||
clickmap:true,
|
||
trackLinks:true,
|
||
accurateTrackBounce:true,
|
||
webvisor:true,
|
||
trackHash:true
|
||
});
|
||
</script>
|
||
<noscript><div><img src="https://mc.yandex.ru/watch/55764994" style="position:absolute; left:-9999px;" alt="" /></div></noscript>
|
||
<!-- /Yandex.Metrika counter -->
|
||
<script src="/js/lang-detect-redirect.js"></script>
|
||
<script src="/js/language-switcher.js"></script>
|
||
</body>
|
||
</html> |