84 lines
4.7 KiB
HTML
84 lines
4.7 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="ru">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width,initial-scale=1">
|
||
<title>Носочки — 28 петель</title>
|
||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||
<link href="https://fonts.googleapis.com/css2?family=Manrope:wght@400;600;700&family=Unbounded:wght@700&display=swap" rel="stylesheet">
|
||
<style>
|
||
:root{--primary:#9B7EBD;--primary-light:#E8DFF5;--primary-dark:#6B4C9A;--ink:#2D2438;--white:#FFFFFF;--gray-100:#F5F0FA;--gray-300:#D4C5E5}
|
||
*{box-sizing:border-box;margin:0;padding:0}
|
||
body{font:17px/1.6 'Manrope',-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--white)}
|
||
.container{max-width:1140px;margin:0 auto;padding:80px 24px}
|
||
.hero{background:linear-gradient(135deg,var(--primary),var(--primary-dark));color:var(--white);padding:60px 24px;text-align:center}
|
||
.hero h1{font:700 clamp(36px,6vw,48px)/1.1 'Unbounded',sans-serif;margin-bottom:16px}
|
||
.back-link{display:inline-block;color:var(--white);text-decoration:none;margin-top:16px;opacity:.9}
|
||
.back-link:hover{opacity:1}
|
||
.section{padding:60px 24px}
|
||
.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;margin:40px 0}
|
||
.gallery img{width:100%;height:280px;object-fit:cover;border-radius:12px}
|
||
.card{background:var(--gray-100);border-radius:16px;padding:32px;margin-bottom:24px}
|
||
.card h2{font:700 28px/1.3 'Unbounded',sans-serif;color:var(--primary-dark);margin-bottom:16px}
|
||
.specs{background:var(--white);border-radius:12px;padding:24px;margin:24px 0}
|
||
.specs ul{list-style:none;padding-left:0}
|
||
.specs li{padding:12px 0;border-bottom:1px solid var(--gray-300)}
|
||
.specs li:last-child{border-bottom:none}
|
||
.btn{display:inline-block;background:var(--primary);color:var(--white);padding:14px 28px;border-radius:8px;font-weight:700;text-decoration:none;margin-top:24px}
|
||
</style>
|
||
<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>">
|
||
</head>
|
||
<body>
|
||
|
||
<section class="hero">
|
||
<h1>🧦 Носочки</h1>
|
||
<p>Тёплые вязаные носки ручной работы</p>
|
||
<a href="index.html#products" class="back-link">← Вернуться к каталогу</a>
|
||
</section>
|
||
|
||
<section class="section">
|
||
<div class="container">
|
||
<div class="card">
|
||
<h2>Описание</h2>
|
||
<p>Вязаные носки — это лучший подарок для ваших ног! Натуральная шерсть сохраняет тепло, а ручная работа обеспечивает идеальную посадку по ноге.</p>
|
||
<br>
|
||
<p>На наших встречах мы осваиваем вязание на 5 спицах, учимся вязать пятку и мысок, подбираем красивые узоры для манжет и стопы.</p>
|
||
</div>
|
||
|
||
<div class="gallery">
|
||
<img src="https://picsum.photos/seed/socks1/400/300" alt="Носки 1">
|
||
<img src="https://picsum.photos/seed/socks2/400/300" alt="Носки 2">
|
||
<img src="https://picsum.photos/seed/socks3/400/300" alt="Носки 3">
|
||
<img src="https://picsum.photos/seed/socks4/400/300" alt="Носки 4">
|
||
</div>
|
||
|
||
<div class="specs">
|
||
<h2>Характеристики</h2>
|
||
<ul>
|
||
<li><strong>Материалы:</strong> носочная пряжа с полиамидом, мериносовая шерсть, альпака</li>
|
||
<li><strong>Сезон:</strong> осень, зима, весна</li>
|
||
<li><strong>Техники:</strong> вязание на 5 спицах, пятка-бумеранг, круговая пятка</li>
|
||
<li><strong>Размеры:</strong> от 35 до 45 (индивидуально)</li>
|
||
<li><strong>Время вязания:</strong> 3-4 встречи клуба</li>
|
||
<li><strong>Уход:</strong> ручная стирка при 30°C, сушить в расправленном виде</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<div class="card">
|
||
<h2>📋 Доступные модели</h2>
|
||
<ul>
|
||
<li><strong>Классические</strong> — гладкое полотно с резинкой</li>
|
||
<li><strong>С узором на манжете</strong> — косы, араны, жаккард</li>
|
||
<li><strong>Следки</strong> — короткие, для дома</li>
|
||
<li><strong>Гольфы</strong> — удлинённые, до колена</li>
|
||
<li><strong>Детские</strong> — яркие, с орнаментом</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<a href="index.html#contacts" class="btn">Заказать носочки</a>
|
||
</div>
|
||
</section>
|
||
|
||
</body>
|
||
</html>
|