Spaces:
Paused
Paused
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8" /> | |
| <title>DeepSite</title> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0" /> | |
| <meta name="description" content="DeepSite – Fast. Secure. Invisible." /> | |
| <style> | |
| :root { | |
| --bg: #0b0f1a; | |
| --card: #12182b; | |
| --primary: #5ddcff; | |
| --secondary: #c77dff; | |
| --text: #e6e9f0; | |
| --muted: #9aa4bf; | |
| } | |
| * { | |
| box-sizing: border-box; | |
| margin: 0; | |
| padding: 0; | |
| font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", | |
| Roboto, "Helvetica Neue", Arial, sans-serif; | |
| } | |
| body { | |
| min-height: 100vh; | |
| background: radial-gradient( | |
| 1200px 600px at 10% -20%, | |
| rgba(93, 220, 255, 0.15), | |
| transparent 40% | |
| ), | |
| radial-gradient( | |
| 1000px 500px at 90% 10%, | |
| rgba(199, 125, 255, 0.15), | |
| transparent 40% | |
| ), | |
| var(--bg); | |
| color: var(--text); | |
| display: flex; | |
| align-items: center; | |
| justify-content: center; | |
| } | |
| .container { | |
| max-width: 980px; | |
| padding: 48px 24px; | |
| text-align: center; | |
| } | |
| .logo { | |
| font-size: 42px; | |
| font-weight: 700; | |
| letter-spacing: 0.5px; | |
| margin-bottom: 12px; | |
| background: linear-gradient(90deg, var(--primary), var(--secondary)); | |
| -webkit-background-clip: text; | |
| -webkit-text-fill-color: transparent; | |
| } | |
| .subtitle { | |
| color: var(--muted); | |
| font-size: 16px; | |
| margin-bottom: 48px; | |
| } | |
| .card { | |
| background: linear-gradient( | |
| 180deg, | |
| rgba(255, 255, 255, 0.04), | |
| rgba(255, 255, 255, 0.01) | |
| ); | |
| border: 1px solid rgba(255, 255, 255, 0.08); | |
| border-radius: 16px; | |
| padding: 36px; | |
| backdrop-filter: blur(6px); | |
| box-shadow: 0 20px 60px rgba(0, 0, 0, 0.45); | |
| } | |
| .card h2 { | |
| font-size: 22px; | |
| margin-bottom: 12px; | |
| } | |
| .card p { | |
| color: var(--muted); | |
| font-size: 15px; | |
| line-height: 1.6; | |
| margin-bottom: 28px; | |
| } | |
| .features { | |
| display: grid; | |
| grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); | |
| gap: 20px; | |
| margin-top: 32px; | |
| } | |
| .feature { | |
| background: var(--card); | |
| border-radius: 14px; | |
| padding: 20px; | |
| border: 1px solid rgba(255, 255, 255, 0.06); | |
| transition: transform 0.3s ease, box-shadow 0.3s ease; | |
| } | |
| .feature:hover { | |
| transform: translateY(-6px); | |
| box-shadow: 0 12px 30px rgba(0, 0, 0, 0.35); | |
| } | |
| .feature h3 { | |
| font-size: 16px; | |
| margin-bottom: 8px; | |
| } | |
| .feature span { | |
| font-size: 13px; | |
| color: var(--muted); | |
| } | |
| footer { | |
| margin-top: 48px; | |
| font-size: 12px; | |
| color: #6f7894; | |
| } | |
| @media (max-width: 600px) { | |
| .logo { | |
| font-size: 34px; | |
| } | |
| .card { | |
| padding: 28px 22px; | |
| } | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <div class="container"> | |
| <div class="logo">DeepSite</div> | |
| <div class="subtitle">Fast · Secure · Invisible</div> | |
| <div class="card"> | |
| <h2>Next-Generation Network Entry</h2> | |
| <p> | |
| DeepSite is a lightweight, high-performance access layer designed for | |
| modern, privacy-first infrastructure. Minimal exposure. Maximum control. | |
| </p> | |
| <div class="features"> | |
| <div class="feature"> | |
| <h3>Low Latency</h3> | |
| <span>Optimized transport & smart routing</span> | |
| </div> | |
| <div class="feature"> | |
| <h3>Secure by Default</h3> | |
| <span>TLS-first, protocol-aware design</span> | |
| </div> | |
| <div class="feature"> | |
| <h3>Stealth Ready</h3> | |
| <span>Blends naturally with normal web traffic</span> | |
| </div> | |
| <div class="feature"> | |
| <h3>Simple Deployment</h3> | |
| <span>Single binary, single endpoint</span> | |
| </div> | |
| </div> | |
| </div> | |
| <footer> | |
| © <span id="year"></span> DeepSite. All rights reserved. | |
| </footer> | |
| </div> | |
| <script> | |
| document.getElementById("year").textContent = | |
| new Date().getFullYear(); | |
| </script> | |
| </body> | |
| </html> |