Spaces:
Running
Running
| <html lang="ru"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>AI-STUDIO × TORUS GROUP | Нейро-решения для роста</title> | |
| <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap" rel="stylesheet"> | |
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <script> | |
| tailwind.config = { | |
| theme: { | |
| extend: { | |
| colors: { | |
| primary: '#00f5d4', | |
| secondary: '#ffb700', | |
| dark: '#0f0f0f', | |
| darker: '#0a0a0a', | |
| light: '#f1f1f1', | |
| }, | |
| fontFamily: { | |
| sans: ['Inter', 'sans-serif'], | |
| }, | |
| animation: { | |
| 'float': 'float 6s ease-in-out infinite', | |
| 'pulse-slow': 'pulse 4s cubic-bezier(0.4, 0, 0.6, 1) infinite', | |
| 'grid-pulse': 'gridPulse 10s linear infinite', | |
| }, | |
| keyframes: { | |
| float: { | |
| '0%, 100%': { transform: 'translateY(0)' }, | |
| '50%': { transform: 'translateY(-20px)' }, | |
| }, | |
| gridPulse: { | |
| '0%': { 'background-position': '0% 0%' }, | |
| '100%': { 'background-position': '100% 100%' }, | |
| } | |
| } | |
| } | |
| } | |
| } | |
| </script> | |
| <style> | |
| @keyframes gradient { | |
| 0% { background-position: 0% 50%; } | |
| 50% { background-position: 100% 50%; } | |
| 100% { background-position: 0% 50%; } | |
| } | |
| .futuristic-bg { | |
| background-color: #0a0a0a; | |
| background-image: | |
| radial-gradient(circle at 20% 30%, rgba(0, 245, 212, 0.05) 0%, transparent 20%), | |
| radial-gradient(circle at 80% 70%, rgba(255, 183, 0, 0.05) 0%, transparent 20%), | |
| linear-gradient(to bottom right, | |
| transparent 48%, | |
| rgba(0, 245, 212, 0.03) 49%, | |
| rgba(0, 245, 212, 0.03) 51%, | |
| transparent 52%), | |
| linear-gradient(to top left, | |
| transparent 48%, | |
| rgba(255, 183, 0, 0.03) 49%, | |
| rgba(255, 183, 0, 0.03) 51%, | |
| transparent 52%), | |
| linear-gradient(rgba(15, 15, 15, 0.9), rgba(15, 15, 15, 0.9)), | |
| url("data:image/svg+xml,%3Csvg width='100' height='100' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11 18c3.866 0 7-3.134 7-7s-3.134-7-7-7-7 3.134-7 7 3.134 7 7 7zm48 25c3.866 0 7-3.134 7-7s-3.134-7-7-7-7 3.134-7 7 3.134 7 7 7zm-43-7c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm63 31c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zM34 90c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm56-76c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zM12 86c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm28-65c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm23-11c2.76 0 5-2.24 5-5s-2.24-5-5-5-5 2.24-5 5 2.24 5 5 5zm-6 60c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm29 22c2.76 0 5-2.24 5-5s-2.24-5-5-5-5 2.24-5 5 2.24 5 5 5zM32 63c2.76 0 5-2.24 5-5s-2.24-5-5-5-5 2.24-5 5 2.24 5 5 5zm57-13c2.76 0 5-2.24 5-5s-2.24-5-5-5-5 2.24-5 5 2.24 5 5 5zm-9-21c1.105 0 2-.895 2-2s-.895-2-2-2-2 .895-2 2 .895 2 2 2zM60 91c1.105 0 2-.895 2-2s-.895-2-2-2-2 .895-2 2 .895 2 2 2zM35 41c1.105 0 2-.895 2-2s-.895-2-2-2-2 .895-2 2 .895 2 2 2zM12 60c1.105 0 2-.895 2-2s-.895-2-2-2-2 .895-2 2 .895 2 2 2z' fill='%2300f5d4' fill-opacity='0.03' fill-rule='evenodd'/%3E%3C/svg%3E"); | |
| animation: gridPulse 20s linear infinite; | |
| } | |
| .cyber-grid { | |
| position: fixed; | |
| top: 0; | |
| left: 0; | |
| width: 100%; | |
| height: 100%; | |
| background-image: | |
| linear-gradient(rgba(0, 245, 212, 0.03) 1px, transparent 1px), | |
| linear-gradient(90deg, rgba(0, 245, 212, 0.03) 1px, transparent 1px); | |
| background-size: 50px 50px; | |
| pointer-events: none; | |
| z-index: 0; | |
| } | |
| .cyber-corner { | |
| position: fixed; | |
| width: 200px; | |
| height: 200px; | |
| pointer-events: none; | |
| z-index: 0; | |
| } | |
| .cyber-corner::before, .cyber-corner::after { | |
| content: ''; | |
| position: absolute; | |
| background: linear-gradient(to right, rgba(0, 245, 212, 0.5), transparent); | |
| width: 100px; | |
| height: 2px; | |
| } | |
| .cyber-corner::before { | |
| top: 0; | |
| left: 0; | |
| } | |
| .cyber-corner::after { | |
| bottom: 0; | |
| right: 0; | |
| transform: rotate(180deg); | |
| } | |
| .corner-top-left { | |
| top: 0; | |
| left: 0; | |
| } | |
| .corner-top-right { | |
| top: 0; | |
| right: 0; | |
| transform: rotate(90deg); | |
| } | |
| .corner-bottom-left { | |
| bottom: 0; | |
| left: 0; | |
| transform: rotate(270deg); | |
| } | |
| .corner-bottom-right { | |
| bottom: 0; | |
| right: 0; | |
| transform: rotate(180deg); | |
| } | |
| .card-hover { | |
| transition: all 0.3s ease; | |
| position: relative; | |
| overflow: hidden; | |
| } | |
| .card-hover::before { | |
| content: ''; | |
| position: absolute; | |
| top: -50%; | |
| left: -50%; | |
| width: 200%; | |
| height: 200%; | |
| background: linear-gradient( | |
| to bottom right, | |
| rgba(0, 245, 212, 0.1), | |
| rgba(0, 245, 212, 0.3), | |
| rgba(255, 183, 0, 0.3), | |
| rgba(0, 245, 212, 0.1) | |
| ); | |
| transform: rotate(30deg); | |
| opacity: 0; | |
| transition: opacity 0.5s; | |
| } | |
| .card-hover:hover::before { | |
| opacity: 1; | |
| animation: shine 1.5s; | |
| } | |
| .glow { | |
| text-shadow: 0 0 10px rgba(0, 245, 212, 0.7); | |
| } | |
| .glow-secondary { | |
| text-shadow: 0 0 10px rgba(255, 183, 0, 0.7); | |
| } | |
| .fade-in { | |
| animation: fadeIn 1s ease-out; | |
| } | |
| @keyframes fadeIn { | |
| from { opacity: 0; transform: translateY(20px); } | |
| to { opacity: 1; transform: translateY(0); } | |
| } | |
| .icon-float { | |
| animation: float 6s ease-in-out infinite; | |
| } | |
| .scroll-smooth { | |
| scroll-behavior: smooth; | |
| } | |
| .highlight-box { | |
| position: relative; | |
| overflow: hidden; | |
| } | |
| .highlight-box::before { | |
| content: ''; | |
| position: absolute; | |
| top: -50%; | |
| left: -50%; | |
| width: 200%; | |
| height: 200%; | |
| background: linear-gradient( | |
| to bottom right, | |
| rgba(0, 245, 212, 0.1), | |
| rgba(0, 245, 212, 0.3), | |
| rgba(255, 183, 0, 0.3), | |
| rgba(0, 245, 212, 0.1) | |
| ); | |
| transform: rotate(30deg); | |
| animation: shine 3s infinite; | |
| } | |
| @keyframes shine { | |
| 0% { transform: translateX(-100%) rotate(30deg); } | |
| 100% { transform: translateX(100%) rotate(30deg); } | |
| } | |
| @keyframes gridPulse { | |
| 0% { background-position: 0 0; } | |
| 100% { background-position: 50px 50px; } | |
| } | |
| .binary-rain { | |
| position: fixed; | |
| top: 0; | |
| left: 0; | |
| width: 100%; | |
| height: 100%; | |
| overflow: hidden; | |
| z-index: 0; | |
| pointer-events: none; | |
| } | |
| .binary-digit { | |
| position: absolute; | |
| color: rgba(0, 245, 212, 0.3); | |
| font-size: 16px; | |
| font-family: monospace; | |
| user-select: none; | |
| animation: binaryFall linear infinite; | |
| } | |
| @keyframes binaryFall { | |
| 0% { transform: translateY(-100px); opacity: 0; } | |
| 10% { opacity: 1; } | |
| 90% { opacity: 1; } | |
| 100% { transform: translateY(100vh); opacity: 0; } | |
| } | |
| .holographic-effect { | |
| position: relative; | |
| } | |
| .holographic-effect::after { | |
| content: ''; | |
| position: absolute; | |
| top: 0; | |
| left: 0; | |
| right: 0; | |
| bottom: 0; | |
| background: linear-gradient( | |
| 135deg, | |
| rgba(0, 245, 212, 0.1) 0%, | |
| rgba(255, 183, 0, 0.1) 50%, | |
| rgba(0, 245, 212, 0.1) 100% | |
| ); | |
| z-index: -1; | |
| border-radius: inherit; | |
| opacity: 0.5; | |
| } | |
| .neon-border { | |
| position: relative; | |
| } | |
| .neon-border::before { | |
| content: ''; | |
| position: absolute; | |
| inset: 0; | |
| border-radius: inherit; | |
| padding: 2px; | |
| background: linear-gradient(45deg, #00f5d4, #ffb700); | |
| -webkit-mask: | |
| linear-gradient(#fff 0 0) content-box, | |
| linear-gradient(#fff 0 0); | |
| -webkit-mask-composite: xor; | |
| mask-composite: exclude; | |
| pointer-events: none; | |
| } | |
| </style> | |
| </head> | |
| <body class="futuristic-bg min-h-screen scroll-smooth text-light font-sans overflow-x-hidden"> | |
| <!-- Futuristic background elements --> | |
| <div class="cyber-grid"></div> | |
| <div class="cyber-corner corner-top-left"></div> | |
| <div class="cyber-corner corner-top-right"></div> | |
| <div class="cyber-corner corner-bottom-left"></div> | |
| <div class="cyber-corner corner-bottom-right"></div> | |
| <!-- Binary rain effect --> | |
| <div class="binary-rain" id="binaryRain"></div> | |
| <!-- Floating particles background --> | |
| <div class="fixed inset-0 overflow-hidden pointer-events-none z-0"> | |
| <div class="absolute top-1/4 left-1/4 w-3 h-3 rounded-full bg-primary opacity-30 animate-float"></div> | |
| <div class="absolute top-1/3 right-1/4 w-4 h-4 rounded-full bg-secondary opacity-20 animate-float" style="animation-delay: 1s;"></div> | |
| <div class="absolute top-2/3 left-1/3 w-2 h-2 rounded-full bg-primary opacity-20 animate-float" style="animation-delay: 2s;"></div> | |
| <div class="absolute bottom-1/4 right-1/3 w-3 h-3 rounded-full bg-secondary opacity-30 animate-float" style="animation-delay: 3s;"></div> | |
| </div> | |
| <!-- Main container --> | |
| <div class="container mx-auto px-4 py-16 md:py-24 max-w-5xl relative z-10"> | |
| <!-- Header with animated logo --> | |
| <header class="mb-16 text-center fade-in"> | |
| <div class="flex justify-center mb-6"> | |
| <div class="relative w-24 h-24 rounded-full bg-gradient-to-br from-primary to-secondary flex items-center justify-center shadow-lg glow neon-border"> | |
| <i class="fas fa-brain text-4xl text-darker"></i> | |
| <div class="absolute inset-0 rounded-full border-2 border-primary opacity-30 animate-ping-slow"></div> | |
| </div> | |
| </div> | |
| <h1 class="text-4xl md:text-5xl font-extrabold mb-4 glow"> | |
| <span class="text-primary">AI-STUDIO</span> × <span class="text-secondary">TORUS GROUP</span> | |
| </h1> | |
| <p class="text-xl md:text-2xl font-medium text-gray-300 max-w-3xl mx-auto"> | |
| Интеллектуальное партнёрство для <span class="text-primary font-semibold">ускоренного роста</span> | |
| </p> | |
| </header> | |
| <!-- Main content sections --> | |
| <main class="space-y-20"> | |
| <!-- Intro section --> | |
| <section class="fade-in"> | |
| <div class="bg-darker bg-opacity-70 backdrop-blur-sm rounded-xl p-6 md:p-8 shadow-xl card-hover neon-border"> | |
| <p class="text-lg md:text-xl leading-relaxed"> | |
| Команда <strong class="text-primary">AI-STUDIO</strong> предлагает TORUS GROUP стратегическое сотрудничество по внедрению нейро-технологий в ваш флагманский проект <strong class="text-secondary">Zakazoom</strong>, краудинвестинг, комьюнити и маркетинг. | |
| </p> | |
| </div> | |
| </section> | |
| <!-- Offerings section with cards --> | |
| <section class="fade-in" style="animation-delay: 0.2s;"> | |
| <h2 class="text-2xl md:text-3xl font-bold mb-8 flex items-center glow-secondary"> | |
| <i class="fas fa-gift text-secondary mr-3"></i> Наши предложения | |
| </h2> | |
| <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6"> | |
| <!-- Card 1 --> | |
| <div class="bg-darker bg-opacity-70 rounded-xl p-6 shadow-lg card-hover border-l-4 border-primary neon-border"> | |
| <div class="text-primary text-3xl mb-4"> | |
| <i class="fas fa-robot"></i> | |
| </div> | |
| <h3 class="text-xl font-semibold mb-3">Telegram-бот Zakazoom с ИИ</h3> | |
| <p class="text-gray-300">Меню, заказ, рекомендации, интеграция с CRM</p> | |
| </div> | |
| <!-- Card 2 --> | |
| <div class="bg-darker bg-opacity-70 rounded-xl p-6 shadow-lg card-hover border-l-4 border-secondary neon-border"> | |
| <div class="text-secondary text-3xl mb-4"> | |
| <i class="fas fa-file-invoice-dollar"></i> | |
| </div> | |
| <h3 class="text-xl font-semibold mb-3">Инвест-бот «TFG Партнёр»</h3> | |
| <p class="text-gray-300">Сбор анкет, PDF-документы, расчёт прибыли, ответы на вопросы 24/7</p> | |
| </div> | |
| <!-- Card 3 --> | |
| <div class="bg-darker bg-opacity-70 rounded-xl p-6 shadow-lg card-hover border-l-4 border-primary neon-border"> | |
| <div class="text-primary text-3xl mb-4"> | |
| <i class="fas fa-graduation-cap"></i> | |
| </div> | |
| <h3 class="text-xl font-semibold mb-3">GPT-ассистент для обучения</h3> | |
| <p class="text-gray-300">Обучение партнёров и автоматические эфиры</p> | |
| </div> | |
| <!-- Card 4 --> | |
| <div class="bg-darker bg-opacity-70 rounded-xl p-6 shadow-lg card-hover border-l-4 border-secondary neon-border"> | |
| <div class="text-secondary text-3xl mb-4"> | |
| <i class="fas fa-ad"></i> | |
| </div> | |
| <h3 class="text-xl font-semibold mb-3">Нейромаркетинговый контент</h3> | |
| <p class="text-gray-300">Видео-аватары, генерация роликов, постов, лендингов</p> | |
| </div> | |
| <!-- Card 5 --> | |
| <div class="bg-darker bg-opacity-70 rounded-xl p-6 shadow-lg card-hover border-l-4 border-primary neon-border"> | |
| <div class="text-primary text-3xl mb-4"> | |
| <i class="fas fa-chart-line"></i> | |
| </div> | |
| <h3 class="text-xl font-semibold mb-3">Мониторинг KPI</h3> | |
| <p class="text-gray-300">Боты для мониторинга дарксторов и доставки (Zakazoom Logistics AI)</p> | |
| </div> | |
| <!-- Card 6 --> | |
| <div class="bg-darker bg-opacity-70 rounded-xl p-6 shadow-lg card-hover border-l-4 border-secondary neon-border"> | |
| <div class="text-secondary text-3xl mb-4"> | |
| <i class="fas fa-funnel-dollar"></i> | |
| </div> | |
| <h3 class="text-xl font-semibold mb-3">Автоматизированная воронка</h3> | |
| <p class="text-gray-300">Медиа-воронка в Telegram с аналитикой и CRM</p> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Collaboration formats --> | |
| <section class="fade-in" style="animation-delay: 0.4s;"> | |
| <h2 class="text-2xl md:text-3xl font-bold mb-8 flex items-center glow"> | |
| <i class="fas fa-handshake text-primary mr-3"></i> Форматы коллаборации | |
| </h2> | |
| <div class="grid grid-cols-1 md:grid-cols-2 gap-6"> | |
| <div class="bg-darker bg-opacity-70 rounded-xl p-6 shadow-lg card-hover neon-border"> | |
| <div class="flex items-start mb-4"> | |
| <div class="bg-primary bg-opacity-20 p-3 rounded-lg mr-4"> | |
| <i class="fas fa-tag text-primary text-xl"></i> | |
| </div> | |
| <div> | |
| <h3 class="text-xl font-semibold mb-2">White-label решение</h3> | |
| <p class="text-gray-300">Под брендом TORUS GROUP</p> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="bg-darker bg-opacity-70 rounded-xl p-6 shadow-lg card-hover neon-border"> | |
| <div class="flex items-start mb-4"> | |
| <div class="bg-secondary bg-opacity-20 p-3 rounded-lg mr-4"> | |
| <i class="fas fa-bullhorn text-secondary text-xl"></i> | |
| </div> | |
| <div> | |
| <h3 class="text-xl font-semibold mb-2">Совместные инфоповоды</h3> | |
| <p class="text-gray-300">Кейсы, конференции, эфиры</p> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="bg-darker bg-opacity-70 rounded-xl p-6 shadow-lg card-hover neon-border"> | |
| <div class="flex items-start mb-4"> | |
| <div class="bg-primary bg-opacity-20 p-3 rounded-lg mr-4"> | |
| <i class="fas fa-rocket text-primary text-xl"></i> | |
| </div> | |
| <div> | |
| <h3 class="text-xl font-semibold mb-2">Пробная интеграция</h3> | |
| <p class="text-gray-300">Telegram-бота с Zakazoom</p> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="bg-darker bg-opacity-70 rounded-xl p-6 shadow-lg card-hover neon-border"> | |
| <div class="flex items-start mb-4"> | |
| <div class="bg-secondary bg-opacity-20 p-3 rounded-lg mr-4"> | |
| <i class="fas fa-sync-alt text-secondary text-xl"></i> | |
| </div> | |
| <div> | |
| <h3 class="text-xl font-semibold mb-2">Постоянная поддержка</h3> | |
| <p class="text-gray-300">Развитие AI-экосистемы TFG</p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Technologies section --> | |
| <section class="fade-in" style="animation-delay: 0.6s;"> | |
| <h2 class="text-2xl md:text-3xl font-bold mb-8 flex items-center glow-secondary"> | |
| <i class="fas fa-tools text-secondary mr-3"></i> Что мы используем | |
| </h2> | |
| <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-5 gap-4"> | |
| <div class="tech-item bg-darker bg-opacity-70 rounded-lg p-4 text-center shadow-md card-hover neon-border"> | |
| <div class="text-primary text-3xl mb-2"> | |
| <i class="fab fa-python"></i> | |
| </div> | |
| <span class="font-medium">GPT-4 / Claude.ai</span> | |
| <p class="text-sm text-gray-400 mt-1">Диалоговые модели</p> | |
| </div> | |
| <div class="tech-item bg-darker bg-opacity-70 rounded-lg p-4 text-center shadow-md card-hover neon-border"> | |
| <div class="text-secondary text-3xl mb-2"> | |
| <i class="fas fa-code"></i> | |
| </div> | |
| <span class="font-medium">Python + Aiogram</span> | |
| <p class="text-sm text-gray-400 mt-1">Telegram-боты</p> | |
| </div> | |
| <div class="tech-item bg-darker bg-opacity-70 rounded-lg p-4 text-center shadow-md card-hover neon-border"> | |
| <div class="text-primary text-3xl mb-2"> | |
| <i class="fas fa-link"></i> | |
| </div> | |
| <span class="font-medium">LangChain / RAG</span> | |
| <p class="text-sm text-gray-400 mt-1">Доступ к знаниям</p> | |
| </div> | |
| <div class="tech-item bg-darker bg-opacity-70 rounded-lg p-4 text-center shadow-md card-hover neon-border"> | |
| <div class="text-secondary text-3xl mb-2"> | |
| <i class="fas fa-database"></i> | |
| </div> | |
| <span class="font-medium">Notion / Airtable</span> | |
| <p class="text-sm text-gray-400 mt-1">CRM и автоворонки</p> | |
| </div> | |
| <div class="tech-item bg-darker bg-opacity-70 rounded-lg p-4 text-center shadow-md card-hover neon-border"> | |
| <div class="text-primary text-3xl mb-2"> | |
| <i class="fas fa-paint-brush"></i> | |
| </div> | |
| <span class="font-medium">Midjourney / DALL·E</span> | |
| <p class="text-sm text-gray-400 mt-1">Визуальный контент</p> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- CTA section --> | |
| <section class="fade-in" style="animation-delay: 0.8s;"> | |
| <div class="highlight-box bg-gradient-to-r from-darker to-dark rounded-xl p-8 text-center shadow-xl relative overflow-hidden neon-border"> | |
| <div class="relative z-10"> | |
| <h3 class="text-2xl md:text-3xl font-bold mb-4 text-primary">Готовы к сотрудничеству!</h3> | |
| <p class="text-xl mb-6">Zoom-встреча, демонстрация и первый шаг в партнёрстве</p> | |
| <a href="https://t.me/Denis_2024" target="_blank" class="inline-flex items-center px-8 py-3 bg-primary text-darker font-bold rounded-lg hover:bg-opacity-90 transition-all shadow-lg hover:shadow-xl"> | |
| <i class="fab fa-telegram mr-2 text-xl"></i> Написать в Telegram | |
| </a> | |
| </div> | |
| </div> | |
| </section> | |
| </main> | |
| <!-- Footer --> | |
| <footer class="mt-20 pt-10 border-t border-gray-800 fade-in" style="animation-delay: 1s;"> | |
| <div class="grid grid-cols-1 md:grid-cols-3 gap-8"> | |
| <div> | |
| <h3 class="text-xl font-semibold mb-4 text-primary">Контакты</h3> | |
| <ul class="space-y-3"> | |
| <li class="flex items-center"> | |
| <i class="fas fa-user mr-3 text-secondary"></i> | |
| <a href="https://t.me/Denis_2024" target="_blank" class="hover:text-primary transition">@Denis_2024</a> | |
| </li> | |
| <li class="flex items-center"> | |
| <i class="fab fa-telegram mr-3 text-secondary"></i> | |
| <a href="https://t.me/Neirosetyvkarmane" target="_blank" class="hover:text-primary transition">https://t.me/Neirosetyvkarmane</a> | |
| </li> | |
| <li class="flex items-center"> | |
| <i class="fas fa-globe mr-3 text-secondary"></i> | |
| <a href="https://ai-studio-pro.ru/" target="_blank" class="hover:text-primary transition">ai-studio-pro.ru</a> | |
| </li> | |
| </ul> | |
| </div> | |
| <div> | |
| <h3 class="text-xl font-semibold mb-4 text-primary">AI-STUDIO</h3> | |
| <p class="text-gray-400">Инновационные нейро-решения для бизнеса. Автоматизация, маркетинг и аналитика на основе искусственного интеллекта.</p> | |
| </div> | |
| <div> | |
| <h3 class="text-xl font-semibold mb-4 text-primary">TORUS GROUP</h3> | |
| <p class="text-gray-400">Стратегический партнёр в реализации проекта Zakazoom и других инновационных инициатив.</p> | |
| </div> | |
| </div> | |
| <div class="mt-12 text-center text-gray-500 text-sm"> | |
| <p>© 2023 AI-STUDIO × TORUS GROUP. Все права защищены.</p> | |
| </div> | |
| </footer> | |
| </div> | |
| <!-- Floating action button --> | |
| <div class="fixed bottom-8 right-8 z-50"> | |
| <a href="#top" class="w-14 h-14 rounded-full bg-primary text-darker flex items-center justify-center shadow-xl hover:bg-opacity-90 transition-all transform hover:scale-110 neon-border"> | |
| <i class="fas fa-arrow-up text-xl"></i> | |
| </a> | |
| </div> | |
| <script> | |
| // Simple animation on scroll | |
| document.addEventListener('DOMContentLoaded', () => { | |
| const fadeElements = document.querySelectorAll('.fade-in'); | |
| const fadeInOnScroll = () => { | |
| fadeElements.forEach(element => { | |
| const elementTop = element.getBoundingClientRect().top; | |
| const windowHeight = window.innerHeight; | |
| if (elementTop < windowHeight - 100) { | |
| element.style.opacity = '1'; | |
| element.style.transform = 'translateY(0)'; | |
| } | |
| }); | |
| }; | |
| // Initial check | |
| fadeInOnScroll(); | |
| // Check on scroll | |
| window.addEventListener('scroll', fadeInOnScroll); | |
| // Add hover effect to tech items | |
| const techItems = document.querySelectorAll('.tech-item'); | |
| techItems.forEach(item => { | |
| item.addEventListener('mouseenter', () => { | |
| const icon = item.querySelector('div'); | |
| icon.classList.add('animate-bounce'); | |
| }); | |
| item.addEventListener('mouseleave', () => { | |
| const icon = item.querySelector('div'); | |
| icon.classList.remove('animate-bounce'); | |
| }); | |
| }); | |
| // Create binary rain effect | |
| const binaryRain = document.getElementById('binaryRain'); | |
| const characters = ['0', '1', '0', '1', '0', '1', '0', '1']; | |
| function createBinaryDigit() { | |
| const digit = document.createElement('div'); | |
| digit.className = 'binary-digit'; | |
| digit.textContent = characters[Math.floor(Math.random() * characters.length)]; | |
| digit.style.left = Math.random() * 100 + 'vw'; | |
| digit.style.animationDuration = (Math.random() * 3 + 2) + 's'; | |
| digit.style.animationDelay = (Math.random() * 2) + 's'; | |
| binaryRain.appendChild(digit); | |
| // Remove digit after animation completes | |
| setTimeout(() => { | |
| digit.remove(); | |
| }, 5000); | |
| } | |
| // Create initial digits | |
| for (let i = 0; i < 50; i++) { | |
| setTimeout(createBinaryDigit, Math.random() * 2000); | |
| } | |
| // Continue creating digits | |
| setInterval(createBinaryDigit, 300); | |
| }); | |
| </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=Denzel1989/ai-studio-generator" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> | |
| </html> |