245 lines
11 KiB
HTML
245 lines
11 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="ru" data-theme="light">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width,initial-scale=1">
|
||
<title>Tory — ИИ-ассистент для закупок</title>
|
||
<link rel="stylesheet" href="design-system/kt-ai-fonts.css">
|
||
<link rel="stylesheet" href="design-system/kt-ai-tokens.css">
|
||
<link rel="stylesheet" href="design-system/kt-ai-components.css">
|
||
<link rel="stylesheet" href="design-system/kt-ai-page.css">
|
||
<link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='.9em' font-size='90'>🤖</text></svg>">
|
||
<style>
|
||
a.kt-ai-btn { text-decoration: none; }
|
||
.hero-image {
|
||
width: 100%;
|
||
max-width: 900px;
|
||
margin: var(--kt-ai-space-10) auto 0;
|
||
border-radius: var(--kt-ai-radius-3xl);
|
||
box-shadow: 0 20px 60px rgba(0,0,0,0.15);
|
||
}
|
||
.metric-card {
|
||
text-align: center;
|
||
padding: var(--kt-ai-space-6);
|
||
background: var(--kt-ai-bg-soft);
|
||
border-radius: var(--kt-ai-radius-xl);
|
||
}
|
||
.metric-value {
|
||
font-size: var(--kt-ai-text-4xl);
|
||
font-weight: var(--kt-ai-weight-bold);
|
||
color: var(--kt-ai-primary);
|
||
line-height: 1.2;
|
||
}
|
||
.metric-label {
|
||
font-size: var(--kt-ai-text-sm);
|
||
color: var(--kt-ai-fg-muted);
|
||
margin-top: var(--kt-ai-space-2);
|
||
}
|
||
.reveal {
|
||
opacity: 0;
|
||
transform: translateY(24px);
|
||
transition: opacity 0.6s ease, transform 0.6s ease;
|
||
}
|
||
.reveal.in {
|
||
opacity: 1;
|
||
transform: none;
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
|
||
<header class="kt-ai-pagehead">
|
||
<div class="kt-ai-wrap kt-ai-pagehead-in">
|
||
<div style="display:flex;align-items:center;gap:var(--kt-ai-space-3)">
|
||
<img src="https://code.vibe42.kz/tore/aitu/kt-logo.svg" alt="Казахтелеком" height="28">
|
||
<strong>Tory</strong>
|
||
</div>
|
||
<span class="kt-ai-spacer"></span>
|
||
<button class="kt-ai-btn" data-variant="ghost" id="themeToggle" title="Переключить тему">
|
||
<svg class="kt-icon" style="width:18px;height:18px"><use href="#sun"/></svg>
|
||
</button>
|
||
<a class="kt-ai-btn" data-variant="primary" href="#demo">Попробовать</a>
|
||
</div>
|
||
</header>
|
||
|
||
<section class="kt-ai-hero" data-align="center">
|
||
<div class="kt-ai-wrap">
|
||
<h1 class="reveal">Tory — ИИ-ассистент для закупок</h1>
|
||
<p class="kt-ai-hero-sub reveal" style="max-width:680px;margin:0 auto">
|
||
Автоматическая проверка договоров, выявление рисков и несоответствий в закупочной документации.
|
||
Экономит часы рутинной работы и снижает вероятность ошибок.
|
||
</p>
|
||
<div class="kt-ai-hero-actions reveal">
|
||
<a class="kt-ai-btn" data-variant="primary" data-size="lg" href="#demo">Попробовать демо</a>
|
||
<a class="kt-ai-btn" data-size="lg" href="#features">Узнать больше</a>
|
||
</div>
|
||
<img class="hero-image reveal" src="https://picsum.photos/seed/tory-ai/900/500" alt="Интерфейс Tory">
|
||
</div>
|
||
</section>
|
||
|
||
<section id="features" class="kt-ai-section" data-divider="true">
|
||
<div class="kt-ai-wrap">
|
||
<div class="kt-ai-section-head">
|
||
<h2>Возможности Tory</h2>
|
||
<p>Три ключевых преимущества, которые меняют работу с закупками</p>
|
||
</div>
|
||
<div class="kt-ai-grid" style="margin-top:var(--kt-ai-space-9)">
|
||
<article class="kt-ai-tile reveal">
|
||
<div class="kt-ai-tile-icon">
|
||
<svg class="kt-icon"><use href="#scan-search"/></svg>
|
||
</div>
|
||
<h3>Автоматическая проверка</h3>
|
||
<p>ИИ анализирует договоры за секунды, находя несоответствия и риски, которые человек может пропустить.</p>
|
||
</article>
|
||
<article class="kt-ai-tile reveal">
|
||
<div class="kt-ai-tile-icon">
|
||
<svg class="kt-icon"><use href="#circle-alert"/></svg>
|
||
</div>
|
||
<h3>Оценка рисков</h3>
|
||
<p>Система присваивает каждому документу уровень риска и объясняет, какие пункты требуют внимания.</p>
|
||
</article>
|
||
<article class="kt-ai-tile reveal">
|
||
<div class="kt-ai-tile-icon">
|
||
<svg class="kt-icon"><use href="#clock"/></svg>
|
||
</div>
|
||
<h3>Экономия времени</h3>
|
||
<p>Сокращает время проверки документов с часов до минут, освобождая специалистов для важных задач.</p>
|
||
</article>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="kt-ai-section" data-divider="true">
|
||
<div class="kt-ai-wrap">
|
||
<div class="kt-ai-section-head">
|
||
<h2>Результаты внедрения</h2>
|
||
<p>Цифры, которые говорят сами за себя</p>
|
||
</div>
|
||
<div class="kt-ai-grid" data-cols="3" style="margin-top:var(--kt-ai-space-9)">
|
||
<div class="metric-card reveal">
|
||
<div class="metric-value">85%</div>
|
||
<div class="metric-label">документов проверяется без участия человека</div>
|
||
</div>
|
||
<div class="metric-card reveal">
|
||
<div class="metric-value">40 мин</div>
|
||
<div class="metric-label">среднее время проверки одного договора</div>
|
||
</div>
|
||
<div class="metric-card reveal">
|
||
<div class="metric-value">300+</div>
|
||
<div class="metric-label">договоров обрабатывается в месяц</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="demo" class="kt-ai-section" data-divider="true">
|
||
<div class="kt-ai-wrap" data-width="narrow">
|
||
<div class="kt-ai-section-head">
|
||
<h2>Попробовать демо</h2>
|
||
<p>Оставьте заявку — мы покажем, как Tory работает на ваших документах</p>
|
||
</div>
|
||
<form id="demoForm" class="kt-ai-v" data-gap="block" style="max-width:480px;margin:var(--kt-ai-space-8) auto 0">
|
||
<div class="kt-ai-field">
|
||
<label>Ваше имя</label>
|
||
<input class="kt-ai-input" name="name" placeholder="Иван Петров" required>
|
||
</div>
|
||
<div class="kt-ai-field">
|
||
<label>Email</label>
|
||
<input class="kt-ai-input" name="email" type="email" placeholder="ivan@company.kz" required>
|
||
</div>
|
||
<div class="kt-ai-field">
|
||
<label>Компания</label>
|
||
<input class="kt-ai-input" name="company" placeholder="ТОО «Пример»">
|
||
</div>
|
||
<button class="kt-ai-btn" data-variant="primary" data-size="lg" type="submit" style="margin-top:var(--kt-ai-space-4)">
|
||
Отправить заявку
|
||
</button>
|
||
<div id="formMessage" class="kt-ai-chip" data-variant="ok" style="display:none;margin-top:var(--kt-ai-space-4)">
|
||
Заявка отправлена! Мы свяжемся с вами в течение рабочего дня.
|
||
</div>
|
||
</form>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="kt-ai-cta">
|
||
<div class="kt-ai-wrap" data-width="narrow">
|
||
<h2 style="text-align:center">Готовы оптимизировать закупки?</h2>
|
||
<p style="text-align:center;max-width:540px;margin:var(--kt-ai-space-4) auto">
|
||
Подключите Tory и начните экономить время на проверке документов уже на следующей неделе.
|
||
</p>
|
||
<div style="text-align:center;margin-top:var(--kt-ai-space-6)">
|
||
<a class="kt-ai-btn" data-variant="primary" data-size="lg" href="#demo">Оставить заявку</a>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<footer class="kt-ai-wrap kt-ai-pagefoot">
|
||
<span>© 2026 Tory — ИИ для закупок</span>
|
||
<span class="kt-ai-spacer"></span>
|
||
<span style="color:var(--kt-ai-fg-muted)">Казахтелеком</span>
|
||
</footer>
|
||
|
||
<script>
|
||
// Переключение темы
|
||
var html = document.documentElement;
|
||
var themeBtn = document.getElementById('themeToggle');
|
||
var savedTheme = localStorage.getItem('tory-theme') || 'light';
|
||
html.setAttribute('data-theme', savedTheme);
|
||
updateThemeIcon(savedTheme);
|
||
|
||
themeBtn.addEventListener('click', function() {
|
||
var current = html.getAttribute('data-theme');
|
||
var next = current === 'dark' ? 'light' : 'dark';
|
||
html.setAttribute('data-theme', next);
|
||
localStorage.setItem('tory-theme', next);
|
||
updateThemeIcon(next);
|
||
});
|
||
|
||
function updateThemeIcon(theme) {
|
||
var icon = themeBtn.querySelector('svg use');
|
||
icon.setAttribute('href', theme === 'dark' ? '#moon' : '#sun');
|
||
}
|
||
|
||
// Анимация появления при скролле
|
||
var io = new IntersectionObserver(function(entries) {
|
||
entries.forEach(function(entry) {
|
||
if (entry.isIntersecting) entry.target.classList.add('in');
|
||
});
|
||
}, { threshold: 0.1 });
|
||
|
||
document.querySelectorAll('.reveal').forEach(function(el) {
|
||
io.observe(el);
|
||
});
|
||
|
||
// Обработка формы (имитация)
|
||
document.getElementById('demoForm').addEventListener('submit', function(e) {
|
||
e.preventDefault();
|
||
var formData = new FormData(this);
|
||
var data = {
|
||
name: formData.get('name'),
|
||
email: formData.get('email'),
|
||
company: formData.get('company'),
|
||
date: new Date().toISOString()
|
||
};
|
||
|
||
// Сохраняем в localStorage
|
||
var submissions = JSON.parse(localStorage.getItem('tory-leads') || '[]');
|
||
submissions.push(data);
|
||
localStorage.setItem('tory-leads', JSON.stringify(submissions));
|
||
|
||
// Показываем сообщение
|
||
this.reset();
|
||
var msg = document.getElementById('formMessage');
|
||
msg.style.display = 'block';
|
||
setTimeout(function() { msg.style.display = 'none'; }, 5000);
|
||
});
|
||
|
||
// Спрайт иконок (инлайн, чтобы работало без внешних запросов)
|
||
var sprite = document.createElement('div');
|
||
sprite.innerHTML = '<svg style="display:none"><symbol id="sun" viewBox="0 0 24 24"><circle cx="12" cy="12" r="4"/><path d="M12 2v2m0 16v2m10-10h-2M4 12H2m15.364 6.364-1.414-1.414M6.343 6.343 4.929 4.929m12.728 0-1.414 1.414M6.343 17.657l-1.414 1.414"/></symbol><symbol id="moon" viewBox="0 0 24 24"><path d="M21 12.79A9 9 0 1 1 11.21 3a7 7 0 0 0 9.79 9.79z"/></symbol><symbol id="scan-search" viewBox="0 0 24 24"><path d="M3 7V5a2 2 0 0 1 2-2h2m10 0h2a2 2 0 0 1 2 2v2m0 10v2a2 2 0 0 1-2 2h-2M5 17v2a2 2 0 0 0 2 2h2"/><circle cx="12" cy="12" r="3"/><path d="m16 16 4 4"/></symbol><symbol id="circle-alert" viewBox="0 0 24 24"><circle cx="12" cy="12" r="10"/><path d="M12 8v4m0 4h.01"/></symbol><symbol id="clock" viewBox="0 0 24 24"><circle cx="12" cy="12" r="10"/><path d="M12 6v6l4 2"/></symbol></svg>';
|
||
document.body.appendChild(sprite);
|
||
</script>
|
||
|
||
</body>
|
||
</html>
|