123 lines
5.5 KiB
HTML
123 lines
5.5 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="ru">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width,initial-scale=1">
|
||
<title>Склад Логистика — Хранение и отгрузка товаров</title>
|
||
<style>
|
||
:root{--ink:#0F1218;--cyan:#00E5FF;--cyan-50:#E8FCFF;--white:#fff;--gray-500:#5B6573;--gray-100:#F2F4F7}
|
||
*{box-sizing:border-box;margin:0;padding:0}
|
||
body{font:17px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",Inter,system-ui,sans-serif;color:var(--ink);background:var(--white)}
|
||
.container{max-width:1140px;margin:0 auto;padding:80px 24px}
|
||
.hero{background:var(--ink);color:var(--white)}
|
||
.hero h1{font-size:56px;font-weight:800;line-height:1.05;margin-bottom:24px}
|
||
.hero p{font-size:20px;color:#9aa3b2;max-width:600px;margin-bottom:32px}
|
||
.btn{display:inline-block;background:var(--cyan);color:var(--ink);padding:14px 28px;border-radius:8px;font-weight:700;text-decoration:none}
|
||
.btn:hover{background:#1be5ff}
|
||
.section h2{font-size:36px;font-weight:700;margin-bottom:24px}
|
||
.card{background:var(--gray-100);border-radius:16px;padding:32px;margin-bottom:16px}
|
||
.advantages{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:24px;margin-top:40px}
|
||
.advantage{background:var(--gray-100);border-radius:16px;padding:32px;text-align:center}
|
||
.advantage .icon{font-size:48px;margin-bottom:16px}
|
||
.advantage h3{font-size:22px;font-weight:700;margin-bottom:12px}
|
||
.advantage p{color:var(--gray-500);font-size:15px}
|
||
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:24px;margin-top:40px}
|
||
.stat{text-align:center;padding:24px}
|
||
.stat .number{font-size:48px;font-weight:800;color:var(--cyan)}
|
||
.stat .label{color:var(--gray-500);margin-top:8px}
|
||
.cta{background:var(--ink);color:var(--white);text-align:center;padding:80px 24px}
|
||
.cta h2{margin-bottom:24px}
|
||
.cta p{color:#9aa3b2;max-width:600px;margin:0 auto 32px}
|
||
.form{max-width:500px;margin:0 auto}
|
||
.form input,.form textarea{width:100%;padding:14px;border:2px solid var(--gray-100);border-radius:8px;font-size:16px;margin-bottom:16px}
|
||
.form textarea{height:120px;resize:vertical}
|
||
.form button{width:100%;background:var(--cyan);color:var(--ink);padding:16px;border:none;border-radius:8px;font-size:18px;font-weight:700;cursor:pointer}
|
||
.form button:hover{background:#1be5ff}
|
||
footer{background:var(--gray-100);padding:40px 24px;text-align:center;color:var(--gray-500)}
|
||
@media(max-width:640px){.hero h1{font-size:36px}.section h2{font-size:28px}.container{padding:48px 20px}}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
|
||
<section class="hero">
|
||
<div class="container">
|
||
<h1>Склад Логистика</h1>
|
||
<p>Хранение, обработка и отгрузка товаров по всей Казахстану. Без потерь, с контролем на каждом этапе.</p>
|
||
<a class="btn" href="#contact">Оставить заявку</a>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="section">
|
||
<div class="container">
|
||
<h2>Наши преимущества</h2>
|
||
<div class="advantages">
|
||
<div class="advantage">
|
||
<div class="icon">📦</div>
|
||
<h3>Контроль остатков</h3>
|
||
<p>实时 отслеживание товаров. Никаких расхождений и пересортов.</p>
|
||
</div>
|
||
<div class="advantage">
|
||
<div class="icon">⚡</div>
|
||
<h3>Быстрые отгрузки</h3>
|
||
<p>Сборка заказов за 2 часа. Отгрузка в день обращения.</p>
|
||
</div>
|
||
<div class="advantage">
|
||
<div class="icon">📊</div>
|
||
<h3>Аналитика</h3>
|
||
<p>Отчёты по остаткам, оборачиваемости и дефициту.</p>
|
||
</div>
|
||
<div class="advantage">
|
||
<div class="icon">🛡</div>
|
||
<h3>Без потерь</h3>
|
||
<p>Система контроля качества. Гарантия сохранности товаров.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="section">
|
||
<div class="container">
|
||
<h2>Цифры говорят сами за себя</h2>
|
||
<div class="stats">
|
||
<div class="stat">
|
||
<div class="number">5000+</div>
|
||
<div class="label">Позиций на складе</div>
|
||
</div>
|
||
<div class="stat">
|
||
<div class="number">99.8%</div>
|
||
<div class="label">Точность остатков</div>
|
||
</div>
|
||
<div class="stat">
|
||
<div class="number">2 ч</div>
|
||
<div class="label">Время сборки заказа</div>
|
||
</div>
|
||
<div class="stat">
|
||
<div class="number">24/7</div>
|
||
<div class="label">Мониторинг склада</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="contact" class="cta">
|
||
<div class="container">
|
||
<h2>Готовы начать сотрудничество?</h2>
|
||
<p>Оставьте заявку и мы свяжемся с вами в течение 30 минут</p>
|
||
<form class="form" action="https://formspree.io/f/your_form_id" method="POST">
|
||
<input type="text" name="name" placeholder="Ваше имя" required>
|
||
<input type="tel" name="phone" placeholder="Телефон" required>
|
||
<textarea name="message" placeholder="Опишите ваши товары и объёмы"></textarea>
|
||
<button type="submit">Отправить заявку</button>
|
||
</form>
|
||
</div>
|
||
</section>
|
||
|
||
<footer>
|
||
<div class="container">
|
||
<p>© 2026 Склад Логистика. Все права защищены.</p>
|
||
</div>
|
||
</footer>
|
||
|
||
</body>
|
||
</html>
|