From 5c54541b4cf058e8a00d35629932f2a70138e9ee Mon Sep 17 00:00:00 2001
From: sdarbinyan <sdarbinyan@4pay.ru>
Date: Mon, 20 Jul 2026 03:28:56 +0400
Subject: [PATCH] style(design-system): normalize font-weight literals
 (400/500/600/700) to tokens

Mechanical, value-preserving: font-weight: 400/500/600/700 -> var(--font-weight-normal/medium/semibold/bold, <same value>) across src/app.
Note: cart.component.scss now sits ~771 bytes over its per-file budget
in angular.json due to longer var() strings; non-fatal build warning,
noted in docs/UI-DESIGN-REVIEW.md as a follow-up (either bump the
component style budget slightly or accept the warning).
---
 .../delivery-selector.component.scss          |  4 +-
 .../components/header/header.component.scss   | 14 +--
 .../items-carousel.component.scss             |  8 +-
 .../language-selector.component.scss          | 14 +--
 .../product-card/product-card.component.scss  | 14 +--
 .../region-selector.component.scss            |  2 +-
 .../telegram-login.component.scss             |  4 +-
 .../pages/admin-analytics-page.component.scss |  2 +-
 .../admin-categories-list.component.scss      |  4 +-
 .../admin-category-form.component.scss        |  8 +-
 .../categories-dashboard.component.scss       |  2 +-
 .../category-health-widget.component.scss     |  2 +-
 .../admin-customer-detail-page.component.scss |  2 +-
 .../components/dashboard-card.component.scss  |  2 +-
 .../dashboard-metric.component.scss           |  6 +-
 .../dashboard-section.component.scss          |  2 +-
 .../dashboard-shortcut-card.component.scss    |  4 +-
 .../dashboard-status-row.component.scss       |  2 +-
 .../pages/admin-dashboard-page.component.scss | 10 +-
 .../moderation-dashboard.component.scss       |  2 +-
 .../review-health-widget.component.scss       |  2 +-
 .../admin-reports-list-page.component.scss    |  2 +-
 .../order-timeline.component.scss             |  2 +-
 .../orders-dashboard.component.scss           |  2 +-
 .../admin-order-detail-page.component.scss    | 10 +-
 .../admin-product-form.component.scss         | 18 ++--
 .../admin-products-list.component.scss        |  2 +-
 .../product-health-widget.component.scss      |  2 +-
 .../product-variants-editor.component.scss    |  2 +-
 .../products-dashboard.component.scss         |  2 +-
 .../admin/shell/admin-layout.component.scss   | 14 +--
 .../asset-tile/asset-tile.component.scss      |  2 +-
 ...backoffice-coming-soon-page.component.scss |  2 +-
 .../content-dashboard.component.scss          |  2 +-
 .../content-health-widget.component.scss      |  2 +-
 .../page-card/page-card.component.scss        |  2 +-
 .../page-editor/page-editor.component.scss    |  8 +-
 .../static-page-preview.component.scss        |  2 +-
 .../marketplace-html-editor.component.scss    |  2 +-
 .../project-editor-nav.component.scss         |  8 +-
 .../builder-overview-page.component.scss      | 22 ++---
 .../pages/project-editor-page.component.scss  | 10 +-
 .../brand/brand-overview.component.scss       | 14 +--
 .../homepage/homepage-overview.component.scss |  6 +-
 .../sections/section.shared.scss              | 14 +--
 .../sections/widgets-section.component.scss   |  6 +-
 .../search-empty-results.component.scss       |  2 +-
 .../search-bar/search-bar.component.scss      |  6 +-
 .../catalog-empty-state.component.scss        |  2 +-
 .../category-grid.component.scss              |  2 +-
 .../filters-panel.component.scss              |  6 +-
 .../layout-switcher.component.scss            |  2 +-
 .../search-results.component.scss             |  2 +-
 .../sorting-control.component.scss            |  2 +-
 .../catalog-container.component.scss          | 14 +--
 .../product-actions.component.scss            |  2 +-
 .../product-gallery.component.scss            |  6 +-
 .../product-tabs/product-tabs.component.scss  |  2 +-
 .../question-form.component.scss              |  2 +-
 .../question-list.component.scss              |  4 +-
 .../rating-summary.component.scss             |  2 +-
 .../review-form/review-form.component.scss    |  8 +-
 .../review-list/review-list.component.scss    |  2 +-
 .../components/compare-table.component.scss   |  2 +-
 .../containers/compare-page.component.scss    |  4 +-
 .../floating-notifications.component.scss     |  2 +-
 src/app/pages/cart/cart.component.scss        | 94 +++++++++----------
 .../pages/category/category.component.scss    | 16 ++--
 .../category/subcategories.component.scss     | 22 ++---
 .../info/contacts/contacts.component.scss     |  2 +-
 .../item-detail/item-detail.component.scss    | 74 +++++++--------
 .../company-details.component.scss            |  8 +-
 src/app/pages/search/search.component.scss    | 10 +-
 .../ui/code-editor/code-editor.component.scss |  4 +-
 74 files changed, 286 insertions(+), 286 deletions(-)

diff --git a/src/app/components/delivery-selector/delivery-selector.component.scss b/src/app/components/delivery-selector/delivery-selector.component.scss
index 64e9aed..ee70e5b 100644
--- a/src/app/components/delivery-selector/delivery-selector.component.scss
+++ b/src/app/components/delivery-selector/delivery-selector.component.scss
@@ -14,7 +14,7 @@
   display: block;
   margin-bottom: 8px;
   font-size: var(--font-size-sm, 0.8125rem);
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   color: #3f5f5c;
 }
 
