sdelay-sayt-prodazhi-tv-pust/index.html
2026-09-25 09:54:31 +00:00

427 lines
23 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<!-- no-design-system -->
<!-- Дизайн: Стандартный дизайн. Сохраняй все пять 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>TeleMag — продажа телевизоров</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 type="module" src="design-system/icons/kt-ai-icons.js"></script>
<style>
a.kt-ai-btn { text-decoration: none; }
.tv-cta {
border-radius: var(--kt-ai-radius-lg, 14px);
padding: var(--kt-ai-space-6) var(--kt-ai-space-7);
}
.tv-cta-title { font-size: 34px; font-weight: 400; letter-spacing: -0.02em; }
.tv-cta-title mark {
background: var(--vibe-accent-soft, var(--kt-ai-primary));
color: var(--vibe-ink, var(--kt-ai-ink));
padding: 0 10px;
border-radius: 8px;
}
.tv-cta-sub { color: var(--vibe-muted, var(--kt-ai-ink-2)); font-size: 16px; margin-top: var(--kt-ai-space-3); }
.tv-cta-row { display: flex; gap: var(--kt-ai-space-3); flex-wrap: wrap; margin-top: var(--kt-ai-space-5); }
.tv-cta-badges { display: flex; gap: var(--kt-ai-space-2); flex-wrap: wrap; margin-top: var(--kt-ai-space-5); }
.tv-cta-badges .kt-ai-chip { background: var(--vibe-accent-soft, var(--kt-ai-primary)); color: var(--vibe-ink, var(--kt-ai-ink)); }
/* Витрина */
.tv-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--kt-ai-space-4); }
@media (max-width: 980px) { .tv-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .tv-grid { grid-template-columns: 1fr; } }
.tv-card { display: flex; flex-direction: column; overflow: hidden; }
.tv-visual { position: relative; background: var(--kt-ai-surface-2, var(--kt-ai-line)); border-bottom: 1px solid var(--vibe-line, var(--kt-ai-line)); }
.tv-visual .tv-screen {
position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
background: var(--kt-ai-primary);
border-radius: 6px;
box-shadow: 0 12px 24px rgba(59, 166, 241, 0.25);
}
.tv-visual.tv-32 .tv-screen { width: 42%; aspect-ratio: 4 / 3; }
.tv-visual.tv-43 .tv-screen { width: 58%; aspect-ratio: 16 / 9; }
.tv-visual.tv-50 .tv-screen { width: 72%; aspect-ratio: 16 / 9; }
.tv-visual.tv-55 .tv-screen { width: 84%; aspect-ratio: 16 / 9; }
.tv-visual.tv-65 .tv-screen { width: 94%; aspect-ratio: 16 / 9; }
.tv-visual.tv-75 .tv-screen { width: 100%; aspect-ratio: 16 / 9; box-shadow: 0 16px 34px rgba(59, 166, 241, 0.3); }
.tv-tag {
position: absolute; top: var(--kt-ai-space-3); right: var(--kt-ai-space-3);
background: var(--kt-ai-primary); color: var(--vibe-ink, var(--kt-ai-ink));
font-size: 12px; font-weight: 600; padding: 3px 10px; border-radius: 999px;
}
.tv-tag-soft { background: var(--vibe-accent-soft, var(--kt-ai-primary)); }
.tv-body { padding: var(--kt-ai-space-5); display: flex; flex-direction: column; gap: var(--kt-ai-space-3); flex: 1; }
.tv-spec {
display: grid; grid-template-columns: 1fr 1fr; gap: var(--kt-ai-space-2) var(--kt-ai-space-3);
font-size: 13px; color: var(--vibe-muted, var(--kt-ai-ink-2));
}
.tv-spec b { display: block; font-size: 14px; color: var(--vibe-ink, var(--kt-ai-ink)); font-weight: 600; }
.tv-diag {
position: absolute; left: 50%; bottom: -11px; transform: translateX(-50%);
background: var(--vibe-ink, var(--kt-ai-ink)); color: var(--kt-ai-surface, #fff);
font-size: 11px;
padding: 2px 10px; border-radius: 999px; white-space: nowrap;
}
.tv-foot { margin-top: auto; display: flex; align-items: center; justify-content: space-between; gap: var(--kt-ai-space-2); }
.tv-price { font-size: 22px; font-weight: 700; letter-spacing: -0.01em; }
.tv-old { font-size: 13px; color: var(--vibe-muted, var(--kt-ai-ink-2)); text-decoration: line-through; margin-left: 6px; }
/* Таблица габаритов */
.dim-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.dim-table th, .dim-table td { border-bottom: 1px solid var(--vibe-line, var(--kt-ai-line)); padding: 12px 14px; text-align: left; }
.dim-table th { font-weight: 600; color: var(--vibe-ink, var(--kt-ai-ink)); background: var(--kt-ai-surface-2, var(--kt-ai-bg-2)); }
.dim-table td { color: var(--vibe-muted, var(--kt-ai-ink-2)); }
.dim-table td:first-child { color: var(--vibe-ink, var(--kt-ai-ink)); font-weight: 600; }
.dim-scroll { overflow-x: auto; }
/* Льготы */
.tile-accent { background: var(--vibe-accent-soft, var(--kt-ai-primary)); border-color: transparent; }
/* Инструкция */
.steps { display: grid; gap: var(--kt-ai-space-4); margin-top: var(--kt-ai-space-6); }
.step { display: grid; grid-template-columns: 56px 1fr; gap: var(--kt-ai-space-4); align-items: start; }
.step-num {
width: 44px; height: 44px; border-radius: 999px;
background: var(--vibe-accent-soft, var(--kt-ai-primary)); color: var(--vibe-ink, var(--kt-ai-ink));
display: grid; place-items: center; font-weight: 700; font-size: 18px;
}
.step h3 { margin: 0; font-weight: 600; font-size: 16px; }
.step p { margin: 6px 0 0; color: var(--vibe-muted, var(--kt-ai-ink-2)); font-size: 14px; }
</style>
</head>
<body>
<header class="kt-ai-pagehead">
<div class="kt-ai-wrap kt-ai-pagehead-in">
<svg width="22" height="22" style="vertical-align:-4px;margin-right:8px" aria-hidden="true"><use href="#tv"/></svg><strong>TeleMag</strong>
<span class="kt-ai-spacer"></span>
<a class="kt-ai-btn" data-variant="ghost" href="#catalog">Каталог</a>
<a class="kt-ai-btn" data-variant="ghost" href="#delivery">Доставка</a>
<a class="kt-ai-btn" data-variant="ghost" href="#help">Льготы</a>
<a class="kt-ai-btn" data-variant="primary" href="#order">Заказать</a>
</div>
</header>
<section class="kt-ai-hero" data-align="center">
<div class="kt-ai-wrap">
<h1>Телевизоры, в которые <mark style="background:var(--vibe-accent-soft,var(--kt-ai-primary));padding:0 10px;border-radius:8px">хочется смотреть</mark></h1>
<p class="kt-ai-hero-sub">Новые Smart TV от 32" до 75" — в наличии, с установкой, гарантией 3 года и доставкой по всей стране. Честные цены и льготы для пенсионеров, учителей и многодетных семей.</p>
<div class="kt-ai-hero-actions">
<a class="kt-ai-btn" data-variant="primary" data-size="lg" href="#catalog">Смотреть каталог</a>
<a class="kt-ai-btn" data-size="lg" href="#dims">Все габариты</a>
</div>
</div>
</section>
<section id="catalog" class="kt-ai-section" data-divider="true">
<div class="kt-ai-wrap">
<div class="kt-ai-section-head">
<h2>Хиты этого сезона</h2>
<p>Шесть самых частых покупок — от компактной 32" для кухни до кинотеатра 75" в гостиную.</p>
</div>
<div class="tv-grid" style="margin-top:var(--kt-ai-space-7)">
<article class="kt-ai-card tv-card">
<div class="tv-visual tv-32">
<span class="tv-diag">32" · 78 × 47 см</span>
<div class="tv-screen"></div>
</div>
<div class="tv-body">
<div>
<h3 style="margin:0;font-size:16px;font-weight:600">Compact 32</h3>
<span class="kt-ai-chip tv-tag-soft" style="margin-top:8px;display:inline-block">HD · для кухни и спальни</span>
</div>
<div class="tv-spec">
<span>Диагональ<b>32"</b></span>
<span>Разрешение<b>HD 1366×768</b></span>
<span>Смарт<b>есть</b></span>
<span>Вес<b>3,4 кг</b></span>
</div>
<div class="tv-foot">
<span class="tv-price">189 000 ₸</span>
<a class="kt-ai-btn" data-variant="primary" data-size="sm" href="#order">В корзину</a>
</div>
</div>
</article>
<article class="kt-ai-card tv-card">
<div class="tv-visual tv-43">
<span class="tv-tag tv-tag-soft">Бестселлер</span>
<span class="tv-diag">43" · 97 × 57 см</span>
<div class="tv-screen"></div>
</div>
<div class="tv-body">
<div>
<h3 style="margin:0;font-size:16px;font-weight:600">Smart 43</h3>
<span class="kt-ai-chip tv-tag-soft" style="margin-top:8px;display:inline-block">FHD · самый популярный</span>
</div>
<div class="tv-spec">
<span>Диагональ<b>43"</b></span>
<span>Разрешение<b>FHD 1920×1080</b></span>
<span>Смарт<b>Android TV</b></span>
<span>Вес<b>5,8 кг</b></span>
</div>
<div class="tv-foot">
<span class="tv-price">329 000 ₸</span>
<a class="kt-ai-btn" data-variant="primary" data-size="sm" href="#order">В корзину</a>
</div>
</div>
</article>
<article class="kt-ai-card tv-card">
<div class="tv-visual tv-50">
<span class="tv-diag">50" · 112 × 66 см</span>
<div class="tv-screen"></div>
</div>
<div class="tv-body">
<div>
<h3 style="margin:0;font-size:16px;font-weight:600">Smart 50</h3>
<span class="kt-ai-chip tv-tag-soft" style="margin-top:8px;display:inline-block">FHD · золотая середина</span>
</div>
<div class="tv-spec">
<span>Диагональ<b>50"</b></span>
<span>Разрешение<b>FHD 1920×1080</b></span>
<span>Смарт<b>Android TV</b></span>
<span>Вес<b>7,6 кг</b></span>
</div>
<div class="tv-foot">
<span class="tv-price">419 000 ₸</span>
<a class="kt-ai-btn" data-variant="primary" data-size="sm" href="#order">В корзину</a>
</div>
</div>
</article>
<article class="kt-ai-card tv-card">
<div class="tv-visual tv-55">
<span class="tv-tag tv-tag-soft">Выбор покупателей</span>
<span class="tv-diag">55" · 123 × 72 см</span>
<div class="tv-screen"></div>
</div>
<div class="tv-body">
<div>
<h3 style="margin:0;font-size:16px;font-weight:600">Smart 55</h3>
<span class="kt-ai-chip tv-tag-soft" style="margin-top:8px;display:inline-block">4K UHD · для гостиной</span>
</div>
<div class="tv-spec">
<span>Диагональ<b>55"</b></span>
<span>Разрешение<b>4K 3840×2160</b></span>
<span>Смарт<b>Android TV</b></span>
<span>Вес<b>9,8 кг</b></span>
</div>
<div class="tv-foot">
<span class="tv-price">579 000 ₸</span>
<a class="kt-ai-btn" data-variant="primary" data-size="sm" href="#order">В корзину</a>
</div>
</div>
</article>
<article class="kt-ai-card tv-card">
<div class="tv-visual tv-65">
<span class="tv-diag">65" · 145 × 85 см</span>
<div class="tv-screen"></div>
</div>
<div class="tv-body">
<div>
<h3 style="margin:0;font-size:16px;font-weight:600">QLED 65</h3>
<span class="kt-ai-chip tv-tag-soft" style="margin-top:8px;display:inline-block">4K QLED · квантовые цвета</span>
</div>
<div class="tv-spec">
<span>Диагональ<b>65"</b></span>
<span>Разрешение<b>4K 3840×2160</b></span>
<span>Смарт<b>Android TV</b></span>
<span>Вес<b>13,2 кг</b></span>
</div>
<div class="tv-foot">
<span class="tv-price">849 000 ₸</span>
<a class="kt-ai-btn" data-variant="primary" data-size="sm" href="#order">В корзину</a>
</div>
</div>
</article>
<article class="kt-ai-card tv-card">
<div class="tv-visual tv-75">
<span class="tv-tag tv-tag-soft">Кинотеатр дома</span>
<span class="tv-diag">75" · 168 × 98 см</span>
<div class="tv-screen"></div>
</div>
<div class="tv-body">
<div>
<h3 style="margin:0;font-size:16px;font-weight:600">QLED 75</h3>
<span class="kt-ai-chip tv-tag-soft" style="margin-top:8px;display:inline-block">4K QLED · максимальный формат</span>
</div>
<div class="tv-spec">
<span>Диагональ<b>75"</b></span>
<span>Разрешение<b>4K 3840×2160</b></span>
<span>Смарт<b>Android TV</b></span>
<span>Вес<b>17,5 кг</b></span>
</div>
<div class="tv-foot">
<span class="tv-price">1 299 000 ₸</span>
<a class="kt-ai-btn" data-variant="primary" data-size="sm" href="#order">В корзину</a>
</div>
</div>
</article>
</div>
</div>
</section>
<section id="delivery" 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="2" style="margin-top:var(--kt-ai-space-7)">
<article class="kt-ai-tile">
<div class="kt-ai-tile-icon"><svg width="28" height="28" aria-hidden="true"><use href="#truck"/></svg></div>
<h3>Астана и Алматы</h3>
<p>Доставка 1–2 дня, <b>бесплатно</b> при заказе от 500 000 ₸, иначе 3 000 ₸. Курьер поднимает телевизор на этаж и помогает установить на подставку.</p>
</article>
<article class="kt-ai-tile">
<div class="kt-ai-tile-icon"><svg width="28" height="28" aria-hidden="true"><use href="#pin"/></svg></div>
<h3>Областные центры</h3>
<p>Караганда, Шымкент, Актау, Семей, Костанай, Петропавловск — 2–4 дня, 5 000 ₸. Самовывоз со склада в Астане — бесплатно.</p>
</article>
<article class="kt-ai-tile">
<div class="kt-ai-tile-icon"><svg width="28" height="28" aria-hidden="true"><use href="#package"/></svg></div>
<h3>По всей стране</h3>
<p>Все города и райцентры — 3–6 дней, от 7 000 ₸ (зависит от расстояния). Телевизор всегда едет в оригинальной коробке с двумя слоями упаковочной пены.</p>
</article>
<article class="kt-ai-tile">
<div class="kt-ai-tile-icon"><svg width="28" height="28" aria-hidden="true"><use href="#tool"/></svg></div>
<h3>Установка</h3>
<p>Помощь с подключением — бесплатно при доставке. Вешание на кронштейн — 8 000–15 000 ₸ в зависимости от модели и стены. Мастер приезжает вместе с курьером.</p>
</article>
</div>
</div>
</section>
<section id="help" 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-7)">
<article class="kt-ai-tile tile-accent">
<div class="kt-ai-tile-icon"><svg width="28" height="28" aria-hidden="true"><use href="#users"/></svg></div>
<h3>Пенсионерам — 15%</h3>
<p>На все телевизоры от 43". Достаточно паспорта или пенсионного удостоверения. Скидка не суммируется с другими акциями, кроме «Студент».</p>
</article>
<article class="kt-ai-tile">
<div class="kt-ai-tile-icon"><svg width="28" height="28" aria-hidden="true"><use href="#book"/></svg></div>
<h3>Семьям с детьми — 10%</h3>
<p>Многодетным семей (3 и более детей) — 10% на любые модели, включая 75". Подтверждается справкой из ЖГС или свидетельствами о рождении.</p>
</article>
<article class="kt-ai-tile">
<div class="kt-ai-tile-icon"><svg width="28" height="28" aria-hidden="true"><use href="#trophy"/></svg></div>
<h3>Первым покупателям — 5%</h3>
<p>Промокод <b>TELMAG5</b> при первом заказе. Складывается с пенсионной льготой — получается до 20% на крупные модели.</p>
</article>
</div>
<p style="margin-top:var(--kt-ai-space-5);font-size:13px;color:var(--vibe-muted,var(--kt-ai-ink-2))">
Льготы не распространяются на аксессуары. Если вы соответствуете нескольким условиям — применяется максимальная сумма.
</p>
</div>
</section>
<section id="dims" 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="dim-scroll" style="margin-top:var(--kt-ai-space-6)">
<table class="dim-table">
<thead>
<tr>
<th>Модель</th>
<th>Экран (Ш×В)</th>
<th>С подставкой (Ш×В)</th>
<th>Без подставки</th>
<th>Глубина</th>
<th>Вес</th>
<th>Кронштейн</th>
</tr>
</thead>
<tbody>
<tr><td>Compact 32</td><td>78 × 47 см</td><td>78 × 51 см</td><td>78 × 48 см</td><td>5,2 см</td><td>3,4 / 5,1 кг</td><td>75×75</td></tr>
<tr><td>Smart 43</td><td>97 × 57 см</td><td>97 × 62 см</td><td>97 × 58 см</td><td>6,8 см</td><td>5,8 / 8,0 кг</td><td>200×200</td></tr>
<tr><td>Smart 50</td><td>112 × 66 см</td><td>112 × 71 см</td><td>112 × 68 см</td><td>7,1 см</td><td>7,6 / 10,2 кг</td><td>200×200</td></tr>
<tr><td>Smart 55</td><td>123 × 72 см</td><td>123 × 78 см</td><td>123 × 73 см</td><td>8,0 см</td><td>9,8 / 12,5 кг</td><td>300×300</td></tr>
<tr><td>QLED 65</td><td>145 × 85 см</td><td>145 × 91 см</td><td>145 × 86 см</td><td>8,9 см</td><td>13,2 / 16,8 кг</td><td>400×400</td></tr>
<tr><td>QLED 75</td><td>168 × 98 см</td><td>168 × 104 см</td><td>168 × 99 см</td><td>9,8 см</td><td>17,5 / 22,4 кг</td><td>400×400</td></tr>
</tbody>
</table>
</div>
<p style="margin-top:var(--kt-ai-space-4);font-size:13px;color:var(--vibe-muted,var(--kt-ai-ink-2))">
«С подставкой» — высота в собранном виде. «Без подставки» — размер для настенного кронштейна. Толщина кромки — 25–40 мм по всему периметру.
</p>
</div>
</section>
<section id="how" class="kt-ai-section" data-divider="true">
<div class="kt-ai-wrap" data-width="narrow">
<div class="kt-ai-section-head">
<h2>Как заказать — 4 простых шага</h2>
<p>Инструкция устроена по-простому: от первого клика до картинки на экране меньше 48 часов.</p>
</div>
<div class="steps">
<div class="step">
<span class="step-num">1</span>
<div>
<h3>Выберите модель в каталоге</h3>
<p>Нажмите «В корзину» у понравившегося телевизора. Если сомневаетесь в диагонали — посмотрите рекомендацию: до 55" для гостиной 12–15 м², 65"+ для больших комнат.</p>
</div>
</div>
<div class="step">
<span class="step-num">2</span>
<div>
<h3>Оставьте заявку</h3>
<p>Форма внизу страницы: имя, телефон, город и, при необходимости, номер льготы. Мы перезваниваем в течение 30 минут в рабочее время (9:00–19:00).</p>
</div>
</div>
<div class="step">
<span class="step-num">3</span>
<div>
<h3>Оплатите удобным способом</h3>
<p>Картой при выдаче, переводом на счёт, рассрочка 0-0-6 на любой телевизор. Предоплата не требуется — платите, когда курьер уже у двери.</p>
</div>
</div>
<div class="step">
<span class="step-num">4</span>
<div>
<h3>Получите и настройтесь</h3>
<p>Курьер проверяет работоспособность при вас, подключает антенну или Wi-Fi и помогает войти в любимое приложение. Гарантия 3 года с момента покупки.</p>
</div>
</div>
</div>
</div>
</section>
<section id="order" class="kt-ai-cta">
<div class="kt-ai-wrap" data-width="narrow">
<h2>Готовы к большому экрану?</h2>
<p>Оставьте телефон — перезвоним за 30 минут, уточним доставку и льгаты. Или позвоните сами: <b>+7 (700) 123-45-67</b>, ежедневно 9:00–21:00.</p>
<div class="kt-ai-cta-row" style="margin-top:var(--kt-ai-space-5);display:flex;gap:var(--kt-ai-space-3);flex-wrap:wrap">
<a class="kt-ai-btn" data-variant="primary" data-size="lg" href="tel:+77001234567">Позвонить</a>
<a class="kt-ai-btn" data-size="lg" href="https://wa.me/77001234567" target="_blank" rel="noopener">Написать в WhatsApp</a>
</div>
</div>
</section>
<footer class="kt-ai-wrap kt-ai-pagefoot">
<span>© 2026 TeleMag — магазин телевизоров</span>
<span class="kt-ai-spacer"></span>
<span>Астана, ул. Абая 150 · +7 (700) 123-45-67</span>
</footer>
</body>
</html>