Spaces:

timoon811
/

tmt21

Running

App Files Files Community

timoon811 commited on Apr 29, 2025

Commit

0f10d0b

verified ·

1 Parent(s): 61f92d5

Add 3 files

Browse files

Files changed (3) hide show

README.md +7 -5
index.html +590 -19
prompts.txt +1 -0

README.md CHANGED Viewed

@@ -1,10 +1,12 @@
 ---
-title: Tmt21
-emoji: 😻
-colorFrom: gray
-colorTo: yellow
 sdk: static
 pinned: false
 ---
-Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference

 ---
+title: tmt21
+emoji: 🐳
+colorFrom: green
+colorTo: gray
 sdk: static
 pinned: false
+tags:
+  - deepsite
 ---
+Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference

index.html CHANGED Viewed

@@ -1,19 +1,590 @@
-<!doctype html>
-<html>
-	<head>
-		<meta charset="utf-8" />
-		<meta name="viewport" content="width=device-width" />
-		<title>My static Space</title>
-		<link rel="stylesheet" href="style.css" />
-	</head>
-	<body>
-		<div class="card">
-			<h1>Welcome to your static Space!</h1>
-			<p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
-			<p>
-				Also don't forget to check the
-				<a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
-			</p>
-		</div>
-	</body>
-</html>

