index.html

@@ -107,18 +107,49 @@ tr:hover{background:var(--gray-100)}
   </div>
 </section>
 
+<section id="products" class="section">
+  <div class="container">
+    <h2 class="reveal">Наши изделия</h2>
+    <div class="grid">
+      <a href="hats.html" style="text-decoration:none;color:inherit">
+        <div class="card reveal">
+          <img src="https://picsum.photos/seed/hat1/400/300" alt="Вязаная шапочка" class="product-img">
+          <h3>🧢 Шапочки</h3>
+          <p>Тёплые и стильные шапочки из шерстяной пряжи. Вяжем различными узорами: косы, араны, жаккард. Подбираем индивидуальную схему под любой размер.</p>
+          <br>
+          <p><strong>Материалы:</strong> мериносовая шерсть, альпака, мохер</p>
+          <p><strong>Время вязания:</strong> 2-3 встречи</p>
+        </div>
+      </a>
+      <a href="vests.html" style="text-decoration:none;color:inherit">
+        <div class="card reveal">
+          <img src="https://picsum.photos/seed/vest1/400/300" alt="Вязаный жилет" class="product-img">
+          <h3>👚 Жилетки</h3>
+          <p>Уютные жилетки — идеальный слой для прохладной погоды. Классические модели с пуговицами или современные безрукавки свободного кроя.</p>
+          <br>
+          <p><strong>Материалы:</strong> полушерсть, хлопок с акрилом</p>
+          <p><strong>Время вязания:</strong> 4-6 встреч</p>
+        </div>
+      </a>
+      <a href="socks.html" style="text-decoration:none;color:inherit">
+        <div class="card reveal">
+          <img src="https://picsum.photos/seed/socks1/400/300" alt="Вязаные носки" class="product-img">
+          <h3>🧦 Носочки</h3>
+          <p>Тёплые носки ручной работы — лучший подарок для ног. Осваиваем вязание на 5 спицах, узоры для стопы и манжеты с резинкой.</p>
+          <br>
+          <p><strong>Материалы:</strong> носочная пряжа с добавлением полиамида</p>
+          <p><strong>Время вязания:</strong> 3-4 встречи</p>
+        </div>
+      </a>
+    </div>
+  </div>
+</section>
+
 <section id="babies" class="section">
   <div class="container">
     <h2 class="reveal">👶 Для малышей</h2>
     <p class="reveal" style="text-align:center;max-width:700px;margin:0 auto 40px;font-size:18px">Мы вяжем тёплые вещи для недоношенных детей и передаём их в перинатальный центр Уральска</p>
     
-    <div style="display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-bottom:40px">
-      <img src="https://loremflickr.com/300/300/premature,baby" alt="Недоношенный малыш" style="width:100%;height:200px;object-fit:cover;border-radius:12px">
-      <img src="https://loremflickr.com/300/300/newborn,tiny" alt="Крошечные ручки" style="width:100%;height:200px;object-fit:cover;border-radius:12px">
-      <img src="https://loremflickr.com/300/300/baby,incubator" alt="Малыш в кювезе" style="width:100%;height:200px;object-fit:cover;border-radius:12px">
-      <img src="https://loremflickr.com/300/300/infant,small" alt="Спящий малыш" style="width:100%;height:200px;object-fit:cover;border-radius:12px">
-    </div>
-    
     <div class="grid">
       <div class="card reveal" style="background:#FFF5F9">
         <h3 style="color:#D63384">🧢 Шапочки для новорождённых</h3>