201 lines
9.8 KiB
HTML
201 lines
9.8 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="ru" data-theme="auto">
|
||
<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="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; }
|
||
.reveal{opacity:0;transform:translateY(20px);transition:opacity .6s ease,transform .6s ease}
|
||
.reveal.in{opacity:1;transform:none}
|
||
.price-card { text-align: center; padding: var(--kt-ai-space-6); }
|
||
.price-card .price { font-size: var(--kt-ai-text-3xl); font-weight: var(--kt-ai-weight-bold); color: var(--kt-ai-primary); margin: var(--kt-ai-space-4) 0; }
|
||
.hero-bg {
|
||
background: linear-gradient(135deg, var(--kt-ai-bg-soft) 0%, var(--kt-ai-bg) 100%);
|
||
}
|
||
</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="#prices">Цены</a>
|
||
<a class="kt-ai-btn" data-variant="primary" href="#contacts">Оставить заявку</a>
|
||
</div>
|
||
</header>
|
||
|
||
<section class="kt-ai-hero hero-bg" data-align="center">
|
||
<div class="kt-ai-wrap">
|
||
<h1>Ремонт клиентского оборудования любой сложности</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="#contacts">Оставить заявку</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)">
|
||
<article class="kt-ai-tile reveal">
|
||
<div class="kt-ai-tile-icon">💻</div>
|
||
<h3>Компьютеры и ноутбуки</h3>
|
||
<p>Диагностика, ремонт материнских плат, замена комплектующих, чистка от пыли, установка ПО</p>
|
||
</article>
|
||
<article class="kt-ai-tile reveal">
|
||
<div class="kt-ai-tile-icon">🖨️</div>
|
||
<h3>Принтеры и МФУ</h3>
|
||
<p>Ремонт печатающей техники, заправка картриджей, замена роликов и термоблоков</p>
|
||
</article>
|
||
<article class="kt-ai-tile reveal">
|
||
<div class="kt-ai-tile-icon">📱</div>
|
||
<h3>Планшеты и смартфоны</h3>
|
||
<p>Замена экранов, аккумуляторов, разъёмов, восстановление после попадания жидкости</p>
|
||
</article>
|
||
<article class="kt-ai-tile reveal">
|
||
<div class="kt-ai-tile-icon">🖥️</div>
|
||
<h3>Мониторы и ТВ</h3>
|
||
<p>Ремонт блоков питания, инверторов, замена матриц и ламп подсветки</p>
|
||
</article>
|
||
<article class="kt-ai-tile reveal">
|
||
<div class="kt-ai-tile-icon">🌐</div>
|
||
<h3>Сетевое оборудование</h3>
|
||
<p>Настройка и ремонт роутеров, коммутаторов, точек доступа Wi-Fi</p>
|
||
</article>
|
||
<article class="kt-ai-tile reveal">
|
||
<div class="kt-ai-tile-icon">⚙️</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" style="margin-top:var(--kt-ai-space-9)">
|
||
<article class="kt-ai-tile reveal">
|
||
<div class="kt-ai-tile-icon">⏱️</div>
|
||
<h3>Быстрая диагностика</h3>
|
||
<p>Бесплатная диагностика в день обращения. Точное определение неисправности</p>
|
||
</article>
|
||
<article class="kt-ai-tile reveal">
|
||
<div class="kt-ai-tile-icon">🛡️</div>
|
||
<h3>Гарантия до 12 месяцев</h3>
|
||
<p>Гарантия на все виды работ и установленные комплектующие</p>
|
||
</article>
|
||
<article class="kt-ai-tile reveal">
|
||
<div class="kt-ai-tile-icon">💰</div>
|
||
<h3>Честные цены</h3>
|
||
<p>Фиксированная стоимость после диагностики. Никаких скрытых платежей</p>
|
||
</article>
|
||
<article class="kt-ai-tile reveal">
|
||
<div class="kt-ai-tile-icon">👨🔧</div>
|
||
<h3>Опытные мастера</h3>
|
||
<p>Специалисты со стажем от 5 лет. Регулярное повышение квалификации</p>
|
||
</article>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="prices" 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 price-card reveal">
|
||
<h3>Диагностика</h3>
|
||
<div class="price">Бесплатно</div>
|
||
<p>При продолжении работ</p>
|
||
</article>
|
||
<article class="kt-ai-tile price-card reveal">
|
||
<h3>Чистка от пыли</h3>
|
||
<div class="price">от 5 000 ₸</div>
|
||
<p>Ноутбуки и ПК</p>
|
||
</article>
|
||
<article class="kt-ai-tile price-card reveal">
|
||
<h3>Установка ПО</h3>
|
||
<div class="price">от 3 000 ₸</div>
|
||
<p>Windows, драйверы, офис</p>
|
||
</article>
|
||
<article class="kt-ai-tile price-card reveal">
|
||
<h3>Замена экрана</h3>
|
||
<div class="price">от 8 000 ₸</div>
|
||
<p>Смартфоны, планшеты</p>
|
||
</article>
|
||
<article class="kt-ai-tile price-card reveal">
|
||
<h3>Ремонт принтера</h3>
|
||
<div class="price">от 6 000 ₸</div>
|
||
<p>Лазерные и струйные</p>
|
||
</article>
|
||
<article class="kt-ai-tile price-card reveal">
|
||
<h3>Настройка роутера</h3>
|
||
<div class="price">от 4 000 ₸</div>
|
||
<p>Установка и конфигурация</p>
|
||
</article>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="contacts" class="kt-ai-cta">
|
||
<div class="kt-ai-wrap">
|
||
<h2>Оставьте заявку на ремонт</h2>
|
||
<p>Свяжитесь с нами любым удобным способом — мы ответим в течение 15 минут</p>
|
||
<div style="display:flex;gap:var(--kt-ai-space-4);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:+77771234567">📞 +7 (777) 123-45-67</a>
|
||
<a class="kt-ai-btn" data-size="lg" href="https://wa.me/77771234567?text=Здравствуйте! Хочу оставить заявку на ремонт">💬 WhatsApp</a>
|
||
</div>
|
||
<form action="https://formsubmit.co/repair@example.com" method="POST" style="max-width:420px;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>Телефон</label>
|
||
<input class="kt-ai-input" name="phone" placeholder="+7 (___) ___-__-__" required>
|
||
</div>
|
||
<div class="kt-ai-field">
|
||
<label>Описание проблемы</label>
|
||
<textarea class="kt-ai-textarea" name="message" placeholder="Что сломалось?" rows="3"></textarea>
|
||
</div>
|
||
<button class="kt-ai-btn" data-variant="primary" type="submit" style="width:100%">Отправить заявку</button>
|
||
</form>
|
||
</div>
|
||
</section>
|
||
|
||
<footer class="kt-ai-wrap kt-ai-pagefoot">
|
||
<span>© 2026 РемонтОборудования</span>
|
||
<span class="kt-ai-spacer"></span>
|
||
<span>📍 г. Алматы, ул. Примерная, 123</span>
|
||
<span>🕒 Пн-Пт: 9:00-18:00</span>
|
||
</footer>
|
||
|
||
<script>
|
||
var io=new IntersectionObserver(function(entries){
|
||
entries.forEach(function(e){ if(e.isIntersecting) e.target.classList.add('in'); });
|
||
},{threshold:.15});
|
||
document.querySelectorAll('.reveal').forEach(function(el){ io.observe(el); });
|
||
</script>
|
||
|
||
</body>
|
||
</html>
|