<!DOCTYPE html>
<html lang="ru">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="Российский разработчик программного обеспечения">
    <title>АЙТИ-КАФФЕ - Российский разработчик программного обеспечения</title>
    
    <!-- CSS -->
    <link rel="stylesheet" href="/assets/css/fullscreen.css">
    <link rel="stylesheet" href="/assets/css/cookies.css">
    
    <!-- GSAP - мощная библиотека анимаций -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.5/gsap.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.5/ScrollTrigger.min.js"></script>
    
    <!-- Favicon -->
    <link rel="icon" type="image/png" href="/assets/images/logo/logo_turtle.png">
    
    <!-- SVG Icons -->
    <svg xmlns="http://www.w3.org/2000/svg" style="display: none;">
        <symbol id="icon-code" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
            <polyline points="16 18 22 12 16 6"></polyline>
            <polyline points="8 6 2 12 8 18"></polyline>
        </symbol>
        <symbol id="icon-device" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
            <rect x="2" y="7" width="20" height="14" rx="2" ry="2"></rect>
            <path d="M16 21V5a2 2 0 0 0-2-2h-4a2 2 0 0 0-2 2v16"></path>
        </symbol>
        <symbol id="icon-support" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
            <circle cx="12" cy="12" r="10"></circle>
            <path d="M12 16v-4"></path>
            <path d="M12 8h.01"></path>
        </symbol>
        <symbol id="icon-rocket" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
            <path d="M4.5 16.5c-1.5 1.26-2 5-2 5s3.74-.5 5-2c.71-.84.7-2.13-.09-2.91a2.18 2.18 0 0 0-2.91-.09z"></path>
            <path d="M12 15l-3-3a22 22 0 0 1 2-3.95A12.88 12.88 0 0 1 22 2c0 2.72-.78 7.5-6 11a22.35 22.35 0 0 1-4 2z"></path>
            <path d="M9 12H4s.55-3.03 2-4c1.62-1.08 5 0 5 0"></path>
            <path d="M12 15v5s3.03-.55 4-2c1.08-1.62 0-5 0-5"></path>
        </symbol>
        <symbol id="icon-shield" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
            <path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z"></path>
        </symbol>
        <symbol id="icon-zap" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
            <polygon points="13 2 3 14 12 14 11 22 21 10 12 10 13 2"></polygon>
        </symbol>
        <symbol id="icon-users" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
            <path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"></path>
            <circle cx="9" cy="7" r="4"></circle>
            <path d="M23 21v-2a4 4 0 0 0-3-3.87"></path>
            <path d="M16 3.13a4 4 0 0 1 0 7.75"></path>
        </symbol>
        <symbol id="icon-award" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
            <circle cx="12" cy="8" r="7"></circle>
            <polyline points="8.21 13.89 7 23 12 20 17 23 15.79 13.88"></polyline>
        </symbol>
    </svg>
</head>
<body>
    <header class="header">
        <div class="container">
            <div class="header-container">
                <a href="/" class="logo">
                    <img src="/assets/images/logo/logo_turtle.png" alt="АЙТИ-КАФФЕ">
                    <span class="logo-text">АЙТИ-КАФФЕ</span>
                </a>
                
                <nav class="nav">
                    <ul class="nav-links">
                                                    <li><a href="#hero" class="nav-link" data-section="0">Главная</a></li>
                            <li><a href="#about" class="nav-link" data-section="1">О компании</a></li>
                            <li><a href="#directions" class="nav-link" data-section="2">Услуги</a></li>
                            <li><a href="#projects" class="nav-link" data-section="3">Продукты</a></li>
                            <li><a href="#stats" class="nav-link" data-section="4">Портфолио</a></li>
                            <li><a href="#contacts" class="nav-link" data-section="5">Контакты</a></li>
                                            </ul>
                    
                    <div class="header-controls">
                        <div class="lang-switcher">
                            <span>RU</span>
                            <select onchange="switchLanguage(this.value)" style="background: transparent; border: none; color: var(--text-primary); cursor: pointer;">
                                <option value="ru" selected>RU</option>
                                <option value="en" >EN</option>
                                <option value="zh" >ZH</option>
                            </select>
                        </div>
                        
                        <button class="theme-switcher" aria-label="Переключить тему">
                            <span class="theme-switcher-icon">
                                <svg viewBox="0 0 24 24" fill="currentColor" width="20" height="20">
                                    <path d="M9.528 1.718a.75.75 0 01.162.819A8.97 8.97 0 009 6a9 9 0 009 9 8.97 8.97 0 003.463-.69.75.75 0 01.981.98 10.503 10.503 0 01-9.694 6.46c-5.799 0-10.5-4.701-10.5-10.5 0-4.368 2.667-8.112 6.46-9.694a.75.75 0 01.818.162z"/>
                                </svg>
                            </span>
                        </button>
                    </div>
                    
                    <button class="mobile-menu-toggle" aria-label="Меню">
                        <span></span>
                        <span></span>
                        <span></span>
                    </button>
                </nav>
            </div>
        </div>
    </header>


