Add lighter Cormorant weights and refine V2 typography

css/tokens.css

@@ -1,3 +1,19 @@
+/* full family */
+@font-face {
+  font-family: 'Cormorant Garamond';
+  font-style: normal;
+  font-weight: 400;
+  font-display: swap;
+  src: url('../fonts/CormorantGaramond-Regular.woff2') format('woff2');
+}
+/* full family */
+@font-face {
+  font-family: 'Cormorant Garamond';
+  font-style: normal;
+  font-weight: 500;
+  font-display: swap;
+  src: url('../fonts/CormorantGaramond-Medium.woff2') format('woff2');
+}
 /* cyrillic-ext */
 @font-face {
   font-family: 'Cormorant Garamond';

docs/design-audit-followup.md

@@ -29,7 +29,21 @@
 | Страница продукта | [partial] частично | Добавлены V2-only breadcrumbs, H1 облегчен, описание ограничено `66ch`. Расширенного описания пока нет, и вертикальную композицию метаданных/CTA стоит еще проверить визуально. |
 | "О нас" | [partial] частично | H1, article width, H2, feature-card, blockquote и muted-section исправлены в V2. Hero все еще использует темную фотографию и правую meta-карточку, хотя карточка стала мягче. |
 | "Контакты" | [partial] частично | Hero без фото, телефон уменьшен, форма облегчена, поле контакта разделяется JS на телефон/email, success-state добавлен. Юридический блок только опущен в конец левой колонки, но не вынесен ниже формы/в конец страницы. |
-| Проверка сборки | [todo] не проверено | После этой сверки build еще не запускался. |
+| Проверка сборки | [done] проверено | `npm run build` успешно прошел 2026-04-28; Eleventy записал 12 файлов в `_site`. |
+
+## Новые замечания дизайнера - 2026-04-28
+
+Источник: скриншоты/комментарии от Виктории.
+
+| Блок | Статус | Что сделано |
+| --- | --- | --- |
+| Легкие Cormorant 400/500 | [done] подключено | Добавлены `CormorantGaramond-Regular.woff2` и `CormorantGaramond-Medium.woff2`; в `src/css/tokens.css` и `css/tokens.css` прописаны настоящие `@font-face` для весов `400` и `500`. |
+| Общая жирность Cormorant в V2 | [done] CSS-слой | В `src/css/v2.css` Cormorant-заголовки переведены с `500/600` на `400` там, где это карточки, секции, mega-menu, footer, page hero, article blocks. |
+| Карточки товара | [done] V2 | `.product-card h3` увеличен до 22px, вес снижен до 400, normal case сохранен. |
+| Заголовки секций | [done] V2 | `.section-heading h2` сделан тонким uppercase с Cormorant `400`, без дополнительной жирности. Hero H1 не затронут caps-правилом. |
+| Footer | [done] V2 | Заголовки колонок footer стали Cormorant 16px/400, без uppercase; подпункты остаются Manrope. Телефон в footer оставлен бордовым. |
+| Mega-menu | [done] V2 | Заголовок `Вина по географии` увеличен до 22px и облегчен до 400; меню, колонки и ссылки выровнены по левому краю; popular chips стали менее кнопочными и с левым текстом. |
+| Апелласьоны | [done] V2 | `.country-link` (`Франция`, `Италия`) перекрашен в бордо, вес снижен до 500; апелласьоны под ними остались normal case с левым отступом. |
 
 ## Ключевые замечания
 
@@ -136,7 +150,7 @@
 
 ### Этап 5. Проверка
 
-1. [todo] Прогнать `npm run build`.
+1. [done] Прогнать `npm run build`.
 2. [todo] Проверить страницы минимум на desktop и mobile: `index.html`, `catalog.html`, `product.html`, `about.html`, `contacts.html`, `ui-kit.html`.
 3. [todo] Отдельно проверить, что длинные русские заголовки и телефоны не ломают сетку.
 4. [partial] Частично: сверить UI-kit с сайтом: токены, кнопки, карточки, hero, формы.

src/css/tokens.css

@@ -1,3 +1,19 @@
+/* full family */
+@font-face {
+  font-family: 'Cormorant Garamond';
+  font-style: normal;
+  font-weight: 400;
+  font-display: swap;
+  src: url('../fonts/CormorantGaramond-Regular.woff2') format('woff2');
+}
+/* full family */
+@font-face {
+  font-family: 'Cormorant Garamond';
+  font-style: normal;
+  font-weight: 500;
+  font-display: swap;
+  src: url('../fonts/CormorantGaramond-Medium.woff2') format('woff2');
+}
 /* cyrillic-ext */
 @font-face {
   font-family: 'Cormorant Garamond';

src/css/v2.css

@@ -85,7 +85,7 @@
 [data-design-version="v2"] h4 {
   font-family: var(--font-heading);
   text-transform: none !important;
-  font-weight: 500;
+  font-weight: 400;
   letter-spacing: 0;
 }
 
@@ -104,16 +104,18 @@
 [data-design-version="v2"] .hero h1 {
   font-family: var(--font-heading);
   font-size: clamp(48px, 6vw, 80px);
-  font-weight: 500;
+  font-weight: 400;
   text-transform: none !important;
   letter-spacing: 0;
   line-height: 1.05;
 }
 
 [data-design-version="v2"] .section-heading h2 {
-  font-weight: 500;
+  font-size: clamp(28px, 3.4vw, 44px);
-  text-transform: none !important;
+  font-weight: 400;
+  text-transform: uppercase !important;
   letter-spacing: 0;
+  line-height: 1.04;
 }
 
 /* ── Product card (grid) ──────────────────────────────────────────────── */
@@ -130,10 +132,11 @@
 
 [data-design-version="v2"] .product-card h3 {
   font-family: var(--font-heading);
-  font-size: 20px;
+  font-size: 22px;
-  font-weight: 500;
+  font-weight: 400;
   text-transform: none !important;
   letter-spacing: 0;
+  line-height: 1.12;
 }
 
 [data-design-version="v2"] .product-footer {
@@ -174,24 +177,47 @@
   font-family: var(--font-heading);
   text-transform: none !important;
   letter-spacing: 0;
-  font-weight: 500;
+  font-weight: 400;
 }
 
 /* ── Catalog head ─────────────────────────────────────────────────────── */
 [data-design-version="v2"] .catalog-head h1 {
   font-family: var(--font-heading);
-  font-weight: 500;
+  font-weight: 400;
   text-transform: none !important;
   letter-spacing: 0;
 }
 
 /* ── Mega menu ────────────────────────────────────────────────────────── */
+[data-design-version="v2"] .mega-menu {
+  text-align: left;
+}
+
+[data-design-version="v2"] .mega-intro {
+  align-items: start;
+}
+
 [data-design-version="v2"] .mega-intro h2 {
-  font-size: 18px;
+  font-size: 22px;
-  font-weight: 600;
+  font-weight: 400;
   text-transform: none !important;
   letter-spacing: 0;
   font-family: var(--font-heading);
+  line-height: 1.08;
+}
+
+[data-design-version="v2"] .menu-grid {
+  grid-template-columns: minmax(160px, 0.72fr) minmax(140px, 0.72fr) minmax(280px, 1.35fr) minmax(180px, 0.9fr);
+  align-items: start;
+}
+
+[data-design-version="v2"] .menu-column {
+  align-items: flex-start;
+  text-align: left;
+}
+
+[data-design-version="v2"] .menu-column a {
+  font-weight: 400;
 }
 
 [data-design-version="v2"] .visual-column img {
@@ -204,9 +230,9 @@
 }
 
 [data-design-version="v2"] .country-link {
-  color: var(--color-accent-gold);
+  color: var(--color-primary-wine-100);
   font-size: 11px;
-  font-weight: 700;
+  font-weight: 500;
   letter-spacing: 0.08em;
   text-transform: uppercase;
 }
@@ -222,26 +248,29 @@
   display: flex;
   flex-wrap: wrap;
   gap: 8px;
+  justify-content: flex-start;
 }
 [data-design-version="v2"] .popular-list a {
   min-width: 120px;
   min-height: 44px;
   display: inline-flex;
   align-items: center;
-  justify-content: center;
+  justify-content: flex-start;
   padding: 8px 14px;
-  border: 1px solid rgba(22, 22, 22, 0.12);
+  border: 1px solid rgba(125, 2, 29, 0.14);
-  border-radius: 999px;
+  border-radius: 4px;
+  background: rgba(255, 253, 250, 0.72);
   text-transform: none;
   letter-spacing: 0;
-  font-weight: 500;
+  font-weight: 400;
+  text-align: left;
 }
 
 /* Producer cards */
 [data-design-version="v2"] .producer-card strong,
 [data-design-version="v2"] .news-card h3 {
   font-family: var(--font-heading);
-  font-weight: 500;
+  font-weight: 400;
   text-transform: none !important;
   letter-spacing: 0;
 }
@@ -250,7 +279,7 @@
 /* ── Page hero (about / contacts / guidelines) ────────────────────────── */
 [data-design-version="v2"] .page-hero h1 {
   font-family: var(--font-heading);
-  font-weight: 500;
+  font-weight: 400;
   text-transform: none !important;
   letter-spacing: 0;
   line-height: 1.08;
@@ -293,14 +322,14 @@
 [data-design-version="v2"] .article-body h2 {
   font-family: var(--font-heading);
   font-size: clamp(22px, 2.4vw, 28px);
-  font-weight: 500;
+  font-weight: 400;
   text-transform: none !important;
   letter-spacing: 0;
 }
 
 [data-design-version="v2"] .article-body .lead {
   font-family: var(--font-heading);
-  font-weight: 500;
+  font-weight: 400;
 }
 
 [data-design-version="v2"] .article-body blockquote {
@@ -308,7 +337,7 @@
   background: transparent;
   font-family: var(--font-heading);
   font-style: italic;
-  font-weight: 500;
+  font-weight: 400;
   color: var(--color-neutral-black);
 }
 
@@ -322,7 +351,7 @@
   font-size: 20px;
   text-transform: none !important;
   letter-spacing: 0;
-  font-weight: 500;
+  font-weight: 400;
 }
 
 [data-design-version="v2"] .muted-section,
@@ -364,7 +393,7 @@
 [data-design-version="v2"] .contact-form h2 {
   font-family: var(--font-heading);
   font-size: 24px;
-  font-weight: 500;
+  font-weight: 400;
   text-transform: none !important;
   letter-spacing: 0;
 }
@@ -373,6 +402,28 @@
   color: var(--color-neutral-gray-700);
 }
 
+/* ── Footer ───────────────────────────────────────────────────────────── */
+[data-design-version="v2"] .contacts-card h2,
+[data-design-version="v2"] .nav-group h2 {
+  font-family: var(--font-heading);
+  font-size: 16px;
+  font-weight: 400;
+  line-height: 1.2;
+  text-transform: none;
+  letter-spacing: 0;
+}
+
+[data-design-version="v2"] .nav-group a,
+[data-design-version="v2"] .contact-link,
+[data-design-version="v2"] .footer-legal {
+  font-family: var(--font-body);
+}
+
+[data-design-version="v2"] .contact-phone {
+  color: var(--color-primary-wine-100);
+  font-weight: 600;
+}
+
 /* ── Buttons (global) ─────────────────────────────────────────────────── */
 [data-design-version="v2"] .button--primary {
   background: var(--color-primary-wine-100);
@@ -392,7 +443,7 @@
 [data-design-version="v2"] .detail-copy h1 {
   font-family: var(--font-heading);
   font-size: clamp(36px, 4vw, 56px);
-  font-weight: 500;
+  font-weight: 400;
   text-transform: none !important;
   letter-spacing: 0;
 }