Spaces:

timoon811
/

land2arg

Running

App Files Files Community

land2arg / index.html

timoon811

Add 2 files

7ac8bb1 verified 10 months ago

raw

history blame contribute delete

76 kB

	<!DOCTYPE html>
	<html lang="ru">
	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Traffic Master - Симулятор арбитражника</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">
	<link href="https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@400;500;700&display=swap" rel="stylesheet">
	<style>
	body {
	font-family: 'Roboto Mono', monospace;
	background-color: #0a0a0a;
	color: #e2e2e2;
	overflow-x: hidden;
	}

	.neon-purple {
	color: #c678dd;
	text-shadow: 0 0 5px #c678dd, 0 0 10px #c678dd;
	}

	.neon-green {
	color: #98c379;
	text-shadow: 0 0 5px #98c379, 0 0 10px #98c379;
	}

	.neon-blue {
	color: #61afef;
	text-shadow: 0 0 5px #61afef, 0 0 10px #61afef;
	}

	.glow-box {
	box-shadow: 0 0 10px rgba(198, 120, 221, 0.5);
	border: 1px solid rgba(198, 120, 221, 0.3);
	}

	.glow-box-green {
	box-shadow: 0 0 10px rgba(152, 195, 121, 0.5);
	border: 1px solid rgba(152, 195, 121, 0.3);
	}

	.glow-box-blue {
	box-shadow: 0 0 10px rgba(97, 175, 239, 0.5);
	border: 1px solid rgba(97, 175, 239, 0.3);
	}

	.terminal-line {
	position: relative;
	padding-left: 1.5rem;
	}

	.terminal-line:before {
	content: ">";
	position: absolute;
	left: 0;
	color: #98c379;
	}

	.fade-in {
	animation: fadeIn 1s ease-in;
	}

	@keyframes fadeIn {
	from { opacity: 0; }
	to { opacity: 1; }
	}

	.slide-up {
	animation: slideUp 0.5s ease-out;
	}

	@keyframes slideUp {
	from { transform: translateY(20px); opacity: 0; }
	to { transform: translateY(0); opacity: 1; }
	}

	.blurred {
	filter: blur(5px);
	transition: filter 0.3s ease;
	}

	.blurred:hover {
	filter: blur(0);
	}

	.notification {
	animation: slideInRight 0.5s ease-out, fadeOut 0.5s ease-out 4s forwards;
	}

	@keyframes slideInRight {
	from { transform: translateX(100%); }
	to { transform: translateX(0); }
	}

	@keyframes fadeOut {
	from { opacity: 1; }
	to { opacity: 0; display: none; }
	}

	.console-input {
	background-color: rgba(10, 10, 10, 0.7);
	border: 1px solid #333;
	color: #98c379;
	font-family: 'Roboto Mono', monospace;
	padding: 0.5rem;
	width: 100%;
	}

	.console-input:focus {
	outline: none;
	border-color: #c678dd;
	box-shadow: 0 0 10px rgba(198, 120, 221, 0.5);
	}

	.tab-content {
	display: none;
	}

	.tab-content.active {
	display: block;
	animation: fadeIn 0.5s ease-in;
	}

	.tab-button.active {
	border-bottom: 2px solid #c678dd;
	color: #c678dd;
	}

	.access-level {
	transition: all 0.3s ease;
	}

	.access-level:hover {
	transform: translateY(-5px);
	box-shadow: 0 10px 20px rgba(198, 120, 221, 0.3);
	}

	.profile-card {
	transition: all 0.3s ease;
	}

	.profile-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 10px 20px rgba(97, 175, 239, 0.3);
	}

	.profile-hover {
	opacity: 0;
	transition: all 0.3s ease;
	transform: translateY(10px);
	}

	.profile-card:hover .profile-hover {
	opacity: 1;
	transform: translateY(0);
	}

	.top-row {
	background: linear-gradient(90deg, rgba(198, 120, 221, 0.1), rgba(198, 120, 221, 0.3), rgba(198, 120, 221, 0.1));
	animation: pulse 2s infinite;
	}

	@keyframes pulse {
	0% { background-color: rgba(198, 120, 221, 0.1); }
	50% { background-color: rgba(198, 120, 221, 0.3); }
	100% { background-color: rgba(198, 120, 221, 0.1); }
	}

	.record-row {
	background: linear-gradient(90deg, rgba(152, 195, 121, 0.1), rgba(152, 195, 121, 0.3), rgba(152, 195, 121, 0.1));
	}

	.loading-bar {
	width: 0;
	height: 2px;
	background-color: #98c379;
	animation: loading 2s forwards;
	}

	@keyframes loading {
	0% { width: 0; }
	100% { width: 100%; }
	}

	.accordion-item {
	border-bottom: 1px solid rgba(198, 120, 221, 0.2);
	}

	.accordion-header {
	cursor: pointer;
	padding: 1rem 0;
	}

	.accordion-content {
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.3s ease-out;
	}

	.accordion-content.active {
	max-height: 500px;
	transition: max-height 0.5s ease-in;
	}

	.bonus-card {
	transition: all 0.3s ease;
	position: relative;
	overflow: hidden;
	}

	.bonus-card:hover {
	transform: translateY(-5px);
	}

	.bonus-card::after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: linear-gradient(135deg, rgba(198, 120, 221, 0.1), rgba(152, 195, 121, 0.1));
	opacity: 0;
	transition: opacity 0.3s ease;
	}

	.bonus-card:hover::after {
	opacity: 1;
	}
	</style>
	</head>
	<body class="min-h-screen">
	<!-- Dashboard Intro -->
	<section id="dashboard-intro" class="min-h-screen flex flex-col justify-center items-center p-4 relative overflow-hidden">
	<div class="absolute inset-0 bg-gradient-to-br from-purple-900/20 to-transparent opacity-30"></div>
	<div class="absolute bottom-0 left-0 w-full h-1/3 bg-gradient-to-t from-black to-transparent"></div>

	<div class="relative z-10 max-w-4xl mx-auto text-center fade-in">
	<div class="terminal-line text-xl md:text-3xl mb-6">
	<span class="neon-green">system@traffic-master:~$</span> <span class="neon-purple">init dashboard</span>
	</div>

	<div class="terminal-line text-sm md:text-base mb-2">
	<span class="text-gray-400">> Checking permissions...</span>
	</div>

	<div class="terminal-line text-sm md:text-base mb-2">
	<span class="text-gray-400">> Loading modules...</span>
	</div>

	<div class="terminal-line text-sm md:text-base mb-8">
	<span class="text-gray-400">> Connecting to TMT network...</span>
	</div>

	<h1 class="text-4xl md:text-6xl font-bold mb-6 neon-purple">TRAFFIC MASTER</h1>
	<p class="text-xl md:text-2xl mb-10 neon-blue">Система медиабаинга нового поколения</p>

	<button id="enter-dashboard" class="bg-transparent glow-box hover:bg-purple-900/30 text-white font-bold py-3 px-8 rounded-lg transition-all duration-300 transform hover:scale-105">
	<span class="neon-green">Войти в дашборд</span>
	</button>
	</div>

	<div class="absolute bottom-10 left-0 right-0 text-center text-gray-500 text-sm">
	<p>system v3.4.2 \| TMT Core © 2023</p>
	</div>
	</section>

	<!-- Main Content (hidden initially) -->
	<div id="main-content" class="hidden">
	<!-- Header -->
	<header class="bg-black/80 backdrop-blur-sm border-b border-gray-800 fixed top-0 left-0 right-0 z-50">
	<div class="container mx-auto px-4 py-3 flex justify-between items-center">
	<div class="flex items-center space-x-2">
	<div class="w-8 h-8 rounded-full bg-purple-900 flex items-center justify-center">
	<span class="text-purple-300 font-bold">TM</span>
	</div>
	<span class="text-xl font-bold neon-purple">TRAFFIC MASTER</span>
	</div>

	<nav class="hidden md:flex space-x-6">
	<a href="#about" class="text-gray-400 hover:text-purple-300 transition">О системе</a>
	<a href="#profiles" class="text-gray-400 hover:text-purple-300 transition">Профили</a>
	<a href="#program" class="text-gray-400 hover:text-purple-300 transition">Модули</a>
	<a href="#results" class="text-gray-400 hover:text-purple-300 transition">Результаты</a>
	<a href="#benefits" class="text-gray-400 hover:text-purple-300 transition">Результаты</a>
	<a href="#access" class="text-gray-400 hover:text-purple-300 transition">Доступ</a>
	</nav>

	<button id="connect-btn" class="bg-transparent border border-purple-500/50 text-purple-300 hover:bg-purple-900/30 px-4 py-1 rounded-md text-sm transition">
	Подключиться
	</button>
	</div>
	</header>

	<!-- About TMT Section -->
	<section id="about" class="pt-32 pb-20 px-4 container mx-auto">
	<div class="text-center mb-16">
	<h2 class="text-3xl md:text-4xl font-bold mb-4 neon-blue">TMT CORE SYSTEM</h2>
	<p class="text-gray-400 max-w-2xl mx-auto">Централизованная система управления трафиком и автоматизации медиабаинга</p>
	</div>

	<div class="grid grid-cols-1 md:grid-cols-2 gap-8 items-center">
	<div class="glow-box p-6 rounded-lg bg-gray-900/50">
	<div class="flex justify-between items-start mb-6">
	<div>
	<h3 class="text-xl font-bold mb-2 neon-green">Финансовый дашборд</h3>
	<p class="text-gray-400 text-sm">Общий оборот системы</p>
	</div>
	<span class="text-xs bg-green-900/50 text-green-300 px-2 py-1 rounded">LIVE</span>
	</div>

	<div class="bg-black/50 p-4 rounded mb-4">
	<div class="flex justify-between items-center mb-2">
	<span class="text-gray-400">Total volume:</span>
	<span class="text-2xl font-bold neon-green" id="counter">$0</span>
	</div>
	<div class="h-1 bg-gray-800 rounded-full overflow-hidden">
	<div class="h-full bg-gradient-to-r from-purple-500 to-green-500" style="width: 85%"></div>
	</div>
	</div>

	<div class="grid grid-cols-3 gap-4 text-center">
	<div class="bg-black/30 p-3 rounded">
	<p class="text-gray-400 text-xs">Вертикали</p>
	<p class="text-xl font-bold neon-purple">5+</p>
	</div>
	<div class="bg-black/30 p-3 rounded">
	<p class="text-gray-400 text-xs">Команда</p>
	<p class="text-xl font-bold neon-blue">20+</p>
	</div>
	<div class="bg-black/30 p-3 rounded">
	<p class="text-gray-400 text-xs">Связки</p>
	<p class="text-xl font-bold neon-green">100+</p>
	</div>
	</div>
	</div>

	<div class="glow-box-blue p-6 rounded-lg bg-gray-900/50">
	<div class="flex items-center space-x-4 mb-6">
	<div class="w-16 h-16 rounded-full bg-gray-800 overflow-hidden">
	<img src="https://randomuser.me/api/portraits/men/32.jpg" alt="Тимур" class="w-full h-full object-cover">
	</div>
	<div>
	<h3 class="text-xl font-bold neon-blue">Тимур Махмутов</h3>
	<p class="text-gray-400 text-sm">Lead System Architect</p>
	</div>
	</div>

	<div class="bg-black/50 p-4 rounded mb-4">
	<p class="text-gray-300 mb-3">"Мы создали систему, которая превращает знания в стабильный доход. Теперь ты не просто арбитражник — ты оператор прибыльного трафик-контура."</p>
	<div class="flex space-x-2">
	<span class="text-xs bg-blue-900/50 text-blue-300 px-2 py-1 rounded">TMT Founder</span>
	<span class="text-xs bg-purple-900/50 text-purple-300 px-2 py-1 rounded">5+ лет в арбитраже</span>
	</div>
	</div>

	<div class="flex space-x-2">
	<a href="#" class="text-gray-400 hover:text-blue-300"><i class="fab fa-telegram"></i></a>
	<a href="#" class="text-gray-400 hover:text-blue-300"><i class="fab fa-instagram"></i></a>
	<a href="#" class="text-gray-400 hover:text-blue-300"><i class="fab fa-linkedin"></i></a>
	</div>
	</div>
	</div>
	</section>

	<!-- Who Is It For Section -->
	<section id="profiles" class="py-20 px-4 bg-gray-900/30">
	<div class="container mx-auto">
	<div class="text-center mb-16">
	<h2 class="text-3xl md:text-4xl font-bold mb-4 neon-purple">КОМУ ПОДОЙДЁТ СИСТЕМА</h2>
	<p class="text-gray-400 max-w-2xl mx-auto">Выбери свой профиль для интеграции с TMT Core</p>
	</div>

	<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-6">
	<!-- Profile 1 -->
	<div class="profile-card glow-box rounded-lg bg-gray-900/50 p-6 cursor-pointer">
	<div class="flex items-center space-x-3 mb-4">
	<div class="w-10 h-10 rounded-full bg-purple-900/50 flex items-center justify-center">
	<span class="text-purple-300">🧑</span>
	</div>
	<h3 class="text-lg font-bold neon-purple">Новичок</h3>
	</div>
	<p class="text-gray-400 text-sm mb-4">Только начинаешь в арбитраже? Система проведёт тебя от основ до первых прибылей.</p>

	<div class="profile-hover">
	<div class="bg-black/50 p-3 rounded text-xs">
	<p class="neon-green mb-1">"Ты не знал с чего начать. Теперь у тебя есть чёткий алгоритм."</p>
	<p class="text-gray-400">Средний ROI: 120% за 3 месяца</p>
	</div>
	</div>
	</div>

	<!-- Profile 2 -->
	<div class="profile-card glow-box rounded-lg bg-gray-900/50 p-6 cursor-pointer">
	<div class="flex items-center space-x-3 mb-4">
	<div class="w-10 h-10 rounded-full bg-blue-900/50 flex items-center justify-center">
	<span class="text-blue-300">🧑‍💻</span>
	</div>
	<h3 class="text-lg font-bold neon-blue">Таргетолог</h3>
	</div>
	<p class="text-gray-400 text-sm mb-4">Умеешь настраивать рекламу? Научись превращать клики в стабильный доход.</p>

	<div class="profile-hover">
	<div class="bg-black/50 p-3 rounded text-xs">
	<p class="neon-green mb-1">"Ты уже знал рекламу. Теперь будешь знать деньги."</p>
	<p class="text-gray-400">Средний ROI: 180% за 2 месяца</p>
	</div>
	</div>
	</div>

	<!-- Profile 3 -->
	<div class="profile-card glow-box rounded-lg bg-gray-900/50 p-6 cursor-pointer">
	<div class="flex items-center space-x-3 mb-4">
	<div class="w-10 h-10 rounded-full bg-green-900/50 flex items-center justify-center">
	<span class="text-green-300">🧟</span>
	</div>
	<h3 class="text-lg font-bold neon-green">Фрилансер</h3>
	</div>
	<p class="text-gray-400 text-sm mb-4">Работаешь на заказы? Переходи на свою систему с предсказуемым доходом.</p>

	<div class="profile-hover">
	<div class="bg-black/50 p-3 rounded text-xs">
	<p class="neon-green mb-1">"Ты менял время на деньги. Теперь деньги работают на тебя."</p>
	<p class="text-gray-400">Средний ROI: 200% за 1.5 месяца</p>
	</div>
	</div>
	</div>

	<!-- Profile 4 -->
	<div class="profile-card glow-box rounded-lg bg-gray-900/50 p-6 cursor-pointer">
	<div class="flex items-center space-x-3 mb-4">
	<div class="w-10 h-10 rounded-full bg-yellow-900/50 flex items-center justify-center">
	<span class="text-yellow-300">👨‍✈️</span>
	</div>
	<h3 class="text-lg font-bold neon-purple">Тимлид</h3>
	</div>
	<p class="text-gray-400 text-sm mb-4">Управляешь командой? Масштабируй прибыль с автоматизированными процессами.</p>

	<div class="profile-hover">
	<div class="bg-black/50 p-3 rounded text-xs">
	<p class="neon-green mb-1">"Ты управлял людьми. Теперь управляй системой."</p>
	<p class="text-gray-400">Средний ROI: 250% за 1 месяц</p>
	</div>
	</div>
	</div>
	</div>
	</div>
	</section>

	<!-- Benefits Section -->
	<section id="benefits" class="py-20 px-4 container mx-auto">
	<div class="text-center mb-16">
	<h2 class="text-3xl md:text-4xl font-bold mb-4 neon-green">ЧТО ПОЛУЧИШЬ НА КУРСЕ</h2>
	<p class="text-gray-400 max-w-2xl mx-auto">Кем ты станешь после прохождения TMT Core</p>
	</div>

	<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
	<div class="glow-box rounded-lg bg-gray-900/50 p-6">
	<div class="flex items-center mb-4">
	<div class="w-10 h-10 rounded-full bg-purple-900/30 flex items-center justify-center mr-4">
	<span class="text-purple-300 text-xl">🔍</span>
	</div>
	<h3 class="text-xl font-bold neon-purple">Аналитик трафика</h3>
	</div>
	<p class="text-gray-400">Научишься анализировать и сегментировать трафик, находить лучшие источники и оптимизировать каналы привлечения.</p>
	</div>

	<div class="glow-box-blue rounded-lg bg-gray-900/50 p-6">
	<div class="flex items-center mb-4">
	<div class="w-10 h-10 rounded-full bg-blue-900/30 flex items-center justify-center mr-4">
	<span class="text-blue-300 text-xl">📊</span>
	</div>
	<h3 class="text-xl font-bold neon-blue">Специалист по монетизации</h3>
	</div>
	<p class="text-gray-400">Сможешь превращать любой трафик в деньги, подбирая оптимальные офферы и связки под каждую аудиторию.</p>
	</div>

	<div class="glow-box-green rounded-lg bg-gray-900/50 p-6">
	<div class="flex items-center mb-4">
	<div class="w-10 h-10 rounded-full bg-green-900/30 flex items-center justify-center mr-4">
	<span class="text-green-300 text-xl">🚀</span>
	</div>
	<h3 class="text-xl font-bold neon-green">Оператор прибыли</h3>
	</div>
	<p class="text-gray-400">Будешь управлять автоматизированными трафик-контурами, приносящими стабильный доход без ежедневного контроля.</p>
	</div>

	<div class="glow-box rounded-lg bg-gray-900/50 p-6">
	<div class="flex items-center mb-4">
	<div class="w-10 h-10 rounded-full bg-purple-900/30 flex items-center justify-center mr-4">
	<span class="text-purple-300 text-xl">🛡️</span>
	</div>
	<h3 class="text-xl font-bold neon-purple">Эксперт по безопасности</h3>
	</div>
	<p class="text-gray-400">Научишься обходить блокировки, защищать аккаунты и работать без потерь даже в самых сложных условиях.</p>
	</div>

	<div class="glow-box-blue rounded-lg bg-gray-900/50 p-6">
	<div class="flex items-center mb-4">
	<div class="w-10 h-10 rounded-full bg-blue-900/30 flex items-center justify-center mr-4">
	<span class="text-blue-300 text-xl">📈</span>
	</div>
	<h3 class="text-xl font-bold neon-blue">Мастер скейлинга</h3>
	</div>
	<p class="text-gray-400">Сможешь масштабировать успешные связки до 10K+ в месяц, управляя бюджетом и рисками.</p>
	</div>

	<div class="glow-box-green rounded-lg bg-gray-900/50 p-6">
	<div class="flex items-center mb-4">
	<div class="w-10 h-10 rounded-full bg-green-900/30 flex items-center justify-center mr-4">
	<span class="text-green-300 text-xl">💼</span>
	</div>
	<h3 class="text-xl font-bold neon-green">Бизнес-архитектор</h3>
	</div>
	<p class="text-gray-400">Построишь собственную систему арбитража, которая работает на тебя 24/7 и приносит пассивный доход.</p>
	</div>
	</div>
	</section>

	<!-- Bonuses Section -->
	<section id="bonuses" class="py-20 px-4 bg-gray-900/30">
	<div class="container mx-auto">
	<div class="text-center mb-16">
	<h2 class="text-3xl md:text-4xl font-bold mb-4 neon-blue">БОНУСЫ КУРСА</h2>
	<p class="text-gray-400 max-w-2xl mx-auto">Дополнительные материалы и инструменты для твоего роста</p>
	</div>

	<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
	<div class="bonus-card glow-box rounded-lg bg-gray-900/50 p-6">
	<div class="flex items-center mb-4">
	<div class="w-12 h-12 rounded-full bg-purple-900/20 flex items-center justify-center mr-4">
	<span class="text-purple-300 text-2xl">📚</span>
	</div>
	<h3 class="text-xl font-bold neon-purple">Библиотека связок</h3>
	</div>
	<p class="text-gray-400 mb-4">100+ проверенных связок с детальными разборами и ROI по каждой.</p>
	<div class="text-xs text-purple-300">Доступно с Level 2</div>
	</div>

	<div class="bonus-card glow-box-blue rounded-lg bg-gray-900/50 p-6">
	<div class="flex items-center mb-4">
	<div class="w-12 h-12 rounded-full bg-blue-900/20 flex items-center justify-center mr-4">
	<span class="text-blue-300 text-2xl">🎨</span>
	</div>
	<h3 class="text-xl font-bold neon-blue">Коллекция креативов</h3>
	</div>
	<p class="text-gray-400 mb-4">500+ конвертящих креативов и шаблонов лендингов с CTR от 5%.</p>
	<div class="text-xs text-blue-300">Доступно с Level 2</div>
	</div>

	<div class="bonus-card glow-box-green rounded-lg bg-gray-900/50 p-6">
	<div class="flex items-center mb-4">
	<div class="w-12 h-12 rounded-full bg-green-900/20 flex items-center justify-center mr-4">
	<span class="text-green-300 text-2xl">🤖</span>
	</div>
	<h3 class="text-xl font-bold neon-green">Автоматизация</h3>
	</div>
	<p class="text-gray-400 mb-4">Готовые скрипты и боты для автоматизации рутинных процессов.</p>
	<div class="text-xs text-green-300">Доступно с Level 3</div>
	</div>

	<div class="bonus-card glow-box rounded-lg bg-gray-900/50 p-6">
	<div class="flex items-center mb-4">
	<div class="w-12 h-12 rounded-full bg-purple-900/20 flex items-center justify-center mr-4">
	<span class="text-purple-300 text-2xl">🛠️</span>
	</div>
	<h3 class="text-xl font-bold neon-purple">Инструментарий</h3>
	</div>
	<p class="text-gray-400 mb-4">Набор профессиональных инструментов для аналитики и оптимизации.</p>
	<div class="text-xs text-purple-300">Доступно с Level 1</div>
	</div>

	<div class="bonus-card glow-box-blue rounded-lg bg-gray-900/50 p-6">
	<div class="flex items-center mb-4">
	<div class="w-12 h-12 rounded-full bg-blue-900/20 flex items-center justify-center mr-4">
	<span class="text-blue-300 text-2xl">👥</span>
	</div>
	<h3 class="text-xl font-bold neon-blue">Закрытый клуб</h3>
	</div>
	<p class="text-gray-400 mb-4">Доступ в приватное сообщество топ-арбитражников с еженедельными разборами.</p>
	<div class="text-xs text-blue-300">Доступно с Level 2</div>
	</div>

	<div class="bonus-card glow-box-green rounded-lg bg-gray-900/50 p-6">
	<div class="flex items-center mb-4">
	<div class="w-12 h-12 rounded-full bg-green-900/20 flex items-center justify-center mr-4">
	<span class="text-green-300 text-2xl">🎓</span>
	</div>
	<h3 class="text-xl font-bold neon-green">Личный ментор</h3>
	</div>
	<p class="text-gray-400 mb-4">Персональные консультации с экспертами системы 2 раза в месяц.</p>
	<div class="text-xs text-green-300">Доступно с Level 3</div>
	</div>
	</div>
	</div>
	</section>

	<!-- Program Section -->
	<section id="program" class="py-20 px-4 container mx-auto">
	<div class="text-center mb-16">
	<h2 class="text-3xl md:text-4xl font-bold mb-4 neon-blue">ПРОГРАММА СИСТЕМЫ</h2>
	<p class="text-gray-400 max-w-2xl mx-auto">Полный цикл интеграции с TMT Core</p>
	</div>

	<div class="glow-box rounded-lg bg-gray-900/50 overflow-hidden">
	<div class="flex overflow-x-auto border-b border-gray-800">
	<button class="tab-button px-6 py-3 font-medium text-sm border-b-2 border-transparent active" data-tab="basics">Основы</button>
	<button class="tab-button px-6 py-3 font-medium text-sm border-b-2 border-transparent" data-tab="bundles">Связки</button>
	<button class="tab-button px-6 py-3 font-medium text-sm border-b-2 border-transparent" data-tab="creatives">Креативы</button>
	<button class="tab-button px-6 py-3 font-medium text-sm border-b-2 border-transparent" data-tab="traffic">Трафик</button>
	<button class="tab-button px-6 py-3 font-medium text-sm border-b-2 border-transparent" data-tab="scale">Скейл</button>
	</div>

	<div class="p-6">
	<div id="basics" class="tab-content active">
	<h3 class="text-xl font-bold mb-4 neon-purple">Основы медиабаинга</h3>
	<p class="text-gray-300 mb-6">Фундаментальные принципы работы с трафиком и его монетизации.</p>

	<div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-6">
	<div class="bg-black/30 p-4 rounded border border-gray-800">
	<div class="flex items-center mb-2">
	<div class="w-6 h-6 rounded-full bg-purple-900/50 flex items-center justify-center mr-2">
	<span class="text-purple-300 text-xs">1</span>
	</div>
	<h4 class="font-bold">Архитектура прибыли</h4>
	</div>
	<p class="text-gray-400 text-sm">Как устроен доход в арбитраже трафика</p>
	</div>

	<div class="bg-black/30 p-4 rounded border border-gray-800">
	<div class="flex items-center mb-2">
	<div class="w-6 h-6 rounded-full bg-purple-900/50 flex items-center justify-center mr-2">
	<span class="text-purple-300 text-xs">2</span>
	</div>
	<h4 class="font-bold">Инструментарий</h4>
	</div>
	<p class="text-gray-400 text-sm">Keitaro, Binom, Facebook Ads и другие</p>
	</div>

	<div class="bg-black/30 p-4 rounded border border-gray-800 blurred">
	<div class="flex items-center mb-2">
	<div class="w-6 h-6 rounded-full bg-purple-900/50 flex items-center justify-center mr-2">
	<span class="text-purple-300 text-xs">3</span>
	</div>
	<h4 class="font-bold">Безопасность</h4>
	</div>
	<p class="text-gray-400 text-sm">Как работать без блокировок и потерь</p>
	</div>

	<div class="bg-black/30 p-4 rounded border border-gray-800 blurred">
	<div class="flex items-center mb-2">
	<div class="w-6 h-6 rounded-full bg-purple-900/50 flex items-center justify-center mr-2">
	<span class="text-purple-300 text-xs">4</span>
	</div>
	<h4 class="font-bold">Первая связка</h4>
	</div>
	<p class="text-gray-400 text-sm">От запуска до первых результатов</p>
	</div>
	</div>
	</div>

	<div id="bundles" class="tab-content">
	<h3 class="text-xl font-bold mb-4 neon-blue">Рабочие связки</h3>
	<p class="text-gray-300 mb-6">Проверенные схемы монетизации трафика в разных вертикалях.</p>
	<div class="bg-black/30 p-8 rounded border border-gray-800 text-center">
	<p class="text-gray-400">Для просмотра этого модуля требуется доступ Level 2: Operator</p>
	<button class="mt-4 bg-transparent border border-blue-500/50 text-blue-300 hover:bg-blue-900/30 px-4 py-1 rounded-md text-sm transition">
	Получить доступ
	</button>
	</div>
	</div>

	<div id="creatives" class="tab-content">
	<h3 class="text-xl font-bold mb-4 neon-green">Креативы и лендинги</h3>
	<p class="text-gray-300 mb-6">Как создавать конвертящие креативы и landing pages.</p>
	<div class="bg-black/30 p-8 rounded border border-gray-800 text-center">
	<p class="text-gray-400">Для просмотра этого модуля требуется доступ Level 2: Operator</p>
	<button class="mt-4 bg-transparent border border-green-500/50 text-green-300 hover:bg-green-900/30 px-4 py-1 rounded-md text-sm transition">
	Получить доступ
	</button>
	</div>
	</div>

	<div id="traffic" class="tab-content">
	<h3 class="text-xl font-bold mb-4 neon-purple">Работа с трафиком</h3>
	<p class="text-gray-300 mb-6">Оптимизация и масштабирование трафика.</p>
	<div class="bg-black/30 p-8 rounded border border-gray-800 text-center">
	<p class="text-gray-400">Для просмотра этого модуля требуется доступ Level 3: Elite</p>
	<button class="mt-4 bg-transparent border border-purple-500/50 text-purple-300 hover:bg-purple-900/30 px-4 py-1 rounded-md text-sm transition">
	Получить доступ
	</button>
	</div>
	</div>

	<div id="scale" class="tab-content">
	<h3 class="text-xl font-bold mb-4 neon-blue">Масштабирование</h3>
	<p class="text-gray-300 mb-6">Как вывести систему на стабильный доход 5K+ в месяц.</p>
	<div class="bg-black/30 p-8 rounded border border-gray-800 text-center">
	<p class="text-gray-400">Для просмотра этого модуля требуется доступ Level 3: Elite</p>
	<button class="mt-4 bg-transparent border border-blue-500/50 text-blue-300 hover:bg-blue-900/30 px-4 py-1 rounded-md text-sm transition">
	Получить доступ
	</button>
	</div>
	</div>
	</div>
	</div>
	</section>

	<!-- FAQ Section -->
	<section id="faq" class="py-20 px-4 bg-gray-900/30">
	<div class="container mx-auto">
	<div class="text-center mb-16">
	<h2 class="text-3xl md:text-4xl font-bold mb-4 neon-purple">FAQ</h2>
	<p class="text-gray-400 max-w-2xl mx-auto">Ответы на часто задаваемые вопросы</p>
	</div>

	<div class="glow-box rounded-lg bg-gray-900/50 p-6 max-w-3xl mx-auto">
	<div class="accordion-item">
	<div class="accordion-header flex justify-between items-center">
	<h3 class="text-lg font-bold neon-blue">Сколько времени нужно уделять системе?</h3>
	<span class="text-purple-300 text-xl">+</span>
	</div>
	<div class="accordion-content">
	<p class="text-gray-400 mt-2">На старте рекомендуется уделять 2-3 часа в день для освоения материала. После интеграции система требует не более 30 минут в день для контроля и оптимизации.</p>
	</div>
	</div>

	<div class="accordion-item">
	<div class="accordion-header flex justify-between items-center">
	<h3 class="text-lg font-bold neon-blue">Нужны ли специальные знания?</h3>
	<span class="text-purple-300 text-xl">+</span>
	</div>
	<div class="accordion-content">
	<p class="text-gray-400 mt-2">Нет, система построена от простого к сложному. Level 1 даст все необходимые базовые знания. Главное - желание учиться и применять знания на практике.</p>
	</div>
	</div>

	<div class="accordion-item">
	<div class="accordion-header flex justify-between items-center">
	<h3 class="text-lg font-bold neon-blue">Какой минимальный бюджет для старта?</h3>
	<span class="text-purple-300 text-xl">+</span>
	</div>
	<div class="accordion-content">
	<p class="text-gray-400 mt-2">Рекомендуемый стартовый бюджет - $300-500. Но есть связки, которые можно тестировать и с $50. В системе есть специальные модули по работе с минимальными бюджетами.</p>
	</div>
	</div>

	<div class="accordion-item">
	<div class="accordion-header flex justify-between items-center">
	<h3 class="text-lg font-bold neon-blue">Есть ли гарантия результата?</h3>
	<span class="text-purple-300 text-xl">+</span>
	</div>
	<div class="accordion-content">
	<p class="text-gray-400 mt-2">Мы даем 100% гарантию, что система работает. Но конечный результат зависит от вашей вовлеченности и применения знаний. При соблюдении всех рекомендаций 95% студентов выходят в плюс в первые 3 месяца.</p>
	</div>
	</div>

	<div class="accordion-item">
	<div class="accordion-header flex justify-between items-center">
	<h3 class="text-lg font-bold neon-blue">Как быстро можно получить первые результаты?</h3>
	<span class="text-purple-300 text-xl">+</span>
	</div>
	<div class="accordion-content">
	<p class="text-gray-400 mt-2">Первые тесты можно запустить уже через неделю после старта обучения. Средний срок выхода на стабильный доход - 2-3 месяца при условии регулярной работы.</p>
	</div>
	</div>
	</div>
	</div>
	</section>

	<!-- Free Access Section -->
	<section id="free-access" class="py-20 px-4 container mx-auto">
	<div class="glow-box-green rounded-lg bg-gray-900/50 p-8 text-center">
	<h2 class="text-3xl md:text-4xl font-bold mb-4 neon-green">БЕСПЛАТНЫЙ ДОСТУП</h2>
	<p class="text-xl mb-6 neon-blue">Получи Level 1 за публикацию статьи о системе</p>

	<div class="max-w-2xl mx-auto mb-8">
	<p class="text-gray-300 mb-4">Напиши развернутый отзыв или статью о TMT Core System и размести его на любом из этих ресурсов:</p>
	<ul class="text-gray-400 space-y-2 mb-6">
	<li class="flex items-center justify-center">
	<span class="inline-block w-4 h-4 bg-green-500 rounded-full mr-2"></span>
	VC.ru, Habr, Medium или подобные платформы
	</li>
	<li class="flex items-center justify-center">
	<span class="inline-block w-4 h-4 bg-green-500 rounded-full mr-2"></span>
	Тематические Telegram-каналы (от 5K подписчиков)
	</li>
	<li class="flex items-center justify-center">
	<span class="inline-block w-4 h-4 bg-green-500 rounded-full mr-2"></span>
	YouTube (от 10K подписчиков)
	</li>
	</ul>

	<p class="text-gray-300">После модерации статьи мы отправим тебе доступ к Level 1 на 3 месяца.</p>
	</div>

	<button class="bg-transparent glow-box hover:bg-green-900/30 text-white font-bold py-3 px-8 rounded-lg transition-all duration-300 transform hover:scale-105">
	<span class="neon-purple">Участвовать в программе</span>
	</button>
	</div>
	</section>

	<!-- Results Section -->
	<section id="results" class="py-20 px-4 bg-gray-900/30">
	<div class="container mx-auto">
	<div class="text-center mb-16">
	<h2 class="text-3xl md:text-4xl font-bold mb-4 neon-green">РЕЗУЛЬТАТЫ ОПЕРАТОРОВ</h2>
	<p class="text-gray-400 max-w-2xl mx-auto">Последние операции в системе TMT Core</p>
	</div>

	<div class="glow-box-green rounded-lg bg-gray-900/50 overflow-hidden">
	<div class="overflow-x-auto">
	<table class="min-w-full divide-y divide-gray-800">
	<thead class="bg-black/50">
	<tr>
	<th class="px-6 py-3 text-left text-xs font-medium text-gray-400 uppercase tracking-wider">Оператор</th>
	<th class="px-6 py-3 text-left text-xs font-medium text-gray-400 uppercase tracking-wider">Вертикаль</th>
	<th class="px-6 py-3 text-left text-xs font-medium text-gray-400 uppercase tracking-wider">GEO</th>
	<th class="px-6 py-3 text-left text-xs font-medium text-gray-400 uppercase tracking-wider">ROI</th>
	<th class="px-6 py-3 text-left text-xs font-medium text-gray-400 uppercase tracking-wider">Профит</th>
	</tr>
	</thead>
	<tbody class="divide-y divide-gray-800">
	<tr class="top-row">
	<td class="px-6 py-4 whitespace-nowrap">
	<div class="flex items-center">
	<div class="flex-shrink-0 h-10 w-10 rounded-full bg-green-900/50 flex items-center justify-center">
	<span class="text-green-300">👑</span>
	</div>
	<div class="ml-4">
	<div class="text-sm font-medium neon-green">Алексей К.</div>
	<div class="text-xs text-gray-400">Level 3</div>
	</div>
	</div>
	</td>
	<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-300">Nutra</td>
	<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-300">US</td>
	<td class="px-6 py-4 whitespace-nowrap text-sm font-bold neon-green">320%</td>
	<td class="px-6 py-4 whitespace-nowrap text-sm font-bold neon-green">$2,450</td>
	</tr>

	<tr class="record-row">
	<td class="px-6 py-4 whitespace-nowrap">
	<div class="flex items-center">
	<div class="flex-shrink-0 h-10 w-10 rounded-full bg-green-900/50 flex items-center justify-center">
	<span class="text-green-300">🚀</span>
	</div>
	<div class="ml-4">
	<div class="text-sm font-medium neon-green">Мария С.</div>
	<div class="text-xs text-gray-400">Level 2</div>
	</div>
	</div>
	</td>
	<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-300">Gambling</td>
	<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-300">BR</td>
	<td class="px-6 py-4 whitespace-nowrap text-sm font-bold neon-green">280%</td>
	<td class="px-6 py-4 whitespace-nowrap text-sm font-bold neon-green">$1,870</td>
	</tr>

	<tr>
	<td class="px-6 py-4 whitespace-nowrap">
	<div class="flex items-center">
	<div class="flex-shrink-0 h-10 w-10 rounded-full bg-gray-800 flex items-center justify-center">
	<span class="text-gray-300">👨‍💻</span>
	</div>
	<div class="ml-4">
	<div class="text-sm font-medium text-gray-300">Дмитрий П.</div>
	<div class="text-xs text-gray-400">Level 2</div>
	</div>
	</div>
	</td>
	<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-300">E-commerce</td>
	<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-300">DE</td>
	<td class="px-6 py-4 whitespace-nowrap text-sm font-bold text-green-400">210%</td>
	<td class="px-6 py-4 whitespace-nowrap text-sm font-bold text-green-400">$1,240</td>
	</tr>

	<tr>
	<td class="px-6 py-4 whitespace-nowrap">
	<div class="flex items-center">
	<div class="flex-shrink-0 h-10 w-10 rounded-full bg-gray-800 flex items-center justify-center">
	<span class="text-gray-300">👩‍💻</span>
	</div>
	<div class="ml-4">
	<div class="text-sm font-medium text-gray-300">Анна Л.</div>
	<div class="text-xs text-gray-400">Level 1</div>
	</div>
	</div>
	</td>
	<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-300">Nutra</td>
	<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-300">ES</td>
	<td class="px-6 py-4 whitespace-nowrap text-sm font-bold text-green-400">180%</td>
	<td class="px-6 py-4 whitespace-nowrap text-sm font-bold text-green-400">$890</td>
	</tr>

	<tr>
	<td class="px-6 py-4 whitespace-nowrap">
	<div class="flex items-center">
	<div class="flex-shrink-0 h-10 w-10 rounded-full bg-gray-800 flex items-center justify-center">
	<span class="text-gray-300">🧑‍🎓</span>
	</div>
	<div class="ml-4">
	<div class="text-sm font-medium text-gray-300">Иван М.</div>
	<div class="text-xs text-gray-400">Level 1</div>
	</div>
	</div>
	</td>
	<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-300">Crypto</td>
	<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-300">IN</td>
	<td class="px-6 py-4 whitespace-nowrap text-sm font-bold text-green-400">150%</td>
	<td class="px-6 py-4 whitespace-nowrap text-sm font-bold text-green-400">$650</td>
	</tr>
	</tbody>
	</table>
	</div>

	<div class="px-6 py-4 bg-black/50 border-t border-gray-800 flex justify-center">
	<button id="want-in-table" class="bg-transparent glow-box-green hover:bg-green-900/30 text-white font-bold py-2 px-6 rounded-md transition-all duration-300">
	<span class="neon-green">Хочу тоже в таблицу</span>
	</button>
	</div>
	</div>
	</div>
	</section>

	<!-- Access Levels Section -->
	<section id="access" class="py-20 px-4 container mx-auto">
	<div class="text-center mb-16">
	<h2 class="text-3xl md:text-4xl font-bold mb-4 neon-purple">УРОВНИ ДОСТУПА</h2>
	<p class="text-gray-400 max-w-2xl mx-auto">Выбери свой уровень интеграции с TMT Core</p>
	</div>

	<div class="grid grid-cols-1 md:grid-cols-3 gap-8">
	<!-- Level 1 -->
	<div class="access-level glow-box rounded-lg bg-gray-900/50 p-8 transform hover:scale-105 cursor-pointer">
	<div class="flex justify-between items-start mb-6">
	<div>
	<h3 class="text-2xl font-bold mb-2 neon-purple">Level 1</h3>
	<p class="text-gray-400">Viewer</p>
	</div>
	<div class="bg-purple-900/30 text-purple-300 px-3 py-1 rounded-full text-xs">Базовый</div>
	</div>

	<div class="mb-6">
	<p class="text-3xl font-bold mb-1 neon-purple">$297</p>
	<p class="text-gray-400 text-sm">одноразовый платёж</p>
	</div>

	<ul class="space-y-3 mb-8">
	<li class="flex items-center">
	<span class="text-purple-300 mr-2">✓</span>
	<span class="text-gray-300">Доступ к основам</span>
	</li>
	<li class="flex items-center">
	<span class="text-purple-300 mr-2">✓</span>
	<span class="text-gray-300">5 базовых связок</span>
	</li>
	<li class="flex items-center">
	<span class="text-purple-300 mr-2">✓</span>
	<span class="text-gray-300">Доступ в общий чат</span>
	</li>
	<li class="flex items-center">
	<span class="text-gray-500 mr-2">✗</span>
	<span class="text-gray-500">Закрытые модули</span>
	</li>
	<li class="flex items-center">
	<span class="text-gray-500 mr-2">✗</span>
	<span class="text-gray-500">Персональный ментор</span>
	</li>
	</ul>

	<button class="w-full bg-transparent border border-purple-500/50 text-purple-300 hover:bg-purple-900/30 py-2 rounded-md transition">
	Получить доступ
	</button>
	</div>

	<!-- Level 2 -->
	<div class="access-level glow-box-blue rounded-lg bg-gray-900/50 p-8 transform hover:scale-105 cursor-pointer">
	<div class="flex justify-between items-start mb-6">
	<div>
	<h3 class="text-2xl font-bold mb-2 neon-blue">Level 2</h3>
	<p class="text-gray-400">Operator</p>
	</div>
	<div class="bg-blue-900/30 text-blue-300 px-3 py-1 rounded-full text-xs">Популярный</div>
	</div>

	<div class="mb-6">
	<p class="text-3xl font-bold mb-1 neon-blue">$997</p>
	<p class="text-gray-400 text-sm">одноразовый платёж</p>
	</div>

	<ul class="space-y-3 mb-8">
	<li class="flex items-center">
	<span class="text-blue-300 mr-2">✓</span>
	<span class="text-gray-300">Все из Level 1</span>
	</li>
	<li class="flex items-center">
	<span class="text-blue-300 mr-2">✓</span>
	<span class="text-gray-300">20+ рабочих связок</span>
	</li>
	<li class="flex items-center">
	<span class="text-blue-300 mr-2">✓</span>
	<span class="text-gray-300">Креативы и лендинги</span>
	</li>
	<li class="flex items-center">
	<span class="text-blue-300 mr-2">✓</span>
	<span class="text-gray-300">Оптимизация трафика</span>
	</li>
	<li class="flex items-center">
	<span class="text-gray-500 mr-2">✗</span>
	<span class="text-gray-500">Персональный ментор</span>
	</li>
	</ul>

	<button class="w-full bg-transparent border border-blue-500/50 text-blue-300 hover:bg-blue-900/30 py-2 rounded-md transition">
	Получить доступ
	</button>
	</div>

	<!-- Level 3 -->
	<div class="access-level glow-box-green rounded-lg bg-gray-900/50 p-8 transform hover:scale-105 cursor-pointer">
	<div class="flex justify-between items-start mb-6">
	<div>
	<h3 class="text-2xl font-bold mb-2 neon-green">Level 3</h3>
	<p class="text-gray-400">Elite</p>
	</div>
	<div class="bg-green-900/30 text-green-300 px-3 py-1 rounded-full text-xs">VIP</div>
	</div>

	<div class="mb-6">
	<p class="text-3xl font-bold mb-1 neon-green">$2,497</p>
	<p class="text-gray-400 text-sm">одноразовый платёж</p>
	</div>

	<ul class="space-y-3 mb-8">
	<li class="flex items-center">
	<span class="text-green-300 mr-2">✓</span>
	<span class="text-gray-300">Все из Level 2</span>
	</li>
	<li class="flex items-center">
	<span class="text-green-300 mr-2">✓</span>
	<span class="text-gray-300">Персональный ментор</span>
	</li>
	<li class="flex items-center">
	<span class="text-green-300 mr-2">✓</span>
	<span class="text-gray-300">Скейл до 10K+/мес</span>
	</li>
	<li class="flex items-center">
	<span class="text-green-300 mr-2">✓</span>
	<span class="text-gray-300">Закрытые обновления</span>
	</li>
	<li class="flex items-center">
	<span class="text-green-300 mr-2">✓</span>
	<span class="text-gray-300">Приватные связки</span>
	</li>
	</ul>

	<button class="w-full bg-transparent border border-green-500/50 text-green-300 hover:bg-green-900/30 py-2 rounded-md transition">
	Получить доступ
	</button>
	</div>
	</div>
	</section>

	<!-- Footer -->
	<footer class="py-12 px-4 bg-black/80 border-t border-gray-800">
	<div class="container mx-auto">
	<div class="flex flex-col md:flex-row justify-between items-center">
	<div class="flex items-center space-x-2 mb-6 md:mb-0">
	<div class="w-8 h-8 rounded-full bg-purple-900 flex items-center justify-center">
	<span class="text-purple-300 font-bold">TM</span>
	</div>
	<span class="text-xl font-bold neon-purple">TRAFFIC MASTER</span>
	</div>

	<div class="flex space-x-6 mb-6 md:mb-0">
	<a href="#" class="text-gray-400 hover:text-purple-300 transition"><i class="fab fa-telegram"></i></a>
	<a href="#" class="text-gray-400 hover:text-purple-300 transition"><i class="fab fa-instagram"></i></a>
	<a href="#" class="text-gray-400 hover:text-purple-300 transition"><i class="fab fa-youtube"></i></a>
	</div>

	<div class="text-gray-500 text-sm">
	<p>TMT Core System © 2023. Все права защищены.</p>
	</div>
	</div>
	</div>
	</footer>
	</div>

	<!-- Connect Modal -->
	<div id="connect-modal" class="fixed inset-0 bg-black/80 z-50 flex items-center justify-center hidden">
	<div class="glow-box rounded-lg bg-gray-900 w-full max-w-md mx-4 overflow-hidden">
	<div class="p-6">
	<div class="flex justify-between items-center mb-6">
	<h3 class="text-xl font-bold neon-purple">Подключение к системе</h3>
	<button id="close-modal" class="text-gray-400 hover:text-white">
	<i class="fas fa-times"></i>
	</button>
	</div>

	<div class="mb-6">
	<label class="block text-gray-400 text-sm mb-2">Telegram</label>
	<input type="text" class="console-input" placeholder="@username">
	</div>

	<div class="mb-6">
	<label class="block text-gray-400 text-sm mb-2">Имя</label>
	<input type="text" class="console-input" placeholder="Как к вам обращаться?">
	</div>

	<div class="mb-6">
	<label class="block text-gray-400 text-sm mb-2">Цель подключения</label>
	<select class="console-input">
	<option>Выберите вариант</option>
	<option>Начать с нуля</option>
	<option>Увеличить доход</option>
	<option>Масштабировать бизнес</option>
	<option>Другое</option>
	</select>
	</div>

	<button id="submit-connect" class="w-full bg-transparent glow-box hover:bg-purple-900/30 text-white font-bold py-3 rounded-lg transition">
	<span class="neon-green">Подключиться к системе</span>
	</button>

	<div id="loading-bar" class="loading-bar mt-4 hidden"></div>

	<div id="success-message" class="mt-4 text-center hidden">
	<p class="neon-green mb-2">Доступ подтверждён!</p>
	<p class="text-gray-400 text-sm">Скоро с вами свяжется наш оператор.</p>
	</div>
	</div>
	</div>
	</div>

	<script>
	// Counter animation
	function animateCounter() {
	let counter = 0;
	const target = 5300000;
	const element = document.getElementById('counter');
	const duration = 3000;
	const step = target / (duration / 16);

	const interval = setInterval(() => {
	counter += step;
	if (counter >= target) {
	counter = target;
	clearInterval(interval);
	}
	element.textContent = '$' + Math.floor(counter).toLocaleString();
	}, 16);
	}

	// Tab switching
	function setupTabs() {
	const tabButtons = document.querySelectorAll('.tab-button');

	tabButtons.forEach(button => {
	button.addEventListener('click', () => {
	// Remove active class from all buttons and contents
	document.querySelectorAll('.tab-button').forEach(btn => btn.classList.remove('active'));
	document.querySelectorAll('.tab-content').forEach(content => content.classList.remove('active'));

	// Add active class to clicked button
	button.classList.add('active');

	// Show corresponding content
	const tabId = button.getAttribute('data-tab');
	document.getElementById(tabId).classList.add('active');
	});
	});
	}

	// Accordion functionality
	function setupAccordion() {
	const accordionHeaders = document.querySelectorAll('.accordion-header');

	accordionHeaders.forEach(header => {
	header.addEventListener('click', () => {
	const content = header.nextElementSibling;
	const isActive = content.classList.contains('active');

	// Close all accordion items
	document.querySelectorAll('.accordion-content').forEach(item => {
	item.classList.remove('active');
	});

	// Toggle current item
	if (!isActive) {
	content.classList.add('active');
	header.querySelector('span').textContent = '-';
	} else {
	content.classList.remove('active');
	header.querySelector('span').textContent = '+';
	}
	});
	});
	}

	// Notifications
	function showRandomNotification() {
	const notifications = [
	{ icon: '💰', text: '+$500 получено от FB', color: 'green' },
	{ icon: '🌎', text: 'Оффер GEO: ES дал ROI 220%', color: 'blue' },
	{ icon: '🤖', text: 'Лид: Telegram → WhatsApp → DEPOSIT', color: 'purple' },
	{ icon: '📈', text: 'Новый рекорд: $2,450 за день', color: 'green' },
	{ icon: '🔥', text: 'Новая связка: Nutra US ROI 320%', color: 'purple' }
	];

	const randomNotif = notifications[Math.floor(Math.random() * notifications.length)];

	const notification = document.createElement('div');
	notification.className = `notification glow-box-${randomNotif.color} rounded-lg bg-gray-900/80 p-4 flex items-center space-x-3`;
	notification.innerHTML = `
	<span class="text-2xl">${randomNotif.icon}</span>
	<span class="text-sm">${randomNotif.text}</span>
	`;

	const container = document.getElementById('notification-container');
	container.appendChild(notification);

	// Remove notification after animation
	setTimeout(() => {
	notification.remove();
	}, 5000);
	}

	// Connect modal
	function setupModal() {
	const connectBtn = document.getElementById('connect-btn');
	const wantInTableBtn = document.getElementById('want-in-table');
	const closeModalBtn = document.getElementById('close-modal');
	const modal = document.getElementById('connect-modal');
	const submitBtn = document.getElementById('submit-connect');
	const loadingBar = document.getElementById('loading-bar');
	const successMessage = document.getElementById('success-message');

	// Open modal
	[connectBtn, wantInTableBtn].forEach(btn => {
	btn.addEventListener('click', () => {
	modal.classList.remove('hidden');
	});
	});

	// Close modal
	closeModalBtn.addEventListener('click', () => {
	modal.classList.add('hidden');
	loadingBar.classList.add('hidden');
	successMessage.classList.add('hidden');
	});

	// Submit form
	submitBtn.addEventListener('click', () => {
	loadingBar.classList.remove('hidden');
	loadingBar.style.animation = 'none';
	void loadingBar.offsetWidth; // Trigger reflow
	loadingBar.style.animation = 'loading 2s forwards';

	setTimeout(() => {
	loadingBar.classList.add('hidden');
	successMessage.classList.remove('hidden');

	setTimeout(() => {
	modal.classList.add('hidden');
	successMessage.classList.add('hidden');
	}, 2000);
	}, 2000);
	});
	}

	// Enter dashboard
	document.getElementById('enter-dashboard').addEventListener('click', () => {
	document.getElementById('dashboard-intro').classList.add('hidden');
	document.getElementById('main-content').classList.remove('hidden');

	// Start animations
	animateCounter();

	// Show first notification after 2 seconds
	setTimeout(() => {
	showRandomNotification();

	// Then show notifications every 5-8 seconds
	setInterval(showRandomNotification, 5000 + Math.random() * 3000);
	}, 2000);
	});

	// Initialize everything when DOM is loaded
	document.addEventListener('DOMContentLoaded', () => {
	setupTabs();
	setupModal();
	setupAccordion();
	});
	</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/land2arg" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
	</html>