+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>TMT - Traffic Monsters Team</title>
+    <script src="https://cdn.tailwindcss.com"></script>
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
+    <script>
+        tailwind.config = {
+            theme: {
+                extend: {
+                    colors: {
+                        primary: '#f6fc79',
+                        dark: '#0E0E0E',
+                        light: '#FFFFFF',
+                        gray: '#A1A1A1',
+                    },
+                    animation: {
+                        'pulse-slow': 'pulse 3s cubic-bezier(0.4, 0, 0.6, 1) infinite',
+                        'float': 'float 6s ease-in-out infinite',
+                        'neon-glow': 'neonGlow 1.5s ease-in-out infinite alternate',
+                        'neon-flicker': 'neonFlicker 3s linear infinite',
+                    },
+                    keyframes: {
+                        float: {
+                            '0%, 100%': { transform: 'translateY(0)' },
+                            '50%': { transform: 'translateY(-20px)' },
+                        },
+                        neonGlow: {
+                            '0%': { 'text-shadow': '0 0 5px #fff, 0 0 10px #fff, 0 0 15px #f6fc79, 0 0 20px #f6fc79, 0 0 25px #f6fc79, 0 0 30px #f6fc79, 0 0 35px #f6fc79' },
+                            '100%': { 'text-shadow': '0 0 10px #fff, 0 0 20px #fff, 0 0 30px #f6fc79, 0 0 40px #f6fc79, 0 0 50px #f6fc79, 0 0 60px #f6fc79, 0 0 70px #f6fc79' },
+                        },
+                        neonFlicker: {
+                            '0%, 19.999%, 22%, 62.999%, 64%, 64.999%, 70%, 100%': { opacity: '1' },
+                            '20%, 21.999%, 63%, 63.999%, 65%, 69.999%': { opacity: '0.5' },
+                        }
+                    }
+                }
+            }
+        }
+    </script>
+    <style>
+        @import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;500;600;700;800;900&family=Roboto:wght@300;400;500;700;900&display=swap');
+        body {
+            font-family: 'Roboto', sans-serif;
+            background-color: #0E0E0E;
+            color: white;
+            overflow-x: hidden;
+        }
+        .font-orbitron {
+            font-family: 'Orbitron', sans-serif;
+        }
+        .hero-gradient {
+            background: radial-gradient(circle at center, rgba(246, 252, 121, 0.15) 0%, rgba(14, 14, 14, 0) 50%);
+        }
+        .neon-ring {
+            position: relative;
+        }
+        .neon-ring::before {
+            content: '';
+            position: absolute;
+            top: -10px;
+            left: -10px;
+            right: -10px;
+            bottom: -10px;
+            border: 3px solid #f6fc79;
+            border-radius: 50%;
+            animation: pulse-slow 4s infinite;
+            box-shadow: 0 0 15px #f6fc79;
+        }
+        .neon-card {
+            transition: all 0.3s ease;
+            border: 1px solid rgba(246, 252, 121, 0.3);
+        }
+        .neon-card:hover {
+            border-color: #f6fc79;
+            box-shadow: 0 0 20px rgba(246, 252, 121, 0.5);
+            transform: translateY(-5px);
+        }
+        .neon-btn {
+            position: relative;
+            overflow: hidden;
+            transition: all 0.3s ease;
+        }
+        .neon-btn:hover {
+            box-shadow: 0 0 15px #f6fc79;
+        }
+        .neon-btn::before {
+            content: '';
+            position: absolute;
+            top: -50%;
+            left: -50%;
+            width: 200%;
+            height: 200%;
+            background: linear-gradient(to bottom right, rgba(246, 252, 121, 0.3), transparent);
+            transform: rotate(45deg);
+            transition: all 0.3s ease;
+        }
+        .neon-btn:hover::before {
+            left: 100%;
+            top: 100%;
+        }
+        .counter {
+            font-variant-numeric: tabular-nums;
+        }
+        .video-placeholder {
+            position: relative;
+            background: linear-gradient(135deg, rgba(14, 14, 14, 0.8), rgba(14, 14, 14, 0.5));
+            overflow: hidden;
+        }
+        .video-placeholder::before {
+            content: '';
+            position: absolute;
+            top: 0;
+            left: 0;
+            right: 0;
+            bottom: 0;
+            background: linear-gradient(45deg, transparent 48%, #f6fc79 49%, #f6fc79 51%, transparent 52%),
+                        linear-gradient(-45deg, transparent 48%, #f6fc79 49%, #f6fc79 51%, transparent 52%);
+            background-size: 20px 20px;
+            opacity: 0.1;
+        }
+        .play-btn {
+            transition: all 0.3s ease;
+        }
+        .play-btn:hover {
+            transform: scale(1.1);
+            box-shadow: 0 0 30px rgba(246, 252, 121, 0.7);
+        }
+        .form-input {
+            background-color: rgba(255, 255, 255, 0.1);
+            border: 1px solid rgba(246, 252, 121, 0.3);
+            transition: all 0.3s ease;
+        }
+        .form-input:focus {
+            outline: none;
+            border-color: #f6fc79;
+            box-shadow: 0 0 10px rgba(246, 252, 121, 0.5);
+            background-color: rgba(255, 255, 255, 0.2);
+        }
+        .case-study {
+            transition: all 0.3s ease;
+            background: linear-gradient(145deg, rgba(20, 20, 20, 0.8), rgba(10, 10, 10, 0.9));
+        }
+        .case-study:hover {
+            transform: translateY(-10px);
+            box-shadow: 0 10px 30px rgba(246, 252, 121, 0.3);
+        }
+        .case-study-overlay {
+            position: absolute;
+            top: 0;
+            left: 0;
+            right: 0;
+            bottom: 0;
+            background: rgba(14, 14, 14, 0.8);
+            opacity: 0;
+            transition: all 0.3s ease;
+            display: flex;
+            flex-direction: column;
+            justify-content: center;
+            padding: 1.5rem;
+        }
+        .case-study:hover .case-study-overlay {
+            opacity: 1;
+        }
+        .parallax {
+            background-attachment: fixed;
+            background-position: center;
+            background-repeat: no-repeat;
+            background-size: cover;
+        }
+        @keyframes float {
+            0%, 100% { transform: translateY(0); }
+            50% { transform: translateY(-20px); }
+        }
+        @keyframes neonGlow {
+            0% { text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 15px #f6fc79, 0 0 20px #f6fc79, 0 0 25px #f6fc79, 0 0 30px #f6fc79, 0 0 35px #f6fc79; }
+            100% { text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #f6fc79, 0 0 40px #f6fc79, 0 0 50px #f6fc79, 0 0 60px #f6fc79, 0 0 70px #f6fc79; }
+        }
+        @keyframes pulse-slow {
+            0%, 100% { opacity: 0.7; }
+            50% { opacity: 1; }
+        }
+        @keyframes neonFlicker {
+            0%, 19.999%, 22%, 62.999%, 64%, 64.999%, 70%, 100% { opacity: 1; }
+            20%, 21.999%, 63%, 63.999%, 65%, 69.999% { opacity: 0.5; }
+        }
+        .glow-text {
+            animation: neonGlow 1.5s ease-in-out infinite alternate;
+        }
+        .flicker-text {
+            animation: neonFlicker 3s linear infinite;
+        }
+        .data-tornado {
+            position: absolute;
+            width: 100%;
+            height: 100%;
+            background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><path fill="none" stroke="%23f6fc79" stroke-width="0.5" d="M20,20 Q30,10 40,20 T60,20 T80,20" opacity="0.3"/></svg>') repeat;
+            background-size: 200px 200px;
+            animation: tornadoMove 30s linear infinite;
+        }
+        @keyframes tornadoMove {
+            0% { background-position: 0 0; }
+            100% { background-position: 100% 100%; }
+        }
+    </style>
+</head>
+<body class="antialiased">
+    <!-- Navigation -->
+    <nav class="fixed w-full z-50 bg-black bg-opacity-90 backdrop-blur-sm border-b border-gray-800">
+        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+            <div class="flex justify-between h-16 items-center">
+                <div class="flex items-center">
+                    <div class="flex-shrink-0 flex items-center">
+                        <div class="neon-ring rounded-full w-10 h-10 flex items-center justify-center">
+                            <span class="text-primary font-bold text-xl font-orbitron">TMT</span>
+                        </div>
+                        <span class="ml-3 text-primary font-orbitron text-xl">TRAFFIC MONSTERS</span>
+                    </div>
+                </div>
+                <div class="hidden md:block">
+                    <div class="ml-10 flex items-center space-x-4">
+                        <a href="#home" class="text-white hover:text-primary px-3 py-2 rounded-md text-sm font-medium transition duration-300">Home</a>
+                        <a href="#about" class="text-gray-300 hover:text-primary px-3 py-2 rounded-md text-sm font-medium transition duration-300">About</a>
+                        <a href="#results" class="text-gray-300 hover:text-primary px-3 py-2 rounded-md text-sm font-medium transition duration-300">Results</a>
+                        <a href="#benefits" class="text-gray-300 hover:text-primary px-3 py-2 rounded-md text-sm font-medium transition duration-300">Benefits</a>
+                        <a href="#join" class="text-gray-300 hover:text-primary px-3 py-2 rounded-md text-sm font-medium transition duration-300">Join</a>
+                    </div>
+                </div>
+                <div class="md:hidden">
+                    <button class="text-gray-300 hover:text-white focus:outline-none">
+                        <svg class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path>
+                        </svg>
+                    </button>
+                </div>
+            </div>
+        </div>
+    </nav>
+    <!-- Hero Section -->
+    <section id="home" class="relative h-screen flex items-center justify-center overflow-hidden hero-gradient">
+        <div class="data-tornado"></div>
+        <div class="absolute inset-0 bg-gradient-to-b from-transparent to-black opacity-70"></div>
+        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10 text-center">
+            <div class="mb-8">
+                <div class="inline-block neon-ring rounded-full w-32 h-32 flex items-center justify-center mb-8">
+                    <span class="text-primary font-bold text-4xl font-orbitron">TMT</span>
+                </div>
+            </div>
+            <h1 class="text-5xl md:text-7xl font-bold mb-6 font-orbitron glow-text">
+                <span class="text-transparent bg-clip-text bg-gradient-to-r from-primary to-white">TRAFFIC MASTERS</span>
+                <span class="block text-transparent bg-clip-text bg-gradient-to-r from-white to-primary">OF THE DIGITAL JUNGLE</span>
+            </h1>
+            <p class="text-xl md:text-2xl text-gray-300 mb-10 max-w-3xl mx-auto flicker-text">
+                TMT — команда топовых арбитражников. Мы не ливаем трафик, мы его приручаем.
+            </p>
+            <div class="flex flex-col sm:flex-row justify-center gap-4">
+                <a href="#join" class="neon-btn bg-primary text-black font-bold py-3 px-8 rounded-full text-lg font-orbitron transition duration-300 transform hover:scale-105">
+                    JOIN THE TEAM
+                </a>
+                <a href="#results" class="neon-btn border-2 border-primary text-white font-bold py-3 px-8 rounded-full text-lg font-orbitron transition duration-300 transform hover:scale-105">
+                    SEE OUR RESULTS
+                </a>
+            </div>
+        </div>
+        <div class="absolute bottom-10 left-0 right-0 flex justify-center">
+            <a href="#about" class="text-gray-400 hover:text-primary animate-bounce">
+                <svg class="w-8 h-8" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 14l-7 7m0 0l-7-7m7 7V3"></path>
+                </svg>
+            </a>
+        </div>
+    </section>
+    <!-- About Section -->
+    <section id="about" class="py-20 parallax" style="background-image: url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"100\" height=\"100\" viewBox=\"0 0 100 100\"><rect width=\"10\" height=\"10\" x=\"0\" y=\"0\" fill=\"%23f6fc79\" opacity=\"0.1\"/></svg>')">
+        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+            <div class="text-center mb-16">
+                <h2 class="text-4xl font-bold mb-4 font-orbitron glow-text">WHO WE ARE</h2>
+                <div class="w-20 h-1 bg-primary mx-auto mb-6"></div>
+                <p class="text-xl text-gray-300 max-w-4xl mx-auto">
+                    Мы — Traffic Monsters Team. 70+ арбитражников, $5M+ оборота, 15+ источников трафика, десятки топовых ПП. Мы не просто льём — мы строим экосистему вокруг арбитража.
+                </p>
+            </div>
+            <!-- Stats Section -->
+            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 mt-16">
+                <div class="neon-card bg-black bg-opacity-50 p-8 rounded-xl text-center">
+                    <div class="text-5xl font-bold text-primary font-orbitron mb-2 counter" data-target="70">0</div>
+                    <div class="text-gray-300 uppercase text-sm tracking-wider">Человек в команде</div>
+                </div>
+                <div class="neon-card bg-black bg-opacity-50 p-8 rounded-xl text-center">
+                    <div class="text-5xl font-bold text-primary font-orbitron mb-2 counter" data-target="5">0</div>
+                    <div class="text-gray-300 uppercase text-sm tracking-wider">Млн $ валовый доход</div>
+                </div>
+                <div class="neon-card bg-black bg-opacity-50 p-8 rounded-xl text-center">
+                    <div class="text-5xl font-bold text-primary font-orbitron mb-2 counter" data-target="15">0</div>
+                    <div class="text-gray-300 uppercase text-sm tracking-wider">Источников трафика</div>
+                </div>
+                <div class="neon-card bg-black bg-opacity-50 p-8 rounded-xl text-center">
+                    <div class="text-5xl font-bold text-primary font-orbitron mb-2 counter" data-target="90">0</div>
+                    <div class="text-gray-300 uppercase text-sm tracking-wider">% в ROI за 2 недели</div>
+                </div>
+            </div>
+        </div>
+    </section>
+    <!-- Benefits Section -->
+    <section id="benefits" class="py-20 bg-gradient-to-b from-black to-gray-900">
+        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+            <div class="text-center mb-16">
+                <h2 class="text-4xl font-bold mb-4 font-orbitron glow-text">WHAT WE OFFER</h2>
+                <div class="w-20 h-1 bg-primary mx-auto mb-6"></div>
+                <p class="text-xl text-gray-300 max-w-4xl mx-auto">
+                    Мы даем новичкам все необходимое для быстрого старта и выхода на прибыль
+                </p>
+            </div>
+            <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8">
+                <div class="neon-card p-8 rounded-xl bg-gray-900 hover:bg-black transition duration-300 group">
+                    <div class="w-16 h-16 bg-primary bg-opacity-10 rounded-full flex items-center justify-center mb-6 group-hover:bg-opacity-20 transition duration-300">
+                        <i class="fas fa-graduation-cap text-primary text-2xl"></i>
+                    </div>
+                    <h3 class="text-xl font-bold mb-3 text-white">Обучение от профи</h3>
+                    <p class="text-gray-300">Пошаговое обучение от практиков с доходом $10k+/мес</p>
+                </div>
+                <div class="neon-card p-8 rounded-xl bg-gray-900 hover:bg-black transition duration-300 group">
+                    <div class="w-16 h-16 bg-primary bg-opacity-10 rounded-full flex items-center justify-center mb-6 group-hover:bg-opacity-20 transition duration-300">
+                        <i class="fas fa-link text-primary text-2xl"></i>
+                    </div>
+                    <h3 class="text-xl font-bold mb-3 text-white">Связки + офферы</h3>
+                    <p class="text-gray-300">Проверенные связки и горячие офферы с высоким EPC</p>
+                </div>
+                <div class="neon-card p-8 rounded-xl bg-gray-900 hover:bg-black transition duration-300 group">
+                    <div class="w-16 h-16 bg-primary bg-opacity-10 rounded-full flex items-center justify-center mb-6 group-hover:bg-opacity-20 transition duration-300">
+                        <i class="fas fa-briefcase text-primary text-2xl"></i>
+                    </div>
+                    <h3 class="text-xl font-bold mb-3 text-white">Работа через кейсы</h3>
+                    <p class="text-gray-300">Разбор реальных кейсов и работа над ошибками</p>
+                </div>
+                <div class="neon-card p-8 rounded-xl bg-gray-900 hover:bg-black transition duration-300 group">
+                    <div class="w-16 h-16 bg-primary bg-opacity-10 rounded-full flex items-center justify-center mb-6 group-hover:bg-opacity-20 transition duration-300">
+                        <i class="fas fa-user-tie text-primary text-2xl"></i>
+                    </div>
+                    <h3 class="text-xl font-bold mb-3 text-white">Индивидуальное менторство</h3>
+                    <p class="text-gray-300">Персональный наставник на всех этапах работы</p>
+                </div>
+            </div>
+        </div>
+    </section>
+    <!-- Case Studies Section -->
+    <section id="results" class="py-20 bg-black">
+        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+            <div class="text-center mb-16">
+                <h2 class="text-4xl font-bold mb-4 font-orbitron glow-text">OUR CASE STUDIES</h2>
+                <div class="w-20 h-1 bg-primary mx-auto mb-6"></div>
+                <p class="text-xl text-gray-300 max-w-4xl mx-auto">
+                    Реальные результаты наших арбитражных кампаний
+                </p>
+            </div>
+            <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
+                <!-- Case Study 1 -->
+                <div class="case-study rounded-xl overflow-hidden relative">
+                    <img src="data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='400' height='300' viewBox='0 0 400 300'><rect width='400' height='300' fill='%23101010'/><text x='200' y='150' font-family='Arial' font-size='20' fill='%23f6fc79' text-anchor='middle'>CASE STUDY PREVIEW</text></svg>" alt="Case Study" class="w-full h-full object-cover">
+                    <div class="case-study-overlay">
+                        <h3 class="text-xl font-bold mb-2 text-primary font-orbitron">Nutra + TikTok</h3>
+                        <p class="text-gray-300 mb-4">Доход: <span class="text-primary">$24,500</span></p>
+                        <p class="text-gray-300 mb-1">CTR: <span class="text-primary">3.8%</span></p>
+                        <p class="text-gray-300 mb-1">CR: <span class="text-primary">1.2%</span></p>
+                        <p class="text-gray-300">ROI: <span class="text-primary">287%</span></p>
+                    </div>
+                </div>
+                <!-- Case Study 2 -->
+                <div class="case-study rounded-xl overflow-hidden relative">
+                    <img src="data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='400' height='300' viewBox='0 0 400 300'><rect width='400' height='300' fill='%23101010'/><text x='200' y='150' font-family='Arial' font-size='20' fill='%23f6fc79' text-anchor='middle'>CASE STUDY PREVIEW</text></svg>" alt="Case Study" class="w-full h-full object-cover">
+                    <div class="case-study-overlay">
+                        <h3 class="text-xl font-bold mb-2 text-primary font-orbitron">Gambling + FB Ads</h3>
+                        <p class="text-gray-300 mb-4">Доход: <span class="text-primary">$18,300</span></p>
+                        <p class="text-gray-300 mb-1">CTR: <span class="text-primary">2.1%</span></p>
+                        <p class="text-gray-300 mb-1">CR: <span class="text-primary">0.8%</span></p>
+                        <p class="text-gray-300">ROI: <span class="text-primary">195%</span></p>
+                    </div>
+                </div>
+                <!-- Case Study 3 -->
+                <div class="case-study rounded-xl overflow-hidden relative">
+                    <img src="data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='400' height='300' viewBox='0 0 400 300'><rect width='400' height='300' fill='%23101010'/><text x='200' y='150' font-family='Arial' font-size='20' fill='%23f6fc79' text-anchor='middle'>CASE STUDY PREVIEW</text></svg>" alt="Case Study" class="w-full h-full object-cover">
+                    <div class="case-study-overlay">
+                        <h3 class="text-xl font-bold mb-2 text-primary font-orbitron">E-commerce + Google</h3>
+                        <p class="text-gray-300 mb-4">Доход: <span class="text-primary">$32,700</span></p>
+                        <p class="text-gray-300 mb-1">CTR: <span class="text-primary">4.5%</span></p>
+                        <p class="text-gray-300 mb-1">CR: <span class="text-primary">1.5%</span></p>
+                        <p class="text-gray-300">ROI: <span class="text-primary">320%</span></p>
+                    </div>
+                </div>
+            </div>
+            <div class="text-center mt-12">
+                <a href="#join" class="inline-block neon-btn bg-primary text-black font-bold py-3 px-8 rounded-full text-lg font-orbitron transition duration-300 transform hover:scale-105">
+                    GET ACCESS TO MORE CASES
+                </a>
+            </div>
+        </div>
+    </section>
+    <!-- Video Section -->
+    <section class="py-20 bg-gradient-to-b from-gray-900 to-black">
+        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+            <div class="text-center mb-16">
+                <h2 class="text-4xl font-bold mb-4 font-orbitron glow-text">TMT IN ACTION</h2>
+                <div class="w-20 h-1 bg-primary mx-auto mb-6"></div>
+                <p class="text-xl text-gray-300 max-w-4xl mx-auto">
+                    Посмотрите, как работает наша команда изнутри
+                </p>
+            </div>
+            <div class="video-placeholder rounded-xl overflow-hidden relative h-96 flex items-center justify-center">
+                <button class="play-btn w-20 h-20 bg-primary rounded-full flex items-center justify-center">
+                    <i class="fas fa-play text-black text-2xl"></i>
+                </button>
+            </div>
+        </div>
+    </section>
+    <!-- CTA Section -->
+    <section id="join" class="py-20 bg-black">
+        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+            <div class="text-center mb-16">
+                <h2 class="text-4xl font-bold mb-4 font-orbitron glow-text">ГОТОВ РАСТИ ВМЕСТЕ С ЛУЧШИМИ?</h2>
+                <div class="w-20 h-1 bg-primary mx-auto mb-6"></div>
+                <p class="text-xl text-gray-300 max-w-4xl mx-auto">
+                    Оставь заявку �� и начни путь в арбитраж с монстрами трафика.
+                </p>
+            </div>
+            <div class="max-w-2xl mx-auto bg-gray-900 rounded-xl p-8 neon-card">
+                <form class="space-y-6">
+                    <div>
+                        <label for="name" class="block text-sm font-medium text-gray-300 mb-1">Ваше имя</label>
+                        <input type="text" id="name" class="form-input w-full px-4 py-3 rounded-lg focus:ring-2 focus:ring-primary">
+                    </div>
+                    <div>
+                        <label for="telegram" class="block text-sm font-medium text-gray-300 mb-1">Ваш Telegram</label>
+                        <input type="text" id="telegram" class="form-input w-full px-4 py-3 rounded-lg focus:ring-2 focus:ring-primary">
+                    </div>
+                    <div>
+                        <label for="experience" class="block text-sm font-medium text-gray-300 mb-1">Опыт в арбитраже</label>
+                        <select id="experience" class="form-input w-full px-4 py-3 rounded-lg focus:ring-2 focus:ring-primary">
+                            <option value="none">Новичок (нет опыта)</option>
+                            <option value="beginner">Начинающий (до 3 месяцев)</option>
+                            <option value="intermediate">Средний уровень (3-12 месяцев)</option>
+                            <option value="advanced">Опытный (более года)</option>
+                        </select>
+                    </div>
+                    <div>
+                        <button type="submit" class="w-full neon-btn bg-primary text-black font-bold py-3 px-4 rounded-lg text-lg font-orbitron transition duration-300 hover:bg-opacity-90">
+                            ОТПРАВИТЬ ЗАЯВКУ
+                        </button>
+                    </div>
+                </form>
+            </div>
+        </div>
+    </section>
+    <!-- Footer -->
+    <footer class="bg-gray-900 py-12 border-t border-gray-800">
+        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+            <div class="flex flex-col md:flex-row justify-between items-center">
+                <div class="flex items-center mb-6 md:mb-0">
+                    <div class="neon-ring rounded-full w-10 h-10 flex items-center justify-center">
+                        <span class="text-primary font-bold text-xl font-orbitron">TMT</span>
+                    </div>
+                    <span class="ml-3 text-primary font-orbitron text-xl">TRAFFIC MONSTERS</span>
+                </div>
+                <div class="flex space-x-6">
+                    <a href="#" class="text-gray-400 hover:text-primary">
+                        <i class="fab fa-telegram text-2xl"></i>
+                    </a>
+                    <a href="#" class="text-gray-400 hover:text-primary">
+                        <i class="fab fa-instagram text-2xl"></i>
+                    </a>
+                    <a href="#" class="text-gray-400 hover:text-primary">
+                        <i class="fab fa-youtube text-2xl"></i>
+                    </a>
+                </div>
+            </div>
+            <div class="mt-8 pt-8 border-t border-gray-800 flex flex-col md:flex-row justify-between items-center">
+                <p class="text-gray-400 text-sm mb-4 md:mb-0">© 2023 Traffic Monsters Team. All rights reserved.</p>
+                <div class="flex space-x-6">
+                    <a href="#" class="text-gray-400 hover:text-primary text-sm">Privacy Policy</a>
+                    <a href="#" class="text-gray-400 hover:text-primary text-sm">Terms of Service</a>
+                    <a href="#" class="text-gray-400 hover:text-primary text-sm">Contact Us</a>
+                </div>
+            </div>
+        </div>
+    </footer>
+    <script>
+        // Counter animation
+        const counters = document.querySelectorAll('.counter');
+        const speed = 200;
+        counters.forEach(counter => {
+            const target = +counter.getAttribute('data-target');
+            const count = +counter.innerText;
+            const increment = target / speed;
+            if(count < target) {
+                counter.innerText = Math.ceil(count + increment);
+                setTimeout(updateCounter, 1);
+            } else {
+                counter.innerText = target + '+';
+            }
+            function updateCounter() {
+                const count = +counter.innerText;
+                const increment = target / speed;
+                if(count < target) {
+                    counter.innerText = Math.ceil(count + increment);
+                    setTimeout(updateCounter, 1);
+                } else {
+                    counter.innerText = target + '+';
+                }
+            }
+        });
+        // Smooth scrolling for anchor links
+        document.querySelectorAll('a[href^="#"]').forEach(anchor => {
+            anchor.addEventListener('click', function (e) {
+                e.preventDefault();
+                document.querySelector(this.getAttribute('href')).scrollIntoView({
+                    behavior: 'smooth'
+                });
+            });
+        });
+        // Play button click handler
+        document.querySelector('.play-btn').addEventListener('click', function() {
+            alert('Video playback would start here in a real implementation');
+        });
+        // Form submission handler
+        const form = document.querySelector('form');
+        if(form) {
+            form.addEventListener('submit', function(e) {
+                e.preventDefault();
+                alert('Form submitted! In a real implementation, this would send data to a server.');
+            });
+        }
+    </script>
+<p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=timoon811/tmt21" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
+</html>

prompts.txt ADDED Viewed

	@@ -0,0 +1 @@

+ 🔥 Техническое задание: Сайт команды TMT (Traffic Monsters Team) 🎯 Общая концепция Сайт должен быть в футуристично-неоновом стиле, как в примере с Behance. Цель — сразу передать ощущение силы, профессионализма и технологического превосходства команды арбитражников. ⸻ 🧩 1. Hero-блок (Первый экран) • Заголовок: TRAFFIC MASTERS OF THE DIGITAL JUNGLE (или вариации типа “DIGITIZE THE CASHFLOW”, “UNLEASH THE TRAFFIC POWER”) • Подзаголовок: TMT — команда топовых арбитражников. Мы не ливаем трафик, мы его приручаем. • Анимация: Пульсирующее неоновое кольцо, 3D-волнa или вихрь вокруг логотипа TMT. Мягкое появление текста с эффектом “неонового мерцания”. • Кнопки: • JOIN THE TEAM (призыв в команду) • SEE OUR RESULTS (с якорем вниз к кейсам) • Визуал: • Использовать 3D-рендер потока данных или “цифрового торнадо” • Добавить кастомный видеобэкграунд (опционально) ⸻ 🧭 2. О команде • Заголовок: WHO WE ARE • Текст: Мы — Traffic Monsters Team. 70+ арбитражников, $5M+ оборота, 15+ источников трафика, десятки топовых ПП. Мы не просто льём — мы строим экосистему вокруг арбитража. • Эффект: параллакс при скролле, фоны с абстрактными паттернами ⸻ 📈 3. Цифры / достижения • Блок с анимацией счётчиков: • 70+ человек в команде • $5M+ валовый доход • 15+ источников трафика • 90% обученных — в ROI за 2 недели ⸻ 🧠 4. Что мы даём новичкам / джунам • Карточки с преимуществами: • Обучение от профи • Связки + офферы • Работа через кейсы • Индивидуальное менторство • Стилизация: неоновые рамки, светящийся hover, иконки с micro-анимацией ⸻ 💥 5. Примеры кейсов (портфолио) • Слайдер с карточками кейсов: • Название связки • Платформа (FB/TikTok/Google) • Доход (в цифрах) • CTR, CR, ROI • Эффекты при наведении: зум, прозрачность, overlay с цифрами ⸻ 🎬 6. Видео / Motion Section • Кнопка Play с заглушкой как в твоём примере • Видео: внутрикомандная движуха, сторис, офис, TMT-челленджи • Формат: 20–30 сек микс ⸻ 💌 7. CTA-блок “Вступить в команду” • Заголовок: ГОТОВ РАСТИ ВМЕСТЕ С ЛУЧШИМИ? • Подзаголовок: Оставь заявку — и начни путь в арбитраж с монстрами трафика. • Форма: имя, Telegram, опыт ⸻ 🎨 Цветовая палитра (пример, адаптируй под брендбук TMT) • Чёрный фон: #0E0E0E • Акцент: #f6fc79 (по твоему брендбуку) + переливы/градиенты • Текст: белый #FFFFFF, второстепенный серый #A1A1A1