@@ -50,7 +50,7 @@
   padding: 6px 10px;
   border-radius: var(--radius-full, 999px);
   font-size: var(--font-size-sm, 0.8125rem);
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
 }
 
 .delivery-chip--digital {
diff --git a/src/app/components/header/header.component.scss b/src/app/components/header/header.component.scss
index 40fb293..090fce3 100644
--- a/src/app/components/header/header.component.scss
+++ b/src/app/components/header/header.component.scss
@@ -59,7 +59,7 @@
   border: 1px solid #d3dad9;
   background: rgba(255, 255, 255, 0.74);
   font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   font-size: var(--font-size-md, 0.9375rem);
   color: #1e3c38;
   text-decoration: none;
@@ -123,7 +123,7 @@
   background: transparent;
   outline: none;
   font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   font-size: var(--font-size-md, 0.9375rem);
   color: #828e8d;
   cursor: pointer;
@@ -165,7 +165,7 @@
 .platform-ux-icon {
   font-size: var(--font-size-md, 0.9375rem);
   line-height: 1;
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
 }
 
 .platform-ux-badge {
@@ -178,7 +178,7 @@
   background: #497671;
   color: #ffffff;
   font-size: 10px;
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   display: inline-flex;
   align-items: center;
   justify-content: center;
@@ -226,7 +226,7 @@
   background: #497671;
   color: #ffffff;
   font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   font-size: 10px;
   line-height: 1;
   width: 18px;
@@ -240,7 +240,7 @@
 
 .platform-cart-total {
   font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   font-size: 10px;
   line-height: 1;
   color: #1e3c38;
@@ -277,7 +277,7 @@
   box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.15);
   font-family: 'DM Sans', sans-serif;
   font-size: var(--font-size-lg, 1rem);
-  font-weight: 500;
+  font-weight: var(--font-weight-medium, 500);
   color: #1e3c38;
   text-decoration: none;
   text-align: left;
diff --git a/src/app/components/items-carousel/items-carousel.component.scss b/src/app/components/items-carousel/items-carousel.component.scss
index 8d67fce..0f86722 100644
--- a/src/app/components/items-carousel/items-carousel.component.scss
+++ b/src/app/components/items-carousel/items-carousel.component.scss
@@ -186,7 +186,7 @@
   border-radius: 20px;
   font-family: "DM Sans", sans-serif;
   font-size: var(--font-size-xs, 0.75rem);
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   letter-spacing: 0.02em;
   z-index: 2;
   line-height: 1.3;
@@ -203,7 +203,7 @@
 .item-name {
   font-family: "DM Sans", sans-serif;
   font-size: var(--font-size-sm, 0.8125rem);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   margin: 0;
   line-height: 1.35;
   min-height: 2.2em;
@@ -232,7 +232,7 @@
   }
 
   .rating-value {
-    font-weight: 600;
+    font-weight: var(--font-weight-semibold, 600);
     color: #1e3c38;
   }
 
@@ -261,7 +261,7 @@
   .current-price,
   .discounted-price {
     font-size: var(--font-size-md, 0.9375rem);
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
     color: #1e3c38;
   }
 
diff --git a/src/app/components/language-selector/language-selector.component.scss b/src/app/components/language-selector/language-selector.component.scss
index 06af68e..940b107 100644
--- a/src/app/components/language-selector/language-selector.component.scss
+++ b/src/app/components/language-selector/language-selector.component.scss
@@ -15,7 +15,7 @@
   cursor: pointer;
   transition: all 0.3s ease;
   font-size: var(--font-size-base, 0.875rem);
-  font-weight: 500;
+  font-weight: var(--font-weight-medium, 500);
 
   &:hover {
     background: rgba(255, 255, 255, 0.05);
@@ -87,7 +87,7 @@
 
   &.active {
     background: rgba(255, 255, 255, 0.1);
-    font-weight: 600;
+    font-weight: var(--font-weight-semibold, 600);
   }
 
   &.disabled {
@@ -182,7 +182,7 @@
 
     .language-code {
       font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
-      font-weight: 500;
+      font-weight: var(--font-weight-medium, 500);
       font-size: var(--font-size-md, 0.9375rem);
       color: #1e3c38;
       letter-spacing: 0;
@@ -326,7 +326,7 @@
   cursor: pointer;
   transition: all 0.3s ease;
   font-size: var(--font-size-base, 0.875rem);
-  font-weight: 500;
+  font-weight: var(--font-weight-medium, 500);
 
   &:hover {
     background: rgba(255, 255, 255, 0.05);
@@ -335,7 +335,7 @@
 
   .currency-symbol {
     font-size: var(--font-size-md, 0.9375rem);
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
   }
 
   .currency-code {
@@ -392,12 +392,12 @@
 
   &.active {
     background: rgba(255, 255, 255, 0.1);
-    font-weight: 600;
+    font-weight: var(--font-weight-semibold, 600);
   }
 
   .cur-symbol {
     font-size: var(--font-size-lg, 1rem);
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
     width: 20px;
     text-align: center;
   }
diff --git a/src/app/components/product-card/product-card.component.scss b/src/app/components/product-card/product-card.component.scss
index a0d6ed1..614d2cd 100644
--- a/src/app/components/product-card/product-card.component.scss
+++ b/src/app/components/product-card/product-card.component.scss
@@ -57,7 +57,7 @@
   color: #fff;
   padding: 6px 12px;
   border-radius: 20px;
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   font-size: var(--font-size-base, 0.875rem);
   z-index: 1;
 }
@@ -75,7 +75,7 @@
   background: rgba(22, 163, 74, 0.9);
   color: #fff;
   font-size: var(--font-size-xs, 0.75rem);
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   text-transform: capitalize;
 }
 
@@ -100,7 +100,7 @@
   background: rgba(255, 255, 255, 0.95);
   color: #1e3c38;
   font-size: var(--font-size-lg, 1rem);
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   display: inline-flex;
   align-items: center;
   justify-content: center;
@@ -161,7 +161,7 @@
   background: #497671;
   color: #fff;
   font-size: var(--font-size-xs, 0.75rem);
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   text-transform: uppercase;
 }
 
@@ -180,7 +180,7 @@
 }
 
 .product-name {
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   font-size: clamp(14px, 1.4vw, 18px);
   color: #1e3c38;
   margin: 0;
@@ -215,7 +215,7 @@
 
   .rating-stars {
     color: #b45309;
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
   }
 }
 
@@ -275,7 +275,7 @@
   border-radius: var(--radius-lg, 13px);
   background: #497671;
   color: #fff;
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   cursor: pointer;
   transition: background 0.2s ease, transform 0.15s ease;
 
diff --git a/src/app/components/region-selector/region-selector.component.scss b/src/app/components/region-selector/region-selector.component.scss
index 20b1c6b..6dfb295 100644
--- a/src/app/components/region-selector/region-selector.component.scss
+++ b/src/app/components/region-selector/region-selector.component.scss
@@ -67,7 +67,7 @@
   padding: 10px 14px;
   border-bottom: 1px solid var(--border-color, #e0e0e0);
   font-size: var(--font-size-xs, 0.75rem);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   color: var(--text-secondary, #666);
   text-transform: uppercase;
   letter-spacing: 0.5px;
diff --git a/src/app/components/telegram-login/telegram-login.component.scss b/src/app/components/telegram-login/telegram-login.component.scss
index f7026c5..8162c1e 100644
--- a/src/app/components/telegram-login/telegram-login.component.scss
+++ b/src/app/components/telegram-login/telegram-login.component.scss
@@ -60,7 +60,7 @@
 h2 {
   margin: 0 0 8px;
   font-size: var(--font-size-2xl, 1.25rem);
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   color: var(--text-primary, #1a1a1a);
 }
 
@@ -83,7 +83,7 @@ h2 {
   background: #2AABEE;
   color: #fff;
   font-size: var(--font-size-lg, 1rem);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   cursor: pointer;
   transition: all 0.2s ease;
 
diff --git a/src/app/features/admin/analytics/pages/admin-analytics-page.component.scss b/src/app/features/admin/analytics/pages/admin-analytics-page.component.scss
index 201a583..f2738f6 100644
--- a/src/app/features/admin/analytics/pages/admin-analytics-page.component.scss
+++ b/src/app/features/admin/analytics/pages/admin-analytics-page.component.scss
@@ -9,7 +9,7 @@
   background: transparent;
   padding: 10px 14px;
   font-size: var(--font-size-sm, 0.8125rem);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   color: var(--text-secondary, #6b7280);
   cursor: pointer;
   border-bottom: 2px solid transparent;
diff --git a/src/app/features/admin/categories/components/admin-categories-list.component.scss b/src/app/features/admin/categories/components/admin-categories-list.component.scss
index 8bcb768..070611f 100644
--- a/src/app/features/admin/categories/components/admin-categories-list.component.scss
+++ b/src/app/features/admin/categories/components/admin-categories-list.component.scss
@@ -34,7 +34,7 @@ tr.deleted { opacity: 0.55; }
 .category-tree__toggle { all: unset; cursor: pointer; width: 18px; text-align: center; color: var(--text-secondary, #5f6e6a); }
 .category-tree__toggle-spacer { width: 18px; display: inline-block; }
 .category-tree__icon { font-size: var(--font-size-lg, 1rem); }
-.category-tree__title { font-weight: 600; color: var(--text-primary, #1e3c38); }
+.category-tree__title { font-weight: var(--font-weight-semibold, 600); color: var(--text-primary, #1e3c38); }
 .category-tree__items { font-size: var(--font-size-xs, 0.75rem); color: var(--text-tertiary, #9aa6a2); }
 .category-tree__actions { display: flex; gap: 6px; flex-wrap: wrap; }
 
@@ -44,7 +44,7 @@ tr.deleted { opacity: 0.55; }
 .category-grid__select { position: absolute; top: 8px; left: 8px; z-index: 1; }
 .category-grid__image { width: 100%; height: 120px; object-fit: cover; border-radius: var(--radius-sm); background: var(--surface-muted, #eef2f0); }
 .category-grid__image--placeholder { display: flex; align-items: center; justify-content: center; font-size: var(--font-size-3xl, 1.5rem); }
-.category-grid__name { margin: 0; font-size: var(--font-size-sm, 0.8125rem); font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.category-grid__name { margin: 0; font-size: var(--font-size-sm, 0.8125rem); font-weight: var(--font-weight-bold, 700); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
 .category-grid__items { margin: 0; font-size: var(--font-size-xs, 0.75rem); color: var(--text-secondary, #5f6e6a); }
 .category-grid__actions { display: flex; gap: 6px; flex-wrap: wrap; }
 
diff --git a/src/app/features/admin/categories/components/admin-category-form.component.scss b/src/app/features/admin/categories/components/admin-category-form.component.scss
index cb5c497..3e42ced 100644
--- a/src/app/features/admin/categories/components/admin-category-form.component.scss
+++ b/src/app/features/admin/categories/components/admin-category-form.component.scss
@@ -2,7 +2,7 @@
 .grid { display: grid; gap: 12px; }
 .grid.one { grid-template-columns: 1fr; }
 .grid.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
-label { display: grid; gap: 6px; font-weight: 600; }
+label { display: grid; gap: 6px; font-weight: var(--font-weight-semibold, 600); }
 label.check { display: flex; align-items: center; gap: 8px; }
 textarea, select { width: 100%; padding: 10px 12px; border: 1px solid var(--border-color, #d3dad9); border-radius: 10px; font: inherit; }
 input[type='checkbox'] { width: auto; }
@@ -22,7 +22,7 @@ input[type='checkbox'] { width: auto; }
   padding: 10px 14px;
   border-radius: 8px 8px 0 0;
   font-size: var(--font-size-base, 0.875rem);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   color: var(--text-secondary, #5f6e6a);
   display: inline-flex;
   align-items: center;
@@ -32,9 +32,9 @@ input[type='checkbox'] { width: auto; }
 }
 .form-card__tab--active { color: var(--brand-primary, #1e8a6e); background: var(--surface-muted, #eef2f0); }
 .form-card__panel { min-height: 200px; display: grid; gap: 14px; }
-.form-card__subheading { margin: 8px 0 0; font-size: var(--font-size-sm, 0.8125rem); font-weight: 700; text-transform: uppercase; letter-spacing: 0.03em; color: var(--text-secondary, #5f6e6a); }
+.form-card__subheading { margin: 8px 0 0; font-size: var(--font-size-sm, 0.8125rem); font-weight: var(--font-weight-bold, 700); text-transform: uppercase; letter-spacing: 0.03em; color: var(--text-secondary, #5f6e6a); }
 .form-card__explain { margin: 0; font-size: var(--font-size-sm, 0.8125rem); color: var(--text-secondary, #5f6e6a); }
-.toggle-row { display: flex; align-items: center; gap: 8px; font-weight: 400; }
+.toggle-row { display: flex; align-items: center; gap: 8px; font-weight: var(--font-weight-normal, 400); }
 
 .nav-children { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; font-size: var(--font-size-sm, 0.8125rem); }
 
diff --git a/src/app/features/admin/categories/components/categories-dashboard/categories-dashboard.component.scss b/src/app/features/admin/categories/components/categories-dashboard/categories-dashboard.component.scss
index 198198b..14ed896 100644
--- a/src/app/features/admin/categories/components/categories-dashboard/categories-dashboard.component.scss
+++ b/src/app/features/admin/categories/components/categories-dashboard/categories-dashboard.component.scss
@@ -30,7 +30,7 @@
   h4 {
     margin: 0;
     font-size: var(--font-size-md, 0.9375rem);
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
   }
 
   p {
diff --git a/src/app/features/admin/categories/components/category-health-widget/category-health-widget.component.scss b/src/app/features/admin/categories/components/category-health-widget/category-health-widget.component.scss
index d6c6aca..3a6ed84 100644
--- a/src/app/features/admin/categories/components/category-health-widget/category-health-widget.component.scss
+++ b/src/app/features/admin/categories/components/category-health-widget/category-health-widget.component.scss
@@ -18,7 +18,7 @@
 
 .category-health__percent {
   font-size: var(--font-size-xs, 0.75rem);
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   color: var(--text-secondary, #5f6e6a);
 }
 
diff --git a/src/app/features/admin/customers/pages/admin-customer-detail-page.component.scss b/src/app/features/admin/customers/pages/admin-customer-detail-page.component.scss
index 4c8122a..6678801 100644
--- a/src/app/features/admin/customers/pages/admin-customer-detail-page.component.scss
+++ b/src/app/features/admin/customers/pages/admin-customer-detail-page.component.scss
@@ -8,6 +8,6 @@
 .card p { margin: 0; }
 .muted { color: var(--text-secondary, #5f6e6a); font-size: var(--font-size-sm, 0.8125rem); }
 .order-row { display: flex; align-items: center; gap: 12px; padding: 6px 0; border-bottom: 1px solid var(--border-subtle, #e7ece9); }
-.link-button { all: unset; cursor: pointer; color: var(--brand-primary, #1e8a6e); font-weight: 600; }
+.link-button { all: unset; cursor: pointer; color: var(--brand-primary, #1e8a6e); font-weight: var(--font-weight-semibold, 600); }
 .link-button:hover, .link-button:focus-visible { text-decoration: underline; }
 @media (max-width: 700px) { .grid.two { grid-template-columns: 1fr; } }
diff --git a/src/app/features/admin/dashboard/components/dashboard-card.component.scss b/src/app/features/admin/dashboard/components/dashboard-card.component.scss
index 0de95a2..eeabb2e 100644
--- a/src/app/features/admin/dashboard/components/dashboard-card.component.scss
+++ b/src/app/features/admin/dashboard/components/dashboard-card.component.scss
@@ -22,7 +22,7 @@
 .dashboard-card__title {
   margin: 0;
   font-size: var(--font-size-xl, 1.125rem);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   color: var(--text-primary);
   flex: 1 1 auto;
 }
diff --git a/src/app/features/admin/dashboard/components/dashboard-metric.component.scss b/src/app/features/admin/dashboard/components/dashboard-metric.component.scss
index 81de96a..4afd622 100644
--- a/src/app/features/admin/dashboard/components/dashboard-metric.component.scss
+++ b/src/app/features/admin/dashboard/components/dashboard-metric.component.scss
@@ -7,7 +7,7 @@
 
 .dashboard-metric__label {
   font-size: var(--font-size-xs, 0.75rem);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   letter-spacing: 0.4px;
   text-transform: uppercase;
   color: var(--text-light);
@@ -18,7 +18,7 @@
   align-items: center;
   gap: var(--space-xs);
   font-size: var(--font-size-xl, 1.125rem);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   color: var(--text-primary);
   overflow: hidden;
   text-overflow: ellipsis;
@@ -27,7 +27,7 @@
 
 .dashboard-metric__badge {
   font-size: var(--font-size-xs, 0.75rem);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   letter-spacing: 0.4px;
   text-transform: uppercase;
   padding: 2px 8px;
diff --git a/src/app/features/admin/dashboard/components/dashboard-section.component.scss b/src/app/features/admin/dashboard/components/dashboard-section.component.scss
index 3cd22d1..56be381 100644
--- a/src/app/features/admin/dashboard/components/dashboard-section.component.scss
+++ b/src/app/features/admin/dashboard/components/dashboard-section.component.scss
@@ -14,7 +14,7 @@
 .dashboard-section__title {
   margin: 0;
   font-size: var(--font-size-xl, 1.125rem);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   color: var(--text-primary);
   flex: 1 1 auto;
 }
diff --git a/src/app/features/admin/dashboard/components/dashboard-shortcut-card.component.scss b/src/app/features/admin/dashboard/components/dashboard-shortcut-card.component.scss
index 332227f..2b06be4 100644
--- a/src/app/features/admin/dashboard/components/dashboard-shortcut-card.component.scss
+++ b/src/app/features/admin/dashboard/components/dashboard-shortcut-card.component.scss
@@ -57,7 +57,7 @@
 
 .dashboard-shortcut-card__title {
   font-size: var(--font-size-lg, 1rem);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   color: var(--text-primary);
 }
 
@@ -75,7 +75,7 @@
   top: var(--space-sm);
   right: var(--space-sm);
   font-size: var(--font-size-xs, 0.75rem);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   padding: 2px 8px;
   border-radius: var(--radius-lg);
   background: color-mix(in srgb, var(--primary-color) 8%, transparent);
diff --git a/src/app/features/admin/dashboard/components/dashboard-status-row.component.scss b/src/app/features/admin/dashboard/components/dashboard-status-row.component.scss
index 88c21e8..2043f4a 100644
--- a/src/app/features/admin/dashboard/components/dashboard-status-row.component.scss
+++ b/src/app/features/admin/dashboard/components/dashboard-status-row.component.scss
@@ -21,7 +21,7 @@
 }
 
 .dashboard-status-row__value {
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   color: var(--text-primary);
 }
 
diff --git a/src/app/features/admin/dashboard/pages/admin-dashboard-page.component.scss b/src/app/features/admin/dashboard/pages/admin-dashboard-page.component.scss
index 06b96f3..c075539 100644
--- a/src/app/features/admin/dashboard/pages/admin-dashboard-page.component.scss
+++ b/src/app/features/admin/dashboard/pages/admin-dashboard-page.component.scss
@@ -35,7 +35,7 @@
 .dashboard-welcome__eyebrow {
   margin: 0;
   font-size: var(--font-size-xs, 0.75rem);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   letter-spacing: 0.4px;
   text-transform: uppercase;
   color: rgba(255, 255, 255, 0.75);
@@ -44,7 +44,7 @@
 .dashboard-welcome__title {
   margin: 0;
   font-size: clamp(1.5rem, 3vw, 2rem);
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   line-height: 1.25;
   display: flex;
   align-items: center;
@@ -54,7 +54,7 @@
 
 .dashboard-welcome__env-badge {
   font-size: var(--font-size-xs, 0.75rem);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   letter-spacing: 0.4px;
   text-transform: uppercase;
   padding: 2px 10px;
@@ -110,7 +110,7 @@
   margin: 0;
   font-size: var(--font-size-lg, 1rem);
   color: var(--success-color);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
 }
 
 .dashboard-draft__fields {
@@ -180,7 +180,7 @@
 .dashboard-doc-list__badge {
   margin-left: auto;
   font-size: var(--font-size-xs, 0.75rem);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   padding: 2px 8px;
   border-radius: var(--radius-lg);
   background: var(--bg-tertiary);
diff --git a/src/app/features/admin/moderation/components/moderation-dashboard/moderation-dashboard.component.scss b/src/app/features/admin/moderation/components/moderation-dashboard/moderation-dashboard.component.scss
index 9a992d0..b2c927c 100644
--- a/src/app/features/admin/moderation/components/moderation-dashboard/moderation-dashboard.component.scss
+++ b/src/app/features/admin/moderation/components/moderation-dashboard/moderation-dashboard.component.scss
@@ -2,6 +2,6 @@
 .moderation-dashboard__metrics { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 12px; }
 @media (max-width: 1100px) { .moderation-dashboard__metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
 @media (max-width: 640px) { .moderation-dashboard__metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
-.moderation-dashboard__activity h4 { margin: 0 0 8px; font-size: var(--font-size-md, 0.9375rem); font-weight: 700; }
+.moderation-dashboard__activity h4 { margin: 0 0 8px; font-size: var(--font-size-md, 0.9375rem); font-weight: var(--font-weight-bold, 700); }
 .moderation-dashboard__activity ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; font-size: var(--font-size-sm, 0.8125rem); color: var(--text-secondary, #5f6e6a); }
 .moderation-dashboard__activity p { margin: 0; font-size: var(--font-size-sm, 0.8125rem); color: var(--text-secondary, #5f6e6a); }
diff --git a/src/app/features/admin/moderation/components/review-health-widget/review-health-widget.component.scss b/src/app/features/admin/moderation/components/review-health-widget/review-health-widget.component.scss
index 726e1fd..dd9a8fb 100644
--- a/src/app/features/admin/moderation/components/review-health-widget/review-health-widget.component.scss
+++ b/src/app/features/admin/moderation/components/review-health-widget/review-health-widget.component.scss
@@ -1,7 +1,7 @@
 .review-health { display: grid; gap: 6px; align-items: center; }
 .review-health__bar { height: 6px; border-radius: var(--radius-full, 999px); background: var(--surface-muted, #eef2f0); overflow: hidden; }
 .review-health__bar-fill { height: 100%; background: var(--brand-primary, #1e8a6e); }
-.review-health__percent { font-size: var(--font-size-xs, 0.75rem); font-weight: 700; color: var(--text-secondary, #5f6e6a); }
+.review-health__percent { font-size: var(--font-size-xs, 0.75rem); font-weight: var(--font-weight-bold, 700); color: var(--text-secondary, #5f6e6a); }
 .review-health__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; font-size: var(--font-size-xs, 0.75rem); color: var(--text-secondary, #5f6e6a); }
 .review-health__list li { display: flex; align-items: center; gap: 6px; }
 .review-health__list-item--done { color: var(--text-primary, #1e3c38); }
diff --git a/src/app/features/admin/moderation/pages/admin-reports-list-page.component.scss b/src/app/features/admin/moderation/pages/admin-reports-list-page.component.scss
index e9837e6..dc8d661 100644
--- a/src/app/features/admin/moderation/pages/admin-reports-list-page.component.scss
+++ b/src/app/features/admin/moderation/pages/admin-reports-list-page.component.scss
@@ -2,5 +2,5 @@
 .toolbar { display: flex; align-items: center; gap: 12px; }
 .toolbar h1 { margin: 0; font-size: var(--font-size-2xl, 1.25rem); }
 .actions { display: flex; gap: 8px; }
-.link-button { all: unset; cursor: pointer; color: var(--brand-primary, #1e8a6e); font-weight: 600; }
+.link-button { all: unset; cursor: pointer; color: var(--brand-primary, #1e8a6e); font-weight: var(--font-weight-semibold, 600); }
 .link-button:hover, .link-button:focus-visible { text-decoration: underline; }
diff --git a/src/app/features/admin/orders/components/order-timeline/order-timeline.component.scss b/src/app/features/admin/orders/components/order-timeline/order-timeline.component.scss
index 2a85591..020e002 100644
--- a/src/app/features/admin/orders/components/order-timeline/order-timeline.component.scss
+++ b/src/app/features/admin/orders/components/order-timeline/order-timeline.component.scss
@@ -46,7 +46,7 @@
 }
 
 .order-timeline__status {
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   color: var(--text-primary, #1e3c38);
 }
 
diff --git a/src/app/features/admin/orders/components/orders-dashboard/orders-dashboard.component.scss b/src/app/features/admin/orders/components/orders-dashboard/orders-dashboard.component.scss
index 71b9da3..b3bcac3 100644
--- a/src/app/features/admin/orders/components/orders-dashboard/orders-dashboard.component.scss
+++ b/src/app/features/admin/orders/components/orders-dashboard/orders-dashboard.component.scss
@@ -31,7 +31,7 @@
 .orders-dashboard__activity h4 {
   margin: 0 0 8px;
   font-size: var(--font-size-md, 0.9375rem);
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
 }
 
 .orders-dashboard__activity ul {
diff --git a/src/app/features/admin/orders/pages/admin-order-detail-page.component.scss b/src/app/features/admin/orders/pages/admin-order-detail-page.component.scss
index 05eb85a..57d54a1 100644
--- a/src/app/features/admin/orders/pages/admin-order-detail-page.component.scss
+++ b/src/app/features/admin/orders/pages/admin-order-detail-page.component.scss
@@ -7,7 +7,7 @@
 .card { border: 1px solid var(--border-color, #d3dad9); border-radius: var(--radius-md); padding: 14px; display: grid; gap: 6px; }
 .card h3 { margin: 0 0 6px; }
 .card p { margin: 0; }
-.total { font-weight: 600; }
+.total { font-weight: var(--font-weight-semibold, 600); }
 select, textarea { width: 100%; padding: 8px 10px; border: 1px solid var(--border-color, #d3dad9); border-radius: var(--radius-sm); font: inherit; }
 .actions { display: flex; gap: 8px; }
 @media (max-width: 700px) { .grid.two { grid-template-columns: 1fr; } }
@@ -17,12 +17,12 @@ select, textarea { width: 100%; padding: 8px 10px; border: 1px solid var(--borde
   all: unset;
   cursor: pointer;
   color: var(--brand-primary, #1e8a6e);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
 
   &:hover, &:focus-visible { text-decoration: underline; }
 }
 
-.print-only { display: none; margin: 0; font-weight: 600; }
+.print-only { display: none; margin: 0; font-weight: var(--font-weight-semibold, 600); }
 
 .status-stepper {
   list-style: none;
@@ -60,7 +60,7 @@ select, textarea { width: 100%; padding: 8px 10px; border: 1px solid var(--borde
 
 .status-stepper__label {
   font-size: var(--font-size-sm, 0.8125rem);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   color: var(--text-secondary, #5f6e6a);
 }
 
@@ -70,6 +70,6 @@ select, textarea { width: 100%; padding: 8px 10px; border: 1px solid var(--borde
 }
 
 .status-stepper__terminal {
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   color: var(--text-primary, #1e3c38);
 }
diff --git a/src/app/features/admin/products/components/admin-product-form.component.scss b/src/app/features/admin/products/components/admin-product-form.component.scss
index 5350a92..7a43892 100644
--- a/src/app/features/admin/products/components/admin-product-form.component.scss
+++ b/src/app/features/admin/products/components/admin-product-form.component.scss
@@ -3,7 +3,7 @@
 .grid.one { grid-template-columns: 1fr; }
 .grid.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
 .grid.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
-label { display: grid; gap: 6px; font-weight: 600; }
+label { display: grid; gap: 6px; font-weight: var(--font-weight-semibold, 600); }
 label.full, app-form-field.full { grid-column: 1 / -1; }
 label.check { display: flex; align-items: center; gap: 8px; }
 textarea, select { width: 100%; padding: 10px 12px; border: 1px solid var(--border-color, #d3dad9); border-radius: 10px; font: inherit; }
@@ -32,7 +32,7 @@ input[type='checkbox'] { width: auto; }
   }
 }
 .related-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
-.price-preview { font-weight: 600; }
+.price-preview { font-weight: var(--font-weight-semibold, 600); }
 .actions { display: flex; justify-content: flex-end; }
 @media (max-width: 700px) { .related-grid { grid-template-columns: 1fr; } }
 @media (max-width: 900px) { .grid.two, .grid.three, .readonly-grid { grid-template-columns: 1fr; } }
@@ -46,7 +46,7 @@ input[type='checkbox'] { width: auto; }
   padding: 10px 14px;
   border-radius: 8px 8px 0 0;
   font-size: var(--font-size-base, 0.875rem);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   color: var(--text-secondary, #5f6e6a);
   display: inline-flex;
   align-items: center;
@@ -56,11 +56,11 @@ input[type='checkbox'] { width: auto; }
 }
 .form-card__tab--active { color: var(--brand-primary, #1e8a6e); background: var(--surface-muted, #eef2f0); }
 .form-card__panel { min-height: 200px; display: grid; gap: 14px; }
-.form-card__subheading { margin: 8px 0 0; font-size: var(--font-size-sm, 0.8125rem); font-weight: 700; text-transform: uppercase; letter-spacing: 0.03em; color: var(--text-secondary, #5f6e6a); }
+.form-card__subheading { margin: 8px 0 0; font-size: var(--font-size-sm, 0.8125rem); font-weight: var(--font-weight-bold, 700); text-transform: uppercase; letter-spacing: 0.03em; color: var(--text-secondary, #5f6e6a); }
 .form-card__explain { margin: 0; font-size: var(--font-size-sm, 0.8125rem); color: var(--text-secondary, #5f6e6a); }
 .form-card__group { border: 1px solid var(--border-subtle, #e7ece9); border-radius: 10px; padding: 10px 14px; }
-.form-card__group summary { cursor: pointer; font-weight: 700; color: var(--text-primary, #1e3c38); }
-.toggle-row { display: flex; align-items: center; gap: 8px; font-weight: 400; }
+.form-card__group summary { cursor: pointer; font-weight: var(--font-weight-bold, 700); color: var(--text-primary, #1e3c38); }
+.toggle-row { display: flex; align-items: center; gap: 8px; font-weight: var(--font-weight-normal, 400); }
 
 .seo-preview {
   border: 1px solid var(--border-subtle, #e7ece9);
@@ -86,7 +86,7 @@ input[type='checkbox'] { width: auto; }
     align-items: center;
     gap: 8px;
     cursor: pointer;
-    font-weight: 600;
+    font-weight: var(--font-weight-semibold, 600);
     font-size: var(--font-size-base, 0.875rem);
 
     &:focus-visible { outline: 2px solid var(--color-primary, #2f8f5b); outline-offset: 2px; }
@@ -98,7 +98,7 @@ input[type='checkbox'] { width: auto; }
   margin-left: auto;
   color: var(--text-secondary, #6b7280);
   font-size: var(--font-size-sm, 0.8125rem);
-  font-weight: 400;
+  font-weight: var(--font-weight-normal, 400);
 }
 .translations-block__hint {
   margin: 0 0 10px;
@@ -110,7 +110,7 @@ input[type='checkbox'] { width: auto; }
 .badge-chip {
   display: inline-flex; align-items: center; gap: 4px;
   min-height: 24px; padding: 3px 10px; border-radius: var(--radius-full, 999px);
-  color: #fff; font-size: var(--font-size-xs, 0.75rem); font-weight: 700; text-transform: uppercase;
+  color: #fff; font-size: var(--font-size-xs, 0.75rem); font-weight: var(--font-weight-bold, 700); text-transform: uppercase;
   border: none;
 }
 .badge-chip--add { cursor: pointer; opacity: 0.55; &:hover { opacity: 1; } &:focus-visible { outline: 2px solid var(--color-primary, #2f8f5b); outline-offset: 2px; opacity: 1; } }
diff --git a/src/app/features/admin/products/components/admin-products-list.component.scss b/src/app/features/admin/products/components/admin-products-list.component.scss
index 3bfe40d..9425b18 100644
--- a/src/app/features/admin/products/components/admin-products-list.component.scss
+++ b/src/app/features/admin/products/components/admin-products-list.component.scss
@@ -22,7 +22,7 @@ select { min-height: 40px; padding: 0 10px; border: 1px solid var(--border-color
 .product-grid__select { position: absolute; top: 8px; left: 8px; z-index: 1; }
 .product-grid__image { width: 100%; height: 120px; object-fit: cover; border-radius: var(--radius-sm); background: var(--surface-muted, #eef2f0); }
 .product-grid__image--placeholder { display: flex; align-items: center; justify-content: center; font-size: var(--font-size-xs, 0.75rem); color: var(--text-tertiary, #9aa6a2); }
-.product-grid__name { margin: 0; font-size: var(--font-size-sm, 0.8125rem); font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.product-grid__name { margin: 0; font-size: var(--font-size-sm, 0.8125rem); font-weight: var(--font-weight-bold, 700); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
 .product-grid__price { margin: 0; font-size: var(--font-size-sm, 0.8125rem); color: var(--text-secondary, #5f6e6a); }
 .product-grid__actions { display: flex; gap: 6px; flex-wrap: wrap; }
 
diff --git a/src/app/features/admin/products/components/product-health-widget/product-health-widget.component.scss b/src/app/features/admin/products/components/product-health-widget/product-health-widget.component.scss
index 4d937a2..2b213d2 100644
--- a/src/app/features/admin/products/components/product-health-widget/product-health-widget.component.scss
+++ b/src/app/features/admin/products/components/product-health-widget/product-health-widget.component.scss
@@ -18,7 +18,7 @@
 
 .product-health__percent {
   font-size: var(--font-size-xs, 0.75rem);
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   color: var(--text-secondary, #5f6e6a);
 }
 
diff --git a/src/app/features/admin/products/components/product-variants-editor/product-variants-editor.component.scss b/src/app/features/admin/products/components/product-variants-editor/product-variants-editor.component.scss
index f15b739..b6b4f8e 100644
--- a/src/app/features/admin/products/components/product-variants-editor/product-variants-editor.component.scss
+++ b/src/app/features/admin/products/components/product-variants-editor/product-variants-editor.component.scss
@@ -82,7 +82,7 @@
 
   button { border: none; background: transparent; cursor: pointer; color: var(--text-secondary, #6b7280); }
 }
-.price-row__currency { font-weight: 700; font-size: var(--font-size-sm, 0.8125rem); min-width: 32px; }
+.price-row__currency { font-weight: var(--font-weight-bold, 700); font-size: var(--font-size-sm, 0.8125rem); min-width: 32px; }
 .price-row--add { gap: 4px; }
 
 @media (max-width: 640px) {
diff --git a/src/app/features/admin/products/components/products-dashboard/products-dashboard.component.scss b/src/app/features/admin/products/components/products-dashboard/products-dashboard.component.scss
index 29de639..6c79d8a 100644
--- a/src/app/features/admin/products/components/products-dashboard/products-dashboard.component.scss
+++ b/src/app/features/admin/products/components/products-dashboard/products-dashboard.component.scss
@@ -43,7 +43,7 @@
   h4 {
     margin: 0;
     font-size: var(--font-size-md, 0.9375rem);
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
   }
 
   p {
diff --git a/src/app/features/admin/shell/admin-layout.component.scss b/src/app/features/admin/shell/admin-layout.component.scss
index 28dd71e..0cb80fd 100644
--- a/src/app/features/admin/shell/admin-layout.component.scss
+++ b/src/app/features/admin/shell/admin-layout.component.scss
@@ -80,7 +80,7 @@
   padding: var(--space-md);
   text-decoration: none;
   color: var(--text-primary);
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   border-bottom: 1px solid var(--border-color);
 }
 
@@ -114,7 +114,7 @@
 .admin-layout__nav-group {
   padding: var(--space-md) var(--space-sm) var(--space-xs);
   font-size: var(--font-size-xs, 0.75rem);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   letter-spacing: 0.4px;
   text-transform: uppercase;
   color: var(--text-light);
@@ -154,7 +154,7 @@
   &--active {
     background: color-mix(in srgb, var(--primary-color) 8%, transparent);
     color: var(--primary-color);
-    font-weight: 600;
+    font-weight: var(--font-weight-semibold, 600);
   }
 
   &--disabled {
@@ -171,7 +171,7 @@
 .admin-layout__soon-badge {
   margin-left: auto;
   font-size: var(--font-size-xs, 0.75rem);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   padding: 2px 8px;
   border-radius: var(--radius-lg);
   background: color-mix(in srgb, var(--primary-color) 8%, transparent);
@@ -263,7 +263,7 @@
 .admin-layout__title {
   margin: 0;
   font-size: var(--font-size-xl, 1.125rem);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   line-height: 1.3;
   white-space: nowrap;
   overflow: hidden;
@@ -384,13 +384,13 @@
   background: var(--primary-color);
   color: #fff;
   font-size: var(--font-size-xs, 0.75rem);
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   flex-shrink: 0;
 }
 
 .admin-layout__account-name {
   font-size: var(--font-size-xs, 0.75rem);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   max-width: 140px;
   overflow: hidden;
   text-overflow: ellipsis;
diff --git a/src/app/features/backoffice/media/components/asset-tile/asset-tile.component.scss b/src/app/features/backoffice/media/components/asset-tile/asset-tile.component.scss
index eced555..09e3687 100644
--- a/src/app/features/backoffice/media/components/asset-tile/asset-tile.component.scss
+++ b/src/app/features/backoffice/media/components/asset-tile/asset-tile.component.scss
@@ -55,7 +55,7 @@
 
 .asset-tile__filename {
   font-size: var(--font-size-sm, 0.8125rem);
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   color: var(--text-primary, #1e3c38);
   overflow: hidden;
   text-overflow: ellipsis;
diff --git a/src/app/features/backoffice/shared/backoffice-coming-soon-page.component.scss b/src/app/features/backoffice/shared/backoffice-coming-soon-page.component.scss
index 9286929..699a5a6 100644
--- a/src/app/features/backoffice/shared/backoffice-coming-soon-page.component.scss
+++ b/src/app/features/backoffice/shared/backoffice-coming-soon-page.component.scss
@@ -23,7 +23,7 @@
 
 .coming-soon__link {
   color: var(--primary-color, #497671);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   text-decoration: none;
 }
 
diff --git a/src/app/features/content-management/components/content-dashboard/content-dashboard.component.scss b/src/app/features/content-management/components/content-dashboard/content-dashboard.component.scss
index 56e1af0..f84149b 100644
--- a/src/app/features/content-management/components/content-dashboard/content-dashboard.component.scss
+++ b/src/app/features/content-management/components/content-dashboard/content-dashboard.component.scss
@@ -36,7 +36,7 @@
   h4 {
     margin: 0;
     font-size: var(--font-size-md, 0.9375rem);
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
   }
 
   p {
diff --git a/src/app/features/content-management/components/content-health-widget/content-health-widget.component.scss b/src/app/features/content-management/components/content-health-widget/content-health-widget.component.scss
index c2f45aa..18a7fcb 100644
--- a/src/app/features/content-management/components/content-health-widget/content-health-widget.component.scss
+++ b/src/app/features/content-management/components/content-health-widget/content-health-widget.component.scss
@@ -11,7 +11,7 @@
   h4 {
     margin: 0;
     font-size: var(--font-size-md, 0.9375rem);
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
     color: var(--text-primary, #1e3c38);
   }
 }
diff --git a/src/app/features/content-management/components/page-card/page-card.component.scss b/src/app/features/content-management/components/page-card/page-card.component.scss
index 76ae4e1..dcd5582 100644
--- a/src/app/features/content-management/components/page-card/page-card.component.scss
+++ b/src/app/features/content-management/components/page-card/page-card.component.scss
@@ -41,7 +41,7 @@
 .page-card-tile__title {
   margin: 0;
   font-size: var(--font-size-lg, 1rem);
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   color: var(--text-primary, #1e3c38);
   overflow: hidden;
   text-overflow: ellipsis;
diff --git a/src/app/features/content-management/components/page-editor/page-editor.component.scss b/src/app/features/content-management/components/page-editor/page-editor.component.scss
index b477e09..f91fcb1 100644
--- a/src/app/features/content-management/components/page-editor/page-editor.component.scss
+++ b/src/app/features/content-management/components/page-editor/page-editor.component.scss
@@ -14,7 +14,7 @@
 .page-editor__title {
   margin: 0;
   font-size: var(--font-size-xl, 1.125rem);
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   color: var(--text-primary, #1e3c38);
   flex: 1;
   min-width: 160px;
@@ -39,7 +39,7 @@
   padding: 10px 14px;
   border-radius: 8px 8px 0 0;
   font-size: var(--font-size-base, 0.875rem);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   color: var(--text-secondary, #5f6e6a);
   display: inline-flex;
   align-items: center;
@@ -93,7 +93,7 @@
 
 .media-block__label {
   font-size: var(--font-size-sm, 0.8125rem);
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   color: var(--text-primary, #1e3c38);
 }
 
@@ -116,7 +116,7 @@
 
   summary {
     cursor: pointer;
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
     color: var(--text-primary, #1e3c38);
   }
 }
diff --git a/src/app/features/content-management/components/static-page-preview/static-page-preview.component.scss b/src/app/features/content-management/components/static-page-preview/static-page-preview.component.scss
index e60888d..2b3d895 100644
--- a/src/app/features/content-management/components/static-page-preview/static-page-preview.component.scss
+++ b/src/app/features/content-management/components/static-page-preview/static-page-preview.component.scss
@@ -30,7 +30,7 @@
 .static-page-preview__title {
   margin: 0 0 1rem;
   font-size: var(--font-size-3xl, 1.5rem);
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   color: var(--text-primary, #1e3c38);
 }
 
diff --git a/src/app/features/project-editor/components/html-editor/marketplace-html-editor.component.scss b/src/app/features/project-editor/components/html-editor/marketplace-html-editor.component.scss
index 16511ef..9690c4a 100644
--- a/src/app/features/project-editor/components/html-editor/marketplace-html-editor.component.scss
+++ b/src/app/features/project-editor/components/html-editor/marketplace-html-editor.component.scss
@@ -50,7 +50,7 @@
   &:focus-visible { outline: 2px solid var(--color-primary, #2f8f5b); outline-offset: 1px; }
 }
 
-.html-editor-toolbar__btn--bold { font-weight: 700; }
+.html-editor-toolbar__btn--bold { font-weight: var(--font-weight-bold, 700); }
 .html-editor-toolbar__btn--italic { font-style: italic; font-family: serif; }
 .html-editor-toolbar__btn--underline { text-decoration: underline; }
 .html-editor-toolbar__btn--wide { padding: 0 10px; font-size: var(--font-size-sm, 0.8125rem); color: var(--text-secondary, #6b7280); }
diff --git a/src/app/features/project-editor/components/project-editor-nav.component.scss b/src/app/features/project-editor/components/project-editor-nav.component.scss
index 730f794..69d0cff 100644
--- a/src/app/features/project-editor/components/project-editor-nav.component.scss
+++ b/src/app/features/project-editor/components/project-editor-nav.component.scss
@@ -20,7 +20,7 @@
 .editor-nav-group__label {
   flex: 1 1 auto;
   font-size: var(--font-size-xs, 0.75rem);
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   letter-spacing: 0.4px;
   text-transform: uppercase;
   color: var(--text-light);
@@ -66,7 +66,7 @@
   background: none;
   color: var(--text-primary);
   padding: 0 var(--space-sm);
-  font-weight: 500;
+  font-weight: var(--font-weight-medium, 500);
   font-size: var(--font-size-lg, 1rem);
   cursor: pointer;
   text-decoration: none;
@@ -84,7 +84,7 @@
   &.active {
     background: color-mix(in srgb, var(--primary-color) 8%, transparent);
     color: var(--primary-color);
-    font-weight: 600;
+    font-weight: var(--font-weight-semibold, 600);
   }
 }
 
@@ -129,7 +129,7 @@
   background: var(--error-color);
   color: #fff;
   font-size: var(--font-size-xs, 0.75rem);
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   line-height: 1;
   flex-shrink: 0;
 }
diff --git a/src/app/features/project-editor/pages/builder-overview-page.component.scss b/src/app/features/project-editor/pages/builder-overview-page.component.scss
index e1d0af2..dbff885 100644
--- a/src/app/features/project-editor/pages/builder-overview-page.component.scss
+++ b/src/app/features/project-editor/pages/builder-overview-page.component.scss
@@ -13,7 +13,7 @@
   gap: var(--space-xs);
   align-self: flex-start;
   font-size: var(--font-size-xs, 0.75rem);
-  font-weight: 500;
+  font-weight: var(--font-weight-medium, 500);
   color: var(--text-secondary);
   text-decoration: none;
 
@@ -40,7 +40,7 @@
 .builder-overview__eyebrow {
   margin: 0;
   font-size: var(--font-size-xs, 0.75rem);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   letter-spacing: 0.4px;
   text-transform: uppercase;
   color: rgba(255, 255, 255, 0.75);
@@ -49,7 +49,7 @@
 .builder-overview__title {
   margin: 0;
   font-size: clamp(1.5rem, 3vw, 2rem);
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
 }
 
 .builder-overview__subtitle {
@@ -78,7 +78,7 @@
 
 .builder-overview__readiness-label {
   margin: var(--space-xs) 0 0;
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
 }
 
 .builder-overview__readiness-hint {
@@ -104,7 +104,7 @@
 .builder-overview__next-step-label {
   margin: 0;
   font-size: var(--font-size-xs, 0.75rem);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   letter-spacing: 0.4px;
   text-transform: uppercase;
   color: rgba(255, 255, 255, 0.75);
@@ -112,14 +112,14 @@
 
 .builder-overview__next-step-link {
   color: #fff;
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   font-size: var(--font-size-lg, 1rem);
   text-decoration: underline;
 }
 
 .builder-overview__next-step-done {
   margin: 0;
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
 }
 
 .builder-overview__section {
@@ -130,7 +130,7 @@
   h2 {
     margin: 0;
     font-size: var(--font-size-xl, 1.125rem);
-    font-weight: 600;
+    font-weight: var(--font-weight-semibold, 600);
     color: var(--text-primary);
   }
 }
@@ -201,7 +201,7 @@
 .builder-overview__card-title {
   margin: 0;
   font-size: var(--font-size-xl, 1.125rem);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   color: var(--text-primary);
 }
 
@@ -214,7 +214,7 @@
 
 .builder-overview__card-cta {
   font-size: var(--font-size-xs, 0.75rem);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   color: var(--primary-color);
 }
 
@@ -268,7 +268,7 @@
   background: var(--bg-primary);
   color: var(--text-primary);
   text-decoration: none;
-  font-weight: 500;
+  font-weight: var(--font-weight-medium, 500);
 
   &:hover {
     border-color: var(--primary-color);
diff --git a/src/app/features/project-editor/pages/project-editor-page.component.scss b/src/app/features/project-editor/pages/project-editor-page.component.scss
index 9113484..26bf1a3 100644
--- a/src/app/features/project-editor/pages/project-editor-page.component.scss
+++ b/src/app/features/project-editor/pages/project-editor-page.component.scss
@@ -38,7 +38,7 @@
   margin-bottom: var(--space-md);
   border-radius: var(--radius-sm);
   color: var(--text-primary);
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   text-decoration: none;
 
   &:hover {
@@ -160,14 +160,14 @@
   h1 {
     margin: 0;
     font-size: clamp(1.5rem, 3vw, 2rem);
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
     color: var(--text-primary);
   }
 }
 
 .project-editor-layout__badge {
   font-size: var(--font-size-xs, 0.75rem);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   letter-spacing: 0.4px;
   text-transform: uppercase;
   padding: 2px 8px;
@@ -205,7 +205,7 @@
   border-radius: var(--radius-sm);
   background: var(--bg-primary);
   color: var(--text-primary);
-  font-weight: 500;
+  font-weight: var(--font-weight-medium, 500);
   cursor: pointer;
   flex-shrink: 0;
   white-space: nowrap;
@@ -233,7 +233,7 @@
   h2 {
     margin: 0 0 4px;
     font-size: var(--font-size-xs, 0.75rem);
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
     letter-spacing: 0.4px;
     text-transform: uppercase;
     color: var(--text-light);
diff --git a/src/app/features/project-editor/sections/brand/brand-overview.component.scss b/src/app/features/project-editor/sections/brand/brand-overview.component.scss
index 38e2a35..0079e43 100644
--- a/src/app/features/project-editor/sections/brand/brand-overview.component.scss
+++ b/src/app/features/project-editor/sections/brand/brand-overview.component.scss
@@ -24,7 +24,7 @@
   border-radius: 50%;
   display: grid;
   place-items: center;
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   font-size: var(--font-size-xl, 1.125rem);
   color: var(--text-primary);
 
@@ -45,7 +45,7 @@
   h2 {
     margin: 0;
     font-size: var(--font-size-xl, 1.125rem);
-    font-weight: 600;
+    font-weight: var(--font-weight-semibold, 600);
     color: var(--text-primary);
   }
 
@@ -60,7 +60,7 @@
   display: flex;
   align-items: center;
   gap: var(--space-xs);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   color: var(--primary-color);
 
   &--done {
@@ -117,7 +117,7 @@
   h3 {
     margin: 0 0 var(--space-sm);
     font-size: var(--font-size-xs, 0.75rem);
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
     letter-spacing: 0.4px;
     text-transform: uppercase;
     color: var(--text-light);
@@ -161,7 +161,7 @@
   background: color-mix(in srgb, var(--warning-color) 12%, transparent);
   color: var(--warning-color);
   font-size: var(--font-size-xs, 0.75rem);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
 }
 
 .brand-overview__type-sample {
@@ -174,7 +174,7 @@
 .brand-overview__type-heading {
   margin: 0 0 4px;
   font-size: var(--font-size-xl, 1.125rem);
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   color: var(--text-primary);
 }
 
@@ -205,7 +205,7 @@
 
 .brand-overview__social-title {
   margin: 0;
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   font-size: var(--font-size-lg, 1rem);
   color: var(--text-primary);
 }
diff --git a/src/app/features/project-editor/sections/homepage/homepage-overview.component.scss b/src/app/features/project-editor/sections/homepage/homepage-overview.component.scss
index c9f303d..a50bc6e 100644
--- a/src/app/features/project-editor/sections/homepage/homepage-overview.component.scss
+++ b/src/app/features/project-editor/sections/homepage/homepage-overview.component.scss
@@ -24,7 +24,7 @@
   border-radius: 50%;
   display: grid;
   place-items: center;
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   font-size: var(--font-size-xl, 1.125rem);
   color: var(--text-primary);
 
@@ -45,7 +45,7 @@
   h2 {
     margin: 0;
     font-size: var(--font-size-xl, 1.125rem);
-    font-weight: 600;
+    font-weight: var(--font-weight-semibold, 600);
     color: var(--text-primary);
   }
 
@@ -64,7 +64,7 @@
   display: flex;
   align-items: center;
   gap: var(--space-xs);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   color: var(--primary-color);
 
   &--done {
diff --git a/src/app/features/project-editor/sections/section.shared.scss b/src/app/features/project-editor/sections/section.shared.scss
index 1a6f1a5..b5c1e4a 100644
--- a/src/app/features/project-editor/sections/section.shared.scss
+++ b/src/app/features/project-editor/sections/section.shared.scss
@@ -34,7 +34,7 @@ label {
   display: grid;
   gap: 6px;
   color: var(--text-primary, #1e3c38);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
 }
 
 label.full,
@@ -44,7 +44,7 @@ app-form-field.full {
 
 .field-desc {
   display: block;
-  font-weight: 400;
+  font-weight: var(--font-weight-normal, 400);
   font-size: var(--font-size-xs, 0.75rem);
   line-height: 1.4;
   color: var(--text-secondary, #5f6e6a);
@@ -109,7 +109,7 @@ button {
   background: #497671;
   color: #fff;
   padding: 0 14px;
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   cursor: pointer;
   transition: background-color var(--transition-fast, 120ms ease),
     border-color var(--transition-fast, 120ms ease),
@@ -207,7 +207,7 @@ button.secondary {
 
   th {
     color: var(--text-secondary, #5f6e6a);
-    font-weight: 600;
+    font-weight: var(--font-weight-semibold, 600);
   }
 
   .preview-before {
@@ -217,7 +217,7 @@ button.secondary {
 
   .preview-after {
     color: var(--text-primary, #1e3c38);
-    font-weight: 600;
+    font-weight: var(--font-weight-semibold, 600);
   }
 }
 
@@ -235,8 +235,8 @@ button.secondary {
   display: inline-flex; align-items: center; gap: 6px;
   padding: 4px 10px; border-radius: var(--radius-full, 999px);
   border: 1px solid var(--border-color, #d3dad9);
-  font-size: var(--font-size-sm, 0.8125rem); font-weight: 600;
-  em { font-style: normal; font-weight: 400; font-size: var(--font-size-xs, 0.75rem); color: var(--text-secondary, #6b7280); }
+  font-size: var(--font-size-sm, 0.8125rem); font-weight: var(--font-weight-semibold, 600);
+  em { font-style: normal; font-weight: var(--font-weight-normal, 400); font-size: var(--font-size-xs, 0.75rem); color: var(--text-secondary, #6b7280); }
 }
 .languages-summary__chip--default { border-color: var(--color-primary, #2f8f5b); }
 .languages-summary__manage { font-size: var(--font-size-sm, 0.8125rem); text-decoration: underline; color: var(--text-primary, #1e3c38); }
diff --git a/src/app/features/project-editor/sections/widgets-section.component.scss b/src/app/features/project-editor/sections/widgets-section.component.scss
index 9cb4952..685cce3 100644
--- a/src/app/features/project-editor/sections/widgets-section.component.scss
+++ b/src/app/features/project-editor/sections/widgets-section.component.scss
@@ -19,7 +19,7 @@
 .widget-card__title {
   margin: 0;
   font-size: var(--font-size-xl, 1.125rem);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   color: var(--text-primary);
   flex: 1 1 auto;
   min-width: 120px;
@@ -27,7 +27,7 @@
 
 .widget-card__hidden-badge {
   font-size: var(--font-size-xs, 0.75rem);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   letter-spacing: 0.4px;
   text-transform: uppercase;
   padding: 2px 8px;
@@ -90,7 +90,7 @@
   summary {
     cursor: pointer;
     font-size: var(--font-size-xs, 0.75rem);
-    font-weight: 600;
+    font-weight: var(--font-weight-semibold, 600);
     color: var(--text-light);
   }
 }
diff --git a/src/app/features/search/components/empty-results/search-empty-results.component.scss b/src/app/features/search/components/empty-results/search-empty-results.component.scss
index f7576b7..26c15ab 100644
--- a/src/app/features/search/components/empty-results/search-empty-results.component.scss
+++ b/src/app/features/search/components/empty-results/search-empty-results.component.scss
@@ -17,7 +17,7 @@ h3 {
   color: var(--text-primary);
   padding: 0 14px;
   cursor: pointer;
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
 }
 
 .block {
diff --git a/src/app/features/search/components/search-bar/search-bar.component.scss b/src/app/features/search/components/search-bar/search-bar.component.scss
index 7ebddc3..bc210bb 100644
--- a/src/app/features/search/components/search-bar/search-bar.component.scss
+++ b/src/app/features/search/components/search-bar/search-bar.component.scss
@@ -51,7 +51,7 @@
   border-radius: var(--radius-sm);
   background: var(--primary-color);
   color: #fff;
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   padding: 0 14px;
   cursor: pointer;
 }
@@ -108,7 +108,7 @@
 }
 
 .suggestion-title {
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
 }
 
 .suggestion-copy small,
@@ -145,7 +145,7 @@
   background: transparent;
   color: var(--primary-color);
   cursor: pointer;
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
 }
 
 .no-results {
diff --git a/src/app/features/website/catalog/components/catalog-empty-state/catalog-empty-state.component.scss b/src/app/features/website/catalog/components/catalog-empty-state/catalog-empty-state.component.scss
index 8db9fab..86d2a4c 100644
--- a/src/app/features/website/catalog/components/catalog-empty-state/catalog-empty-state.component.scss
+++ b/src/app/features/website/catalog/components/catalog-empty-state/catalog-empty-state.component.scss
@@ -60,7 +60,7 @@
   background: var(--bg-primary);
   color: var(--text-primary);
   padding: 0 16px;
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   cursor: pointer;
   transition: border-color 0.2s ease, transform 0.2s ease;
 }
diff --git a/src/app/features/website/catalog/components/category-grid/category-grid.component.scss b/src/app/features/website/catalog/components/category-grid/category-grid.component.scss
index 32aa56a..3c1fb3e 100644
--- a/src/app/features/website/catalog/components/category-grid/category-grid.component.scss
+++ b/src/app/features/website/catalog/components/category-grid/category-grid.component.scss
@@ -91,7 +91,7 @@
     background: rgba(73, 118, 113, 0.1);
     color: #3d635f;
     font-size: var(--font-size-sm, 0.8125rem);
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
     white-space: nowrap;
   }
 }
diff --git a/src/app/features/website/catalog/components/filters-panel/filters-panel.component.scss b/src/app/features/website/catalog/components/filters-panel/filters-panel.component.scss
index fb49e4a..6c0f4f8 100644
--- a/src/app/features/website/catalog/components/filters-panel/filters-panel.component.scss
+++ b/src/app/features/website/catalog/components/filters-panel/filters-panel.component.scss
@@ -34,7 +34,7 @@
   justify-content: space-between;
   gap: 12px;
   font-size: var(--font-size-md, 0.9375rem);
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   text-align: left;
   cursor: pointer;
   padding: 0;
@@ -83,7 +83,7 @@
 .range-field span {
   margin: 0;
   font-size: var(--font-size-sm, 0.8125rem);
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   letter-spacing: 0.02em;
   text-transform: uppercase;
   color: var(--text-secondary);
@@ -171,7 +171,7 @@
 .slider-inputs span {
   color: var(--text-secondary);
   font-size: 0.88rem;
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
 }
 
 .color-options,
diff --git a/src/app/features/website/catalog/components/layout-switcher/layout-switcher.component.scss b/src/app/features/website/catalog/components/layout-switcher/layout-switcher.component.scss
index aefbb9e..7c503b1 100644
--- a/src/app/features/website/catalog/components/layout-switcher/layout-switcher.component.scss
+++ b/src/app/features/website/catalog/components/layout-switcher/layout-switcher.component.scss
@@ -11,7 +11,7 @@
   border-radius: var(--radius-sm);
   background: var(--bg-primary);
   color: var(--text-primary);
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   padding: 0 12px;
   display: inline-flex;
   align-items: center;
diff --git a/src/app/features/website/catalog/components/search-results/search-results.component.scss b/src/app/features/website/catalog/components/search-results/search-results.component.scss
index 385b4af..6ceab9a 100644
--- a/src/app/features/website/catalog/components/search-results/search-results.component.scss
+++ b/src/app/features/website/catalog/components/search-results/search-results.component.scss
@@ -75,7 +75,7 @@
   color: var(--text-primary);
   padding: 0 16px;
   cursor: pointer;
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
 }
 
 .results-pager button {
diff --git a/src/app/features/website/catalog/components/sorting-control/sorting-control.component.scss b/src/app/features/website/catalog/components/sorting-control/sorting-control.component.scss
index 87f561c..354bf35 100644
--- a/src/app/features/website/catalog/components/sorting-control/sorting-control.component.scss
+++ b/src/app/features/website/catalog/components/sorting-control/sorting-control.component.scss
@@ -10,7 +10,7 @@
 .catalog-sorting span {
   color: var(--text-secondary);
   font-size: var(--font-size-base, 0.875rem);
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
 }
 
 .catalog-sorting select {
diff --git a/src/app/features/website/catalog/containers/catalog-container.component.scss b/src/app/features/website/catalog/containers/catalog-container.component.scss
index 11e3137..a294087 100644
--- a/src/app/features/website/catalog/containers/catalog-container.component.scss
+++ b/src/app/features/website/catalog/containers/catalog-container.component.scss
@@ -33,7 +33,7 @@
   border: 0;
   background: transparent;
   color: var(--text-primary);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   cursor: pointer;
 }
 
@@ -72,7 +72,7 @@
     background: transparent;
     color: #497671;
     font: inherit;
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
     text-decoration: none;
     cursor: pointer;
   }
@@ -139,7 +139,7 @@
   background: var(--bg-primary);
   color: var(--text-primary);
   padding: 0 12px;
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   cursor: pointer;
   transition: border-color 0.18s ease, background-color 0.18s ease, transform 0.18s ease;
 }
@@ -169,7 +169,7 @@
   background: transparent;
   color: var(--text-secondary);
   padding: 0 12px;
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   cursor: pointer;
   transition: border-color 0.2s ease, color 0.2s ease, background-color 0.2s ease;
 }
@@ -187,7 +187,7 @@
   background: var(--bg-primary);
   color: var(--text-primary);
   padding: 0 12px;
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   cursor: pointer;
   transition: transform 0.2s ease, border-color 0.2s ease, background-color 0.2s ease;
 }
@@ -277,7 +277,7 @@
   border-radius: var(--radius-sm);
   background: var(--primary-color);
   color: #fff;
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   cursor: pointer;
 }
 
@@ -312,7 +312,7 @@
   color: var(--text-primary);
   text-align: left;
   padding: 0 12px;
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   cursor: pointer;
   transition: border-color 0.18s ease, background-color 0.18s ease, transform 0.18s ease;
 }
diff --git a/src/app/features/website/product/components/product-actions/product-actions.component.scss b/src/app/features/website/product/components/product-actions/product-actions.component.scss
index 9991967..77505b5 100644
--- a/src/app/features/website/product/components/product-actions/product-actions.component.scss
+++ b/src/app/features/website/product/components/product-actions/product-actions.component.scss
@@ -10,7 +10,7 @@ button {
   border: 1px solid #d3dad9;
   background: #fff;
   color: #1e3c38;
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   padding: 0 14px;
   cursor: pointer;
 }
diff --git a/src/app/features/website/product/components/product-gallery/product-gallery.component.scss b/src/app/features/website/product/components/product-gallery/product-gallery.component.scss
index 148d64a..acce935 100644
--- a/src/app/features/website/product/components/product-gallery/product-gallery.component.scss
+++ b/src/app/features/website/product/components/product-gallery/product-gallery.component.scss
@@ -42,7 +42,7 @@
   color: #1e3c38;
   border-radius: var(--radius-full, 999px);
   padding: 0 10px;
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   cursor: pointer;
 }
 
@@ -56,7 +56,7 @@
   p {
     margin: 0;
     color: #1e3c38;
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
   }
 
   a {
@@ -68,7 +68,7 @@
     padding: 0 14px;
     display: inline-flex;
     align-items: center;
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
   }
 }
 
diff --git a/src/app/features/website/product/engagement/components/product-tabs/product-tabs.component.scss b/src/app/features/website/product/engagement/components/product-tabs/product-tabs.component.scss
index 064cbee..cdb7e11 100644
--- a/src/app/features/website/product/engagement/components/product-tabs/product-tabs.component.scss
+++ b/src/app/features/website/product/engagement/components/product-tabs/product-tabs.component.scss
@@ -15,7 +15,7 @@
   justify-content: center;
   gap: 6px;
   color: var(--text-primary);
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   cursor: pointer;
   transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
 }
diff --git a/src/app/features/website/product/engagement/components/question-form/question-form.component.scss b/src/app/features/website/product/engagement/components/question-form/question-form.component.scss
index 1a1042d..d7842b5 100644
--- a/src/app/features/website/product/engagement/components/question-form/question-form.component.scss
+++ b/src/app/features/website/product/engagement/components/question-form/question-form.component.scss
@@ -32,7 +32,7 @@ button {
   background: var(--primary-color);
   color: #fff;
   padding: 0 16px;
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
 }
 
 button:disabled {
diff --git a/src/app/features/website/product/engagement/components/question-list/question-list.component.scss b/src/app/features/website/product/engagement/components/question-list/question-list.component.scss
index 3bd2c5f..287d20b 100644
--- a/src/app/features/website/product/engagement/components/question-list/question-list.component.scss
+++ b/src/app/features/website/product/engagement/components/question-list/question-list.component.scss
@@ -11,7 +11,7 @@
   background: var(--bg-primary);
   color: var(--text-primary);
   padding: 0 14px;
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   cursor: pointer;
   transition: border-color 0.2s ease, transform 0.2s ease;
 }
@@ -34,7 +34,7 @@
 .submission-disabled {
   margin: 0;
   color: var(--text-secondary);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
 }
 
 .pager {
diff --git a/src/app/features/website/product/engagement/components/rating-summary/rating-summary.component.scss b/src/app/features/website/product/engagement/components/rating-summary/rating-summary.component.scss
index 855100b..d0b084e 100644
--- a/src/app/features/website/product/engagement/components/rating-summary/rating-summary.component.scss
+++ b/src/app/features/website/product/engagement/components/rating-summary/rating-summary.component.scss
@@ -19,7 +19,7 @@
 
 .total {
   color: var(--text-secondary);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
 }
 
 .distribution {
diff --git a/src/app/features/website/product/engagement/components/review-form/review-form.component.scss b/src/app/features/website/product/engagement/components/review-form/review-form.component.scss
index b1d1e4f..2a9ede2 100644
--- a/src/app/features/website/product/engagement/components/review-form/review-form.component.scss
+++ b/src/app/features/website/product/engagement/components/review-form/review-form.component.scss
@@ -10,7 +10,7 @@ h3 {
 }
 
 label {
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   color: var(--text-primary);
   font-size: var(--font-size-base, 0.875rem);
 }
@@ -32,7 +32,7 @@ textarea {
   display: inline-flex;
   align-items: center;
   gap: 8px;
-  font-weight: 500;
+  font-weight: var(--font-weight-medium, 500);
 }
 
 .upload-placeholder {
@@ -49,7 +49,7 @@ textarea {
 
 .success {
   color: #166534;
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
 }
 
 .error {
@@ -64,7 +64,7 @@ button {
   background: var(--primary-color);
   color: #fff;
   padding: 0 16px;
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   cursor: pointer;
 }
 
diff --git a/src/app/features/website/product/engagement/components/review-list/review-list.component.scss b/src/app/features/website/product/engagement/components/review-list/review-list.component.scss
index fa36808..0b65dfe 100644
--- a/src/app/features/website/product/engagement/components/review-list/review-list.component.scss
+++ b/src/app/features/website/product/engagement/components/review-list/review-list.component.scss
@@ -48,7 +48,7 @@
   background: var(--bg-primary);
   color: var(--primary-color);
   padding: 0 16px;
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   cursor: pointer;
 }
 
diff --git a/src/app/features/website/user-experience/compare/components/compare-table.component.scss b/src/app/features/website/user-experience/compare/components/compare-table.component.scss
index 44bdf1a..1159044 100644
--- a/src/app/features/website/user-experience/compare/components/compare-table.component.scss
+++ b/src/app/features/website/user-experience/compare/components/compare-table.component.scss
@@ -26,7 +26,7 @@
 
 .compare-product-title {
   font-size: var(--font-size-md, 0.9375rem);
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   line-height: 1.3;
 }
 
diff --git a/src/app/features/website/user-experience/compare/containers/compare-page.component.scss b/src/app/features/website/user-experience/compare/containers/compare-page.component.scss
index 002e31e..3c5ab98 100644
--- a/src/app/features/website/user-experience/compare/containers/compare-page.component.scss
+++ b/src/app/features/website/user-experience/compare/containers/compare-page.component.scss
@@ -33,7 +33,7 @@
   gap: 8px;
   align-items: center;
   color: var(--text-primary);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
 }
 
 .compare-products-list {
@@ -55,7 +55,7 @@
 .compare-product-chip a {
   color: var(--text-primary);
   text-decoration: none;
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
 }
 
 .compare-product-chip button {
diff --git a/src/app/features/website/user-experience/components/floating-notifications/floating-notifications.component.scss b/src/app/features/website/user-experience/components/floating-notifications/floating-notifications.component.scss
index 6db9fa6..124d69d 100644
--- a/src/app/features/website/user-experience/components/floating-notifications/floating-notifications.component.scss
+++ b/src/app/features/website/user-experience/components/floating-notifications/floating-notifications.component.scss
@@ -24,7 +24,7 @@
 .floating-note p {
   margin: 0;
   color: var(--text-primary);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   line-height: 1.3;
 }
 
diff --git a/src/app/pages/cart/cart.component.scss b/src/app/pages/cart/cart.component.scss
index d291fd5..abb8c2b 100644
--- a/src/app/pages/cart/cart.component.scss
+++ b/src/app/pages/cart/cart.component.scss
@@ -25,7 +25,7 @@
   h1 {
     font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
     font-size: var(--font-size-4xl, 2rem);
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
     color: #1e3c38;
     margin: 0;
   }
@@ -38,7 +38,7 @@
     border-radius: var(--radius-lg, 13px);
     font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
     font-size: var(--font-size-base, 0.875rem);
-    font-weight: 600;
+    font-weight: var(--font-weight-semibold, 600);
     cursor: pointer;
     transition: all 0.2s;
     display: flex;
@@ -72,7 +72,7 @@
 
   h1 {
     font-size: var(--font-size-4xl, 2rem);
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
     color: #111827;
     margin: 0;
     background: linear-gradient(135deg, #059669 0%, #10b981 100%);
@@ -88,7 +88,7 @@
     border: none;
     border-radius: var(--radius-md, 12px);
     font-size: var(--font-size-base, 0.875rem);
-    font-weight: 600;
+    font-weight: var(--font-weight-semibold, 600);
     cursor: pointer;
     transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
     display: flex;
@@ -138,7 +138,7 @@
   h2 {
     font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
     font-size: 1.6rem;
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
     color: #1e3c38;
     margin: 0 0 12px 0;
   }
@@ -157,7 +157,7 @@
     text-decoration: none;
     border-radius: var(--radius-lg, 13px);
     font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
-    font-weight: 600;
+    font-weight: var(--font-weight-semibold, 600);
     font-size: var(--font-size-lg, 1rem);
     transition: all 0.2s;
     box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.15);
@@ -194,7 +194,7 @@
 
   h2 {
     font-size: var(--font-size-4xl, 2rem);
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
     color: #111827;
     margin: 0 0 12px 0;
   }
@@ -211,7 +211,7 @@
     color: white;
     text-decoration: none;
     border-radius: var(--radius-md, 12px);
-    font-weight: 600;
+    font-weight: var(--font-weight-semibold, 600);
     font-size: var(--font-size-lg, 1rem);
     transition: all 0.3s;
     box-shadow: 0 4px 16px rgba(16, 185, 129, 0.3);
@@ -332,7 +332,7 @@
   .item-name {
     font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
     font-size: var(--font-size-lg, 1rem);
-    font-weight: 600;
+    font-weight: var(--font-weight-semibold, 600);
     color: #1e3c38;
     text-decoration: none;
     transition: color 0.2s;
@@ -378,7 +378,7 @@
       background: rgba(73, 118, 113, 0.08);
       padding: 3px 10px;
       border-radius: 6px;
-      font-weight: 500;
+      font-weight: var(--font-weight-medium, 500);
       display: inline-flex;
       align-items: center;
       gap: 6px;
@@ -461,7 +461,7 @@
 
   .item-name {
     font-size: var(--font-size-xl, 1.125rem);
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
     color: #111827;
     text-decoration: none;
     transition: color 0.2s;
@@ -507,7 +507,7 @@
       background: rgba(99, 102, 241, 0.08);
       padding: 3px 10px;
       border-radius: 6px;
-      font-weight: 500;
+      font-weight: var(--font-weight-medium, 500);
       display: inline-flex;
       align-items: center;
       gap: 6px;
@@ -552,13 +552,13 @@
   .current-price {
     font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
     font-size: var(--font-size-xl, 1.125rem);
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
     color: #497671;
   }
 
   .delivery-price {
     font-size: var(--font-size-sm, 0.8125rem);
-    font-weight: 500;
+    font-weight: var(--font-weight-medium, 500);
     color: #697777;
   }
 }
@@ -600,7 +600,7 @@
   .qty-value {
     font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
     font-size: var(--font-size-lg, 1rem);
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
     color: #1e3c38;
     min-width: 24px;
     text-align: center;
@@ -646,7 +646,7 @@
 
   .qty-value {
     font-size: var(--font-size-lg, 1rem);
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
     color: #059669;
     min-width: 24px;
     text-align: center;
@@ -692,7 +692,7 @@
   .summary-header h3 {
     font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
     font-size: var(--font-size-3xl, 1.5rem);
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
     color: #1e3c38;
     margin: 0 0 16px 0;
   }
@@ -713,7 +713,7 @@
       padding-top: 16px;
       border-top: 1px solid #d3dad9;
       font-size: var(--font-size-xl, 1.125rem);
-      font-weight: 700;
+      font-weight: var(--font-weight-bold, 700);
       color: #1e3c38;
       margin-top: 8px;
 
@@ -740,7 +740,7 @@
     border-radius: var(--radius-lg, 13px);
     font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
     font-size: var(--font-size-lg, 1rem);
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
     cursor: pointer;
     transition: all 0.2s;
     box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.15);
@@ -784,7 +784,7 @@
     .login-gate-title {
       margin: 0 0 4px;
       font-size: var(--font-size-lg, 1rem);
-      font-weight: 700;
+      font-weight: var(--font-weight-bold, 700);
       color: #1a1a1a;
     }
 
@@ -805,7 +805,7 @@
       background: #2AABEE;
       color: #fff;
       font-size: var(--font-size-md, 0.9375rem);
-      font-weight: 600;
+      font-weight: var(--font-weight-semibold, 600);
       cursor: pointer;
       transition: all 0.2s;
 
@@ -842,7 +842,7 @@
 
   .summary-header h3 {
     font-size: var(--font-size-3xl, 1.5rem);
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
     color: #111827;
     margin: 0 0 20px 0;
     background: linear-gradient(135deg, #059669 0%, #10b981 100%);
@@ -866,7 +866,7 @@
       padding-top: 20px;
       border-top: 2px solid #f0fdf4;
       font-size: var(--font-size-2xl, 1.25rem);
-      font-weight: 700;
+      font-weight: var(--font-weight-bold, 700);
       color: #111827;
       margin-top: 12px;
 
@@ -878,7 +878,7 @@
     }
 
     .value {
-      font-weight: 600;
+      font-weight: var(--font-weight-semibold, 600);
       color: #111827;
     }
   }
@@ -898,7 +898,7 @@
     border: none;
     border-radius: 14px;
     font-size: var(--font-size-xl, 1.125rem);
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
     cursor: pointer;
     transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
     box-shadow: 0 4px 16px rgba(16, 185, 129, 0.3);
@@ -950,7 +950,7 @@
     .login-gate-title {
       margin: 0 0 4px;
       font-size: var(--font-size-lg, 1rem);
-      font-weight: 700;
+      font-weight: var(--font-weight-bold, 700);
       color: #111827;
     }
 
@@ -971,7 +971,7 @@
       background: #2AABEE;
       color: #fff;
       font-size: var(--font-size-md, 0.9375rem);
-      font-weight: 600;
+      font-weight: var(--font-weight-semibold, 600);
       cursor: pointer;
       transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
 
@@ -1092,7 +1092,7 @@
     a {
       color: #497671;
       text-decoration: none;
-      font-weight: 600;
+      font-weight: var(--font-weight-semibold, 600);
 
       &:hover {
         text-decoration: underline;
@@ -1124,7 +1124,7 @@
 
     a {
       color: #10b981;
-      font-weight: 600;
+      font-weight: var(--font-weight-semibold, 600);
 
       &:hover {
         color: #059669;
@@ -1264,7 +1264,7 @@
       align-items: center;
       justify-content: center;
       font-size: 3rem;
-      font-weight: 700;
+      font-weight: var(--font-weight-bold, 700);
       color: white;
       margin: 0 auto 20px;
     }
@@ -1281,7 +1281,7 @@
       border-radius: var(--radius-lg, 13px);
       font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
       font-size: var(--font-size-lg, 1rem);
-      font-weight: 700;
+      font-weight: var(--font-weight-bold, 700);
       cursor: pointer;
       transition: all 0.2s;
 
@@ -1399,7 +1399,7 @@
 
     .amount {
       font-size: var(--font-size-2xl, 1.25rem);
-      font-weight: 700;
+      font-weight: var(--font-weight-bold, 700);
       color: #1a1a1a;
     }
   }
@@ -1430,7 +1430,7 @@
       flex: 1;
       padding: 12px 16px;
       border-radius: var(--radius-sm, 8px);
-      font-weight: 600;
+      font-weight: var(--font-weight-semibold, 600);
       font-size: var(--font-size-md, 0.9375rem);
       cursor: pointer;
       transition: all 0.3s ease;
@@ -1591,7 +1591,7 @@
     border-radius: var(--radius-lg, 13px);
     font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
     font-size: var(--font-size-lg, 1rem);
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
     cursor: pointer;
     display: flex;
     align-items: center;
@@ -1730,7 +1730,7 @@
 
   h1 {
     font-size: var(--font-size-4xl, 2rem);
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
     color: var(--text-primary);
     margin: 0;
     background: linear-gradient(135deg, #10b981 0%, #14b8a6 50%, #06b6d4 100%);
@@ -1749,7 +1749,7 @@
     border: none;
     border-radius: var(--radius-lg);
     font-size: var(--font-size-md, 0.9375rem);
-    font-weight: 600;
+    font-weight: var(--font-weight-semibold, 600);
     cursor: pointer;
     transition: all 0.3s ease;
 
@@ -1792,7 +1792,7 @@
 
   h2 {
     font-size: var(--font-size-4xl, 2rem);
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
     color: var(--text-primary);
     margin: 0 0 0.75rem 0;
   }
@@ -1811,7 +1811,7 @@
     color: white;
     text-decoration: none;
     border-radius: var(--radius-lg);
-    font-weight: 600;
+    font-weight: var(--font-weight-semibold, 600);
     font-size: var(--font-size-lg, 1rem);
     transition: all 0.3s ease;
 
@@ -1887,7 +1887,7 @@
 
       .item-name {
         font-size: var(--font-size-xl, 1.125rem);
-        font-weight: 600;
+        font-weight: var(--font-weight-semibold, 600);
         color: var(--text-primary);
         text-decoration: none;
         margin: 0;
@@ -1945,7 +1945,7 @@
       gap: 1rem;
 
       .item-price {
-        font-weight: 700;
+        font-weight: var(--font-weight-bold, 700);
         font-size: var(--font-size-2xl, 1.25rem);
 
         .price-discount {
@@ -1957,7 +1957,7 @@
             font-size: var(--font-size-md, 0.9375rem);
             color: var(--text-secondary);
             text-decoration: line-through;
-            font-weight: 400;
+            font-weight: var(--font-weight-normal, 400);
           }
 
           .current {
@@ -2012,7 +2012,7 @@
         span {
           min-width: 36px;
           text-align: center;
-          font-weight: 600;
+          font-weight: var(--font-weight-semibold, 600);
           font-size: var(--font-size-lg, 1rem);
           color: var(--text-primary);
         }
@@ -2034,7 +2034,7 @@
 
   h3 {
     font-size: var(--font-size-2xl, 1.25rem);
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
     color: var(--text-primary);
     margin: 0 0 1.25rem 0;
     padding-bottom: 1rem;
@@ -2050,7 +2050,7 @@
     color: var(--text-secondary);
 
     .value {
-      font-weight: 600;
+      font-weight: var(--font-weight-semibold, 600);
       color: var(--text-primary);
     }
   }
@@ -2062,7 +2062,7 @@
     padding: 1.25rem 0;
     margin-top: 1rem;
     border-top: 1px solid var(--border-color);
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
     font-size: var(--font-size-xl, 1.125rem);
 
     span:first-child {
@@ -2087,7 +2087,7 @@
     border: none;
     border-radius: var(--radius-md);
     font-size: 1.0625rem;
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
     cursor: pointer;
     transition: all 0.3s ease;
     box-shadow: 0 4px 12px rgba(16, 185, 129, 0.3);
@@ -2169,7 +2169,7 @@
         a {
           color: #10b981;
           text-decoration: none;
-          font-weight: 500;
+          font-weight: var(--font-weight-medium, 500);
           transition: all 0.2s;
 
           &:hover {
diff --git a/src/app/pages/category/category.component.scss b/src/app/pages/category/category.component.scss
index 88610fb..e932864 100644
--- a/src/app/pages/category/category.component.scss
+++ b/src/app/pages/category/category.component.scss
@@ -40,7 +40,7 @@
 
   h3 {
     font-size: var(--font-size-2xl, 1.25rem);
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
     color: #1e3c38;
     margin: 0 0 8px 0;
   }
@@ -62,7 +62,7 @@
     border-radius: var(--radius-lg, 13px);
     font-family: "DM Sans", sans-serif;
     font-size: var(--font-size-md, 0.9375rem);
-    font-weight: 600;
+    font-weight: var(--font-weight-semibold, 600);
     text-decoration: none;
     transition: background 0.2s ease, transform 0.15s ease;
 
@@ -83,7 +83,7 @@
   cursor: pointer;
   font-size: var(--font-size-lg, 1rem);
   font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
-  font-weight: 500;
+  font-weight: var(--font-weight-medium, 500);
   transition: all 0.2s ease;
 
   &:hover {
@@ -165,7 +165,7 @@
   color: white;
   padding: 6px 12px;
   border-radius: 20px;
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   font-size: var(--font-size-base, 0.875rem);
   font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
   z-index: 1;
@@ -188,7 +188,7 @@
 
 .item-name {
   font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   font-size: clamp(14px, 1.4vw, 18px);
   color: #1e3c38;
   margin: 0;
@@ -212,7 +212,7 @@
 
   .rating-stars {
     color: #ffa502;
-    font-weight: 600;
+    font-weight: var(--font-weight-semibold, 600);
   }
 }
 
@@ -234,7 +234,7 @@
 .discounted-price,
 .current-price {
   font-size: clamp(16px, 1.6vw, 22px);
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   color: #497671;
   font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
 }
@@ -275,7 +275,7 @@
   border: none;
   border-radius: 0 0 13px 13px;
   font-size: var(--font-size-md, 0.9375rem);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
   cursor: pointer;
   transition: all 0.2s ease;
diff --git a/src/app/pages/category/subcategories.component.scss b/src/app/pages/category/subcategories.component.scss
index 25a5dc5..a555e9f 100644
--- a/src/app/pages/category/subcategories.component.scss
+++ b/src/app/pages/category/subcategories.component.scss
@@ -54,7 +54,7 @@
       border: none;
       border-radius: var(--radius-sm, 8px);
       font-size: var(--font-size-md, 0.9375rem);
-      font-weight: 500;
+      font-weight: var(--font-weight-medium, 500);
       font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
       cursor: pointer;
       transition: all 0.2s ease;
@@ -94,7 +94,7 @@
 
     h3 {
       font-size: var(--font-size-2xl, 1.25rem);
-      font-weight: 700;
+      font-weight: var(--font-weight-bold, 700);
       color: #1e3c38;
       margin: 0 0 8px 0;
     }
@@ -116,7 +116,7 @@
       border-radius: var(--radius-lg, 13px);
       font-family: "DM Sans", sans-serif;
       font-size: var(--font-size-md, 0.9375rem);
-      font-weight: 600;
+      font-weight: var(--font-weight-semibold, 600);
       text-decoration: none;
       transition: background 0.2s ease, transform 0.15s ease;
 
@@ -135,7 +135,7 @@
       font-size: var(--font-size-4xl, 2rem);
       color: #1e3c38;
       margin: 0;
-      font-weight: 700;
+      font-weight: var(--font-weight-bold, 700);
       letter-spacing: -0.02em;
     }
   }
@@ -198,7 +198,7 @@
     align-items: center;
     justify-content: center;
     font-size: 5rem;
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
     color: #497671;
     font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
     background: linear-gradient(135deg, #f5f5f5 0%, #e0e0e0 100%);
@@ -221,7 +221,7 @@
 
   .category-name {
     font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
-    font-weight: 600;
+    font-weight: var(--font-weight-semibold, 600);
     font-size: clamp(14px, 1.4vw, 18px);
     color: #1e3c38;
     margin: 0;
@@ -276,7 +276,7 @@
     .items-section-title {
       font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
       font-size: var(--font-size-3xl, 1.5rem);
-      font-weight: 700;
+      font-weight: var(--font-weight-bold, 700);
       color: #1e3c38;
       margin: 0 0 20px 0;
     }
@@ -328,7 +328,7 @@
       background: #dc2626;
       color: white;
       font-size: var(--font-size-xs, 0.75rem);
-      font-weight: 700;
+      font-weight: var(--font-weight-bold, 700);
       padding: 2px 8px;
       border-radius: 6px;
     }
@@ -344,7 +344,7 @@
 
     .item-badge {
       font-size: 0.65rem;
-      font-weight: 600;
+      font-weight: var(--font-weight-semibold, 600);
       padding: 2px 6px;
       border-radius: var(--radius-xs, 4px);
       text-transform: uppercase;
@@ -361,7 +361,7 @@
   .item-name {
     font-family: "DM Sans", sans-serif;
     font-size: var(--font-size-base, 0.875rem);
-    font-weight: 600;
+    font-weight: var(--font-weight-semibold, 600);
     color: #1e3c38;
     margin: 0;
     line-height: 1.3;
@@ -386,7 +386,7 @@
 
     .current-price {
       font-size: var(--font-size-lg, 1rem);
-      font-weight: 700;
+      font-weight: var(--font-weight-bold, 700);
       color: #1e3c38;
     }
   }
diff --git a/src/app/pages/info/contacts/contacts.component.scss b/src/app/pages/info/contacts/contacts.component.scss
index b577608..efebbfd 100644
--- a/src/app/pages/info/contacts/contacts.component.scss
+++ b/src/app/pages/info/contacts/contacts.component.scss
@@ -34,7 +34,7 @@
     a {
       color: var(--text-primary);
       text-decoration: none;
-      font-weight: 500;
+      font-weight: var(--font-weight-medium, 500);
       
       &:hover {
         color: var(--primary-color);
diff --git a/src/app/pages/item-detail/item-detail.component.scss b/src/app/pages/item-detail/item-detail.component.scss
index 7f42219..044ba12 100644
--- a/src/app/pages/item-detail/item-detail.component.scss
+++ b/src/app/pages/item-detail/item-detail.component.scss
@@ -48,7 +48,7 @@ $dx-card-bg: #f5f3f9;
   color: white;
   text-decoration: none;
   border-radius: var(--radius-lg, 13px);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   transition: all 0.2s;
 
   &:hover {
@@ -187,7 +187,7 @@ $dx-card-bg: #f5f3f9;
 .dx-title {
   font-family: $dx-font;
   font-size: var(--font-size-4xl, 2rem);
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   color: $dx-dark;
   margin: 0;
   line-height: 1.3;
@@ -209,7 +209,7 @@ $dx-card-bg: #f5f3f9;
 }
 
 .dx-rating-value {
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   font-size: var(--font-size-lg, 1rem);
   color: $dx-dark;
 }
@@ -242,7 +242,7 @@ $dx-card-bg: #f5f3f9;
   color: white;
   padding: 3px 10px;
   border-radius: 20px;
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   font-size: var(--font-size-sm, 0.8125rem);
 }
 
@@ -270,7 +270,7 @@ $dx-card-bg: #f5f3f9;
   align-items: center;
   gap: 6px;
   font-size: var(--font-size-md, 0.9375rem);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
 
   &.high { color: #2ed573; }
   &.medium { color: #ffa502; }
@@ -294,7 +294,7 @@ $dx-card-bg: #f5f3f9;
   border-radius: var(--radius-lg, 13px);
   font-family: $dx-font;
   font-size: var(--font-size-xl, 1.125rem);
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   cursor: pointer;
   transition: all 0.2s;
   display: flex;
@@ -331,7 +331,7 @@ $dx-card-bg: #f5f3f9;
   .variant-label {
     font-size: var(--font-size-base, 0.875rem);
     color: #6b7280;
-    font-weight: 500;
+    font-weight: var(--font-weight-medium, 500);
   }
 
   .variant-chip {
@@ -340,7 +340,7 @@ $dx-card-bg: #f5f3f9;
     padding: 6px 14px;
     border-radius: var(--radius-sm, 8px);
     font-size: var(--font-size-base, 0.875rem);
-    font-weight: 600;
+    font-weight: var(--font-weight-semibold, 600);
     border: 1.5px solid $dx-border;
     background: rgba(73, 118, 113, 0.06);
     color: $dx-primary;
@@ -399,7 +399,7 @@ $dx-card-bg: #f5f3f9;
   }
 
   .attribute-value {
-    font-weight: 600;
+    font-weight: var(--font-weight-semibold, 600);
     color: #1a1a1a;
   }
 }
@@ -417,7 +417,7 @@ $dx-card-bg: #f5f3f9;
 .dx-delivery-title, .alt-delivery-title {
   margin: 0;
   font-size: var(--font-size-lg, 1rem);
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   color: $dx-dark;
 }
 
@@ -447,7 +447,7 @@ $dx-card-bg: #f5f3f9;
 
 .dx-delivery-price, .alt-delivery-price {
   flex-shrink: 0;
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   color: $dx-primary;
   font-size: var(--font-size-md, 0.9375rem);
 }
@@ -460,7 +460,7 @@ $dx-card-bg: #f5f3f9;
   background: rgba(73, 118, 113, 0.12);
   color: $dx-primary;
   font-size: var(--font-size-base, 0.875rem);
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
 }
 
 .dx-description {
@@ -470,7 +470,7 @@ $dx-card-bg: #f5f3f9;
   h2 {
     font-family: $dx-font;
     font-size: var(--font-size-3xl, 1.5rem);
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
     color: $dx-dark;
     margin: 0 0 12px 0;
   }
@@ -489,7 +489,7 @@ $dx-card-bg: #f5f3f9;
   h2 {
     font-family: $dx-font;
     font-size: var(--font-size-3xl, 1.5rem);
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
     color: $dx-dark;
     margin: 0 0 24px 0;
   }
@@ -507,7 +507,7 @@ $dx-card-bg: #f5f3f9;
     margin: 0 0 20px 0;
     color: $dx-dark;
     font-size: var(--font-size-xl, 1.125rem);
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
   }
 }
 
@@ -518,7 +518,7 @@ $dx-card-bg: #f5f3f9;
     display: block;
     margin-bottom: 8px;
     color: $dx-dark;
-    font-weight: 600;
+    font-weight: var(--font-weight-semibold, 600);
     font-size: var(--font-size-md, 0.9375rem);
   }
 }
@@ -595,7 +595,7 @@ $dx-card-bg: #f5f3f9;
   padding: 12px 28px;
   border-radius: var(--radius-lg, 13px);
   font-family: $dx-font;
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   font-size: var(--font-size-md, 0.9375rem);
   cursor: pointer;
   transition: all 0.2s;
@@ -637,7 +637,7 @@ $dx-card-bg: #f5f3f9;
   display: flex;
   align-items: center;
   gap: 10px;
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   font-size: var(--font-size-md, 0.9375rem);
   animation: dxSlideIn 0.3s ease-out;
 
@@ -692,7 +692,7 @@ $dx-card-bg: #f5f3f9;
 }
 
 .dx-reviewer-name {
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   color: $dx-dark;
   font-size: var(--font-size-md, 0.9375rem);
 }
@@ -728,7 +728,7 @@ $dx-card-bg: #f5f3f9;
   h2 {
     font-family: $dx-font;
     font-size: var(--font-size-3xl, 1.5rem);
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
     color: $dx-dark;
     margin: 0 0 24px 0;
   }
@@ -765,7 +765,7 @@ $dx-card-bg: #f5f3f9;
   display: flex;
   align-items: center;
   justify-content: center;
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   font-size: var(--font-size-sm, 0.8125rem);
 
   &.q {
@@ -1134,7 +1134,7 @@ $dx-card-bg: #f5f3f9;
   color: white;
   text-decoration: none;
   border-radius: var(--radius-lg);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   transition: all 0.3s;
 
   &:hover {
@@ -1242,7 +1242,7 @@ $dx-card-bg: #f5f3f9;
 .alt-info {
   .alt-title {
     font-size: var(--font-size-4xl, 2rem);
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
     color: var(--text-primary);
     margin: 0 0 1rem 0;
     line-height: 1.3;
@@ -1260,7 +1260,7 @@ $dx-card-bg: #f5f3f9;
     }
 
     .value {
-      font-weight: 700;
+      font-weight: var(--font-weight-bold, 700);
       color: var(--text-primary);
     }
 
@@ -1294,7 +1294,7 @@ $dx-card-bg: #f5f3f9;
       color: white;
       padding: 0.25rem 0.75rem;
       border-radius: var(--radius-md);
-      font-weight: 700;
+      font-weight: var(--font-weight-bold, 700);
       font-size: var(--font-size-sm, 0.8125rem);
     }
 
@@ -1317,7 +1317,7 @@ $dx-card-bg: #f5f3f9;
     border-radius: var(--radius-md);
 
     .stock-label {
-      font-weight: 600;
+      font-weight: var(--font-weight-semibold, 600);
       color: var(--text-secondary);
     }
 
@@ -1325,7 +1325,7 @@ $dx-card-bg: #f5f3f9;
       display: flex;
       align-items: center;
       gap: 0.5rem;
-      font-weight: 600;
+      font-weight: var(--font-weight-semibold, 600);
 
       .dot {
         width: 10px;
@@ -1359,7 +1359,7 @@ $dx-card-bg: #f5f3f9;
     border: none;
     border-radius: var(--radius-lg);
     font-size: var(--font-size-xl, 1.125rem);
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
     cursor: pointer;
     display: flex;
     align-items: center;
@@ -1382,7 +1382,7 @@ $dx-card-bg: #f5f3f9;
   .alt-description {
     h3 {
       font-size: var(--font-size-2xl, 1.25rem);
-      font-weight: 600;
+      font-weight: var(--font-weight-semibold, 600);
       color: var(--text-primary);
       margin: 0 0 1rem 0;
     }
@@ -1403,7 +1403,7 @@ $dx-card-bg: #f5f3f9;
 
   h2 {
     font-size: var(--font-size-4xl, 2rem);
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
     color: var(--text-primary);
     margin: 0 0 2rem 0;
   }
@@ -1439,7 +1439,7 @@ $dx-card-bg: #f5f3f9;
         gap: 0.25rem;
 
         .reviewer-name {
-          font-weight: 600;
+          font-weight: var(--font-weight-semibold, 600);
           font-size: var(--font-size-lg, 1rem);
           color: var(--text-primary);
         }
@@ -1485,7 +1485,7 @@ $dx-card-bg: #f5f3f9;
 
   h3 {
     font-size: var(--font-size-2xl, 1.25rem);
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
     color: var(--text-primary);
     margin: 0 0 1.5rem 0;
   }
@@ -1496,7 +1496,7 @@ $dx-card-bg: #f5f3f9;
     label {
       display: block;
       font-size: var(--font-size-md, 0.9375rem);
-      font-weight: 600;
+      font-weight: var(--font-weight-semibold, 600);
       color: var(--text-primary);
       margin-bottom: 0.75rem;
     }
@@ -1592,7 +1592,7 @@ $dx-card-bg: #f5f3f9;
       border: none;
       border-radius: var(--radius-md);
       font-size: var(--font-size-md, 0.9375rem);
-      font-weight: 600;
+      font-weight: var(--font-weight-semibold, 600);
       cursor: pointer;
       transition: all 0.3s ease;
 
@@ -1635,7 +1635,7 @@ $dx-card-bg: #f5f3f9;
     margin-top: 1rem;
     border-radius: var(--radius-md);
     font-size: var(--font-size-md, 0.9375rem);
-    font-weight: 500;
+    font-weight: var(--font-weight-medium, 500);
     animation: slideDown 0.3s ease;
 
     svg {
@@ -1940,7 +1940,7 @@ $dx-card-bg: #f5f3f9;
   padding: 3px 10px;
   border-radius: var(--radius-xs, 4px);
   font-size: var(--font-size-xs, 0.75rem);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   text-transform: uppercase;
   letter-spacing: 0.5px;
   color: #fff;
@@ -1992,7 +1992,7 @@ $dx-card-bg: #f5f3f9;
 
   .spec-key {
     color: #697777;
-    font-weight: 500;
+    font-weight: var(--font-weight-medium, 500);
     width: 40%;
     white-space: nowrap;
   }
diff --git a/src/app/pages/legal/company-details/company-details.component.scss b/src/app/pages/legal/company-details/company-details.component.scss
index f3c547b..cff9d5f 100644
--- a/src/app/pages/legal/company-details/company-details.component.scss
+++ b/src/app/pages/legal/company-details/company-details.component.scss
@@ -15,14 +15,14 @@
     border-radius: var(--radius-sm);
     
     .req-label {
-      font-weight: 500;
+      font-weight: var(--font-weight-medium, 500);
       color: var(--text-secondary);
     }
     
     .req-value {
       font-family: 'Courier New', monospace;
       color: var(--text-primary);
-      font-weight: 600;
+      font-weight: var(--font-weight-semibold, 600);
     }
   }
 }
@@ -45,7 +45,7 @@
 }
 
 .org-name {
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   color: var(--text-primary);
   margin-bottom: 0.75rem;
 }
@@ -73,7 +73,7 @@
 
     strong {
       color: var(--text-primary);
-      font-weight: 600;
+      font-weight: var(--font-weight-semibold, 600);
     }
 
     span {
diff --git a/src/app/pages/search/search.component.scss b/src/app/pages/search/search.component.scss
index 568617b..c1ab463 100644
--- a/src/app/pages/search/search.component.scss
+++ b/src/app/pages/search/search.component.scss
@@ -109,7 +109,7 @@
 
   h2 {
     font-size: var(--font-size-2xl, 1.25rem);
-    font-weight: 700;
+    font-weight: var(--font-weight-bold, 700);
     color: #1e3c38;
     margin: 0 0 8px 0;
   }
@@ -219,7 +219,7 @@
   color: white;
   padding: 6px 12px;
   border-radius: 20px;
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   font-size: var(--font-size-base, 0.875rem);
 }
 
@@ -251,7 +251,7 @@
 
   .rating-stars {
     color: #497671;
-    font-weight: 600;
+    font-weight: var(--font-weight-semibold, 600);
   }
 }
 
@@ -272,7 +272,7 @@
 .discounted-price,
 .current-price {
   font-size: var(--font-size-3xl, 1.5rem);
-  font-weight: 700;
+  font-weight: var(--font-weight-bold, 700);
   color: var(--primary-color);
 }
 
@@ -312,7 +312,7 @@
   border: none;
   border-radius: 0 0 13px 13px;
   font-size: var(--font-size-lg, 1rem);
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
   font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
   cursor: pointer;
   transition: background 0.2s;
diff --git a/src/app/shared/ui/code-editor/code-editor.component.scss b/src/app/shared/ui/code-editor/code-editor.component.scss
index 5319b79..96d6bad 100644
--- a/src/app/shared/ui/code-editor/code-editor.component.scss
+++ b/src/app/shared/ui/code-editor/code-editor.component.scss
@@ -66,7 +66,7 @@
 
 :global(.cm-selector) {
   color: #b2452f;
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
 }
 
 :global(.cm-property) {
@@ -79,7 +79,7 @@
 
 :global(.cm-keyword) {
   color: #6d3fa8;
-  font-weight: 600;
+  font-weight: var(--font-weight-semibold, 600);
 }
 
 :global(.cm-punct) {