130 lines
6.7 KiB
HTML
130 lines
6.7 KiB
HTML
<!DOCTYPE html>
|
||
<!-- Дизайн: Стандартный дизайн. Сохраняй все пять CSS; подробности в design.md. -->
|
||
<html lang="ru" data-theme="light">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width,initial-scale=1">
|
||
<title>Контакт-центр — связь без границ</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="stylesheet" href="design-system/vibe-theme.css">
|
||
<script src="design-system/icons/kt-ai-icons.js"></script>
|
||
<style>
|
||
/* ДС рисует кнопки для <button>; у ссылки-кнопки браузер добавляет подчёркивание */
|
||
a.kt-ai-btn { text-decoration: none; }
|
||
.stat-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--kt-ai-space-6); margin-top: var(--kt-ai-space-9); }
|
||
.stat { text-align: center; padding: var(--kt-ai-space-6); background: var(--kt-ai-surface); border: 1px solid var(--kt-ai-border); border-radius: 10px; }
|
||
.stat-num { font-size: 40px; font-weight: 400; letter-spacing: -1px; color: var(--kt-ai-text); }
|
||
.stat-label { font-size: 13px; color: var(--kt-ai-text-secondary); }
|
||
@media (max-width: 720px) { .stat-grid { grid-template-columns: 1fr; } }
|
||
</style>
|
||
</head>
|
||
<body>
|
||
|
||
<header class="kt-ai-pagehead">
|
||
<div class="kt-ai-wrap kt-ai-pagehead-in">
|
||
<strong>Контакт-центр</strong>
|
||
<span class="kt-ai-spacer"></span>
|
||
<a class="kt-ai-btn" data-variant="ghost" href="#services">Услуги</a>
|
||
<a class="kt-ai-btn" data-variant="ghost" href="#stats">Цифры</a>
|
||
<a class="kt-ai-btn" data-variant="primary" href="#contacts">Связаться</a>
|
||
</div>
|
||
</header>
|
||
|
||
<section class="kt-ai-hero" data-align="center">
|
||
<div class="kt-ai-wrap">
|
||
<h1>Обслуживание клиентов <span class="vibe-highlight">24/7</span> на высшем уровне</h1>
|
||
<p class="kt-ai-hero-sub">Многоканальная поддержка по телефону, в мессенджерах и чатах. Быстро, вежливо, по-русски, казахски и по-английски.</p>
|
||
<div class="kt-ai-hero-actions">
|
||
<a class="kt-ai-btn" data-variant="primary" data-size="lg" href="tel:+77000000000">Позвонить</a>
|
||
<a class="kt-ai-btn" data-size="lg" href="#services">Наши услуги</a>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="services" 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" style="margin-top:var(--kt-ai-space-9)" data-cols="3">
|
||
<article class="kt-ai-tile">
|
||
<div class="kt-ai-tile-icon"><svg><use href="#megaphone"></use></svg></div>
|
||
<h3>Приём звонков</h3>
|
||
<p>Операторы на линии 24/7, среднее время ожидания менее 30 секунд, вежливый скрипт разговора.</p>
|
||
</article>
|
||
<article class="kt-ai-tile">
|
||
<div class="kt-ai-tile-icon"><svg><use href="#chat"></use></div>
|
||
<h3>Чаты и мессенджеры</h3>
|
||
<p>Поддержка в WhatsApp, Telegram, Viber и на сайте. Одни и те же операторы, единая история переписки.</p>
|
||
</article>
|
||
<article class="kt-ai-tile">
|
||
<div class="kt-ai-tile-icon"><svg><use href="#mail"></use></div>
|
||
<h3>Работа с письмами</h3>
|
||
<p>Обрабатываем входящую корреспонденцию, отвечаем на email в течение 2 часов, ведём базу обращений.</p>
|
||
</article>
|
||
<article class="kt-ai-tile">
|
||
<div class="kt-ai-tile-icon"><svg><use href="#chart"></use></div>
|
||
<h3>Аналитика и отчёты</h3>
|
||
<p>Отчёты по звонкам, чатам и обращениям. Метрики качества разговоров, NPS, время решения.</p>
|
||
</article>
|
||
<article class="kt-ai-tile">
|
||
<div class="kt-ai-tile-icon"><svg><use href="#users"></use></div>
|
||
<h3>Обучение операторов</h3>
|
||
<p>Настраиваем скрипты, обучаем ваших менеджеров, внедряем CRM и телефонную систему.</p>
|
||
</article>
|
||
<article class="kt-ai-tile">
|
||
<div class="kt-ai-tile-icon"><svg><use href="#clock"></use></div>
|
||
<h3>Гибкие форматы</h3>
|
||
<p>Можно нанять отдельное направление, взять всё на себя полностью или добавить нас как вторую линию.</p>
|
||
</article>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="stats" 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="stat-grid">
|
||
<div class="stat">
|
||
<div class="stat-num">24/7</div>
|
||
<div class="stat-label">работаем круглосуточно</div>
|
||
</div>
|
||
<div class="stat">
|
||
<div class="stat-num">98%</div>
|
||
<div class="stat-label">клиентов довольны</div>
|
||
</div>
|
||
<div class="stat">
|
||
<div class="stat-num"><30 сек</div>
|
||
<div class="stat-label">среднее время ожидания</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="contacts" class="kt-ai-cta">
|
||
<div class="kt-ai-wrap">
|
||
<h2>Свяжитесь с нами</h2>
|
||
<p>Отдел продаж работает с 9:00 до 18:00 в будни. Звоните или напишите — ответим в течение 15 минут.</p>
|
||
<div style="display:flex; gap:12px; flex-wrap:wrap; justify-content:center; margin-top:var(--kt-ai-space-6)">
|
||
<a class="kt-ai-btn" data-variant="primary" data-size="lg" href="tel:+77000000000">Позвонить</a>
|
||
<a class="kt-ai-btn" data-size="lg" href="mailto:info@example.kz">Написать</a>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<footer class="kt-ai-wrap kt-ai-pagefoot">
|
||
<span>© 2026 Контакт-центр</span>
|
||
<span class="kt-ai-spacer"></span>
|
||
<a class="kt-ai-link" href="tel:+77000000000">+7 (700) 000-00-00</a>
|
||
</footer>
|
||
|
||
</body>
|
||
</html>
|