183 lines
8.3 KiB
HTML
183 lines
8.3 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>4NK - The self-custodial cloud infrastructure</title>
|
|
<link rel="icon" type="image/png" href="favicon.png">
|
|
<link rel="stylesheet" href="styles.css">
|
|
<link rel="canonical" href="https://4nk.network/">
|
|
<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@300;400;500;600;700&display=swap" rel="stylesheet">
|
|
</head>
|
|
<body>
|
|
<div class="background-pattern"></div>
|
|
|
|
<header class="header">
|
|
<nav class="nav">
|
|
<div class="nav-logo">
|
|
<div class="logo-container">
|
|
<img src="img/logo.png" alt="4NK Logo" class="logo-img">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="nav-menu">
|
|
<a href="#home" class="nav-link">Home</a>
|
|
<a href="#services" class="nav-link">Services</a>
|
|
<a href="#about" class="nav-link">About</a>
|
|
<a href="#contact" class="nav-link">Contact</a>
|
|
</div>
|
|
</nav>
|
|
</header>
|
|
|
|
<main>
|
|
<section id="home" class="hero">
|
|
<div class="hero-content">
|
|
<div class="hero-logo">
|
|
<img src="/img/infra.png" alt="4NK Hero Logo" class="hero-logo-img">
|
|
</div>
|
|
|
|
<div class="hero-text">
|
|
<h1 class="hero-title">
|
|
<span class="brand-name">4NK</span>
|
|
<span class="brand-subtitle">Infrastructure</span>
|
|
<span class="brand-tagline">custodian-killer</span>
|
|
</h1>
|
|
|
|
<p class="hero-description">
|
|
A revolutionary infrastructure redefining security and decentralization.
|
|
Our cutting-edge technology removes intermediaries and puts control in your hands.
|
|
</p>
|
|
|
|
<div class="hero-buttons">
|
|
<button class="btn btn-primary">Discover</button>
|
|
<a class="btn btn-secondary" href="/about_more.html">Learn more</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section id="services" class="services">
|
|
<div class="container">
|
|
<h2 class="section-title">Our Services</h2>
|
|
<div class="services-grid">
|
|
<div class="service-card">
|
|
<div class="service-icon">
|
|
<svg viewBox="0 0 100 100" class="service-svg">
|
|
<circle cx="50" cy="50" r="40" fill="none" stroke="url(#heroGradient)" stroke-width="3" filter="url(#heroGlow)"/>
|
|
<path d="M30 50 L45 65 L70 35" fill="none" stroke="url(#heroGradient)" stroke-width="3" filter="url(#heroGlow)"/>
|
|
</svg>
|
|
</div>
|
|
<h3>Decentralized Security</h3>
|
|
<p>Secure infrastructure with no single point of failure</p>
|
|
</div>
|
|
|
|
<div class="service-card">
|
|
<div class="service-icon">
|
|
<svg viewBox="0 0 100 100" class="service-svg">
|
|
<rect x="20" y="30" width="60" height="40" fill="none" stroke="url(#heroGradient)" stroke-width="3" filter="url(#heroGlow)"/>
|
|
<path d="M40 50 L50 60 L60 50" fill="none" stroke="url(#heroGradient)" stroke-width="3" filter="url(#heroGlow)"/>
|
|
</svg>
|
|
</div>
|
|
<h3>Resilient Storage</h3>
|
|
<p>Distributed and cryptographically secured storage solutions</p>
|
|
</div>
|
|
|
|
<div class="service-card">
|
|
<div class="service-icon">
|
|
<svg viewBox="0 0 100 100" class="service-svg">
|
|
<path d="M50 20 L70 40 L70 70 L30 70 L30 40 Z" fill="none" stroke="url(#heroGradient)" stroke-width="3" filter="url(#heroGlow)"/>
|
|
<circle cx="50" cy="45" r="5" fill="url(#heroGradient)" filter="url(#heroGlow)"/>
|
|
</svg>
|
|
</div>
|
|
<h3>Self-custodial cloud infrastructure</h3>
|
|
<p>Eliminating intermediaries for full control</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section id="about" class="about">
|
|
<div class="container">
|
|
<div class="about-content">
|
|
<div class="about-text">
|
|
<h2>About 4NK</h2>
|
|
<p>
|
|
4NK represents a new era of technology infrastructure.
|
|
Our self-custodial cloud infrastructure approach revolutionizes how we think about
|
|
security, decentralization, and data control.
|
|
</p>
|
|
<p>
|
|
With our cutting-edge technology, we eliminate traditional points of failure
|
|
and create a resilient, transparent ecosystem entirely under your control.
|
|
</p>
|
|
</div>
|
|
<div class="about-visual">
|
|
<div class="logo-showcase">
|
|
<img src="/img/infra.png" alt="4NK Showcase Logo" class="showcase-logo-img">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section id="contact" class="contact">
|
|
<div class="container">
|
|
<h2 class="section-title">Contact</h2>
|
|
<div class="contact-content">
|
|
<div class="contact-info">
|
|
<h3>Get in touch</h3>
|
|
<p>Ready to revolutionize your infrastructure? Contact us to discover how 4NK can transform your approach to security and decentralization.</p>
|
|
</div>
|
|
<div class="contact-form">
|
|
<form>
|
|
<div class="form-group">
|
|
<input type="text" placeholder="Name" required>
|
|
</div>
|
|
<div class="form-group">
|
|
<input type="email" placeholder="Email" required>
|
|
</div>
|
|
<div class="form-group">
|
|
<textarea placeholder="Message" rows="5" required></textarea>
|
|
</div>
|
|
<button type="submit" class="btn btn-primary">Send</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</main>
|
|
|
|
<footer class="footer">
|
|
<div class="container">
|
|
<div class="footer-content">
|
|
<div class="footer-logo">
|
|
<div class="footer-logo-container">
|
|
<img src="img/logo.png" alt="4NK Footer Logo" class="footer-logo-img">
|
|
</div>
|
|
<div class="footer-text">
|
|
<span class="brand-name">4NK</span>
|
|
<span class="brand-subtitle">The self-custodial cloud infrastructure</span>
|
|
</div>
|
|
</div>
|
|
<div class="footer-links">
|
|
<a href="#home">Home</a>
|
|
<a href="#services">Services</a>
|
|
<a href="#about">About</a>
|
|
<a href="#contact">Contact</a>
|
|
<a href="/powered_by_bitcoin.html">Powered by Bitcoin</a>
|
|
<a href="/manifest_en.html">Manifest</a>
|
|
<a href="https://git.4nkweb.com" target="_blank" rel="noopener">git.4nkweb.com</a>
|
|
</div>
|
|
</div>
|
|
<div class="footer-bottom">
|
|
<p>© 2024 4NK. All rights reserved.</p>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
|
|
<script src="script.js"></script>
|
|
</body>
|
|
</html>
|