Add 2 files

index.html

@@ -723,12 +723,699 @@
                 </button>
             </div>
         </div>
-    </div>
     </section>
-
-    <!-- Rest of the sections remain the same as in the original code -->
-    <!-- ... -->
-
+    
+    <!-- Level 3: Character Selection -->
+    <section class="section flex items-center justify-center" id="level3">
+        <div class="max-w-6xl mx-auto text-center">
+            <h2 class="text-4xl md:text-5xl font-bold mb-12 neon-text neon-blue">Выбери своего персонажа</h2>
+            
+            <div class="grid grid-cols-1 md:grid-cols-3 gap-8 mb-12">
+                <!-- Character 1 -->
+                <div class="character-card bg-black bg-opacity-50 p-6 rounded-lg cursor-pointer glow-box" onclick="selectCharacter('warrior')">
+                    <div class="w-32 h-32 mx-auto mb-4 rounded-full border-2 border-neon-blue bg-cover bg-center" style="background-image: url('https://randomuser.me/api/portraits/men/44.jpg');"></div>
+                    <h3 class="text-2xl font-bold mb-2 neon-blue">Воин</h3>
+                    <p class="text-sm mb-4">Агрессивный подход, быстрые результаты, высокие риски</p>
+                    <div class="flex justify-center space-x-2">
+                        <span class="text-xs px-2 py-1 bg-neon-blue bg-opacity-20 rounded">⚔️ Агрессивный</span>
+                        <span class="text-xs px-2 py-1 bg-neon-blue bg-opacity-20 rounded">💨 Быстрый старт</span>
+                    </div>
+                </div>
+                
+                <!-- Character 2 -->
+                <div class="character-card bg-black bg-opacity-50 p-6 rounded-lg cursor-pointer glow-box" onclick="selectCharacter('strategist')">
+                    <div class="w-32 h-32 mx-auto mb-4 rounded-full border-2 border-neon-purple bg-cover bg-center" style="background-image: url('https://randomuser.me/api/portraits/women/44.jpg');"></div>
+                    <h3 class="text-2xl font-bold mb-2 neon-purple">Стратег</h3>
+                    <p class="text-sm mb-4">Продуманные ходы, аналитический подход, стабильный рост</p>
+                    <div class="flex justify-center space-x-2">
+                        <span class="text-xs px-2 py-1 bg-neon-purple bg-opacity-20 rounded">🧠 Аналитик</span>
+                        <span class="text-xs px-2 py-1 bg-neon-purple bg-opacity-20 rounded">📈 Стабильность</span>
+                    </div>
+                </div>
+                
+                <!-- Character 3 -->
+                <div class="character-card bg-black bg-opacity-50 p-6 rounded-lg cursor-pointer glow-box" onclick="selectCharacter('ninja')">
+                    <div class="w-32 h-32 mx-auto mb-4 rounded-full border-2 border-neon-pink bg-cover bg-center" style="background-image: url('https://randomuser.me/api/portraits/men/22.jpg');"></div>
+                    <h3 class="text-2xl font-bold mb-2 neon-pink">Ниндзя</h3>
+                    <p class="text-sm mb-4">Скрытые методы, нестандартные решения, минимальные вложения</p>
+                    <div class="flex justify-center space-x-2">
+                        <span class="text-xs px-2 py-1 bg-neon-pink bg-opacity-20 rounded">👤 Скрытность</span>
+                        <span class="text-xs px-2 py-1 bg-neon-pink bg-opacity-20 rounded">🔄 Нестандартный</span>
+                    </div>
+                </div>
+            </div>
+            
+            <button class="bg-neon-purple text-black px-8 py-3 text-lg font-bold hover:bg-neon-blue hover:text-white transition-all duration-300 glow-box cta-button" onclick="scrollToLevel('level4')">
+                Подтвердить выбор <i class="fas fa-check ml-2"></i>
+            </button>
+        </div>
+    </section>
+    
+    <!-- Level 4: Inventory -->
+    <section class="section flex items-center justify-center" id="level4">
+        <div class="max-w-6xl mx-auto">
+            <h2 class="text-4xl md:text-5xl font-bold mb-12 text-center neon-text neon-blue">Твой арсенал</h2>
+            
+            <div class="grid grid-cols-1 md:grid-cols-2 gap-8">
+                <div class="fade-in">
+                    <h3 class="text-2xl font-bold mb-6 neon-text">Что ты получишь:</h3>
+                    
+                    <div class="space-y-4">
+                        <div class="inventory-item flex items-start p-4 bg-black bg-opacity-30 rounded-lg glow-box">
+                            <div class="text-2xl mr-4 neon-blue">🔮</div>
+                            <div>
+                                <h4 class="font-bold text-lg">Кристалл знаний</h4>
+                                <p class="text-sm">Полный доступ к закрытому курсу по арбитражу трафика</p>
+                            </div>
+                        </div>
+                        
+                        <div class="inventory-item flex items-start p-4 bg-black bg-opacity-30 rounded-lg glow-box">
+                            <div class="text-2xl mr-4 neon-purple">🗺️</div>
+                            <div>
+                                <h4 class="font-bold text-lg">Карта офферов</h4>
+                                <p class="text-sm">Актуальные офферы с высоким CR и проверенные связки</p>
+                            </div>
+                        </div>
+                        
+                        <div class="inventory-item flex items-start p-4 bg-black bg-opacity-30 rounded-lg glow-box">
+                            <div class="text-2xl mr-4 neon-pink">⚔️</div>
+                            <div>
+                                <h4 class="font-bold text-lg">Оружие аналитики</h4>
+                                <p class="text-sm">Набор инструментов для анализа и оптимизации кампаний</p>
+                            </div>
+                        </div>
+                        
+                        <div class="inventory-item flex items-start p-4 bg-black bg-opacity-30 rounded-lg glow-box">
+                            <div class="text-2xl mr-4 gold-text">🛡️</div>
+                            <div>
+                                <h4 class="font-bold text-lg">Щит поддержки</h4>
+                                <p class="text-sm">Персональный ментор и доступ в закрытый чат команды</p>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+                
+                <div class="fade-in">
+                    <div class="hologram p-8 rounded-lg h-full flex flex-col justify-center">
+                        <h3 class="text-2xl font-bold mb-6 neon-text">Твой инвентарь:</h3>
+                        
+                        <div class="mb-6">
+                            <div class="flex justify-between mb-2">
+                                <span>Прогресс обучения</span>
+                                <span>0%</span>
+                            </div>
+                            <div class="progress-track" style="--progress: 0%"></div>
+                        </div>
+                        
+                        <div class="mb-6">
+                            <div class="flex justify-between mb-2">
+                                <span>Уровень доступа</span>
+                                <span>Новичок</span>
+                            </div>
+                            <div class="flex justify-between text-xs">
+                                <span>Level 1</span>
+                                <span>Level 10</span>
+                            </div>
+                        </div>
+                        
+                        <div class="mb-6">
+                            <div class="flex justify-between mb-2">
+                                <span>Доступные офферы</span>
+                                <span>0/50</span>
+                            </div>
+                            <div class="grid grid-cols-5 gap-2">
+                                <div class="h-2 bg-gray-700 rounded"></div>
+                                <div class="h-2 bg-gray-700 rounded"></div>
+                                <div class="h-2 bg-gray-700 rounded"></div>
+                                <div class="h-2 bg-gray-700 rounded"></div>
+                                <div class="h-2 bg-gray-700 rounded"></div>
+                            </div>
+                        </div>
+                        
+                        <button class="bg-neon-blue text-black px-6 py-3 font-bold hover:bg-neon-purple hover:text-white transition-all duration-300 glow-box cta-button mt-4" onclick="scrollToLevel('level5')">
+                            Продолжить <i class="fas fa-arrow-right ml-2"></i>
+                        </button>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+    
+    <!-- Level 5: Training Path -->
+    <section class="section flex items-center justify-center" id="level5">
+        <div class="max-w-6xl mx-auto">
+            <h2 class="text-4xl md:text-5xl font-bold mb-12 text-center neon-text neon-blue">Твой путь обучения</h2>
+            
+            <div class="relative">
+                <!-- Progress line -->
+                <div class="absolute left-1/2 transform -translate-x-1/2 h-full w-1 bg-gradient-to-b from-neon-blue to-neon-purple" style="top: 40px;"></div>
+                
+                <div class="space-y-20 pl-8 md:pl-0">
+                    <!-- Checkpoint 1 -->
+                    <div class="checkpoint relative grid md:grid-cols-2 gap-8 items-center">
+                        <div class="md:text-right md:pr-8 fade-in">
+                            <h3 class="text-2xl font-bold mb-2 neon-text">Базовый уровень</h3>
+                            <p>Основы арбитража, выбор ниши, первые шаги</p>
+                        </div>
+                        <div class="hologram p-6 rounded-lg fade-in">
+                            <div class="flex items-center mb-4">
+                                <div class="w-16 h-16 rounded-full bg-black bg-opacity-50 flex items-center justify-center text-2xl mr-4">1</div>
+                                <div>
+                                    <h4 class="font-bold">Введение в арбитраж</h4>
+                                    <p class="text-sm">3 урока, 2 практических задания</p>
+                                </div>
+                            </div>
+                            <button class="text-xs bg-neon-blue bg-opacity-20 text-neon-blue px-3 py-1 rounded">Начать обучение</button>
+                        </div>
+                    </div>
+                    
+                    <!-- Checkpoint 2 -->
+                    <div class="checkpoint relative grid md:grid-cols-2 gap-8 items-center">
+                        <div class="md:order-2 md:text-left md:pl-8 fade-in">
+                            <h3 class="text-2xl font-bold mb-2 neon-text">Продвинутый уровень</h3>
+                            <p>Работа с офферами, аналитика, масштабирование</p>
+                        </div>
+                        <div class="hologram p-6 rounded-lg md:order-1 fade-in">
+                            <div class="flex items-center mb-4">
+                                <div class="w-16 h-16 rounded-full bg-black bg-opacity-50 flex items-center justify-center text-2xl mr-4">2</div>
+                                <div>
+                                    <h4 class="font-bold">Глубокий анализ</h4>
+                                    <p class="text-sm">5 уроков, 4 практических задания</p>
+                                </div>
+                            </div>
+                            <button class="text-xs bg-neon-purple bg-opacity-20 text-neon-purple px-3 py-1 rounded">Заблокировано</button>
+                        </div>
+                    </div>
+                    
+                    <!-- Checkpoint 3 -->
+                    <div class="checkpoint relative grid md:grid-cols-2 gap-8 items-center">
+                        <div class="md:text-right md:pr-8 fade-in">
+                            <h3 class="text-2xl font-bold mb-2 neon-text">Мастер уровень</h3>
+                            <p>Автоматизация, сложные стратегии, управление командой</p>
+                        </div>
+                        <div class="hologram p-6 rounded-lg fade-in">
+                            <div class="flex items-center mb-4">
+                                <div class="w-16 h-16 rounded-full bg-black bg-opacity-50 flex items-center justify-center text-2xl mr-4">3</div>
+                                <div>
+                                    <h4 class="font-bold">Профессиональные техники</h4>
+                                    <p class="text-sm">7 уроков, 6 практических заданий</p>
+                                </div>
+                            </div>
+                            <button class="text-xs bg-gray-700 text-gray-400 px-3 py-1 rounded">Заблокировано</button>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            
+            <div class="text-center mt-16">
+                <button class="bg-neon-purple text-black px-8 py-3 text-lg font-bold hover:bg-neon-blue hover:text-white transition-all duration-300 glow-box cta-button" onclick="scrollToLevel('level6')">
+                    Принять вызов <i class="fas fa-flag-checkered ml-2"></i>
+                </button>
+            </div>
+        </div>
+    </section>
+    
+    <!-- Level 6: Program -->
+    <section class="section flex items-center justify-center" id="level6">
+        <div class="max-w-6xl mx-auto">
+            <h2 class="text-4xl md:text-5xl font-bold mb-12 text-center neon-text neon-blue">Программа курса</h2>
+            
+            <div class="grid md:grid-cols-3 gap-6 mb-12">
+                <!-- Module 1 -->
+                <div class="hologram p-6 rounded-lg glow-box fade-in">
+                    <div class="text-4xl mb-4 neon-blue">01</div>
+                    <h3 class="text-xl font-bold mb-3">Основы арбитража</h3>
+                    <ul class="text-sm space-y-2 mb-4">
+                        <li class="flex items-start">
+                            <span class="mr-2">✓</span>
+                            <span>Что такое арбитраж трафика</span>
+                        </li>
+                        <li class="flex items-start">
+                            <span class="mr-2">✓</span>
+                            <span>Выбор ниши и офферов</span>
+                        </li>
+                        <li class="flex items-start">
+                            <span class="mr-2">✓</span>
+                            <span>Первые шаги в рекламе</span>
+                        </li>
+                    </ul>
+                    <div class="text-xs bg-neon-blue bg-opacity-20 text-neon-blue px-3 py-1 rounded inline-block">3 урока</div>
+                </div>
+                
+                <!-- Module 2 -->
+                <div class="hologram p-6 rounded-lg glow-box fade-in">
+                    <div class="text-4xl mb-4 neon-purple">02</div>
+                    <h3 class="text-xl font-bold mb-3">Работа с трафиком</h3>
+                    <ul class="text-sm space-y-2 mb-4">
+                        <li class="flex items-start">
+                            <span class="mr-2">✓</span>
+                            <span>Типы трафика и источники</span>
+                        </li>
+                        <li class="flex items-start">
+                            <span class="mr-2">✓</span>
+                            <span>Настройка кампаний</span>
+                        </li>
+                        <li class="flex items-start">
+                            <span class="mr-2">✓</span>
+                            <span>Оптимизация бюджета</span>
+                        </li>
+                    </ul>
+                    <div class="text-xs bg-neon-purple bg-opacity-20 text-neon-purple px-3 py-1 rounded inline-block">5 уроков</div>
+                </div>
+                
+                <!-- Module 3 -->
+                <div class="hologram p-6 rounded-lg glow-box fade-in">
+                    <div class="text-4xl mb-4 neon-pink">03</div>
+                    <h3 class="text-xl font-bold mb-3">Аналитика и масштабирование</h3>
+                    <ul class="text-sm space-y-2 mb-4">
+                        <li class="flex items-start">
+                            <span class="mr-2">✓</span>
+                            <span>Ключевые метрики</span>
+                        </li>
+                        <li class="flex items-start">
+                            <span class="mr-2">✓</span>
+                            <span>Инструменты аналитики</span>
+                        </li>
+                        <li class="flex items-start">
+                            <span class="mr-2">✓</span>
+                            <span>Масштабирование успешных кампаний</span>
+                        </li>
+                    </ul>
+                    <div class="text-xs bg-neon-pink bg-opacity-20 text-neon-pink px-3 py-1 rounded inline-block">4 урока</div>
+                </div>
+            </div>
+            
+            <div class="text-center">
+                <button class="bg-neon-blue text-black px-8 py-3 text-lg font-bold hover:bg-neon-purple hover:text-white transition-all duration-300 glow-box cta-button" onclick="scrollToLevel('level7')">
+                    Узнать больше <i class="fas fa-book-open ml-2"></i>
+                </button>
+            </div>
+        </div>
+    </section>
+    
+    <!-- Level 7: Rewards -->
+    <section class="section flex items-center justify-center" id="level7">
+        <div class="max-w-6xl mx-auto">
+            <h2 class="text-4xl md:text-5xl font-bold mb-12 text-center neon-text neon-blue">Твои возможные награды</h2>
+            
+            <div class="grid md:grid-cols-3 gap-8 mb-12">
+                <!-- Reward 1 -->
+                <div class="fade-in">
+                    <div class="treasure-chest bg-black bg-opacity-50 p-8 rounded-lg text-center h-full">
+                        <div class="chest-lid mb-6">
+                            <div class="w-24 h-12 mx-auto bg-yellow-800 rounded-t-lg border-b-4 border-yellow-900"></div>
+                        </div>
+                        <div class="w-32 h-16 mx-auto bg-yellow-700 rounded-b-lg"></div>
+                        
+                        <h3 class="text-xl font-bold mt-6 mb-3 gold-text">Уровень 1</h3>
+                        <p class="text-sm mb-4">Первые $500-1000 в месяц</p>
+                        <div class="text-xs bg-gold bg-opacity-20 text-gold px-3 py-1 rounded inline-block">Достижимо за 1 месяц</div>
+                    </div>
+                </div>
+                
+                <!-- Reward 2 -->
+                <div class="fade-in">
+                    <div class="treasure-chest bg-black bg-opacity-50 p-8 rounded-lg text-center h-full">
+                        <div class="chest-lid mb-6">
+                            <div class="w-24 h-12 mx-auto bg-yellow-600 rounded-t-lg border-b-4 border-yellow-700"></div>
+                        </div>
+                        <div class="w-32 h-16 mx-auto bg-yellow-500 rounded-b-lg"></div>
+                        
+                        <h3 class="text-xl font-bold mt-6 mb-3 gold-text">Уровень 2</h3>
+                        <p class="text-sm mb-4">$3000-5000 в месяц</p>
+                        <div class="text-xs bg-gold bg-opacity-20 text-gold px-3 py-1 rounded inline-block">Достижимо за 3 месяца</div>
+                    </div>
+                </div>
+                
+                <!-- Reward 3 -->
+                <div class="fade-in">
+                    <div class="treasure-chest bg-black bg-opacity-50 p-8 rounded-lg text-center h-full">
+                        <div class="chest-lid mb-6">
+                            <div class="w-24 h-12 mx-auto bg-yellow-400 rounded-t-lg border-b-4 border-yellow-500"></div>
+                        </div>
+                        <div class="w-32 h-16 mx-auto bg-yellow-300 rounded-b-lg"></div>
+                        
+                        <h3 class="text-xl font-bold mt-6 mb-3 gold-text">Уровень 3</h3>
+                        <p class="text-sm mb-4">$10 000+ в месяц</p>
+                        <div class="text-xs bg-gold bg-opacity-20 text-gold px-3 py-1 rounded inline-block">Достижимо за 6 месяцев</div>
+                    </div>
+                </div>
+            </div>
+            
+            <div class="text-center">
+                <button class="bg-gold text-black px-8 py-3 text-lg font-bold hover:bg-yellow-400 hover:text-black transition-all duration-300 glow-box cta-button" onclick="scrollToLevel('level8')">
+                    Хочу эти результаты <i class="fas fa-trophy ml-2"></i>
+                </button>
+            </div>
+        </div>
+    </section>
+    
+    <!-- Level 8: Team -->
+    <section class="section flex items-center justify-center" id="level8">
+        <div class="max-w-6xl mx-auto">
+            <h2 class="text-4xl md:text-5xl font-bold mb-12 text-center neon-text neon-blue">Наша команда</h2>
+            
+            <div class="grid md:grid-cols-3 gap-8 mb-12">
+                <!-- Team Member 1 -->
+                <div class="fade-in">
+                    <div class="hologram p-6 rounded-lg text-center h-full">
+                        <div class="w-32 h-32 mx-auto rounded-full border-2 border-neon-blue bg-cover bg-center mb-4" style="background-image: url('https://randomuser.me/api/portraits/men/32.jpg');"></div>
+                        <h3 class="text-xl font-bold mb-2 neon-blue">Тимур В.</h3>
+                        <p class="text-sm mb-3">Основатель TMT, 7 лет в арбитраже</p>
+                        <div class="text-xs bg-neon-blue bg-opacity-20 text-neon-blue px-3 py-1 rounded inline-block">$5M+ оборот</div>
+                    </div>
+                </div>
+                
+                <!-- Team Member 2 -->
+                <div class="fade-in">
+                    <div class="hologram p-6 rounded-lg text-center h-full">
+                        <div class="w-32 h-32 mx-auto rounded-full border-2 border-neon-purple bg-cover bg-center mb-4" style="background-image: url('https://randomuser.me/api/portraits/women/42.jpg');"></div>
+                        <h3 class="text-xl font-bold mb-2 neon-purple">Анна К.</h3>
+                        <p class="text-sm mb-3">Специалист по Facebook Ads</p>
+                        <div class="text-xs bg-neon-purple bg-opacity-20 text-neon-purple px-3 py-1 rounded inline-block">CR +35%</div>
+                    </div>
+                </div>
+                
+                <!-- Team Member 3 -->
+                <div class="fade-in">
+                    <div class="hologram p-6 rounded-lg text-center h-full">
+                        <div class="w-32 h-32 mx-auto rounded-full border-2 border-neon-pink bg-cover bg-center mb-4" style="background-image: url('https://randomuser.me/api/portraits/men/22.jpg');"></div>
+                        <h3 class="text-xl font-bold mb-2 neon-pink">Максим Р.</h3>
+                        <p class="text-sm mb-3">Аналитик, скрипты и автоматизация</p>
+                        <div class="text-xs bg-neon-pink bg-opacity-20 text-neon-pink px-3 py-1 rounded inline-block">ROI +200%</div>
+                    </div>
+                </div>
+            </div>
+            
+            <div class="text-center">
+                <button class="bg-neon-purple text-black px-8 py-3 text-lg font-bold hover:bg-neon-blue hover:text-white transition-all duration-300 glow-box cta-button" onclick="scrollToLevel('level9')">
+                    Присоединиться к команде <i class="fas fa-users ml-2"></i>
+                </button>
+            </div>
+        </div>
+    </section>
+    
+    <!-- Level 9: Packages -->
+    <section class="section flex items-center justify-center" id="level9">
+        <div class="max-w-6xl mx-auto">
+            <h2 class="text-4xl md:text-5xl font-bold mb-12 text-center neon-text neon-blue">Выбери свой пакет</h2>
+            
+            <div class="grid md:grid-cols-3 gap-8 mb-12">
+                <!-- Package 1 -->
+                <div class="fade-in">
+                    <div class="hologram p-8 rounded-lg h-full">
+                        <h3 class="text-2xl font-bold mb-4 neon-blue">Стандарт</h3>
+                        <div class="text-4xl font-bold mb-4 gold-text">$297</div>
+                        <ul class="space-y-3 mb-6">
+                            <li class="flex items-start">
+                                <span class="mr-2">✓</span>
+                                <span>Доступ к курсу</span>
+                            </li>
+                            <li class="flex items-start">
+                                <span class="mr-2">✓</span>
+                                <span>Базовые офферы</span>
+                            </li>
+                            <li class="flex items-start">
+                                <span class="mr-2">✓</span>
+                                <span>Доступ в чат</span>
+                            </li>
+                            <li class="flex items-start">
+                                <span class="mr-2">✗</span>
+                                <span>Персональный ментор</span>
+                            </li>
+                            <li class="flex items-start">
+                                <span class="mr-2">✗</span>
+                                <span>Премиум офферы</span>
+                            </li>
+                        </ul>
+                        <button class="w-full bg-neon-blue text-black px-6 py-3 font-bold hover:bg-neon-purple hover:text-white transition-all duration-300 glow-box cta-button">
+                            Выбрать <i class="fas fa-check ml-2"></i>
+                        </button>
+                    </div>
+                </div>
+                
+                <!-- Package 2 -->
+                <div class="fade-in">
+                    <div class="hologram p-8 rounded-lg h-full border-2 border-gold relative">
+                        <div class="absolute top-0 right-0 bg-gold text-black text-xs font-bold px-3 py-1 rounded-bl">Популярный</div>
+                        <h3 class="text-2xl font-bold mb-4 neon-purple">Премиум</h3>
+                        <div class="text-4xl font-bold mb-4 gold-text">$597</div>
+                        <ul class="space-y-3 mb-6">
+                            <li class="flex items-start">
+                                <span class="mr-2">✓</span>
+                                <span>Доступ к курсу</span>
+                            </li>
+                            <li class="flex items-start">
+                                <span class="mr-2">✓</span>
+                                <span>Базовые + премиум офферы</span>
+                            </li>
+                            <li class="flex items-start">
+                                <span class="mr-2">✓</span>
+                                <span>Доступ в чат</span>
+                            </li>
+                            <li class="flex items-start">
+                                <span class="mr-2">✓</span>
+                                <span>Персональный ментор (1 месяц)</span>
+                            </li>
+                            <li class="flex items-start">
+                                <span class="mr-2">✓</span>
+                                <span>Разбор ваших кампаний</span>
+                            </li>
+                        </ul>
+                        <button class="w-full bg-gold text-black px-6 py-3 font-bold hover:bg-yellow-400 hover:text-black transition-all duration-300 glow-box cta-button">
+                            Выбрать <i class="fas fa-crown ml-2"></i>
+                        </button>
+                    </div>
+                </div>
+                
+                <!-- Package 3 -->
+                <div class="fade-in">
+                    <div class="hologram p-8 rounded-lg h-full">
+                        <h3 class="text-2xl font-bold mb-4 neon-pink">VIP</h3>
+                        <div class="text-4xl font-bold mb-4 gold-text">$1497</div>
+                        <ul class="space-y-3 mb-6">
+                            <li class="flex items-start">
+                                <span class="mr-2">✓</span>
+                                <span>Доступ к курсу</span>
+                            </li>
+                            <li class="flex items-start">
+                                <span class="mr-2">✓</span>
+                                <span>Все офферы + эксклюзивы</span>
+                            </li>
+                            <li class="flex items-start">
+                                <span class="mr-2">✓</span>
+                                <span>Доступ в VIP чат</span>
+                            </li>
+                            <li class="flex items-start">
+                                <span class="mr-2">✓</span>
+                                <span>Персональный ментор (3 месяца)</span>
+                            </li>
+                            <li class="flex items-start">
+                                <span class="mr-2">✓</span>
+                                <span>Стратегия под ваш бюджет</span>
+                            </li>
+                        </ul>
+                        <button class="w-full bg-neon-pink text-black px-6 py-3 font-bold hover:bg-purple-600 hover:text-white transition-all duration-300 glow-box cta-button">
+                            Выбрать <i class="fas fa-star ml-2"></i>
+                        </button>
+                    </div>
+                </div>
+            </div>
+            
+            <div class="text-center">
+                <button class="bg-neon-blue text-black px-8 py-3 text-lg font-bold hover:bg-neon-purple hover:text-white transition-all duration-300 glow-box cta-button" onclick="scrollToLevel('level10')">
+                    Узнать условия <i class="fas fa-info-circle ml-2"></i>
+                </button>
+            </div>
+        </div>
+    </section>
+    
+    <!-- Level 10: Testimonials -->
+    <section class="section flex items-center justify-center" id="level10">
+        <div class="max-w-6xl mx-auto">
+            <h2 class="text-4xl md:text-5xl font-bold mb-12 text-center neon-text neon-blue">Отзывы игроков</h2>
+            
+            <div class="grid md:grid-cols-2 gap-8 mb-12">
+                <!-- Testimonial 1 -->
+                <div class="fade-in">
+                    <div class="hologram p-6 rounded-lg h-full">
+                        <div class="flex items-center mb-4">
+                            <div class="w-16 h-16 rounded-full border-2 border-neon-blue bg-cover bg-center mr-4" style="background-image: url('https://randomuser.me/api/portraits/men/11.jpg');"></div>
+                            <div>
+                                <h3 class="font-bold">Александр К.</h3>
+                                <div class="flex text-yellow-400 text-sm">
+                                    <i class="fas fa-star"></i>
+                                    <i class="fas fa-star"></i>
+                                    <i class="fas fa-star"></i>
+                                    <i class="fas fa-star"></i>
+                                    <i class="fas fa-star"></i>
+                                </div>
+                            </div>
+                        </div>
+                        <p class="mb-4">"За 2 месяца вышел на стабильные $1500 в месяц. До этого пытался сам, но без системы не получалось. Курс реально дает все инструменты для старта."</p>
+                        <div class="text-xs bg-neon-blue bg-opacity-20 text-neon-blue px-3 py-1 rounded inline-block">Результат через 2 месяца</div>
+                    </div>
+                </div>
+                
+                <!-- Testimonial 2 -->
+                <div class="fade-in">
+                    <div class="hologram p-6 rounded-lg h-full">
+                        <div class="flex items-center mb-4">
+                            <div class="w-16 h-16 rounded-full border-2 border-neon-purple bg-cover bg-center mr-4" style="background-image: url('https://randomuser.me/api/portraits/women/33.jpg');"></div>
+                            <div>
+                                <h3 class="font-bold">Елена С.</h3>
+                                <div class="flex text-yellow-400 text-sm">
+                                    <i class="fas fa-star"></i>
+                                    <i class="fas fa-star"></i>
+                                    <i class="fas fa-star"></i>
+                                    <i class="fas fa-star"></i>
+                                    <i class="fas fa-star"></i>
+                                </div>
+                            </div>
+                        </div>
+                        <p class="mb-4">"Брала VIP пакет с ментором. Лучшее решение! За 4 месяца вышла на $5k в месяц. Ментор помог избежать всех ошибок, которые я бы точно совершила."</p>
+                        <div class="text-xs bg-neon-purple bg-opacity-20 text-neon-purple px-3 py-1 rounded inline-block">Результат через 4 месяца</div>
+                    </div>
+                </div>
+                
+                <!-- Testimonial 3 -->
+                <div class="fade-in">
+                    <div class="hologram p-6 rounded-lg h-full">
+                        <div class="flex items-center mb-4">
+                            <div class="w-16 h-16 rounded-full border-2 border-neon-pink bg-cover bg-center mr-4" style="background-image: url('https://randomuser.me/api/portraits/men/44.jpg');"></div>
+                            <div>
+                                <h3 class="font-bold">Дмитрий П.</h3>
+                                <div class="flex text-yellow-400 text-sm">
+                                    <i class="fas fa-star"></i>
+                                    <i class="fas fa-star"></i>
+                                    <i class="fas fa-star"></i>
+                                    <i class="fas fa-star"></i>
+                                    <i class="fas fa-star"></i>
+                                </div>
+                            </div>
+                        </div>
+                        <p class="mb-4">"Прошел курс за 3 недели, сразу начал применять. Первый месяц - $800, второй - $3500, сейчас стабильно $7-10k. Система работает!"</p>
+                        <div class="text-xs bg-neon-pink bg-opacity-20 text-neon-pink px-3 py-1 rounded inline-block">Результат через 6 месяцев</div>
+                    </div>
+                </div>
+                
+                <!-- Testimonial 4 -->
+                <div class="fade-in">
+                    <div class="hologram p-6 rounded-lg h-full">
+                        <div class="flex items-center mb-4">
+                            <div class="w-16 h-16 rounded-full border-2 border-gold bg-cover bg-center mr-4" style="background-image: url('https://randomuser.me/api/portraits/women/22.jpg');"></div>
+                            <div>
+                                <h3 class="font-bold">Анна М.</h3>
+                                <div class="flex text-yellow-400 text-sm">
+                                    <i class="fas fa-star"></i>
+                                    <i class="fas fa-star"></i>
+                                    <i class="fas fa-star"></i>
+                                    <i class="fas fa-star"></i>
+                                    <i class="fas fa-star"></i>
+                                </div>
+                            </div>
+                        </div>
+                        <p class="mb-4">"Начала с нуля, без опыта в маркетинге. Через месяц первые деньги, через 3 - $2500. Сейчас развиваю агентство на основе полученных знаний."</p>
+                        <div class="text-xs bg-gold bg-opacity-20 text-gold px-3 py-1 rounded inline-block">Результат через 3 месяца</div>
+                    </div>
+                </div>
+            </div>
+            
+            <div class="text-center">
+                <button class="bg-neon-purple text-black px-8 py-3 text-lg font-bold hover:bg-neon-blue hover:text-white transition-all duration-300 glow-box cta-button" onclick="scrollToLevel('level11')">
+                    Хочу такие же результаты <i class="fas fa-rocket ml-2"></i>
+                </button>
+            </div>
+        </div>
+    </section>
+    
+    <!-- Level 11: FAQ -->
+    <section class="section flex items-center justify-center" id="level11">
+        <div class="max-w-6xl mx-auto">
+            <h2 class="text-4xl md:text-5xl font-bold mb-12 text-center neon-text neon-blue">Вопросы и ответы</h2>
+            
+            <div class="grid md:grid-cols-2 gap-8 mb-12">
+                <!-- FAQ Column 1 -->
+                <div class="fade-in">
+                    <div class="hologram p-6 rounded-lg mb-4">
+                        <h3 class="font-bold mb-2 neon-blue">Сколько времени нужно уделять?</h3>
+                        <p class="text-sm">Для первых результатов достаточно 2-3 часов в день. По мере роста кампаний время можно сократить до контроля и оптимизации.</p>
+                    </div>
+                    
+                    <div class="hologram p-6 rounded-lg mb-4">
+                        <h3 class="font-bold mb-2 neon-purple">Нужен ли начальный бюджет?</h3>
+                        <p class="text-sm">Минимальный бюджет для старта - $200-300. Это покрывает тестовые кампании. Дальше можно масштабироваться с прибыли.</p>
+                    </div>
+                    
+                    <div class="hologram p-6 rounded-lg">
+                        <h3 class="font-bold mb-2 neon-pink">Как быстро появятся первые результаты?</h3>
+                        <p class="text-sm">Первые продажи у большинства студентов происходят в течение 2-4 недель после начала обучения.</p>
+                    </div>
+                </div>
+                
+                <!-- FAQ Column 2 -->
+                <div class="fade-in">
+                    <div class="hologram p-6 rounded-lg mb-4">
+                        <h3 class="font-bold mb-2 neon-blue">Подойдет ли мне, если я новичок?</h3>
+                        <p class="text-sm">Курс рассчитан на полных новичков. Все объясняется от базовых понятий до сложных стратегий.</p>
+                    </div>
+                    
+                    <div class="hologram p-6 rounded-lg mb-4">
+                        <h3 class="font-bold mb-2 neon-purple">Есть ли гарантии результата?</h3>
+                        <p class="text-sm">Мы даем проверенную систему, но результат зависит от ваших действий. При серьезном подходе успех неизбежен.</p>
+                    </div>
+                    
+                    <div class="hologram p-6 rounded-lg">
+                        <h3 class="font-bold mb-2 neon-pink">Какой пакет выбрать?</h3>
+                        <p class="text-sm">Если бюджет ограничен - начните со Стандарта. Для быстрых результатов лучше Премиум или VIP с ментором.</p>
+                    </div>
+                </div>
+            </div>
+            
+            <div class="text-center">
+                <button class="bg-neon-blue text-black px-8 py-3 text-lg font-bold hover:bg-neon-purple hover:text-white transition-all duration-300 glow-box cta-button" onclick="scrollToLevel('level12')">
+                    Готов начать! <i class="fas fa-arrow-right ml-2"></i>
+                </button>
+            </div>
+        </div>
+    </section>
+    
+    <!-- Level 12: CTA -->
+    <section class="section flex items-center justify-center" id="level12">
+        <div class="max-w-4xl mx-auto text-center">
+            <div class="door mx-auto mb-12" id="finalDoor">
+                <div class="door-handle" onclick="openFinalDoor()"></div>
+                <div class="keyhole"></div>
+            </div>
+            
+            <h2 class="text-4xl md:text-5xl font-bold mb-6 neon-text neon-blue">Твой новый уровень начинается сейчас</h2>
+            <p class="text-xl mb-8">Если не сейчас — то когда? Начни путь с TMT уже сегодня.</p>
+            
+            <div class="max-w-md mx-auto">
+                <form id="contactForm" class="space-y-4 mb-8">
+                    <input type="text" placeholder="Ваше имя" class="w-full bg-black bg-opacity-50 border border-neon-blue text-white px-4 py-3 rounded focus:outline-none focus:ring-2 focus:ring-neon-blue">
+                    <input type="email" placeholder="Email" class="w-full bg-black bg-opacity-50 border border-neon-blue text-white px-4 py-3 rounded focus:outline-none focus:ring-2 focus:ring-neon-blue">
+                    <input type="tel" placeholder="Телефон" class="w-full bg-black bg-opacity-50 border border-neon-blue text-white px-4 py-3 rounded focus:outline-none focus:ring-2 focus:ring-neon-blue">
+                    <button type="submit" class="w-full bg-gold text-black px-6 py-4 font-bold hover:bg-yellow-400 transition-all duration-300 glow-box cta-button text-lg">
+                        Войти в игру <i class="fas fa-door-open ml-2"></i>
+                    </button>
+                </form>
+                
+                <div class="flex justify-center space-x-4">
+                    <a href="#" class="social-icon text-xl w-10 h-10 flex items-center justify-center rounded-full bg-black bg-opacity-50 hover:bg-neon-blue hover:text-black">
+                        <i class="fab fa-telegram"></i>
+                    </a>
+                    <a href="#" class="social-icon text-xl w-10 h-10 flex items-center justify-center rounded-full bg-black bg-opacity-50 hover:bg-neon-purple hover:text-black">
+                        <i class="fab fa-whatsapp"></i>
+                    </a>
+                    <a href="#" class="social-icon text-xl w-10 h-10 flex items-center justify-center rounded-full bg-black bg-opacity-50 hover:bg-neon-pink hover:text-black">
+                        <i class="fab fa-viber"></i>
+                    </a>
+                </div>
+            </div>
+        </div>
+    </section>
+    
     <script>
         // User progress and achievements
         const userProgress = {
@@ -760,54 +1447,5 @@
             badge.className = 'xp-badge';
             badge.textContent = '+20 XP';
             badge.style.left = `${Math.random() * 80 + 10}%`;
-            badge.style.top = `${Math.random() * 80 + 10}%`;
-            
-            container.appendChild(badge);
-            
-            setTimeout(() => {
-                badge.remove();
-            }, 2000);
-        }
-        
-        // Initialize
-        window.onload = function() {
-            setupParallax();
-            
-            // Set up progress navigation click events
-            document.querySelectorAll('.progress-dot').forEach(dot => {
-                dot.addEventListener('click', function() {
-                    const section = this.getAttribute('data-section');
-                    scrollToLevel(section);
-                });
-            });
-            
-            // Set up avatar click event
-            document.getElementById('userAvatar').addEventListener('click', function() {
-                const popup = document.getElementById('achievementPopup');
-                if (userProgress.achievements.length > 0) {
-                    document.getElementById('achievementTitle').textContent = 'Ваши достижения';
-                    document.getElementById('achievementDesc').textContent = `У вас ${userProgress.achievements.length} достижений`;
-                    popup.style.display = 'block';
-                }
-            });
-            
-            // Add XP on button hover
-            document.querySelectorAll('.cta-button, .micro-interaction').forEach(button => {
-                button.addEventListener('mouseenter', function() {
-                    if (!this.classList.contains('xp-added')) {
-                        userProgress.xp += 5;
-                        createXPBadge();
-                        this.classList.add('xp-added');
-                    }
-                });
-            });
-            
-            // Initial check for first achievement
-            checkAchievement('start');
-        };
-
-        // Rest of the JavaScript functions remain the same
-        // ...
-    </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/course21" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
+            badge.style.top = `${Math.random() * 80 + 10}
 </html>

prompts.txt

@@ -1,2 +1,3 @@
 Я ознакомился с результатом по ссылке https://huggingface.co/spaces/timoon811/course21. Отличная работа по воплощению концепции! Для дальнейшего улучшения лендинга предлагаю следующие идеи: 	1.	Углубление интерактивности: 	•	Геймификация: Реализуйте систему достижений или прогресса, где пользователи могут “разблокировать” контент по мере прохождения лендинга. Это усилит ощущение игры и вовлечет посетителей. 	•	Персонализация: Добавьте возможность выбора “аватара” или “персонажа”, который будет сопровождать пользователя по сайту, отражая его путь в арбитраже. 	2.	Улучшение визуальных эффектов: 	•	Анимация фона: Используйте параллакс-эффект для создания глубины и движения фона, что подчеркнет киберпанковскую эстетику. 	•	Микро-анимации: Добавьте небольшие анимации при наведении на элементы (например, кнопки, иконки), чтобы сделать взаимодействие более живым. 	3.	Оптимизация пользовательского пути: 	•	Четкие CTA (Call to Action): Убедитесь, что призывы к действию выделяются и логически вписываются в контекст каждого блока. 	•	Навигация: Предусмотрите фиксированное меню или индикатор прогресса, чтобы пользователь понимал, на каком этапе находится и мог легко перемещаться по разделам. 	4.	Техническая оптимизация: 	•	Производительность: Убедитесь, что анимации и эффекты не замедляют загрузку страницы, особенно на мобильных устройствах. 	•	Кросс-браузерность: Проверьте корректность отображения и работы функционала во всех популярных браузерах.  Внедрение этих улучшений поможет сделать лендинг еще более привлекательным и эффективным для пользователей.
-Я посмотрел второй вариант лендинга по ссылке. Вот точечные предложения по улучшению, чтобы сделать его ещё более сильным, запоминающимся и высококонверсионным:  ⸻  🧠 1. Повысить “вовлечённость с первого экрана”  Что сейчас: Вход неплохой, но не хватает удара по эмоциям.  Что сделать: 	•	Добавить киношный слоган или мощный catch-фрейм: “Если ты не арбитражишь – ты просто смотришь, как другие делают деньги.” 	•	Кнопка “Начать игру” должна пульсировать, анимироваться при наведении, быть частью интерактивной сцены.  ⸻  💸 2. Анимация “деньги текут рекой”  Что сейчас: Эффект минимален или отсутствует.  Что сделать: 	•	Внедрить видеофон / луп-анимацию поверх блока: 	•	Падающие купюры 	•	Поток цифр и профитов 	•	Монеты, вылетающие из воронки 	•	Использовать lottiefiles.com — много SVG-анимаций денег бесплатно  ⸻  🎮 3. Гейм-дизайн интерфейсов  Что сейчас: Есть стилизация, но мало глубины.  Что сделать: 	•	Добавить “прогресс бар” или мини-карту уровней сбоку (как в играх) 	•	В каждой секции можно показывать “XP +20”, “Навык разблокирован” — это создаст ощущение “игрового обучения”  ⸻  🧩 4. Визуально отделить секции  Что сейчас: Блоки немного сливаются между собой.  Что сделать: 	•	Использовать визуальные разделители: 	•	Голографические барьеры 	•	Переломы света 	•	“Цифровой шум” или лазерная сетка 	•	Можно даже добавить звук (в будущем) — лёгкий sci-fi шепот при скролле, переходе  ⸻  👁 5. Добавить эффекты “оживления”  Что можно внедрить: 	•	При наведении на отзывы — персонажи “оживают”, фон за ними меняется 	•	Скролл по “ветке модуля” можно сделать интерактивной (при нажатии – всплывает подсказка) 	•	Эффект появления блоков при скролле: blur > clarity + slide-in  ⸻  🧬 6. Усилить финальный CTA  Сейчас: Последний экран не дожимает  Рекомендации: 	•	Сделать блок регистрации максимально эмоциональным: 	•	Визуал: герой с чемоданом денег, или “экран успеха” 	•	Надпись: “Если не сейчас – то когда? Начни путь с TMT уже сегодня.” 	•	Кнопка “Войти в игру” + скролл/форма  ⸻  🚀 Бонус: идейные вставки 	•	Блок “Арбитражник будущего” — как будет выглядеть твоя жизнь через 2 месяца (в стиле sci-fi паспорта успеха) 	•	Добавить 3D-модель “связки” — оффер → прокладка → FB Ads → $ 	•	Плашка “Ты сделал это!” — появляется после заполнения формы  ⸻  Готов доработать один из блоков прямо сейчас (например, отзывы, первый экран или блок с программой) — как ты хочешь?
+Я посмотрел второй вариант лендинга по ссылке. Вот точечные предложения по улучшению, чтобы сделать его ещё более сильным, запоминающимся и высококонверсионным:  ⸻  🧠 1. Повысить “вовлечённость с первого экрана”  Что сейчас: Вход неплохой, но не хватает удара по эмоциям.  Что сделать: 	•	Добавить киношный слоган или мощный catch-фрейм: “Если ты не арбитражишь – ты просто смотришь, как другие делают деньги.” 	•	Кнопка “Начать игру” должна пульсировать, анимироваться при наведении, быть частью интерактивной сцены.  ⸻  💸 2. Анимация “деньги текут рекой”  Что сейчас: Эффект минимален или отсутствует.  Что сделать: 	•	Внедрить видеофон / луп-анимацию поверх блока: 	•	Падающие купюры 	•	Поток цифр и профитов 	•	Монеты, вылетающие из воронки 	•	Использовать lottiefiles.com — много SVG-анимаций денег бесплатно  ⸻  🎮 3. Гейм-дизайн интерфейсов  Что сейчас: Есть стилизация, но мало глубины.  Что сделать: 	•	Добавить “прогресс бар” или мини-карту уровней сбоку (как в играх) 	•	В каждой секции можно показывать “XP +20”, “Навык разблокирован” — это создаст ощущение “игрового обучения”  ⸻  🧩 4. Визуально отделить секции  Что сейчас: Блоки немного сливаются между собой.  Что сделать: 	•	Использовать визуальные разделители: 	•	Голографические барьеры 	•	Переломы света 	•	“Цифровой шум” или лазерная сетка 	•	Можно даже добавить звук (в будущем) — лёгкий sci-fi шепот при скролле, переходе  ⸻  👁 5. Добавить эффекты “оживления”  Что можно внедрить: 	•	При наведении на отзывы — персонажи “оживают”, фон за ними меняется 	•	Скролл по “ветке модуля” можно сделать интерактивной (при нажатии – всплывает подсказка) 	•	Эффект появления блоков при скролле: blur > clarity + slide-in  ⸻  🧬 6. Усилить фина��ьный CTA  Сейчас: Последний экран не дожимает  Рекомендации: 	•	Сделать блок регистрации максимально эмоциональным: 	•	Визуал: герой с чемоданом денег, или “экран успеха” 	•	Надпись: “Если не сейчас – то когда? Начни путь с TMT уже сегодня.” 	•	Кнопка “Войти в игру” + скролл/форма  ⸻  🚀 Бонус: идейные вставки 	•	Блок “Арбитражник будущего” — как будет выглядеть твоя жизнь через 2 месяца (в стиле sci-fi паспорта успеха) 	•	Добавить 3D-модель “связки” — оффер → прокладка → FB Ads → $ 	•	Плашка “Ты сделал это!” — появляется после заполнения формы  ⸻  Готов доработать один из блоков прямо сейчас (например, отзывы, первый экран или блок с программой) — как ты хочешь?
+Ленд не работает - проверь исправь ошибки