144 lines
8.9 KiB
HTML
144 lines
8.9 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>Zeleny — комнатные растения</title>
|
||
<link rel="icon" href="design-system/brand/kt-ai-logo.png">
|
||
<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">
|
||
<style>
|
||
a.kt-ai-btn { text-decoration: none; }
|
||
.plant-card img { width:100%; aspect-ratio:1; object-fit:cover; border-radius:var(--kt-ai-radius-2xl); background:var(--kt-ai-bg-soft); }
|
||
.reveal { opacity:0; transform:translateY(20px); transition:opacity .6s ease,transform .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">
|
||
<strong>Zeleny</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="#care">Уход</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>Комнатные растения для дома и офиса</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="#order">Заказать растение</a>
|
||
<a class="kt-ai-btn" data-size="lg" href="#catalog">Смотреть каталог</a>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="about" class="kt-ai-section" data-divider="true">
|
||
<div class="kt-ai-wrap">
|
||
<div class="kt-ai-section-head">
|
||
<h2>О нас</h2>
|
||
<p>Zeleny — семейная теплица в Алматы. Мы выращиваем комнатные растения с 2019 года и знаем каждое из них по имени.</p>
|
||
</div>
|
||
<div style="margin-top:var(--kt-ai-space-9);display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:var(--kt-ai-space-8);align-items:center">
|
||
<img src="https://picsum.photos/seed/greenhouse-plants/800/600" alt="Наша теплица" style="width:100%;border-radius:var(--kt-ai-radius-3xl)">
|
||
<div>
|
||
<p style="color:var(--kt-ai-fg-muted);line-height:1.6">Мы начинали с небольшого балкона и пары горшков сансевиерии. Сегодня у нас теплица площадью 300 м², 40+ видов растений и десятки довольных клиентов, которые уже собирают свои маленькие сады.</p>
|
||
<p style="color:var(--kt-ai-fg-muted);line-height:1.6;margin-top:var(--kt-ai-space-4)">Мы верим, что зелёные растения делают дом теплее, офис — приятнее, а жизнь — спокойнее.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="why" class="kt-ai-section">
|
||
<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"><h3>Собственная теплица</h3><p>Выращиваем растения сами — без переплат посредникам и стресса от долгих перевозок.</p></article>
|
||
<article class="kt-ai-tile"><h3>Доставка с заботой</h3><p>Привезём в надёжной упаковке в удобное время. По городу — бесплатно от 10 000 тг.</p></article>
|
||
<article class="kt-ai-tile"><h3>Гарантия 30 дней</h3><p>Если растение не приживётся, заменим бесплатно — при соблюдении простых правил ухода.</p></article>
|
||
</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>Популярные растения — от простых для начала до экзотики.</p>
|
||
</div>
|
||
<div class="kt-ai-grid" id="catalog-grid" style="margin-top:var(--kt-ai-space-9)"></div>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="care" 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-9)">
|
||
<article class="kt-ai-tile"><h3>Памятка по поливу</h3><p>Индивидуальный график полива и подкормки под конкретное растение и место в комнате.</p></article>
|
||
<article class="kt-ai-tile"><h3>Подбор горшка</h3><p>Подберём горшок и грунт под корневую систему — растение не будет страдать после пересадки.</p></article>
|
||
<article class="kt-ai-tile"><h3>Световой режим</h3><p>Подсказываем, куда поставить: южное, восточное или западное окно — и почему.</p></article>
|
||
<article class="kt-ai-tile"><h3>Поддержка</h3><p>Напишите нам в WhatsApp если что-то пойдёт не так — подскажем, как помочь растению.</p></article>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="order" class="kt-ai-cta">
|
||
<div class="kt-ai-wrap">
|
||
<h2>Заказать растение</h2>
|
||
<p>Напишите в WhatsApp — подберём растение под ваш интерьер и уровень заботы. Или приходите в магазин: Алматы, ул. example 1, ежедневно с 9:00 до 21:00.</p>
|
||
<a class="kt-ai-btn" data-variant="primary" data-size="lg" href="https://wa.me/77000000000?text=Здравствуйте!%20Хочу%20заказать%20комнатное%20растение">Написать в WhatsApp</a>
|
||
</div>
|
||
</section>
|
||
|
||
<footer class="kt-ai-wrap kt-ai-pagefoot">
|
||
<span>© 2026 Zeleny</span>
|
||
<span class="kt-ai-spacer"></span>
|
||
<span>Алматы · WhatsApp</span>
|
||
</footer>
|
||
|
||
<script>
|
||
var plants = [
|
||
{ name: "Сансевиерия", price: "8 500 тг", tag: "Лёгкий уход", seed: "sansevieria", icon: "leaf" },
|
||
{ name: "Эпипремnum золотистая", price: "6 000 тг", tag: "Для новичков", seed: "pothos" },
|
||
{ name: "Монстера делициоза", price: "14 000 тг", tag: "Хит", seed: "monstera", icon: "star" },
|
||
{ name: "Замиокулькас", price: "10 000 тг", tag: "Неприхотливый", seed: "zamioculcas", icon: "shield" },
|
||
{ name: "Фикус лировский", price: "12 500 тг", tag: "Большое", seed: "ficus", icon: "tree" },
|
||
{ name: "Хлорофитум", price: "5 500 тг", tag: "Польза", seed: "chlorophytum", icon: "check" }
|
||
];
|
||
|
||
var grid = document.getElementById("catalog-grid");
|
||
grid.style.gridTemplateColumns = "repeat(3,1fr)";
|
||
plants.forEach(function(p){
|
||
var a = document.createElement("article");
|
||
a.className = "kt-ai-card plant-card reveal";
|
||
a.innerHTML =
|
||
'<img src="https://picsum.photos/seed/' + p.seed + '/600/600" alt="' + p.name + '" loading="lazy">' +
|
||
'<div style="padding:var(--kt-ai-space-4)">' +
|
||
'<div style="display:flex;align-items:center;gap:var(--kt-ai-space-2)"><h3 style="margin:0">' + p.name + '</h3><span class="kt-ai-chip" style="margin-left:auto">' + p.tag + '</span></div>' +
|
||
'<p style="margin:var(--kt-ai-space-2) 0 0 0;color:var(--kt-ai-fg-muted)">' + p.price + '</p>' +
|
||
'<a class="kt-ai-btn" data-size="sm" style="margin-top:var(--kt-ai-space-3);display:inline-block" href="https://wa.me/77000000000?text=Здравствуйте!%20Интересует%20' + encodeURIComponent(p.name) + '">Заказать</a>' +
|
||
'</div>';
|
||
grid.appendChild(a);
|
||
});
|
||
|
||
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>
|