<div class="sections-container">
    <!-- Hero секция -->
    <section id="hero" class="fullscreen-section active" data-label="Главная">
        <div class="container">
            <div class="hero-content">
                <h1 class="hero-title">Российский разработчик программного обеспечения</h1>
                <p class="hero-subtitle">Создаем инновационные решения в сфере информационных технологий</p>
                <div class="hero-cta">
                    <a href="#about" class="btn btn-primary" data-section="1">Узнать больше</a>
                    <a href="#contacts" class="btn btn-secondary" data-section="6">Связаться с нами</a>
                </div>
            </div>
        </div>
    </section>

    <!-- О компании -->
    <section id="about" class="fullscreen-section" data-label="О компании">
        <div class="container">
            <div class="section-title">
                <h2>О компании</h2>
            </div>
            <div class="grid grid-2">
                <div class="card">
                    <svg class="card-icon" aria-hidden="true">
                        <use href="#icon-award"></use>
                    </svg>
                    <h3>История</h3>
                    <p><strong>Основана в 2008 году</strong> - компания начала свой путь в сфере информационных технологий.</p>
                    <p>компания возобновила работу с новыми силами и амбициозными проектами. <strong>в декабре 2024 года</strong></p>
                </div>
                <div class="card">
                    <svg class="card-icon" aria-hidden="true">
                        <use href="#icon-rocket"></use>
                    </svg>
                    <h3>Миссия</h3>
                    <p>Создание инновационных программных решений и IoT-устройств, которые делают жизнь людей проще и удобнее.</p>
                    <p>Мы специализируемся на полном цикле разработки - от идеи до готового продукта, с полной локализацией производства в России.</p>
                </div>
            </div>
        </div>
    </section>

    <!-- Направления деятельности -->
    <section id="directions" class="fullscreen-section" data-label="Направления">
        <div class="container">
            <div class="section-title">
                <h2>Направления деятельности в сфере ИТ</h2>
            </div>
            <div class="grid grid-3">
                <div class="card">
                    <svg class="card-icon" aria-hidden="true">
                        <use href="#icon-code"></use>
                    </svg>
                    <h3>Разработка программного обеспечения</h3>
                    <p>Создание веб-приложений, мобильных приложений (iOS, Android), десктопных приложений и облачных решений.</p>
                </div>
                <div class="card">
                    <svg class="card-icon" aria-hidden="true">
                        <use href="#icon-device"></use>
                    </svg>
                    <h3>IoT-разработка</h3>
                    <p>Разработка умных устройств, платформ управления и интеграция с экосистемами умного дома (Яндекс Алиса, VK Маруся).</p>
                </div>
                <div class="card">
                    <svg class="card-icon" aria-hidden="true">
                        <use href="#icon-support"></use>
                    </svg>
                    <h3>Техническая поддержка</h3>
                    <p>Сопровождение программного обеспечения, обновления, доработки и консалтинг в области информационных технологий.</p>
                </div>
            </div>
        </div>
    </section>

    <!-- Ключевые проекты -->
    <section id="projects" class="fullscreen-section" data-label="Проекты">
        <div class="container">
            <div class="section-title">
                <h2>Наши проекты</h2>
            </div>
            <div class="grid grid-3">
                <div class="card">
                    <h3>PauchPlus</h3>
                    <p>Первая в России и мире умная кормушка для влажного корма с автоматическим вскрытием пауч-пакетов и IoT-управлением.</p>
                    <a href="/products.php#pauchplus" class="btn btn-primary" style="margin-top: 1rem;">Подробнее</a>
                </div>
                <div class="card">
                    <h3>iFreeLancer.Pro</h3>
                    <p>Платформа для поиска удаленной работы и фриланс-биржи, объединяющая работодателей и специалистов.</p>
                    <a href="/products.php#ifreelancer" class="btn btn-primary" style="margin-top: 1rem;">Подробнее</a>
                </div>
                <div class="card">
                    <h3>Конвертер CSV в JSON</h3>
                    <p>Зарегистрированное программное обеспечение (№ 2025689123) для конвертации данных из CSV формата в JSON.</p>
                    <a href="/products.php#csv-converter" class="btn btn-primary" style="margin-top: 1rem;">Подробнее</a>
                </div>
            </div>
        </div>
    </section>

    <!-- Статистика -->
    <section id="stats" class="fullscreen-section" data-label="Статистика">
        <div class="container">
            <div class="section-title">
                <h2>Наши достижения</h2>
            </div>
            <div class="stats">
                <div class="stat-item">
                    <div class="stat-value">2008</div>
                    <div class="stat-label">Год основания</div>
                </div>
                <div class="stat-item">
                    <div class="stat-value">2024</div>
                    <div class="stat-label">Возобновление деятельности</div>
                </div>
                <div class="stat-item">
                    <div class="stat-value">3+</div>
                    <div class="stat-label">Активных проекта</div>
                </div>
                <div class="stat-item">
                    <div class="stat-value">1</div>
                    <div class="stat-label">Зарегистрированное ПО</div>
                </div>
            </div>
        </div>
    </section>

    <!-- Преимущества -->
    <section id="advantages" class="fullscreen-section" data-label="Преимущества">
        <div class="container">
            <div class="section-title">
                <h2>Почему выбирают нас</h2>
            </div>
            <div class="grid grid-4">
                <div class="card">
                    <svg class="card-icon" aria-hidden="true">
                        <use href="#icon-shield"></use>
                    </svg>
                    <h4>Полный цикл в России</h4>
                    <p>Разработка и производство полностью локализованы в России</p>
                </div>
                <div class="card">
                    <svg class="card-icon" aria-hidden="true">
                        <use href="#icon-users"></use>
                    </svg>
                    <h4>Опыт команды</h4>
                    <p>Сертифицированные специалисты с подтвержденной квалификацией</p>
                </div>
                <div class="card">
                    <svg class="card-icon" aria-hidden="true">
                        <use href="#icon-rocket"></use>
                    </svg>
                    <h4>Собственные продукты</h4>
                    <p>Разработка инновационных решений и их коммерциализация</p>
                </div>
                <div class="card">
                    <svg class="card-icon" aria-hidden="true">
                        <use href="#icon-zap"></use>
                    </svg>
                    <h4>Инновации</h4>
                    <p>Использование передовых технологий: IoT, AI, облачные платформы</p>
                </div>
            </div>
        </div>
    </section>

    <!-- Контакты -->
    <section id="contacts" class="fullscreen-section" data-label="Контакты">
        <div class="container">
            <div class="section-title">
                <h2>Связаться с нами</h2>
            </div>
            <div class="grid grid-2">
                <div class="card">
                    <h3>Контактная информация</h3>
                    <p><strong>Адрес:</strong> 119285, город Москва, ул. Пырьева, д. 11-а, помещ. 4н</p>
                    <p><strong>Телефон:</strong> <a href="tel:+7 (495) 128-88-61">+7 (495) 128-88-61</a></p>
                    <p><strong>Email:</strong> <a href="mailto:info@it-caffe.ru">info@it-caffe.ru</a></p>
                </div>
                <div class="card">
                    <h3>Свяжитесь с нами</h3>
                    <form class="contact-form">
                        <div class="form-group">
                            <label class="form-label">Имя</label>
                            <input type="text" class="form-input" required>
                        </div>
                        <div class="form-group">
                            <label class="form-label">Email</label>
                            <input type="email" class="form-input" required>
                        </div>
                        <div class="form-group">
                            <label class="form-label">Сообщение</label>
                            <textarea class="form-textarea" required></textarea>
                        </div>
                        <button type="submit" class="btn btn-primary">Отправить</button>
                    </form>
                </div>
            </div>
        </div>
    </section>
</div>

    <footer class="footer">
        <div class="container">
            <div class="footer-content">
                <div class="footer-section">
                    <h3>АЙТИ-КАФФЕ</h3>
                    <p>Российский разработчик программного обеспечения</p>
                    <p style="margin-top: 1rem; font-size: 0.875rem; color: var(--text-tertiary);">
                        ООО «АЙТИ-КАФФЕ»<br>
                        ИНН: 9729390700<br>
                        ОГРН: 1247700784737                    </p>
                </div>
                
                <div class="footer-section">
                    <h3>Услуги</h3>
                    <a href="/services.php">Разработка ПО</a>
                    <a href="/services.php">IoT-разработка</a>
                    <a href="/services.php">Веб-разработка</a>
                    <a href="/services.php">Техническая поддержка</a>
                </div>
                
                <div class="footer-section">
                    <h3>Продукты</h3>
                    <a href="/products.php#pauchplus">PauchPlus</a>
                    <a href="/products.php#ifreelancer">iFreeLancer.Pro</a>
                    <a href="/products.php#csv-converter">Конвертер CSV в JSON</a>
                </div>
                
                <div class="footer-section">
                    <h3>Контакты</h3>
                    <p style="color: var(--text-secondary); margin-bottom: 0.5rem;">
                        <strong>Адрес:</strong><br>
                        119285, город Москва, ул. Пырьева, д. 11-а, помещ. 4н                    </p>
                    <p style="color: var(--text-secondary); margin-bottom: 0.5rem;">
                        <strong>Телефон:</strong><br>
                        <a href="tel:+74951288861" style="color: var(--color-primary);">+7 (495) 128-88-61</a>
                    </p>
                    <p style="color: var(--text-secondary);">
                        <strong>Email:</strong><br>
                        <a href="mailto:info@it-caffe.ru" style="color: var(--color-primary);">info@it-caffe.ru</a>
                    </p>
                </div>
            </div>
            
            <div class="footer-bottom">
                <div style="margin-bottom: 1rem;">
                    <div style="display: flex; flex-wrap: wrap; gap: 1.5rem; justify-content: center; font-size: 0.875rem;">
                        <a href="/privacy.php" style="color: var(--text-tertiary); text-decoration: none; transition: color var(--transition-base);">
                            Политика конфиденциальности                        </a>
                        <a href="/terms.php" style="color: var(--text-tertiary); text-decoration: none; transition: color var(--transition-base);">
                            Пользовательское соглашение                        </a>
                        <a href="/offer.php" style="color: var(--text-tertiary); text-decoration: none; transition: color var(--transition-base);">
                            Публичная оферта                        </a>
                        <a href="/cookies.php" style="color: var(--text-tertiary); text-decoration: none; transition: color var(--transition-base);">
                            Политика использования cookies                        </a>
                    </div>
                </div>
                <p style="text-align: center;">&copy; 2025 ООО «АЙТИ-КАФФЕ». Все права защищены.</p>
            </div>
        </div>
    </footer>
    
    <script src="/assets/js/fullscreen.js"></script>
    <script src="/assets/js/cookies.js"></script>
</body>
</html>

