From 8adb161f82979c550d8e340f50aeda70f8a393f3 Mon Sep 17 00:00:00 2001
From: Daine Trinidad <daine.trinidad@cds-snc.ca>
Date: Thu, 5 Dec 2024 15:35:28 -0800
Subject: [PATCH 01/11] chore(deps): update gcds-components, gcds-tokens,
 gcds-utility packages

---
 package.json | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/package.json b/package.json
index 3a4fb924d..415aa4ceb 100644
--- a/package.json
+++ b/package.json
@@ -34,9 +34,9 @@
   },
   "devDependencies": {
     "@11ty/eleventy-plugin-syntaxhighlight": "^5.0.0",
-    "@cdssnc/gcds-components": "^0.26.2",
-    "@cdssnc/gcds-tokens": "^1.19.1",
-    "@cdssnc/gcds-utility": "^1.4.0",
+    "@cdssnc/gcds-components": "^0.28.0",
+    "@cdssnc/gcds-tokens": "^2.0.0",
+    "@cdssnc/gcds-utility": "^1.5.0",
     "@quasibit/eleventy-plugin-sitemap": "^2.1.4",
     "chroma-js": "^2.4.2",
     "eleventy-plugin-svg-contents": "^0.7.0",

From d3d64151a146d306f4a442f48865b7fa15d61ce3 Mon Sep 17 00:00:00 2001
From: Melanie Boeckmann <melanie.bockmann@gmail.com>
Date: Mon, 9 Dec 2024 16:22:12 -0800
Subject: [PATCH 02/11] refactor: update docs site with new typography and
 spacing

---
 src/404.md                                    |  6 +-
 src/_includes/layouts/base.njk                |  4 +-
 .../layouts/component-documentation.njk       |  2 +-
 src/_includes/layouts/demo.njk                | 35 ++++---
 src/_includes/layouts/home.njk                | 12 +--
 src/_includes/partials/card-list.njk          |  6 +-
 src/_includes/partials/components-tags.njk    |  4 +-
 src/_includes/partials/helpus.njk             |  6 +-
 .../partials/installation/step-1.njk          |  4 +-
 .../partials/installation/step-2-angular.njk  | 14 +--
 .../partials/installation/step-2-cdn.njk      | 16 +--
 .../partials/installation/step-2-choose.njk   |  4 +-
 .../partials/installation/step-2-figma.njk    |  6 +-
 .../partials/installation/step-2-node.njk     | 12 +--
 .../partials/installation/step-2-none.njk     |  6 +-
 .../partials/installation/step-2-react.njk    | 12 +--
 .../partials/installation/step-2-vue.njk      | 20 ++--
 .../partials/installation/step-3.njk          |  6 +-
 src/_includes/partials/lookingfor.njk         | 12 +--
 src/_includes/partials/token_table.njk        |  2 +-
 src/en/components/breadcrumbs/design.md       |  4 +-
 src/en/components/breadcrumbs/use-case.md     |  4 +-
 src/en/components/button/base.md              |  6 +-
 src/en/components/button/design.md            |  2 +-
 src/en/components/button/use-case.md          | 28 +++---
 src/en/components/card/design.md              |  2 +-
 src/en/components/card/use-case.md            |  4 +-
 src/en/components/checkbox/base.md            |  2 +-
 src/en/components/checkbox/design.md          |  4 +-
 src/en/components/checkbox/use-case.md        |  6 +-
 src/en/components/container/base.md           |  6 +-
 src/en/components/container/design.md         |  2 +-
 src/en/components/container/use-case.md       |  4 +-
 src/en/components/data-table/design.md        |  2 +-
 src/en/components/data-table/use-case.md      |  4 +-
 src/en/components/date-input/design.md        |  4 +-
 src/en/components/date-input/use-case.md      |  4 +-
 src/en/components/date-modified/design.md     |  2 +-
 src/en/components/date-modified/use-case.md   | 26 ++---
 src/en/components/details/design.md           |  4 +-
 src/en/components/details/use-case.md         |  4 +-
 src/en/components/error-message/base.md       |  2 +-
 src/en/components/error-message/design.md     |  4 +-
 src/en/components/error-message/use-case.md   |  4 +-
 src/en/components/error-summary/design.md     |  2 +-
 src/en/components/error-summary/use-case.md   |  4 +-
 src/en/components/fieldset/base.md            |  2 +-
 src/en/components/fieldset/design.md          |  2 +-
 src/en/components/fieldset/use-case.md        |  4 +-
 src/en/components/file-uploader/design.md     |  2 +-
 src/en/components/file-uploader/use-case.md   |  4 +-
 src/en/components/footer/code.md              |  6 +-
 src/en/components/footer/design.md            |  4 +-
 src/en/components/footer/use-case.md          |  4 +-
 src/en/components/grid/code.md                | 12 +--
 src/en/components/grid/design.md              |  2 +-
 src/en/components/grid/use-case.md            |  4 +-
 src/en/components/header/base.md              |  2 +-
 src/en/components/header/design.md            |  4 +-
 src/en/components/header/use-case.md          |  6 +-
 src/en/components/heading/design.md           |  2 +-
 src/en/components/heading/use-case.md         |  4 +-
 src/en/components/image/design.md             |  2 +-
 src/en/components/image/use-case.md           |  4 +-
 src/en/components/input/base.md               |  2 +-
 src/en/components/input/design.md             |  2 +-
 src/en/components/input/use-case.md           |  4 +-
 src/en/components/language-toggle/design.md   |  2 +-
 src/en/components/language-toggle/use-case.md |  4 +-
 src/en/components/link/base.md                |  6 +-
 src/en/components/link/design.md              |  2 +-
 src/en/components/link/use-case.md            |  4 +-
 src/en/components/pagination/base.md          |  2 +-
 src/en/components/pagination/design.md        | 12 +--
 src/en/components/pagination/use-case.md      |  4 +-
 src/en/components/radio-group/base.md         |  2 +-
 src/en/components/radio-group/design.md       |  2 +-
 src/en/components/radio-group/use-case.md     |  6 +-
 src/en/components/radio/design.md             |  2 +-
 src/en/components/radio/use-case.md           |  4 +-
 src/en/components/search/design.md            |  2 +-
 src/en/components/search/use-case.md          |  4 +-
 src/en/components/select/design.md            |  2 +-
 src/en/components/select/use-case.md          |  4 +-
 src/en/components/side-navigation/design.md   |  2 +-
 src/en/components/side-navigation/use-case.md |  4 +-
 src/en/components/signature/base.md           |  4 +-
 src/en/components/signature/design.md         | 10 +-
 src/en/components/signature/use-case.md       |  8 +-
 src/en/components/stepper/base.md             |  2 +-
 src/en/components/stepper/design.md           |  2 +-
 src/en/components/stepper/use-case.md         |  4 +-
 src/en/components/text/design.md              |  2 +-
 src/en/components/text/use-case.md            |  4 +-
 src/en/components/textarea/base.md            |  2 +-
 src/en/components/textarea/design.md          |  2 +-
 src/en/components/textarea/use-case.md        |  4 +-
 .../components/theme-and-topic-menu/base.md   |  2 +-
 .../components/theme-and-topic-menu/design.md |  2 +-
 .../theme-and-topic-menu/use-case.md          |  4 +-
 src/en/components/top-navigation/design.md    |  2 +-
 src/en/components/top-navigation/use-case.md  |  4 +-
 src/en/contact/contact.md                     |  4 +-
 src/en/get-involved.md                        | 16 +--
 src/en/pages/index.md                         | 72 +++++++-------
 src/en/search.md                              |  2 +-
 src/en/styles/design-tokens/design-tokens.md  | 14 +--
 .../tokens/design-tokens-global.svg           | 32 +++---
 src/scripts/code-copy.js                      |  2 +-
 src/scripts/search.js                         | 26 ++---
 src/styles/_general.scss                      |  4 +-
 src/styles/_typography.scss                   | 30 +++---
 src/styles/components/_anatomy-list.scss      | 12 +--
 src/styles/components/_code-showcase.scss     |  4 +-
 src/styles/components/_table.scss             | 22 ++---
 src/styles/components/_tabs.scss              | 20 ++--
 src/styles/pages/_home.scss                   |  2 +-
 src/styles/pages/_search.scss                 | 22 +++--
 src/styles/style.css                          | 98 +++++++++----------
 src/styles/style.css.map                      |  2 +-
 src/styles/utilities/_backgrounds.scss        |  6 +-
 utils/anchor.js                               | 14 +--
 122 files changed, 469 insertions(+), 470 deletions(-)

diff --git a/src/404.md b/src/404.md
index ad7823422..375a6c9d5 100644
--- a/src/404.md
+++ b/src/404.md
@@ -7,10 +7,10 @@ nocrawl: true
 locale: en
 ---
 
-<h1 class="mt-300 mb-400">
-    Page could not be found | <span lang="fr">Page introuvable</span>
+<h1 class="mt-0 mb-300">
+    Page could not be found <br/><span lang="fr">Page introuvable</span>
 </h1>
 
 Check you’ve entered the correct web address.
 
-<p class="mb-400" lang="fr">Assurez-vous d’avoir saisi la bonne adresse Web.</p>
+<p class="mb-300" lang="fr">Assurez-vous d’avoir saisi la bonne adresse Web.</p>
diff --git a/src/_includes/layouts/base.njk b/src/_includes/layouts/base.njk
index ae3be4b7b..79c5f78cd 100644
--- a/src/_includes/layouts/base.njk
+++ b/src/_includes/layouts/base.njk
@@ -41,10 +41,10 @@
     {% include "partials/header.njk" %}
 
     <div class="content-wrapper">
-      <main id="mc" class="container-xl mx-auto xl:px-0 sm:px-500 px-300 general-layout" {% if not nocrawl %}data-pagefind-body{% endif %}>
+      <main id="mc" class="container-xl mx-auto xl:px-0 sm:px-600 px-225 general-layout" {% if not nocrawl %}data-pagefind-body{% endif %}>
         {% block content %}{{ content | safe }}{% endblock %}
 
-        <gcds-date-modified class="mb-400 font-caption">
+        <gcds-date-modified class="mb-300">
           {{ page.date | dateLastModified}}
         </gcds-date-modified>
       </main>
diff --git a/src/_includes/layouts/component-documentation.njk b/src/_includes/layouts/component-documentation.njk
index 5cbfe4f8b..b3dce19bd 100644
--- a/src/_includes/layouts/component-documentation.njk
+++ b/src/_includes/layouts/component-documentation.njk
@@ -7,7 +7,7 @@
 {% block content %}
   {% if tabs %}
     {{ tabs.header.templateContent | safe }}
-    <nav class="tabs mb-400" aria-label="{{ tabsnav[locale].label }}">
+    <nav class="tabs mb-300" aria-label="{{ tabsnav[locale].label }}">
       <ul>
         {% for key, tab in documentation[locale] %}
           {% if tabs[key].url %}
diff --git a/src/_includes/layouts/demo.njk b/src/_includes/layouts/demo.njk
index 50cc27ef8..f4ff0b318 100644
--- a/src/_includes/layouts/demo.njk
+++ b/src/_includes/layouts/demo.njk
@@ -2,14 +2,14 @@
 layout: "layouts/base.njk"
 ---
 
-<section class="py-600">
-  <h1 class="container-full text-center mb-500">{{ demo[locale].heading }}</h1>
+<section class="py-900">
+  <h1 class="container-full text-center mb-600">{{ demo[locale].heading }}</h1>
 
   <h2>{{ demo[locale].subheading }}</h2>
 
   {# ------------- Alerts ------------- #}
 
-  <h3 class="container-full mt-500 mb-400 bb-sm">{{ demo[locale].alerts.heading }}</h3>
+  <h3 class="container-full mt-600 mb-300 bb-sm">{{ demo[locale].alerts.heading }}</h3>
   <gcds-alert heading="{{ demo[locale].alerts.content.heading }}" alert-role="success" container="xl">
     <p>{{ demo[locale].alerts.content.text }}</p>
   </gcds-alert>
@@ -25,7 +25,7 @@ layout: "layouts/base.njk"
 
   {# ------------- Breadcrumbs ------------- #}
 
-  <h3 class="container-full mt-500 mb-400 bb-sm">{{ demo[locale].breadcrumbs.heading }}</h3>
+  <h3 class="container-full mt-600 mb-300 bb-sm">{{ demo[locale].breadcrumbs.heading }}</h3>
 
   <gcds-breadcrumbs slot="breadcrumb">
     <gcds-breadcrumbs-item href="{{ demo[locale].breadcrumbs.content.gcLink }}">
@@ -38,7 +38,7 @@ layout: "layouts/base.njk"
 
   {# ------------- Buttons ------------- #}
 
-  <h3 class="container-full mt-500 mb-400 bb-sm">{{ demo[locale].buttons.heading }}</h3>
+  <h3 class="container-full mt-600 mb-300 bb-sm">{{ demo[locale].buttons.heading }}</h3>
   <gcds-button button-role="primary">
     {{ demo[locale].buttons.content.primary }}
   </gcds-button>
@@ -65,7 +65,7 @@ layout: "layouts/base.njk"
 
   {# ------------- Container ------------- #}
 
-  <h3 class="container-full mt-700 mb-400 bb-sm">{{ demo[locale].containers.heading }}</h3>
+  <h3 class="container-full mt-600 mb-300 bb-sm">{{ demo[locale].containers.heading }}</h3>
   <gcds-container container="full">
     <div class="p-200 b-sm">{{ demo[locale].containers.content.full }}</div>
   </gcds-container>
@@ -80,19 +80,19 @@ layout: "layouts/base.njk"
 
   {# ------------- Date modified ------------- #}
 
-  <h3 class="container-full mt-700 mb-400 bb-sm">{{ demo[locale].dateModified.heading }}</h3>
+  <h3 class="container-full mt-600 mb-300 bb-sm">{{ demo[locale].dateModified.heading }}</h3>
   <gcds-date-modified>2023-01-26</gcds-date-modified>
 
   {# ------------- Details ------------- #}
 
-  <h3 class="container-full mt-700 mb-400 bb-sm">{{ demo[locale].details.heading }}</h3>
+  <h3 class="container-full mt-600 mb-300 bb-sm">{{ demo[locale].details.heading }}</h3>
   <gcds-details details-title="{{ demo[locale].details.content.heading }}">
     <p>{{ demo[locale].details.content.text }}</p>
   </gcds-details>
 
   {# ------------- Footer ------------- #}
 
-  <h3 class="container-full mt-700 mb-400 bb-sm">{{ demo[locale].footer.heading }}</h3>
+  <h3 class="container-full mt-600 mb-300 bb-sm">{{ demo[locale].footer.heading }}</h3>
   <gcds-footer
     display="full"
     contextual-heading="{{ demo[locale].footer.content.contextualHeading }}"
@@ -178,13 +178,12 @@ layout: "layouts/base.njk"
 
   {# ------------- Grid ------------- #}
 
-  <h3 class="container-full mt-700 mb-400 bb-sm">{{ demo[locale].grid.heading }}</h3>
+  <h3 class="container-full mt-600 mb-300 bb-sm">{{ demo[locale].grid.heading }}</h3>
   <gcds-grid
     tag="article"
     columns-desktop="1fr 1fr 1fr 1fr"
     columns-tablet="1fr 1fr"
     columns="1fr"
-    gap="500"
   >
     <p>{{ demo[locale].grid.content.text }}</p>
     <p>{{ demo[locale].grid.content.text }}</p>
@@ -194,7 +193,7 @@ layout: "layouts/base.njk"
 
   {# ------------- Header ------------- #}
 
-  <h3 class="container-full mt-700 mb-400 bb-sm">{{ demo[locale].header.heading }}</h3>
+  <h3 class="container-full mt-600 mb-300 bb-sm">{{ demo[locale].header.heading }}</h3>
   <gcds-header
     lang="{{ demo[locale].header.content.lang }}"
     lang-href="#"
@@ -222,7 +221,7 @@ layout: "layouts/base.njk"
 
   {# ------------- Icons ------------- #}
 
-  <h3 class="container-full mt-700 mb-400 bb-sm">{{ demo[locale].icons.heading }}</h3>
+  <h3 class="container-full mt-600 mb-300 bb-sm">{{ demo[locale].icons.heading }}</h3>
   <gcds-icon name="tree" size="caption" margin-right="200"></gcds-icon>
   <gcds-icon name="tree" size="text" margin-right="200"></gcds-icon>
   <gcds-icon name="tree" size="h6" margin-right="200"></gcds-icon>
@@ -232,7 +231,7 @@ layout: "layouts/base.njk"
   <gcds-icon name="tree" size="h2" margin-right="200"></gcds-icon>
   <gcds-icon name="tree" size="h1" margin-right="200"></gcds-icon>
 
-  <h4 class="mt-500 mb-300">{{ demo[locale].icons.content.fixed }}</h4>
+  <h4 class="mt-600 mb-300">{{ demo[locale].icons.content.fixed }}</h4>
   <gcds-icon name="tree" size="caption" fixed-width></gcds-icon>
   <gcds-icon name="tree" size="text" fixed-width></gcds-icon>
   <gcds-icon name="tree" size="h6" fixed-width></gcds-icon>
@@ -242,7 +241,7 @@ layout: "layouts/base.njk"
   <gcds-icon name="tree" size="h2" fixed-width></gcds-icon>
   <gcds-icon name="tree" size="h1" fixed-width></gcds-icon>
 
-  <h4 class="mt-500 mb-300">{{ demo[locale].icons.content.variable }}</h4>
+  <h4 class="mt-600 mb-300">{{ demo[locale].icons.content.variable }}</h4>
   <gcds-icon name="tree" size="caption"></gcds-icon>
   <gcds-icon name="tree" size="text"></gcds-icon>
   <gcds-icon name="tree" size="h6"></gcds-icon>
@@ -254,7 +253,7 @@ layout: "layouts/base.njk"
 
   {# ------------- Pagination ------------- #}
 
-  <h3 class="container-full mt-700 mb-400 bb-sm">{{ demo[locale].pagination.heading }}</h3>
+  <h3 class="container-full mt-600 mb-300 bb-sm">{{ demo[locale].pagination.heading }}</h3>
 
   <p>{{ demo[locale].pagination.content.list }}:</p>
   <gcds-pagination
@@ -267,7 +266,7 @@ layout: "layouts/base.njk"
     pageChangeHandler={}
   ></gcds-pagination>
 
-  <p class="mt-500">{{ demo[locale].pagination.content.simple }}:</p>
+  <p class="mt-600">{{ demo[locale].pagination.content.simple }}:</p>
   <gcds-pagination
     display="simple"
     label="{{ demo[locale].pagination.content.simple }}"
@@ -279,7 +278,7 @@ layout: "layouts/base.njk"
 
   {# ------------- Phase banner ------------- #}
 
-  <h3 class="container-full mt-700 mb-400 bb-sm">{{ demo[locale].phaseBanner.heading }}</h3>
+  <h3 class="container-full mt-600 mb-300 bb-sm">{{ demo[locale].phaseBanner.heading }}</h3>
   <gcds-phase-banner banner-role="primary">
     <gcds-icon name="tree" size="sm" slot="banner-icon-left"></gcds-icon>
     <p slot="banner-text">{{ demo[locale].phaseBanner.content.text }}</p>
diff --git a/src/_includes/layouts/home.njk b/src/_includes/layouts/home.njk
index 51f75d5b5..11e9ffeaa 100644
--- a/src/_includes/layouts/home.njk
+++ b/src/_includes/layouts/home.njk
@@ -43,25 +43,25 @@
 
       <main id="mc" class="general-layout">
         <section>
-            <div class="xl:py-900 md:py-800 py-600 hero">
+            <div class="md:py-1250 py-900 hero">
               <div class="container-xl mx-auto">
-                <article class="sm:py-550 py-450 xl:ps-0 sm:ps-500 ps-450 sm:pe-550 pe-400 bg-primary text-light hero__content">
-                  <h1 class="mb-400">
+                <article class="sm:py-750 py-450 xl:ps-0 sm:ps-600 ps-450 sm:pe-750 pe-300 bg-primary text-light hero__content">
+                  <h1 class="mb-300">
                     <span class="d-block">{{ homehero[locale].gcds }}</span>
                   </h1>
-                  <p class="mb-400">{{ homehero[locale].paragraph }}</p>
+                  <p class="mb-300">{{ homehero[locale].paragraph }}</p>
                   <a class="link-light" href="{{ homehero[locale].link }}">{{ homehero[locale].linkText }}</a>
                 </article>
               </div>
             </div>
         </section>
 
-        <section class="container-xl mx-auto xl:px-0 sm:px-500 px-300">
+        <section class="container-xl mx-auto xl:px-0 sm:px-600 px-225">
           {% block content %}{{ content | safe }}{% endblock %}
 
           {% include "partials/helpus.njk" %}
 
-          <gcds-date-modified class="mb-400 font-caption">
+          <gcds-date-modified class="mb-300">
             {{ page.date | dateLastModified}}
           </gcds-date-modified>
         </section>
diff --git a/src/_includes/partials/card-list.njk b/src/_includes/partials/card-list.njk
index 94a090eb2..2d09eb91d 100644
--- a/src/_includes/partials/card-list.njk
+++ b/src/_includes/partials/card-list.njk
@@ -7,8 +7,8 @@
 {% endif %}
 
 {% if (cardlist.type === 'components' or cardlist.type === 'foundations') and cardlist.state === 'published' %}
-  <div class="my-500">
-    <gcds-grid tag="ul" columns="1fr" columns-tablet="1fr 1fr" columns-desktop="1fr 1fr 1fr" gap="400">
+  <div class="my-600">
+    <gcds-grid tag="ul" columns="1fr" columns-tablet="1fr 1fr" columns-desktop="1fr 1fr 1fr">
     {%- for entry in navPages %}
       {% if entry.state == cardlist.state %}
         <gcds-card
@@ -22,7 +22,7 @@
         >
           <gcds-text >{{ entry.description }}</gcds-text>
           {% if entry.otherNames %}
-            <gcds-text text-role="secondary" size="caption" margin-bottom="0">
+            <gcds-text text-role="secondary" size="small" margin-bottom="0">
               <em>{{ documentation[locale].othernames }}{{ entry.otherNames }}</em>
             </gcds-text>
           {% endif %}
diff --git a/src/_includes/partials/components-tags.njk b/src/_includes/partials/components-tags.njk
index 214b6adb2..a376cdeae 100644
--- a/src/_includes/partials/components-tags.njk
+++ b/src/_includes/partials/components-tags.njk
@@ -1,5 +1,5 @@
-<h2 id="component-tags" class="mt-500 mb-400">{{ componenttags[locale].heading }}</h2>
+<h2 id="component-tags" class="mt-600 mb-300">{{ componenttags[locale].heading }}</h2>
 
 {% for value in componenttags[locale].paragraphs %}
-<p class="mb-400">{{ value }}</p>
+<p class="mb-300">{{ value }}</p>
 {% endfor %}
diff --git a/src/_includes/partials/helpus.njk b/src/_includes/partials/helpus.njk
index 4de199c2b..13a57f26e 100644
--- a/src/_includes/partials/helpus.njk
+++ b/src/_includes/partials/helpus.njk
@@ -1,9 +1,9 @@
-<section data-pagefind-ignore class="pt-100 mt-400 mb-600 {% if removeBorder %} {% else %}bt-sm b-dark {% endif %}">
-  <h2 class="mt-300 mb-400">
+<section data-pagefind-ignore class="pt-75 mt-300 mb-900 {% if removeBorder %} {% else %}bt-sm b-dark {% endif %}">
+  <h2 class="mt-225 mb-300">
     {{ helpus[locale].heading }}
   </h2>
 
-  <p class="mb-400">
+  <p class="mb-300">
     {{ helpus[locale].paragraph }}
   </p>
 
diff --git a/src/_includes/partials/installation/step-1.njk b/src/_includes/partials/installation/step-1.njk
index 6e4c3034c..3189d390b 100644
--- a/src/_includes/partials/installation/step-1.njk
+++ b/src/_includes/partials/installation/step-1.njk
@@ -1,5 +1,5 @@
-<div class="mt-550 pt-550 pb-450 bg-full-width bg-light">
-  <h2 class="mb-400">{{ installation[locale].step1.heading }}</h2>
+<div class="mt-750 pt-750 pb-450 bg-full-width bg-light">
+  <h2 class="mb-300">{{ installation[locale].step1.heading }}</h2>
   <p class="mb-450">{{ installation[locale].step1.paragraph }}</p>
   <gcds-select
     name="select-environment"
diff --git a/src/_includes/partials/installation/step-2-angular.njk b/src/_includes/partials/installation/step-2-angular.njk
index 1ac2a3a04..6ed34632c 100644
--- a/src/_includes/partials/installation/step-2-angular.njk
+++ b/src/_includes/partials/installation/step-2-angular.njk
@@ -1,15 +1,15 @@
-<div id="step-2-angular" class="py-550 step-2-content">
-  <h2 class="mb-400">{{ installation[locale].step2.heading }}</h2>
-  <p class="mb-400">{{ installation[locale].step2.angular.paragraph }}</p>
+<div id="step-2-angular" class="py-750 step-2-content">
+  <h2 class="mb-300">{{ installation[locale].step2.heading }}</h2>
+  <p class="mb-300">{{ installation[locale].step2.angular.paragraph }}</p>
 
-  <h3 class="mt-500 mb-400">{{ installation[locale].step2.angular.heading }}</h3>
-  <p class="mb-400">{{ installation[locale].step2.angular.install }}</p>
+  <h3 class="mt-600 mb-300">{{ installation[locale].step2.angular.heading }}</h3>
+  <p class="mb-300">{{ installation[locale].step2.angular.install }}</p>
 
   {% highlight "js" %}
   npm install @cdssnc/gcds-components @cdssnc/gcds-components-angular
   {% endhighlight %}
 
-  <p class="mt-500 mb-400">{{ installation[locale].step2.angular.placeApp | safe }}</p>
+  <p class="mt-600 mb-300">{{ installation[locale].step2.angular.placeApp | safe }}</p>
 
 {% highlight "js" %}
 import { GcdsComponentsModule } from '@cdssnc/gcds-components-angular';
@@ -29,7 +29,7 @@ import { GcdsComponentsModule } from '@cdssnc/gcds-components-angular';
 export class AppModule { }
 {% endhighlight %}
 
-  <p class="mt-500 mb-400">{{ installation[locale].step2.angular.placeStyles | safe }}</p>
+  <p class="mt-600 mb-300">{{ installation[locale].step2.angular.placeStyles | safe }}</p>
 
   {% highlight "js" %}
   @import '../node_modules/@cdssnc/gcds-components/dist/gcds/gcds.css';
diff --git a/src/_includes/partials/installation/step-2-cdn.njk b/src/_includes/partials/installation/step-2-cdn.njk
index 2c07a6599..5434086b8 100644
--- a/src/_includes/partials/installation/step-2-cdn.njk
+++ b/src/_includes/partials/installation/step-2-cdn.njk
@@ -1,10 +1,10 @@
-<div id="step-2-cdn" class="py-550 step-2-content">
-  <h2 class="mb-400">{{ installation[locale].step2.heading }}</h2>
-  <p class="mb-400">{{ installation[locale].step2.cdn.paragraph }}</p>
+<div id="step-2-cdn" class="py-750 step-2-content">
+  <h2 class="mb-300">{{ installation[locale].step2.heading }}</h2>
+  <p class="mb-300">{{ installation[locale].step2.cdn.paragraph }}</p>
 
-  <h3 class="mt-500 mb-400">{{ installation[locale].step2.cdn.heading }}</h3>
-  <p class="mb-400">{{ installation[locale].step2.cdn.version | safe }}</p>
-  <p class="mb-400">{{ installation[locale].step2.cdn.place | safe }}</p>
+  <h3 class="mt-600 mb-300">{{ installation[locale].step2.cdn.heading }}</h3>
+  <p class="mb-300">{{ installation[locale].step2.cdn.version | safe }}</p>
+  <p class="mb-300">{{ installation[locale].step2.cdn.place | safe }}</p>
 
 {% highlight "html" %}
 <!-- Icons Font Awesome ({{ installation[locale].step2.cdn.icons }}) -->
@@ -18,8 +18,8 @@
 
   <small>{{ installation[locale].step2.cdn.note | safe }}</small>
 
-  <h3 class="mt-500 mb-400">{{ installation[locale].step2.cdn.subheading | safe }}</h3>
-  <p class="mb-400">{{ installation[locale].step2.cdn.latest | safe }}</p>
+  <h3 class="mt-600 mb-300">{{ installation[locale].step2.cdn.subheading | safe }}</h3>
+  <p class="mb-300">{{ installation[locale].step2.cdn.latest | safe }}</p>
 </div>
 
 <script>
diff --git a/src/_includes/partials/installation/step-2-choose.njk b/src/_includes/partials/installation/step-2-choose.njk
index e5087a136..6d8f165ef 100644
--- a/src/_includes/partials/installation/step-2-choose.njk
+++ b/src/_includes/partials/installation/step-2-choose.njk
@@ -1,4 +1,4 @@
-<div id="step-2-choose" class="py-550 step-2-content">
-  <h2 class="mb-400">{{ installation[locale].step2.heading }}</h2>
+<div id="step-2-choose" class="py-750 step-2-content">
+  <h2 class="mb-300">{{ installation[locale].step2.heading }}</h2>
   <p>{{ installation[locale].step2.choose.paragraph }}</p>
 </div>
diff --git a/src/_includes/partials/installation/step-2-figma.njk b/src/_includes/partials/installation/step-2-figma.njk
index 1eb1f3d9f..117a99cb6 100644
--- a/src/_includes/partials/installation/step-2-figma.njk
+++ b/src/_includes/partials/installation/step-2-figma.njk
@@ -1,6 +1,6 @@
-<div id="step-2-figma" class="py-550 step-2-content">
-  <h2 class="mb-400">{{ installation[locale].step2.heading }}</h2>
-  <p class="mb-400">{{ installation[locale].step2.figma.paragraph }}</p>
+<div id="step-2-figma" class="py-750 step-2-content">
+  <h2 class="mb-300">{{ installation[locale].step2.heading }}</h2>
+  <p class="mb-300">{{ installation[locale].step2.figma.paragraph }}</p>
   <gcds-button
     type="link"
     button-role="secondary"
diff --git a/src/_includes/partials/installation/step-2-node.njk b/src/_includes/partials/installation/step-2-node.njk
index cea4cd6d9..95ebb9d9b 100644
--- a/src/_includes/partials/installation/step-2-node.njk
+++ b/src/_includes/partials/installation/step-2-node.njk
@@ -1,15 +1,15 @@
-<div id="step-2-node" class="py-550 step-2-content">
-  <h2 class="mb-400">{{ installation[locale].step2.heading }}</h2>
-  <p class="mb-400">{{ installation[locale].step2.node.paragraph }}</p>
+<div id="step-2-node" class="py-750 step-2-content">
+  <h2 class="mb-300">{{ installation[locale].step2.heading }}</h2>
+  <p class="mb-300">{{ installation[locale].step2.node.paragraph }}</p>
 
-  <h3 class="mt-500 mb-400">{{ installation[locale].step2.node.heading }}</h3>
-  <p class="mb-400">{{ installation[locale].step2.node.install }}</p>
+  <h3 class="mt-600 mb-300">{{ installation[locale].step2.node.heading }}</h3>
+  <p class="mb-300">{{ installation[locale].step2.node.install }}</p>
 
   {% highlight "js" %}
   npm install @cdssnc/gcds-components
   {% endhighlight %}
 
-  <p class="mt-500 mb-400">{{ installation[locale].step2.node.place | safe }}</p>
+  <p class="mt-600 mb-300">{{ installation[locale].step2.node.place | safe }}</p>
 
 {% highlight "html" %}
 <!-- Icons Font Awesome ({{ installation[locale].step2.node.icons }}) -->
diff --git a/src/_includes/partials/installation/step-2-none.njk b/src/_includes/partials/installation/step-2-none.njk
index f7bda2365..c4e7b08c7 100644
--- a/src/_includes/partials/installation/step-2-none.njk
+++ b/src/_includes/partials/installation/step-2-none.njk
@@ -1,6 +1,6 @@
-<div id="step-2-none" class="py-550 step-2-content">
-  <h2 class="mb-400">{{ installation[locale].step2.heading }}</h2>
-  <p class="mb-400">{{ installation[locale].step2.other.paragraph }}</p>
+<div id="step-2-none" class="py-750 step-2-content">
+  <h2 class="mb-300">{{ installation[locale].step2.heading }}</h2>
+  <p class="mb-300">{{ installation[locale].step2.other.paragraph }}</p>
   <gcds-button
     type="link"
     button-role="secondary"
diff --git a/src/_includes/partials/installation/step-2-react.njk b/src/_includes/partials/installation/step-2-react.njk
index 2a0bc325a..9b761fe4b 100644
--- a/src/_includes/partials/installation/step-2-react.njk
+++ b/src/_includes/partials/installation/step-2-react.njk
@@ -1,15 +1,15 @@
-<div id="step-2-react" class="py-550 step-2-content">
-  <h2 class="mb-400">{{ installation[locale].step2.heading }}</h2>
-  <p class="mb-400">{{ installation[locale].step2.react.paragraph }}</p>
+<div id="step-2-react" class="py-750 step-2-content">
+  <h2 class="mb-300">{{ installation[locale].step2.heading }}</h2>
+  <p class="mb-300">{{ installation[locale].step2.react.paragraph }}</p>
 
-  <h3 class="mt-500 mb-400">{{ installation[locale].step2.react.heading }}</h3>
-  <p class="mb-400">{{ installation[locale].step2.react.install }}</p>
+  <h3 class="mt-600 mb-300">{{ installation[locale].step2.react.heading }}</h3>
+  <p class="mb-300">{{ installation[locale].step2.react.install }}</p>
 
   {% highlight "js" %}
     npm install @cdssnc/gcds-components @cdssnc/gcds-components-react
   {% endhighlight %}
 
-  <p class="mt-500 mb-400">{{ installation[locale].step2.react.place | safe }}</p>
+  <p class="mt-600 mb-300">{{ installation[locale].step2.react.place | safe }}</p>
 
   {% highlight "js" %}
     import '@cdssnc/gcds-components-react/gcds.css'
diff --git a/src/_includes/partials/installation/step-2-vue.njk b/src/_includes/partials/installation/step-2-vue.njk
index 991c0054e..4f6647da8 100644
--- a/src/_includes/partials/installation/step-2-vue.njk
+++ b/src/_includes/partials/installation/step-2-vue.njk
@@ -1,15 +1,15 @@
-<div id="step-2-vue" class="py-550 step-2-content">
-  <h2 class="mb-400">{{ installation[locale].step2.heading }}</h2>
-  <p class="mb-400">{{ installation[locale].step2.vue.paragraph }}</p>
+<div id="step-2-vue" class="py-750 step-2-content">
+  <h2 class="mb-300">{{ installation[locale].step2.heading }}</h2>
+  <p class="mb-300">{{ installation[locale].step2.vue.paragraph }}</p>
 
-  <h3 class="mt-500 mb-400">{{ installation[locale].step2.vue.heading }}</h3>
-  <p class="mb-400">{{ installation[locale].step2.vue.install }}</p>
+  <h3 class="mt-600 mb-300">{{ installation[locale].step2.vue.heading }}</h3>
+  <p class="mb-300">{{ installation[locale].step2.vue.install }}</p>
 
   {% highlight "js" %}
   npm install @cdssnc/gcds-components-vue
   {% endhighlight %}
 
-  <p class="mt-500 mb-400">{{ installation[locale].step2.vue.place | safe }}</p>
+  <p class="mt-600 mb-300">{{ installation[locale].step2.vue.place | safe }}</p>
 
   {% highlight "js" %}
   import { GcdsComponents } from '@cdssnc/gcds-components-vue';
@@ -17,21 +17,21 @@
 createApp(App).use(GcdsComponents).mount('#app');
   {% endhighlight %}
 
-  <p class="mt-500 mb-400">{{ installation[locale].step2.vue.globalStyles }}</p>
+  <p class="mt-600 mb-300">{{ installation[locale].step2.vue.globalStyles }}</p>
 
-  <p class="mt-500 mb-400">{{ installation[locale].step2.vue.styleOne | safe }}</p>
+  <p class="mt-600 mb-300">{{ installation[locale].step2.vue.styleOne | safe }}</p>
 
   {% highlight "js" %}
   import '@cdssnc/gcds-components-vue/gcds.css';
 import './style.css';
   {% endhighlight %}
 
-  <p class="mt-500 mb-400">{{ installation[locale].step2.vue.styleTwo | safe }}</p>
+  <p class="mt-600 mb-300">{{ installation[locale].step2.vue.styleTwo | safe }}</p>
 
   {% highlight "html" %}
   <style src='@cdssnc/gcds-components-vue/gcds.css'>
   /* global styles */
-</style> 
+</style>
   {% endhighlight %}
 
 </div>
diff --git a/src/_includes/partials/installation/step-3.njk b/src/_includes/partials/installation/step-3.njk
index 807b6c085..cd39f3064 100644
--- a/src/_includes/partials/installation/step-3.njk
+++ b/src/_includes/partials/installation/step-3.njk
@@ -1,7 +1,7 @@
-<div class="py-550 bg-full-width bg-light">
-  <h2 class="mb-400">{{ installation[locale].step3.heading }}</h2>
+<div class="py-750 bg-full-width bg-light">
+  <h2 class="mb-300">{{ installation[locale].step3.heading }}</h2>
   {% for value in installation[locale].step3.paragraphs %}
-    <p class="mb-400">{{ value }}</p>
+    <p class="mb-300">{{ value }}</p>
   {% endfor %}
   <gcds-button type="link" href="{{ installation[locale].step3.link }}">
     {{ installation[locale].step3.buttonText }}
diff --git a/src/_includes/partials/lookingfor.njk b/src/_includes/partials/lookingfor.njk
index 6724c1b81..d6b7342b8 100644
--- a/src/_includes/partials/lookingfor.njk
+++ b/src/_includes/partials/lookingfor.njk
@@ -8,17 +8,17 @@
   {% set paragraph = lookingfor[locale]["coparagraph"] %}
 {% endif %}
 
-<section class="pt-100 mt-400">
-  <h2 class="mt-300 mb-400">
+<section class="pt-75 mt-300">
+  <h2 class="mt-225 mb-300">
     {{ lookingfor[locale].heading }}
   </h2>
 
-  <p class="mb-400">
+  <p class="mb-300">
     {{ paragraph | safe }}
   </p>
 
-  <ul class="mb-600">
-    <li class="md:d-inline sm:d-block me-200">
+  <ul class="mb-900">
+    <li class="md:d-inline sm:d-block me-150">
       <gcds-button
         type="link"
         button-role="primary"
@@ -28,7 +28,7 @@
       </gcds-button>
     </li>
 
-    <li class="md:d-inline sm:d-block mt-150 md:mt-0">
+    <li class="md:d-inline sm:d-block mt-100 md:mt-0">
       <gcds-button
         type="link"
         button-role="secondary"
diff --git a/src/_includes/partials/token_table.njk b/src/_includes/partials/token_table.njk
index 686b33bb7..7b80f8fc5 100644
--- a/src/_includes/partials/token_table.njk
+++ b/src/_includes/partials/token_table.njk
@@ -1,4 +1,4 @@
-<div class="mb-400 table-overflow">
+<div class="mb-300 table-overflow">
     <table class="table-display-token-{{type}}">
         <thead>
             <tr>
diff --git a/src/en/components/breadcrumbs/design.md b/src/en/components/breadcrumbs/design.md
index e9245e72a..56fbf6d68 100644
--- a/src/en/components/breadcrumbs/design.md
+++ b/src/en/components/breadcrumbs/design.md
@@ -15,7 +15,7 @@ date: 'git Last Modified'
   <li>The <strong>parent page link</strong> navigates to the parent page of the current page. You can have up to three parent page links in addition to the homepage and the Canada.ca home or 5 in total.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/en/components/anatomy/gcds-breadcrumbs-anatomy.svg" alt="Breadcrumbs anatomy showing three links in a row with an arrow icon between them." />
+<img class="b-sm b-default p-300" src="/images/en/components/anatomy/gcds-breadcrumbs-anatomy.svg" alt="Breadcrumbs anatomy showing three links in a row with an arrow icon between them." />
 
 ### Breadcrumbs anatomy – with header and H1 title
 
@@ -26,7 +26,7 @@ date: 'git Last Modified'
   <li>The <strong>H1 title</strong> is a separate element from the breadcrumbs component. It tells readers what the page or site is about and acts a signpost, giving them a sense of place.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/en/components/anatomy/gcds-breadcrumbs-anatomy-with-header.svg" alt="Breadcrumbs anatomy showing three links in a row with an arrow icon between them below the header component." />
+<img class="b-sm b-default p-300" src="/images/en/components/anatomy/gcds-breadcrumbs-anatomy-with-header.svg" alt="Breadcrumbs anatomy showing three links in a row with an arrow icon between them below the header component." />
 
 ## Design and accessibility for breadcrumbs
 
diff --git a/src/en/components/breadcrumbs/use-case.md b/src/en/components/breadcrumbs/use-case.md
index 14544226d..21133551a 100644
--- a/src/en/components/breadcrumbs/use-case.md
+++ b/src/en/components/breadcrumbs/use-case.md
@@ -30,8 +30,8 @@ Use breadcrumbs to signal a visitor's current location and give them a sense of
 - Situate the current page in relation to its parent in the site structure.
 - Organize websites in a hierarchy of more than two levels.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Related components</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Related components</h2>
 
 <a href="{{ links.footer }}" class="link-light">Footer</a> for placing the Government of Canada branded footer landmark.
 
diff --git a/src/en/components/button/base.md b/src/en/components/button/base.md
index a47d191ad..271967632 100644
--- a/src/en/components/button/base.md
+++ b/src/en/components/button/base.md
@@ -16,7 +16,7 @@ The button is an interactive object that highlights an important or common actio
 {% enddocLinks %}
 
 {% componentPreview "Button component preview" %}
-<gcds-button class="me-400" button-role="primary">Submit</gcds-button>
-<gcds-button class="me-400" button-role="secondary">Cancel</gcds-button>
-<gcds-button class="me-400" button-role="danger">Delete</gcds-button>
+<gcds-button class="me-300" button-role="primary">Submit</gcds-button>
+<gcds-button class="me-300" button-role="secondary">Cancel</gcds-button>
+<gcds-button class="me-300" button-role="danger">Delete</gcds-button>
 {% endcomponentPreview %}
diff --git a/src/en/components/button/design.md b/src/en/components/button/design.md
index 103c3ad63..b7a1d5d41 100644
--- a/src/en/components/button/design.md
+++ b/src/en/components/button/design.md
@@ -14,7 +14,7 @@ date: 'git Last Modified'
   <li>The <strong>icon</strong> is optional and can be a helpful visual aid when used sparingly and predictably. When there's an icon, align button text to the left.  Avoid using an icon without text.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/en/components/anatomy/gcds-button-anatomy.svg" alt="Button anatomy showing the Button label branching to the container and arrow icon." />
+<img class="b-sm b-default p-300" src="/images/en/components/anatomy/gcds-button-anatomy.svg" alt="Button anatomy showing the Button label branching to the container and arrow icon." />
 
 ## Design and accessibility for buttons
 
diff --git a/src/en/components/button/use-case.md b/src/en/components/button/use-case.md
index 3d1898f81..032d3684c 100644
--- a/src/en/components/button/use-case.md
+++ b/src/en/components/button/use-case.md
@@ -28,8 +28,8 @@ Use a button for important actions a person using your product can initiate to:
 - Starting a flow, like a tutorial, or sign in to a secure space.
 - Move between steps in a sequence.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Related components</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Related components</h2>
 
 <a href="{{ links.link }}" class="link-light">Links</a> to provide navigation to a new page, website, or section on the current page or files for download.
 
@@ -76,13 +76,13 @@ Note: Always use the [link component]({{ links.link }}) when you need to embed a
 A role is a button sub-type that has a specific use on a page.
 
 <div class="remove-empty-p">
-<gcds-grid columns="1fr" columns-tablet="1fr 2fr" gap="500" align-items="start">
-  {% componentPreview "Primary button preview" "px-300 py-400" "" %}
+<gcds-grid columns="1fr" columns-tablet="1fr 2fr" align-items="start">
+  {% componentPreview "Primary button preview" "px-225 py-300" "" %}
   <gcds-button button-role="primary">Submit</gcds-button>
   {% endcomponentPreview %}
   <div>
-    <h3 class="mb-400">Primary button uses</h3>
-    <ul class="list-disc mb-400">
+    <h3 class="mb-300">Primary button uses</h3>
+    <ul class="list-disc mb-300">
       <li>The most important action on a page.</li>
       <li>Critical actions in a flow or as the default button.</li>
       <li>Only use a single time.</li>
@@ -91,13 +91,13 @@ A role is a button sub-type that has a specific use on a page.
   </div>
 </gcds-grid>
 <br/>
-<gcds-grid columns="1fr" columns-tablet="1fr 2fr" gap="500" align-items="start">
-  {% componentPreview "Secondary button preview" "px-300 py-400" "" %}
+<gcds-grid columns="1fr" columns-tablet="1fr 2fr" align-items="start">
+  {% componentPreview "Secondary button preview" "px-225 py-300" "" %}
   <gcds-button button-role="secondary">Cancel</gcds-button>
   {% endcomponentPreview %}
   <div>
-    <h3 class="mb-400">Secondary button uses</h3>
-    <ul class="list-disc mb-400">
+    <h3 class="mb-300">Secondary button uses</h3>
+    <ul class="list-disc mb-300">
       <li>Supporting actions.</li>
       <li>To highlight an important, common action but not the most important one.</li>
       <li>If needed, more than once on a page for important alternative task options.</li>
@@ -105,13 +105,13 @@ A role is a button sub-type that has a specific use on a page.
   </div>
 </gcds-grid>
 <br/>
-<gcds-grid columns="1fr" columns-tablet="1fr 2fr" gap="500" align-items="start">
-  {% componentPreview "Danger button preview" "px-300 py-400" "" %}
+<gcds-grid columns="1fr" columns-tablet="1fr 2fr" align-items="start">
+  {% componentPreview "Danger button preview" "px-225 py-300" "" %}
   <gcds-button button-role="danger">Delete</gcds-button>
   {% endcomponentPreview %}
   <div>
-    <h3 class="mb-400">Danger button uses</h3>
-    <ul class="list-disc mb-400">
+    <h3 class="mb-300">Danger button uses</h3>
+    <ul class="list-disc mb-300">
       <li>To flag serious actions like removing, clearing, or deleting information.</li>
       <li>For actions when changes may be difficult to reverse.</li>
     </ul>
diff --git a/src/en/components/card/design.md b/src/en/components/card/design.md
index 08330e128..5c12dfba0 100644
--- a/src/en/components/card/design.md
+++ b/src/en/components/card/design.md
@@ -16,7 +16,7 @@ date: 'git Last Modified'
   <li>The <strong>description</strong> (optional) has text that supports the card title. It may include a few lines of summary on the card's topic or a list of details about the same subject, like a list of event details.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/en/components/anatomy/gcds-card-anatomy.svg" alt="A card anatomy represented by 5 elements: the container, the badge, the image, the headline, and the description."/>
+<img class="b-sm b-default p-300" src="/images/en/components/anatomy/gcds-card-anatomy.svg" alt="A card anatomy represented by 5 elements: the container, the badge, the image, the headline, and the description."/>
 
 ## Design and accessibility for cards
 
diff --git a/src/en/components/card/use-case.md b/src/en/components/card/use-case.md
index afba4b6c1..ff0f38e73 100644
--- a/src/en/components/card/use-case.md
+++ b/src/en/components/card/use-case.md
@@ -31,8 +31,8 @@ Use a card to:
 
 Note: For Canada.ca, avoid using cards in place of the doormats with the templates for landing page and theme and topic page.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Related components</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Related components</h2>
 
 <a href="{{ links.details }}" class="link-light">Details</a> to hide secondary information that a person can expand on the same page.
 
diff --git a/src/en/components/checkbox/base.md b/src/en/components/checkbox/base.md
index b20cacabc..552f38bc3 100644
--- a/src/en/components/checkbox/base.md
+++ b/src/en/components/checkbox/base.md
@@ -15,7 +15,7 @@ A checkbox is a set of options for one or multiple selections.
 {% docLinks locale stage figma github %}
 {% enddocLinks %}
 
-{% componentPreview "Checkbox component preview" "px-300 pt-400" %}
+{% componentPreview "Checkbox component preview" "px-225 pt-300" %}
 <gcds-fieldset fieldset-id="fieldset" legend="Legend" hint="Hint / Example message.">
 <gcds-checkbox
   checkbox-id="form-check-1"
diff --git a/src/en/components/checkbox/design.md b/src/en/components/checkbox/design.md
index 98c72a8ab..716b852cf 100644
--- a/src/en/components/checkbox/design.md
+++ b/src/en/components/checkbox/design.md
@@ -17,7 +17,7 @@ date: 'git Last Modified'
   <li>The <strong>checkbox hint text</strong> gives users additional information about the choice.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/en/components/anatomy/gcds-checkbox-anatomy-with-fieldset.svg" alt="Checkbox anatomy showing the labels Fieldset legend, Fieldset Hint, Checkbox, Checkbox Label, Checkmark, and Checkbox Hint." />
+<img class="b-sm b-default p-300" src="/images/en/components/anatomy/gcds-checkbox-anatomy-with-fieldset.svg" alt="Checkbox anatomy showing the labels Fieldset legend, Fieldset Hint, Checkbox, Checkbox Label, Checkmark, and Checkbox Hint." />
 
 ## Single checkbox anatomy
 
@@ -30,7 +30,7 @@ Use the fieldset component with the checkbox, except for checkboxes with a singl
   <li>The <strong>checkbox hint text</strong> gives users additional information about the choice.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/en/components/anatomy/gcds-checkbox-anatomy-single.svg" alt="Checkbox anatomy showing the labels Checkbox, Checkbox Label, Checkmark, and Checkbox Hint." />
+<img class="b-sm b-default p-300" src="/images/en/components/anatomy/gcds-checkbox-anatomy-single.svg" alt="Checkbox anatomy showing the labels Checkbox, Checkbox Label, Checkmark, and Checkbox Hint." />
 
 ## Design and accessibility for checkboxes
 
diff --git a/src/en/components/checkbox/use-case.md b/src/en/components/checkbox/use-case.md
index e7a16c252..5ae5d2517 100644
--- a/src/en/components/checkbox/use-case.md
+++ b/src/en/components/checkbox/use-case.md
@@ -9,7 +9,7 @@ eleventyNavigation:
   otherNames: checklist.
   description: An option or set of options where any of the available boxes can be selected.
   thumbnail: /images/common/components/preview-checkbox.svg
-  alt: A column of three checkboxes, each with thin grey border and white fill beside a thick grey line to represent the label. Two of the three boxes have a checkmark. 
+  alt: A column of three checkboxes, each with thin grey border and white fill beside a thick grey line to represent the label. Two of the three boxes have a checkmark.
   state: published
 translationKey: 'checkbox'
 tags: ['checkboxEN', 'usage']
@@ -27,8 +27,8 @@ Use a checkbox with a [fieldset]({{ links.fieldset }}) to make a request for inf
 - Let a person choose one or several answers from a contained list by checking off the right ones.
 - Give a person the ability to answer without writing by selecting one or multiple items from a list.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Related components</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Related components</h2>
 
 <a href="{{ links.radioGroup }}" class="link-light">Radio groups</a> to give a single option from a larger set of options.
 
diff --git a/src/en/components/container/base.md b/src/en/components/container/base.md
index fbfe9d798..eaf219eed 100644
--- a/src/en/components/container/base.md
+++ b/src/en/components/container/base.md
@@ -15,13 +15,13 @@ A container is a basic box layout with a set width for its contents.
 {% enddocLinks %}
 
 {% componentPreview "Container component preview" %}
-<gcds-container border margin="250" padding="250" size="lg">
+<gcds-container border margin="175" padding="175" size="lg">
 Large container
 </gcds-container>
-<gcds-container border margin="250" padding="250" size="md">
+<gcds-container border margin="175" padding="175" size="md">
 Medium container
 </gcds-container>
-<gcds-container border margin="250" padding="250" size="sm">
+<gcds-container border margin="175" padding="175" size="sm">
 Small container
 </gcds-container>
 {% endcomponentPreview %}
diff --git a/src/en/components/container/design.md b/src/en/components/container/design.md
index d794c2472..0656a3789 100644
--- a/src/en/components/container/design.md
+++ b/src/en/components/container/design.md
@@ -13,7 +13,7 @@ date: 'git Last Modified'
   <li>The <strong>optional border</strong> surrounds the container showing the width.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/en/components/anatomy/gcds-container-anatomy.svg" alt="The container component with numbers pointing to individual parts of the container anatomy." />
+<img class="b-sm b-default p-300" src="/images/en/components/anatomy/gcds-container-anatomy.svg" alt="The container component with numbers pointing to individual parts of the container anatomy." />
 
 ## Design and accessibility for containers
 
diff --git a/src/en/components/container/use-case.md b/src/en/components/container/use-case.md
index e5c5688f0..b0b24b42e 100644
--- a/src/en/components/container/use-case.md
+++ b/src/en/components/container/use-case.md
@@ -30,8 +30,8 @@ Use containers to:
 - Support readability and scannability by reducing the overall length of a line of text and presenting smaller chunks of content at a time.
 - Centre content on a screen or within a viewport.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Related components</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Related components</h2>
 
 <a href="{{ links.grid }}" class="link-light">Grid</a> for a responsive, flexible column layout to position elements on a page.
 
diff --git a/src/en/components/data-table/design.md b/src/en/components/data-table/design.md
index 0b421fc3d..e34f6d8f1 100644
--- a/src/en/components/data-table/design.md
+++ b/src/en/components/data-table/design.md
@@ -13,6 +13,6 @@ nocrawl: true
   <li><strong>list</strong></li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/{local}/components/anatomy/gcds-data-table-anatomy.svg" alt="An image of the anatomy." />
+<img class="b-sm b-default p-300" src="/images/{local}/components/anatomy/gcds-data-table-anatomy.svg" alt="An image of the anatomy." />
 
 ## Design and accessibility for Data table
diff --git a/src/en/components/data-table/use-case.md b/src/en/components/data-table/use-case.md
index 578ce780f..85ad61627 100644
--- a/src/en/components/data-table/use-case.md
+++ b/src/en/components/data-table/use-case.md
@@ -24,8 +24,8 @@ Use a Data table
 
 -
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Related components</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Related components</h2>
 
 <a href="" class="link-light">component</a>
 
diff --git a/src/en/components/date-input/design.md b/src/en/components/date-input/design.md
index 85d141738..0c4938015 100644
--- a/src/en/components/date-input/design.md
+++ b/src/en/components/date-input/design.md
@@ -18,13 +18,13 @@ date: "git Last Modified"
   <li>The <strong>year input</strong> field is limited to 4 digits.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/en/components/anatomy/gcds-date-input-anatomy.svg" alt="A date input anatomy represented by 6 elements: the fieldset legend, the month label, the month select field, the day label, the day input field, the year label, and the year input field." />
+<img class="b-sm b-default p-300" src="/images/en/components/anatomy/gcds-date-input-anatomy.svg" alt="A date input anatomy represented by 6 elements: the fieldset legend, the month label, the month select field, the day label, the day input field, the year label, and the year input field." />
 
 
 ## Design and accessibility for date inputs
 
 ### Support task success with hint text
-- Use the hint text in the fieldset legend to help a person understand the format they can use to enter the date. For example, showing a single digit number without a leading zero, like September 7, rather than September 07 shows that a leading zero is not needed. 
+- Use the hint text in the fieldset legend to help a person understand the format they can use to enter the date. For example, showing a single digit number without a leading zero, like September 7, rather than September 07 shows that a leading zero is not needed.
 
 ### Write specific error messages
 - Write error messages for each field of the date input. Error messages must provide information on what is missing or on incorrect formatting. For example, if the year was input using 2 digits, state that the year should be 4 digits.
diff --git a/src/en/components/date-input/use-case.md b/src/en/components/date-input/use-case.md
index 764a7a3a5..c626b05d9 100644
--- a/src/en/components/date-input/use-case.md
+++ b/src/en/components/date-input/use-case.md
@@ -28,8 +28,8 @@ Use a date input to gather a date from a person when you're expecting them to wr
 - A date that doesn’t include the specific day of the week.
 - Avoid using a date input for the selection of an unknown date. Use a date picker instead.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Related components</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Related components</h2>
 
   <a href="{{ links.input }}" class="link-light">Input</a> when you want someone to input only a year or only a day of the month.
 
diff --git a/src/en/components/date-modified/design.md b/src/en/components/date-modified/design.md
index eaa036b16..8c6fa3f87 100644
--- a/src/en/components/date-modified/design.md
+++ b/src/en/components/date-modified/design.md
@@ -13,7 +13,7 @@ date: 'git Last Modified'
   <li>The <strong>value</strong> is either a numerical date formatted as YYYY-MM-DD or a version number.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/en/components/anatomy/gcds-date-modified-anatomy.svg" alt="An image of the date modified component" />
+<img class="b-sm b-default p-300" src="/images/en/components/anatomy/gcds-date-modified-anatomy.svg" alt="An image of the date modified component" />
 
 ## Design and accessibility for date modified
 
diff --git a/src/en/components/date-modified/use-case.md b/src/en/components/date-modified/use-case.md
index 8a1f43efc..9ddf564f6 100644
--- a/src/en/components/date-modified/use-case.md
+++ b/src/en/components/date-modified/use-case.md
@@ -9,7 +9,7 @@ eleventyNavigation:
   otherNames: last updated, version date.
   description: A timestamp of the last page update.
   thumbnail: /images/common/components/preview-date-modified.svg
-  alt: A thick grey line, above a representation the page footer, represents the last page update text. 
+  alt: A thick grey line, above a representation the page footer, represents the last page update text.
   tag: Canada.ca required
   state: published
 translationKey: 'datemodified'
@@ -26,8 +26,8 @@ Use date modified to:
 - Log the date that a web page was last changed.
 - Identify an application’s current version.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Related components</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Related components</h2>
 
 <a href="{{ links.footer }}" class="link-light">Footer</a> for placing the Government of Canada branded footer landmark.
 
@@ -36,27 +36,27 @@ Use date modified to:
 ## Component types
 
 <div class="remove-empty-p">
-<gcds-grid columns="1fr" columns-tablet="1fr 2fr" gap="500" align-items="start">
-  {% componentPreview "Date type preview" "px-300 py-400" "" %}
+<gcds-grid columns="1fr" columns-tablet="1fr 2fr" align-items="start">
+  {% componentPreview "Date type preview" "px-225 py-300" "" %}
   <gcds-date-modified>2023-08-22</gcds-date-modified>
   {% endcomponentPreview %}
   <div>
-    <h3 class="mb-400">Date type</h3>
-    <p class="mb-400">Use the date type to:</p>
-    <ul class="list-disc mb-400">
+    <h3 class="mb-300">Date type</h3>
+    <p class="mb-300">Use the date type to:</p>
+    <ul class="list-disc mb-300">
       <li>Identify the date a web page or website was last changed.</li>
     </ul>
   </div>
 </gcds-grid>
 <br/>
-<gcds-grid columns="1fr" columns-tablet="1fr 2fr" gap="500" align-items="start">
-  {% componentPreview "Version type preview" "px-300 py-400" "" %}
+<gcds-grid columns="1fr" columns-tablet="1fr 2fr" align-items="start">
+  {% componentPreview "Version type preview" "px-225 py-300" "" %}
   <gcds-date-modified type="version">1.0.0</gcds-date-modified>
   {% endcomponentPreview %}
   <div>
-    <h3 class="mb-400">Version type</h3>
-    <p class="mb-400">Use the Version type to:</p>
-    <ul class="list-disc mb-400">
+    <h3 class="mb-300">Version type</h3>
+    <p class="mb-300">Use the Version type to:</p>
+    <ul class="list-disc mb-300">
       <li>Identify the current version of an application.</li>
     </ul>
   </div>
diff --git a/src/en/components/details/design.md b/src/en/components/details/design.md
index 1e4b4d3f0..77818ac99 100644
--- a/src/en/components/details/design.md
+++ b/src/en/components/details/design.md
@@ -18,11 +18,11 @@ This is an anatomy of the open details component. By default, the content is col
 
 ### Open details
 
-<img class="b-sm b-default p-400" src="/images/en/components/anatomy/gcds-details-anatomy-open.svg" alt="Learn more about this topic taxonomy with three labels: details title, icon and content.  Details title pointing at Learn more about this topic. Learn more about this topic is greyed blue font underlined. Icon pointed at a dark blue triangle arrow infront of the details title. When the arrow is selected it points down to show Additional information."/>
+<img class="b-sm b-default p-300" src="/images/en/components/anatomy/gcds-details-anatomy-open.svg" alt="Learn more about this topic taxonomy with three labels: details title, icon and content.  Details title pointing at Learn more about this topic. Learn more about this topic is greyed blue font underlined. Icon pointed at a dark blue triangle arrow infront of the details title. When the arrow is selected it points down to show Additional information."/>
 
 ### Closed details
 
-<img class="b-sm b-default p-400" src="/images/en/components/anatomy/gcds-details-anatomy-closed.svg" alt="Learn more about this topic taxonomy with two labels: details title and icon. The details title pointing at Learn more about this topic. Learn more about this topic is dark font underlined. Icon pointed at a dark blue triangle arrow infront of the details title."/>
+<img class="b-sm b-default p-300" src="/images/en/components/anatomy/gcds-details-anatomy-closed.svg" alt="Learn more about this topic taxonomy with two labels: details title and icon. The details title pointing at Learn more about this topic. Learn more about this topic is dark font underlined. Icon pointed at a dark blue triangle arrow infront of the details title."/>
 
 ## Design and accessibility for details
 
diff --git a/src/en/components/details/use-case.md b/src/en/components/details/use-case.md
index 43f391646..0279e6852 100644
--- a/src/en/components/details/use-case.md
+++ b/src/en/components/details/use-case.md
@@ -28,8 +28,8 @@ Use the details component to give a person a summary of more detailed content yo
 - Make a page with many subheadings scanable. For example, in a series of questions and answers, you can list the questions as details titles and a person can expand any section to read the answer content.
 - Give readers the option to control content for subjects that may cause distress to some readers. They can access certain content when they are ready and hide content once they've reviewed it.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Related components</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Related components</h2>
 
 Tabs when you want to replace the entire content of a section or a page.
 
diff --git a/src/en/components/error-message/base.md b/src/en/components/error-message/base.md
index 4ad813947..700669a97 100644
--- a/src/en/components/error-message/base.md
+++ b/src/en/components/error-message/base.md
@@ -15,7 +15,7 @@ An error message is a description of a problem blocking a user goal.
 {% docLinks locale stage figma github %}
 {% enddocLinks %}
 
-{% componentPreview "Error message component preview" "px-300 pt-400 pb-100" %}
+{% componentPreview "Error message component preview" "px-225 pt-300 pb-75" %}
 <gcds-error-message message-id="example-message">
 Error message.
 </gcds-error-message>
diff --git a/src/en/components/error-message/design.md b/src/en/components/error-message/design.md
index 7692f1de2..ee95f3c5c 100644
--- a/src/en/components/error-message/design.md
+++ b/src/en/components/error-message/design.md
@@ -12,7 +12,7 @@ date: 'git Last Modified'
   <li>The <strong>error message</strong> cites the problem in context and includes a call to action to address it.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/en/components/anatomy/gcds-error-message-anatomy.svg" alt='Error message anatomy represented by a warning icon (white exclamation mark within a red triangle) next to the text "Error message".'/>
+<img class="b-sm b-default p-300" src="/images/en/components/anatomy/gcds-error-message-anatomy.svg" alt='Error message anatomy represented by a warning icon (white exclamation mark within a red triangle) next to the text "Error message".'/>
 
 ### Error message applied to a form component
 
@@ -27,7 +27,7 @@ For your own component instances, add the error message component, and include t
   <li>The <strong>response area</strong> takes on the appearance of the response format and error message state of the component it’s attached to. For an input or text area, the box will be highlighted. For radios or checkboxes, the options will be highlighted.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/en/components/anatomy/gcds-error-message-anatomy-with-form-field.svg" alt='Error message taxonomy represented by four elements: label or legend (required), hint / example message, warning icon next to the text "Error message" and a response area (red rectangle).' />
+<img class="b-sm b-default p-300" src="/images/en/components/anatomy/gcds-error-message-anatomy-with-form-field.svg" alt='Error message taxonomy represented by four elements: label or legend (required), hint / example message, warning icon next to the text "Error message" and a response area (red rectangle).' />
 
 ## Design and accessibility for error messages
 
diff --git a/src/en/components/error-message/use-case.md b/src/en/components/error-message/use-case.md
index 7c9d126fb..0dfdd23d9 100644
--- a/src/en/components/error-message/use-case.md
+++ b/src/en/components/error-message/use-case.md
@@ -29,8 +29,8 @@ Use an error message for your own component instances when you need to interrupt
 - A form component is required.
 - You need to specify an incorrect response type or format and let a person know exactly what to do to fix the problem and move on.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Related components</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Related components</h2>
 
 <a href="{{ links.errorSummary }}" class="link-light">Error summary</a> for listing all problems to address for response submission.
 
diff --git a/src/en/components/error-summary/design.md b/src/en/components/error-summary/design.md
index 5449dc188..55da13b3d 100644
--- a/src/en/components/error-summary/design.md
+++ b/src/en/components/error-summary/design.md
@@ -13,7 +13,7 @@ tags: ['errorsummaryEN', 'design']
   <li>The <strong>error summary item</strong> links to the error context and includes the same text as the error message (a call to action statement to address the error).</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/en/components/anatomy/gcds-error-summary-anatomy.svg" alt="A red rectangle frames a prominent heading that reads 'There's a problem' and a numbered list of 3 links with error summary items in the link text." />
+<img class="b-sm b-default p-300" src="/images/en/components/anatomy/gcds-error-summary-anatomy.svg" alt="A red rectangle frames a prominent heading that reads 'There's a problem' and a numbered list of 3 links with error summary items in the link text." />
 
 ## Design and accessibility for error summaries
 
diff --git a/src/en/components/error-summary/use-case.md b/src/en/components/error-summary/use-case.md
index ea02e17bb..fd159cd7b 100644
--- a/src/en/components/error-summary/use-case.md
+++ b/src/en/components/error-summary/use-case.md
@@ -27,8 +27,8 @@ Use an error summary to interrupt a person who's submitting a form when there is
 - Make errors obvious so a person knows about them and how to address them.
 - List <gcds-link href="{{ links.errorMessage }}">error messages</gcds-link> when a person needs to add information or make a correction to two or more components before they can submit a form.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Related components</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Related components</h2>
 
 <a href="{{ links.errorMessage }}" class="link-light">Error message</a> for describing a problem blocking a user action, related to a single component.
 
diff --git a/src/en/components/fieldset/base.md b/src/en/components/fieldset/base.md
index ecf486afe..746ae3249 100644
--- a/src/en/components/fieldset/base.md
+++ b/src/en/components/fieldset/base.md
@@ -15,7 +15,7 @@ A fieldset is a group of multiple form components or elements.
 {% docLinks locale stage figma github %}
 {% enddocLinks %}
 
-{% componentPreview "Fieldset component preview" "px-300 pt-400" %}
+{% componentPreview "Fieldset component preview" "px-225 pt-300" %}
 <gcds-fieldset fieldset-id="fieldset" legend="Legend" hint="Hint / Example message.">
 <gcds-input input-id="form-input" label="Input label" hint="Hint / Example message." size="6">
 </gcds-input>
diff --git a/src/en/components/fieldset/design.md b/src/en/components/fieldset/design.md
index af6adff86..6cab1c6a0 100644
--- a/src/en/components/fieldset/design.md
+++ b/src/en/components/fieldset/design.md
@@ -16,7 +16,7 @@ A fieldset combines the `<fieldset>` and `<legend>` elements to accessibly group
   <li>The <strong>component grouping</strong> is made up of each component within the fieldset.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/en/components/anatomy/gcds-fieldset-anatomy.svg" alt="Fieldset legend anatomy showing the labels Legend, Hint text and component grouping. Hint text shows Fieldset legend. Component grouping has Input label underneath explain to give a Hint/Example message. Below is a dark blue boxed with six zeros to indicate where the number label will be put and the format. There is a Input Label with Hint/ Example message with a dark blue box selecting box with Select Option and arrow pointing down showing selection option."/>
+<img class="b-sm b-default p-300" src="/images/en/components/anatomy/gcds-fieldset-anatomy.svg" alt="Fieldset legend anatomy showing the labels Legend, Hint text and component grouping. Hint text shows Fieldset legend. Component grouping has Input label underneath explain to give a Hint/Example message. Below is a dark blue boxed with six zeros to indicate where the number label will be put and the format. There is a Input Label with Hint/ Example message with a dark blue box selecting box with Select Option and arrow pointing down showing selection option."/>
 
 ## Design and accessibility for fieldsets
 
diff --git a/src/en/components/fieldset/use-case.md b/src/en/components/fieldset/use-case.md
index 975ba460d..6bb316556 100644
--- a/src/en/components/fieldset/use-case.md
+++ b/src/en/components/fieldset/use-case.md
@@ -27,8 +27,8 @@ Use a fieldset to group together related form elements or components so they're
 - Several questions in a flow relate to the same topic, like a set of [inputs]({{ links.input }}) or other combination of form components.
 - Logically grouping form elements or components helps support understanding and usability.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Related components</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Related components</h2>
 
 <a href="{{ links.input }}" class="link-light">Inputs</a> or <a href="{{ links.textarea }}" class="link-light">text areas</a> when you are requesting a written response from a person.
 
diff --git a/src/en/components/file-uploader/design.md b/src/en/components/file-uploader/design.md
index 884ff07d7..04e743d44 100644
--- a/src/en/components/file-uploader/design.md
+++ b/src/en/components/file-uploader/design.md
@@ -17,7 +17,7 @@ date: 'git Last Modified'
   <li>The <strong>remove</strong> button allows an uploaded file to be removed prior to submission.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/en/components/anatomy/gcds-file-uploader-anatomy.svg" alt="An image of the file uploader component’s anatomy." />
+<img class="b-sm b-default p-300" src="/images/en/components/anatomy/gcds-file-uploader-anatomy.svg" alt="An image of the file uploader component’s anatomy." />
 
 ## Design and accessibility for file uploader
 
diff --git a/src/en/components/file-uploader/use-case.md b/src/en/components/file-uploader/use-case.md
index 747b64c95..460d1f57f 100644
--- a/src/en/components/file-uploader/use-case.md
+++ b/src/en/components/file-uploader/use-case.md
@@ -24,8 +24,8 @@ Use the file uploader to:
 - Allow a person to upload one or more files from a computer or device.
 - Review selected files to be uploaded.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Related components</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Related components</h2>
 
 <a href="{{ links.textarea }}" class="link-light">Text areas</a> for multi-line freeform responses.
 
diff --git a/src/en/components/footer/code.md b/src/en/components/footer/code.md
index 6d2dd2946..7abdaa107 100644
--- a/src/en/components/footer/code.md
+++ b/src/en/components/footer/code.md
@@ -20,18 +20,18 @@ Choose the **compact display** to include:
 
 1. The footer links band and the Government of Canada wordmark.
 
-<img class="b-sm b-default mt-400 mb-500 p-400" src="/images/en/components/example/example-footer-compact.svg" alt=""/>
+<img class="b-sm b-default mt-300 mb-600 p-300" src="/images/en/components/example/example-footer-compact.svg" alt=""/>
 
 Include the **full display** if you need to include:
 
 1. The main band with a large selection of Government of Canada corporate links.
 2. The footer links band and the Government of Canada wordmark.
 
-<img class="b-sm b-default mt-400 mb-500 p-400" src="/images/en/components/example/example-footer-full.svg" alt=""/>
+<img class="b-sm b-default mt-300 mb-600 p-300" src="/images/en/components/example/example-footer-full.svg" alt=""/>
 
 Opt to include the contextual band to add up to three footer links for your product.
 
-<img class="b-sm b-default mt-400 mb-500 p-400" src="/images/en/components/example/example-footer-full-with-contextual-links.svg" alt=""/>
+<img class="b-sm b-default mt-300 mb-600 p-300" src="/images/en/components/example/example-footer-full-with-contextual-links.svg" alt=""/>
 
 ### Include the footer links band for Government of Canada sites and products
 
diff --git a/src/en/components/footer/design.md b/src/en/components/footer/design.md
index fc0599083..c63e19e5f 100644
--- a/src/en/components/footer/design.md
+++ b/src/en/components/footer/design.md
@@ -13,7 +13,7 @@ date: 'git Last Modified'
   <li>The <strong>Canada wordmark</strong> is the global identifier of the Government of Canada and one of three official symbols of the Government of Canada's identity.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/en/components/anatomy/gcds-footer-anatomy-recommended.svg" alt="Website footer taxonomy with two sections. The first section is the Footer links bands in a light grey banner with some links like Social media, Mobile applications, About Canada.ca and so on. The second section is the Canada wordmark indicating Canada logo." />
+<img class="b-sm b-default p-300" src="/images/en/components/anatomy/gcds-footer-anatomy-recommended.svg" alt="Website footer taxonomy with two sections. The first section is the Footer links bands in a light grey banner with some links like Social media, Mobile applications, About Canada.ca and so on. The second section is the Canada wordmark indicating Canada logo." />
 
 ## Optional footer elements
 
@@ -24,7 +24,7 @@ date: 'git Last Modified'
   <li>The <strong>Canada wordmark</strong> is the global identifier of the Government of Canada and one of three official symbols of the Government of Canada's identity.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/en/components/anatomy/gcds-footer-anatomy-optional.svg" alt="Website footer taxonomy with four sections. First section Contextual navigation in light dark blue banner with  Contextual Navigation as a Head title section link and Why GC Notify and Features as sub sections links. Second section is Main band GC links with Governement of Canada as the Head title section link with multiple sub sections links like All Contacts, Departments and agencies, Jobs, Taxes and so on. The third section is the Footer links bands in a light grey banner with some links like Social media, Mobile applications, About Canada.ca and so on. The fourth section is the Canada wordmark indicating Canada logo." />
+<img class="b-sm b-default p-300" src="/images/en/components/anatomy/gcds-footer-anatomy-optional.svg" alt="Website footer taxonomy with four sections. First section Contextual navigation in light dark blue banner with  Contextual Navigation as a Head title section link and Why GC Notify and Features as sub sections links. Second section is Main band GC links with Governement of Canada as the Head title section link with multiple sub sections links like All Contacts, Departments and agencies, Jobs, Taxes and so on. The third section is the Footer links bands in a light grey banner with some links like Social media, Mobile applications, About Canada.ca and so on. The fourth section is the Canada wordmark indicating Canada logo." />
 
 ## Design and accessibility for footers
 
diff --git a/src/en/components/footer/use-case.md b/src/en/components/footer/use-case.md
index c498c4abf..45ed2c98c 100644
--- a/src/en/components/footer/use-case.md
+++ b/src/en/components/footer/use-case.md
@@ -29,8 +29,8 @@ Use this footer landmark – as part of a trusted brand – for apps, forms, or
 - A Government of Canada digital service or product offering a broad range of services and information.
 - The Government of Canada identity through the wordmark.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Related components</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Related components</h2>
 
 <a href="{{ links.header }}" class="link-light">Header</a> for placing the Government of Canada branded header landmark.
 
diff --git a/src/en/components/grid/code.md b/src/en/components/grid/code.md
index a5e014794..89fc30fd0 100644
--- a/src/en/components/grid/code.md
+++ b/src/en/components/grid/code.md
@@ -40,7 +40,7 @@ Opt out of setting the minimum and maximum width when you want to design equal-w
 
 Desktop
 
-<div class="b-sm mb-400 p-400">
+<div class="b-sm mb-300 p-300">
   <gcds-grid tag="article" columns-desktop="1fr 1fr 1fr" columns-tablet="1fr 1fr" columns="1fr">
     <p>This is some example content to display the grid component.</p>
     <p>This is some example content to display the grid component.</p>
@@ -50,7 +50,7 @@ Desktop
 
 Tablet
 
-<div class="b-sm mb-400 p-400">
+<div class="b-sm mb-300 p-300">
   <gcds-grid tag="article" columns-tablet="1fr 1fr" columns="1fr">
     <p>This is some example content to display the grid component.</p>
     <p>This is some example content to display the grid component.</p>
@@ -60,7 +60,7 @@ Tablet
 
 Mobile
 
-<div class="b-sm p-400">
+<div class="b-sm p-300">
   <gcds-grid tag="article" columns="1fr">
     <p>This is some example content to display the grid component.</p>
     <p>This is some example content to display the grid component.</p>
@@ -86,7 +86,7 @@ Set the minimum and maximum width to design equal-width columns with restriction
 
 Desktop
 
-<div class="showcase-preview b-sm mb-400 p-400">
+<div class="showcase-preview b-sm mb-300 p-300">
   <gcds-grid tag="article" columns="repeat(auto-fit, minmax(100px, 300px))">
     <p>This is some example content to display the grid component.</p>
     <p>This is some example content to display the grid component.</p>
@@ -96,7 +96,7 @@ Desktop
 
 Tablet
 
-<div class="showcase-preview b-sm mb-400 p-400">
+<div class="showcase-preview b-sm mb-300 p-300">
   <div class="container-md">
     <gcds-grid tag="article" columns="repeat(auto-fit, minmax(100px, 300px))">
       <p>This is some example content to display the grid component.</p>
@@ -108,7 +108,7 @@ Tablet
 
 Mobile
 
-<div class="showcase-preview b-sm p-400">
+<div class="showcase-preview b-sm p-300">
   <div class="container-sm">
     <gcds-grid tag="article" columns="repeat(auto-fit, minmax(100px, 300px))">
       <p>This is some example content to display the grid component.</p>
diff --git a/src/en/components/grid/design.md b/src/en/components/grid/design.md
index 6ca199bfb..257ab2378 100644
--- a/src/en/components/grid/design.md
+++ b/src/en/components/grid/design.md
@@ -13,7 +13,7 @@ date: 'git Last Modified'
   <li>The <strong>column</strong>, also called grid item, sets a boundary around its contents to contain it within the width set for that column.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/en/components/anatomy/gcds-grid-anatomy.svg" alt="Image showing the grid anatomy with four separate rectangles representing the columns of a grid" />
+<img class="b-sm b-default p-300" src="/images/en/components/anatomy/gcds-grid-anatomy.svg" alt="Image showing the grid anatomy with four separate rectangles representing the columns of a grid" />
 
 ## Design and accessibility for grids
 
diff --git a/src/en/components/grid/use-case.md b/src/en/components/grid/use-case.md
index 9892b2ea7..533c0e707 100644
--- a/src/en/components/grid/use-case.md
+++ b/src/en/components/grid/use-case.md
@@ -32,8 +32,8 @@ Use grids to:
 - Accommodate different screen sizes by setting a custom, optimized layout for different viewports, like mobile, tablet, and desktop.
 - Limit the width of content displayed to ensure lines wrap and are more readable.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Related components</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Related components</h2>
 
 <a href="{{ links.container }}" class="link-light">Container</a> for applying a basic, single column layout across all viewports.
 
diff --git a/src/en/components/header/base.md b/src/en/components/header/base.md
index 2a28be01c..bd7b15330 100644
--- a/src/en/components/header/base.md
+++ b/src/en/components/header/base.md
@@ -15,7 +15,7 @@ The header is the responsive Government of Canada branded header landmark.
 {% docLinks locale stage figma github %}
 {% enddocLinks %}
 
-{% componentPreview "Header component preview" "px-300 pt-400 pb-200" %}
+{% componentPreview "Header component preview" "px-225 pt-300 pb-150" %}
 <gcds-header lang-href="#" skip-to-href="#">
 </gcds-header>
 {% endcomponentPreview %}
diff --git a/src/en/components/header/design.md b/src/en/components/header/design.md
index b80089609..5e4e9d0e9 100644
--- a/src/en/components/header/design.md
+++ b/src/en/components/header/design.md
@@ -14,7 +14,7 @@ date: 'git Last Modified'
   <li>The <strong>language toggle</strong> component is a switch for French and English content. When the site language is set using the <code>lang</code> attribute, the toggle will be available in the other Official Language.</li>
 </ol>
 
-<img class="b-sm b-default mb-500 p-400" src="/images/en/components/anatomy/gcds-header-anatomy-recommended.svg" alt="Home link Taxonomy has three parts. The skip to content - indicated by a bright blue double white lined box with label of Skip to main content. GC header banner with a Canadian Flag with Government of Canada  and Government du Canada. Language toggle pointing at Français to use to toggle to French. Top bar pointing at Home link in a light grey banner with Site menu link outlined by a dark grey link to indicate the selected link with unselected Site menu link with no line underneath it."/>
+<img class="b-sm b-default mb-600 p-300" src="/images/en/components/anatomy/gcds-header-anatomy-recommended.svg" alt="Home link Taxonomy has three parts. The skip to content - indicated by a bright blue double white lined box with label of Skip to main content. GC header banner with a Canadian Flag with Government of Canada  and Government du Canada. Language toggle pointing at Français to use to toggle to French. Top bar pointing at Home link in a light grey banner with Site menu link outlined by a dark grey link to indicate the selected link with unselected Site menu link with no line underneath it."/>
 
 ## Optional header elements – with H1 title
 
@@ -30,7 +30,7 @@ date: 'git Last Modified'
 
 The **search** element supports including a search form that is local or global.
 
-<img class="b-sm b-default mb-500 p-400" src="/images/en/components/anatomy/gcds-header-anatomy-optional.svg" alt="Home link Taxonomy has five parts. The skip to content - indicated by a bright blue double white lined box with label of Skip to main content. The Phase banner - indicated by a navy blue lined box with label of stages of the site. The stage 'pilot' is in a white navy blue outlined box. GC header banner with a Canadian Flag with Government of Canada  and Government du Canada. Language toggle pointing at Français to use to toggle to French. Top bar pointing at Home link in a light grey banner with Site menu link outlined by a dark grey link to indicate the selected link with unselected Site menu link with no line underneath it."/>
+<img class="b-sm b-default mb-600 p-300" src="/images/en/components/anatomy/gcds-header-anatomy-optional.svg" alt="Home link Taxonomy has five parts. The skip to content - indicated by a bright blue double white lined box with label of Skip to main content. The Phase banner - indicated by a navy blue lined box with label of stages of the site. The stage 'pilot' is in a white navy blue outlined box. GC header banner with a Canadian Flag with Government of Canada  and Government du Canada. Language toggle pointing at Français to use to toggle to French. Top bar pointing at Home link in a light grey banner with Site menu link outlined by a dark grey link to indicate the selected link with unselected Site menu link with no line underneath it."/>
 
 ## Design and accessibility for headers
 
diff --git a/src/en/components/header/use-case.md b/src/en/components/header/use-case.md
index 83d600716..850535186 100644
--- a/src/en/components/header/use-case.md
+++ b/src/en/components/header/use-case.md
@@ -9,7 +9,7 @@ eleventyNavigation:
   otherNames: global header.
   description: The Government of Canada branded header landmark.
   thumbnail: /images/common/components/preview-header.svg
-  alt: Three horizontal banners stacked on top of each other. The first is a grey banner with three dots on the left, representing a browser banner. The second is a dark blue banner with a white outline representing a phase banner. The third is white banner holding a Canada flag and two stacked, thick grey lines that represent lines of text. 
+  alt: Three horizontal banners stacked on top of each other. The first is a grey banner with three dots on the left, representing a browser banner. The second is a dark blue banner with a white outline representing a phase banner. The third is white banner holding a Canada flag and two stacked, thick grey lines that represent lines of text.
   tag: Canada.ca required
   state: published
 translationKey: 'header'
@@ -29,8 +29,8 @@ Use this header landmark – as part of a trusted brand – for apps, forms, or
 - A Government of Canada digital service or product offering a broad range of services and information.
 - The Federal Identity Program Government of Canada signature.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Related components</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Related components</h2>
 
 <a href="{{ links.footer }}" class="link-light">Footer</a> for placing the Government of Canada branded footer landmark.
 
diff --git a/src/en/components/heading/design.md b/src/en/components/heading/design.md
index 1f02645f6..ceebfe4e0 100644
--- a/src/en/components/heading/design.md
+++ b/src/en/components/heading/design.md
@@ -13,7 +13,7 @@ tags: ['headingEN', 'design']
   <li><strong>Text</strong> is non-heading content. Its subject matter is related to the idea outlined in its corresponding heading.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/en/components/anatomy/gcds-heading-anatomy.svg" alt="A large, prominent heading text above a block of smaller text. The larger text reads: “This is a heading”. The next block reads: “This is text that's related to the heading and describes in further detail the heading's subject or action. Text is typically one or several lines or paragraphs that form a section's content or introduce a bulleted list, table, or other content, like an image or video.” There's a label pointing to the larger text reading “1” and there's a label pointing to the smaller block of text that reads “2”.." />
+<img class="b-sm b-default p-300" src="/images/en/components/anatomy/gcds-heading-anatomy.svg" alt="A large, prominent heading text above a block of smaller text. The larger text reads: “This is a heading”. The next block reads: “This is text that's related to the heading and describes in further detail the heading's subject or action. Text is typically one or several lines or paragraphs that form a section's content or introduce a bulleted list, table, or other content, like an image or video.” There's a label pointing to the larger text reading “1” and there's a label pointing to the smaller block of text that reads “2”.." />
 
 ## Design and accessibility for headings
 
diff --git a/src/en/components/heading/use-case.md b/src/en/components/heading/use-case.md
index 74ff05e34..d21023131 100644
--- a/src/en/components/heading/use-case.md
+++ b/src/en/components/heading/use-case.md
@@ -29,8 +29,8 @@ Use headings to:
 - Divide lengthy content into manageable sections. Breaking up your content supports readability, simplifies site navigation, and reduces the risk of people abandoning their task.
 - Apply consistent typography styles and sizes throughout a website to create a cohesive and user-friendly design.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Related components</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Related components</h2>
 
 <a href="{{ links.text }}" class="link-light">Text</a> for paragraphs displaying non-heading content with matching GC Design System styles.
 
diff --git a/src/en/components/image/design.md b/src/en/components/image/design.md
index e812684da..f9cc3d878 100644
--- a/src/en/components/image/design.md
+++ b/src/en/components/image/design.md
@@ -13,6 +13,6 @@ nocrawl: true
   <li><strong>list</strong></li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/{local}/components/anatomy/gcds-image-anatomy.svg" alt="An image of the anatomy." />
+<img class="b-sm b-default p-300" src="/images/{local}/components/anatomy/gcds-image-anatomy.svg" alt="An image of the anatomy." />
 
 ## Design and accessibility for Image
diff --git a/src/en/components/image/use-case.md b/src/en/components/image/use-case.md
index dbdf7f660..98ff7a01e 100644
--- a/src/en/components/image/use-case.md
+++ b/src/en/components/image/use-case.md
@@ -25,8 +25,8 @@ Use a Image
 
 -
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Related components</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Related components</h2>
 
 <a href="" class="link-light">component</a>
 
diff --git a/src/en/components/input/base.md b/src/en/components/input/base.md
index 738e86f93..cedca2041 100644
--- a/src/en/components/input/base.md
+++ b/src/en/components/input/base.md
@@ -15,7 +15,7 @@ An input is a space to enter short-form information in response to a question or
 {% docLinks locale stage figma github %}
 {% enddocLinks %}
 
-{% componentPreview "Input component preview" "px-300 pt-400" %}
+{% componentPreview "Input component preview" "px-225 pt-300" %}
 <gcds-input input-id="input-example" label="Label" hint="Hint / Example message.">
 </gcds-input>
 {% endcomponentPreview %}
diff --git a/src/en/components/input/design.md b/src/en/components/input/design.md
index 2bba0efbd..3827359bb 100644
--- a/src/en/components/input/design.md
+++ b/src/en/components/input/design.md
@@ -14,7 +14,7 @@ date: 'git Last Modified'
   <li>The <strong>field</strong> is the container a person interacts with to provide their response.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/en/components/anatomy/gcds-input-anatomy.svg" alt="Input anatomy showing the Input label, Hint text/ example message and dark blue outline white box for text input."/>
+<img class="b-sm b-default p-300" src="/images/en/components/anatomy/gcds-input-anatomy.svg" alt="Input anatomy showing the Input label, Hint text/ example message and dark blue outline white box for text input."/>
 
 ## Design and accessibility for inputs
 
diff --git a/src/en/components/input/use-case.md b/src/en/components/input/use-case.md
index b56de579e..279c4cdd0 100644
--- a/src/en/components/input/use-case.md
+++ b/src/en/components/input/use-case.md
@@ -31,8 +31,8 @@ Use an input to gather single-line information from a person when you're expecti
 
 Note: Only collect information you're authorized to handle and be sure to safeguard it to Government of Canada standards.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Related components</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Related components</h2>
 
 <a href="{{ links.textarea }}" class="link-light">Text areas</a> for multi-line freeform responses.
 
diff --git a/src/en/components/language-toggle/design.md b/src/en/components/language-toggle/design.md
index 25eade082..a85510ec2 100644
--- a/src/en/components/language-toggle/design.md
+++ b/src/en/components/language-toggle/design.md
@@ -15,7 +15,7 @@ The language toggle provides a link to the page in the other Official Language.
   <li>The <strong>language toggle</strong> is abbreviated on small screens.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/en/components/anatomy/gcds-lang-toggle-anatomy.svg" alt="On large screens, a “Français” link. On smaller screens, an abbreviated FR link."/>
+<img class="b-sm b-default p-300" src="/images/en/components/anatomy/gcds-lang-toggle-anatomy.svg" alt="On large screens, a “Français” link. On smaller screens, an abbreviated FR link."/>
 
 ## Design and accessibility for the language toggle
 
diff --git a/src/en/components/language-toggle/use-case.md b/src/en/components/language-toggle/use-case.md
index b5f81bf10..ad5a5ca06 100644
--- a/src/en/components/language-toggle/use-case.md
+++ b/src/en/components/language-toggle/use-case.md
@@ -28,8 +28,8 @@ Use the language toggle to:
 - Make sure people are able to switch between languages without losing track of where they were before switching.
 - Support Official Languages by offering equitable access in French and English.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Related components</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Related components</h2>
 
 <a href="{{ links.header }}" class="link-light">Header</a> for placing the Government of Canada branded header landmark.
 
diff --git a/src/en/components/link/base.md b/src/en/components/link/base.md
index c38174eaf..bf1201970 100644
--- a/src/en/components/link/base.md
+++ b/src/en/components/link/base.md
@@ -15,8 +15,8 @@ A link is a navigational element that brings a person to a new page, website, fi
 {% enddocLinks %}
 
 {% componentPreview "Link component preview" %}
-<gcds-link class="d-block mb-400" href="#">Navigation link</gcds-link>
-<gcds-link class="d-block mb-400" href="download.pdf" download="file.pdf" type="application/pdf">Download document (PDF, 1.5 MB)</gcds-link>
-<gcds-link class="d-block mb-400" href="mailto:test@test.com?subject=Test%20Email">Email</gcds-link>
+<gcds-link class="d-block mb-300" href="#">Navigation link</gcds-link>
+<gcds-link class="d-block mb-300" href="download.pdf" download="file.pdf" type="application/pdf">Download document (PDF, 1.5 MB)</gcds-link>
+<gcds-link class="d-block mb-300" href="mailto:test@test.com?subject=Test%20Email">Email</gcds-link>
 <gcds-link class="d-block" href="tel:1234567890">Call</gcds-link>
 {% endcomponentPreview %}
diff --git a/src/en/components/link/design.md b/src/en/components/link/design.md
index 189e6431f..22eed3269 100644
--- a/src/en/components/link/design.md
+++ b/src/en/components/link/design.md
@@ -18,7 +18,7 @@ date: 'git Last Modified'
   </ul>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/en/components/anatomy/gcds-link-anatomy.svg" alt="A label with an underline to signal that it's an interactive link that can be followed. An icon wth a downward pointing arrow sits to the right of the link." />
+<img class="b-sm b-default p-300" src="/images/en/components/anatomy/gcds-link-anatomy.svg" alt="A label with an underline to signal that it's an interactive link that can be followed. An icon wth a downward pointing arrow sits to the right of the link." />
 
 ## Accessibility and design for links
 
diff --git a/src/en/components/link/use-case.md b/src/en/components/link/use-case.md
index 9d33aa088..cea44f401 100644
--- a/src/en/components/link/use-case.md
+++ b/src/en/components/link/use-case.md
@@ -30,8 +30,8 @@ Use links to:
 - Start downloads for files, providing users with direct access to documents, media, or other downloadable content.
 - Skip past navigational elements to get to main content.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Related components</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Related components</h2>
 
 <a href="{{ links.button }}" class="link-light">Buttons</a> when a person modifies data, changes a state, or initiates a specific action.
 
diff --git a/src/en/components/pagination/base.md b/src/en/components/pagination/base.md
index 8ef5ee03d..fdfcb5451 100644
--- a/src/en/components/pagination/base.md
+++ b/src/en/components/pagination/base.md
@@ -15,7 +15,7 @@ Pagination is a division of content into multiple linked pages.
 {% docLinks locale stage figma github %}
 {% enddocLinks %}
 
-{% componentPreview "Pagination component preview" "px-0 lg:px-300 xl:px-300 py-400" %}
+{% componentPreview "Pagination component preview" "px-0 lg:px-225 xl:px-225 py-300" %}
 <gcds-pagination label="Simple pagination example" display="simple" previous-href="#" next-href="#" previous-label="Title of page" next-label="3 of 3">
 </gcds-pagination>
 
diff --git a/src/en/components/pagination/design.md b/src/en/components/pagination/design.md
index 6f1467ff0..20041d511 100644
--- a/src/en/components/pagination/design.md
+++ b/src/en/components/pagination/design.md
@@ -18,7 +18,7 @@ date: 'git Last Modified'
   <li>The <strong>previous label</strong> indicates the label of the previous page to the user.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/en/components/anatomy/gcds-pagination-simple-previous-anatomy.svg" alt="The pagination component with numbers pointing to individual parts of the simple pagination's previous link anatomy." />
+<img class="b-sm b-default p-300" src="/images/en/components/anatomy/gcds-pagination-simple-previous-anatomy.svg" alt="The pagination component with numbers pointing to individual parts of the simple pagination's previous link anatomy." />
 
 #### Next link
 
@@ -28,7 +28,7 @@ date: 'git Last Modified'
   <li>The <strong>next label</strong> indicates the label of the previous page to the user.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/en/components/anatomy/gcds-pagination-simple-next-anatomy.svg" alt="The pagination component with numbers pointing to individual parts of the simple pagination's next link anatomy." />
+<img class="b-sm b-default p-300" src="/images/en/components/anatomy/gcds-pagination-simple-next-anatomy.svg" alt="The pagination component with numbers pointing to individual parts of the simple pagination's next link anatomy." />
 
 ### List styled pagination anatomy
 
@@ -42,7 +42,7 @@ date: 'git Last Modified'
   <li>The <strong>next link</strong> navigates to the next page in the flow when selected.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/en/components/anatomy/gcds-pagination-list-large-anatomy.svg" alt="The pagination component with numbers pointing to individual parts of the large screen list pagination anatomy." />
+<img class="b-sm b-default p-300" src="/images/en/components/anatomy/gcds-pagination-list-large-anatomy.svg" alt="The pagination component with numbers pointing to individual parts of the large screen list pagination anatomy." />
 
 #### Small screens
 
@@ -54,7 +54,7 @@ date: 'git Last Modified'
   <li>The <strong>next link</strong> navigates to the next page in the flow when selected.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/en/components/anatomy/gcds-pagination-list-small-anatomy.svg" alt="The pagination component with numbers pointing to individual parts of the small screen list pagination anatomy." />
+<img class="b-sm b-default p-300" src="/images/en/components/anatomy/gcds-pagination-list-small-anatomy.svg" alt="The pagination component with numbers pointing to individual parts of the small screen list pagination anatomy." />
 
 #### Previous link
 
@@ -63,7 +63,7 @@ date: 'git Last Modified'
   <li>The <strong>previous text</strong> is the text that accompanies the previous arrow and indicates that the user would be navigating to the previous page in the flow.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/en/components/anatomy/gcds-pagination-list-previous-anatomy.svg" alt="The pagination component with numbers pointing to individual parts of the list pagination's previous link anatomy." />
+<img class="b-sm b-default p-300" src="/images/en/components/anatomy/gcds-pagination-list-previous-anatomy.svg" alt="The pagination component with numbers pointing to individual parts of the list pagination's previous link anatomy." />
 
 #### Next link
 
@@ -72,7 +72,7 @@ date: 'git Last Modified'
   <li>The <strong>next arrow</strong> is a visual aid indicating that you would be navigating forwards in the page flow.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/en/components/anatomy/gcds-pagination-list-next-anatomy.svg" alt="The pagination component with numbers pointing to individual parts of the list pagination's next link anatomy." />
+<img class="b-sm b-default p-300" src="/images/en/components/anatomy/gcds-pagination-list-next-anatomy.svg" alt="The pagination component with numbers pointing to individual parts of the list pagination's next link anatomy." />
 
 ## Design and accessibility for pagination
 
diff --git a/src/en/components/pagination/use-case.md b/src/en/components/pagination/use-case.md
index b01f9589e..8f4f79ec1 100644
--- a/src/en/components/pagination/use-case.md
+++ b/src/en/components/pagination/use-case.md
@@ -28,8 +28,8 @@ Use pagination for very lengthy content on a single page that might be difficult
 - Split into sections any long documents, like reports, that have chapters or other natural divisions.
 - Highlight the reader’s position in a sequence of content.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Related components</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Related components</h2>
 
 <a href="{{ links.stepper }}" class="link-light">Stepper</a> to track progress in a multi-step process.
 
diff --git a/src/en/components/radio-group/base.md b/src/en/components/radio-group/base.md
index e71351059..33495b22f 100644
--- a/src/en/components/radio-group/base.md
+++ b/src/en/components/radio-group/base.md
@@ -15,7 +15,7 @@ The radio group is a set of options for a single selection.
 {% docLinks locale stage figma github %}
 {% enddocLinks %}
 
-{% componentPreview "Radio group component preview" "px-300 pt-400 pb-200" %}
+{% componentPreview "Radio group component preview" "px-225 pt-300 pb-150" %}
 <gcds-fieldset fieldset-id="fieldset" legend="Legend" hint="Hint / Example message.">
 <gcds-radio-group name="radio" options='[{"id":"form-radio-1","label":"Label 1","hint":"Description or example to make the option clearer"},{"id":"form-radio-r","label":"Label 2","hint":"Description or example to make the option clearer"}]'>
 </gcds-radio-group>
diff --git a/src/en/components/radio-group/design.md b/src/en/components/radio-group/design.md
index 942e05e17..6b136c991 100644
--- a/src/en/components/radio-group/design.md
+++ b/src/en/components/radio-group/design.md
@@ -17,7 +17,7 @@ date: "git Last Modified"
   <li>The <strong>radio hint text</strong> gives a person additional information about the choice.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/en/components/anatomy/gcds-radio-group-anatomy.svg" alt="Radio group anatomy showing the labels Fieldset legend, Fieldset hint, Checkmark, Radio label, Radio button, and Radio hint."/>
+<img class="b-sm b-default p-300" src="/images/en/components/anatomy/gcds-radio-group-anatomy.svg" alt="Radio group anatomy showing the labels Fieldset legend, Fieldset hint, Checkmark, Radio label, Radio button, and Radio hint."/>
 
 ## Design and accessibility for radio group
 
diff --git a/src/en/components/radio-group/use-case.md b/src/en/components/radio-group/use-case.md
index 93444c4e2..6dfe6e1e2 100644
--- a/src/en/components/radio-group/use-case.md
+++ b/src/en/components/radio-group/use-case.md
@@ -10,7 +10,7 @@ eleventyNavigation:
   description: A short set of options for single selection.
   thumbnail: /images/common/components/preview-radio.svg
   alt: A column of three radio selections. Each radio button circle has a thin grey border and white fill beside a thick grey line to represent the label. One of the three circles is selected and has a single dark grey circle inside of it.
-  state: published 
+  state: published
 translationKey: "radiogroup"
 tags: ['radiogroupEN', 'usage']
 permalink: /en/components/radio-group/
@@ -27,8 +27,8 @@ Use radio groups with a [fieldset]({{ links.fieldset }}). Use a radio group to r
 - Specify the possible answers to your question.
 - Give a person the ability to answer without writing by selecting one item from a list.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Related components</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Related components</h2>
 
 <a href="{{ links.checkbox }}" class="link-light">Checkboxes</a> when you are expecting the user to select multiple options from a list of items.
 
diff --git a/src/en/components/radio/design.md b/src/en/components/radio/design.md
index e0a653430..e4ca9fdb0 100644
--- a/src/en/components/radio/design.md
+++ b/src/en/components/radio/design.md
@@ -18,7 +18,7 @@ nocrawl: true
   <li>The <strong>radio hint text</strong> gives a person additional information about the choice.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/en/components/anatomy/gcds-radio-anatomy.svg" alt="Radio anatomy showing the labels Fieldset legend, Fieldset hint, Checkmark, Radio label, Radio button and Radio Hint."/>
+<img class="b-sm b-default p-300" src="/images/en/components/anatomy/gcds-radio-anatomy.svg" alt="Radio anatomy showing the labels Fieldset legend, Fieldset hint, Checkmark, Radio label, Radio button and Radio Hint."/>
 
 ## Design and accessibility for radios
 
diff --git a/src/en/components/radio/use-case.md b/src/en/components/radio/use-case.md
index f06ac5aa6..89798470b 100644
--- a/src/en/components/radio/use-case.md
+++ b/src/en/components/radio/use-case.md
@@ -29,8 +29,8 @@ Use radios with a [fieldset]({{ links.fieldset }}) to make a request for info wi
 - Specify the possible answers to your question.
 - Give a person the ability to answer without writing by selecting one item from a list.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Related components</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Related components</h2>
 
 <a href="{{ links.checkbox }}" class="link-light">Checkboxes</a> when you are expecting the user to select multiple options from a list of items.
 
diff --git a/src/en/components/search/design.md b/src/en/components/search/design.md
index af79f2948..a0fe73f0c 100644
--- a/src/en/components/search/design.md
+++ b/src/en/components/search/design.md
@@ -15,7 +15,7 @@ date: 'git Last Modified'
   <li>The <strong>icon</strong> is a visual aid on the button.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/en/components/anatomy/gcds-search-anatomy.svg" alt="Image showing the search component anatomy with numbers pointing to the individual parts of the search component." />
+<img class="b-sm b-default p-300" src="/images/en/components/anatomy/gcds-search-anatomy.svg" alt="Image showing the search component anatomy with numbers pointing to the individual parts of the search component." />
 
 ## Design and accessibility for search
 
diff --git a/src/en/components/search/use-case.md b/src/en/components/search/use-case.md
index 80b8f4e8f..c5756ec98 100644
--- a/src/en/components/search/use-case.md
+++ b/src/en/components/search/use-case.md
@@ -26,8 +26,8 @@ Use search to help a person on your website or page find information:
 - Indexed on Canada.ca, across all Government of Canada content or at an institution or program level.
 - From a subset of content you have locally indexed, using your own data set.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Related components</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Related components</h2>
 
   <a href="{{ links.header }}" class="link-light">Header</a> for placing the Government of Canada branded header landmark.
 
diff --git a/src/en/components/select/design.md b/src/en/components/select/design.md
index d86a24fd2..7f9fee024 100644
--- a/src/en/components/select/design.md
+++ b/src/en/components/select/design.md
@@ -15,7 +15,7 @@ date: 'git Last Modified'
   <li>The <strong>icon</strong> is used as a visual aid to indicate that the field can be expanded.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/en/components/anatomy/gcds-select-anatomy.svg" alt="The select component with numbers pointing to individual parts of the select anatomy." />
+<img class="b-sm b-default p-300" src="/images/en/components/anatomy/gcds-select-anatomy.svg" alt="The select component with numbers pointing to individual parts of the select anatomy." />
 
 ## Design and accessibility for select
 
diff --git a/src/en/components/select/use-case.md b/src/en/components/select/use-case.md
index 1bec3aa0e..836dba4a1 100644
--- a/src/en/components/select/use-case.md
+++ b/src/en/components/select/use-case.md
@@ -25,8 +25,8 @@ Use select within a form to:
 - Limit the number of possible answers to a question.
 - Give a person the ability to answer without writing, by selecting one item from a list.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Related components</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Related components</h2>
 
 <a href="{{ links.checkbox }}" class="link-light">Checkboxes</a> when you are expecting the user to select 1 or more options from a list of items.
 
diff --git a/src/en/components/side-navigation/design.md b/src/en/components/side-navigation/design.md
index 6d9c6840d..1e3cdd4c4 100644
--- a/src/en/components/side-navigation/design.md
+++ b/src/en/components/side-navigation/design.md
@@ -17,7 +17,7 @@ date: 'git Last Modified'
   <li>The <strong>nav link with active indicator</strong> gives visual prominence to the current page.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/en/components/anatomy/gcds-side-nav-anatomy.svg" alt="Side navigation anatomy showing the labels the label, the nav link, the nav group, the nav group label, the nav group chevron icon, the nav link with active indicator."/>
+<img class="b-sm b-default p-300" src="/images/en/components/anatomy/gcds-side-nav-anatomy.svg" alt="Side navigation anatomy showing the labels the label, the nav link, the nav group, the nav group label, the nav group chevron icon, the nav link with active indicator."/>
 
 ## Design and accessibility for side navigation
 
diff --git a/src/en/components/side-navigation/use-case.md b/src/en/components/side-navigation/use-case.md
index 639bc31f8..22de30eda 100644
--- a/src/en/components/side-navigation/use-case.md
+++ b/src/en/components/side-navigation/use-case.md
@@ -28,8 +28,8 @@ It’s optional to use side navigation in products for:
 - Organizing and displaying a product’s hierarchical structure.
 - Enabling contextual navigation for a person using the product by displaying their current location within the product.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Related components</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Related components</h2>
 
 <a href="{{ links.topNav }}" class="link-light">Top navigation</a> for websites with up to 2 levels in their information architecture.
 
diff --git a/src/en/components/signature/base.md b/src/en/components/signature/base.md
index 178313116..46bd43508 100644
--- a/src/en/components/signature/base.md
+++ b/src/en/components/signature/base.md
@@ -17,11 +17,11 @@ The signature is the Government of Canada landmark identifier found in the heade
 
 {% componentPreview "Signature component preview" %}
 
-<div class="d-inline-block me-400">
+<div class="d-inline-block me-300">
 <gcds-signature type="signature"></gcds-signature>
 </div>
 <div class="d-inline-block">
-<gcds-signature class="px-400" type="wordmark"></gcds-signature>
+<gcds-signature class="px-300" type="wordmark"></gcds-signature>
 </div>
 
 {% endcomponentPreview %}
diff --git a/src/en/components/signature/design.md b/src/en/components/signature/design.md
index fbcab6303..d49025fa0 100644
--- a/src/en/components/signature/design.md
+++ b/src/en/components/signature/design.md
@@ -13,7 +13,7 @@ date: 'git Last Modified'
   <li>The <strong>Canada Wordmark</strong> is a brand identifier found in the site's <gcds-link href="{{ links.footer }}">footer</gcds-link>. It reinforces the brand by communicating to a site visitor that they're reading content from the Government of Canada.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/en/components/anatomy/gcds-signature-anatomy-en.svg" alt="Signature anatomy showing the labels 1 (Government of Canada Signature) and 2 (Canada Wordmark)" />
+<img class="b-sm b-default p-300" src="/images/en/components/anatomy/gcds-signature-anatomy-en.svg" alt="Signature anatomy showing the labels 1 (Government of Canada Signature) and 2 (Canada Wordmark)" />
 
 ## Design and accessibility for the signature
 
@@ -31,18 +31,18 @@ Display the French-first signature on French pages and the English-first on Engl
 - Always apply the same colour combination in the signature and wordmark. For example, if one is black and white, the other needs to be as well.
 - For single colour, check the contrast ratio between the signature elements for, at minimum, WCAG AA compliance.
 
-<img class="b-sm b-default p-400 mt-400 mb-400" src="/images/en/components/example/example-signature-side-by-side-en.svg" alt="An image presenting both variations of the signature component. The signature type is on the left and the wordmark type is on the right." />
+<img class="b-sm b-default p-300 mt-300 mb-300" src="/images/en/components/example/example-signature-side-by-side-en.svg" alt="An image presenting both variations of the signature component. The signature type is on the left and the wordmark type is on the right." />
 
 The standard colour style uses black text and a red flag applied to a white backdrop.
 
-<img class="b-sm b-default p-400 mt-500 mb-400" src="/images/en/components/example/example-signature-side-by-side-reversed-en.svg" alt="An image presenting both variations of the signature component. The signature type is on the left and the wordmark type is on the right. This variation has white text on a black back drop" />
+<img class="b-sm b-default p-300 mt-600 mb-300" src="/images/en/components/example/example-signature-side-by-side-reversed-en.svg" alt="An image presenting both variations of the signature component. The signature type is on the left and the wordmark type is on the right. This variation has white text on a black back drop" />
 
 The reversed colour style uses white text and a red flag applied to a black backdrop.
 
-<img class="b-sm b-default p-400 mt-500 mb-400" src="/images/en/components/example/example-signature-bw-en.svg" alt="An image presenting two signature and wordmark pairings. One where the signature and wordmark are all black on a white backdrop and the second where the signature and wordmark are all white on a black backdrop." />
+<img class="b-sm b-default p-300 mt-600 mb-300" src="/images/en/components/example/example-signature-bw-en.svg" alt="An image presenting two signature and wordmark pairings. One where the signature and wordmark are all black on a white backdrop and the second where the signature and wordmark are all white on a black backdrop." />
 
 The black and white style uses all black or all white. All black is the more common use.
 
-<img class="b-sm b-default p-400 mt-500 mb-400" src="/images/en/components/example/example-signature-single-colour-style-en.svg" alt="An image showing the the signature and wordmark in dark purple on a light purple backdrop. There are bars and boxes simulating text and pictures, you are to assume this is a mock webpage. The text and pictures boxes are also dark purple." />
+<img class="b-sm b-default p-300 mt-600 mb-300" src="/images/en/components/example/example-signature-single-colour-style-en.svg" alt="An image showing the the signature and wordmark in dark purple on a light purple backdrop. There are bars and boxes simulating text and pictures, you are to assume this is a mock webpage. The text and pictures boxes are also dark purple." />
 
 Single colour style uses another colour if that colour is the only colour used in the product.
diff --git a/src/en/components/signature/use-case.md b/src/en/components/signature/use-case.md
index 06c94c9e6..fe951f5ea 100644
--- a/src/en/components/signature/use-case.md
+++ b/src/en/components/signature/use-case.md
@@ -29,8 +29,8 @@ Use the signature landmark as part of a trusted brand to:
 - Inform a person they’re reading content published by the Government of Canada.
 - Offer a global link to the site’s home page in both Official Languages.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Related components</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Related components</h2>
 
 <a href="{{ links.header }}" class="link-light">Header</a> for placing the Government of Canada branded header landmark.
 
@@ -49,7 +49,7 @@ Use the **signature** type in the header beside the language toggle component to
 - Present the corporate signature of the Government of Canada.
 - Provide users with a landmark for navigating back to the site’s homepage.
 
-<img class="b-sm b-default mt-400 mb-100 p-400" src="/images/en/components/example/example-signature-signature-type-en.svg" alt="The Government of Canada signature. The signature includes the red Canada flag, followed by the text “Government of Canada / Gouvernement du Canada”." />
+<img class="b-sm b-default mt-300 mb-75 p-300" src="/images/en/components/example/example-signature-signature-type-en.svg" alt="The Government of Canada signature. The signature includes the red Canada flag, followed by the text “Government of Canada / Gouvernement du Canada”." />
 
 ### Wordmark type
 
@@ -58,4 +58,4 @@ Use the **wordmark** type in the in the bottom right corner of the footer to:
 - Accompany the signature or another approved corporate signature of the Government of Canada on public-facing and internal sites and products.
 - Present this official symbol and global identifier of the Government of Canada.
 
-<img class="b-sm b-default mt-400 mb-300 p-400" src="/images/en/components/example/example-signature-wordmark-type-en.svg" alt="The Canada Wordmark. The wordmark includes the word “Canada” with a red Canada flag just above the final “a”." />
+<img class="b-sm b-default mt-300 mb-225 p-300" src="/images/en/components/example/example-signature-wordmark-type-en.svg" alt="The Canada Wordmark. The wordmark includes the word “Canada” with a red Canada flag just above the final “a”." />
diff --git a/src/en/components/stepper/base.md b/src/en/components/stepper/base.md
index 3e2d862a7..626edfaec 100644
--- a/src/en/components/stepper/base.md
+++ b/src/en/components/stepper/base.md
@@ -15,6 +15,6 @@ A stepper is a progress tracker for a multi-step process.
 {% docLinks locale stage figma github %}
 {% enddocLinks %}
 
-{% componentPreview "Stepper component preview" "px-300 pt-400 pb-100" %}
+{% componentPreview "Stepper component preview" "px-225 pt-300 pb-75" %}
 <gcds-stepper current-step="1" total-steps="4">Section title</gcds-stepper>
 {% endcomponentPreview %}
diff --git a/src/en/components/stepper/design.md b/src/en/components/stepper/design.md
index dea9d93c9..413af1ede 100644
--- a/src/en/components/stepper/design.md
+++ b/src/en/components/stepper/design.md
@@ -14,7 +14,7 @@ date: 'git Last Modified'
   <li>The <strong>step title</strong> describes the type of information that will be asked in the step.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/en/components/anatomy/gcds-stepper-anatomy.svg" alt="A stepper anatomy represented by three elements: the current step, the total steps, and the current step title."/>
+<img class="b-sm b-default p-300" src="/images/en/components/anatomy/gcds-stepper-anatomy.svg" alt="A stepper anatomy represented by three elements: the current step, the total steps, and the current step title."/>
 
 ## Design and accessibility for steppers
 
diff --git a/src/en/components/stepper/use-case.md b/src/en/components/stepper/use-case.md
index 4c601bec0..dba2eb867 100644
--- a/src/en/components/stepper/use-case.md
+++ b/src/en/components/stepper/use-case.md
@@ -26,8 +26,8 @@ Use a stepper for a logical sequence split over more than one page to:
 - Show a person which step they're on in a process, like in a multi-step form.
 - Make the structure of a path clear by showing the total number of steps.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Related components</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Related components</h2>
 
 <a href="{{ links.pagination }}" class="link-light">Pagination</a> when a user needs to navigate a range of pages that are not part of a multi-step process. It provides controls to select the next or previous page.
 
diff --git a/src/en/components/text/design.md b/src/en/components/text/design.md
index 4d157088c..f4ab1722d 100644
--- a/src/en/components/text/design.md
+++ b/src/en/components/text/design.md
@@ -13,7 +13,7 @@ tags: ['textEN', 'design']
   <li><strong>Heading</strong> is a prominent line of text that introduces the paragraph or other body content that immediately follows it. The visual prominence of the heading decreases based on its level in the hierarchical order.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/en/components/anatomy/gcds-text-anatomy.svg" alt="A line of large bold text above a block of smaller text. The bold text reads “This is a heading” and the block of written content reads “This is text that’s related to the heading and describes in further detail the heading’s subject or action. Text is typically one or several lines or paragraphs that form a section’s content or introduce a bulleted list, table, or other content, like an image or video.” A label with a “1” points to the smaller block of text and a label with “2” points to the larger bold text." />
+<img class="b-sm b-default p-300" src="/images/en/components/anatomy/gcds-text-anatomy.svg" alt="A line of large bold text above a block of smaller text. The bold text reads “This is a heading” and the block of written content reads “This is text that’s related to the heading and describes in further detail the heading’s subject or action. Text is typically one or several lines or paragraphs that form a section’s content or introduce a bulleted list, table, or other content, like an image or video.” A label with a “1” points to the smaller block of text and a label with “2” points to the larger bold text." />
 
 ## Design and accessibility for text
 
diff --git a/src/en/components/text/use-case.md b/src/en/components/text/use-case.md
index 34e5798e5..e3706d360 100644
--- a/src/en/components/text/use-case.md
+++ b/src/en/components/text/use-case.md
@@ -27,8 +27,8 @@ Use the text component to:
 - Reinforce brand identity with consistent messaging styles and formats across web pages. For example, using GC Design System typography as a standard for consistent font style.
 - Divide content into understandable sections with vertical and horizontal margins. Breaking up content supports readability, simplifies site navigation, and reduces task abandonment.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Related components</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Related components</h2>
 
 <a href="{{ links.heading }}" class="link-light">Headings</a> for structuring content by creating levels of hierarchy that organize page content visually and mentally, using GC Design System styles.
 
diff --git a/src/en/components/textarea/base.md b/src/en/components/textarea/base.md
index e54d4ad8a..b4d9a70bc 100644
--- a/src/en/components/textarea/base.md
+++ b/src/en/components/textarea/base.md
@@ -15,7 +15,7 @@ A text area is a space to enter long-form information in response to a question
 {% docLinks locale stage figma github %}
 {% enddocLinks %}
 
-{% componentPreview "Text area component preview" "px-300 pt-400" %}
+{% componentPreview "Text area component preview" "px-225 pt-300" %}
 <gcds-textarea textarea-id="textarea-example" label="Label" hint="Hint / Example message." value="Text area content.">
 </gcds-textarea>
 {% endcomponentPreview %}
diff --git a/src/en/components/textarea/design.md b/src/en/components/textarea/design.md
index f17421bed..2d0fd37e6 100644
--- a/src/en/components/textarea/design.md
+++ b/src/en/components/textarea/design.md
@@ -14,7 +14,7 @@ date: 'git Last Modified'
   <li>The <strong>field</strong> is the container a person interacts with to provide their response.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/en/components/anatomy/gcds-textarea-anatomy.svg" alt="Text area anatomy showing the Text area label, Hint text/ example message and dark blue outline white box for text input."/>
+<img class="b-sm b-default p-300" src="/images/en/components/anatomy/gcds-textarea-anatomy.svg" alt="Text area anatomy showing the Text area label, Hint text/ example message and dark blue outline white box for text input."/>
 
 ## Design and accessibility for text areas
 
diff --git a/src/en/components/textarea/use-case.md b/src/en/components/textarea/use-case.md
index a5100f182..b3a02a359 100644
--- a/src/en/components/textarea/use-case.md
+++ b/src/en/components/textarea/use-case.md
@@ -28,8 +28,8 @@ Use a text area to collect multi-line information when you're expecting a person
 
 Note: Only collect information you're authorized to handle and be sure to safeguard it to Government of Canada standards.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Related components</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Related components</h2>
 
 <a href="{{ links.input }}" class="link-light">Input</a> for short, single-line responses.
 
diff --git a/src/en/components/theme-and-topic-menu/base.md b/src/en/components/theme-and-topic-menu/base.md
index 98c55d30e..9cd779fe4 100644
--- a/src/en/components/theme-and-topic-menu/base.md
+++ b/src/en/components/theme-and-topic-menu/base.md
@@ -14,7 +14,7 @@ The theme and topic menu is a navigation to the top tasks of Government of Canad
 {% docLinks locale stage figma github %}
 {% enddocLinks %}
 
-{% componentPreview "Theme and topic menu component preview" "px-0 py-400" %}
+{% componentPreview "Theme and topic menu component preview" "px-0 py-300" %}
 
 <div aria-hidden="true">
   <gcds-topic-menu>
diff --git a/src/en/components/theme-and-topic-menu/design.md b/src/en/components/theme-and-topic-menu/design.md
index deb6f45b4..ab681d2b4 100644
--- a/src/en/components/theme-and-topic-menu/design.md
+++ b/src/en/components/theme-and-topic-menu/design.md
@@ -15,7 +15,7 @@ date: "git Last Modified"
   <li><strong>Most requested links</strong> is a list of the most frequent actions taken in each theme. All links will load and update automatically.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/en/components/anatomy/gcds-topic-menu-anatomy.svg" alt="The theme and topic menu with numbers pointing to individual parts of the component’s anatomy." />
+<img class="b-sm b-default p-300" src="/images/en/components/anatomy/gcds-topic-menu-anatomy.svg" alt="The theme and topic menu with numbers pointing to individual parts of the component’s anatomy." />
 
 ## Accessibility and design for the theme and topic menu
 
diff --git a/src/en/components/theme-and-topic-menu/use-case.md b/src/en/components/theme-and-topic-menu/use-case.md
index 687c5aa65..c1b11937a 100644
--- a/src/en/components/theme-and-topic-menu/use-case.md
+++ b/src/en/components/theme-and-topic-menu/use-case.md
@@ -23,8 +23,8 @@ Use theme and topic menu to:
 
 - Provide global navigation across Government of Canada web pages, when people commonly need to access these pages from your website.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Related components</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Related components</h2>
 
   <a href="{{ links.header }}" class="link-light">Header</a> for placing the Government of Canada branded header landmark.
 
diff --git a/src/en/components/top-navigation/design.md b/src/en/components/top-navigation/design.md
index f17fb6623..af13b080f 100644
--- a/src/en/components/top-navigation/design.md
+++ b/src/en/components/top-navigation/design.md
@@ -17,7 +17,7 @@ date: 'git Last Modified'
   <li>The <strong>nav link with active indicator</strong> gives visual prominence to the current page.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/en/components/anatomy/gcds-top-nav-anatomy.svg" alt="Top navigation anatomy showing page navigation with a dark blue box for the logo or home link followed by two greyed boxes, the last one having a dark blue line underneath to show the current page." />
+<img class="b-sm b-default p-300" src="/images/en/components/anatomy/gcds-top-nav-anatomy.svg" alt="Top navigation anatomy showing page navigation with a dark blue box for the logo or home link followed by two greyed boxes, the last one having a dark blue line underneath to show the current page." />
 
 ## Design and accessibility for top navigation
 
diff --git a/src/en/components/top-navigation/use-case.md b/src/en/components/top-navigation/use-case.md
index 6deb9551f..509abcd75 100644
--- a/src/en/components/top-navigation/use-case.md
+++ b/src/en/components/top-navigation/use-case.md
@@ -28,8 +28,8 @@ The top navigation helps give visitors a sense of a site's structure, purpose, a
 - Offer a familiar wayfinding pattern.
 - Signal the active page and give a cue to the person's current position on the site.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Related components</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Related components</h2>
 
 <a href="{{ links.sideNav }}" class="link-light">Side navigation</a> for products with up to three levels of navigation when the main content fits a narrow page width.
 
diff --git a/src/en/contact/contact.md b/src/en/contact/contact.md
index ab6e5763f..ec2789046 100644
--- a/src/en/contact/contact.md
+++ b/src/en/contact/contact.md
@@ -17,13 +17,13 @@ date: 'git Last Modified'
 
 With an account, use our <gcds-link external href="{{ links.githubCompsIssues }}">GitHub support form</gcds-link> to report bugs and get technical help. You’ll have access to past issues and updates on progress.
 
-<hr class="my-500" />
+<hr class="my-600" />
 
 ## Give feedback, request support, or sign up
 
 Use this form to provide feedback or ask questions, get help using GC Design System, or sign up for our mailing list or demo.
 
-<form class="my-500 contact-us-form" name="contactEN" method="post" style="min-height: 32rem;" action="/api/submission">
+<form class="my-600 contact-us-form" name="contactEN" method="post" style="min-height: 32rem;" action="/api/submission">
   <input type="hidden" name="form-name" value="contactEN" />
   <input name="honeypot" type="text" aria-label="bot" hidden/>
 
diff --git a/src/en/get-involved.md b/src/en/get-involved.md
index 90f8892dd..f113b2c24 100644
--- a/src/en/get-involved.md
+++ b/src/en/get-involved.md
@@ -21,20 +21,20 @@ We're sharing what we're working on and what we'll work on next. To get updates
 
 <hr/>
 
-<gcds-heading tag="h2" margin-top="300">How to get involved</gcds-heading>
+<gcds-heading tag="h2" margin-top="225">How to get involved</gcds-heading>
 
 ### Contribute to our next priorities
 
 <div>
   <gcds-heading tag="h4" margin-bottom="0">Data table</gcds-heading>
-  <ul class="mb-400">
+  <ul class="mb-300">
     <li>Data table is a way to organize and display large amounts of data in rows and columns.</li>
   </ul>
 </div>
 
 <div>
   <gcds-heading tag="h4" margin-bottom="0">Tag</gcds-heading>
-  <ul class="mb-400">
+  <ul class="mb-300">
     <li>Tag is a component used for items that need to be labeled, categorized, or organized using keywords that describe them. </li>
   </ul>
 </div>
@@ -51,13 +51,13 @@ Provide any of the following for each component or pattern:
 
 <hr />
 
-<gcds-heading tag="h2" margin-top="300">Coming soon</gcds-heading>
+<gcds-heading tag="h2" margin-top="225">Coming soon</gcds-heading>
 
 ### Upcoming components and templates
 
 <div>
   <gcds-heading tag="h4" margin-bottom="0">Notice</gcds-heading>
-  <ul class="mb-400">
+  <ul class="mb-300">
     <li>The notice is a short prominent message to draw attention and inform.</li>
     <li><strong>Expected release:</strong> Fall 2024</li>
   </ul>
@@ -65,7 +65,7 @@ Provide any of the following for each component or pattern:
 
 <div>
   <gcds-heading tag="h4" margin-bottom="0">Topic Page Template</gcds-heading>
-  <ul class="mb-400">
+  <ul class="mb-300">
     <li>The Topic Page Template is a reusable layout for pages that provide access to topics and destination pages that support task completion.</li>
     <li><strong>Expected release:</strong> Fall 2024</li>
   </ul>
@@ -73,7 +73,7 @@ Provide any of the following for each component or pattern:
 
 <div>
   <gcds-heading tag="h4" margin-bottom="0">Ministerial Page Template</gcds-heading>
-  <ul class="mb-400">
+  <ul class="mb-300">
     <li>The Ministerial Page Template is a reusable layout for landing pages for ministers, parliamentary secretaries and heads of quasi-judicial organizations.</li>
     <li><strong>Expected release:</strong> Fall 2024</li>
   </ul>
@@ -81,7 +81,7 @@ Provide any of the following for each component or pattern:
 
 <div>
   <gcds-heading tag="h4" margin-bottom="0">VueJS Starter App Template</gcds-heading>
-  <ul class="mb-400">
+  <ul class="mb-300">
     <li>The VueJS Start App Template provides the starting code to develop an application using the VueJS front-end framework.</li>
     <li><strong>Expected release:</strong> Fall 2024</li>
   </ul>
diff --git a/src/en/pages/index.md b/src/en/pages/index.md
index 2af98c6e7..19a8e186a 100644
--- a/src/en/pages/index.md
+++ b/src/en/pages/index.md
@@ -9,65 +9,65 @@ date: 'git Last Modified'
 
 <h2 class="py-450">Start using GC Design System</h2>
 
-<article class="py-500 bg-primary text-light bg-full-width">
-  <gcds-grid tag="ul" columns="1fr" columns-tablet="1fr 1fr" gap="450">
-    <li class="list-none md:mb-0 mb-500">
-      <img class="mb-400" src="../../images/common/home/icon-design.svg" alt="" />
-      <h3 class="mb-400">Design experiences</h3>
-      <p class="mb-400">Visit our Figma library to explore design assets.</p>
+<article class="py-600 bg-primary text-light bg-full-width">
+  <gcds-grid tag="ul" columns="1fr" columns-tablet="1fr 1fr">
+    <li class="list-none md:mb-0 mb-600">
+      <img class="mb-300" src="../../images/common/home/icon-design.svg" alt="" />
+      <h3 class="mb-300">Design experiences</h3>
+      <p class="mb-300">Visit our Figma library to explore design assets.</p>
       <a class="link-light" href="{{ links.figma }}" target="_blank">
         Start designing
-        <gcds-icon name="external-link" label="Opens in a new tab." margin-left="50" />
+        <gcds-icon name="external-link" label="Opens in a new tab." margin-left="25" />
       </a>
     </li>
     <li class="list-none">
-      <img class="mb-400" src="../../images/common/home/icon-develop.svg" alt="" />
-      <h3 class="mb-400">Develop products</h3>
-      <p class="mb-400">Install the component package.</p>
+      <img class="mb-300" src="../../images/common/home/icon-develop.svg" alt="" />
+      <h3 class="mb-300">Develop products</h3>
+      <p class="mb-300">Install the component package.</p>
       <a class="link-light" href="{{ links.installation }}">Start developing</a>
     </li>
   </gcds-grid>
 </article>
 
 <article class="py-450">
-  <h2 class="mb-400">A design system just for you</h2>
-  <p class="mb-500">Take a look around. <gcds-link href="{{ links.contact }}">Tell us what you think</gcds-link>.</p>
-  <gcds-grid tag="ul" columns="1fr" columns-tablet="1fr 1fr" columns-desktop="1fr 1fr 1fr" gap="450">
+  <h2 class="mb-300">A design system just for you</h2>
+  <p class="mb-600">Take a look around. <gcds-link href="{{ links.contact }}">Tell us what you think</gcds-link>.</p>
+  <gcds-grid tag="ul" columns="1fr" columns-tablet="1fr 1fr" columns-desktop="1fr 1fr 1fr">
     <li class="list-none">
-      <img class="mb-200" src="../../images/common/home/icon-components.svg" alt="" />
-      <h3 class="mb-400">Components</h3>
-      <p class="mb-400">User interface building blocks address different user objectives.</p>
-      <p class="mb-400">Select reusable code for common components, paired with best practice advice, for the framework you're using.</p>
+      <img class="mb-150" src="../../images/common/home/icon-components.svg" alt="" />
+      <h3 class="mb-300">Components</h3>
+      <p class="mb-300">User interface building blocks address different user objectives.</p>
+      <p class="mb-300">Select reusable code for common components, paired with best practice advice, for the framework you're using.</p>
       <gcds-link href="{{ links.components }}">View components</gcds-link>
     </li>
     <li class="list-none">
-      <img class="mb-200" src="../../images/common/home/icon-template.svg" alt="" />
-      <h3 class="mb-400">Page templates</h3>
-      <p class="mb-400">Reusable page layouts combine components into common page types.</p>
-      <p class="mb-400">Start your project with basic, pre-built pages that provide a consistent, recognizable Canada.ca experience.</p>
+      <img class="mb-150" src="../../images/common/home/icon-template.svg" alt="" />
+      <h3 class="mb-300">Page templates</h3>
+      <p class="mb-300">Reusable page layouts combine components into common page types.</p>
+      <p class="mb-300">Start your project with basic, pre-built pages that provide a consistent, recognizable Canada.ca experience.</p>
       <p>Coming soon</p>
     </li>
     <li class="list-none">
-      <img class="mb-200" src="../../images/common/home/icon-tokens.svg" alt="" />
-      <h3 class="mb-400">Design tokens</h3>
-      <p class="mb-400">Brand and design decisions built into code.</p>
-      <p class="mb-400">Learn how encoded decisions shape the design of government services for a consistent visual experience.</p>
+      <img class="mb-150" src="../../images/common/home/icon-tokens.svg" alt="" />
+      <h3 class="mb-300">Design tokens</h3>
+      <p class="mb-300">Brand and design decisions built into code.</p>
+      <p class="mb-300">Learn how encoded decisions shape the design of government services for a consistent visual experience.</p>
       <gcds-link href="{{ links.styles }}">View tokens</gcds-link>
     </li>
   </gcds-grid>
 </article>
 
-<article class="py-500 bg-light bg-full-width">
-  <h2 class="mb-400">What's new</h2>
-  <gcds-grid tag="ul" columns="1fr" columns-tablet="1fr 1fr" gap="450">
+<article class="py-600 bg-light bg-full-width">
+  <h2 class="mb-300">What's new</h2>
+  <gcds-grid tag="ul" columns="1fr" columns-tablet="1fr 1fr">
     <li class="list-none bg-white p-450 b-radius-md">
-      <h3 class="mb-400">
+      <h3 class="mb-300">
         <gcds-link href="{{ links.getInvolved }}">Get involved</gcds-link>
       </h3>
       <p>Check out what we're working on.</p>
     </li>
-    <li class="list-none bg-white px-250 py-450 b-radius-md">
-      <h3 class="mb-400">
+    <li class="list-none bg-white px-175 py-450 b-radius-md">
+      <h3 class="mb-300">
         <gcds-link external href="{{ links.releaseNotes }}">Release notes</gcds-link>
       </h3>
       <p>Read about the latest additions.</p>
@@ -76,15 +76,15 @@ date: 'git Last Modified'
 </article>
 
 <article class="py-450">
-  <h2 class="mb-400">Featured component</h2>
+  <h2 class="mb-300">Featured component</h2>
 
-  <h3 class="mb-400">Card</h3>
+  <h3 class="mb-300">Card</h3>
   <p class="mb-450">A card is a box containing structured, actionable content on a single topic.</p>
-  <img class="d-block mb-400" src="../../images/common/components/preview-card.svg" alt="The card component shows a box containing a rectangular image in the top half. Immediately below is a blue rectangular bar running across three quarters of the box representing the card title. Two longer grey bars are stacked just below the blue bar, representing the card description and context area/metadata sections." />
+  <img class="d-block mb-300" src="../../images/common/components/preview-card.svg" alt="The card component shows a box containing a rectangular image in the top half. Immediately below is a blue rectangular bar running across three quarters of the box representing the card title. Two longer grey bars are stacked just below the blue bar, representing the card description and context area/metadata sections." />
   <gcds-link href="{{ links.card }}">Read more about card</gcds-link>
 
-  <h3 class="mt-500 mb-400">Date input</h3>
+  <h3 class="mt-600 mb-300">Date input</h3>
   <p class="mb-450">A date input is a space to enter a known date.</p>
-  <img class="d-block mb-400" src="../../images/en/components/preview/preview-date-input.svg" alt="Thick grey lines at the top represent the legend and hint text. A white box with a thin grey border and a grey line and grey arrow inside of it represents the select input for the month. Beside this are two smaller white boxes with thin grey outlines representing the text inputs for the day and year." />
+  <img class="d-block mb-300" src="../../images/en/components/preview/preview-date-input.svg" alt="Thick grey lines at the top represent the legend and hint text. A white box with a thin grey border and a grey line and grey arrow inside of it represents the select input for the month. Beside this are two smaller white boxes with thin grey outlines representing the text inputs for the day and year." />
   <gcds-link href="{{ links.dateInput }}">Read more about date input</gcds-link>
 </article>
diff --git a/src/en/search.md b/src/en/search.md
index a025e074a..e8224a25d 100644
--- a/src/en/search.md
+++ b/src/en/search.md
@@ -23,7 +23,7 @@ eleventyNavigation:
 >
 </gcds-search>
 
-<gcds-text size="caption">
+<gcds-text size="small">
   Don’t include personal information (telephone, email, SIN, financial, medical, or work details).
 </gcds-text>
 
diff --git a/src/en/styles/design-tokens/design-tokens.md b/src/en/styles/design-tokens/design-tokens.md
index b6905113c..a01d48923 100644
--- a/src/en/styles/design-tokens/design-tokens.md
+++ b/src/en/styles/design-tokens/design-tokens.md
@@ -35,7 +35,7 @@ GC Design System components have their own tokens. These component tokens are co
 
 When misused component tokens can change unexpectedly. They receive updates any time the component they're attached to gets updated.
 
-<img class="b-sm b-default p-400" src="/images/en/foundations/tokens/design-tokens-component.svg" alt="Three blue squares represent three steps to create the component design token for the default button background colour. To the right of the topmost square, the text reads colour #26374a. The first arrow points down to the next square whose text reads --gcds-color-blue-900. Another arrow points down from the second to the third square, whose text reads --gcds-button-primary-default-background. A third arrow points from the last square to a button with a dark blue background, showing the result of the new component design token."/>
+<img class="b-sm b-default p-300" src="/images/en/foundations/tokens/design-tokens-component.svg" alt="Three blue squares represent three steps to create the component design token for the default button background colour. To the right of the topmost square, the text reads colour #26374a. The first arrow points down to the next square whose text reads --gcds-color-blue-900. Another arrow points down from the second to the third square, whose text reads --gcds-button-primary-default-background. A third arrow points from the last square to a button with a dark blue background, showing the result of the new component design token."/>
 
 ### Global design tokens
 
@@ -45,7 +45,7 @@ Global tokens are semantic. That means they have meanings or contexts associated
 
 Global tokens help you minimize future maintenance and establish a visual language for stronger communications.
 
-<img class="b-sm b-default p-400" src="/images/en/foundations/tokens/design-tokens-global.svg" alt="Three lines of text list examples of global design tokens for font size, spacing measurements, and font colour. On the first line, an arrow points from the font size 1.25rem to the token --gcds-font-sizes-text. On the second line, an arow points from the spacing length 3rem to the token --gcds-spacing-500. On the third line, an arrow points from the font colour #333333 to the token --gcds-text-primary."/>
+<img class="b-sm b-default p-300" src="/images/en/foundations/tokens/design-tokens-global.svg" alt="Three lines of text list examples of global design tokens for font size, spacing measurements, and font colour. On the first line, an arrow points from the font size 1.25rem to the token --gcds-font-sizes-text. On the second line, an arow points from the spacing length 3rem to the token --gcds-spacing-600. On the third line, an arrow points from the font colour #333333 to the token --gcds-text-primary."/>
 
 ### Base design tokens
 
@@ -53,7 +53,7 @@ Base tokens are for you to use when you've run out of global token options. GC D
 
 Base tokens are not semantic so it's harder for everyone to understand what they represent. It's important to use them thoughtfully and consistently to support a familiar and predictable user experience for your service.
 
-<img class="b-sm b-default p-400" src="/images/en/foundations/tokens/design-tokens-base.svg" alt="Three lines of text list examples of base design tokens for greyscale colours. On the first line, an arrow points from the colour Grayscale 50 to the token --gcds-color-grayscale-50. On the second line, an arow points from the colour Grayscale 100 to the token --gcds-color-grayscale-100. On the third line, an arrow points from the colour Grayscale 300 to the token --gcds-color-grayscale-300."/>
+<img class="b-sm b-default p-300" src="/images/en/foundations/tokens/design-tokens-base.svg" alt="Three lines of text list examples of base design tokens for greyscale colours. On the first line, an arrow points from the colour Grayscale 50 to the token --gcds-color-grayscale-50. On the second line, an arow points from the colour Grayscale 100 to the token --gcds-color-grayscale-100. On the third line, an arrow points from the colour Grayscale 300 to the token --gcds-color-grayscale-300."/>
 
 ## Token anatomy and naming progression
 
@@ -68,18 +68,18 @@ Tokens are characterized by a naming progression.
 
 ### Component design token
 
-<img class="b-sm b-default p-400" src="/images/en/foundations/anatomy/anatomy-design-tokens-component.svg" alt="A line of five words, each highlighted in a different colour and underlined. Before the first word are two dashes with one dash between each word. A label tag beneath each connects each word to their name type. The first is the prefix: gcds. The second is the category (component): button. The third is the role: primary. The fourth is the state: default. The fifth is the property: background. The token name as a whole reads: --gcds-button-primary-default-background."/>
+<img class="b-sm b-default p-300" src="/images/en/foundations/anatomy/anatomy-design-tokens-component.svg" alt="A line of five words, each highlighted in a different colour and underlined. Before the first word are two dashes with one dash between each word. A label tag beneath each connects each word to their name type. The first is the prefix: gcds. The second is the category (component): button. The third is the role: primary. The fourth is the state: default. The fifth is the property: background. The token name as a whole reads: --gcds-button-primary-default-background."/>
 
 ### Global design token
 
-<img class="b-sm b-default p-400" src="/images/en/foundations/anatomy/anatomy-design-tokens-global.svg" alt="A line of three words, each highlighted in a different colour and underlined. Before the first word are two dashes with one dash between each word. A label tag beneath each connects each word to their name type. The first is the prefix: gcds. The second is the category (property): text. The third is the role or state: primary. The token name as a whole reads: --gcds-text-primary."/>
+<img class="b-sm b-default p-300" src="/images/en/foundations/anatomy/anatomy-design-tokens-global.svg" alt="A line of three words, each highlighted in a different colour and underlined. Before the first word are two dashes with one dash between each word. A label tag beneath each connects each word to their name type. The first is the prefix: gcds. The second is the category (property): text. The third is the role or state: primary. The token name as a whole reads: --gcds-text-primary."/>
 
 ### Global design token – global state
 
-<img class="b-sm b-default p-400" src="/images/en/foundations/anatomy/anatomy-design-tokens-global-state.svg" alt="A line of three words, each highlighted in a different colour and underlined. Before the first word are two dashes with one dash between each word. A label tag beneath each connects each word to their name type. The first is the prefix: gcds. The second is the category (state): focus. The third is the property: text. The token name as a whole reads: --gcds-focus-text."/>
+<img class="b-sm b-default p-300" src="/images/en/foundations/anatomy/anatomy-design-tokens-global-state.svg" alt="A line of three words, each highlighted in a different colour and underlined. Before the first word are two dashes with one dash between each word. A label tag beneath each connects each word to their name type. The first is the prefix: gcds. The second is the category (state): focus. The third is the property: text. The token name as a whole reads: --gcds-focus-text."/>
 
 ### Base design tokens
 
-<img class="b-sm b-default mb-500 p-400" src="/images/en/foundations/anatomy/anatomy-design-tokens-base.svg" alt="A line of three words, each highlighted in a different colour and underlined. Before the first word are two dashes with one dash between each word. A label tag beneath each connects each word to their name type. The first is the prefix: gcds. The second is the category (colour): grayscale. The third is the scale: 100. The token name as a whole reads: --gcds-grayscale-100."/>
+<img class="b-sm b-default mb-600 p-300" src="/images/en/foundations/anatomy/anatomy-design-tokens-base.svg" alt="A line of three words, each highlighted in a different colour and underlined. Before the first word are two dashes with one dash between each word. A label tag beneath each connects each word to their name type. The first is the prefix: gcds. The second is the category (colour): grayscale. The third is the scale: 100. The token name as a whole reads: --gcds-grayscale-100."/>
 
 {% include "partials/helpus.njk" %}
diff --git a/src/images/en/foundations/tokens/design-tokens-global.svg b/src/images/en/foundations/tokens/design-tokens-global.svg
index 4e9a56a6c..baaf1a041 100644
--- a/src/images/en/foundations/tokens/design-tokens-global.svg
+++ b/src/images/en/foundations/tokens/design-tokens-global.svg
@@ -1,18 +1,16 @@
-<svg width="351" height="228" viewBox="0 0 351 228" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M7.33047 38H5.61047V28.02C5.61047 27.4467 5.61714 26.9867 5.63047 26.64C5.6438 26.2933 5.6638 25.9333 5.69047 25.56C5.47714 25.7733 5.2838 25.9533 5.11047 26.1C4.93714 26.2467 4.71714 26.4333 4.45047 26.66L2.93047 27.9L2.01047 26.72L5.87047 23.72H7.33047V38ZM13.1158 36.92C13.1158 36.4267 13.2358 36.08 13.4758 35.88C13.7158 35.68 14.0024 35.58 14.3358 35.58C14.6824 35.58 14.9758 35.68 15.2158 35.88C15.4691 36.08 15.5958 36.4267 15.5958 36.92C15.5958 37.4 15.4691 37.7467 15.2158 37.96C14.9758 38.1733 14.6824 38.28 14.3358 38.28C14.0024 38.28 13.7158 38.1733 13.4758 37.96C13.2358 37.7467 13.1158 37.4 13.1158 36.92ZM27.4273 38H17.9873V36.54L21.7273 32.76C22.4473 32.04 23.054 31.4 23.5473 30.84C24.0407 30.28 24.414 29.7333 24.6673 29.2C24.9207 28.6533 25.0473 28.06 25.0473 27.42C25.0473 26.6333 24.814 26.04 24.3473 25.64C23.8807 25.2267 23.274 25.02 22.5273 25.02C21.834 25.02 21.2207 25.14 20.6873 25.38C20.1673 25.62 19.634 25.9533 19.0873 26.38L18.1473 25.2C18.7073 24.7333 19.3473 24.34 20.0673 24.02C20.8007 23.6867 21.6207 23.52 22.5273 23.52C23.8607 23.52 24.914 23.86 25.6873 24.54C26.4607 25.2067 26.8473 26.1333 26.8473 27.32C26.8473 28.0667 26.694 28.7667 26.3873 29.42C26.0807 30.0733 25.654 30.72 25.1073 31.36C24.5607 31.9867 23.9207 32.66 23.1873 33.38L20.2073 36.32V36.4H27.4273V38ZM33.9727 29.24C35.4393 29.24 36.606 29.6067 37.4727 30.34C38.3393 31.0733 38.7727 32.1067 38.7727 33.44C38.7727 34.92 38.2993 36.0867 37.3527 36.94C36.4193 37.78 35.1127 38.2 33.4327 38.2C32.6993 38.2 32.006 38.1333 31.3527 38C30.7127 37.8667 30.1727 37.6733 29.7327 37.42V35.76C30.2127 36.0533 30.7927 36.2867 31.4727 36.46C32.166 36.62 32.826 36.7 33.4527 36.7C34.506 36.7 35.3527 36.4533 35.9927 35.96C36.646 35.4533 36.9727 34.6733 36.9727 33.62C36.9727 32.6867 36.686 31.9733 36.1127 31.48C35.5393 30.9733 34.6327 30.72 33.3927 30.72C33.0193 30.72 32.5927 30.7533 32.1127 30.82C31.6327 30.8867 31.246 30.9533 30.9527 31.02L30.0727 30.46L30.6127 23.72H37.7727V25.32H32.1127L31.7727 29.46C31.9993 29.42 32.306 29.3733 32.6927 29.32C33.0793 29.2667 33.506 29.24 33.9727 29.24ZM46.618 27.08C46.818 27.08 47.0313 27.0933 47.258 27.12C47.498 27.1333 47.7046 27.16 47.878 27.2L47.658 28.82C47.4846 28.78 47.2913 28.7467 47.078 28.72C46.878 28.6933 46.6846 28.68 46.498 28.68C45.9513 28.68 45.438 28.8333 44.958 29.14C44.478 29.4333 44.0913 29.8533 43.798 30.4C43.518 30.9333 43.378 31.56 43.378 32.28V38H41.618V27.28H43.058L43.258 29.24H43.338C43.6846 28.6533 44.1313 28.1467 44.678 27.72C45.2246 27.2933 45.8713 27.08 46.618 27.08ZM53.6291 27.08C54.5491 27.08 55.3357 27.28 55.9891 27.68C56.6557 28.08 57.1624 28.6467 57.5091 29.38C57.8691 30.1 58.0491 30.9467 58.0491 31.92V32.98H50.7091C50.7357 34.1933 51.0424 35.12 51.6291 35.76C52.2291 36.3867 53.0624 36.7 54.1291 36.7C54.8091 36.7 55.4091 36.64 55.9291 36.52C56.4624 36.3867 57.0091 36.2 57.5691 35.96V37.5C57.0224 37.74 56.4824 37.9133 55.9491 38.02C55.4157 38.14 54.7824 38.2 54.0491 38.2C53.0357 38.2 52.1357 37.9933 51.3491 37.58C50.5757 37.1667 49.9691 36.5533 49.5291 35.74C49.1024 34.9133 48.8891 33.9067 48.8891 32.72C48.8891 31.5467 49.0824 30.54 49.4691 29.7C49.8691 28.86 50.4224 28.2133 51.1291 27.76C51.8491 27.3067 52.6824 27.08 53.6291 27.08ZM53.6091 28.52C52.7691 28.52 52.1024 28.7933 51.6091 29.34C51.1291 29.8733 50.8424 30.62 50.7491 31.58H56.2091C56.1957 30.6733 55.9824 29.94 55.5691 29.38C55.1557 28.8067 54.5024 28.52 53.6091 28.52ZM72.5381 27.08C73.7515 27.08 74.6581 27.3933 75.2581 28.02C75.8581 28.6333 76.1581 29.6333 76.1581 31.02V38H74.4181V31.1C74.4181 29.4067 73.6915 28.56 72.2381 28.56C71.1981 28.56 70.4515 28.86 69.9981 29.46C69.5581 30.06 69.3381 30.9333 69.3381 32.08V38H67.5981V31.1C67.5981 29.4067 66.8648 28.56 65.3981 28.56C64.3181 28.56 63.5715 28.8933 63.1581 29.56C62.7448 30.2267 62.5381 31.1867 62.5381 32.44V38H60.7781V27.28H62.1981L62.4581 28.74H62.5581C62.8915 28.18 63.3381 27.7667 63.8981 27.5C64.4715 27.22 65.0781 27.08 65.7181 27.08C67.3981 27.08 68.4915 27.68 68.9981 28.88H69.0981C69.4581 28.2667 69.9448 27.8133 70.5581 27.52C71.1848 27.2267 71.8448 27.08 72.5381 27.08Z" fill="black"/>
-<path d="M108.523 31.0586L102.898 36.6836C102.688 36.8945 102.406 37 102.125 37C101.809 37 101.527 36.8945 101.316 36.6836C100.859 36.2617 100.859 35.5234 101.316 35.1016L105.008 31.375H94.25C93.6172 31.375 93.125 30.8828 93.125 30.25C93.125 29.6523 93.6172 29.125 94.25 29.125H105.008L101.316 25.4336C100.859 25.0117 100.859 24.2734 101.316 23.8516C101.738 23.3945 102.477 23.3945 102.898 23.8516L108.523 29.4766C108.98 29.8984 108.98 30.6367 108.523 31.0586Z" fill="black"/>
-<path d="M125.046 33.42V31.86H129.886V33.42H125.046ZM131.491 33.42V31.86H136.331V33.42H131.491ZM142.637 27.08C143.343 27.08 143.977 27.2133 144.537 27.48C145.11 27.7467 145.597 28.1533 145.997 28.7H146.097L146.337 27.28H147.737V38.18C147.737 39.7133 147.343 40.8667 146.557 41.64C145.783 42.4133 144.577 42.8 142.937 42.8C141.363 42.8 140.077 42.5733 139.077 42.12V40.5C140.13 41.06 141.45 41.34 143.037 41.34C143.957 41.34 144.677 41.0667 145.197 40.52C145.73 39.9867 145.997 39.2533 145.997 38.32V37.9C145.997 37.74 146.003 37.5133 146.017 37.22C146.03 36.9133 146.043 36.7 146.057 36.58H145.977C145.257 37.66 144.15 38.2 142.657 38.2C141.27 38.2 140.183 37.7133 139.397 36.74C138.623 35.7667 138.237 34.4067 138.237 32.66C138.237 30.9533 138.623 29.6 139.397 28.6C140.183 27.5867 141.263 27.08 142.637 27.08ZM142.877 28.56C141.983 28.56 141.29 28.92 140.797 29.64C140.303 30.3467 140.057 31.36 140.057 32.68C140.057 34 140.297 35.0133 140.777 35.72C141.27 36.4133 141.983 36.76 142.917 36.76C143.997 36.76 144.783 36.4733 145.277 35.9C145.77 35.3133 146.017 34.3733 146.017 33.08V32.66C146.017 31.1933 145.763 30.1467 145.257 29.52C144.75 28.88 143.957 28.56 142.877 28.56ZM155.441 38.2C154.495 38.2 153.648 38.0067 152.901 37.62C152.168 37.2333 151.588 36.6333 151.161 35.82C150.748 35.0067 150.541 33.9667 150.541 32.7C150.541 31.38 150.761 30.3067 151.201 29.48C151.641 28.6533 152.235 28.0467 152.981 27.66C153.741 27.2733 154.601 27.08 155.561 27.08C156.108 27.08 156.635 27.14 157.141 27.26C157.648 27.3667 158.061 27.5 158.381 27.66L157.841 29.12C157.521 29 157.148 28.8867 156.721 28.78C156.295 28.6733 155.895 28.62 155.521 28.62C153.415 28.62 152.361 29.9733 152.361 32.68C152.361 33.9733 152.615 34.9667 153.121 35.66C153.641 36.34 154.408 36.68 155.421 36.68C156.008 36.68 156.521 36.62 156.961 36.5C157.415 36.38 157.828 36.2333 158.201 36.06V37.62C157.841 37.8067 157.441 37.9467 157.001 38.04C156.575 38.1467 156.055 38.2 155.441 38.2ZM164.551 38.2C163.217 38.2 162.151 37.74 161.351 36.82C160.551 35.8867 160.151 34.5 160.151 32.66C160.151 30.82 160.551 29.4333 161.351 28.5C162.164 27.5533 163.237 27.08 164.571 27.08C165.397 27.08 166.071 27.2333 166.591 27.54C167.124 27.8467 167.557 28.22 167.891 28.66H168.011C167.997 28.4867 167.971 28.2333 167.931 27.9C167.904 27.5533 167.891 27.28 167.891 27.08V22.8H169.651V38H168.231L167.971 36.56H167.891C167.571 37.0133 167.144 37.4 166.611 37.72C166.077 38.04 165.391 38.2 164.551 38.2ZM164.831 36.74C165.964 36.74 166.757 36.4333 167.211 35.82C167.677 35.1933 167.911 34.2533 167.911 33V32.68C167.911 31.3467 167.691 30.3267 167.251 29.62C166.811 28.9 165.997 28.54 164.811 28.54C163.864 28.54 163.151 28.92 162.671 29.68C162.204 30.4267 161.971 31.4333 161.971 32.7C161.971 33.98 162.204 34.9733 162.671 35.68C163.151 36.3867 163.871 36.74 164.831 36.74ZM180.035 35.04C180.035 36.08 179.649 36.8667 178.875 37.4C178.102 37.9333 177.062 38.2 175.755 38.2C175.009 38.2 174.362 38.14 173.815 38.02C173.282 37.9 172.809 37.7333 172.395 37.52V35.92C172.822 36.1333 173.335 36.3333 173.935 36.52C174.549 36.6933 175.169 36.78 175.795 36.78C176.689 36.78 177.335 36.64 177.735 36.36C178.135 36.0667 178.335 35.68 178.335 35.2C178.335 34.9333 178.262 34.6933 178.115 34.48C177.969 34.2667 177.702 34.0533 177.315 33.84C176.942 33.6267 176.402 33.3867 175.695 33.12C175.002 32.8533 174.409 32.5867 173.915 32.32C173.422 32.0533 173.042 31.7333 172.775 31.36C172.509 30.9867 172.375 30.5067 172.375 29.92C172.375 29.0133 172.742 28.3133 173.475 27.82C174.222 27.3267 175.195 27.08 176.395 27.08C177.049 27.08 177.655 27.1467 178.215 27.28C178.789 27.4 179.322 27.5733 179.815 27.8L179.215 29.2C178.762 29.0133 178.289 28.8533 177.795 28.72C177.302 28.5867 176.795 28.52 176.275 28.52C175.555 28.52 175.002 28.64 174.615 28.88C174.242 29.1067 174.055 29.42 174.055 29.82C174.055 30.1133 174.142 30.3667 174.315 30.58C174.489 30.78 174.775 30.98 175.175 31.18C175.589 31.3667 176.135 31.5933 176.815 31.86C177.495 32.1133 178.075 32.3733 178.555 32.64C179.035 32.9067 179.402 33.2333 179.655 33.62C179.909 33.9933 180.035 34.4667 180.035 35.04ZM181.726 33.42V31.86H186.566V33.42H181.726ZM194.011 28.64H191.311V38H189.551V28.64H187.671V27.82L189.551 27.22V26.6C189.551 25.2133 189.858 24.22 190.471 23.62C191.084 23.0067 191.938 22.7 193.031 22.7C193.458 22.7 193.844 22.74 194.191 22.82C194.551 22.8867 194.858 22.9667 195.111 23.06L194.651 24.44C194.438 24.3733 194.191 24.3067 193.911 24.24C193.631 24.1733 193.344 24.14 193.051 24.14C192.464 24.14 192.024 24.34 191.731 24.74C191.451 25.1267 191.311 25.74 191.311 26.58V27.28H194.011V28.64ZM205.266 32.62C205.266 34.3933 204.813 35.7667 203.906 36.74C203.013 37.7133 201.799 38.2 200.266 38.2C199.319 38.2 198.473 37.9867 197.726 37.56C196.993 37.12 196.413 36.4867 195.986 35.66C195.559 34.82 195.346 33.8067 195.346 32.62C195.346 30.8467 195.793 29.48 196.686 28.52C197.579 27.56 198.793 27.08 200.326 27.08C201.299 27.08 202.153 27.3 202.886 27.74C203.633 28.1667 204.213 28.7933 204.626 29.62C205.053 30.4333 205.266 31.4333 205.266 32.62ZM197.166 32.62C197.166 33.8867 197.413 34.8933 197.906 35.64C198.413 36.3733 199.213 36.74 200.306 36.74C201.386 36.74 202.179 36.3733 202.686 35.64C203.193 34.8933 203.446 33.8867 203.446 32.62C203.446 31.3533 203.193 30.36 202.686 29.64C202.179 28.92 201.379 28.56 200.286 28.56C199.193 28.56 198.399 28.92 197.906 29.64C197.413 30.36 197.166 31.3533 197.166 32.62ZM213.215 27.08C214.495 27.08 215.462 27.3933 216.115 28.02C216.769 28.6333 217.095 29.6333 217.095 31.02V38H215.355V31.14C215.355 29.42 214.555 28.56 212.955 28.56C211.769 28.56 210.949 28.8933 210.495 29.56C210.042 30.2267 209.815 31.1867 209.815 32.44V38H208.055V27.28H209.475L209.735 28.74H209.835C210.182 28.18 210.662 27.7667 211.275 27.5C211.889 27.22 212.535 27.08 213.215 27.08ZM223.999 36.76C224.265 36.76 224.539 36.74 224.819 36.7C225.099 36.6467 225.325 36.5933 225.499 36.54V37.88C225.312 37.9733 225.045 38.0467 224.699 38.1C224.352 38.1667 224.019 38.2 223.699 38.2C223.139 38.2 222.619 38.1067 222.139 37.92C221.672 37.72 221.292 37.38 220.999 36.9C220.705 36.42 220.559 35.7467 220.559 34.88V28.64H219.039V27.8L220.579 27.1L221.279 24.82H222.319V27.28H225.419V28.64H222.319V34.84C222.319 35.4933 222.472 35.98 222.779 36.3C223.099 36.6067 223.505 36.76 223.999 36.76ZM226.745 33.42V31.86H231.585V33.42H226.745ZM241.071 35.04C241.071 36.08 240.684 36.8667 239.911 37.4C239.137 37.9333 238.097 38.2 236.791 38.2C236.044 38.2 235.397 38.14 234.851 38.02C234.317 37.9 233.844 37.7333 233.431 37.52V35.92C233.857 36.1333 234.371 36.3333 234.971 36.52C235.584 36.6933 236.204 36.78 236.831 36.78C237.724 36.78 238.371 36.64 238.771 36.36C239.171 36.0667 239.371 35.68 239.371 35.2C239.371 34.9333 239.297 34.6933 239.151 34.48C239.004 34.2667 238.737 34.0533 238.351 33.84C237.977 33.6267 237.437 33.3867 236.731 33.12C236.037 32.8533 235.444 32.5867 234.951 32.32C234.457 32.0533 234.077 31.7333 233.811 31.36C233.544 30.9867 233.411 30.5067 233.411 29.92C233.411 29.0133 233.777 28.3133 234.511 27.82C235.257 27.3267 236.231 27.08 237.431 27.08C238.084 27.08 238.691 27.1467 239.251 27.28C239.824 27.4 240.357 27.5733 240.851 27.8L240.251 29.2C239.797 29.0133 239.324 28.8533 238.831 28.72C238.337 28.5867 237.831 28.52 237.311 28.52C236.591 28.52 236.037 28.64 235.651 28.88C235.277 29.1067 235.091 29.42 235.091 29.82C235.091 30.1133 235.177 30.3667 235.351 30.58C235.524 30.78 235.811 30.98 236.211 31.18C236.624 31.3667 237.171 31.5933 237.851 31.86C238.531 32.1133 239.111 32.3733 239.591 32.64C240.071 32.9067 240.437 33.2333 240.691 33.62C240.944 33.9933 241.071 34.4667 241.071 35.04ZM244.561 23.26C244.828 23.26 245.061 23.3533 245.261 23.54C245.474 23.7133 245.581 23.9933 245.581 24.38C245.581 24.7533 245.474 25.0333 245.261 25.22C245.061 25.4067 244.828 25.5 244.561 25.5C244.268 25.5 244.021 25.4067 243.821 25.22C243.621 25.0333 243.521 24.7533 243.521 24.38C243.521 23.9933 243.621 23.7133 243.821 23.54C244.021 23.3533 244.268 23.26 244.561 23.26ZM245.421 27.28V38H243.661V27.28H245.421ZM255.737 38H247.897V36.84L253.657 28.64H248.237V27.28H255.597V28.6L249.917 36.64H255.737V38ZM262.352 27.08C263.272 27.08 264.058 27.28 264.712 27.68C265.378 28.08 265.885 28.6467 266.232 29.38C266.592 30.1 266.772 30.9467 266.772 31.92V32.98H259.432C259.458 34.1933 259.765 35.12 260.352 35.76C260.952 36.3867 261.785 36.7 262.852 36.7C263.532 36.7 264.132 36.64 264.652 36.52C265.185 36.3867 265.732 36.2 266.292 35.96V37.5C265.745 37.74 265.205 37.9133 264.672 38.02C264.138 38.14 263.505 38.2 262.772 38.2C261.758 38.2 260.858 37.9933 260.072 37.58C259.298 37.1667 258.692 36.5533 258.252 35.74C257.825 34.9133 257.612 33.9067 257.612 32.72C257.612 31.5467 257.805 30.54 258.192 29.7C258.592 28.86 259.145 28.2133 259.852 27.76C260.572 27.3067 261.405 27.08 262.352 27.08ZM262.332 28.52C261.492 28.52 260.825 28.7933 260.332 29.34C259.852 29.8733 259.565 30.62 259.472 31.58H264.932C264.918 30.6733 264.705 29.94 264.292 29.38C263.878 28.8067 263.225 28.52 262.332 28.52ZM276.481 35.04C276.481 36.08 276.094 36.8667 275.321 37.4C274.547 37.9333 273.507 38.2 272.201 38.2C271.454 38.2 270.807 38.14 270.261 38.02C269.727 37.9 269.254 37.7333 268.841 37.52V35.92C269.267 36.1333 269.781 36.3333 270.381 36.52C270.994 36.6933 271.614 36.78 272.241 36.78C273.134 36.78 273.781 36.64 274.181 36.36C274.581 36.0667 274.781 35.68 274.781 35.2C274.781 34.9333 274.707 34.6933 274.561 34.48C274.414 34.2667 274.147 34.0533 273.761 33.84C273.387 33.6267 272.847 33.3867 272.141 33.12C271.447 32.8533 270.854 32.5867 270.361 32.32C269.867 32.0533 269.487 31.7333 269.221 31.36C268.954 30.9867 268.821 30.5067 268.821 29.92C268.821 29.0133 269.187 28.3133 269.921 27.82C270.667 27.3267 271.641 27.08 272.841 27.08C273.494 27.08 274.101 27.1467 274.661 27.28C275.234 27.4 275.767 27.5733 276.261 27.8L275.661 29.2C275.207 29.0133 274.734 28.8533 274.241 28.72C273.747 28.5867 273.241 28.52 272.721 28.52C272.001 28.52 271.447 28.64 271.061 28.88C270.687 29.1067 270.501 29.42 270.501 29.82C270.501 30.1133 270.587 30.3667 270.761 30.58C270.934 30.78 271.221 30.98 271.621 31.18C272.034 31.3667 272.581 31.5933 273.261 31.86C273.941 32.1133 274.521 32.3733 275.001 32.64C275.481 32.9067 275.847 33.2333 276.101 33.62C276.354 33.9933 276.481 34.4667 276.481 35.04ZM278.171 33.42V31.86H283.011V33.42H278.171ZM289.096 36.76C289.363 36.76 289.636 36.74 289.916 36.7C290.196 36.6467 290.423 36.5933 290.596 36.54V37.88C290.41 37.9733 290.143 38.0467 289.796 38.1C289.45 38.1667 289.116 38.2 288.796 38.2C288.236 38.2 287.716 38.1067 287.236 37.92C286.77 37.72 286.39 37.38 286.096 36.9C285.803 36.42 285.656 35.7467 285.656 34.88V28.64H284.136V27.8L285.676 27.1L286.376 24.82H287.416V27.28H290.516V28.64H287.416V34.84C287.416 35.4933 287.57 35.98 287.876 36.3C288.196 36.6067 288.603 36.76 289.096 36.76ZM296.883 27.08C297.803 27.08 298.59 27.28 299.243 27.68C299.91 28.08 300.416 28.6467 300.763 29.38C301.123 30.1 301.303 30.9467 301.303 31.92V32.98H293.963C293.99 34.1933 294.296 35.12 294.883 35.76C295.483 36.3867 296.316 36.7 297.383 36.7C298.063 36.7 298.663 36.64 299.183 36.52C299.716 36.3867 300.263 36.2 300.823 35.96V37.5C300.276 37.74 299.736 37.9133 299.203 38.02C298.67 38.14 298.036 38.2 297.303 38.2C296.29 38.2 295.39 37.9933 294.603 37.58C293.83 37.1667 293.223 36.5533 292.783 35.74C292.356 34.9133 292.143 33.9067 292.143 32.72C292.143 31.5467 292.336 30.54 292.723 29.7C293.123 28.86 293.676 28.2133 294.383 27.76C295.103 27.3067 295.936 27.08 296.883 27.08ZM296.863 28.52C296.023 28.52 295.356 28.7933 294.863 29.34C294.383 29.8733 294.096 30.62 294.003 31.58H299.463C299.45 30.6733 299.236 29.94 298.823 29.38C298.41 28.8067 297.756 28.52 296.863 28.52ZM306.181 32.52L302.481 27.28H304.481L307.241 31.32L309.981 27.28H311.961L308.261 32.52L312.161 38H310.161L307.241 33.72L304.281 38H302.301L306.181 32.52ZM317.807 36.76C318.074 36.76 318.347 36.74 318.627 36.7C318.907 36.6467 319.134 36.5933 319.307 36.54V37.88C319.121 37.9733 318.854 38.0467 318.507 38.1C318.161 38.1667 317.827 38.2 317.507 38.2C316.947 38.2 316.427 38.1067 315.947 37.92C315.481 37.72 315.101 37.38 314.807 36.9C314.514 36.42 314.367 35.7467 314.367 34.88V28.64H312.847V27.8L314.387 27.1L315.087 24.82H316.127V27.28H319.227V28.64H316.127V34.84C316.127 35.4933 316.281 35.98 316.587 36.3C316.907 36.6067 317.314 36.76 317.807 36.76Z" fill="black"/>
-<path d="M10.2116 111.06C10.2116 112.02 9.9449 112.787 9.41156 113.36C8.87823 113.92 8.15823 114.293 7.25156 114.48V114.56C8.39823 114.693 9.25156 115.053 9.81156 115.64C10.3716 116.227 10.6516 116.993 10.6516 117.94C10.6516 118.767 10.4582 119.507 10.0716 120.16C9.6849 120.8 9.0849 121.3 8.27156 121.66C7.47156 122.02 6.43823 122.2 5.17156 122.2C4.4249 122.2 3.73156 122.14 3.09156 122.02C2.45156 121.913 1.83823 121.713 1.25156 121.42V119.78C1.85156 120.073 2.49823 120.307 3.19156 120.48C3.8849 120.64 4.55156 120.72 5.19156 120.72C6.47156 120.72 7.39156 120.473 7.95156 119.98C8.5249 119.473 8.81156 118.78 8.81156 117.9C8.81156 117.007 8.45823 116.367 7.75156 115.98C7.05823 115.58 6.07823 115.38 4.81156 115.38H3.43156V113.88H4.83156C6.0049 113.88 6.89156 113.633 7.49156 113.14C8.1049 112.647 8.41156 111.993 8.41156 111.18C8.41156 110.487 8.17823 109.953 7.71156 109.58C7.2449 109.193 6.61156 109 5.81156 109C5.03823 109 4.37823 109.113 3.83156 109.34C3.2849 109.567 2.7449 109.853 2.21156 110.2L1.33156 109C1.83823 108.6 2.4649 108.253 3.21156 107.96C3.97156 107.667 4.83156 107.52 5.79156 107.52C7.2849 107.52 8.39156 107.853 9.11156 108.52C9.8449 109.187 10.2116 110.033 10.2116 111.06ZM18.4969 111.08C18.6969 111.08 18.9102 111.093 19.1369 111.12C19.3769 111.133 19.5835 111.16 19.7569 111.2L19.5369 112.82C19.3635 112.78 19.1702 112.747 18.9569 112.72C18.7569 112.693 18.5635 112.68 18.3769 112.68C17.8302 112.68 17.3169 112.833 16.8369 113.14C16.3569 113.433 15.9702 113.853 15.6769 114.4C15.3969 114.933 15.2569 115.56 15.2569 116.28V122H13.4969V111.28H14.9369L15.1369 113.24H15.2169C15.5635 112.653 16.0102 112.147 16.5569 111.72C17.1035 111.293 17.7502 111.08 18.4969 111.08ZM25.508 111.08C26.428 111.08 27.2146 111.28 27.868 111.68C28.5346 112.08 29.0413 112.647 29.388 113.38C29.748 114.1 29.928 114.947 29.928 115.92V116.98H22.588C22.6146 118.193 22.9213 119.12 23.508 119.76C24.108 120.387 24.9413 120.7 26.008 120.7C26.688 120.7 27.288 120.64 27.808 120.52C28.3413 120.387 28.888 120.2 29.448 119.96V121.5C28.9013 121.74 28.3613 121.913 27.828 122.02C27.2946 122.14 26.6613 122.2 25.928 122.2C24.9146 122.2 24.0146 121.993 23.228 121.58C22.4546 121.167 21.848 120.553 21.408 119.74C20.9813 118.913 20.768 117.907 20.768 116.72C20.768 115.547 20.9613 114.54 21.348 113.7C21.748 112.86 22.3013 112.213 23.008 111.76C23.728 111.307 24.5613 111.08 25.508 111.08ZM25.488 112.52C24.648 112.52 23.9813 112.793 23.488 113.34C23.008 113.873 22.7213 114.62 22.628 115.58H28.088C28.0746 114.673 27.8613 113.94 27.448 113.38C27.0346 112.807 26.3813 112.52 25.488 112.52ZM44.417 111.08C45.6304 111.08 46.537 111.393 47.137 112.02C47.737 112.633 48.037 113.633 48.037 115.02V122H46.297V115.1C46.297 113.407 45.5704 112.56 44.117 112.56C43.077 112.56 42.3304 112.86 41.877 113.46C41.437 114.06 41.217 114.933 41.217 116.08V122H39.477V115.1C39.477 113.407 38.7437 112.56 37.277 112.56C36.197 112.56 35.4504 112.893 35.037 113.56C34.6237 114.227 34.417 115.187 34.417 116.44V122H32.657V111.28H34.077L34.337 112.74H34.437C34.7704 112.18 35.217 111.767 35.777 111.5C36.3504 111.22 36.957 111.08 37.597 111.08C39.277 111.08 40.3704 111.68 40.877 112.88H40.977C41.337 112.267 41.8237 111.813 42.437 111.52C43.0637 111.227 43.7237 111.08 44.417 111.08Z" fill="black"/>
-<path d="M9.41156 113.36C9.9449 112.787 10.2116 112.02 10.2116 111.06C10.2116 110.033 9.8449 109.187 9.11156 108.52C8.39156 107.853 7.2849 107.52 5.79156 107.52C4.83156 107.52 3.97156 107.667 3.21156 107.96C2.4649 108.253 1.83823 108.6 1.33156 109L2.21156 110.2C2.7449 109.853 3.2849 109.567 3.83156 109.34C4.37823 109.113 5.03823 109 5.81156 109C6.61156 109 7.2449 109.193 7.71156 109.58C8.17823 109.953 8.41156 110.487 8.41156 111.18C8.41156 111.993 8.1049 112.647 7.49156 113.14C6.89156 113.633 6.0049 113.88 4.83156 113.88H3.43156V115.38H4.81156C6.07823 115.38 7.05823 115.58 7.75156 115.98C8.45823 116.367 8.81156 117.007 8.81156 117.9C8.81156 118.78 8.5249 119.473 7.95156 119.98C7.39156 120.473 6.47156 120.72 5.19156 120.72C4.55156 120.72 3.8849 120.64 3.19156 120.48C2.49823 120.307 1.85156 120.073 1.25156 119.78V121.42C1.83823 121.713 2.45156 121.913 3.09156 122.02C3.73156 122.14 4.4249 122.2 5.17156 122.2C6.43823 122.2 7.47156 122.02 8.27156 121.66C9.0849 121.3 9.6849 120.8 10.0716 120.16C10.4582 119.507 10.6516 118.767 10.6516 117.94C10.6516 116.993 10.3716 116.227 9.81156 115.64C9.25156 115.053 8.39823 114.693 7.25156 114.56V114.48C8.15823 114.293 8.87823 113.92 9.41156 113.36Z" fill="black"/>
-<path d="M80.5234 115.059L74.8984 120.684C74.6875 120.895 74.4062 121 74.125 121C73.8086 121 73.5273 120.895 73.3164 120.684C72.8594 120.262 72.8594 119.523 73.3164 119.102L77.0078 115.375H66.25C65.6172 115.375 65.125 114.883 65.125 114.25C65.125 113.652 65.6172 113.125 66.25 113.125H77.0078L73.3164 109.434C72.8594 109.012 72.8594 108.273 73.3164 107.852C73.7383 107.395 74.4766 107.395 74.8984 107.852L80.5234 113.477C80.9805 113.898 80.9805 114.637 80.5234 115.059Z" fill="black"/>
-<path d="M97.0871 117.42V115.86H101.927V117.42H97.0871ZM103.532 117.42V115.86H108.372V117.42H103.532ZM114.678 111.08C115.384 111.08 116.018 111.213 116.578 111.48C117.151 111.747 117.638 112.153 118.038 112.7H118.138L118.378 111.28H119.778V122.18C119.778 123.713 119.384 124.867 118.598 125.64C117.824 126.413 116.618 126.8 114.978 126.8C113.404 126.8 112.118 126.573 111.118 126.12V124.5C112.171 125.06 113.491 125.34 115.078 125.34C115.998 125.34 116.718 125.067 117.238 124.52C117.771 123.987 118.038 123.253 118.038 122.32V121.9C118.038 121.74 118.044 121.513 118.058 121.22C118.071 120.913 118.084 120.7 118.098 120.58H118.018C117.298 121.66 116.191 122.2 114.698 122.2C113.311 122.2 112.224 121.713 111.438 120.74C110.664 119.767 110.278 118.407 110.278 116.66C110.278 114.953 110.664 113.6 111.438 112.6C112.224 111.587 113.304 111.08 114.678 111.08ZM114.918 112.56C114.024 112.56 113.331 112.92 112.838 113.64C112.344 114.347 112.098 115.36 112.098 116.68C112.098 118 112.338 119.013 112.818 119.72C113.311 120.413 114.024 120.76 114.958 120.76C116.038 120.76 116.824 120.473 117.318 119.9C117.811 119.313 118.058 118.373 118.058 117.08V116.66C118.058 115.193 117.804 114.147 117.298 113.52C116.791 112.88 115.998 112.56 114.918 112.56ZM127.482 122.2C126.536 122.2 125.689 122.007 124.942 121.62C124.209 121.233 123.629 120.633 123.202 119.82C122.789 119.007 122.582 117.967 122.582 116.7C122.582 115.38 122.802 114.307 123.242 113.48C123.682 112.653 124.276 112.047 125.022 111.66C125.782 111.273 126.642 111.08 127.602 111.08C128.149 111.08 128.676 111.14 129.182 111.26C129.689 111.367 130.102 111.5 130.422 111.66L129.882 113.12C129.562 113 129.189 112.887 128.762 112.78C128.336 112.673 127.936 112.62 127.562 112.62C125.456 112.62 124.402 113.973 124.402 116.68C124.402 117.973 124.656 118.967 125.162 119.66C125.682 120.34 126.449 120.68 127.462 120.68C128.049 120.68 128.562 120.62 129.002 120.5C129.456 120.38 129.869 120.233 130.242 120.06V121.62C129.882 121.807 129.482 121.947 129.042 122.04C128.616 122.147 128.096 122.2 127.482 122.2ZM136.592 122.2C135.258 122.2 134.192 121.74 133.392 120.82C132.592 119.887 132.192 118.5 132.192 116.66C132.192 114.82 132.592 113.433 133.392 112.5C134.205 111.553 135.278 111.08 136.612 111.08C137.438 111.08 138.112 111.233 138.632 111.54C139.165 111.847 139.598 112.22 139.932 112.66H140.052C140.038 112.487 140.012 112.233 139.972 111.9C139.945 111.553 139.932 111.28 139.932 111.08V106.8H141.692V122H140.272L140.012 120.56H139.932C139.612 121.013 139.185 121.4 138.652 121.72C138.118 122.04 137.432 122.2 136.592 122.2ZM136.872 120.74C138.005 120.74 138.798 120.433 139.252 119.82C139.718 119.193 139.952 118.253 139.952 117V116.68C139.952 115.347 139.732 114.327 139.292 113.62C138.852 112.9 138.038 112.54 136.852 112.54C135.905 112.54 135.192 112.92 134.712 113.68C134.245 114.427 134.012 115.433 134.012 116.7C134.012 117.98 134.245 118.973 134.712 119.68C135.192 120.387 135.912 120.74 136.872 120.74ZM152.076 119.04C152.076 120.08 151.69 120.867 150.916 121.4C150.143 121.933 149.103 122.2 147.796 122.2C147.05 122.2 146.403 122.14 145.856 122.02C145.323 121.9 144.85 121.733 144.436 121.52V119.92C144.863 120.133 145.376 120.333 145.976 120.52C146.59 120.693 147.21 120.78 147.836 120.78C148.73 120.78 149.376 120.64 149.776 120.36C150.176 120.067 150.376 119.68 150.376 119.2C150.376 118.933 150.303 118.693 150.156 118.48C150.01 118.267 149.743 118.053 149.356 117.84C148.983 117.627 148.443 117.387 147.736 117.12C147.043 116.853 146.45 116.587 145.956 116.32C145.463 116.053 145.083 115.733 144.816 115.36C144.55 114.987 144.416 114.507 144.416 113.92C144.416 113.013 144.783 112.313 145.516 111.82C146.263 111.327 147.236 111.08 148.436 111.08C149.09 111.08 149.696 111.147 150.256 111.28C150.83 111.4 151.363 111.573 151.856 111.8L151.256 113.2C150.803 113.013 150.33 112.853 149.836 112.72C149.343 112.587 148.836 112.52 148.316 112.52C147.596 112.52 147.043 112.64 146.656 112.88C146.283 113.107 146.096 113.42 146.096 113.82C146.096 114.113 146.183 114.367 146.356 114.58C146.53 114.78 146.816 114.98 147.216 115.18C147.63 115.367 148.176 115.593 148.856 115.86C149.536 116.113 150.116 116.373 150.596 116.64C151.076 116.907 151.443 117.233 151.696 117.62C151.95 117.993 152.076 118.467 152.076 119.04ZM153.767 117.42V115.86H158.607V117.42H153.767ZM168.092 119.04C168.092 120.08 167.705 120.867 166.932 121.4C166.159 121.933 165.119 122.2 163.812 122.2C163.065 122.2 162.419 122.14 161.872 122.02C161.339 121.9 160.865 121.733 160.452 121.52V119.92C160.879 120.133 161.392 120.333 161.992 120.52C162.605 120.693 163.225 120.78 163.852 120.78C164.745 120.78 165.392 120.64 165.792 120.36C166.192 120.067 166.392 119.68 166.392 119.2C166.392 118.933 166.319 118.693 166.172 118.48C166.025 118.267 165.759 118.053 165.372 117.84C164.999 117.627 164.459 117.387 163.752 117.12C163.059 116.853 162.465 116.587 161.972 116.32C161.479 116.053 161.099 115.733 160.832 115.36C160.565 114.987 160.432 114.507 160.432 113.92C160.432 113.013 160.799 112.313 161.532 111.82C162.279 111.327 163.252 111.08 164.452 111.08C165.105 111.08 165.712 111.147 166.272 111.28C166.845 111.4 167.379 111.573 167.872 111.8L167.272 113.2C166.819 113.013 166.345 112.853 165.852 112.72C165.359 112.587 164.852 112.52 164.332 112.52C163.612 112.52 163.059 112.64 162.672 112.88C162.299 113.107 162.112 113.42 162.112 113.82C162.112 114.113 162.199 114.367 162.372 114.58C162.545 114.78 162.832 114.98 163.232 115.18C163.645 115.367 164.192 115.593 164.872 115.86C165.552 116.113 166.132 116.373 166.612 116.64C167.092 116.907 167.459 117.233 167.712 117.62C167.965 117.993 168.092 118.467 168.092 119.04ZM175.782 111.08C177.102 111.08 178.162 111.54 178.962 112.46C179.776 113.38 180.182 114.767 180.182 116.62C180.182 118.447 179.776 119.833 178.962 120.78C178.162 121.727 177.096 122.2 175.762 122.2C174.936 122.2 174.249 122.047 173.702 121.74C173.169 121.42 172.749 121.053 172.442 120.64H172.322C172.349 120.867 172.376 121.153 172.402 121.5C172.429 121.847 172.442 122.147 172.442 122.4V126.8H170.682V111.28H172.122L172.362 112.74H172.442C172.762 112.273 173.182 111.88 173.702 111.56C174.222 111.24 174.916 111.08 175.782 111.08ZM175.462 112.56C174.369 112.56 173.596 112.867 173.142 113.48C172.702 114.093 172.469 115.027 172.442 116.28V116.62C172.442 117.94 172.656 118.96 173.082 119.68C173.522 120.387 174.329 120.74 175.502 120.74C176.156 120.74 176.689 120.56 177.102 120.2C177.529 119.84 177.842 119.353 178.042 118.74C178.256 118.113 178.362 117.4 178.362 116.6C178.362 115.373 178.122 114.393 177.642 113.66C177.176 112.927 176.449 112.56 175.462 112.56ZM187.047 111.1C188.354 111.1 189.32 111.387 189.947 111.96C190.574 112.533 190.887 113.447 190.887 114.7V122H189.607L189.267 120.48H189.187C188.72 121.067 188.227 121.5 187.707 121.78C187.2 122.06 186.494 122.2 185.587 122.2C184.614 122.2 183.807 121.947 183.167 121.44C182.527 120.92 182.207 120.113 182.207 119.02C182.207 117.953 182.627 117.133 183.467 116.56C184.307 115.973 185.6 115.653 187.347 115.6L189.167 115.54V114.9C189.167 114.007 188.974 113.387 188.587 113.04C188.2 112.693 187.654 112.52 186.947 112.52C186.387 112.52 185.854 112.607 185.347 112.78C184.84 112.94 184.367 113.127 183.927 113.34L183.387 112.02C183.854 111.767 184.407 111.553 185.047 111.38C185.687 111.193 186.354 111.1 187.047 111.1ZM187.567 116.82C186.234 116.873 185.307 117.087 184.787 117.46C184.28 117.833 184.027 118.36 184.027 119.04C184.027 119.64 184.207 120.08 184.567 120.36C184.94 120.64 185.414 120.78 185.987 120.78C186.894 120.78 187.647 120.533 188.247 120.04C188.847 119.533 189.147 118.76 189.147 117.72V116.76L187.567 116.82ZM198.498 122.2C197.551 122.2 196.705 122.007 195.958 121.62C195.225 121.233 194.645 120.633 194.218 119.82C193.805 119.007 193.598 117.967 193.598 116.7C193.598 115.38 193.818 114.307 194.258 113.48C194.698 112.653 195.291 112.047 196.038 111.66C196.798 111.273 197.658 111.08 198.618 111.08C199.165 111.08 199.691 111.14 200.198 111.26C200.705 111.367 201.118 111.5 201.438 111.66L200.898 113.12C200.578 113 200.205 112.887 199.778 112.78C199.351 112.673 198.951 112.62 198.578 112.62C196.471 112.62 195.418 113.973 195.418 116.68C195.418 117.973 195.671 118.967 196.178 119.66C196.698 120.34 197.465 120.68 198.478 120.68C199.065 120.68 199.578 120.62 200.018 120.5C200.471 120.38 200.885 120.233 201.258 120.06V121.62C200.898 121.807 200.498 121.947 200.058 122.04C199.631 122.147 199.111 122.2 198.498 122.2ZM204.707 107.26C204.974 107.26 205.207 107.353 205.407 107.54C205.621 107.713 205.727 107.993 205.727 108.38C205.727 108.753 205.621 109.033 205.407 109.22C205.207 109.407 204.974 109.5 204.707 109.5C204.414 109.5 204.167 109.407 203.967 109.22C203.767 109.033 203.667 108.753 203.667 108.38C203.667 107.993 203.767 107.713 203.967 107.54C204.167 107.353 204.414 107.26 204.707 107.26ZM205.567 111.28V122H203.807V111.28H205.567ZM214.124 111.08C215.404 111.08 216.37 111.393 217.024 112.02C217.677 112.633 218.004 113.633 218.004 115.02V122H216.264V115.14C216.264 113.42 215.464 112.56 213.864 112.56C212.677 112.56 211.857 112.893 211.404 113.56C210.95 114.227 210.724 115.187 210.724 116.44V122H208.964V111.28H210.384L210.644 112.74H210.744C211.09 112.18 211.57 111.767 212.184 111.5C212.797 111.22 213.444 111.08 214.124 111.08ZM225.127 111.08C225.834 111.08 226.467 111.213 227.027 111.48C227.6 111.747 228.087 112.153 228.487 112.7H228.587L228.827 111.28H230.227V122.18C230.227 123.713 229.834 124.867 229.047 125.64C228.274 126.413 227.067 126.8 225.427 126.8C223.854 126.8 222.567 126.573 221.567 126.12V124.5C222.62 125.06 223.94 125.34 225.527 125.34C226.447 125.34 227.167 125.067 227.687 124.52C228.22 123.987 228.487 123.253 228.487 122.32V121.9C228.487 121.74 228.494 121.513 228.507 121.22C228.52 120.913 228.534 120.7 228.547 120.58H228.467C227.747 121.66 226.64 122.2 225.147 122.2C223.76 122.2 222.674 121.713 221.887 120.74C221.114 119.767 220.727 118.407 220.727 116.66C220.727 114.953 221.114 113.6 221.887 112.6C222.674 111.587 223.754 111.08 225.127 111.08ZM225.367 112.56C224.474 112.56 223.78 112.92 223.287 113.64C222.794 114.347 222.547 115.36 222.547 116.68C222.547 118 222.787 119.013 223.267 119.72C223.76 120.413 224.474 120.76 225.407 120.76C226.487 120.76 227.274 120.473 227.767 119.9C228.26 119.313 228.507 118.373 228.507 117.08V116.66C228.507 115.193 228.254 114.147 227.747 113.52C227.24 112.88 226.447 112.56 225.367 112.56ZM232.732 117.42V115.86H237.572V117.42H232.732ZM243.877 113.24C245.344 113.24 246.51 113.607 247.377 114.34C248.244 115.073 248.677 116.107 248.677 117.44C248.677 118.92 248.204 120.087 247.257 120.94C246.324 121.78 245.017 122.2 243.337 122.2C242.604 122.2 241.91 122.133 241.257 122C240.617 121.867 240.077 121.673 239.637 121.42V119.76C240.117 120.053 240.697 120.287 241.377 120.46C242.07 120.62 242.73 120.7 243.357 120.7C244.41 120.7 245.257 120.453 245.897 119.96C246.55 119.453 246.877 118.673 246.877 117.62C246.877 116.687 246.59 115.973 246.017 115.48C245.444 114.973 244.537 114.72 243.297 114.72C242.924 114.72 242.497 114.753 242.017 114.82C241.537 114.887 241.15 114.953 240.857 115.02L239.977 114.46L240.517 107.72H247.677V109.32H242.017L241.677 113.46C241.904 113.42 242.21 113.373 242.597 113.32C242.984 113.267 243.41 113.24 243.877 113.24ZM260.282 114.84C260.282 116.373 260.122 117.693 259.802 118.8C259.482 119.893 258.976 120.733 258.282 121.32C257.589 121.907 256.669 122.2 255.522 122.2C253.909 122.2 252.716 121.553 251.942 120.26C251.182 118.953 250.802 117.147 250.802 114.84C250.802 113.293 250.956 111.973 251.262 110.88C251.582 109.787 252.089 108.953 252.782 108.38C253.476 107.793 254.389 107.5 255.522 107.5C257.122 107.5 258.316 108.147 259.102 109.44C259.889 110.72 260.282 112.52 260.282 114.84ZM252.562 114.84C252.562 116.8 252.782 118.267 253.222 119.24C253.676 120.213 254.442 120.7 255.522 120.7C256.589 120.7 257.349 120.22 257.802 119.26C258.269 118.287 258.502 116.813 258.502 114.84C258.502 112.893 258.269 111.433 257.802 110.46C257.349 109.487 256.589 109 255.522 109C254.442 109 253.676 109.487 253.222 110.46C252.782 111.433 252.562 112.893 252.562 114.84ZM271.728 114.84C271.728 116.373 271.568 117.693 271.248 118.8C270.928 119.893 270.421 120.733 269.728 121.32C269.034 121.907 268.114 122.2 266.968 122.2C265.354 122.2 264.161 121.553 263.388 120.26C262.628 118.953 262.248 117.147 262.248 114.84C262.248 113.293 262.401 111.973 262.708 110.88C263.028 109.787 263.534 108.953 264.228 108.38C264.921 107.793 265.834 107.5 266.968 107.5C268.568 107.5 269.761 108.147 270.548 109.44C271.334 110.72 271.728 112.52 271.728 114.84ZM264.008 114.84C264.008 116.8 264.228 118.267 264.668 119.24C265.121 120.213 265.888 120.7 266.968 120.7C268.034 120.7 268.794 120.22 269.248 119.26C269.714 118.287 269.948 116.813 269.948 114.84C269.948 112.893 269.714 111.433 269.248 110.46C268.794 109.487 268.034 109 266.968 109C265.888 109 265.121 109.487 264.668 110.46C264.228 111.433 264.008 112.893 264.008 114.84Z" fill="black"/>
-<path d="M9.79922 197.28L9.17922 200.48H11.9192V201.82H8.91922L8.09922 206H6.67922L7.49922 201.82H4.63922L3.85922 206H2.45922L3.21922 201.82H0.699219V200.48H3.47922L4.11922 197.28H1.43922V195.96H4.35922L5.15922 191.72H6.59922L5.79922 195.96H8.67922L9.47922 191.72H10.8592L10.0592 195.96H12.5992V197.28H9.79922ZM4.89922 200.48H7.75922L8.37922 197.28H5.51922L4.89922 200.48Z" fill="black"/>
-<path d="M22.66 197.56C23.1933 196.987 23.46 196.22 23.46 195.26C23.46 194.233 23.0933 193.387 22.36 192.72C21.64 192.053 20.5333 191.72 19.04 191.72C18.08 191.72 17.22 191.867 16.46 192.16C15.7133 192.453 15.0867 192.8 14.58 193.2L15.46 194.4C15.9933 194.053 16.5333 193.767 17.08 193.54C17.6267 193.313 18.2867 193.2 19.06 193.2C19.86 193.2 20.4933 193.393 20.96 193.78C21.4267 194.153 21.66 194.687 21.66 195.38C21.66 196.193 21.3533 196.847 20.74 197.34C20.14 197.833 19.2533 198.08 18.08 198.08H16.68V199.58H18.06C19.3267 199.58 20.3067 199.78 21 200.18C21.7067 200.567 22.06 201.207 22.06 202.1C22.06 202.98 21.7733 203.673 21.2 204.18C20.64 204.673 19.72 204.92 18.44 204.92C17.8 204.92 17.1333 204.84 16.44 204.68C15.7467 204.507 15.1 204.273 14.5 203.98V205.62C15.0867 205.913 15.7 206.113 16.34 206.22C16.98 206.34 17.6733 206.4 18.42 206.4C19.6867 206.4 20.72 206.22 21.52 205.86C22.3333 205.5 22.9333 205 23.32 204.36C23.7066 203.707 23.9 202.967 23.9 202.14C23.9 201.193 23.62 200.427 23.06 199.84C22.5 199.253 21.6467 198.893 20.5 198.76V198.68C21.4067 198.493 22.1267 198.12 22.66 197.56Z" fill="black"/>
-<path d="M34.1511 197.56C34.6844 196.987 34.9511 196.22 34.9511 195.26C34.9511 194.233 34.5844 193.387 33.8511 192.72C33.1311 192.053 32.0244 191.72 30.5311 191.72C29.5711 191.72 28.7111 191.867 27.9511 192.16C27.2044 192.453 26.5777 192.8 26.0711 193.2L26.9511 194.4C27.4844 194.053 28.0244 193.767 28.5711 193.54C29.1177 193.313 29.7777 193.2 30.5511 193.2C31.3511 193.2 31.9844 193.393 32.4511 193.78C32.9177 194.153 33.1511 194.687 33.1511 195.38C33.1511 196.193 32.8444 196.847 32.2311 197.34C31.6311 197.833 30.7444 198.08 29.5711 198.08H28.1711V199.58H29.5511C30.8177 199.58 31.7977 199.78 32.4911 200.18C33.1977 200.567 33.5511 201.207 33.5511 202.1C33.5511 202.98 33.2644 203.673 32.6911 204.18C32.1311 204.673 31.2111 204.92 29.9311 204.92C29.2911 204.92 28.6244 204.84 27.9311 204.68C27.2377 204.507 26.5911 204.273 25.9911 203.98V205.62C26.5777 205.913 27.1911 206.113 27.8311 206.22C28.4711 206.34 29.1644 206.4 29.9111 206.4C31.1777 206.4 32.2111 206.22 33.0111 205.86C33.8244 205.5 34.4244 205 34.8111 204.36C35.1977 203.707 35.3911 202.967 35.3911 202.14C35.3911 201.193 35.1111 200.427 34.5511 199.84C33.9911 199.253 33.1377 198.893 31.9911 198.76V198.68C32.8977 198.493 33.6177 198.12 34.1511 197.56Z" fill="black"/>
-<path d="M45.6511 197.56C46.1844 196.987 46.4511 196.22 46.4511 195.26C46.4511 194.233 46.0844 193.387 45.3511 192.72C44.6311 192.053 43.5244 191.72 42.0311 191.72C41.0711 191.72 40.2111 191.867 39.4511 192.16C38.7044 192.453 38.0777 192.8 37.5711 193.2L38.4511 194.4C38.9844 194.053 39.5244 193.767 40.0711 193.54C40.6177 193.313 41.2777 193.2 42.0511 193.2C42.8511 193.2 43.4844 193.393 43.9511 193.78C44.4177 194.153 44.6511 194.687 44.6511 195.38C44.6511 196.193 44.3444 196.847 43.7311 197.34C43.1311 197.833 42.2444 198.08 41.0711 198.08H39.6711V199.58H41.0511C42.3177 199.58 43.2977 199.78 43.9911 200.18C44.6977 200.567 45.0511 201.207 45.0511 202.1C45.0511 202.98 44.7644 203.673 44.1911 204.18C43.6311 204.673 42.7111 204.92 41.4311 204.92C40.7911 204.92 40.1244 204.84 39.4311 204.68C38.7377 204.507 38.0911 204.273 37.4911 203.98V205.62C38.0777 205.913 38.6911 206.113 39.3311 206.22C39.9711 206.34 40.6644 206.4 41.4111 206.4C42.6777 206.4 43.7111 206.22 44.5111 205.86C45.3244 205.5 45.9244 205 46.3111 204.36C46.6977 203.707 46.8911 202.967 46.8911 202.14C46.8911 201.193 46.6111 200.427 46.0511 199.84C45.4911 199.253 44.6377 198.893 43.4911 198.76V198.68C44.3977 198.493 45.1177 198.12 45.6511 197.56Z" fill="black"/>
-<path d="M57.16 197.56C57.6933 196.987 57.96 196.22 57.96 195.26C57.96 194.233 57.5933 193.387 56.86 192.72C56.14 192.053 55.0333 191.72 53.54 191.72C52.58 191.72 51.72 191.867 50.96 192.16C50.2133 192.453 49.5867 192.8 49.08 193.2L49.96 194.4C50.4933 194.053 51.0333 193.767 51.58 193.54C52.1267 193.313 52.7867 193.2 53.56 193.2C54.36 193.2 54.9933 193.393 55.46 193.78C55.9267 194.153 56.16 194.687 56.16 195.38C56.16 196.193 55.8533 196.847 55.24 197.34C54.64 197.833 53.7533 198.08 52.58 198.08H51.18V199.58H52.56C53.8267 199.58 54.8067 199.78 55.5 200.18C56.2067 200.567 56.56 201.207 56.56 202.1C56.56 202.98 56.2733 203.673 55.7 204.18C55.14 204.673 54.22 204.92 52.94 204.92C52.3 204.92 51.6333 204.84 50.94 204.68C50.2467 204.507 49.6 204.273 49 203.98V205.62C49.5867 205.913 50.2 206.113 50.84 206.22C51.48 206.34 52.1733 206.4 52.92 206.4C54.1867 206.4 55.22 206.22 56.02 205.86C56.8333 205.5 57.4333 205 57.82 204.36C58.2066 203.707 58.4 202.967 58.4 202.14C58.4 201.193 58.12 200.427 57.56 199.84C57 199.253 56.1467 198.893 55 198.76V198.68C55.9067 198.493 56.6267 198.12 57.16 197.56Z" fill="black"/>
-<path d="M68.6511 197.56C69.1844 196.987 69.4511 196.22 69.4511 195.26C69.4511 194.233 69.0844 193.387 68.3511 192.72C67.6311 192.053 66.5244 191.72 65.0311 191.72C64.0711 191.72 63.2111 191.867 62.4511 192.16C61.7044 192.453 61.0777 192.8 60.5711 193.2L61.4511 194.4C61.9844 194.053 62.5244 193.767 63.0711 193.54C63.6177 193.313 64.2777 193.2 65.0511 193.2C65.8511 193.2 66.4844 193.393 66.9511 193.78C67.4177 194.153 67.6511 194.687 67.6511 195.38C67.6511 196.193 67.3444 196.847 66.7311 197.34C66.1311 197.833 65.2444 198.08 64.0711 198.08H62.6711V199.58H64.0511C65.3177 199.58 66.2977 199.78 66.9911 200.18C67.6977 200.567 68.0511 201.207 68.0511 202.1C68.0511 202.98 67.7644 203.673 67.1911 204.18C66.6311 204.673 65.7111 204.92 64.4311 204.92C63.7911 204.92 63.1244 204.84 62.4311 204.68C61.7377 204.507 61.0911 204.273 60.4911 203.98V205.62C61.0777 205.913 61.6911 206.113 62.3311 206.22C62.9711 206.34 63.6644 206.4 64.4111 206.4C65.6777 206.4 66.7111 206.22 67.5111 205.86C68.3244 205.5 68.9244 205 69.3111 204.36C69.6977 203.707 69.8911 202.967 69.8911 202.14C69.8911 201.193 69.6111 200.427 69.0511 199.84C68.4911 199.253 67.6377 198.893 66.4911 198.76V198.68C67.3977 198.493 68.1177 198.12 68.6511 197.56Z" fill="black"/>
-<path d="M80.1511 197.56C80.6844 196.987 80.9511 196.22 80.9511 195.26C80.9511 194.233 80.5844 193.387 79.8511 192.72C79.1311 192.053 78.0244 191.72 76.5311 191.72C75.5711 191.72 74.7111 191.867 73.9511 192.16C73.2044 192.453 72.5777 192.8 72.0711 193.2L72.9511 194.4C73.4844 194.053 74.0244 193.767 74.5711 193.54C75.1177 193.313 75.7777 193.2 76.5511 193.2C77.3511 193.2 77.9844 193.393 78.4511 193.78C78.9177 194.153 79.1511 194.687 79.1511 195.38C79.1511 196.193 78.8444 196.847 78.2311 197.34C77.6311 197.833 76.7444 198.08 75.5711 198.08H74.1711V199.58H75.5511C76.8177 199.58 77.7977 199.78 78.4911 200.18C79.1977 200.567 79.5511 201.207 79.5511 202.1C79.5511 202.98 79.2644 203.673 78.6911 204.18C78.1311 204.673 77.2111 204.92 75.9311 204.92C75.2911 204.92 74.6244 204.84 73.9311 204.68C73.2377 204.507 72.5911 204.273 71.9911 203.98V205.62C72.5777 205.913 73.1911 206.113 73.8311 206.22C74.4711 206.34 75.1644 206.4 75.9111 206.4C77.1777 206.4 78.2111 206.22 79.0111 205.86C79.8244 205.5 80.4244 205 80.8111 204.36C81.1977 203.707 81.3911 202.967 81.3911 202.14C81.3911 201.193 81.1111 200.427 80.5511 199.84C79.9911 199.253 79.1377 198.893 77.9911 198.76V198.68C78.8977 198.493 79.6177 198.12 80.1511 197.56Z" fill="black"/>
-<path d="M112.523 199.059L106.898 204.684C106.688 204.895 106.406 205 106.125 205C105.809 205 105.527 204.895 105.316 204.684C104.859 204.262 104.859 203.523 105.316 203.102L109.008 199.375H98.25C97.6172 199.375 97.125 198.883 97.125 198.25C97.125 197.652 97.6172 197.125 98.25 197.125H109.008L105.316 193.434C104.859 193.012 104.859 192.273 105.316 191.852C105.738 191.395 106.477 191.395 106.898 191.852L112.523 197.477C112.98 197.898 112.98 198.637 112.523 199.059Z" fill="black"/>
-<path d="M129.005 201.42V199.86H133.845V201.42H129.005ZM135.45 201.42V199.86H140.29V201.42H135.45ZM146.596 195.08C147.302 195.08 147.936 195.213 148.496 195.48C149.069 195.747 149.556 196.153 149.956 196.7H150.056L150.296 195.28H151.696V206.18C151.696 207.713 151.302 208.867 150.516 209.64C149.742 210.413 148.536 210.8 146.896 210.8C145.322 210.8 144.036 210.573 143.036 210.12V208.5C144.089 209.06 145.409 209.34 146.996 209.34C147.916 209.34 148.636 209.067 149.156 208.52C149.689 207.987 149.956 207.253 149.956 206.32V205.9C149.956 205.74 149.962 205.513 149.976 205.22C149.989 204.913 150.002 204.7 150.016 204.58H149.936C149.216 205.66 148.109 206.2 146.616 206.2C145.229 206.2 144.142 205.713 143.356 204.74C142.582 203.767 142.196 202.407 142.196 200.66C142.196 198.953 142.582 197.6 143.356 196.6C144.142 195.587 145.222 195.08 146.596 195.08ZM146.836 196.56C145.942 196.56 145.249 196.92 144.756 197.64C144.262 198.347 144.016 199.36 144.016 200.68C144.016 202 144.256 203.013 144.736 203.72C145.229 204.413 145.942 204.76 146.876 204.76C147.956 204.76 148.742 204.473 149.236 203.9C149.729 203.313 149.976 202.373 149.976 201.08V200.66C149.976 199.193 149.722 198.147 149.216 197.52C148.709 196.88 147.916 196.56 146.836 196.56ZM159.4 206.2C158.454 206.2 157.607 206.007 156.86 205.62C156.127 205.233 155.547 204.633 155.12 203.82C154.707 203.007 154.5 201.967 154.5 200.7C154.5 199.38 154.72 198.307 155.16 197.48C155.6 196.653 156.194 196.047 156.94 195.66C157.7 195.273 158.56 195.08 159.52 195.08C160.067 195.08 160.594 195.14 161.1 195.26C161.607 195.367 162.02 195.5 162.34 195.66L161.8 197.12C161.48 197 161.107 196.887 160.68 196.78C160.254 196.673 159.854 196.62 159.48 196.62C157.374 196.62 156.32 197.973 156.32 200.68C156.32 201.973 156.574 202.967 157.08 203.66C157.6 204.34 158.367 204.68 159.38 204.68C159.967 204.68 160.48 204.62 160.92 204.5C161.374 204.38 161.787 204.233 162.16 204.06V205.62C161.8 205.807 161.4 205.947 160.96 206.04C160.534 206.147 160.014 206.2 159.4 206.2ZM168.51 206.2C167.176 206.2 166.11 205.74 165.31 204.82C164.51 203.887 164.11 202.5 164.11 200.66C164.11 198.82 164.51 197.433 165.31 196.5C166.123 195.553 167.196 195.08 168.53 195.08C169.356 195.08 170.03 195.233 170.55 195.54C171.083 195.847 171.516 196.22 171.85 196.66H171.97C171.956 196.487 171.93 196.233 171.89 195.9C171.863 195.553 171.85 195.28 171.85 195.08V190.8H173.61V206H172.19L171.93 204.56H171.85C171.53 205.013 171.103 205.4 170.57 205.72C170.036 206.04 169.35 206.2 168.51 206.2ZM168.79 204.74C169.923 204.74 170.716 204.433 171.17 203.82C171.636 203.193 171.87 202.253 171.87 201V200.68C171.87 199.347 171.65 198.327 171.21 197.62C170.77 196.9 169.956 196.54 168.77 196.54C167.823 196.54 167.11 196.92 166.63 197.68C166.163 198.427 165.93 199.433 165.93 200.7C165.93 201.98 166.163 202.973 166.63 203.68C167.11 204.387 167.83 204.74 168.79 204.74ZM183.994 203.04C183.994 204.08 183.608 204.867 182.834 205.4C182.061 205.933 181.021 206.2 179.714 206.2C178.968 206.2 178.321 206.14 177.774 206.02C177.241 205.9 176.768 205.733 176.354 205.52V203.92C176.781 204.133 177.294 204.333 177.894 204.52C178.508 204.693 179.128 204.78 179.754 204.78C180.648 204.78 181.294 204.64 181.694 204.36C182.094 204.067 182.294 203.68 182.294 203.2C182.294 202.933 182.221 202.693 182.074 202.48C181.928 202.267 181.661 202.053 181.274 201.84C180.901 201.627 180.361 201.387 179.654 201.12C178.961 200.853 178.368 200.587 177.874 200.32C177.381 200.053 177.001 199.733 176.734 199.36C176.468 198.987 176.334 198.507 176.334 197.92C176.334 197.013 176.701 196.313 177.434 195.82C178.181 195.327 179.154 195.08 180.354 195.08C181.008 195.08 181.614 195.147 182.174 195.28C182.748 195.4 183.281 195.573 183.774 195.8L183.174 197.2C182.721 197.013 182.248 196.853 181.754 196.72C181.261 196.587 180.754 196.52 180.234 196.52C179.514 196.52 178.961 196.64 178.574 196.88C178.201 197.107 178.014 197.42 178.014 197.82C178.014 198.113 178.101 198.367 178.274 198.58C178.448 198.78 178.734 198.98 179.134 199.18C179.548 199.367 180.094 199.593 180.774 199.86C181.454 200.113 182.034 200.373 182.514 200.64C182.994 200.907 183.361 201.233 183.614 201.62C183.868 201.993 183.994 202.467 183.994 203.04ZM185.685 201.42V199.86H190.525V201.42H185.685ZM196.61 204.76C196.877 204.76 197.15 204.74 197.43 204.7C197.71 204.647 197.937 204.593 198.11 204.54V205.88C197.923 205.973 197.657 206.047 197.31 206.1C196.963 206.167 196.63 206.2 196.31 206.2C195.75 206.2 195.23 206.107 194.75 205.92C194.283 205.72 193.903 205.38 193.61 204.9C193.317 204.42 193.17 203.747 193.17 202.88V196.64H191.65V195.8L193.19 195.1L193.89 192.82H194.93V195.28H198.03V196.64H194.93V202.84C194.93 203.493 195.083 203.98 195.39 204.3C195.71 204.607 196.117 204.76 196.61 204.76ZM204.397 195.08C205.317 195.08 206.103 195.28 206.757 195.68C207.423 196.08 207.93 196.647 208.277 197.38C208.637 198.1 208.817 198.947 208.817 199.92V200.98H201.477C201.503 202.193 201.81 203.12 202.397 203.76C202.997 204.387 203.83 204.7 204.897 204.7C205.577 204.7 206.177 204.64 206.697 204.52C207.23 204.387 207.777 204.2 208.337 203.96V205.5C207.79 205.74 207.25 205.913 206.717 206.02C206.183 206.14 205.55 206.2 204.817 206.2C203.803 206.2 202.903 205.993 202.117 205.58C201.343 205.167 200.737 204.553 200.297 203.74C199.87 202.913 199.657 201.907 199.657 200.72C199.657 199.547 199.85 198.54 200.237 197.7C200.637 196.86 201.19 196.213 201.897 195.76C202.617 195.307 203.45 195.08 204.397 195.08ZM204.377 196.52C203.537 196.52 202.87 196.793 202.377 197.34C201.897 197.873 201.61 198.62 201.517 199.58H206.977C206.963 198.673 206.75 197.94 206.337 197.38C205.923 196.807 205.27 196.52 204.377 196.52ZM213.695 200.52L209.995 195.28H211.995L214.755 199.32L217.495 195.28H219.475L215.775 200.52L219.675 206H217.675L214.755 201.72L211.795 206H209.815L213.695 200.52ZM225.321 204.76C225.588 204.76 225.861 204.74 226.141 204.7C226.421 204.647 226.648 204.593 226.821 204.54V205.88C226.634 205.973 226.368 206.047 226.021 206.1C225.674 206.167 225.341 206.2 225.021 206.2C224.461 206.2 223.941 206.107 223.461 205.92C222.994 205.72 222.614 205.38 222.321 204.9C222.028 204.42 221.881 203.747 221.881 202.88V196.64H220.361V195.8L221.901 195.1L222.601 192.82H223.641V195.28H226.741V196.64H223.641V202.84C223.641 203.493 223.794 203.98 224.101 204.3C224.421 204.607 224.828 204.76 225.321 204.76ZM228.068 201.42V199.86H232.908V201.42H228.068ZM240.513 195.08C241.833 195.08 242.893 195.54 243.693 196.46C244.506 197.38 244.913 198.767 244.913 200.62C244.913 202.447 244.506 203.833 243.693 204.78C242.893 205.727 241.826 206.2 240.493 206.2C239.666 206.2 238.98 206.047 238.433 205.74C237.9 205.42 237.48 205.053 237.173 204.64H237.053C237.08 204.867 237.106 205.153 237.133 205.5C237.16 205.847 237.173 206.147 237.173 206.4V210.8H235.413V195.28H236.853L237.093 196.74H237.173C237.493 196.273 237.913 195.88 238.433 195.56C238.953 195.24 239.646 195.08 240.513 195.08ZM240.193 196.56C239.1 196.56 238.326 196.867 237.873 197.48C237.433 198.093 237.2 199.027 237.173 200.28V200.62C237.173 201.94 237.386 202.96 237.813 203.68C238.253 204.387 239.06 204.74 240.233 204.74C240.886 204.74 241.42 204.56 241.833 204.2C242.26 203.84 242.573 203.353 242.773 202.74C242.986 202.113 243.093 201.4 243.093 200.6C243.093 199.373 242.853 198.393 242.373 197.66C241.906 196.927 241.18 196.56 240.193 196.56ZM252.718 195.08C252.918 195.08 253.131 195.093 253.358 195.12C253.598 195.133 253.804 195.16 253.978 195.2L253.758 196.82C253.584 196.78 253.391 196.747 253.178 196.72C252.978 196.693 252.784 196.68 252.598 196.68C252.051 196.68 251.538 196.833 251.058 197.14C250.578 197.433 250.191 197.853 249.898 198.4C249.618 198.933 249.478 199.56 249.478 200.28V206H247.718V195.28H249.158L249.358 197.24H249.438C249.784 196.653 250.231 196.147 250.778 195.72C251.324 195.293 251.971 195.08 252.718 195.08ZM256.879 191.26C257.146 191.26 257.379 191.353 257.579 191.54C257.793 191.713 257.899 191.993 257.899 192.38C257.899 192.753 257.793 193.033 257.579 193.22C257.379 193.407 257.146 193.5 256.879 193.5C256.586 193.5 256.339 193.407 256.139 193.22C255.939 193.033 255.839 192.753 255.839 192.38C255.839 191.993 255.939 191.713 256.139 191.54C256.339 191.353 256.586 191.26 256.879 191.26ZM257.739 195.28V206H255.979V195.28H257.739ZM272.896 195.08C274.109 195.08 275.016 195.393 275.616 196.02C276.216 196.633 276.516 197.633 276.516 199.02V206H274.776V199.1C274.776 197.407 274.049 196.56 272.596 196.56C271.556 196.56 270.809 196.86 270.356 197.46C269.916 198.06 269.696 198.933 269.696 200.08V206H267.956V199.1C267.956 197.407 267.222 196.56 265.756 196.56C264.676 196.56 263.929 196.893 263.516 197.56C263.102 198.227 262.896 199.187 262.896 200.44V206H261.136V195.28H262.556L262.816 196.74H262.916C263.249 196.18 263.696 195.767 264.256 195.5C264.829 195.22 265.436 195.08 266.076 195.08C267.756 195.08 268.849 195.68 269.356 196.88H269.456C269.816 196.267 270.302 195.813 270.916 195.52C271.542 195.227 272.202 195.08 272.896 195.08ZM283.887 195.1C285.194 195.1 286.16 195.387 286.787 195.96C287.414 196.533 287.727 197.447 287.727 198.7V206H286.447L286.107 204.48H286.027C285.56 205.067 285.067 205.5 284.547 205.78C284.04 206.06 283.334 206.2 282.427 206.2C281.454 206.2 280.647 205.947 280.007 205.44C279.367 204.92 279.047 204.113 279.047 203.02C279.047 201.953 279.467 201.133 280.307 200.56C281.147 199.973 282.44 199.653 284.187 199.6L286.007 199.54V198.9C286.007 198.007 285.814 197.387 285.427 197.04C285.04 196.693 284.494 196.52 283.787 196.52C283.227 196.52 282.694 196.607 282.187 196.78C281.68 196.94 281.207 197.127 280.767 197.34L280.227 196.02C280.694 195.767 281.247 195.553 281.887 195.38C282.527 195.193 283.194 195.1 283.887 195.1ZM284.407 200.82C283.074 200.873 282.147 201.087 281.627 201.46C281.12 201.833 280.867 202.36 280.867 203.04C280.867 203.64 281.047 204.08 281.407 204.36C281.78 204.64 282.254 204.78 282.827 204.78C283.734 204.78 284.487 204.533 285.087 204.04C285.687 203.533 285.987 202.76 285.987 201.72V200.76L284.407 200.82ZM296.038 195.08C296.238 195.08 296.451 195.093 296.678 195.12C296.918 195.133 297.125 195.16 297.298 195.2L297.078 196.82C296.905 196.78 296.711 196.747 296.498 196.72C296.298 196.693 296.105 196.68 295.918 196.68C295.371 196.68 294.858 196.833 294.378 197.14C293.898 197.433 293.511 197.853 293.218 198.4C292.938 198.933 292.798 199.56 292.798 200.28V206H291.038V195.28H292.478L292.678 197.24H292.758C293.105 196.653 293.551 196.147 294.098 195.72C294.645 195.293 295.291 195.08 296.038 195.08ZM297.62 195.28H299.5L301.82 201.38C302.02 201.913 302.2 202.427 302.36 202.92C302.52 203.4 302.64 203.86 302.72 204.3H302.8C302.88 203.967 303.006 203.533 303.18 203C303.353 202.453 303.533 201.907 303.72 201.36L305.9 195.28H307.8L303.18 207.48C302.806 208.493 302.32 209.3 301.72 209.9C301.133 210.5 300.32 210.8 299.28 210.8C298.96 210.8 298.68 210.78 298.44 210.74C298.2 210.713 297.993 210.68 297.82 210.64V209.24C297.966 209.267 298.14 209.293 298.34 209.32C298.553 209.347 298.773 209.36 299 209.36C299.613 209.36 300.106 209.187 300.48 208.84C300.866 208.493 301.166 208.033 301.38 207.46L301.94 206.04L297.62 195.28Z" fill="black"/>
+<svg width="350" height="193" viewBox="0 0 350 193" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_375_4970)">
+<rect width="350" height="193" fill="white"/>
+<path d="M6.95028 4.72727V20H5.10085V6.66619H5.01136L1.28267 9.14204V7.26278L5.10085 4.72727H6.95028ZM11.7528 20.1193C11.3849 20.1193 11.0692 19.9876 10.8058 19.7241C10.5423 19.4606 10.4105 19.1449 10.4105 18.777C10.4105 18.4091 10.5423 18.0934 10.8058 17.8299C11.0692 17.5664 11.3849 17.4347 11.7528 17.4347C12.1207 17.4347 12.4364 17.5664 12.6999 17.8299C12.9634 18.0934 13.0952 18.4091 13.0952 18.777C13.0952 19.0206 13.033 19.2443 12.9087 19.4482C12.7894 19.652 12.6278 19.8161 12.424 19.9403C12.2251 20.0597 12.0014 20.1193 11.7528 20.1193ZM16.2235 20V18.6577L21.2647 13.1392C21.8564 12.4929 22.3436 11.9311 22.7264 11.4538C23.1092 10.9716 23.3926 10.5192 23.5765 10.0966C23.7654 9.66903 23.8599 9.22159 23.8599 8.75426C23.8599 8.21733 23.7306 7.75249 23.4721 7.35973C23.2186 6.96697 22.8706 6.66371 22.4281 6.44993C21.9856 6.23615 21.4885 6.12926 20.9366 6.12926C20.35 6.12926 19.8379 6.25107 19.4004 6.49467C18.9679 6.73331 18.6323 7.06889 18.3936 7.50142C18.16 7.93395 18.0431 8.44105 18.0431 9.02273H16.2832C16.2832 8.12784 16.4895 7.34233 16.9022 6.66619C17.3148 5.99006 17.8766 5.46307 18.5875 5.08523C19.3034 4.70739 20.1064 4.51847 20.9963 4.51847C21.8912 4.51847 22.6841 4.70739 23.3752 5.08523C24.0662 5.46307 24.6081 5.97266 25.0009 6.61399C25.3936 7.25533 25.59 7.96875 25.59 8.75426C25.59 9.31605 25.4881 9.86541 25.2843 10.4023C25.0854 10.9343 24.7374 11.5284 24.2402 12.1847C23.748 12.8359 23.0645 13.6314 22.1895 14.571L18.7591 18.2401V18.3594H25.8585V20H16.2235ZM33.7111 20.2088C32.8361 20.2088 32.0481 20.0348 31.3471 19.6868C30.6461 19.3388 30.0843 18.8615 29.6618 18.255C29.2392 17.6484 29.008 16.9574 28.9682 16.1818H30.758C30.8276 16.8729 31.1408 17.4446 31.6976 17.897C32.2594 18.3445 32.9306 18.5682 33.7111 18.5682C34.3375 18.5682 34.8944 18.4215 35.3816 18.1282C35.8738 17.8349 36.2591 17.4322 36.5375 16.9201C36.8208 16.4031 36.9625 15.8189 36.9625 15.1676C36.9625 14.5014 36.8159 13.9073 36.5226 13.3853C36.2342 12.8583 35.8365 12.4432 35.3294 12.1399C34.8223 11.8366 34.2431 11.6825 33.5918 11.6776C33.1245 11.6726 32.6447 11.7447 32.1525 11.8938C31.6603 12.038 31.2551 12.2244 30.937 12.4531L29.2069 12.2443L30.1316 4.72727H38.0662V6.3679H31.6827L31.1458 10.8722H31.2353C31.5485 10.6236 31.9412 10.4173 32.4135 10.2532C32.8858 10.0891 33.378 10.0071 33.8901 10.0071C34.8248 10.0071 35.6575 10.2308 36.3883 10.6783C37.1241 11.1207 37.7008 11.7273 38.1184 12.4979C38.541 13.2685 38.7523 14.1484 38.7523 15.1378C38.7523 16.1122 38.5336 16.9822 38.0961 17.7479C37.6635 18.5085 37.0669 19.1101 36.3063 19.5526C35.5456 19.9901 34.6806 20.2088 33.7111 20.2088ZM41.7446 20V8.54545H43.4449V10.2756H43.5642C43.773 9.70881 44.1508 9.24893 44.6977 8.89595C45.2446 8.54297 45.8611 8.36648 46.5471 8.36648C46.6764 8.36648 46.838 8.36896 47.0319 8.37393C47.2258 8.37891 47.3724 8.38636 47.4719 8.39631V10.1861C47.4122 10.1712 47.2755 10.1488 47.0617 10.119C46.8529 10.0842 46.6317 10.0668 46.398 10.0668C45.8412 10.0668 45.344 10.1836 44.9065 10.4173C44.474 10.646 44.1309 10.9641 43.8774 11.3718C43.6288 11.7745 43.5045 12.2344 43.5045 12.7514V20H41.7446ZM54.012 20.2386C52.9083 20.2386 51.9562 19.995 51.1558 19.5078C50.3604 19.0156 49.7464 18.3295 49.3138 17.4496C48.8863 16.5646 48.6725 15.5355 48.6725 14.3622C48.6725 13.1889 48.8863 12.1548 49.3138 11.2599C49.7464 10.3601 50.3479 9.65909 51.1185 9.15696C51.8941 8.64986 52.7989 8.39631 53.833 8.39631C54.4296 8.39631 55.0187 8.49574 55.6004 8.6946C56.1821 8.89347 56.7116 9.21662 57.1888 9.66406C57.6661 10.1065 58.0464 10.6932 58.3298 11.424C58.6132 12.1548 58.7549 13.0547 58.7549 14.1236V14.8693H49.9253V13.348H56.9651C56.9651 12.7017 56.8358 12.125 56.5773 11.6179C56.3238 11.1108 55.9608 10.7106 55.4885 10.4173C55.0212 10.1239 54.4694 9.97727 53.833 9.97727C53.132 9.97727 52.5255 10.1513 52.0134 10.4993C51.5063 10.8423 51.116 11.2898 50.8426 11.8416C50.5692 12.3935 50.4324 12.9851 50.4324 13.6165V14.6307C50.4324 15.4957 50.5816 16.229 50.8799 16.8306C51.1831 17.4272 51.6032 17.8821 52.1402 18.1953C52.6771 18.5036 53.301 18.6577 54.012 18.6577C54.4743 18.6577 54.892 18.593 55.2648 18.4638C55.6427 18.3295 55.9683 18.1307 56.2417 17.8672C56.5152 17.5987 56.7265 17.2656 56.8756 16.8679L58.5759 17.3452C58.3969 17.9219 58.0961 18.429 57.6736 18.8665C57.251 19.299 56.729 19.6371 56.1075 19.8807C55.4861 20.1193 54.7876 20.2386 54.012 20.2386ZM61.4321 20V8.54545H63.1324V10.3352H63.2815C63.5202 9.72372 63.9055 9.24893 64.4374 8.91087C64.9694 8.56783 65.6082 8.39631 66.354 8.39631C67.1096 8.39631 67.7385 8.56783 68.2407 8.91087C68.7478 9.24893 69.143 9.72372 69.4264 10.3352H69.5457C69.839 9.74361 70.279 9.27379 70.8657 8.92578C71.4523 8.5728 72.1558 8.39631 72.9761 8.39631C74.0003 8.39631 74.838 8.71697 75.4893 9.35831C76.1405 9.99467 76.4662 10.9865 76.4662 12.3338V20H74.7062V12.3338C74.7062 11.4886 74.4751 10.8846 74.0127 10.5217C73.5503 10.1587 73.0059 9.97727 72.3795 9.97727C71.5741 9.97727 70.9502 10.2209 70.5077 10.7081C70.0653 11.1903 69.844 11.8018 69.844 12.5426V20H68.0542V12.1548C68.0542 11.5036 67.843 10.979 67.4204 10.5813C66.9978 10.1786 66.4534 9.97727 65.7872 9.97727C65.3298 9.97727 64.9023 10.0991 64.5045 10.3427C64.1118 10.5863 63.7936 10.9244 63.55 11.3569C63.3113 11.7844 63.192 12.2791 63.192 12.8409V20H61.4321ZM133.497 12.6321V14.2727H126.815V12.6321H133.497ZM143.156 12.6321V14.2727H136.474V12.6321H143.156ZM150.876 24.5341C150.026 24.5341 149.295 24.4247 148.684 24.206C148.072 23.9922 147.562 23.7088 147.155 23.3558C146.752 23.0078 146.431 22.6349 146.193 22.2372L147.595 21.2528C147.754 21.4616 147.955 21.7003 148.199 21.9688C148.442 22.2422 148.775 22.4783 149.198 22.6772C149.626 22.881 150.185 22.983 150.876 22.983C151.801 22.983 152.564 22.7592 153.165 22.3118C153.767 21.8643 154.068 21.1634 154.068 20.2088V17.8821H153.919C153.789 18.0909 153.605 18.3494 153.367 18.6577C153.133 18.9609 152.795 19.2319 152.353 19.4705C151.915 19.7042 151.323 19.821 150.578 19.821C149.653 19.821 148.823 19.6023 148.087 19.1648C147.356 18.7273 146.777 18.0909 146.349 17.2557C145.927 16.4205 145.715 15.4062 145.715 14.2131C145.715 13.0398 145.922 12.0181 146.334 11.1481C146.747 10.2731 147.321 9.59695 148.057 9.11967C148.793 8.63743 149.643 8.39631 150.608 8.39631C151.353 8.39631 151.945 8.5206 152.382 8.76918C152.825 9.01278 153.163 9.29119 153.397 9.6044C153.635 9.91264 153.819 10.1662 153.948 10.3651H154.127V8.54545H155.828V20.3281C155.828 21.3125 155.604 22.1129 155.157 22.7294C154.714 23.3509 154.117 23.8058 153.367 24.0941C152.621 24.3874 151.791 24.5341 150.876 24.5341ZM150.816 18.2401C151.522 18.2401 152.119 18.0785 152.606 17.7553C153.093 17.4322 153.464 16.9673 153.717 16.3608C153.971 15.7543 154.098 15.0284 154.098 14.1832C154.098 13.358 153.973 12.6296 153.725 11.9982C153.476 11.3668 153.108 10.8722 152.621 10.5142C152.134 10.1562 151.532 9.97727 150.816 9.97727C150.071 9.97727 149.449 10.1662 148.952 10.544C148.46 10.9219 148.089 11.429 147.841 12.0653C147.597 12.7017 147.475 13.4077 147.475 14.1832C147.475 14.9787 147.6 15.6822 147.848 16.2937C148.102 16.9002 148.475 17.3775 148.967 17.7255C149.464 18.0685 150.081 18.2401 150.816 18.2401ZM163.703 20.2386C162.629 20.2386 161.704 19.9851 160.929 19.478C160.153 18.9709 159.556 18.2724 159.139 17.3825C158.721 16.4925 158.512 15.4759 158.512 14.3324C158.512 13.169 158.726 12.1424 159.154 11.2525C159.586 10.3576 160.188 9.65909 160.958 9.15696C161.734 8.64986 162.639 8.39631 163.673 8.39631C164.478 8.39631 165.204 8.54545 165.85 8.84375C166.497 9.14205 167.026 9.55966 167.439 10.0966C167.851 10.6335 168.108 11.2599 168.207 11.9759H166.447C166.313 11.4538 166.014 10.9915 165.552 10.5888C165.095 10.1811 164.478 9.97727 163.703 9.97727C163.017 9.97727 162.415 10.1562 161.898 10.5142C161.386 10.8672 160.986 11.3668 160.697 12.0131C160.414 12.6545 160.272 13.4077 160.272 14.2727C160.272 15.1577 160.411 15.9283 160.69 16.5845C160.973 17.2408 161.371 17.7504 161.883 18.1133C162.4 18.4762 163.007 18.6577 163.703 18.6577C164.16 18.6577 164.575 18.5781 164.948 18.419C165.321 18.2599 165.637 18.0312 165.895 17.733C166.154 17.4347 166.338 17.0767 166.447 16.6591H168.207C168.108 17.3352 167.861 17.9442 167.469 18.4862C167.081 19.0231 166.566 19.4506 165.925 19.7688C165.289 20.082 164.548 20.2386 163.703 20.2386ZM175.105 20.2386C174.15 20.2386 173.308 19.9975 172.577 19.5153C171.846 19.0281 171.274 18.342 170.862 17.457C170.449 16.5671 170.243 15.5156 170.243 14.3026C170.243 13.0994 170.449 12.0554 170.862 11.1705C171.274 10.2855 171.849 9.60192 172.584 9.11967C173.32 8.63743 174.17 8.39631 175.135 8.39631C175.881 8.39631 176.47 8.5206 176.902 8.76918C177.34 9.01278 177.673 9.29119 177.902 9.6044C178.135 9.91264 178.317 10.1662 178.446 10.3651H178.595V4.72727H180.355V20H178.655V18.2401H178.446C178.317 18.4489 178.133 18.7124 177.894 19.0305C177.655 19.3437 177.315 19.6246 176.872 19.8732C176.43 20.1168 175.841 20.2386 175.105 20.2386ZM175.344 18.6577C176.05 18.6577 176.646 18.4737 177.133 18.1058C177.621 17.733 177.991 17.2184 178.245 16.5621C178.498 15.9009 178.625 15.1378 178.625 14.2727C178.625 13.4176 178.501 12.6694 178.252 12.0281C178.003 11.3817 177.636 10.8796 177.148 10.5217C176.661 10.1587 176.06 9.97727 175.344 9.97727C174.598 9.97727 173.976 10.1687 173.479 10.5515C172.987 10.9293 172.617 11.4439 172.368 12.0952C172.125 12.7415 172.003 13.4673 172.003 14.2727C172.003 15.0881 172.127 15.8288 172.376 16.495C172.629 17.1562 173.002 17.6832 173.494 18.076C173.991 18.4638 174.608 18.6577 175.344 18.6577ZM191.936 11.1108L190.355 11.5582C190.256 11.2947 190.109 11.0387 189.915 10.7901C189.726 10.5366 189.468 10.3278 189.14 10.1637C188.812 9.99964 188.392 9.91761 187.88 9.91761C187.179 9.91761 186.594 10.0792 186.127 10.4023C185.665 10.7205 185.434 11.1257 185.434 11.6179C185.434 12.0554 185.593 12.4009 185.911 12.6545C186.229 12.908 186.726 13.1193 187.402 13.2884L189.103 13.706C190.127 13.9545 190.89 14.3349 191.392 14.8469C191.894 15.354 192.145 16.0078 192.145 16.8082C192.145 17.4645 191.956 18.0511 191.578 18.5682C191.206 19.0852 190.684 19.4929 190.012 19.7912C189.341 20.0895 188.561 20.2386 187.671 20.2386C186.502 20.2386 185.535 19.9851 184.77 19.478C184.004 18.9709 183.519 18.2301 183.316 17.2557L184.986 16.8381C185.145 17.4545 185.446 17.9169 185.888 18.2251C186.336 18.5334 186.92 18.6875 187.641 18.6875C188.461 18.6875 189.112 18.5135 189.595 18.1655C190.082 17.8125 190.326 17.3899 190.326 16.8977C190.326 16.5 190.186 16.1669 189.908 15.8984C189.63 15.625 189.202 15.4212 188.625 15.2869L186.716 14.8395C185.667 14.5909 184.897 14.2056 184.404 13.6836C183.917 13.1566 183.674 12.4979 183.674 11.7074C183.674 11.0611 183.855 10.4893 184.218 9.99219C184.586 9.49503 185.085 9.10476 185.717 8.82138C186.353 8.538 187.074 8.39631 187.88 8.39631C189.013 8.39631 189.903 8.64489 190.549 9.14204C191.201 9.6392 191.663 10.2955 191.936 11.1108ZM201.357 12.6321V14.2727H194.675V12.6321H201.357ZM209.554 8.54545V10.0369H203.38V8.54545H209.554ZM205.229 20V6.96449C205.229 6.30824 205.383 5.76136 205.691 5.32386C206 4.88636 206.4 4.55824 206.892 4.33949C207.384 4.12074 207.904 4.01136 208.451 4.01136C208.883 4.01136 209.236 4.04616 209.51 4.11577C209.783 4.18537 209.987 4.25 210.121 4.30966L209.614 5.83097C209.525 5.80114 209.4 5.76385 209.241 5.7191C209.087 5.67436 208.883 5.65199 208.63 5.65199C208.048 5.65199 207.628 5.79865 207.369 6.09197C207.116 6.3853 206.989 6.81534 206.989 7.3821V20H205.229ZM216.203 20.2386C215.169 20.2386 214.261 19.9925 213.481 19.5004C212.705 19.0082 212.099 18.3196 211.661 17.4347C211.229 16.5497 211.012 15.5156 211.012 14.3324C211.012 13.1392 211.229 12.0977 211.661 11.2077C212.099 10.3178 212.705 9.62678 213.481 9.13459C214.261 8.6424 215.169 8.39631 216.203 8.39631C217.237 8.39631 218.142 8.6424 218.917 9.13459C219.698 9.62678 220.304 10.3178 220.737 11.2077C221.174 12.0977 221.393 13.1392 221.393 14.3324C221.393 15.5156 221.174 16.5497 220.737 17.4347C220.304 18.3196 219.698 19.0082 218.917 19.5004C218.142 19.9925 217.237 20.2386 216.203 20.2386ZM216.203 18.6577C216.988 18.6577 217.634 18.4563 218.142 18.0536C218.649 17.6509 219.024 17.1214 219.268 16.4652C219.511 15.8089 219.633 15.098 219.633 14.3324C219.633 13.5668 219.511 12.8533 219.268 12.1921C219.024 11.5309 218.649 10.9964 218.142 10.5888C217.634 10.1811 216.988 9.97727 216.203 9.97727C215.417 9.97727 214.771 10.1811 214.264 10.5888C213.757 10.9964 213.381 11.5309 213.138 12.1921C212.894 12.8533 212.772 13.5668 212.772 14.3324C212.772 15.098 212.894 15.8089 213.138 16.4652C213.381 17.1214 213.757 17.6509 214.264 18.0536C214.771 18.4563 215.417 18.6577 216.203 18.6577ZM225.839 13.1094V20H224.08V8.54545H225.78V10.3352H225.929C226.197 9.75355 226.605 9.28622 227.152 8.93324C227.699 8.57528 228.405 8.39631 229.27 8.39631C230.045 8.39631 230.724 8.5554 231.306 8.87358C231.887 9.18679 232.34 9.66406 232.663 10.3054C232.986 10.9418 233.148 11.7472 233.148 12.7216V20H231.388V12.8409C231.388 11.9411 231.154 11.2401 230.687 10.7379C230.219 10.2308 229.578 9.97727 228.763 9.97727C228.201 9.97727 227.699 10.0991 227.256 10.3427C226.819 10.5863 226.473 10.9418 226.22 11.4091C225.966 11.8764 225.839 12.4432 225.839 13.1094ZM241.345 8.54545V10.0369H235.409V8.54545H241.345ZM237.139 5.80114H238.899V16.7188C238.899 17.2159 238.971 17.5888 239.116 17.8374C239.265 18.081 239.454 18.245 239.682 18.3295C239.916 18.4091 240.162 18.4489 240.421 18.4489C240.614 18.4489 240.774 18.4389 240.898 18.419C241.022 18.3942 241.122 18.3743 241.196 18.3594L241.554 19.9403C241.435 19.9851 241.268 20.0298 241.054 20.0746C240.841 20.1243 240.57 20.1491 240.242 20.1491C239.744 20.1491 239.257 20.0423 238.78 19.8285C238.308 19.6147 237.915 19.2891 237.602 18.8516C237.293 18.4141 237.139 17.8622 237.139 17.196V5.80114ZM250.145 12.6321V14.2727H243.463V12.6321H250.145ZM261.355 11.1108L259.774 11.5582C259.675 11.2947 259.528 11.0387 259.334 10.7901C259.145 10.5366 258.887 10.3278 258.559 10.1637C258.231 9.99964 257.811 9.91761 257.298 9.91761C256.597 9.91761 256.013 10.0792 255.546 10.4023C255.084 10.7205 254.852 11.1257 254.852 11.6179C254.852 12.0554 255.012 12.4009 255.33 12.6545C255.648 12.908 256.145 13.1193 256.821 13.2884L258.521 13.706C259.546 13.9545 260.309 14.3349 260.811 14.8469C261.313 15.354 261.564 16.0078 261.564 16.8082C261.564 17.4645 261.375 18.0511 260.997 18.5682C260.624 19.0852 260.102 19.4929 259.431 19.7912C258.76 20.0895 257.98 20.2386 257.09 20.2386C255.921 20.2386 254.954 19.9851 254.189 19.478C253.423 18.9709 252.938 18.2301 252.735 17.2557L254.405 16.8381C254.564 17.4545 254.865 17.9169 255.307 18.2251C255.755 18.5334 256.339 18.6875 257.06 18.6875C257.88 18.6875 258.531 18.5135 259.014 18.1655C259.501 17.8125 259.744 17.3899 259.744 16.8977C259.744 16.5 259.605 16.1669 259.327 15.8984C259.048 15.625 258.621 15.4212 258.044 15.2869L256.135 14.8395C255.086 14.5909 254.316 14.2056 253.823 13.6836C253.336 13.1566 253.093 12.4979 253.093 11.7074C253.093 11.0611 253.274 10.4893 253.637 9.99219C254.005 9.49503 254.504 9.10476 255.136 8.82138C255.772 8.538 256.493 8.39631 257.298 8.39631C258.432 8.39631 259.322 8.64489 259.968 9.14204C260.619 9.6392 261.082 10.2955 261.355 11.1108ZM264.213 20V8.54545H265.973V20H264.213ZM265.108 6.63636C264.765 6.63636 264.469 6.51953 264.221 6.28587C263.977 6.0522 263.855 5.77131 263.855 5.44318C263.855 5.11506 263.977 4.83416 264.221 4.6005C264.469 4.36683 264.765 4.25 265.108 4.25C265.451 4.25 265.745 4.36683 265.988 4.6005C266.237 4.83416 266.361 5.11506 266.361 5.44318C266.361 5.77131 266.237 6.0522 265.988 6.28587C265.745 6.51953 265.451 6.63636 265.108 6.63636ZM268.869 20V18.6577L275.371 10.3054V10.1861H269.077V8.54545H277.638V9.94744L271.315 18.2401V18.3594H277.847V20H268.869ZM285.032 20.2386C283.929 20.2386 282.977 19.995 282.176 19.5078C281.381 19.0156 280.767 18.3295 280.334 17.4496C279.907 16.5646 279.693 15.5355 279.693 14.3622C279.693 13.1889 279.907 12.1548 280.334 11.2599C280.767 10.3601 281.368 9.65909 282.139 9.15696C282.915 8.64986 283.819 8.39631 284.854 8.39631C285.45 8.39631 286.039 8.49574 286.621 8.6946C287.203 8.89347 287.732 9.21662 288.209 9.66406C288.687 10.1065 289.067 10.6932 289.35 11.424C289.634 12.1548 289.775 13.0547 289.775 14.1236V14.8693H280.946V13.348H287.986C287.986 12.7017 287.856 12.125 287.598 11.6179C287.344 11.1108 286.981 10.7106 286.509 10.4173C286.042 10.1239 285.49 9.97727 284.854 9.97727C284.153 9.97727 283.546 10.1513 283.034 10.4993C282.527 10.8423 282.137 11.2898 281.863 11.8416C281.59 12.3935 281.453 12.9851 281.453 13.6165V14.6307C281.453 15.4957 281.602 16.229 281.9 16.8306C282.204 17.4272 282.624 17.8821 283.161 18.1953C283.698 18.5036 284.322 18.6577 285.032 18.6577C285.495 18.6577 285.912 18.593 286.285 18.4638C286.663 18.3295 286.989 18.1307 287.262 17.8672C287.536 17.5987 287.747 17.2656 287.896 16.8679L289.596 17.3452C289.417 17.9219 289.117 18.429 288.694 18.8665C288.271 19.299 287.749 19.6371 287.128 19.8807C286.507 20.1193 285.808 20.2386 285.032 20.2386ZM300.566 11.1108L298.985 11.5582C298.886 11.2947 298.739 11.0387 298.545 10.7901C298.356 10.5366 298.098 10.3278 297.77 10.1637C297.442 9.99964 297.021 9.91761 296.509 9.91761C295.808 9.91761 295.224 10.0792 294.757 10.4023C294.295 10.7205 294.063 11.1257 294.063 11.6179C294.063 12.0554 294.222 12.4009 294.541 12.6545C294.859 12.908 295.356 13.1193 296.032 13.2884L297.732 13.706C298.757 13.9545 299.52 14.3349 300.022 14.8469C300.524 15.354 300.775 16.0078 300.775 16.8082C300.775 17.4645 300.586 18.0511 300.208 18.5682C299.835 19.0852 299.313 19.4929 298.642 19.7912C297.971 20.0895 297.191 20.2386 296.301 20.2386C295.132 20.2386 294.165 19.9851 293.4 19.478C292.634 18.9709 292.149 18.2301 291.945 17.2557L293.616 16.8381C293.775 17.4545 294.076 17.9169 294.518 18.2251C294.966 18.5334 295.55 18.6875 296.271 18.6875C297.091 18.6875 297.742 18.5135 298.225 18.1655C298.712 17.8125 298.955 17.3899 298.955 16.8977C298.955 16.5 298.816 16.1669 298.538 15.8984C298.259 15.625 297.832 15.4212 297.255 15.2869L295.346 14.8395C294.297 14.5909 293.526 14.2056 293.034 13.6836C292.547 13.1566 292.303 12.4979 292.303 11.7074C292.303 11.0611 292.485 10.4893 292.848 9.99219C293.216 9.49503 293.715 9.10476 294.347 8.82138C294.983 8.538 295.704 8.39631 296.509 8.39631C297.643 8.39631 298.533 8.64489 299.179 9.14204C299.83 9.6392 300.293 10.2955 300.566 11.1108ZM309.987 12.6321V14.2727H303.305V12.6321H309.987ZM318.065 8.54545V10.0369H312.129V8.54545H318.065ZM313.859 5.80114H315.619V16.7188C315.619 17.2159 315.691 17.5888 315.835 17.8374C315.984 18.081 316.173 18.245 316.402 18.3295C316.636 18.4091 316.882 18.4489 317.14 18.4489C317.334 18.4489 317.493 18.4389 317.618 18.419C317.742 18.3942 317.841 18.3743 317.916 18.3594L318.274 19.9403C318.154 19.9851 317.988 20.0298 317.774 20.0746C317.56 20.1243 317.289 20.1491 316.961 20.1491C316.464 20.1491 315.977 20.0423 315.5 19.8285C315.027 19.6147 314.635 19.2891 314.321 18.8516C314.013 18.4141 313.859 17.8622 313.859 17.196V5.80114ZM325.392 20.2386C324.288 20.2386 323.336 19.995 322.536 19.5078C321.74 19.0156 321.126 18.3295 320.694 17.4496C320.266 16.5646 320.052 15.5355 320.052 14.3622C320.052 13.1889 320.266 12.1548 320.694 11.2599C321.126 10.3601 321.728 9.65909 322.498 9.15696C323.274 8.64986 324.179 8.39631 325.213 8.39631C325.809 8.39631 326.399 8.49574 326.98 8.6946C327.562 8.89347 328.091 9.21662 328.569 9.66406C329.046 10.1065 329.426 10.6932 329.71 11.424C329.993 12.1548 330.135 13.0547 330.135 14.1236V14.8693H321.305V13.348H328.345C328.345 12.7017 328.216 12.125 327.957 11.6179C327.704 11.1108 327.341 10.7106 326.868 10.4173C326.401 10.1239 325.849 9.97727 325.213 9.97727C324.512 9.97727 323.905 10.1513 323.393 10.4993C322.886 10.8423 322.496 11.2898 322.222 11.8416C321.949 12.3935 321.812 12.9851 321.812 13.6165V14.6307C321.812 15.4957 321.961 16.229 322.26 16.8306C322.563 17.4272 322.983 17.8821 323.52 18.1953C324.057 18.5036 324.681 18.6577 325.392 18.6577C325.854 18.6577 326.272 18.593 326.645 18.4638C327.023 18.3295 327.348 18.1307 327.622 17.8672C327.895 17.5987 328.106 17.2656 328.256 16.8679L329.956 17.3452C329.777 17.9219 329.476 18.429 329.053 18.8665C328.631 19.299 328.109 19.6371 327.487 19.8807C326.866 20.1193 326.167 20.2386 325.392 20.2386ZM333.817 8.54545L336.561 13.2287L339.305 8.54545H341.334L337.635 14.2727L341.334 20H339.305L336.561 15.5554L333.817 20H331.788L335.428 14.2727L331.788 8.54545H333.817ZM348.827 8.54545V10.0369H342.891V8.54545H348.827ZM344.621 5.80114H346.381V16.7188C346.381 17.2159 346.453 17.5888 346.597 17.8374C346.746 18.081 346.935 18.245 347.164 18.3295C347.397 18.4091 347.643 18.4489 347.902 18.4489C348.096 18.4489 348.255 18.4389 348.379 18.419C348.504 18.3942 348.603 18.3743 348.678 18.3594L349.036 19.9403C348.916 19.9851 348.75 20.0298 348.536 20.0746C348.322 20.1243 348.051 20.1491 347.723 20.1491C347.226 20.1491 346.739 20.0423 346.261 19.8285C345.789 19.6147 345.396 19.2891 345.083 18.8516C344.775 18.4141 344.621 17.8622 344.621 17.196V5.80114Z" fill="black"/>
+<path d="M6.74148 105.209C5.7571 105.209 4.87962 105.04 4.10902 104.702C3.3434 104.364 2.73438 103.894 2.28196 103.292C1.83452 102.686 1.59091 101.982 1.55114 101.182H3.4304C3.47017 101.674 3.6392 102.099 3.9375 102.457C4.2358 102.81 4.62607 103.083 5.10831 103.277C5.59055 103.471 6.125 103.568 6.71165 103.568C7.3679 103.568 7.94957 103.454 8.45668 103.225C8.96378 102.996 9.36151 102.678 9.64986 102.271C9.93821 101.863 10.0824 101.391 10.0824 100.854C10.0824 100.292 9.94318 99.7972 9.66477 99.3697C9.38636 98.9371 8.97869 98.5991 8.44176 98.3555C7.90483 98.1119 7.24858 97.9901 6.47301 97.9901H5.25V96.3494H6.47301C7.07955 96.3494 7.61151 96.2401 8.06889 96.0213C8.53125 95.8026 8.89169 95.4943 9.15021 95.0966C9.41371 94.6989 9.54545 94.2315 9.54545 93.6946C9.54545 93.1776 9.43111 92.7276 9.20242 92.3448C8.97372 91.962 8.65057 91.6637 8.23295 91.4499C7.82031 91.2362 7.3331 91.1293 6.77131 91.1293C6.24432 91.1293 5.74716 91.2262 5.27983 91.4201C4.81747 91.609 4.43963 91.8849 4.14631 92.2479C3.85298 92.6058 3.69389 93.0384 3.66903 93.5455H1.87926C1.90909 92.745 2.15021 92.044 2.60263 91.4425C3.05504 90.8359 3.64666 90.3636 4.37749 90.0256C5.11328 89.6875 5.92117 89.5185 6.80114 89.5185C7.74574 89.5185 8.55611 89.7099 9.23224 90.0927C9.90838 90.4705 10.4279 90.9702 10.7908 91.5916C11.1538 92.2131 11.3352 92.8842 11.3352 93.6051C11.3352 94.4652 11.109 95.1985 10.6566 95.805C10.2092 96.4116 9.60014 96.8317 8.82955 97.0653V97.1847C9.79403 97.3437 10.5472 97.7539 11.0891 98.4151C11.631 99.0714 11.902 99.8842 11.902 100.854C11.902 101.684 11.6758 102.43 11.2234 103.091C10.7759 103.747 10.1644 104.264 9.38885 104.642C8.61328 105.02 7.73082 105.209 6.74148 105.209ZM14.9819 105V93.5455H16.6822V95.2756H16.8015C17.0103 94.7088 17.3881 94.2489 17.935 93.896C18.4819 93.543 19.0984 93.3665 19.7844 93.3665C19.9137 93.3665 20.0753 93.369 20.2692 93.3739C20.4631 93.3789 20.6097 93.3864 20.7092 93.3963V95.1861C20.6495 95.1712 20.5128 95.1488 20.299 95.119C20.0902 95.0842 19.869 95.0668 19.6353 95.0668C19.0785 95.0668 18.5813 95.1836 18.1438 95.4173C17.7113 95.646 17.3683 95.9641 17.1147 96.3718C16.8661 96.7745 16.7418 97.2344 16.7418 97.7514V105H14.9819ZM27.2493 105.239C26.1456 105.239 25.1935 104.995 24.3931 104.508C23.5977 104.016 22.9837 103.33 22.5511 102.45C22.1236 101.565 21.9098 100.536 21.9098 99.3622C21.9098 98.1889 22.1236 97.1548 22.5511 96.2599C22.9837 95.3601 23.5852 94.6591 24.3558 94.157C25.1314 93.6499 26.0362 93.3963 27.0703 93.3963C27.6669 93.3963 28.256 93.4957 28.8377 93.6946C29.4194 93.8935 29.9489 94.2166 30.4261 94.6641C30.9034 95.1065 31.2837 95.6932 31.5671 96.424C31.8505 97.1548 31.9922 98.0547 31.9922 99.1236V99.8693H23.1626V98.348H30.2024C30.2024 97.7017 30.0732 97.125 29.8146 96.6179C29.5611 96.1108 29.1982 95.7106 28.7259 95.4173C28.2585 95.1239 27.7067 94.9773 27.0703 94.9773C26.3693 94.9773 25.7628 95.1513 25.2507 95.4993C24.7436 95.8423 24.3533 96.2898 24.0799 96.8416C23.8065 97.3935 23.6697 97.9851 23.6697 98.6165V99.6307C23.6697 100.496 23.8189 101.229 24.1172 101.831C24.4205 102.427 24.8406 102.882 25.3775 103.195C25.9144 103.504 26.5384 103.658 27.2493 103.658C27.7116 103.658 28.1293 103.593 28.5021 103.464C28.88 103.33 29.2056 103.131 29.479 102.867C29.7525 102.599 29.9638 102.266 30.1129 101.868L31.8132 102.345C31.6342 102.922 31.3335 103.429 30.9109 103.866C30.4883 104.299 29.9663 104.637 29.3448 104.881C28.7234 105.119 28.0249 105.239 27.2493 105.239ZM34.6694 105V93.5455H36.3697V95.3352H36.5188C36.7575 94.7237 37.1428 94.2489 37.6747 93.9109C38.2067 93.5678 38.8455 93.3963 39.5913 93.3963C40.3469 93.3963 40.9759 93.5678 41.478 93.9109C41.9851 94.2489 42.3803 94.7237 42.6637 95.3352H42.783C43.0763 94.7436 43.5163 94.2738 44.103 93.9258C44.6896 93.5728 45.3931 93.3963 46.2134 93.3963C47.2376 93.3963 48.0753 93.717 48.7266 94.3583C49.3778 94.9947 49.7035 95.9865 49.7035 97.3338V105H47.9435V97.3338C47.9435 96.4886 47.7124 95.8846 47.25 95.5217C46.7876 95.1587 46.2433 94.9773 45.6168 94.9773C44.8114 94.9773 44.1875 95.2209 43.745 95.7081C43.3026 96.1903 43.0813 96.8018 43.0813 97.5426V105H41.2915V97.1548C41.2915 96.5036 41.0803 95.979 40.6577 95.5813C40.2351 95.1786 39.6907 94.9773 39.0245 94.9773C38.5671 94.9773 38.1396 95.0991 37.7418 95.3427C37.3491 95.5863 37.0309 95.9244 36.7873 96.3569C36.5487 96.7844 36.4293 97.2791 36.4293 97.8409V105H34.6694ZM106.734 97.6321V99.2727H100.052V97.6321H106.734ZM116.393 97.6321V99.2727H109.711V97.6321H116.393ZM124.113 109.534C123.263 109.534 122.532 109.425 121.921 109.206C121.309 108.992 120.8 108.709 120.392 108.356C119.989 108.008 119.669 107.635 119.43 107.237L120.832 106.253C120.991 106.462 121.192 106.7 121.436 106.969C121.68 107.242 122.013 107.478 122.435 107.677C122.863 107.881 123.422 107.983 124.113 107.983C125.038 107.983 125.801 107.759 126.403 107.312C127.004 106.864 127.305 106.163 127.305 105.209V102.882H127.156C127.027 103.091 126.843 103.349 126.604 103.658C126.37 103.961 126.032 104.232 125.59 104.471C125.152 104.704 124.561 104.821 123.815 104.821C122.89 104.821 122.06 104.602 121.324 104.165C120.593 103.727 120.014 103.091 119.587 102.256C119.164 101.42 118.953 100.406 118.953 99.2131C118.953 98.0398 119.159 97.0181 119.572 96.1481C119.984 95.2731 120.559 94.5969 121.294 94.1197C122.03 93.6374 122.88 93.3963 123.845 93.3963C124.591 93.3963 125.182 93.5206 125.62 93.7692C126.062 94.0128 126.4 94.2912 126.634 94.6044C126.873 94.9126 127.056 95.1662 127.186 95.3651H127.365V93.5455H129.065V105.328C129.065 106.312 128.841 107.113 128.394 107.729C127.951 108.351 127.355 108.806 126.604 109.094C125.858 109.387 125.028 109.534 124.113 109.534ZM124.054 103.24C124.76 103.24 125.356 103.078 125.843 102.755C126.331 102.432 126.701 101.967 126.955 101.361C127.208 100.754 127.335 100.028 127.335 99.1832C127.335 98.358 127.211 97.6296 126.962 96.9982C126.713 96.3668 126.346 95.8722 125.858 95.5142C125.371 95.1562 124.77 94.9773 124.054 94.9773C123.308 94.9773 122.686 95.1662 122.189 95.544C121.697 95.9219 121.327 96.429 121.078 97.0653C120.835 97.7017 120.713 98.4077 120.713 99.1832C120.713 99.9787 120.837 100.682 121.086 101.294C121.339 101.9 121.712 102.377 122.204 102.725C122.701 103.069 123.318 103.24 124.054 103.24ZM136.94 105.239C135.866 105.239 134.941 104.985 134.166 104.478C133.39 103.971 132.794 103.272 132.376 102.382C131.958 101.493 131.75 100.476 131.75 99.3324C131.75 98.169 131.963 97.1424 132.391 96.2525C132.824 95.3576 133.425 94.6591 134.196 94.157C134.971 93.6499 135.876 93.3963 136.91 93.3963C137.716 93.3963 138.441 93.5455 139.088 93.8438C139.734 94.142 140.263 94.5597 140.676 95.0966C141.089 95.6335 141.345 96.2599 141.444 96.9759H139.684C139.55 96.4538 139.252 95.9915 138.789 95.5888C138.332 95.1811 137.716 94.9773 136.94 94.9773C136.254 94.9773 135.652 95.1562 135.135 95.5142C134.623 95.8672 134.223 96.3668 133.935 97.0131C133.651 97.6545 133.51 98.4077 133.51 99.2727C133.51 100.158 133.649 100.928 133.927 101.585C134.211 102.241 134.608 102.75 135.12 103.113C135.637 103.476 136.244 103.658 136.94 103.658C137.397 103.658 137.812 103.578 138.185 103.419C138.558 103.26 138.874 103.031 139.132 102.733C139.391 102.435 139.575 102.077 139.684 101.659H141.444C141.345 102.335 141.099 102.944 140.706 103.486C140.318 104.023 139.804 104.451 139.162 104.769C138.526 105.082 137.785 105.239 136.94 105.239ZM148.342 105.239C147.388 105.239 146.545 104.998 145.814 104.515C145.083 104.028 144.512 103.342 144.099 102.457C143.686 101.567 143.48 100.516 143.48 99.3026C143.48 98.0994 143.686 97.0554 144.099 96.1705C144.512 95.2855 145.086 94.6019 145.822 94.1197C146.558 93.6374 147.408 93.3963 148.372 93.3963C149.118 93.3963 149.707 93.5206 150.14 93.7692C150.577 94.0128 150.91 94.2912 151.139 94.6044C151.373 94.9126 151.554 95.1662 151.683 95.3651H151.832V89.7273H153.592V105H151.892V103.24H151.683C151.554 103.449 151.37 103.712 151.131 104.031C150.893 104.344 150.552 104.625 150.11 104.873C149.667 105.117 149.078 105.239 148.342 105.239ZM148.581 103.658C149.287 103.658 149.884 103.474 150.371 103.106C150.858 102.733 151.228 102.218 151.482 101.562C151.735 100.901 151.862 100.138 151.862 99.2727C151.862 98.4176 151.738 97.6694 151.489 97.0281C151.241 96.3817 150.873 95.8796 150.386 95.5217C149.898 95.1587 149.297 94.9773 148.581 94.9773C147.835 94.9773 147.214 95.1687 146.717 95.5515C146.224 95.9293 145.854 96.4439 145.605 97.0952C145.362 97.7415 145.24 98.4673 145.24 99.2727C145.24 100.088 145.364 100.829 145.613 101.495C145.866 102.156 146.239 102.683 146.732 103.076C147.229 103.464 147.845 103.658 148.581 103.658ZM165.174 96.1108L163.593 96.5582C163.493 96.2947 163.347 96.0387 163.153 95.7901C162.964 95.5366 162.705 95.3278 162.377 95.1637C162.049 94.9996 161.629 94.9176 161.117 94.9176C160.416 94.9176 159.832 95.0792 159.364 95.4023C158.902 95.7205 158.671 96.1257 158.671 96.6179C158.671 97.0554 158.83 97.4009 159.148 97.6545C159.466 97.908 159.963 98.1193 160.64 98.2884L162.34 98.706C163.364 98.9545 164.127 99.3349 164.629 99.8469C165.131 100.354 165.382 101.008 165.382 101.808C165.382 102.464 165.194 103.051 164.816 103.568C164.443 104.085 163.921 104.493 163.25 104.791C162.578 105.089 161.798 105.239 160.908 105.239C159.74 105.239 158.773 104.985 158.007 104.478C157.241 103.971 156.757 103.23 156.553 102.256L158.223 101.838C158.382 102.455 158.683 102.917 159.126 103.225C159.573 103.533 160.157 103.688 160.878 103.688C161.699 103.688 162.35 103.513 162.832 103.165C163.319 102.812 163.563 102.39 163.563 101.898C163.563 101.5 163.424 101.167 163.145 100.898C162.867 100.625 162.439 100.421 161.863 100.287L159.953 99.8395C158.904 99.5909 158.134 99.2056 157.642 98.6836C157.154 98.1566 156.911 97.4979 156.911 96.7074C156.911 96.0611 157.092 95.4893 157.455 94.9922C157.823 94.495 158.323 94.1048 158.954 93.8214C159.591 93.538 160.311 93.3963 161.117 93.3963C162.25 93.3963 163.14 93.6449 163.787 94.142C164.438 94.6392 164.9 95.2955 165.174 96.1108ZM174.594 97.6321V99.2727H167.912V97.6321H174.594ZM185.805 96.1108L184.224 96.5582C184.124 96.2947 183.977 96.0387 183.784 95.7901C183.595 95.5366 183.336 95.3278 183.008 95.1637C182.68 94.9996 182.26 94.9176 181.748 94.9176C181.047 94.9176 180.463 95.0792 179.995 95.4023C179.533 95.7205 179.302 96.1257 179.302 96.6179C179.302 97.0554 179.461 97.4009 179.779 97.6545C180.097 97.908 180.594 98.1193 181.27 98.2884L182.971 98.706C183.995 98.9545 184.758 99.3349 185.26 99.8469C185.762 100.354 186.013 101.008 186.013 101.808C186.013 102.464 185.824 103.051 185.447 103.568C185.074 104.085 184.552 104.493 183.881 104.791C183.209 105.089 182.429 105.239 181.539 105.239C180.371 105.239 179.404 104.985 178.638 104.478C177.872 103.971 177.388 103.23 177.184 102.256L178.854 101.838C179.013 102.455 179.314 102.917 179.757 103.225C180.204 103.533 180.788 103.688 181.509 103.688C182.329 103.688 182.981 103.513 183.463 103.165C183.95 102.812 184.194 102.39 184.194 101.898C184.194 101.5 184.055 101.167 183.776 100.898C183.498 100.625 183.07 100.421 182.493 100.287L180.584 99.8395C179.535 99.5909 178.765 99.2056 178.273 98.6836C177.785 98.1566 177.542 97.4979 177.542 96.7074C177.542 96.0611 177.723 95.4893 178.086 94.9922C178.454 94.495 178.954 94.1048 179.585 93.8214C180.221 93.538 180.942 93.3963 181.748 93.3963C182.881 93.3963 183.771 93.6449 184.417 94.142C185.069 94.6392 185.531 95.2955 185.805 96.1108ZM188.663 109.295V93.5455H190.363V95.3651H190.572C190.701 95.1662 190.88 94.9126 191.109 94.6044C191.342 94.2912 191.675 94.0128 192.108 93.7692C192.545 93.5206 193.137 93.3963 193.883 93.3963C194.847 93.3963 195.697 93.6374 196.433 94.1197C197.169 94.6019 197.743 95.2855 198.156 96.1705C198.568 97.0554 198.775 98.0994 198.775 99.3026C198.775 100.516 198.568 101.567 198.156 102.457C197.743 103.342 197.171 104.028 196.441 104.515C195.71 104.998 194.867 105.239 193.913 105.239C193.177 105.239 192.588 105.117 192.145 104.873C191.703 104.625 191.362 104.344 191.123 104.031C190.885 103.712 190.701 103.449 190.572 103.24H190.422V109.295H188.663ZM190.393 99.2727C190.393 100.138 190.519 100.901 190.773 101.562C191.027 102.218 191.397 102.733 191.884 103.106C192.371 103.474 192.968 103.658 193.674 103.658C194.41 103.658 195.024 103.464 195.516 103.076C196.013 102.683 196.386 102.156 196.634 101.495C196.888 100.829 197.015 100.088 197.015 99.2727C197.015 98.4673 196.891 97.7415 196.642 97.0952C196.398 96.4439 196.028 95.9293 195.531 95.5515C195.039 95.1687 194.42 94.9773 193.674 94.9773C192.958 94.9773 192.356 95.1587 191.869 95.5217C191.382 95.8796 191.014 96.3817 190.766 97.0281C190.517 97.6694 190.393 98.4176 190.393 99.2727ZM204.83 105.268C204.104 105.268 203.446 105.132 202.854 104.858C202.262 104.58 201.793 104.18 201.445 103.658C201.097 103.131 200.922 102.494 200.922 101.749C200.922 101.092 201.052 100.56 201.31 100.153C201.569 99.7401 201.914 99.4169 202.347 99.1832C202.779 98.9496 203.257 98.7756 203.779 98.6612C204.306 98.5419 204.835 98.4474 205.367 98.3778C206.063 98.2884 206.627 98.2212 207.06 98.1765C207.497 98.1268 207.816 98.0447 208.014 97.9304C208.218 97.8161 208.32 97.6172 208.32 97.3338V97.2741C208.32 96.5384 208.119 95.9666 207.716 95.5589C207.318 95.1513 206.714 94.9474 205.904 94.9474C205.064 94.9474 204.405 95.1314 203.928 95.4993C203.451 95.8672 203.115 96.2599 202.921 96.6776L201.251 96.081C201.549 95.3849 201.947 94.843 202.444 94.4553C202.946 94.0625 203.493 93.7891 204.084 93.6349C204.681 93.4759 205.268 93.3963 205.844 93.3963C206.212 93.3963 206.635 93.4411 207.112 93.5305C207.594 93.6151 208.059 93.7915 208.507 94.06C208.959 94.3285 209.334 94.7337 209.633 95.2756C209.931 95.8175 210.08 96.5433 210.08 97.4531V105H208.32V103.449H208.231C208.111 103.697 207.913 103.963 207.634 104.247C207.356 104.53 206.985 104.771 206.523 104.97C206.061 105.169 205.496 105.268 204.83 105.268ZM205.099 103.688C205.795 103.688 206.381 103.551 206.859 103.277C207.341 103.004 207.704 102.651 207.947 102.218C208.196 101.786 208.32 101.331 208.32 100.854V99.2429C208.246 99.3324 208.082 99.4144 207.828 99.489C207.579 99.5586 207.291 99.6207 206.963 99.6754C206.64 99.7251 206.324 99.7699 206.016 99.8097C205.713 99.8445 205.467 99.8743 205.278 99.8991C204.82 99.9588 204.393 100.056 203.995 100.19C203.602 100.319 203.284 100.516 203.04 100.779C202.802 101.038 202.682 101.391 202.682 101.838C202.682 102.45 202.909 102.912 203.361 103.225C203.818 103.533 204.398 103.688 205.099 103.688ZM217.946 105.239C216.872 105.239 215.947 104.985 215.172 104.478C214.396 103.971 213.8 103.272 213.382 102.382C212.964 101.493 212.756 100.476 212.756 99.3324C212.756 98.169 212.969 97.1424 213.397 96.2525C213.829 95.3576 214.431 94.6591 215.202 94.157C215.977 93.6499 216.882 93.3963 217.916 93.3963C218.721 93.3963 219.447 93.5455 220.094 93.8438C220.74 94.142 221.269 94.5597 221.682 95.0966C222.095 95.6335 222.351 96.2599 222.45 96.9759H220.69C220.556 96.4538 220.258 95.9915 219.795 95.5888C219.338 95.1811 218.721 94.9773 217.946 94.9773C217.26 94.9773 216.658 95.1562 216.141 95.5142C215.629 95.8672 215.229 96.3668 214.941 97.0131C214.657 97.6545 214.515 98.4077 214.515 99.2727C214.515 100.158 214.655 100.928 214.933 101.585C215.216 102.241 215.614 102.75 216.126 103.113C216.643 103.476 217.25 103.658 217.946 103.658C218.403 103.658 218.818 103.578 219.191 103.419C219.564 103.26 219.88 103.031 220.138 102.733C220.397 102.435 220.581 102.077 220.69 101.659H222.45C222.351 102.335 222.105 102.944 221.712 103.486C221.324 104.023 220.809 104.451 220.168 104.769C219.532 105.082 218.791 105.239 217.946 105.239ZM225.023 105V93.5455H226.783V105H225.023ZM225.918 91.6364C225.575 91.6364 225.279 91.5195 225.03 91.2859C224.787 91.0522 224.665 90.7713 224.665 90.4432C224.665 90.1151 224.787 89.8342 225.03 89.6005C225.279 89.3668 225.575 89.25 225.918 89.25C226.261 89.25 226.554 89.3668 226.798 89.6005C227.046 89.8342 227.171 90.1151 227.171 90.4432C227.171 90.7713 227.046 91.0522 226.798 91.2859C226.554 91.5195 226.261 91.6364 225.918 91.6364ZM231.766 98.1094V105H230.006V93.5455H231.707V95.3352H231.856C232.124 94.7536 232.532 94.2862 233.079 93.9332C233.626 93.5753 234.332 93.3963 235.197 93.3963C235.972 93.3963 236.651 93.5554 237.233 93.8736C237.814 94.1868 238.267 94.6641 238.59 95.3054C238.913 95.9418 239.074 96.7472 239.074 97.7216V105H237.315V97.8409C237.315 96.9411 237.081 96.2401 236.614 95.7379C236.146 95.2308 235.505 94.9773 234.69 94.9773C234.128 94.9773 233.626 95.0991 233.183 95.3427C232.746 95.5863 232.4 95.9418 232.147 96.4091C231.893 96.8764 231.766 97.4432 231.766 98.1094ZM246.914 109.534C246.064 109.534 245.333 109.425 244.722 109.206C244.11 108.992 243.6 108.709 243.193 108.356C242.79 108.008 242.469 107.635 242.231 107.237L243.633 106.253C243.792 106.462 243.993 106.7 244.237 106.969C244.48 107.242 244.814 107.478 245.236 107.677C245.664 107.881 246.223 107.983 246.914 107.983C247.839 107.983 248.602 107.759 249.203 107.312C249.805 106.864 250.106 106.163 250.106 105.209V102.882H249.957C249.827 103.091 249.643 103.349 249.405 103.658C249.171 103.961 248.833 104.232 248.391 104.471C247.953 104.704 247.362 104.821 246.616 104.821C245.691 104.821 244.861 104.602 244.125 104.165C243.394 103.727 242.815 103.091 242.387 102.256C241.965 101.42 241.754 100.406 241.754 99.2131C241.754 98.0398 241.96 97.0181 242.373 96.1481C242.785 95.2731 243.359 94.5969 244.095 94.1197C244.831 93.6374 245.681 93.3963 246.646 93.3963C247.391 93.3963 247.983 93.5206 248.42 93.7692C248.863 94.0128 249.201 94.2912 249.435 94.6044C249.673 94.9126 249.857 95.1662 249.987 95.3651H250.165V93.5455H251.866V105.328C251.866 106.312 251.642 107.113 251.195 107.729C250.752 108.351 250.156 108.806 249.405 109.094C248.659 109.387 247.829 109.534 246.914 109.534ZM246.854 103.24C247.56 103.24 248.157 103.078 248.644 102.755C249.131 102.432 249.502 101.967 249.755 101.361C250.009 100.754 250.136 100.028 250.136 99.1832C250.136 98.358 250.011 97.6296 249.763 96.9982C249.514 96.3668 249.146 95.8722 248.659 95.5142C248.172 95.1562 247.57 94.9773 246.854 94.9773C246.109 94.9773 245.487 95.1662 244.99 95.544C244.498 95.9219 244.127 96.429 243.879 97.0653C243.635 97.7017 243.513 98.4077 243.513 99.1832C243.513 99.9787 243.638 100.682 243.886 101.294C244.14 101.9 244.513 102.377 245.005 102.725C245.502 103.069 246.119 103.24 246.854 103.24ZM261.65 97.6321V99.2727H254.968V97.6321H261.65ZM269.788 105.209C269.161 105.199 268.535 105.08 267.908 104.851C267.282 104.622 266.71 104.237 266.193 103.695C265.676 103.148 265.261 102.41 264.948 101.48C264.635 100.545 264.478 99.3722 264.478 97.9602C264.478 96.608 264.605 95.4098 264.858 94.3658C265.112 93.3168 265.48 92.4343 265.962 91.7184C266.444 90.9975 267.026 90.4506 267.707 90.0778C268.393 89.7049 269.166 89.5185 270.026 89.5185C270.881 89.5185 271.642 89.69 272.308 90.033C272.979 90.3711 273.526 90.8434 273.949 91.4499C274.372 92.0565 274.645 92.755 274.769 93.5455H272.95C272.781 92.8594 272.453 92.2901 271.965 91.8377C271.478 91.3853 270.832 91.1591 270.026 91.1591C268.843 91.1591 267.911 91.6737 267.23 92.7028C266.554 93.7319 266.213 95.1761 266.208 97.0355H266.328C266.606 96.6129 266.937 96.2525 267.319 95.9542C267.707 95.6509 268.135 95.4173 268.602 95.2532C269.069 95.0891 269.564 95.0071 270.086 95.0071C270.961 95.0071 271.761 95.2259 272.487 95.6634C273.213 96.0959 273.795 96.695 274.232 97.4606C274.67 98.2212 274.889 99.0938 274.889 100.078C274.889 101.023 274.677 101.888 274.255 102.673C273.832 103.454 273.238 104.075 272.472 104.538C271.712 104.995 270.817 105.219 269.788 105.209ZM269.788 103.568C270.414 103.568 270.976 103.412 271.473 103.098C271.975 102.785 272.37 102.365 272.659 101.838C272.952 101.311 273.099 100.724 273.099 100.078C273.099 99.4467 272.957 98.8725 272.674 98.3555C272.395 97.8335 272.01 97.4183 271.518 97.1101C271.031 96.8018 270.474 96.6477 269.847 96.6477C269.375 96.6477 268.935 96.7422 268.527 96.9311C268.12 97.1151 267.762 97.3686 267.454 97.6918C267.15 98.0149 266.912 98.3853 266.738 98.8029C266.564 99.2156 266.477 99.6506 266.477 100.108C266.477 100.714 266.618 101.281 266.902 101.808C267.19 102.335 267.583 102.76 268.08 103.083C268.582 103.407 269.151 103.568 269.788 103.568ZM282.803 105.209C281.679 105.209 280.722 104.903 279.932 104.292C279.141 103.675 278.537 102.783 278.119 101.614C277.702 100.441 277.493 99.0241 277.493 97.3636C277.493 95.7131 277.702 94.3036 278.119 93.1353C278.542 91.962 279.149 91.0671 279.939 90.4506C280.735 89.8292 281.689 89.5185 282.803 89.5185C283.916 89.5185 284.868 89.8292 285.659 90.4506C286.454 91.0671 287.061 91.962 287.479 93.1353C287.901 94.3036 288.112 95.7131 288.112 97.3636C288.112 99.0241 287.904 100.441 287.486 101.614C287.068 102.783 286.464 103.675 285.674 104.292C284.883 104.903 283.926 105.209 282.803 105.209ZM282.803 103.568C283.916 103.568 284.781 103.031 285.398 101.957C286.014 100.884 286.323 99.3523 286.323 97.3636C286.323 96.0412 286.181 94.9151 285.898 93.9854C285.619 93.0558 285.216 92.3473 284.689 91.8601C284.167 91.3729 283.539 91.1293 282.803 91.1293C281.699 91.1293 280.836 91.6737 280.215 92.7624C279.594 93.8462 279.283 95.38 279.283 97.3636C279.283 98.6861 279.422 99.8097 279.7 100.734C279.979 101.659 280.379 102.363 280.901 102.845C281.428 103.327 282.062 103.568 282.803 103.568ZM295.928 105.209C294.804 105.209 293.847 104.903 293.057 104.292C292.266 103.675 291.662 102.783 291.244 101.614C290.827 100.441 290.618 99.0241 290.618 97.3636C290.618 95.7131 290.827 94.3036 291.244 93.1353C291.667 91.962 292.274 91.0671 293.064 90.4506C293.86 89.8292 294.814 89.5185 295.928 89.5185C297.041 89.5185 297.993 89.8292 298.784 90.4506C299.579 91.0671 300.186 91.962 300.604 93.1353C301.026 94.3036 301.237 95.7131 301.237 97.3636C301.237 99.0241 301.029 100.441 300.611 101.614C300.193 102.783 299.589 103.675 298.799 104.292C298.008 104.903 297.051 105.209 295.928 105.209ZM295.928 103.568C297.041 103.568 297.906 103.031 298.523 101.957C299.139 100.884 299.448 99.3523 299.448 97.3636C299.448 96.0412 299.306 94.9151 299.023 93.9854C298.744 93.0558 298.341 92.3473 297.814 91.8601C297.292 91.3729 296.664 91.1293 295.928 91.1293C294.824 91.1293 293.961 91.6737 293.34 92.7624C292.719 93.8462 292.408 95.38 292.408 97.3636C292.408 98.6861 292.547 99.8097 292.825 100.734C293.104 101.659 293.504 102.363 294.026 102.845C294.553 103.327 295.187 103.568 295.928 103.568Z" fill="black"/>
+<path d="M7.30824 188L9.81392 172.727H11.3054L8.79972 188H7.30824ZM0.357955 183.764L0.596591 182.273H11.9915L11.7528 183.764H0.357955ZM1.93892 188L4.4446 172.727H5.93608L3.4304 188H1.93892ZM1.25284 178.455L1.49148 176.963H12.8864L12.6477 178.455H1.25284ZM19.9895 188.209C19.0051 188.209 18.1277 188.04 17.3571 187.702C16.5914 187.364 15.9824 186.894 15.53 186.292C15.0826 185.686 14.839 184.982 14.7992 184.182H16.6784C16.7182 184.674 16.8873 185.099 17.1855 185.457C17.4838 185.81 17.8741 186.083 18.3564 186.277C18.8386 186.471 19.373 186.568 19.9597 186.568C20.6159 186.568 21.1976 186.454 21.7047 186.225C22.2118 185.996 22.6096 185.678 22.8979 185.271C23.1863 184.863 23.3304 184.391 23.3304 183.854C23.3304 183.292 23.1912 182.797 22.9128 182.37C22.6344 181.937 22.2267 181.599 21.6898 181.355C21.1529 181.112 20.4966 180.99 19.7211 180.99H18.498V179.349H19.7211C20.3276 179.349 20.8596 179.24 21.3169 179.021C21.7793 178.803 22.1397 178.494 22.3983 178.097C22.6618 177.699 22.7935 177.232 22.7935 176.695C22.7935 176.178 22.6792 175.728 22.4505 175.345C22.2218 174.962 21.8986 174.664 21.481 174.45C21.0684 174.236 20.5811 174.129 20.0194 174.129C19.4924 174.129 18.9952 174.226 18.5279 174.42C18.0655 174.609 17.6877 174.885 17.3944 175.248C17.101 175.606 16.9419 176.038 16.9171 176.545H15.1273C15.1571 175.745 15.3983 175.044 15.8507 174.442C16.3031 173.836 16.8947 173.364 17.6255 173.026C18.3613 172.687 19.1692 172.518 20.0492 172.518C20.9938 172.518 21.8042 172.71 22.4803 173.093C23.1564 173.471 23.676 173.97 24.0389 174.592C24.4018 175.213 24.5833 175.884 24.5833 176.605C24.5833 177.465 24.3571 178.199 23.9047 178.805C23.4572 179.412 22.8482 179.832 22.0776 180.065V180.185C23.0421 180.344 23.7953 180.754 24.3372 181.415C24.8791 182.071 25.15 182.884 25.15 183.854C25.15 184.684 24.9238 185.43 24.4714 186.091C24.024 186.747 23.4125 187.264 22.6369 187.642C21.8613 188.02 20.9789 188.209 19.9895 188.209ZM33.3606 188.209C32.3762 188.209 31.4988 188.04 30.7282 187.702C29.9625 187.364 29.3535 186.894 28.9011 186.292C28.4537 185.686 28.21 184.982 28.1703 184.182H30.0495C30.0893 184.674 30.2583 185.099 30.5566 185.457C30.8549 185.81 31.2452 186.083 31.7275 186.277C32.2097 186.471 32.7441 186.568 33.3308 186.568C33.987 186.568 34.5687 186.454 35.0758 186.225C35.5829 185.996 35.9806 185.678 36.269 185.271C36.5574 184.863 36.7015 184.391 36.7015 183.854C36.7015 183.292 36.5623 182.797 36.2839 182.37C36.0055 181.937 35.5978 181.599 35.0609 181.355C34.524 181.112 33.8677 180.99 33.0922 180.99H31.8691V179.349H33.0922C33.6987 179.349 34.2306 179.24 34.688 179.021C35.1504 178.803 35.5108 178.494 35.7694 178.097C36.0328 177.699 36.1646 177.232 36.1646 176.695C36.1646 176.178 36.0502 175.728 35.8216 175.345C35.5929 174.962 35.2697 174.664 34.8521 174.45C34.4395 174.236 33.9522 174.129 33.3904 174.129C32.8635 174.129 32.3663 174.226 31.899 174.42C31.4366 174.609 31.0588 174.885 30.7654 175.248C30.4721 175.606 30.313 176.038 30.2882 176.545H28.4984C28.5282 175.745 28.7694 175.044 29.2218 174.442C29.6742 173.836 30.2658 173.364 30.9966 173.026C31.7324 172.687 32.5403 172.518 33.4203 172.518C34.3649 172.518 35.1752 172.71 35.8514 173.093C36.5275 173.471 37.0471 173.97 37.41 174.592C37.7729 175.213 37.9544 175.884 37.9544 176.605C37.9544 177.465 37.7282 178.199 37.2757 178.805C36.8283 179.412 36.2193 179.832 35.4487 180.065V180.185C36.4132 180.344 37.1664 180.754 37.7083 181.415C38.2502 182.071 38.5211 182.884 38.5211 183.854C38.5211 184.684 38.2949 185.43 37.8425 186.091C37.3951 186.747 36.7836 187.264 36.008 187.642C35.2324 188.02 34.35 188.209 33.3606 188.209ZM46.7317 188.209C45.7473 188.209 44.8699 188.04 44.0993 187.702C43.3336 187.364 42.7246 186.894 42.2722 186.292C41.8248 185.686 41.5811 184.982 41.5414 184.182H43.4206C43.4604 184.674 43.6294 185.099 43.9277 185.457C44.226 185.81 44.6163 186.083 45.0985 186.277C45.5808 186.471 46.1152 186.568 46.7019 186.568C47.3581 186.568 47.9398 186.454 48.4469 186.225C48.954 185.996 49.3517 185.678 49.6401 185.271C49.9284 184.863 50.0726 184.391 50.0726 183.854C50.0726 183.292 49.9334 182.797 49.655 182.37C49.3766 181.937 48.9689 181.599 48.432 181.355C47.8951 181.112 47.2388 180.99 46.4632 180.99H45.2402V179.349H46.4632C47.0698 179.349 47.6017 179.24 48.0591 179.021C48.5215 178.803 48.8819 178.494 49.1404 178.097C49.4039 177.699 49.5357 177.232 49.5357 176.695C49.5357 176.178 49.4213 175.728 49.1926 175.345C48.964 174.962 48.6408 174.664 48.2232 174.45C47.8105 174.236 47.3233 174.129 46.7615 174.129C46.2346 174.129 45.7374 174.226 45.2701 174.42C44.8077 174.609 44.4299 174.885 44.1365 175.248C43.8432 175.606 43.6841 176.038 43.6593 176.545H41.8695C41.8993 175.745 42.1404 175.044 42.5929 174.442C43.0453 173.836 43.6369 173.364 44.3677 173.026C45.1035 172.687 45.9114 172.518 46.7914 172.518C47.736 172.518 48.5463 172.71 49.2225 173.093C49.8986 173.471 50.4181 173.97 50.7811 174.592C51.144 175.213 51.3255 175.884 51.3255 176.605C51.3255 177.465 51.0993 178.199 50.6468 178.805C50.1994 179.412 49.5904 179.832 48.8198 180.065V180.185C49.7843 180.344 50.5375 180.754 51.0794 181.415C51.6213 182.071 51.8922 182.884 51.8922 183.854C51.8922 184.684 51.666 185.43 51.2136 186.091C50.7662 186.747 50.1547 187.264 49.3791 187.642C48.6035 188.02 47.7211 188.209 46.7317 188.209ZM60.1028 188.209C59.1184 188.209 58.2409 188.04 57.4703 187.702C56.7047 187.364 56.0957 186.894 55.6433 186.292C55.1958 185.686 54.9522 184.982 54.9125 184.182H56.7917C56.8315 184.674 57.0005 185.099 57.2988 185.457C57.5971 185.81 57.9874 186.083 58.4696 186.277C58.9519 186.471 59.4863 186.568 60.073 186.568C60.7292 186.568 61.3109 186.454 61.818 186.225C62.3251 185.996 62.7228 185.678 63.0112 185.271C63.2995 184.863 63.4437 184.391 63.4437 183.854C63.4437 183.292 63.3045 182.797 63.0261 182.37C62.7477 181.937 62.34 181.599 61.8031 181.355C61.2662 181.112 60.6099 180.99 59.8343 180.99H58.6113V179.349H59.8343C60.4409 179.349 60.9728 179.24 61.4302 179.021C61.8926 178.803 62.253 178.494 62.5115 178.097C62.775 177.699 62.9068 177.232 62.9068 176.695C62.9068 176.178 62.7924 175.728 62.5637 175.345C62.335 174.962 62.0119 174.664 61.5943 174.45C61.1816 174.236 60.6944 174.129 60.1326 174.129C59.6056 174.129 59.1085 174.226 58.6412 174.42C58.1788 174.609 57.801 174.885 57.5076 175.248C57.2143 175.606 57.0552 176.038 57.0304 176.545H55.2406C55.2704 175.745 55.5115 175.044 55.964 174.442C56.4164 173.836 57.008 173.364 57.7388 173.026C58.4746 172.687 59.2825 172.518 60.1625 172.518C61.1071 172.518 61.9174 172.71 62.5936 173.093C63.2697 173.471 63.7892 173.97 64.1522 174.592C64.5151 175.213 64.6966 175.884 64.6966 176.605C64.6966 177.465 64.4703 178.199 64.0179 178.805C63.5705 179.412 62.9615 179.832 62.1909 180.065V180.185C63.1554 180.344 63.9086 180.754 64.4505 181.415C64.9924 182.071 65.2633 182.884 65.2633 183.854C65.2633 184.684 65.0371 185.43 64.5847 186.091C64.1373 186.747 63.5257 187.264 62.7502 187.642C61.9746 188.02 61.0922 188.209 60.1028 188.209ZM73.4739 188.209C72.4895 188.209 71.612 188.04 70.8414 187.702C70.0758 187.364 69.4668 186.894 69.0144 186.292C68.5669 185.686 68.3233 184.982 68.2836 184.182H70.1628C70.2026 184.674 70.3716 185.099 70.6699 185.457C70.9682 185.81 71.3585 186.083 71.8407 186.277C72.323 186.471 72.8574 186.568 73.4441 186.568C74.1003 186.568 74.682 186.454 75.1891 186.225C75.6962 185.996 76.0939 185.678 76.3823 185.271C76.6706 184.863 76.8148 184.391 76.8148 183.854C76.8148 183.292 76.6756 182.797 76.3972 182.37C76.1188 181.937 75.7111 181.599 75.1742 181.355C74.6373 181.112 73.981 180.99 73.2054 180.99H71.9824V179.349H73.2054C73.812 179.349 74.3439 179.24 74.8013 179.021C75.2637 178.803 75.6241 178.494 75.8826 178.097C76.1461 177.699 76.2779 177.232 76.2779 176.695C76.2779 176.178 76.1635 175.728 75.9348 175.345C75.7061 174.962 75.383 174.664 74.9654 174.45C74.5527 174.236 74.0655 174.129 73.5037 174.129C72.9767 174.129 72.4796 174.226 72.0123 174.42C71.5499 174.609 71.1721 174.885 70.8787 175.248C70.5854 175.606 70.4263 176.038 70.4015 176.545H68.6117C68.6415 175.745 68.8826 175.044 69.335 174.442C69.7875 173.836 70.3791 173.364 71.1099 173.026C71.8457 172.687 72.6536 172.518 73.5336 172.518C74.4782 172.518 75.2885 172.71 75.9647 173.093C76.6408 173.471 77.1603 173.97 77.5233 174.592C77.8862 175.213 78.0676 175.884 78.0676 176.605C78.0676 177.465 77.8414 178.199 77.389 178.805C76.9416 179.412 76.3326 179.832 75.562 180.065V180.185C76.5265 180.344 77.2797 180.754 77.8216 181.415C78.3635 182.071 78.6344 182.884 78.6344 183.854C78.6344 184.684 78.4082 185.43 77.9558 186.091C77.5083 186.747 76.8968 187.264 76.1213 187.642C75.3457 188.02 74.4632 188.209 73.4739 188.209ZM86.845 188.209C85.8606 188.209 84.9831 188.04 84.2125 187.702C83.4469 187.364 82.8379 186.894 82.3855 186.292C81.938 185.686 81.6944 184.982 81.6547 184.182H83.5339C83.5737 184.674 83.7427 185.099 84.041 185.457C84.3393 185.81 84.7296 186.083 85.2118 186.277C85.6941 186.471 86.2285 186.568 86.8152 186.568C87.4714 186.568 88.0531 186.454 88.5602 186.225C89.0673 185.996 89.465 185.678 89.7534 185.271C90.0417 184.863 90.1859 184.391 90.1859 183.854C90.1859 183.292 90.0467 182.797 89.7683 182.37C89.4899 181.937 89.0822 181.599 88.5453 181.355C88.0083 181.112 87.3521 180.99 86.5765 180.99H85.3535V179.349H86.5765C87.1831 179.349 87.715 179.24 88.1724 179.021C88.6348 178.803 88.9952 178.494 89.2537 178.097C89.5172 177.699 89.649 177.232 89.649 176.695C89.649 176.178 89.5346 175.728 89.3059 175.345C89.0772 174.962 88.7541 174.664 88.3365 174.45C87.9238 174.236 87.4366 174.129 86.8748 174.129C86.3478 174.129 85.8507 174.226 85.3833 174.42C84.921 174.609 84.5431 174.885 84.2498 175.248C83.9565 175.606 83.7974 176.038 83.7725 176.545H81.9828C82.0126 175.745 82.2537 175.044 82.7061 174.442C83.1586 173.836 83.7502 173.364 84.481 173.026C85.2168 172.687 86.0247 172.518 86.9047 172.518C87.8493 172.518 88.6596 172.71 89.3358 173.093C90.0119 173.471 90.5314 173.97 90.8944 174.592C91.2573 175.213 91.4387 175.884 91.4387 176.605C91.4387 177.465 91.2125 178.199 90.7601 178.805C90.3127 179.412 89.7037 179.832 88.9331 180.065V180.185C89.8975 180.344 90.6507 180.754 91.1926 181.415C91.7346 182.071 92.0055 182.884 92.0055 183.854C92.0055 184.684 91.7793 185.43 91.3269 186.091C90.8794 186.747 90.2679 187.264 89.4924 187.642C88.7168 188.02 87.8343 188.209 86.845 188.209ZM148.898 180.632V182.273H142.216V180.632H148.898ZM158.557 180.632V182.273H151.875V180.632H158.557ZM166.277 192.534C165.427 192.534 164.696 192.425 164.085 192.206C163.473 191.992 162.964 191.709 162.556 191.356C162.153 191.008 161.833 190.635 161.594 190.237L162.996 189.253C163.155 189.462 163.357 189.7 163.6 189.969C163.844 190.242 164.177 190.478 164.599 190.677C165.027 190.881 165.586 190.983 166.277 190.983C167.202 190.983 167.965 190.759 168.567 190.312C169.168 189.864 169.469 189.163 169.469 188.209V185.882H169.32C169.191 186.091 169.007 186.349 168.768 186.658C168.534 186.961 168.196 187.232 167.754 187.471C167.316 187.704 166.725 187.821 165.979 187.821C165.054 187.821 164.224 187.602 163.488 187.165C162.757 186.727 162.178 186.091 161.751 185.256C161.328 184.42 161.117 183.406 161.117 182.213C161.117 181.04 161.323 180.018 161.736 179.148C162.148 178.273 162.723 177.597 163.458 177.12C164.194 176.637 165.044 176.396 166.009 176.396C166.755 176.396 167.346 176.521 167.784 176.769C168.226 177.013 168.564 177.291 168.798 177.604C169.037 177.913 169.221 178.166 169.35 178.365H169.529V176.545H171.229V188.328C171.229 189.312 171.005 190.113 170.558 190.729C170.115 191.351 169.519 191.806 168.768 192.094C168.022 192.387 167.192 192.534 166.277 192.534ZM166.218 186.24C166.924 186.24 167.52 186.078 168.007 185.755C168.495 185.432 168.865 184.967 169.119 184.361C169.372 183.754 169.499 183.028 169.499 182.183C169.499 181.358 169.375 180.63 169.126 179.998C168.877 179.367 168.51 178.872 168.022 178.514C167.535 178.156 166.934 177.977 166.218 177.977C165.472 177.977 164.85 178.166 164.353 178.544C163.861 178.922 163.491 179.429 163.242 180.065C162.999 180.702 162.877 181.408 162.877 182.183C162.877 182.979 163.001 183.682 163.25 184.294C163.503 184.9 163.876 185.377 164.368 185.725C164.865 186.069 165.482 186.24 166.218 186.24ZM179.104 188.239C178.03 188.239 177.105 187.985 176.33 187.478C175.554 186.971 174.958 186.272 174.54 185.382C174.123 184.493 173.914 183.476 173.914 182.332C173.914 181.169 174.127 180.142 174.555 179.252C174.988 178.358 175.589 177.659 176.36 177.157C177.135 176.65 178.04 176.396 179.074 176.396C179.88 176.396 180.605 176.545 181.252 176.844C181.898 177.142 182.428 177.56 182.84 178.097C183.253 178.634 183.509 179.26 183.608 179.976H181.848C181.714 179.454 181.416 178.991 180.953 178.589C180.496 178.181 179.88 177.977 179.104 177.977C178.418 177.977 177.816 178.156 177.299 178.514C176.787 178.867 176.387 179.367 176.099 180.013C175.815 180.654 175.674 181.408 175.674 182.273C175.674 183.158 175.813 183.928 176.091 184.585C176.375 185.241 176.772 185.75 177.284 186.113C177.801 186.476 178.408 186.658 179.104 186.658C179.561 186.658 179.977 186.578 180.349 186.419C180.722 186.26 181.038 186.031 181.297 185.733C181.555 185.435 181.739 185.077 181.848 184.659H183.608C183.509 185.335 183.263 185.944 182.87 186.486C182.482 187.023 181.968 187.451 181.326 187.769C180.69 188.082 179.949 188.239 179.104 188.239ZM190.506 188.239C189.552 188.239 188.709 187.998 187.978 187.515C187.248 187.028 186.676 186.342 186.263 185.457C185.85 184.567 185.644 183.516 185.644 182.303C185.644 181.099 185.85 180.055 186.263 179.17C186.676 178.286 187.25 177.602 187.986 177.12C188.722 176.637 189.572 176.396 190.536 176.396C191.282 176.396 191.871 176.521 192.304 176.769C192.741 177.013 193.074 177.291 193.303 177.604C193.537 177.913 193.718 178.166 193.847 178.365H193.996V172.727H195.756V188H194.056V186.24H193.847C193.718 186.449 193.534 186.712 193.295 187.031C193.057 187.344 192.716 187.625 192.274 187.873C191.831 188.117 191.242 188.239 190.506 188.239ZM190.745 186.658C191.451 186.658 192.048 186.474 192.535 186.106C193.022 185.733 193.392 185.218 193.646 184.562C193.9 183.901 194.026 183.138 194.026 182.273C194.026 181.418 193.902 180.669 193.653 180.028C193.405 179.382 193.037 178.88 192.55 178.522C192.063 178.159 191.461 177.977 190.745 177.977C189.999 177.977 189.378 178.169 188.881 178.551C188.388 178.929 188.018 179.444 187.77 180.095C187.526 180.741 187.404 181.467 187.404 182.273C187.404 183.088 187.528 183.829 187.777 184.495C188.031 185.156 188.403 185.683 188.896 186.076C189.393 186.464 190.009 186.658 190.745 186.658ZM207.338 179.111L205.757 179.558C205.657 179.295 205.511 179.039 205.317 178.79C205.128 178.537 204.869 178.328 204.541 178.164C204.213 178 203.793 177.918 203.281 177.918C202.58 177.918 201.996 178.079 201.528 178.402C201.066 178.721 200.835 179.126 200.835 179.618C200.835 180.055 200.994 180.401 201.312 180.654C201.63 180.908 202.127 181.119 202.804 181.288L204.504 181.706C205.528 181.955 206.291 182.335 206.793 182.847C207.295 183.354 207.547 184.008 207.547 184.808C207.547 185.464 207.358 186.051 206.98 186.568C206.607 187.085 206.085 187.493 205.414 187.791C204.743 188.089 203.962 188.239 203.072 188.239C201.904 188.239 200.937 187.985 200.171 187.478C199.406 186.971 198.921 186.23 198.717 185.256L200.387 184.838C200.547 185.455 200.847 185.917 201.29 186.225C201.737 186.533 202.321 186.688 203.042 186.688C203.863 186.688 204.514 186.513 204.996 186.165C205.483 185.812 205.727 185.39 205.727 184.898C205.727 184.5 205.588 184.167 205.309 183.898C205.031 183.625 204.603 183.421 204.027 183.287L202.118 182.839C201.069 182.591 200.298 182.206 199.806 181.684C199.319 181.157 199.075 180.498 199.075 179.707C199.075 179.061 199.256 178.489 199.619 177.992C199.987 177.495 200.487 177.105 201.118 176.821C201.755 176.538 202.475 176.396 203.281 176.396C204.414 176.396 205.304 176.645 205.951 177.142C206.602 177.639 207.064 178.295 207.338 179.111ZM216.758 180.632V182.273H210.076V180.632H216.758ZM224.836 176.545V178.037H218.9V176.545H224.836ZM220.631 173.801H222.39V184.719C222.39 185.216 222.463 185.589 222.607 185.837C222.756 186.081 222.945 186.245 223.173 186.33C223.407 186.409 223.653 186.449 223.912 186.449C224.106 186.449 224.265 186.439 224.389 186.419C224.513 186.394 224.613 186.374 224.687 186.359L225.045 187.94C224.926 187.985 224.759 188.03 224.546 188.075C224.332 188.124 224.061 188.149 223.733 188.149C223.236 188.149 222.748 188.042 222.271 187.828C221.799 187.615 221.406 187.289 221.093 186.852C220.785 186.414 220.631 185.862 220.631 185.196V173.801ZM232.163 188.239C231.06 188.239 230.108 187.995 229.307 187.508C228.512 187.016 227.898 186.33 227.465 185.45C227.038 184.565 226.824 183.536 226.824 182.362C226.824 181.189 227.038 180.155 227.465 179.26C227.898 178.36 228.499 177.659 229.27 177.157C230.045 176.65 230.95 176.396 231.984 176.396C232.581 176.396 233.17 176.496 233.752 176.695C234.333 176.893 234.863 177.217 235.34 177.664C235.817 178.107 236.198 178.693 236.481 179.424C236.765 180.155 236.906 181.055 236.906 182.124V182.869H228.077V181.348H235.116C235.116 180.702 234.987 180.125 234.729 179.618C234.475 179.111 234.112 178.711 233.64 178.417C233.173 178.124 232.621 177.977 231.984 177.977C231.283 177.977 230.677 178.151 230.165 178.499C229.658 178.842 229.267 179.29 228.994 179.842C228.721 180.393 228.584 180.985 228.584 181.616V182.631C228.584 183.496 228.733 184.229 229.031 184.831C229.335 185.427 229.755 185.882 230.292 186.195C230.828 186.504 231.452 186.658 232.163 186.658C232.626 186.658 233.043 186.593 233.416 186.464C233.794 186.33 234.12 186.131 234.393 185.867C234.667 185.599 234.878 185.266 235.027 184.868L236.727 185.345C236.548 185.922 236.248 186.429 235.825 186.866C235.402 187.299 234.88 187.637 234.259 187.881C233.637 188.119 232.939 188.239 232.163 188.239ZM240.588 176.545L243.333 181.229L246.077 176.545H248.105L244.407 182.273L248.105 188H246.077L243.333 183.555L240.588 188H238.56L242.199 182.273L238.56 176.545H240.588ZM255.598 176.545V178.037H249.662V176.545H255.598ZM251.392 173.801H253.152V184.719C253.152 185.216 253.224 185.589 253.368 185.837C253.518 186.081 253.706 186.245 253.935 186.33C254.169 186.409 254.415 186.449 254.673 186.449C254.867 186.449 255.026 186.439 255.151 186.419C255.275 186.394 255.374 186.374 255.449 186.359L255.807 187.94C255.688 187.985 255.521 188.03 255.307 188.075C255.094 188.124 254.823 188.149 254.494 188.149C253.997 188.149 253.51 188.042 253.033 187.828C252.561 187.615 252.168 187.289 251.855 186.852C251.546 186.414 251.392 185.862 251.392 185.196V173.801ZM264.398 180.632V182.273H257.716V180.632H264.398ZM267.495 192.295V176.545H269.195V178.365H269.404C269.533 178.166 269.712 177.913 269.941 177.604C270.174 177.291 270.507 177.013 270.94 176.769C271.377 176.521 271.969 176.396 272.715 176.396C273.679 176.396 274.529 176.637 275.265 177.12C276.001 177.602 276.575 178.286 276.988 179.17C277.4 180.055 277.607 181.099 277.607 182.303C277.607 183.516 277.4 184.567 276.988 185.457C276.575 186.342 276.003 187.028 275.273 187.515C274.542 187.998 273.699 188.239 272.745 188.239C272.009 188.239 271.42 188.117 270.977 187.873C270.535 187.625 270.194 187.344 269.956 187.031C269.717 186.712 269.533 186.449 269.404 186.24H269.255V192.295H267.495ZM269.225 182.273C269.225 183.138 269.351 183.901 269.605 184.562C269.859 185.218 270.229 185.733 270.716 186.106C271.203 186.474 271.8 186.658 272.506 186.658C273.242 186.658 273.856 186.464 274.348 186.076C274.845 185.683 275.218 185.156 275.467 184.495C275.72 183.829 275.847 183.088 275.847 182.273C275.847 181.467 275.723 180.741 275.474 180.095C275.23 179.444 274.86 178.929 274.363 178.551C273.871 178.169 273.252 177.977 272.506 177.977C271.79 177.977 271.188 178.159 270.701 178.522C270.214 178.88 269.846 179.382 269.598 180.028C269.349 180.669 269.225 181.418 269.225 182.273ZM280.291 188V176.545H281.992V178.276H282.111C282.32 177.709 282.698 177.249 283.245 176.896C283.791 176.543 284.408 176.366 285.094 176.366C285.223 176.366 285.385 176.369 285.579 176.374C285.773 176.379 285.919 176.386 286.019 176.396V178.186C285.959 178.171 285.822 178.149 285.609 178.119C285.4 178.084 285.179 178.067 284.945 178.067C284.388 178.067 283.891 178.184 283.453 178.417C283.021 178.646 282.678 178.964 282.424 179.372C282.176 179.775 282.051 180.234 282.051 180.751V188H280.291ZM288.105 188V176.545H289.865V188H288.105ZM289 174.636C288.657 174.636 288.361 174.52 288.112 174.286C287.869 174.052 287.747 173.771 287.747 173.443C287.747 173.115 287.869 172.834 288.112 172.6C288.361 172.367 288.657 172.25 289 172.25C289.343 172.25 289.636 172.367 289.88 172.6C290.128 172.834 290.253 173.115 290.253 173.443C290.253 173.771 290.128 174.052 289.88 174.286C289.636 174.52 289.343 174.636 289 174.636ZM293.088 188V176.545H294.789V178.335H294.938C295.176 177.724 295.562 177.249 296.094 176.911C296.626 176.568 297.264 176.396 298.01 176.396C298.766 176.396 299.395 176.568 299.897 176.911C300.404 177.249 300.799 177.724 301.083 178.335H301.202C301.495 177.744 301.935 177.274 302.522 176.926C303.109 176.573 303.812 176.396 304.632 176.396C305.657 176.396 306.494 176.717 307.146 177.358C307.797 177.995 308.122 178.987 308.122 180.334V188H306.362V180.334C306.362 179.489 306.131 178.885 305.669 178.522C305.207 178.159 304.662 177.977 304.036 177.977C303.23 177.977 302.606 178.221 302.164 178.708C301.722 179.19 301.5 179.802 301.5 180.543V188H299.71V180.155C299.71 179.504 299.499 178.979 299.077 178.581C298.654 178.179 298.11 177.977 297.443 177.977C296.986 177.977 296.559 178.099 296.161 178.343C295.768 178.586 295.45 178.924 295.206 179.357C294.968 179.784 294.848 180.279 294.848 180.841V188H293.088ZM314.711 188.268C313.985 188.268 313.326 188.132 312.735 187.858C312.143 187.58 311.673 187.18 311.325 186.658C310.977 186.131 310.803 185.494 310.803 184.749C310.803 184.092 310.933 183.56 311.191 183.153C311.45 182.74 311.795 182.417 312.228 182.183C312.66 181.95 313.138 181.776 313.66 181.661C314.187 181.542 314.716 181.447 315.248 181.378C315.944 181.288 316.508 181.221 316.941 181.176C317.378 181.127 317.696 181.045 317.895 180.93C318.099 180.816 318.201 180.617 318.201 180.334V180.274C318.201 179.538 318 178.967 317.597 178.559C317.199 178.151 316.595 177.947 315.785 177.947C314.945 177.947 314.286 178.131 313.809 178.499C313.331 178.867 312.996 179.26 312.802 179.678L311.131 179.081C311.43 178.385 311.828 177.843 312.325 177.455C312.827 177.062 313.374 176.789 313.965 176.635C314.562 176.476 315.149 176.396 315.725 176.396C316.093 176.396 316.516 176.441 316.993 176.531C317.475 176.615 317.94 176.792 318.388 177.06C318.84 177.328 319.215 177.734 319.514 178.276C319.812 178.817 319.961 179.543 319.961 180.453V188H318.201V186.449H318.112C317.992 186.697 317.793 186.963 317.515 187.247C317.237 187.53 316.866 187.771 316.404 187.97C315.941 188.169 315.377 188.268 314.711 188.268ZM314.979 186.688C315.676 186.688 316.262 186.551 316.739 186.277C317.222 186.004 317.585 185.651 317.828 185.218C318.077 184.786 318.201 184.331 318.201 183.854V182.243C318.127 182.332 317.962 182.414 317.709 182.489C317.46 182.559 317.172 182.621 316.844 182.675C316.521 182.725 316.205 182.77 315.897 182.81C315.593 182.844 315.347 182.874 315.158 182.899C314.701 182.959 314.274 183.056 313.876 183.19C313.483 183.319 313.165 183.516 312.921 183.779C312.683 184.038 312.563 184.391 312.563 184.838C312.563 185.45 312.79 185.912 313.242 186.225C313.699 186.533 314.278 186.688 314.979 186.688ZM323.173 188V176.545H324.874V178.276H324.993C325.202 177.709 325.58 177.249 326.126 176.896C326.673 176.543 327.29 176.366 327.976 176.366C328.105 176.366 328.267 176.369 328.461 176.374C328.654 176.379 328.801 176.386 328.901 176.396V178.186C328.841 178.171 328.704 178.149 328.49 178.119C328.282 178.084 328.06 178.067 327.827 178.067C327.27 178.067 326.773 178.184 326.335 178.417C325.903 178.646 325.56 178.964 325.306 179.372C325.058 179.775 324.933 180.234 324.933 180.751V188H323.173ZM332.469 192.295C332.171 192.295 331.905 192.271 331.671 192.221C331.437 192.176 331.276 192.131 331.186 192.087L331.634 190.536C332.061 190.645 332.439 190.685 332.767 190.655C333.095 190.625 333.386 190.478 333.64 190.215C333.898 189.956 334.134 189.536 334.348 188.955L334.676 188.06L330.441 176.545H332.35L335.512 185.673H335.631L338.793 176.545H340.702L335.84 189.67C335.621 190.262 335.35 190.752 335.027 191.14C334.704 191.532 334.328 191.823 333.901 192.012C333.478 192.201 333.001 192.295 332.469 192.295Z" fill="black"/>
+<path d="M108.523 14.0586L102.898 19.6836C102.688 19.8945 102.406 20 102.125 20C101.809 20 101.527 19.8945 101.316 19.6836C100.859 19.2617 100.859 18.5234 101.316 18.1016L105.008 14.375H94.25C93.6172 14.375 93.125 13.8828 93.125 13.25C93.125 12.6523 93.6172 12.125 94.25 12.125H105.008L101.316 8.43361C100.859 8.01171 100.859 7.27341 101.316 6.85161C101.738 6.39451 102.477 6.39451 102.898 6.85161L108.523 12.4766C108.98 12.8984 108.98 13.6367 108.523 14.0586Z" fill="black"/>
+<path d="M81.523 99.0586L75.898 104.684C75.688 104.895 75.406 105 75.125 105C74.809 105 74.527 104.895 74.316 104.684C73.859 104.262 73.859 103.523 74.316 103.102L78.008 99.375H67.25C66.6172 99.375 66.125 98.8828 66.125 98.25C66.125 97.6523 66.6172 97.125 67.25 97.125H78.008L74.316 93.4336C73.859 93.0117 73.859 92.2734 74.316 91.8516C74.738 91.3945 75.477 91.3945 75.898 91.8516L81.523 97.4766C81.98 97.8984 81.98 98.6367 81.523 99.0586Z" fill="black"/>
+<path d="M122.523 182.059L116.898 187.684C116.688 187.895 116.406 188 116.125 188C115.809 188 115.527 187.895 115.316 187.684C114.859 187.262 114.859 186.523 115.316 186.102L119.008 182.375H108.25C107.617 182.375 107.125 181.883 107.125 181.25C107.125 180.652 107.617 180.125 108.25 180.125H119.008L115.316 176.434C114.859 176.012 114.859 175.273 115.316 174.852C115.738 174.395 116.477 174.395 116.898 174.852L122.523 180.477C122.98 180.898 122.98 181.637 122.523 182.059Z" fill="black"/>
+</g>
+<defs>
+<clipPath id="clip0_375_4970">
+<rect width="350" height="193" fill="white"/>
+</clipPath>
+</defs>
 </svg>
diff --git a/src/scripts/code-copy.js b/src/scripts/code-copy.js
index 26a998ca1..97a7eaeda 100644
--- a/src/scripts/code-copy.js
+++ b/src/scripts/code-copy.js
@@ -20,7 +20,7 @@ document.addEventListener('DOMContentLoaded', function () {
 
   const buttonClasses = [
     'd-block',
-    'mt-200',
+    'mt-150',
     'code-copy-button'
   ]
 
diff --git a/src/scripts/search.js b/src/scripts/search.js
index fb192a1c7..20a13ce40 100644
--- a/src/scripts/search.js
+++ b/src/scripts/search.js
@@ -38,28 +38,28 @@ if (searchTerm) {
       noresults: 'No results',
       loading: 'Loading search results.',
       noresultsbody: `
-        <p class="mb-400">No pages were found that match your search terms.</p>
+        <p class="mb-300">No pages were found that match your search terms.</p>
 
-        <p class="mb-400">Suggestions:</p>
+        <p class="mb-300">Suggestions:</p>
 
-        <ul class="list-disc mb-400">
+        <ul class="list-disc mb-300">
           <li>Make sure all search terms are spelled correctly</li>
           <li>Try different search terms</li>
           <li>Try more general search terms</li>
         </ul>
       `,
     },
-      
+
     fr: {
       results: `${results.length} résultats de recherche pour « ${searchTerm} »`,
       noresults: 'Aucun résultat',
       loading: 'Chargement des résultats de recherche.',
       noresultsbody: `
-        <p class="mb-400">Aucun résultat ne correspond à vos critères de recherche.</p>
+        <p class="mb-300">Aucun résultat ne correspond à vos critères de recherche.</p>
 
-        <p class="mb-400">Suggestions:</p>
+        <p class="mb-300">Suggestions:</p>
 
-        <ul class="list-disc mb-400">
+        <ul class="list-disc mb-300">
           <li>Assurez-vous que tous vos termes de recherches sont bien orthographiés</li>
           <li>Utilisez de différents termes de recherche</li>
           <li>Utilisez des termes de recherche plus généraux</li>
@@ -107,7 +107,7 @@ if (searchTerm) {
           'page::match': '{{1}}',
         },
       };
-      pagination.classList.add('mt-400');
+      pagination.classList.add('mt-300');
       document.getElementById('pagination').appendChild(pagination);
     }
   } else if (searchTerm && results.length === 0) {
@@ -128,8 +128,8 @@ function formatResult(result) {
 
   let heading = document.createElement('gcds-heading');
   heading.tag = 'h3';
-  heading.marginBottom = '150';
-  heading.marginTop = '300';
+  heading.marginBottom = '100';
+  heading.marginTop = '225';
 
   let link = document.createElement('gcds-link');
   link.href = result.url;
@@ -142,15 +142,15 @@ function formatResult(result) {
     'style',
     '--gcds-text-role-primary: var(--gcds-color-green-700);',
   );
-  url.marginBottom = '150';
+  url.marginBottom = '100';
   url.innerHTML = result.url;
 
   let excerpt = document.createElement('gcds-text');
-  excerpt.marginBottom = '100';
+  excerpt.marginBottom = '75';
   excerpt.innerHTML = result.excerpt;
 
   resultElement.appendChild(url);
   resultElement.appendChild(excerpt);
-  
+
   return resultElement;
 }
diff --git a/src/styles/_general.scss b/src/styles/_general.scss
index d727dc8b0..90b35e974 100644
--- a/src/styles/_general.scss
+++ b/src/styles/_general.scss
@@ -24,8 +24,8 @@ iframe {
 }
 
 ul li {
-  p.mb-400:has(+ ul),
-  ul.mb-400 {
+  p.mb-300:has(+ ul),
+  ul.mb-300 {
     margin-block-end: 0;
   }
 
diff --git a/src/styles/_typography.scss b/src/styles/_typography.scss
index 337b4ee4f..8ccfbe4e0 100644
--- a/src/styles/_typography.scss
+++ b/src/styles/_typography.scss
@@ -7,13 +7,13 @@ a[href] {
   }
 
   &:focus {
-    border-radius: var(--gcds-border-radius-sm);
-    background-color: var(--gcds-focus-background);
-    color: var(--gcds-focus-text);
+    border-radius: var(--gcds-link-focus-border-radius);
+    background-color: var(--gcds-link-focus-background);
+    color: var(--gcds-link-focus-text);
     text-decoration: none;
-    box-shadow: 0 0 0 var(--gcds-border-width-md) var(--gcds-color-grayscale-0);
-    outline-offset: var(--gcds-border-width-md);
-    outline: var(--gcds-spacing-50) solid var(--gcds-focus-background);
+    box-shadow: var(--gcds-link-focus-box-shadow);
+    outline-offset: var(--gcds-link-focus-outline-offset);
+    outline: var(--gcds-link-focus-outline-width) solid var(--gcds-link-focus-background);
   }
 }
 
@@ -24,33 +24,33 @@ a[href]:not([class*='link-inherit']):not([class*='link-light']):not(:focus):not(
 }
 
 h1 {
-  max-width: 32ch;
+  max-width: var(--gcds-heading-character-limit-h1);
 }
 
 h2 {
-  max-width: 37ch;
+  max-width: var(--gcds-heading-character-limit-h2);
 }
 
 h3 {
-  max-width: 42ch;
+  max-width: var(--gcds-heading-character-limit-h3);
 }
 
 h4 {
-  max-width: 46ch;
+  max-width: var(--gcds-heading-character-limit-h4);
 }
 
 h5 {
-  max-width: 53ch;
+  max-width: var(--gcds-heading-character-limit-h5);
 }
 
 h6 {
-  max-width: 60ch;
+  max-width: var(--gcds-heading-character-limit-h6);
 }
 
 // Text and long form content
 ul li,
 p {
-  font: var(--gcds-font-text-long);
+  font: var(--gcds-font-text);
   max-width: 65ch;
 }
 
@@ -67,8 +67,8 @@ code,
 
 code:not([class*='language-']) {
   font-size: 80%;
-  line-height: var(--gcds-line-heights-caption);
-  padding: var(--gcds-spacing-50);
+  line-height: var(--gcds-line-heights-text-small);
+  padding: var(--gcds-spacing-25);
   background-color: var(--gcds-color-grayscale-50);
   border-radius: var(--gcds-border-radius-sm);
 }
diff --git a/src/styles/components/_anatomy-list.scss b/src/styles/components/_anatomy-list.scss
index 3f039127c..01f58e3c3 100644
--- a/src/styles/components/_anatomy-list.scss
+++ b/src/styles/components/_anatomy-list.scss
@@ -6,19 +6,19 @@
     position: relative;
     max-width: 65ch;
     counter-increment: item;
-    margin-block-end: var(--gcds-spacing-400);
+    margin-block-end: var(--gcds-spacing-300);
     padding-inline-start: var(--gcds-spacing-450);
 
     &:before {
       position: absolute;
       left: 0;
       display: inline-block;
-      width: var(--gcds-spacing-400);
-      height: var(--gcds-spacing-400);
-      font-size: var(--gcds-font-sizes-caption);
+      width: var(--gcds-spacing-350);
+      height: var(--gcds-spacing-350);
+      font: var(--gcds-font-text-small);
       text-align: center;
       content: counter(item);
-      margin-inline-end: var(--gcds-spacing-200);
+      margin-inline-end: var(--gcds-spacing-150);
       background: #c54600;
       color: var(--gcds-text-light);
       border-radius: var(--gcds-border-radius-xl);
@@ -27,6 +27,6 @@
 
   ul {
     list-style: disc;
-    margin-inline-start: var(--gcds-spacing-550);
+    margin-inline-start: var(--gcds-spacing-750);
   }
 }
diff --git a/src/styles/components/_code-showcase.scss b/src/styles/components/_code-showcase.scss
index 8b167242e..cc8070a76 100644
--- a/src/styles/components/_code-showcase.scss
+++ b/src/styles/components/_code-showcase.scss
@@ -18,12 +18,12 @@
     }
 
     &[aria-hidden='false'] {
-      margin-top: calc(-1 * var(--gcds-spacing-400));
+      margin-top: calc(-1 * var(--gcds-spacing-300));
     }
   }
 
   gcds-button {
-    margin: 0 var(--gcds-spacing-300) 0 0;
+    margin: 0 var(--gcds-spacing-225) 0 0;
   }
 
   .code-copy {
diff --git a/src/styles/components/_table.scss b/src/styles/components/_table.scss
index 2a8f02250..d2e026374 100644
--- a/src/styles/components/_table.scss
+++ b/src/styles/components/_table.scss
@@ -4,8 +4,8 @@
     overflow-x: scroll;
     box-shadow:
       inset calc(-1 * var(--gcds-border-width-xl)) 0 0
-        var(--gcds-color-grayscale-50),
-      inset var(--gcds-border-width-xl) 0 0 var(--gcds-color-grayscale-50);
+        var(--gcds-color-grayscale-25),
+      inset var(--gcds-border-width-xl) 0 0 var(--gcds-color-grayscale-25);
   }
 }
 
@@ -37,7 +37,7 @@ table {
 
   td,
   th {
-    padding: var(--gcds-spacing-300) var(--gcds-spacing-250);
+    padding: var(--gcds-spacing-225) var(--gcds-spacing-175);
 
     &:first-child {
       padding-inline-start: 0;
@@ -55,14 +55,14 @@ table {
 
   // Special cells
   .color-preview {
-    width: var(--gcds-spacing-500);
-    height: var(--gcds-spacing-500);
-    margin-block-start: calc(-1 * var(--gcds-spacing-200));
-    border-radius: var(--gcds-spacing-500);
+    width: var(--gcds-spacing-600);
+    height: var(--gcds-spacing-600);
+    margin-block-start: calc(-1 * var(--gcds-spacing-150));
+    border-radius: var(--gcds-spacing-600);
   }
 
   .spacing-preview {
-    background-color: var(--gcds-color-blue-500);
+    background-color: var(--gcds-color-blue-600);
   }
 }
 
@@ -73,11 +73,11 @@ table {
   }
 
   td {
-    padding-block: calc(var(--gcds-spacing-300) + var(--gcds-spacing-200));
+    padding-block: calc(var(--gcds-spacing-225) + var(--gcds-spacing-150));
   }
 
   th:nth-child(1) {
-    width: var(--gcds-spacing-500);
+    width: var(--gcds-spacing-600);
   }
 
   th:nth-child(2) {
@@ -134,7 +134,7 @@ table {
 }
 
 .table-display-token-dimension {
-  margin-block-end: var(--gcds-spacing-600);
+  margin-block-end: var(--gcds-spacing-900);
 
   tr {
     vertical-align: top;
diff --git a/src/styles/components/_tabs.scss b/src/styles/components/_tabs.scss
index 056792097..ba83cb8d3 100644
--- a/src/styles/components/_tabs.scss
+++ b/src/styles/components/_tabs.scss
@@ -2,25 +2,25 @@ nav.tabs {
   ul {
     list-style: none;
     margin-inline-start: 0;
-    margin-block-end: var(--gcds-spacing-500);
+    margin-block-end: var(--gcds-spacing-600);
     width: var(--gcds-container-full);
     display: flex;
     background-color: var(--gcds-color-grayscale-0);
-    gap: var(--gcds-spacing-100);
+    gap: var(--gcds-spacing-75);
     flex-wrap: wrap;
     border-block-end: var(--gcds-border-width-md) solid
-      var(--gcds-color-grayscale-100);
+      var(--gcds-color-grayscale-75);
   }
 
   a {
     display: block;
     border-radius: var(--gcds-button-border-radius)
       var(--gcds-button-border-radius) 0 0;
-    padding: var(--gcds-spacing-200) var(--gcds-spacing-200)
-      var(--gcds-spacing-150) var(--gcds-spacing-200);
+    padding: var(--gcds-spacing-150) var(--gcds-spacing-150)
+      var(--gcds-spacing-100) var(--gcds-spacing-150);
     color: var(--gcds-text-default);
-    margin-block-start: var(--gcds-spacing-150);
-    margin-block-end: var(--gcds-spacing-50);
+    margin-block-start: var(--gcds-spacing-100);
+    margin-block-end: var(--gcds-spacing-25);
 
     &[aria-current='page'] {
       background-color: var(--gcds-color-grayscale-0);
@@ -30,15 +30,15 @@ nav.tabs {
         calc(var(--gcds-border-width-md) * -1) var(--gcds-color-grayscale-0);
       text-decoration: none;
       font-weight: bold;
-      padding: var(--gcds-spacing-300) var(--gcds-spacing-200)
-        var(--gcds-spacing-250) var(--gcds-spacing-200);
+      padding: var(--gcds-spacing-225) var(--gcds-spacing-150)
+        var(--gcds-spacing-175) var(--gcds-spacing-150);
       margin-block-start: 0;
       margin-block-end: 0;
       pointer-events: none;
     }
 
     &:hover {
-      background-color: var(--gcds-color-grayscale-50);
+      background-color: var(--gcds-color-grayscale-25);
     }
 
     &:active {
diff --git a/src/styles/pages/_home.scss b/src/styles/pages/_home.scss
index b0798c56a..7e8e74fce 100644
--- a/src/styles/pages/_home.scss
+++ b/src/styles/pages/_home.scss
@@ -1,5 +1,5 @@
 .hero {
-  margin: calc(-1 * var(--gcds-spacing-200));
+  margin: calc(-1 * var(--gcds-spacing-150));
   background: url(../../images/common/home/home-hero.jpg) top center no-repeat;
   background-size: cover;
 
diff --git a/src/styles/pages/_search.scss b/src/styles/pages/_search.scss
index cc942cde5..625c15dfd 100644
--- a/src/styles/pages/_search.scss
+++ b/src/styles/pages/_search.scss
@@ -1,6 +1,6 @@
 .search-result {
   border-block-end: solid 1px var(--gcds-color-grayscale-1000);
-  padding-block-end: var(--gcds-spacing-400);
+  padding-block-end: var(--gcds-spacing-300);
 
   mark {
     background-color: inherit;
@@ -9,7 +9,7 @@
 }
 
 .results-loader {
-  width: var(--gcds-spacing-500);
+  width: var(--gcds-spacing-600);
   aspect-ratio: 1;
   border-radius: var(--gcds-border-radius-xl);
   border: var(--gcds-border-width-xl) solid var(--gcds-text-primary);
@@ -17,16 +17,18 @@
     l20-1 0.8s infinite linear alternate,
     l20-2 1.6s infinite linear;
 }
+
 @keyframes l20-1{
-   0%    {clip-path: polygon(50% 50%,0       0,  50%   0%,  50%    0%, 50%    0%, 50%    0%, 50%    0% )}
-   12.5% {clip-path: polygon(50% 50%,0       0,  50%   0%,  100%   0%, 100%   0%, 100%   0%, 100%   0% )}
-   25%   {clip-path: polygon(50% 50%,0       0,  50%   0%,  100%   0%, 100% 100%, 100% 100%, 100% 100% )}
-   50%   {clip-path: polygon(50% 50%,0       0,  50%   0%,  100%   0%, 100% 100%, 50%  100%, 0%   100% )}
-   62.5% {clip-path: polygon(50% 50%,100%    0, 100%   0%,  100%   0%, 100% 100%, 50%  100%, 0%   100% )}
-   75%   {clip-path: polygon(50% 50%,100% 100%, 100% 100%,  100% 100%, 100% 100%, 50%  100%, 0%   100% )}
-   100%  {clip-path: polygon(50% 50%,50%  100%,  50% 100%,   50% 100%,  50% 100%, 50%  100%, 0%   100% )}
+  0%    {clip-path: polygon(50% 50%,0       0,  50%   0%,  50%    0%, 50%    0%, 50%    0%, 50%    0% )}
+  12.5% {clip-path: polygon(50% 50%,0       0,  50%   0%,  100%   0%, 100%   0%, 100%   0%, 100%   0% )}
+  25%   {clip-path: polygon(50% 50%,0       0,  50%   0%,  100%   0%, 100% 100%, 100% 100%, 100% 100% )}
+  50%   {clip-path: polygon(50% 50%,0       0,  50%   0%,  100%   0%, 100% 100%, 50%  100%, 0%   100% )}
+  62.5% {clip-path: polygon(50% 50%,100%    0, 100%   0%,  100%   0%, 100% 100%, 50%  100%, 0%   100% )}
+  75%   {clip-path: polygon(50% 50%,100% 100%, 100% 100%,  100% 100%, 100% 100%, 50%  100%, 0%   100% )}
+  100%  {clip-path: polygon(50% 50%,50%  100%,  50% 100%,   50% 100%,  50% 100%, 50%  100%, 0%   100% )}
 }
-@keyframes l20-2{ 
+
+@keyframes l20-2{
   0%    {transform:scaleY(1)  rotate(0deg)}
   49.99%{transform:scaleY(1)  rotate(135deg)}
   50%   {transform:scaleY(-1) rotate(0deg)}
diff --git a/src/styles/style.css b/src/styles/style.css
index 125519986..ef52dfe0e 100644
--- a/src/styles/style.css
+++ b/src/styles/style.css
@@ -1,8 +1,8 @@
 .bg-full-width {
   position: relative;
-  width: calc(100% + var(--gcds-spacing-300));
-  margin-inline: calc(-1 * var(--gcds-spacing-150));
-  padding-inline: var(--gcds-spacing-150);
+  width: calc(100% + var(--gcds-spacing-225));
+  margin-inline: calc(-1 * var(--gcds-spacing-100));
+  padding-inline: var(--gcds-spacing-100);
 }
 .bg-full-width:before, .bg-full-width:after {
   position: absolute;
@@ -31,13 +31,13 @@ a[href]:not([class*=link-light]):hover:not(:focus) {
   color: var(--gcds-link-hover);
 }
 a[href]:focus {
-  border-radius: var(--gcds-border-radius-sm);
-  background-color: var(--gcds-focus-background);
-  color: var(--gcds-focus-text);
+  border-radius: var(--gcds-link-focus-border-radius);
+  background-color: var(--gcds-link-focus-background);
+  color: var(--gcds-link-focus-text);
   text-decoration: none;
-  box-shadow: 0 0 0 var(--gcds-border-width-md) var(--gcds-color-grayscale-0);
-  outline-offset: var(--gcds-border-width-md);
-  outline: var(--gcds-spacing-50) solid var(--gcds-focus-background);
+  box-shadow: var(--gcds-link-focus-box-shadow);
+  outline-offset: var(--gcds-link-focus-outline-offset);
+  outline: var(--gcds-link-focus-outline-width) solid var(--gcds-link-focus-background);
 }
 
 a[href]:not([class*=link-inherit]):not([class*=link-light]):not(:focus):not(:hover) {
@@ -45,32 +45,32 @@ a[href]:not([class*=link-inherit]):not([class*=link-light]):not(:focus):not(:hov
 }
 
 h1 {
-  max-width: 32ch;
+  max-width: var(--gcds-heading-character-limit-h1);
 }
 
 h2 {
-  max-width: 37ch;
+  max-width: var(--gcds-heading-character-limit-h2);
 }
 
 h3 {
-  max-width: 42ch;
+  max-width: var(--gcds-heading-character-limit-h3);
 }
 
 h4 {
-  max-width: 46ch;
+  max-width: var(--gcds-heading-character-limit-h4);
 }
 
 h5 {
-  max-width: 53ch;
+  max-width: var(--gcds-heading-character-limit-h5);
 }
 
 h6 {
-  max-width: 60ch;
+  max-width: var(--gcds-heading-character-limit-h6);
 }
 
 ul li,
 p {
-  font: var(--gcds-font-text-long);
+  font: var(--gcds-font-text);
   max-width: 65ch;
 }
 
@@ -86,8 +86,8 @@ code,
 
 code:not([class*=language-]) {
   font-size: 80%;
-  line-height: var(--gcds-line-heights-caption);
-  padding: var(--gcds-spacing-50);
+  line-height: var(--gcds-line-heights-text-small);
+  padding: var(--gcds-spacing-25);
   background-color: var(--gcds-color-grayscale-50);
   border-radius: var(--gcds-border-radius-sm);
 }
@@ -115,8 +115,8 @@ iframe {
   max-width: 100%;
 }
 
-ul li p.mb-400:has(+ ul),
-ul li ul.mb-400 {
+ul li p.mb-300:has(+ ul),
+ul li ul.mb-300 {
   margin-block-end: 0;
 }
 ul li ul li {
@@ -131,26 +131,26 @@ ul li ul li {
   position: relative;
   max-width: 65ch;
   counter-increment: item;
-  margin-block-end: var(--gcds-spacing-400);
+  margin-block-end: var(--gcds-spacing-300);
   padding-inline-start: var(--gcds-spacing-450);
 }
 .anatomy-list > li:before {
   position: absolute;
   left: 0;
   display: inline-block;
-  width: var(--gcds-spacing-400);
-  height: var(--gcds-spacing-400);
-  font-size: var(--gcds-font-sizes-caption);
+  width: var(--gcds-spacing-350);
+  height: var(--gcds-spacing-350);
+  font: var(--gcds-font-text-small);
   text-align: center;
   content: counter(item);
-  margin-inline-end: var(--gcds-spacing-200);
+  margin-inline-end: var(--gcds-spacing-150);
   background: #c54600;
   color: var(--gcds-text-light);
   border-radius: var(--gcds-border-radius-xl);
 }
 .anatomy-list ul {
   list-style: disc;
-  margin-inline-start: var(--gcds-spacing-550);
+  margin-inline-start: var(--gcds-spacing-750);
 }
 
 /*
@@ -170,10 +170,10 @@ ul li ul li {
   overflow: hidden;
 }
 .code-showcase .showcase[aria-hidden=false] {
-  margin-top: calc(-1 * var(--gcds-spacing-400));
+  margin-top: calc(-1 * var(--gcds-spacing-300));
 }
 .code-showcase gcds-button {
-  margin: 0 var(--gcds-spacing-300) 0 0;
+  margin: 0 var(--gcds-spacing-225) 0 0;
 }
 .code-showcase .code-copy {
   display: none;
@@ -223,7 +223,7 @@ ul li ul li {
   .table-overflow {
     max-width: var(--gcds-container-full);
     overflow-x: scroll;
-    box-shadow: inset calc(-1 * var(--gcds-border-width-xl)) 0 0 var(--gcds-color-grayscale-50), inset var(--gcds-border-width-xl) 0 0 var(--gcds-color-grayscale-50);
+    box-shadow: inset calc(-1 * var(--gcds-border-width-xl)) 0 0 var(--gcds-color-grayscale-25), inset var(--gcds-border-width-xl) 0 0 var(--gcds-color-grayscale-25);
   }
 }
 
@@ -246,7 +246,7 @@ table tbody tr {
 }
 table td,
 table th {
-  padding: var(--gcds-spacing-300) var(--gcds-spacing-250);
+  padding: var(--gcds-spacing-225) var(--gcds-spacing-175);
 }
 table td:first-child,
 table th:first-child {
@@ -261,23 +261,23 @@ table th {
   padding-block-start: 0;
 }
 table .color-preview {
-  width: var(--gcds-spacing-500);
-  height: var(--gcds-spacing-500);
-  margin-block-start: calc(-1 * var(--gcds-spacing-200));
-  border-radius: var(--gcds-spacing-500);
+  width: var(--gcds-spacing-600);
+  height: var(--gcds-spacing-600);
+  margin-block-start: calc(-1 * var(--gcds-spacing-150));
+  border-radius: var(--gcds-spacing-600);
 }
 table .spacing-preview {
-  background-color: var(--gcds-color-blue-500);
+  background-color: var(--gcds-color-blue-600);
 }
 
 .table-display-token-color tr {
   vertical-align: top;
 }
 .table-display-token-color td {
-  padding-block: calc(var(--gcds-spacing-300) + var(--gcds-spacing-200));
+  padding-block: calc(var(--gcds-spacing-225) + var(--gcds-spacing-150));
 }
 .table-display-token-color th:nth-child(1) {
-  width: var(--gcds-spacing-500);
+  width: var(--gcds-spacing-600);
 }
 .table-display-token-color th:nth-child(2) {
   width: 30%;
@@ -321,7 +321,7 @@ table .spacing-preview {
 }
 
 .table-display-token-dimension {
-  margin-block-end: var(--gcds-spacing-600);
+  margin-block-end: var(--gcds-spacing-900);
 }
 .table-display-token-dimension tr {
   vertical-align: top;
@@ -330,21 +330,21 @@ table .spacing-preview {
 nav.tabs ul {
   list-style: none;
   margin-inline-start: 0;
-  margin-block-end: var(--gcds-spacing-500);
+  margin-block-end: var(--gcds-spacing-600);
   width: var(--gcds-container-full);
   display: flex;
   background-color: var(--gcds-color-grayscale-0);
-  gap: var(--gcds-spacing-100);
+  gap: var(--gcds-spacing-75);
   flex-wrap: wrap;
-  border-block-end: var(--gcds-border-width-md) solid var(--gcds-color-grayscale-100);
+  border-block-end: var(--gcds-border-width-md) solid var(--gcds-color-grayscale-75);
 }
 nav.tabs a {
   display: block;
   border-radius: var(--gcds-button-border-radius) var(--gcds-button-border-radius) 0 0;
-  padding: var(--gcds-spacing-200) var(--gcds-spacing-200) var(--gcds-spacing-150) var(--gcds-spacing-200);
+  padding: var(--gcds-spacing-150) var(--gcds-spacing-150) var(--gcds-spacing-100) var(--gcds-spacing-150);
   color: var(--gcds-text-default);
-  margin-block-start: var(--gcds-spacing-150);
-  margin-block-end: var(--gcds-spacing-50);
+  margin-block-start: var(--gcds-spacing-100);
+  margin-block-end: var(--gcds-spacing-25);
 }
 nav.tabs a[aria-current=page] {
   background-color: var(--gcds-color-grayscale-0);
@@ -353,13 +353,13 @@ nav.tabs a[aria-current=page] {
   box-shadow: 0 var(--gcds-border-width-xl) 0 calc(var(--gcds-border-width-md) * -1) var(--gcds-color-grayscale-0);
   text-decoration: none;
   font-weight: bold;
-  padding: var(--gcds-spacing-300) var(--gcds-spacing-200) var(--gcds-spacing-250) var(--gcds-spacing-200);
+  padding: var(--gcds-spacing-225) var(--gcds-spacing-150) var(--gcds-spacing-175) var(--gcds-spacing-150);
   margin-block-start: 0;
   margin-block-end: 0;
   pointer-events: none;
 }
 nav.tabs a:hover {
-  background-color: var(--gcds-color-grayscale-50);
+  background-color: var(--gcds-color-grayscale-25);
 }
 nav.tabs a:active {
   color: var(--gcds-focus-text) !important;
@@ -374,7 +374,7 @@ nav.tabs a[aria-current=page]:focus {
 }
 
 .hero {
-  margin: calc(-1 * var(--gcds-spacing-200));
+  margin: calc(-1 * var(--gcds-spacing-150));
   background: url(../../images/common/home/home-hero.jpg) top center no-repeat;
   background-size: cover;
 }
@@ -403,7 +403,7 @@ nav.tabs a[aria-current=page]:focus {
 
 .search-result {
   border-block-end: solid 1px var(--gcds-color-grayscale-1000);
-  padding-block-end: var(--gcds-spacing-400);
+  padding-block-end: var(--gcds-spacing-300);
 }
 .search-result mark {
   background-color: inherit;
@@ -411,7 +411,7 @@ nav.tabs a[aria-current=page]:focus {
 }
 
 .results-loader {
-  width: var(--gcds-spacing-500);
+  width: var(--gcds-spacing-600);
   aspect-ratio: 1;
   border-radius: var(--gcds-border-radius-xl);
   border: var(--gcds-border-width-xl) solid var(--gcds-text-primary);
diff --git a/src/styles/style.css.map b/src/styles/style.css.map
index 3f2921208..e94fb5175 100644
--- a/src/styles/style.css.map
+++ b/src/styles/style.css.map
@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["utilities/_backgrounds.scss","_typography.scss","_general.scss","components/_anatomy-list.scss","components/_code-showcase.scss","components/_copy-code.scss","components/_component-preview.scss","components/_component-preview-box.scss","components/_table.scss","components/_tabs.scss","pages/_home.scss","pages/_search.scss"],"names":[],"mappings":"AACA;EACE;EACA;EACA;EACA;;AAEA;EAEE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;;AAIJ;EACE;EACA;;;AC3BF;EACE;;AAEA;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAIJ;EAGE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAIF;AAAA;EAEE;EACA;;;AAGF;AAAA;EAEE;;;AAIF;AAAA;EAEE;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;ACxEF;AAAA;AAAA;AAIA;EACE;IACE;;EAEF;IACE;;;AAIJ;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAIA;AAAA;EAEE;;AAGF;EACE;;;AChCJ;EACE;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIJ;EACE;EACA;;;AC7BJ;AAAA;AAAA;AAKE;EACE;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAIJ;EACE;;AAGF;EACE;EACA;;;AC9BJ;AAAA;AAAA;AAIA;EACE;EACA;;;AAGF;EACE;;;ACTA;EACE;;AAGF;EACE;;;ACNJ;EACE;EACA;EACA;;AAEA;EACE;;AAEA;EACE;;AAIJ;EACE;EACA;EACA;;AAEA;EACE;;;AClBJ;EADF;IAEI;IACA;IACA,YACE;;;;AAMN;EACE;EACA;;AAEA;EACE;EACA,YACE;;AAKJ;EACE;;AAGF;EACE;;AAIF;EACE;;AAIF;AAAA;EAEE;;AAEA;AAAA;EACE;;AAGF;AAAA;EACE;;AAIJ;EACE;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAGF;EACE;;;AAMF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;;AAKF;EACE;;AAGF;EACE;;AAGF;EACE;;;AAOF;AAAA;AAAA;EACE;EACA;;AAGF;AAAA;AAAA;EACE;;;AAKF;AAAA;EAEE;;;AAKF;EACE;;;AAIJ;EACE;;AAEA;EACE;;;AC1IF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIF;EACE;EACA;EAEA;EAEA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EAEA;EACA;EACA;EAEA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;EACA;;AAGF;EACE;;;ACtDN;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AC1BN;EACE;EACA;;AAEA;EACE;EACA;;;AAIJ;EACE;EACA;EACA;EACA;EACA,WACE;;;AAGJ;EACG;IAAO;;EACP;IAAO;;EACP;IAAO;;EACP;IAAO;;EACP;IAAO;;EACP;IAAO;;EACP;IAAO;;;AAEV;EACE;IAAO;;EACP;IAAO;;EACP;IAAO;;EACP;IAAO","file":"style.css"}
\ No newline at end of file
+{"version":3,"sourceRoot":"","sources":["utilities/_backgrounds.scss","_typography.scss","_general.scss","components/_anatomy-list.scss","components/_code-showcase.scss","components/_copy-code.scss","components/_component-preview.scss","components/_component-preview-box.scss","components/_table.scss","components/_tabs.scss","pages/_home.scss","pages/_search.scss"],"names":[],"mappings":"AACA;EACE;EACA;EACA;EACA;;AAEA;EAEE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;;AAIJ;EACE;EACA;;;AC3BF;EACE;;AAEA;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAIJ;EAGE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAIF;AAAA;EAEE;EACA;;;AAGF;AAAA;EAEE;;;AAIF;AAAA;EAEE;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;ACxEF;AAAA;AAAA;AAIA;EACE;IACE;;EAEF;IACE;;;AAIJ;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAIA;AAAA;EAEE;;AAGF;EACE;;;AChCJ;EACE;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIJ;EACE;EACA;;;AC7BJ;AAAA;AAAA;AAKE;EACE;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAIJ;EACE;;AAGF;EACE;EACA;;;AC9BJ;AAAA;AAAA;AAIA;EACE;EACA;;;AAGF;EACE;;;ACTA;EACE;;AAGF;EACE;;;ACNJ;EACE;EACA;EACA;;AAEA;EACE;;AAEA;EACE;;AAIJ;EACE;EACA;EACA;;AAEA;EACE;;;AClBJ;EADF;IAEI;IACA;IACA,YACE;;;;AAMN;EACE;EACA;;AAEA;EACE;EACA,YACE;;AAKJ;EACE;;AAGF;EACE;;AAIF;EACE;;AAIF;AAAA;EAEE;;AAEA;AAAA;EACE;;AAGF;AAAA;EACE;;AAIJ;EACE;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAGF;EACE;;;AAMF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;;AAKF;EACE;;AAGF;EACE;;AAGF;EACE;;;AAOF;AAAA;AAAA;EACE;EACA;;AAGF;AAAA;AAAA;EACE;;;AAKF;AAAA;EAEE;;;AAKF;EACE;;;AAIJ;EACE;;AAEA;EACE;;;AC1IF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIF;EACE;EACA;EAEA;EAEA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EAEA;EACA;EACA;EAEA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;EACA;;AAGF;EACE;;;ACtDN;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AC1BN;EACE;EACA;;AAEA;EACE;EACA;;;AAIJ;EACE;EACA;EACA;EACA;EACA,WACE;;;AAIJ;EACE;IAAO;;EACP;IAAO;;EACP;IAAO;;EACP;IAAO;;EACP;IAAO;;EACP;IAAO;;EACP;IAAO;;;AAGT;EACE;IAAO;;EACP;IAAO;;EACP;IAAO;;EACP;IAAO","file":"style.css"}
\ No newline at end of file
diff --git a/src/styles/utilities/_backgrounds.scss b/src/styles/utilities/_backgrounds.scss
index a93ec4d1d..bd183f148 100644
--- a/src/styles/utilities/_backgrounds.scss
+++ b/src/styles/utilities/_backgrounds.scss
@@ -1,9 +1,9 @@
 // Backgrounds
 .bg-full-width {
   position: relative;
-  width: calc(100% + var(--gcds-spacing-300));
-  margin-inline: calc(-1 * var(--gcds-spacing-150));
-  padding-inline: var(--gcds-spacing-150);
+  width: calc(100% + var(--gcds-spacing-225));
+  margin-inline: calc(-1 * var(--gcds-spacing-100));
+  padding-inline: var(--gcds-spacing-100);
 
   &:before,
   &:after {
diff --git a/utils/anchor.js b/utils/anchor.js
index 6b810994b..231c0235e 100644
--- a/utils/anchor.js
+++ b/utils/anchor.js
@@ -12,27 +12,27 @@ const anchor = (md, options) => {
     const slug = slugify(contentToken.content);
 
     if (tokens[index].tag === 'h1') {
-      return `<${tokens[index].tag} id="${slug}" class="mb-400">`;
+      return `<${tokens[index].tag} id="${slug}" class="mb-300">`;
     } else if (tokens[index].tag === 'h2') {
-      return `<${tokens[index].tag} id="${slug}" class="mt-500 mb-400">`;
+      return `<${tokens[index].tag} id="${slug}" class="mt-600 mb-300">`;
     } else if (tokens[index].tag === 'h3') {
-      return `<${tokens[index].tag} id="${slug}" class="mt-500 mb-400">`;
+      return `<${tokens[index].tag} id="${slug}" class="mt-600 mb-300">`;
     } else if (tokens[index].tag === 'h4') {
-      return `<${tokens[index].tag} id="${slug}" class="mt-500 mb-400">`;
+      return `<${tokens[index].tag} id="${slug}" class="mt-600 mb-300">`;
     } else {
       return `<${tokens[index].tag} id="${slug}">`;
     }
   };
 
   md.renderer.rules.ordered_list_open = function (tokens, index) {
-    return `<${tokens[index].tag} class="list-decimal mb-400">`;
+    return `<${tokens[index].tag} class="list-decimal mb-300">`;
   };
   md.renderer.rules.bullet_list_open = function (tokens, index) {
-    return `<${tokens[index].tag} class="list-disc mb-400">`;
+    return `<${tokens[index].tag} class="list-disc mb-300">`;
   };
 
   md.renderer.rules.paragraph_open = function (tokens, index) {
-    return `<${tokens[index].tag} class="mb-400">`;
+    return `<${tokens[index].tag} class="mb-300">`;
   };
 };
 

From 7963ff6046c6f9234615736f0003cf311b0807a1 Mon Sep 17 00:00:00 2001
From: Melanie Boeckmann <melanie.bockmann@gmail.com>
Date: Mon, 9 Dec 2024 17:12:38 -0800
Subject: [PATCH 03/11] refactor: update docs site with new typography and
 spacing

---
 .eleventy.js                                  | 10 +--
 examples/component-name/design.md             |  2 +-
 examples/component-name/use-case.md           |  4 +-
 src/fr/composants/Case-a-cocher/base.md       |  2 +-
 .../Case-a-cocher/cas-dutilisation.md         |  4 +-
 src/fr/composants/Case-a-cocher/design.md     |  4 +-
 .../Chemin-de-navigation/cas-dutilisation.md  |  4 +-
 .../composants/Chemin-de-navigation/design.md |  4 +-
 .../cas-dutilisation.md                       |  4 +-
 .../barre-de-navigation-laterale/design.md    |  2 +-
 .../cas-dutilisation.md                       |  4 +-
 .../barre-de-navigation-superieure/design.md  |  2 +-
 .../bascule-de-langue/cas-dutilisation.md     |  4 +-
 src/fr/composants/bascule-de-langue/design.md |  2 +-
 src/fr/composants/boite/base.md               |  6 +-
 src/fr/composants/boite/cas-dutilisation.md   |  4 +-
 src/fr/composants/boite/design.md             |  2 +-
 .../bouton-radio/cas-dutilisation.md          |  4 +-
 src/fr/composants/bouton-radio/design.md      |  2 +-
 src/fr/composants/bouton/base.md              |  6 +-
 src/fr/composants/bouton/cas-dutilisation.md  |  4 +-
 src/fr/composants/bouton/design.md            |  2 +-
 src/fr/composants/carte/cas-dutilisation.md   |  4 +-
 src/fr/composants/carte/design.md             |  2 +-
 .../champ-de-date/cas-dutilisation.md         |  4 +-
 src/fr/composants/champ-de-date/design.md     |  6 +-
 src/fr/composants/champ-de-saisie/base.md     |  2 +-
 .../champ-de-saisie/cas-dutilisation.md       |  6 +-
 src/fr/composants/champ-de-saisie/design.md   |  2 +-
 .../date-de-modification/cas-dutilisation.md  | 24 +++----
 .../composants/date-de-modification/design.md |  2 +-
 src/fr/composants/details/cas-dutilisation.md |  4 +-
 src/fr/composants/details/design.md           |  4 +-
 src/fr/composants/en-tete/base.md             |  2 +-
 src/fr/composants/en-tete/cas-dutilisation.md |  4 +-
 src/fr/composants/en-tete/design.md           |  4 +-
 src/fr/composants/grille/cas-dutilisation.md  |  4 +-
 src/fr/composants/grille/code.md              | 12 ++--
 src/fr/composants/grille/design.md            |  2 +-
 .../groupe-de-boutons-radio/base.md           |  2 +-
 .../cas-dutilisation.md                       |  4 +-
 .../groupe-de-boutons-radio/design.md         |  2 +-
 src/fr/composants/image/cas-dutilisation.md   |  4 +-
 src/fr/composants/image/design.md             |  2 +-
 src/fr/composants/indicateur-detape/base.md   |  2 +-
 .../indicateur-detape/cas-dutilisation.md     |  4 +-
 src/fr/composants/indicateur-detape/design.md |  2 +-
 src/fr/composants/jeu-de-champs/base.md       |  2 +-
 .../jeu-de-champs/cas-dutilisation.md         |  4 +-
 src/fr/composants/jeu-de-champs/design.md     |  2 +-
 src/fr/composants/lien/base.md                |  6 +-
 src/fr/composants/lien/cas-dutilisation.md    |  4 +-
 src/fr/composants/lien/design.md              |  2 +-
 .../masquage-accessible/case-dusage.md        |  4 +-
 src/fr/composants/menu-thematique/base.md     |  2 +-
 .../menu-thematique/cas-dutilisation.md       |  4 +-
 src/fr/composants/menu-thematique/design.md   |  2 +-
 src/fr/composants/message-derreur/base.md     |  2 +-
 .../message-derreur/cas-dutilisation.md       |  4 +-
 src/fr/composants/message-derreur/design.md   |  4 +-
 src/fr/composants/pagination/base.md          |  2 +-
 .../composants/pagination/cas-dutilisation.md |  4 +-
 src/fr/composants/pagination/design.md        | 12 ++--
 .../pied-de-page/cas-dutilisation.md          |  4 +-
 src/fr/composants/pied-de-page/code.md        |  6 +-
 src/fr/composants/pied-de-page/design.md      |  4 +-
 .../composants/recherche/cas-dutilisation.md  |  4 +-
 src/fr/composants/recherche/design.md         |  2 +-
 .../resume-de-erreurs/cas-dutilisation.md     |  4 +-
 src/fr/composants/resume-de-erreurs/design.md |  2 +-
 .../composants/selection/cas-dutilisation.md  |  4 +-
 src/fr/composants/selection/design.md         |  2 +-
 src/fr/composants/signature/base.md           |  4 +-
 .../composants/signature/cas-dutilisation.md  |  8 +--
 src/fr/composants/signature/design.md         | 10 +--
 .../tableau-de-donnees/cas-dutilisation.md    |  4 +-
 .../composants/tableau-de-donnees/design.md   |  2 +-
 .../cas-dutilisation.md                       |  4 +-
 .../televerseur-de-fichiers/design.md         |  2 +-
 src/fr/composants/texte/cas-dutilisation.md   |  4 +-
 src/fr/composants/texte/design.md             |  2 +-
 src/fr/composants/titre/cas-dutilisation.md   |  4 +-
 src/fr/composants/titre/design.md             |  2 +-
 src/fr/composants/zone-de-texte/base.md       |  2 +-
 .../zone-de-texte/cas-dutilisation.md         |  4 +-
 src/fr/composants/zone-de-texte/design.md     |  2 +-
 src/fr/contactez/contactez.md                 |  4 +-
 src/fr/pages/index.md                         | 70 +++++++++----------
 src/fr/simpliquer.md                          | 16 ++---
 .../styles/unites-de-style/unites-de-style.md | 14 ++--
 utils/display-tokens.js                       |  8 +--
 91 files changed, 225 insertions(+), 225 deletions(-)

diff --git a/.eleventy.js b/.eleventy.js
index c90b03b02..72105ca21 100644
--- a/.eleventy.js
+++ b/.eleventy.js
@@ -195,8 +195,8 @@ module.exports = function (eleventyConfig) {
     }
 
     return `
-        <div class="code-showcase mb-400">
-          <textarea class="showcase text-light mb-400 p-400" id="${id}" rows="8" aria-label="${langStrings[lang].code} - ${name}" aria-hidden="true" readonly>${content}</textarea>
+        <div class="code-showcase mb-300">
+          <textarea class="showcase text-light mb-300 p-300" id="${id}" rows="8" aria-label="${langStrings[lang].code} - ${name}" aria-hidden="true" readonly>${content}</textarea>
           <div>
             <gcds-button
               class="showcase-view-button"
@@ -268,7 +268,7 @@ module.exports = function (eleventyConfig) {
         githubLink = 'https://github.com/cds-snc/gcds-components';
       }
       return `
-      <ul class="d-flex flex-wrap gap-400">
+      <ul class="d-flex flex-wrap gap-300">
         ${stageChip} <li class="github-link">
           <gcds-link external href="${githubLink}">${langStrings[locale].github}</gcds-link>
         </li> ${figmaLink}
@@ -278,12 +278,12 @@ module.exports = function (eleventyConfig) {
 
   eleventyConfig.addPairedShortcode(
     'componentPreview',
-    (children, title, padding = 'px-300 py-400', margin = 'my-500') => {
+    (children, title, padding = 'px-225 py-300', margin = 'my-600') => {
       const content = children;
 
       return `
       <div class="${margin} b-sm b-default component-preview" id="component-preview">
-        <p class="container-full font-semibold px-300 py-200 bb-sm b-default bg-light">
+        <p class="container-full font-semibold px-225 py-150 bb-sm b-default bg-light">
           ${title}
         </p>
         <div class="${padding}">
diff --git a/examples/component-name/design.md b/examples/component-name/design.md
index c095f851a..534cf46c8 100644
--- a/examples/component-name/design.md
+++ b/examples/component-name/design.md
@@ -12,6 +12,6 @@ tags: ['{navKey}{locale}', 'design']
   <li><strong>list</strong></li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/{locale}/components/anatomy/gcds-{componentNameSlugEN}-anatomy.svg" alt="An image of the anatomy." />
+<img class="b-sm b-default p-300" src="/images/{locale}/components/anatomy/gcds-{componentNameSlugEN}-anatomy.svg" alt="An image of the anatomy." />
 
 ## {designA11y}
diff --git a/examples/component-name/use-case.md b/examples/component-name/use-case.md
index 9f9c3b375..fed1bfbeb 100644
--- a/examples/component-name/use-case.md
+++ b/examples/component-name/use-case.md
@@ -23,8 +23,8 @@ Use a {componentName}
 
 -
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">{relatedComponents}</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">{relatedComponents}</h2>
 
 <a href="" class="link-light">component</a>
 
diff --git a/src/fr/composants/Case-a-cocher/base.md b/src/fr/composants/Case-a-cocher/base.md
index edfbb4d19..61ec9d9c1 100644
--- a/src/fr/composants/Case-a-cocher/base.md
+++ b/src/fr/composants/Case-a-cocher/base.md
@@ -15,7 +15,7 @@ La case à cocher permet de proposer un ensemble d'options en vue d'une sélecti
 {% docLinks locale stage figma github %}
 {% enddocLinks %}
 
-{% componentPreview "Aperçu du composant de case à cocher" "px-300 pt-400" %}
+{% componentPreview "Aperçu du composant de case à cocher" "px-225 pt-300" %}
 <gcds-fieldset fieldset-id="fieldset" legend="Légende" hint="Texte explicatif/Exemple de message.">
 <gcds-checkbox
   checkbox-id="form-check-1"
diff --git a/src/fr/composants/Case-a-cocher/cas-dutilisation.md b/src/fr/composants/Case-a-cocher/cas-dutilisation.md
index 831a9afc3..c6398053b 100644
--- a/src/fr/composants/Case-a-cocher/cas-dutilisation.md
+++ b/src/fr/composants/Case-a-cocher/cas-dutilisation.md
@@ -27,9 +27,9 @@ Utilisez la case à cocher avec un [jeu de champs]({{ links.fieldset }}) pour po
 - Laisser une personne choisir une ou plusieurs réponses dans une liste définie en cochant les réponses applicables
 - Donner à la personne la possibilité de répondre à la question sans écrire en sélectionnant un ou plusieurs éléments dans une liste.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
 
-  <h2 class="mt-0 mb-400">Composants connexes</h2>
+  <h2 class="mt-0 mb-300">Composants connexes</h2>
 
 Utilisez les <a href="{{ links.radioGroup }}" class="link-light">groupes de boutons radio</a> pour solliciter un choix unique parmi un plus grand ensemble d’options.
 
diff --git a/src/fr/composants/Case-a-cocher/design.md b/src/fr/composants/Case-a-cocher/design.md
index 13cb41b1a..02657e2b9 100644
--- a/src/fr/composants/Case-a-cocher/design.md
+++ b/src/fr/composants/Case-a-cocher/design.md
@@ -17,7 +17,7 @@ date: 'git Last Modified'
   <li>Le <strong>texte explicatif de la case à cocher</strong> communique aux utilisateur·rice·s des renseignements sur le choix.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/fr/components/anatomy/gcds-checkbox-anatomy-with-fieldset.svg" alt="L'anatomie de case à cocher identifiant la légende du jeu de champ et son message d'aide, la coche de sélection, le bouton à cocher, l'étiquette de la case à cocher et le message d'aide de la case à cocher qui forme le composant." />
+<img class="b-sm b-default p-300" src="/images/fr/components/anatomy/gcds-checkbox-anatomy-with-fieldset.svg" alt="L'anatomie de case à cocher identifiant la légende du jeu de champ et son message d'aide, la coche de sélection, le bouton à cocher, l'étiquette de la case à cocher et le message d'aide de la case à cocher qui forme le composant." />
 
 ## Structure de la case à cocher
 
@@ -30,7 +30,7 @@ Utilisez le composant Jeu de champs pour la case à cocher, sauf pour les cases
   <li>Le <strong>texte explicatif de la case à cocher</strong> communique aux utilisateur·rice·s des renseignements sur le choix.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/fr/components/anatomy/gcds-checkbox-anatomy-single.svg" alt="L'anatomie de case à cocher identifiant la coche de sélection, le bouton à cocher, l'étiquette de la case à cocher et le message d'aide de la case à cocher qui forme le composant." />
+<img class="b-sm b-default p-300" src="/images/fr/components/anatomy/gcds-checkbox-anatomy-single.svg" alt="L'anatomie de case à cocher identifiant la coche de sélection, le bouton à cocher, l'étiquette de la case à cocher et le message d'aide de la case à cocher qui forme le composant." />
 
 ## Accessibilité et design des cases à cocher
 
diff --git a/src/fr/composants/Chemin-de-navigation/cas-dutilisation.md b/src/fr/composants/Chemin-de-navigation/cas-dutilisation.md
index 4c963974f..80faff409 100644
--- a/src/fr/composants/Chemin-de-navigation/cas-dutilisation.md
+++ b/src/fr/composants/Chemin-de-navigation/cas-dutilisation.md
@@ -30,8 +30,8 @@ En plus de signaler à un·e visiteur·se son emplacement actuel sur le site et
 - Situer la page actuelle par rapport à sa page parent dans la structure du site;
 - Organiser les sites Web selon une hiérarchie à plus de deux niveaux.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Composants connexes</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Composants connexes</h2>
 
 <a href="{{ links.footer }}" class="link-light">Pied de page</a> : pour placer le pied de page portant l'image de marque du gouvernement du Canada.
 
diff --git a/src/fr/composants/Chemin-de-navigation/design.md b/src/fr/composants/Chemin-de-navigation/design.md
index 11cec8588..dfb2dbff3 100644
--- a/src/fr/composants/Chemin-de-navigation/design.md
+++ b/src/fr/composants/Chemin-de-navigation/design.md
@@ -15,7 +15,7 @@ date: 'git Last Modified'
   <li>Le <strong>lien de la page parent</strong> conduit vers la page parent de la page actuelle. Vous pouvez avoir jusqu'à trois liens vers des pages parents en plus de ceux vers la page d'accueil et la page d'accueil Canada.ca.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/fr/components/anatomy/gcds-breadcrumbs-anatomy.svg" alt="La structure du chemin de navigation qui affiche trois liens de suite avec une icône de flèche entre chacun." />
+<img class="b-sm b-default p-300" src="/images/fr/components/anatomy/gcds-breadcrumbs-anatomy.svg" alt="La structure du chemin de navigation qui affiche trois liens de suite avec une icône de flèche entre chacun." />
 
 ### Structure du chemin de navigation — avec en-tête et titre H1
 
@@ -26,7 +26,7 @@ date: 'git Last Modified'
   <li>Le  <strong>titre H1</strong> est un élément distinct du composant Chemin de navigation. Il indique aux lecteur·rice·s la nature de la page ou du site et sert de repère.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/fr/components/anatomy/gcds-breadcrumbs-anatomy-with-header.svg" alt="La structure du chemin de navigation qui affiche trois liens de suite sous l'en-tête avec une icône de flèche entre chacun." />
+<img class="b-sm b-default p-300" src="/images/fr/components/anatomy/gcds-breadcrumbs-anatomy-with-header.svg" alt="La structure du chemin de navigation qui affiche trois liens de suite sous l'en-tête avec une icône de flèche entre chacun." />
 
 ## Design et accessibilité du chemin de navigation
 
diff --git a/src/fr/composants/barre-de-navigation-laterale/cas-dutilisation.md b/src/fr/composants/barre-de-navigation-laterale/cas-dutilisation.md
index b94941d4c..7a7775379 100644
--- a/src/fr/composants/barre-de-navigation-laterale/cas-dutilisation.md
+++ b/src/fr/composants/barre-de-navigation-laterale/cas-dutilisation.md
@@ -28,8 +28,8 @@ L'utilisation d'une barre de navigation latérale dans un produit est optionnell
 - lorsque vous devez organiser et afficher la structure hiérarchique d'un produit;
 - lorsque vous cherchez à offrir aux utilisateur·rice·s d'un produit une navigation contextuelle en affichant leur emplacement actuel au sein du produit.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Composants connexes</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Composants connexes</h2>
 
 <a href="{{ links.topNav }}" class="link-light">Barre de navigation supérieure</a> pour les sites Web dont l'architecture d'information comporte 1 à 2 niveaux.
 
diff --git a/src/fr/composants/barre-de-navigation-laterale/design.md b/src/fr/composants/barre-de-navigation-laterale/design.md
index 9b37686b7..64d752392 100644
--- a/src/fr/composants/barre-de-navigation-laterale/design.md
+++ b/src/fr/composants/barre-de-navigation-laterale/design.md
@@ -17,7 +17,7 @@ date: 'git Last Modified'
   <li>Le <strong>lien de navigation avec indicateur de page active</strong> met en évidence la page actuelle.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/fr/components/anatomy/gcds-side-nav-anatomy.svg" alt="L'anatomie du composant barre de navigation latérale identifiant le libellé, le lien de navigation, le groupe de navigation, le libellé du groupe de navigation, l'icône de chevron du groupe de navigation, le lien de navigation avec indicateur de page active."/>
+<img class="b-sm b-default p-300" src="/images/fr/components/anatomy/gcds-side-nav-anatomy.svg" alt="L'anatomie du composant barre de navigation latérale identifiant le libellé, le lien de navigation, le groupe de navigation, le libellé du groupe de navigation, l'icône de chevron du groupe de navigation, le lien de navigation avec indicateur de page active."/>
 
 ## Design et accessibilité de la barre de navigation latérale
 
diff --git a/src/fr/composants/barre-de-navigation-superieure/cas-dutilisation.md b/src/fr/composants/barre-de-navigation-superieure/cas-dutilisation.md
index d9acefa7d..10e36fa65 100644
--- a/src/fr/composants/barre-de-navigation-superieure/cas-dutilisation.md
+++ b/src/fr/composants/barre-de-navigation-superieure/cas-dutilisation.md
@@ -28,8 +28,8 @@ La barre de navigation supérieure permet aux visiteur·se·s d'avoir une idée
 - Fournir un mode d'orientation familier;
 - Signaler la page active et la localisation actuelle de la personne sur le site.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Composants connexes</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Composants connexes</h2>
 
 <a href="{{ links.sideNav }}" class="link-light">Barre de navigation latérale</a> : pour les produits avec jusqu'à trois niveaux de navigation, lorsque le contenu principal correspond à une largeur de page étroite.
 
diff --git a/src/fr/composants/barre-de-navigation-superieure/design.md b/src/fr/composants/barre-de-navigation-superieure/design.md
index d5d2ed284..d02f055fc 100644
--- a/src/fr/composants/barre-de-navigation-superieure/design.md
+++ b/src/fr/composants/barre-de-navigation-superieure/design.md
@@ -18,7 +18,7 @@ vers le bas lorsqu'il est développé.</li>
   <li>Le <strong>lien de navigation avec indicateur de page active</strong> met en évidence la page actuelle.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/fr/components/anatomy/gcds-top-nav-anatomy.svg" alt="Un aperçu de la barre de navigation supérieure qui affiche la navigation du site représentée par des cases grises alignées horizontalement. Une case bleue suivie de deux cases grises représentent des liens où la dernière case est mise en surbrillance pour représenter le lien actif." />
+<img class="b-sm b-default p-300" src="/images/fr/components/anatomy/gcds-top-nav-anatomy.svg" alt="Un aperçu de la barre de navigation supérieure qui affiche la navigation du site représentée par des cases grises alignées horizontalement. Une case bleue suivie de deux cases grises représentent des liens où la dernière case est mise en surbrillance pour représenter le lien actif." />
 
 ## Design et accessibilité de la barre de navigation supérieure
 
diff --git a/src/fr/composants/bascule-de-langue/cas-dutilisation.md b/src/fr/composants/bascule-de-langue/cas-dutilisation.md
index 5e31bb8df..f9bd02cf5 100644
--- a/src/fr/composants/bascule-de-langue/cas-dutilisation.md
+++ b/src/fr/composants/bascule-de-langue/cas-dutilisation.md
@@ -28,8 +28,8 @@ Utilisez la bascule de langue pour :
 - permettre aux gens de passer d’une langue à l’autre sans que cela ne les détourne de leur parcours;
 - soutenir les langues officielles en proposant un contenu tout aussi accessible en français qu’en anglais.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Composants connexes</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Composants connexes</h2>
 
 <a href="{{ links.header }}" class="link-light">En-tête</a> : lorsque vous cherchez à placer l'image de marque du gouvernement du Canada dans l'en-tête de la page.
 
diff --git a/src/fr/composants/bascule-de-langue/design.md b/src/fr/composants/bascule-de-langue/design.md
index 980249fcf..48be8af4a 100644
--- a/src/fr/composants/bascule-de-langue/design.md
+++ b/src/fr/composants/bascule-de-langue/design.md
@@ -15,7 +15,7 @@ La bascule de langue est un lien menant vers la même page dans l’autre langue
   <li>La <strong>bascule de langue</strong> est abrégé sur les petits écrans</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/fr/components/anatomy/gcds-lang-toggle-anatomy.svg" alt="Sur les grands écrans, un lien « English ». Sur les plus petits écrans, un lien abrégé « EN »."/>
+<img class="b-sm b-default p-300" src="/images/fr/components/anatomy/gcds-lang-toggle-anatomy.svg" alt="Sur les grands écrans, un lien « English ». Sur les plus petits écrans, un lien abrégé « EN »."/>
 
 ## Design et accessibilité de la bascule de langue
 
diff --git a/src/fr/composants/boite/base.md b/src/fr/composants/boite/base.md
index 4693d1127..004b213dd 100644
--- a/src/fr/composants/boite/base.md
+++ b/src/fr/composants/boite/base.md
@@ -15,13 +15,13 @@ Il s’agit d’un modèle de boîte simple associé à une largeur de contenu f
 {% enddocLinks %}
 
 {% componentPreview "Aperçu du composant de la boîte" %}
-<gcds-container border margin="250" padding="250" size="lg">
+<gcds-container border margin="175" padding="175" size="lg">
 Grande boîte
 </gcds-container>
-<gcds-container border margin="250" padding="250" size="md">
+<gcds-container border margin="175" padding="175" size="md">
 Boîte moyenne
 </gcds-container>
-<gcds-container border margin="250" padding="250" size="sm">
+<gcds-container border margin="175" padding="175" size="sm">
 Petite boîte
 </gcds-container>
 {% endcomponentPreview %}
diff --git a/src/fr/composants/boite/cas-dutilisation.md b/src/fr/composants/boite/cas-dutilisation.md
index f927c8efb..dd9812e6a 100644
--- a/src/fr/composants/boite/cas-dutilisation.md
+++ b/src/fr/composants/boite/cas-dutilisation.md
@@ -30,8 +30,8 @@ Utilisez les boîtes pour :
 - Aider le public à lire le contenu en un coup d’œil en réduisant la longueur totale d’une ligne de texte et en présentant de plus petites doses de contenu.
 - Centrer le contenu dans le contexte d’un écran ou d’une clôture.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Composants connexes</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Composants connexes</h2>
 
 <a href="{{ links.grid }}" class="link-light">Grille</a> pour une colonne réactive et flexible permettant de positionner du contenu sur une page.
 
diff --git a/src/fr/composants/boite/design.md b/src/fr/composants/boite/design.md
index c95bfae2c..6373c116e 100644
--- a/src/fr/composants/boite/design.md
+++ b/src/fr/composants/boite/design.md
@@ -13,7 +13,7 @@ date: 'git Last Modified'
   <li>La <strong>bordure optionnelle</strong> entoure la boîte en indiquant la largeur.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/en/components/anatomy/gcds-container-anatomy.svg" alt="Le composant de boîte avec des numéros indiquant les différentes parties de la structure de la boîte." />
+<img class="b-sm b-default p-300" src="/images/en/components/anatomy/gcds-container-anatomy.svg" alt="Le composant de boîte avec des numéros indiquant les différentes parties de la structure de la boîte." />
 
 ## Design et accessibilité des boîtes
 
diff --git a/src/fr/composants/bouton-radio/cas-dutilisation.md b/src/fr/composants/bouton-radio/cas-dutilisation.md
index 83de44576..66cbac662 100644
--- a/src/fr/composants/bouton-radio/cas-dutilisation.md
+++ b/src/fr/composants/bouton-radio/cas-dutilisation.md
@@ -29,8 +29,8 @@ Utilisez les boutons radio avec un [jeu de champs]({{ links.fieldset }}) pour ef
 - Déterminer les réponses possibles à votre question.
 - Lui donner la capacité de répondre sans avoir à écrire en sélectionnant une option parmi une liste.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Composants connexes</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Composants connexes</h2>
 
 <a href="{{ links.checkbox }}" class="link-light">Cases à cocher</a> lorsque vous prévoyez que l’utilisateur·rice sélectionne plusieurs options parmi une liste d’éléments.
 
diff --git a/src/fr/composants/bouton-radio/design.md b/src/fr/composants/bouton-radio/design.md
index d1d1de5f4..9c758c4fe 100644
--- a/src/fr/composants/bouton-radio/design.md
+++ b/src/fr/composants/bouton-radio/design.md
@@ -18,7 +18,7 @@ nocrawl: true
   <li>Le <strong>texte explicatif du bouton radio</strong> donne plus de renseignements sur le choix.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/fr/components/anatomy/gcds-radio-anatomy.svg" alt="L'anatomie du composant radio identifiant la légende du jeu de champ et son message d'aide, un bouton radio sélectionné, un bouton radio, l'étiquette du bouton radio et son message d'aide qui forme le composant."/>
+<img class="b-sm b-default p-300" src="/images/fr/components/anatomy/gcds-radio-anatomy.svg" alt="L'anatomie du composant radio identifiant la légende du jeu de champ et son message d'aide, un bouton radio sélectionné, un bouton radio, l'étiquette du bouton radio et son message d'aide qui forme le composant."/>
 
 ## Accessibilité et design des boutons radio
 
diff --git a/src/fr/composants/bouton/base.md b/src/fr/composants/bouton/base.md
index 8b5558fbd..16e252cde 100644
--- a/src/fr/composants/bouton/base.md
+++ b/src/fr/composants/bouton/base.md
@@ -16,7 +16,7 @@ Le bouton est un composant interactif qui met en évidence une action importante
 {% enddocLinks %}
 
 {% componentPreview "Aperçu du composant de bouton" %}
-<gcds-button class="me-400" button-role="primary">Soumettre</gcds-button>
-<gcds-button class="me-400" button-role="secondary">Annuler</gcds-button>
-<gcds-button class="me-400" button-role="danger">Supprimer</gcds-button>
+<gcds-button class="me-300" button-role="primary">Soumettre</gcds-button>
+<gcds-button class="me-300" button-role="secondary">Annuler</gcds-button>
+<gcds-button class="me-300" button-role="danger">Supprimer</gcds-button>
 {% endcomponentPreview %}
diff --git a/src/fr/composants/bouton/cas-dutilisation.md b/src/fr/composants/bouton/cas-dutilisation.md
index ebb15809d..c7f3cd550 100644
--- a/src/fr/composants/bouton/cas-dutilisation.md
+++ b/src/fr/composants/bouton/cas-dutilisation.md
@@ -28,8 +28,8 @@ Utilisez un bouton pour les actions importantes qu'une personne utilisant votre
 - Entamer un processus, comme un tutoriel, ou se connecter à un espace sécurisé;
 - Naviguer entre les différentes étapes d'une séquence;
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Composants connexes</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Composants connexes</h2>
 
 <a href="{{ links.link }}" class="link-light">Liens</a> : pour permettre de naviguer à une nouvelle page, à un autre site Web, à un fichier ou à une nouvelle section de la page actuelle et de lancer un téléchargement de fichiers.
 
diff --git a/src/fr/composants/bouton/design.md b/src/fr/composants/bouton/design.md
index fecdc02a2..f1a5f8ccd 100644
--- a/src/fr/composants/bouton/design.md
+++ b/src/fr/composants/bouton/design.md
@@ -14,7 +14,7 @@ date: 'git Last Modified'
   <li>L'<strong>icône</strong> est facultative et peut être utile comme support visuel lorsqu'elle utilisée de manière uniforme et modérée. Lorsqu'il y a une icône, alignez le texte du bouton à la gauche.  Évitez d'utiliser une icône sans texte.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/fr/components/anatomy/gcds-button-anatomy.svg" alt="L'anatomie d'un bouton identifiant l'étiquette, le conteneur et l'icone qui forme le composant." />
+<img class="b-sm b-default p-300" src="/images/fr/components/anatomy/gcds-button-anatomy.svg" alt="L'anatomie d'un bouton identifiant l'étiquette, le conteneur et l'icone qui forme le composant." />
 
 ## Accessibilité et design des boutons
 
diff --git a/src/fr/composants/carte/cas-dutilisation.md b/src/fr/composants/carte/cas-dutilisation.md
index 7674a3955..f2d7b0172 100644
--- a/src/fr/composants/carte/cas-dutilisation.md
+++ b/src/fr/composants/carte/cas-dutilisation.md
@@ -31,8 +31,8 @@ Utilisez une carte pour :
 
 Remarque : Pour Canada.ca, évitez d'utiliser des cartes au lieu du menu d'accueil thématique inclu dans les modèles de page d'accueil et de page de thème et de sujet.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Composants connexes</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Composants connexes</h2>
 
 <a href="{{ links.details }}" class="link-light">Détails</a> pour dissimuler des renseignements secondaires qu'une personne peut développer sur la même page.
 
diff --git a/src/fr/composants/carte/design.md b/src/fr/composants/carte/design.md
index 0a1438629..05a2d1ae5 100644
--- a/src/fr/composants/carte/design.md
+++ b/src/fr/composants/carte/design.md
@@ -16,7 +16,7 @@ date: 'git Last Modified'
   <li>La <strong>description</strong> (facultative) contient du texte destiné à accompagner le titre. Elle résume en quelques lignes le sujet de la carte ou affiche une liste de renseignements sur un même sujet, comme les informations sur un évènement.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/fr/components/anatomy/gcds-card-anatomy.svg" alt="La structure d'une carte représentée par 5 éléments: la boîte, le badge, l'image, le titre et la description."/>
+<img class="b-sm b-default p-300" src="/images/fr/components/anatomy/gcds-card-anatomy.svg" alt="La structure d'une carte représentée par 5 éléments: la boîte, le badge, l'image, le titre et la description."/>
 
 ## Design et accessibilité des cartes
 
diff --git a/src/fr/composants/champ-de-date/cas-dutilisation.md b/src/fr/composants/champ-de-date/cas-dutilisation.md
index 74e3a7d06..bf896af98 100644
--- a/src/fr/composants/champ-de-date/cas-dutilisation.md
+++ b/src/fr/composants/champ-de-date/cas-dutilisation.md
@@ -28,8 +28,8 @@ Utilisez un champ de date pour recueillir une date lorsque vous attendez d’une
 - Une date qui n’inclut pas le jour précis de la semaine.
 - Évitez d’utiliser un champ de date si la date n’est pas connue de la personne. Utilisez alors un sélecteur de date.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Composants connexes</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Composants connexes</h2>
 
   <a href="{{ links.input }}" class="link-light">Champs de saisie</a> : lorsque vous voulez que la personne saisisse seulement une année ou un jour du mois.
 
diff --git a/src/fr/composants/champ-de-date/design.md b/src/fr/composants/champ-de-date/design.md
index 30309aa81..6f6df3fb3 100644
--- a/src/fr/composants/champ-de-date/design.md
+++ b/src/fr/composants/champ-de-date/design.md
@@ -18,12 +18,12 @@ date: "git Last Modified"
   <li>Le <strong>champ de saisie</strong> de l’année comporte 4 chiffres.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/fr/components/anatomy/gcds-date-input-anatomy.svg" alt="L’anatomie du champ de date représentée par 6 éléments: la légende du jeu de champs, l’étiquette Jour, le champ de saisir du jour, l’étiquette Mois, le champ de sélection du mois, l’étiquette année et le champ de saisie de l’année." />
+<img class="b-sm b-default p-300" src="/images/fr/components/anatomy/gcds-date-input-anatomy.svg" alt="L’anatomie du champ de date représentée par 6 éléments: la légende du jeu de champs, l’étiquette Jour, le champ de saisir du jour, l’étiquette Mois, le champ de sélection du mois, l’étiquette année et le champ de saisie de l’année." />
 
 ## Accessibilité et design des champ de date
 
 ### Favorisez la réussite de la tâche à l’aide d’un texte explicatif
-- Utilisez un texte explicatif dans la légende du jeu de champs pour aider une personne à comprendre le format de date qu’elle peut utiliser. Par exemple, le texte explicatif « 7 septembre » plutôt que « 07 septembre » indique qu’un chiffre unique, non précédé d’un zéro, suffit. 
+- Utilisez un texte explicatif dans la légende du jeu de champs pour aider une personne à comprendre le format de date qu’elle peut utiliser. Par exemple, le texte explicatif « 7 septembre » plutôt que « 07 septembre » indique qu’un chiffre unique, non précédé d’un zéro, suffit.
 
 ### Rédigez des messages d’erreur précis
-- Rédigez des messages d’erreur pour chaque champ de la date. Ces messages doivent renseigner sur les informations manquantes ou les erreurs de format. Par exemple, si une personne a saisi une année de 2 chiffres, indiquez que l’année doit comporter 4 chiffres. 
+- Rédigez des messages d’erreur pour chaque champ de la date. Ces messages doivent renseigner sur les informations manquantes ou les erreurs de format. Par exemple, si une personne a saisi une année de 2 chiffres, indiquez que l’année doit comporter 4 chiffres.
diff --git a/src/fr/composants/champ-de-saisie/base.md b/src/fr/composants/champ-de-saisie/base.md
index 48318d7a4..894549371 100644
--- a/src/fr/composants/champ-de-saisie/base.md
+++ b/src/fr/composants/champ-de-saisie/base.md
@@ -15,7 +15,7 @@ Un champ de saisie est un espace permettant de saisir une courte réponse à une
 {% docLinks locale stage figma github %}
 {% enddocLinks %}
 
-{% componentPreview "Aperçu du composant de champ de saisie" "px-300 pt-400" %}
+{% componentPreview "Aperçu du composant de champ de saisie" "px-225 pt-300" %}
 <gcds-input input-id="input-example" label="Étiquette de champ" hint="Texte explicatif / Exemple de message.">
 </gcds-input>
 {% endcomponentPreview %}
diff --git a/src/fr/composants/champ-de-saisie/cas-dutilisation.md b/src/fr/composants/champ-de-saisie/cas-dutilisation.md
index 70746d6d8..70e1026b3 100644
--- a/src/fr/composants/champ-de-saisie/cas-dutilisation.md
+++ b/src/fr/composants/champ-de-saisie/cas-dutilisation.md
@@ -31,8 +31,8 @@ Utilisez un champ de saisie lorsque vous attendez de l'utilisateur·rice une ré
 
 Remarque : Ne recueillez que les renseignements que vous êtes autorisé·e à traiter et veillez à les protéger conformément aux normes du gouvernement du Canada.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Composants connexes</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Composants connexes</h2>
 
 <a href="{{ links.textarea }}" class="link-light">Zone de texte</a> : lorsque vous cherchez à obtenir une réponse libre de plusieurs lignes.
 
@@ -60,7 +60,7 @@ Utilisez cette option s'il n'existe pas déjà un autre type de champ de saisie
 ### Saisie de mot de passe
 
 - Pour la collecte et la validation de mots de passe.
-- Pour définir des contraintes spécifiques aux mots de passe.  
+- Pour définir des contraintes spécifiques aux mots de passe.
 
 Conseil :  Indiquez toute contrainte liée au mot de passe dans le texte explicatif du champ de saisie afin que les personnes sachent exactement quelles sont les règles.
 
diff --git a/src/fr/composants/champ-de-saisie/design.md b/src/fr/composants/champ-de-saisie/design.md
index 4b396c837..101a1c975 100644
--- a/src/fr/composants/champ-de-saisie/design.md
+++ b/src/fr/composants/champ-de-saisie/design.md
@@ -14,7 +14,7 @@ date: 'git Last Modified'
   <li>Le <strong>champ</strong> est la boîte avec laquelle l'utilisateur·rice interagit pour fournir sa réponse.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/fr/components/anatomy/gcds-input-anatomy.svg" alt="L'anatomie du champ de saisie identifiant l'étiquette, le message d'aide et le champ qui forme le composant."/>
+<img class="b-sm b-default p-300" src="/images/fr/components/anatomy/gcds-input-anatomy.svg" alt="L'anatomie du champ de saisie identifiant l'étiquette, le message d'aide et le champ qui forme le composant."/>
 
 ## Conception et accessibilité des champs de saisie
 
diff --git a/src/fr/composants/date-de-modification/cas-dutilisation.md b/src/fr/composants/date-de-modification/cas-dutilisation.md
index 522aeb7d0..7a32c1c09 100644
--- a/src/fr/composants/date-de-modification/cas-dutilisation.md
+++ b/src/fr/composants/date-de-modification/cas-dutilisation.md
@@ -26,8 +26,8 @@ Utilisez la date de modification pour :
 - Indiquer la date de la dernière modification apportée à une page Web;
 - Identifier la version actuelle d'une application.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Composants connexes</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Composants connexes</h2>
 
 <a href="{{ links.footer }}" class="link-light">Pied de page</a> : pour placer le pied de page portant l'image de marque du gouvernement du Canada.
 
@@ -36,27 +36,27 @@ Utilisez la date de modification pour :
 ## Types de composants
 
 <div class="remove-empty-p">
-<gcds-grid columns="1fr" columns-tablet="1fr 2fr" gap="500" align-items="start">
-  {% componentPreview "Aperçu du le type date" "px-300 py-400" "" %}
+<gcds-grid columns="1fr" columns-tablet="1fr 2fr" align-items="start">
+  {% componentPreview "Aperçu du le type date" "px-225 py-300" "" %}
   <gcds-date-modified>2023-08-22</gcds-date-modified>
   {% endcomponentPreview %}
   <div>
-    <h3 class="mb-400">Type « Date »</h3>
-    <p class="mb-400">Utilisez le type « date » pour :</p>
-    <ul class="list-disc mb-400">
+    <h3 class="mb-300">Type « Date »</h3>
+    <p class="mb-300">Utilisez le type « date » pour :</p>
+    <ul class="list-disc mb-300">
       <li>Indiquer la date de la dernière modification apportée à une page ou à un site Web.</li>
     </ul>
   </div>
 </gcds-grid>
 <br/>
-<gcds-grid columns="1fr" columns-tablet="1fr 2fr" gap="500" align-items="start">
-  {% componentPreview "Aperçu du le type version" "px-300 py-400" "" %}
+<gcds-grid columns="1fr" columns-tablet="1fr 2fr" align-items="start">
+  {% componentPreview "Aperçu du le type version" "px-225 py-300" "" %}
   <gcds-date-modified type="version">1.0.0</gcds-date-modified>
   {% endcomponentPreview %}
   <div>
-    <h3 class="mb-400">Type « Version »</h3>
-    <p class="mb-400">Utilisez le type « version » pour :</p>
-    <ul class="list-disc mb-400">
+    <h3 class="mb-300">Type « Version »</h3>
+    <p class="mb-300">Utilisez le type « version » pour :</p>
+    <ul class="list-disc mb-300">
       <li>Identifier la version actuelle d'une application.</li>
     </ul>
   </div>
diff --git a/src/fr/composants/date-de-modification/design.md b/src/fr/composants/date-de-modification/design.md
index 9f9166528..fbb524273 100644
--- a/src/fr/composants/date-de-modification/design.md
+++ b/src/fr/composants/date-de-modification/design.md
@@ -13,7 +13,7 @@ date: 'git Last Modified'
   <li>La <strong>valeur</strong> correspond soit à une date numérique au format AAAA-MM-JJ, soit à un numéro de version.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/fr/components/anatomy/gcds-date-modified-anatomy.svg" alt="Une image du composant date de modification." />
+<img class="b-sm b-default p-300" src="/images/fr/components/anatomy/gcds-date-modified-anatomy.svg" alt="Une image du composant date de modification." />
 
 ## Design et accessibilité de la date de modification
 
diff --git a/src/fr/composants/details/cas-dutilisation.md b/src/fr/composants/details/cas-dutilisation.md
index 537a73ad5..02186cd24 100644
--- a/src/fr/composants/details/cas-dutilisation.md
+++ b/src/fr/composants/details/cas-dutilisation.md
@@ -28,8 +28,8 @@ Utilisez le composant Détails pour offrir un aperçu du contenu plus détaillé
 - permettre de lire rapidement une page comportant de nombreux sous-titres. Prenons l'exemple d'une série de questions et de réponses : vous pouvez présenter les questions comme les titres d'un composant Détails et permettre ainsi à la personne d'afficher n'importe quelle section pour lire le contenu de la réponse;
 - donner au lectorat la possibilité de contrôler le contenu pour les sujets pouvant bouleverser certaines personnes. Celles-ci peuvent accéder au contenu une fois qu'elles se sentent prêtes et le dissimuler une fois qu'elles l'ont vu.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Composants connexes </h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Composants connexes </h2>
 
 Onglets : lorsque vous souhaitez remplacer tout le contenu d'une section ou d'une page.
 
diff --git a/src/fr/composants/details/design.md b/src/fr/composants/details/design.md
index 5afc63906..bc1c1846d 100644
--- a/src/fr/composants/details/design.md
+++ b/src/fr/composants/details/design.md
@@ -18,11 +18,11 @@ Voici la structure du composant Détails ouvert. Le contenu est réduit par déf
 
 ### Composant Détails ouvert
 
-<img class="b-sm b-default p-400" src="/images/fr/components/anatomy/gcds-details-anatomy-open.svg" alt="L'anatomie du composant en savoir plus identifiant l'icône, une flèche pointant vers le bas, le titre du lien en savoir plus sur ce sujet et le contenu représenté par du texte information additionnelle." />
+<img class="b-sm b-default p-300" src="/images/fr/components/anatomy/gcds-details-anatomy-open.svg" alt="L'anatomie du composant en savoir plus identifiant l'icône, une flèche pointant vers le bas, le titre du lien en savoir plus sur ce sujet et le contenu représenté par du texte information additionnelle." />
 
 ### Composant Détails fermé
 
-<img class="b-sm b-default p-400" src="/images/fr/components/anatomy/gcds-details-anatomy-closed.svg" alt="L'anatomie du composant en savoir plus identifiant l'icône, une flèche pointant vers la droite et le titre du lien en savoir plus sur ce sujet." />
+<img class="b-sm b-default p-300" src="/images/fr/components/anatomy/gcds-details-anatomy-closed.svg" alt="L'anatomie du composant en savoir plus identifiant l'icône, une flèche pointant vers la droite et le titre du lien en savoir plus sur ce sujet." />
 
 ## Conception et accessibilité du composant Détails
 
diff --git a/src/fr/composants/en-tete/base.md b/src/fr/composants/en-tete/base.md
index d0ea85da1..e113b1ef7 100644
--- a/src/fr/composants/en-tete/base.md
+++ b/src/fr/composants/en-tete/base.md
@@ -15,7 +15,7 @@ L'en-tête porte l'image de marque réactive du gouvernement du Canada.
 {% docLinks locale stage figma github %}
 {% enddocLinks %}
 
-{% componentPreview "Aperçu du composant de l'en-tête" "px-300 pt-400 pb-200" %}
+{% componentPreview "Aperçu du composant de l'en-tête" "px-225 pt-300 pb-150" %}
 <gcds-header lang-href="#" skip-to-href="#">
 </gcds-header>
 {% endcomponentPreview %}
diff --git a/src/fr/composants/en-tete/cas-dutilisation.md b/src/fr/composants/en-tete/cas-dutilisation.md
index c174495f5..567648c9e 100644
--- a/src/fr/composants/en-tete/cas-dutilisation.md
+++ b/src/fr/composants/en-tete/cas-dutilisation.md
@@ -29,8 +29,8 @@ Pour les applications, formulaires et autres services numériques transactionnel
 - Un service ou produit numérique du gouvernement du Canada offrant une vaste gamme de services et de renseignements;
 - La signature du Programme fédéral de l'image de marque du gouvernement du Canada.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Composants connexes</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Composants connexes</h2>
 
 <a href="{{ links.footer }}" class="link-light">Pied de page</a> : lorsque vous cherchez à placer l'image de marque du gouvernement du Canada en pied de page.
 
diff --git a/src/fr/composants/en-tete/design.md b/src/fr/composants/en-tete/design.md
index ae957e13e..9e6bf98a1 100644
--- a/src/fr/composants/en-tete/design.md
+++ b/src/fr/composants/en-tete/design.md
@@ -14,7 +14,7 @@ date: 'git Last Modified'
   <li>Le composant de la <strong>bascule de langue</strong> est un commutateur du contenu en français et en anglais. Utilisez l'attribut <code>lang</code> pour définir la langue du site; le bouton à bascule proposera l'autre langue officielle.</li>
 </ol>
 
-<img class="b-sm b-default mb-500 p-400" src="/images/fr/components/anatomy/gcds-header-anatomy-recommended.svg" alt="L'anatomie des composants entête et menu du site identifiants le lien passer au contenu, et l'entête du gouvernement du Canada."/>
+<img class="b-sm b-default mb-600 p-300" src="/images/fr/components/anatomy/gcds-header-anatomy-recommended.svg" alt="L'anatomie des composants entête et menu du site identifiants le lien passer au contenu, et l'entête du gouvernement du Canada."/>
 
 ## Éléments facultatifs de l'en-tête — avec titre H1
 
@@ -30,7 +30,7 @@ date: 'git Last Modified'
 
 L'élément de **recherche** permet d'inclure un champ de recherche locale ou générale.
 
-<img class="b-sm b-default mb-500 p-400" src="/images/fr/components/anatomy/gcds-header-anatomy-optional.svg" alt="L'anatomie des composants entête et menu du site identifiants le lien passer au contenu, la bannière de phase, l'entête du gouvernement du Canada et le menu du site."/>
+<img class="b-sm b-default mb-600 p-300" src="/images/fr/components/anatomy/gcds-header-anatomy-optional.svg" alt="L'anatomie des composants entête et menu du site identifiants le lien passer au contenu, la bannière de phase, l'entête du gouvernement du Canada et le menu du site."/>
 
 ## Design et accessibilité de l'en-tête
 
diff --git a/src/fr/composants/grille/cas-dutilisation.md b/src/fr/composants/grille/cas-dutilisation.md
index 4d90880b6..753350b08 100644
--- a/src/fr/composants/grille/cas-dutilisation.md
+++ b/src/fr/composants/grille/cas-dutilisation.md
@@ -32,8 +32,8 @@ Utilisez des grilles pour :
 - Assurer une adaptation à différentes tailles d'écran en définissant une mise en page personnalisée et optimisée pour différentes fenêtres d'affichage, comme pour les mobiles, les tablettes et les ordinateurs de bureau.
 - Limiter la largeur du contenu affiché pour veiller à ce que le texte soit renvoyé à la ligne et plus lisible.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Composants connexes</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Composants connexes</h2>
 
 <a href="{{ links.container }}" class="link-light">Boîte</a> : pour appliquer une disposition de base à une seule colonne sur toutes les fenêtres d'affichage.
 
diff --git a/src/fr/composants/grille/code.md b/src/fr/composants/grille/code.md
index 73b8597aa..6dcd6abbb 100644
--- a/src/fr/composants/grille/code.md
+++ b/src/fr/composants/grille/code.md
@@ -40,7 +40,7 @@ Désactivez la définition de la largeur minimale et de la largeur maximale lors
 
 Ordinateur de bureau
 
-<div class="b-sm mb-400 p-400">
+<div class="b-sm mb-300 p-300">
   <gcds-grid tag="article" columns-desktop="1fr 1fr 1fr" columns-tablet="1fr 1fr" columns="1fr">
     <p>Ceci est un exemple de contenu pour illustrer le composant Grille.</p>
     <p>Ceci est un exemple de contenu pour illustrer le composant Grille.</p>
@@ -50,7 +50,7 @@ Ordinateur de bureau
 
 Tablette
 
-<div class="b-sm mb-400 p-400">
+<div class="b-sm mb-300 p-300">
   <gcds-grid tag="article" columns-tablet="1fr 1fr" columns="1fr">
     <p>Ceci est un exemple de contenu pour illustrer le composant Grille.</p>
     <p>Ceci est un exemple de contenu pour illustrer le composant Grille.</p>
@@ -60,7 +60,7 @@ Tablette
 
 Mobile
 
-<div class="b-sm p-400">
+<div class="b-sm p-300">
   <gcds-grid tag="article" columns="1fr">
     <p>Ceci est un exemple de contenu pour illustrer le composant Grille.</p>
     <p>Ceci est un exemple de contenu pour illustrer le composant Grille.</p>
@@ -86,7 +86,7 @@ Définissez la largeur minimale et la largeur maximale pour concevoir des colonn
 
 Ordinateur de bureau
 
-<div class="showcase-preview b-sm mb-400 p-400">
+<div class="showcase-preview b-sm mb-300 p-300">
   <gcds-grid tag="article" columns="repeat(auto-fit, minmax(100px, 300px))">
     <p>Ceci est un exemple de contenu pour illustrer le composant Grille.</p>
     <p>Ceci est un exemple de contenu pour illustrer le composant Grille.</p>
@@ -96,7 +96,7 @@ Ordinateur de bureau
 
 Tablette
 
-<div class="showcase-preview b-sm mb-400 p-400">
+<div class="showcase-preview b-sm mb-300 p-300">
   <div class="container-md">
     <gcds-grid tag="article" columns="repeat(auto-fit, minmax(100px, 300px))">
       <p>Ceci est un exemple de contenu pour illustrer le composant Grille.</p>
@@ -108,7 +108,7 @@ Tablette
 
 Mobile
 
-<div class="showcase-preview b-sm p-400">
+<div class="showcase-preview b-sm p-300">
   <div class="container-sm">
     <gcds-grid tag="article" columns="repeat(auto-fit, minmax(100px, 300px))">
       <p>Ceci est un exemple de contenu pour illustrer le composant Grille.</p>
diff --git a/src/fr/composants/grille/design.md b/src/fr/composants/grille/design.md
index a2dcbe25f..3d4e37de7 100644
--- a/src/fr/composants/grille/design.md
+++ b/src/fr/composants/grille/design.md
@@ -13,7 +13,7 @@ date: 'git Last Modified'
   <li>La <strong>colonne</strong> , également appelée élément de grille, définit une limite autour de son contenu pour le maintenir dans la largeur définie pour cette colonne.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/fr/components/anatomy/gcds-grid-anatomy.svg" alt="Image montrant la structure d'une grille avec quatre rectangles distincts représentant les colonnes d'une grille." />
+<img class="b-sm b-default p-300" src="/images/fr/components/anatomy/gcds-grid-anatomy.svg" alt="Image montrant la structure d'une grille avec quatre rectangles distincts représentant les colonnes d'une grille." />
 
 ## Design et accessibilité des grilles
 
diff --git a/src/fr/composants/groupe-de-boutons-radio/base.md b/src/fr/composants/groupe-de-boutons-radio/base.md
index 2ebce13a9..c540566eb 100644
--- a/src/fr/composants/groupe-de-boutons-radio/base.md
+++ b/src/fr/composants/groupe-de-boutons-radio/base.md
@@ -15,7 +15,7 @@ Le groupe de boutons radio est un ensemble d’options permettant une sélection
 {% docLinks locale stage figma github %}
 {% enddocLinks %}
 
-{% componentPreview "Aperçu du composant du groupe de boutons radio" "px-300 pt-400 pb-200" %}
+{% componentPreview "Aperçu du composant du groupe de boutons radio" "px-225 pt-300 pb-150" %}
 <gcds-fieldset fieldset-id="fieldset" legend="Legend" hint="Texte explicatif/Exemple de message.">
 <gcds-radio-group name="radio" options='[{"id":"form-radio-1","label":"Libellé 1","hint":"Ceci est une description ou un exemple à titre de clarification."},{"id":"form-radio-2","label":"Libellé 2","hint":"Ceci est une description ou un exemple à titre de clarification."}]'>
 </gcds-radio-group>
diff --git a/src/fr/composants/groupe-de-boutons-radio/cas-dutilisation.md b/src/fr/composants/groupe-de-boutons-radio/cas-dutilisation.md
index e46e2e4c7..53a440456 100644
--- a/src/fr/composants/groupe-de-boutons-radio/cas-dutilisation.md
+++ b/src/fr/composants/groupe-de-boutons-radio/cas-dutilisation.md
@@ -29,8 +29,8 @@ Utilisez un groupe de boutons radio avec un [jeu de champs]({{ links.fieldset }}
 - Déterminer les réponses possibles à votre question.
 - Lui donner la capacité de répondre sans avoir à écrire en sélectionnant une option parmi une liste.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Composants connexes</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Composants connexes</h2>
 
 <a href="{{ links.checkbox }}" class="link-light">Cases à cocher</a> lorsque vous prévoyez que l’utilisateur·rice sélectionne plusieurs options parmi une liste d’éléments.
 
diff --git a/src/fr/composants/groupe-de-boutons-radio/design.md b/src/fr/composants/groupe-de-boutons-radio/design.md
index fb11bf78e..f87e0430d 100644
--- a/src/fr/composants/groupe-de-boutons-radio/design.md
+++ b/src/fr/composants/groupe-de-boutons-radio/design.md
@@ -17,7 +17,7 @@ date: "git Last Modified"
   <li>Le <strong>texte explicatif du bouton radio</strong> donne plus de renseignements sur le choix.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/fr/components/anatomy/gcds-radio-group-anatomy.svg" alt="Structure du groupe de boutons radio accompagnée des étiquettes « Légende du jeu de champ », « Texte explicatif du jeu de champ », « Coche », « Libellé du bouton radio », « Bouton radio » et « Texte explicatif du bouton radio »."/>
+<img class="b-sm b-default p-300" src="/images/fr/components/anatomy/gcds-radio-group-anatomy.svg" alt="Structure du groupe de boutons radio accompagnée des étiquettes « Légende du jeu de champ », « Texte explicatif du jeu de champ », « Coche », « Libellé du bouton radio », « Bouton radio » et « Texte explicatif du bouton radio »."/>
 
 ## Accessibilité et design des boutons radio
 
diff --git a/src/fr/composants/image/cas-dutilisation.md b/src/fr/composants/image/cas-dutilisation.md
index 205b8b61f..893ccb2d0 100644
--- a/src/fr/composants/image/cas-dutilisation.md
+++ b/src/fr/composants/image/cas-dutilisation.md
@@ -25,8 +25,8 @@ Use a Image
 
 -
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Composants connexes</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Composants connexes</h2>
 
 <a href="" class="link-light">component</a>
 
diff --git a/src/fr/composants/image/design.md b/src/fr/composants/image/design.md
index 4a1001382..bdb9d3b1b 100644
--- a/src/fr/composants/image/design.md
+++ b/src/fr/composants/image/design.md
@@ -13,6 +13,6 @@ nocrawl: true
   <li><strong>list</strong></li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/{local}/components/anatomy/gcds-image-anatomy.svg" alt="An image of the anatomy." />
+<img class="b-sm b-default p-300" src="/images/{local}/components/anatomy/gcds-image-anatomy.svg" alt="An image of the anatomy." />
 
 ## Accessibilité et design des Image
diff --git a/src/fr/composants/indicateur-detape/base.md b/src/fr/composants/indicateur-detape/base.md
index d3a87e079..acc06045f 100644
--- a/src/fr/composants/indicateur-detape/base.md
+++ b/src/fr/composants/indicateur-detape/base.md
@@ -15,6 +15,6 @@ L'indicateur d'étape est un marqueur de progression pour un processus à plusie
 {% docLinks locale stage figma github %}
 {% enddocLinks %}
 
-{% componentPreview "Aperçu du composant indicateur d'étape" "px-300 pt-400 pb-100" %}
+{% componentPreview "Aperçu du composant indicateur d'étape" "px-225 pt-300 pb-75" %}
 <gcds-stepper current-step="1" total-steps="4">Titre de la section</gcds-stepper>
 {% endcomponentPreview %}
diff --git a/src/fr/composants/indicateur-detape/cas-dutilisation.md b/src/fr/composants/indicateur-detape/cas-dutilisation.md
index f2d5f276c..d0d662c3f 100644
--- a/src/fr/composants/indicateur-detape/cas-dutilisation.md
+++ b/src/fr/composants/indicateur-detape/cas-dutilisation.md
@@ -26,8 +26,8 @@ Utilisez un indicateur d'étape pour une séquence logique répartie sur plus d'
 - Montrer à une personne à quelle étape elle se trouve dans un processus, par exemple un formulaire à plusieurs étapes.
 - Préciser la structure d'un chemin en indiquant le nombre total d'étapes.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Composants connexes</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Composants connexes</h2>
 
 <a href="{{ links.pagination }}" class="link-light">Le composant Pagination</a> est utilisé lorsqu'une personne doit parcourir une liste de pages qui ne font pas partie d'un processus à plusieurs étapes. Il permet de sélectionner la page suivante ou précédente.
 
diff --git a/src/fr/composants/indicateur-detape/design.md b/src/fr/composants/indicateur-detape/design.md
index 81cc6900c..22e4ed376 100644
--- a/src/fr/composants/indicateur-detape/design.md
+++ b/src/fr/composants/indicateur-detape/design.md
@@ -14,7 +14,7 @@ date: 'git Last Modified'
   <li>Le <strong>titre d'étape</strong> décrit le type d'information qui sera demandé au cours de l'étape actuelle.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/fr/components/anatomy/gcds-stepper-anatomy.svg" alt="La structure de l'indicateur d'étape représentée par trois éléments: l'étape actuelle, le nombre total d'étapes et le titre de l'étape actuelle." />
+<img class="b-sm b-default p-300" src="/images/fr/components/anatomy/gcds-stepper-anatomy.svg" alt="La structure de l'indicateur d'étape représentée par trois éléments: l'étape actuelle, le nombre total d'étapes et le titre de l'étape actuelle." />
 
 ## Conception et accessibilité de l'indicateur d'étape
 
diff --git a/src/fr/composants/jeu-de-champs/base.md b/src/fr/composants/jeu-de-champs/base.md
index f1188a80b..1651910b6 100644
--- a/src/fr/composants/jeu-de-champs/base.md
+++ b/src/fr/composants/jeu-de-champs/base.md
@@ -15,7 +15,7 @@ Un jeu de champs est un groupe de plusieurs composants ou éléments d'un formul
 {% docLinks locale stage figma github %}
 {% enddocLinks %}
 
-{% componentPreview "Aperçu du composant de jeu de champs" "px-300 pt-400" %}
+{% componentPreview "Aperçu du composant de jeu de champs" "px-225 pt-300" %}
 <gcds-fieldset fieldset-id="fieldset" legend="Légende" hint="Texte explicatif/Exemple de message.">
 <gcds-input input-id="form-input" label="Étiquette de champ" hint="Texte explicatif/Exemple de message." size="6">
 </gcds-input>
diff --git a/src/fr/composants/jeu-de-champs/cas-dutilisation.md b/src/fr/composants/jeu-de-champs/cas-dutilisation.md
index 0e12515b1..9a5fc86f4 100644
--- a/src/fr/composants/jeu-de-champs/cas-dutilisation.md
+++ b/src/fr/composants/jeu-de-champs/cas-dutilisation.md
@@ -27,8 +27,8 @@ Utilisez un jeu de champs pour regrouper les éléments ou composants d’un for
 - Lorsque plusieurs questions d’un flux portent sur le même sujet, comme un ensemble de [champs de saisie]({{ links.input }}) ou une autre combinaison de composants de formulaire.
 - Lorsque le regroupement logique des éléments ou composants du formulaire aide à favoriser la compréhension et l’utilisabilité.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Composants connexes</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Composants connexes</h2>
 
 <a href="{{ links.input }}" class="link-light">Champs de saisie</a> ou <a href="{{ links.textarea }}" class="link-light">zones de texte</a> : lorsqu’une réponse écrite est demandée.
 
diff --git a/src/fr/composants/jeu-de-champs/design.md b/src/fr/composants/jeu-de-champs/design.md
index fcd2df27a..03554088e 100644
--- a/src/fr/composants/jeu-de-champs/design.md
+++ b/src/fr/composants/jeu-de-champs/design.md
@@ -16,7 +16,7 @@ Un jeu de champs combine les éléments `<fieldset>` et `<legend>` afin de regro
   <li>Le <strong>regroupement des composants</strong> comprend des éléments de chaque composant du jeu de champs.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/fr/components/anatomy/gcds-fieldset-anatomy.svg" alt="L'anatomie du composant jeu de champ identifiant la légende du jeu de champ et son message d'aide suivi de deux composants un à la suite de l'autre identifié comme un groupe de composants. Le premier un champ de texte et le deuxième un menu de sélection."/>
+<img class="b-sm b-default p-300" src="/images/fr/components/anatomy/gcds-fieldset-anatomy.svg" alt="L'anatomie du composant jeu de champ identifiant la légende du jeu de champ et son message d'aide suivi de deux composants un à la suite de l'autre identifié comme un groupe de composants. Le premier un champ de texte et le deuxième un menu de sélection."/>
 
 ## Design et accessibilité des jeux de champs
 
diff --git a/src/fr/composants/lien/base.md b/src/fr/composants/lien/base.md
index 9d14be46e..ea5243a31 100644
--- a/src/fr/composants/lien/base.md
+++ b/src/fr/composants/lien/base.md
@@ -15,8 +15,8 @@ Un lien est un élément de navigation qui amène une personne à une nouvelle p
 {% enddocLinks %}
 
 {% componentPreview "Aperçu du composant de lien" %}
-<gcds-link class="d-block mb-400" href="#">Lien de navigation</gcds-link>
-<gcds-link class="d-block mb-400" href="long-filename.pdf" download="file.pdf" type="application/pdf">Télécharger le document (PDF, 1,5 Mb)</gcds-link>
-<gcds-link class="d-block mb-400" href="mailto:test@test.com?subject=Test%20Email">Envoyer un courriel</gcds-link>
+<gcds-link class="d-block mb-300" href="#">Lien de navigation</gcds-link>
+<gcds-link class="d-block mb-300" href="long-filename.pdf" download="file.pdf" type="application/pdf">Télécharger le document (PDF, 1,5 Mb)</gcds-link>
+<gcds-link class="d-block mb-300" href="mailto:test@test.com?subject=Test%20Email">Envoyer un courriel</gcds-link>
 <gcds-link class="d-block" href="tel:1234567890">Appeler</gcds-link>
 {% endcomponentPreview %}
diff --git a/src/fr/composants/lien/cas-dutilisation.md b/src/fr/composants/lien/cas-dutilisation.md
index ee8c7558c..71ea00068 100644
--- a/src/fr/composants/lien/cas-dutilisation.md
+++ b/src/fr/composants/lien/cas-dutilisation.md
@@ -30,8 +30,8 @@ Utilisez des liens pour :
 - Lancer le téléchargement de fichiers, en donnant l'accès direct aux documents, médias ou tout autre contenu téléchargeable.
 - Sauter les éléments de navigation pour passer au contenu principal.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Composants connexes</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Composants connexes</h2>
 
 <a href="{{ links.button }}" class="link-light">Boutons</a> : pour modifier des données, changer d'état ou lancer une action spécifique.
 
diff --git a/src/fr/composants/lien/design.md b/src/fr/composants/lien/design.md
index d6b84148e..3e5ce3bd0 100644
--- a/src/fr/composants/lien/design.md
+++ b/src/fr/composants/lien/design.md
@@ -18,7 +18,7 @@ date: 'git Last Modified'
   </ul>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/fr/components/anatomy/gcds-link-anatomy.svg" alt="Une étiquette soulignée pour indiquer qu'il s'agit d'un lien interactif que l'on peut suivre. Une icône avec une flèche pointant vers le bas se trouve à droite du lien." />
+<img class="b-sm b-default p-300" src="/images/fr/components/anatomy/gcds-link-anatomy.svg" alt="Une étiquette soulignée pour indiquer qu'il s'agit d'un lien interactif que l'on peut suivre. Une icône avec une flèche pointant vers le bas se trouve à droite du lien." />
 
 ## Accessibilité et design des liens
 
diff --git a/src/fr/composants/masquage-accessible/case-dusage.md b/src/fr/composants/masquage-accessible/case-dusage.md
index c287ba8c9..0bbae17e9 100644
--- a/src/fr/composants/masquage-accessible/case-dusage.md
+++ b/src/fr/composants/masquage-accessible/case-dusage.md
@@ -26,8 +26,8 @@ Utilisez le masquage accessible pour :
 - Communiquer efficacement sans ajouter de texte au contenu principal. Le fait de fournir du contenu seulement à l'endroit et au moment où il le faut permet de réduire la charge cognitive pour tout le monde.
 - Améliorer l'expérience d'utilisation d'une technologie d'assistance quand il n'y a pas d'autre option adéquate dans le HTML sémantique.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Composants connexes</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Composants connexes</h2>
 
 <a href="{{ links.heading }}" class="link-light">Titre</a> pour structurer le contenu en créant des niveaux hiérarchiques qui permettent l'organisation visuelle et mentale du contenu de la page à l'aide des styles de Système de design GC.
 
diff --git a/src/fr/composants/menu-thematique/base.md b/src/fr/composants/menu-thematique/base.md
index 5bb12e693..9f3d9e896 100644
--- a/src/fr/composants/menu-thematique/base.md
+++ b/src/fr/composants/menu-thematique/base.md
@@ -14,7 +14,7 @@ Le menu thématique est un mécanisme de navigation vers les tâches les plus im
 {% docLinks locale stage figma github %}
 {% enddocLinks %}
 
-{% componentPreview "Aperçu du composant de menu thématique" "px-0 py-400" %}
+{% componentPreview "Aperçu du composant de menu thématique" "px-0 py-300" %}
 
 <div aria-hidden="true">
   <gcds-topic-menu>
diff --git a/src/fr/composants/menu-thematique/cas-dutilisation.md b/src/fr/composants/menu-thematique/cas-dutilisation.md
index 9047cfe86..8fbf3038a 100644
--- a/src/fr/composants/menu-thematique/cas-dutilisation.md
+++ b/src/fr/composants/menu-thematique/cas-dutilisation.md
@@ -23,8 +23,8 @@ Utilisez le menu thématique pour :
 
 - Permettre aux utilisateur·rice·s de naviguer dans l’ensemble des pages Web du gouvernement du Canada, notamment pour les pages accédées fréquemment à partir de votre site Web.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Composants connexes</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Composants connexes</h2>
 
 <a href="{{ links.header }}" class="link-light">En-tête</a> : permet de placer l’image de marque du gouvernement du Canada dans l’en-tête.
 
diff --git a/src/fr/composants/menu-thematique/design.md b/src/fr/composants/menu-thematique/design.md
index e7fd479f7..9b4445636 100644
--- a/src/fr/composants/menu-thematique/design.md
+++ b/src/fr/composants/menu-thematique/design.md
@@ -15,7 +15,7 @@ date: 'git Last Modified'
   <li>Les <strong>liens les plus en demande</strong> est une liste des actions les plus fréquemment effectuées pour chaque thème. Tous les liens seront chargés et mis à jour automatiquement.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/fr/components/anatomy/gcds-topic-menu-anatomy.svg" alt="Le menu thématique avec des flèches numérotées pointant vers les parties individuelles de la structure du composant." />
+<img class="b-sm b-default p-300" src="/images/fr/components/anatomy/gcds-topic-menu-anatomy.svg" alt="Le menu thématique avec des flèches numérotées pointant vers les parties individuelles de la structure du composant." />
 
 ## Accessibilité et design des menu thématique
 
diff --git a/src/fr/composants/message-derreur/base.md b/src/fr/composants/message-derreur/base.md
index eadfb5f33..64b78f505 100644
--- a/src/fr/composants/message-derreur/base.md
+++ b/src/fr/composants/message-derreur/base.md
@@ -15,7 +15,7 @@ Un message d’erreur est une description d’un problème représentant un obst
 {% docLinks locale stage figma github %}
 {% enddocLinks %}
 
-{% componentPreview "Aperçu du composant de message d'erreur" "px-300 pt-400 pb-100" %}
+{% componentPreview "Aperçu du composant de message d'erreur" "px-225 pt-300 pb-75" %}
 <gcds-error-message message-id="example-message">
 Message d'erreur.
 </gcds-error-message>
diff --git a/src/fr/composants/message-derreur/cas-dutilisation.md b/src/fr/composants/message-derreur/cas-dutilisation.md
index 542444282..899d5cf95 100644
--- a/src/fr/composants/message-derreur/cas-dutilisation.md
+++ b/src/fr/composants/message-derreur/cas-dutilisation.md
@@ -29,8 +29,8 @@ Utilisez un message d'erreur pour vos propres composants lorsque l'une des situa
 - Un composant de formulaire est requis;
 - Vous devez spécifier un type ou un format de réponse incorrect et préciser à une personne ce qu'il faut faire pour résoudre le problème et passer à la tâche suivante.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Composants connexes </h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Composants connexes </h2>
 
 <a href="{{ links.errorSummary }}" class="link-light">Résumé des erreurs</a> pour répertorier tous les problèmes à résoudre pour la soumission de la réponse.
 
diff --git a/src/fr/composants/message-derreur/design.md b/src/fr/composants/message-derreur/design.md
index a593b5be5..0bd8578eb 100644
--- a/src/fr/composants/message-derreur/design.md
+++ b/src/fr/composants/message-derreur/design.md
@@ -12,7 +12,7 @@ date: 'git Last Modified'
   <li>Le <strong>message d'erreur</strong> cite le problème dans son contexte et comprend un appel à l'action pour le corriger.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/fr/components/anatomy/gcds-error-message-anatomy.svg" alt="Stucture du message d'erreur représenté par une icône d'avertissement (point d'exclamation blanc à l'intérieur d'un triangle rouge) placée à côté du texte « Message d'erreur »."/>
+<img class="b-sm b-default p-300" src="/images/fr/components/anatomy/gcds-error-message-anatomy.svg" alt="Stucture du message d'erreur représenté par une icône d'avertissement (point d'exclamation blanc à l'intérieur d'un triangle rouge) placée à côté du texte « Message d'erreur »."/>
 
 ### Message d'erreur appliqué à un composant de formulaire
 
@@ -27,7 +27,7 @@ Pour vos propres composants, ajoutez le composant Message d'erreur ainsi que les
   <li>Le <strong>champ de réponse</strong> adopte l'apparence du format de réponse et de l'état du message d'erreur du composant auquel il est rattaché. Les cases de champs de saisie et des champs de texte sont surlignées. Les options des boutons radio ou des cases à cocher sont surlignées.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/fr/components/anatomy/gcds-error-message-anatomy-with-form-field.svg" alt="Taxonomie du message d'erreur représentée par quatre éléments: l'étiquette ou légende (obligatoire), le texte explicatif / exemple de message, une icône avertissement à côté du texte « Message d'erreur », et une zone de réponse (une boîte rouge rectangulaire comprenant une zone de texte)."/>
+<img class="b-sm b-default p-300" src="/images/fr/components/anatomy/gcds-error-message-anatomy-with-form-field.svg" alt="Taxonomie du message d'erreur représentée par quatre éléments: l'étiquette ou légende (obligatoire), le texte explicatif / exemple de message, une icône avertissement à côté du texte « Message d'erreur », et une zone de réponse (une boîte rouge rectangulaire comprenant une zone de texte)."/>
 
 ## Conception et accessibilité des messages d'erreur
 
diff --git a/src/fr/composants/pagination/base.md b/src/fr/composants/pagination/base.md
index 2a386ef59..5f3bb2f1a 100644
--- a/src/fr/composants/pagination/base.md
+++ b/src/fr/composants/pagination/base.md
@@ -15,7 +15,7 @@ La pagination est une division du contenu entre plusieurs pages liées.
 {% docLinks locale stage figma github %}
 {% enddocLinks %}
 
-{% componentPreview "Aperçu du composant de la pagination" "px-0 lg:px-300 xl:px-300 py-400" %}
+{% componentPreview "Aperçu du composant de la pagination" "px-0 lg:px-225 xl:px-225 py-300" %}
 <gcds-pagination label="pagination simple" display="simple" previous-href="#" next-href="#" previous-label="Titre de la page" next-label="3 de 3" lang="fr">
 </gcds-pagination>
 
diff --git a/src/fr/composants/pagination/cas-dutilisation.md b/src/fr/composants/pagination/cas-dutilisation.md
index a3333044a..a43ce78ec 100644
--- a/src/fr/composants/pagination/cas-dutilisation.md
+++ b/src/fr/composants/pagination/cas-dutilisation.md
@@ -28,8 +28,8 @@ Utilisez la pagination pour réduire la charge cognitive lorsqu’un contenu tr
 - Séparer en plusieurs sections les longs documents, comme les rapports, qui comprennent des chapitres ou des divisions naturelles.
 - Mettre en évidence la position de la personne dans une séquence de contenu.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Composants connexes</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Composants connexes</h2>
 
 <a href="{{ links.stepper }}" class="link-light">Indicateur d’étape</a> pour suivre l’avancement dans un processus à plusieurs étapes.
 
diff --git a/src/fr/composants/pagination/design.md b/src/fr/composants/pagination/design.md
index ebea0e87e..62be90e0d 100644
--- a/src/fr/composants/pagination/design.md
+++ b/src/fr/composants/pagination/design.md
@@ -18,7 +18,7 @@ date: 'git Last Modified'
   <li>Le <strong>libellé précédent</strong> indique à l’utilisateur·rice le libellé de la page précédente.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/fr/components/anatomy/gcds-pagination-simple-previous-anatomy.svg" alt="Le composant de pagination avec des nombres pointant vers des parties individuelles de l’anatomie du lien précédent de la pagination simple." />
+<img class="b-sm b-default p-300" src="/images/fr/components/anatomy/gcds-pagination-simple-previous-anatomy.svg" alt="Le composant de pagination avec des nombres pointant vers des parties individuelles de l’anatomie du lien précédent de la pagination simple." />
 
 #### Lien suivant
 
@@ -28,7 +28,7 @@ date: 'git Last Modified'
   <li>Le <strong>libellé suivant</strong> indique à l’utilisateur·rice le libellé de la page suivante.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/fr/components/anatomy/gcds-pagination-simple-next-anatomy.svg" alt="Le composant de pagination avec des nombres pointant vers des parties individuelles de l’anatomie du lien suivant de la pagination simple." />
+<img class="b-sm b-default p-300" src="/images/fr/components/anatomy/gcds-pagination-simple-next-anatomy.svg" alt="Le composant de pagination avec des nombres pointant vers des parties individuelles de l’anatomie du lien suivant de la pagination simple." />
 
 ### Structure de la pagination sous forme de liste
 
@@ -42,7 +42,7 @@ date: 'git Last Modified'
   <li>Le <strong>lien suivant</strong> mène vers la page suivante du flux lorsqu’il est sélectionné.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/fr/components/anatomy/gcds-pagination-list-large-anatomy.svg" alt="Le composant de pagination avec des nombres pointant vers des parties individuelles de l’anatomie de la pagination sous forme de liste sur grand écran." />
+<img class="b-sm b-default p-300" src="/images/fr/components/anatomy/gcds-pagination-list-large-anatomy.svg" alt="Le composant de pagination avec des nombres pointant vers des parties individuelles de l’anatomie de la pagination sous forme de liste sur grand écran." />
 
 #### Petits écrans
 
@@ -54,7 +54,7 @@ date: 'git Last Modified'
   <li>Le <strong>lien suivant</strong> mène vers la page suivante du flux lorsqu’il est sélectionné.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/fr/components/anatomy/gcds-pagination-list-small-anatomy.svg" alt="Le composant de pagination avec des nombres pointant vers des parties individuelles de l’anatomie de la pagination sous forme de liste sur petits écran." />
+<img class="b-sm b-default p-300" src="/images/fr/components/anatomy/gcds-pagination-list-small-anatomy.svg" alt="Le composant de pagination avec des nombres pointant vers des parties individuelles de l’anatomie de la pagination sous forme de liste sur petits écran." />
 
 #### Lien précédent
 
@@ -63,7 +63,7 @@ date: 'git Last Modified'
   <li>Le <strong>texte précédent</strong> est le texte qui accompagne la flèche précédente, indiquant que l’utilisateur·rice navigue vers la page précédente dans le flux.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/fr/components/anatomy/gcds-pagination-list-previous-anatomy.svg" alt="Le composant de pagination avec des nombres pointant vers des parties individuelles de l'anatomie du lien précédent de la pagination sous forme de liste." />
+<img class="b-sm b-default p-300" src="/images/fr/components/anatomy/gcds-pagination-list-previous-anatomy.svg" alt="Le composant de pagination avec des nombres pointant vers des parties individuelles de l'anatomie du lien précédent de la pagination sous forme de liste." />
 
 #### Lien suivant
 
@@ -72,7 +72,7 @@ date: 'git Last Modified'
   <li>La <strong>flèche suivante</strong> est une aide visuelle qui indique qu’on navigue en avant dans le flux de pages.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/fr/components/anatomy/gcds-pagination-list-next-anatomy.svg" alt="Le composant de pagination avec des nombres pointant vers des parties individuelles de l'anatomie du lien suivant de la pagination sous forme de liste." />
+<img class="b-sm b-default p-300" src="/images/fr/components/anatomy/gcds-pagination-list-next-anatomy.svg" alt="Le composant de pagination avec des nombres pointant vers des parties individuelles de l'anatomie du lien suivant de la pagination sous forme de liste." />
 
 ## Design et accessibilité pour le composant pagination
 
diff --git a/src/fr/composants/pied-de-page/cas-dutilisation.md b/src/fr/composants/pied-de-page/cas-dutilisation.md
index 60ad32789..a38780e1e 100644
--- a/src/fr/composants/pied-de-page/cas-dutilisation.md
+++ b/src/fr/composants/pied-de-page/cas-dutilisation.md
@@ -29,8 +29,8 @@ Pour les applications, formulaires et autres services numériques transactionnel
 - Un service ou produit numérique du gouvernement du Canada offrant une vaste gamme de services et de renseignements;
 - Le mot-symbole pour représenter l'identité du gouvernement du Canada.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Composants connexes</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Composants connexes</h2>
 
 <a href="{{ links.header }}" class="link-light">En-tête</a> : lorsque vous cherchez à placer l'image de marque du gouvernement du Canada dans l'en-tête de la page.
 
diff --git a/src/fr/composants/pied-de-page/code.md b/src/fr/composants/pied-de-page/code.md
index 5d8e1fd6c..301b90e04 100644
--- a/src/fr/composants/pied-de-page/code.md
+++ b/src/fr/composants/pied-de-page/code.md
@@ -20,18 +20,18 @@ Choisissez l'affichage compact pour inclure :
 
 1. La bande de liens du pied de page et le mot-symbole du gouvernement du Canada.
 
-<img class="b-sm b-default mt-400 mb-500 p-400" src="/images/fr/components/example/example-footer-compact.svg" alt=""/>
+<img class="b-sm b-default mt-300 mb-600 p-300" src="/images/fr/components/example/example-footer-compact.svg" alt=""/>
 
 Choisissez l'affichage complet si vous devez inclure :
 
 1. La bande principale avec une grande sélection de liens institutionnels du gouvernement du Canada;
 2. La bande de liens du pied de page et le mot-symbole du gouvernement du Canada.
 
-<img class="b-sm b-default mt-400 mb-500 p-400" src="/images/fr/components/example/example-footer-full.svg" alt=""/>
+<img class="b-sm b-default mt-300 mb-600 p-300" src="/images/fr/components/example/example-footer-full.svg" alt=""/>
 
 Choisissez d'inclure la bande contextuelle pour ajouter jusqu'à trois liens de pied de page pour votre produit.
 
-<img class="b-sm b-default mt-400 mb-500 p-400" src="/images/fr/components/example/example-footer-full-with-contextual-links.svg" alt=""/>
+<img class="b-sm b-default mt-300 mb-600 p-300" src="/images/fr/components/example/example-footer-full-with-contextual-links.svg" alt=""/>
 
 ### Inclure la bande de liens du pied de page pour les sites et produits du gouvernement du Canada
 
diff --git a/src/fr/composants/pied-de-page/design.md b/src/fr/composants/pied-de-page/design.md
index e12d40244..5e93deac5 100644
--- a/src/fr/composants/pied-de-page/design.md
+++ b/src/fr/composants/pied-de-page/design.md
@@ -13,7 +13,7 @@ date: 'git Last Modified'
   <li>Le <strong>mot-symbole Canada</strong> est l'identificateur mondial du gouvernement du Canada et l'un des trois symboles officiels de l'identité du gouvernement du Canada.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/fr/components/anatomy/gcds-footer-anatomy-recommended.svg" alt="Taxonomie du pied de page de site Web illustrant deux sections. La première section est composée de liens de pied de page situés dans une bannière grise, par exemple « Médias sociaux », « Applications mobiles », « À propos de Canada.ca ». La deuxième section est composée du mot-symbole Canada.ca." />
+<img class="b-sm b-default p-300" src="/images/fr/components/anatomy/gcds-footer-anatomy-recommended.svg" alt="Taxonomie du pied de page de site Web illustrant deux sections. La première section est composée de liens de pied de page situés dans une bannière grise, par exemple « Médias sociaux », « Applications mobiles », « À propos de Canada.ca ». La deuxième section est composée du mot-symbole Canada.ca." />
 
 ## Éléments de pied de page facultatifs
 
@@ -24,7 +24,7 @@ date: 'git Last Modified'
   <li>Le <strong>mot-symbole Canada</strong> est l'identificateur mondial du gouvernement du Canada et l'un des trois symboles officiels de l'identité du gouvernement du Canada.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/fr/components/anatomy/gcds-footer-anatomy-optional.svg" alt="L'anatomie du composant pied de page identifiant les trois bandes horizontales qui forment le composant. La première est la bande contextuelle, une bande bleu avec un titre et trois liens. La deuxième la bande principale qui inclu les liens du gouvernement du Canada. La troisième est la band des liens du pied de page, une bande grise pâle avec à l'intérieur cinq liens séparés par des points et le logo du gouvernement du Canada." />
+<img class="b-sm b-default p-300" src="/images/fr/components/anatomy/gcds-footer-anatomy-optional.svg" alt="L'anatomie du composant pied de page identifiant les trois bandes horizontales qui forment le composant. La première est la bande contextuelle, une bande bleu avec un titre et trois liens. La deuxième la bande principale qui inclu les liens du gouvernement du Canada. La troisième est la band des liens du pied de page, une bande grise pâle avec à l'intérieur cinq liens séparés par des points et le logo du gouvernement du Canada." />
 
 ## Design et accessibilité du pied de page
 
diff --git a/src/fr/composants/recherche/cas-dutilisation.md b/src/fr/composants/recherche/cas-dutilisation.md
index 49ab536a3..9fbdc3cf7 100644
--- a/src/fr/composants/recherche/cas-dutilisation.md
+++ b/src/fr/composants/recherche/cas-dutilisation.md
@@ -26,8 +26,8 @@ Utilisez le composant recherche pour aider les personnes utilisant votre site We
 - Indexées sur Canada.ca, dans tout le contenu du gouvernement du Canada, ou encore au niveau de l’organisme ou du programme.
 - À partir d’un sous-ensemble de contenu publié, en utilisant votre propre ensemble de données.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Composants connexes</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Composants connexes</h2>
 
 <a href="{{ links.header }}" class="link-light">En-tête</a> : utilisé pour le placement de l'en-tête portant l'image de marque du gouvernement du Canada.
 
diff --git a/src/fr/composants/recherche/design.md b/src/fr/composants/recherche/design.md
index dbc915418..cdc98f7ba 100644
--- a/src/fr/composants/recherche/design.md
+++ b/src/fr/composants/recherche/design.md
@@ -15,7 +15,7 @@ date: 'git Last Modified'
   <li>L'<strong>icône</strong> est une aide visuelle sur le bouton.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/fr/components/anatomy/gcds-search-anatomy.svg" alt="Image montrant la structure du composant recherche avec des chiffres pointant vers les parties individuelles du composant." />
+<img class="b-sm b-default p-300" src="/images/fr/components/anatomy/gcds-search-anatomy.svg" alt="Image montrant la structure du composant recherche avec des chiffres pointant vers les parties individuelles du composant." />
 
 ## Accessibilité et design des recherche
 
diff --git a/src/fr/composants/resume-de-erreurs/cas-dutilisation.md b/src/fr/composants/resume-de-erreurs/cas-dutilisation.md
index 905b423c2..ba7cf0052 100644
--- a/src/fr/composants/resume-de-erreurs/cas-dutilisation.md
+++ b/src/fr/composants/resume-de-erreurs/cas-dutilisation.md
@@ -27,9 +27,9 @@ Utilisez le résumé des erreurs pour interrompre l'envoi d'un formulaire lorsqu
 - Rendre les erreurs évidentes pour que l'on sache les reconnaître et y remédier;
 - Dresser une liste <gcds-link href="{{ links.errorMessage }}">des messages d'erreur</gcds-link> lorsqu'une personne doit ajouter des renseignements ou apporter des modifications à deux ou plusieurs éléments avant de pouvoir soumettre un formulaire.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
 
-  <h2 class="mt-0 mb-400">Composants connexes</h2>
+  <h2 class="mt-0 mb-300">Composants connexes</h2>
 
 <a href="{{ links.errorMessage }}" class="link-light">Message d'erreur</a> lorsque vous cherchez à décrire un problème représentant un obstacle à une action menée par l'utilisateur·rice, lié à un seul composant.
 
diff --git a/src/fr/composants/resume-de-erreurs/design.md b/src/fr/composants/resume-de-erreurs/design.md
index b9cfe4c46..e1e15335f 100644
--- a/src/fr/composants/resume-de-erreurs/design.md
+++ b/src/fr/composants/resume-de-erreurs/design.md
@@ -13,7 +13,7 @@ tags: ['errorsummaryFR', 'design']
   <li>L'<strong>élément du résumé des erreurs</strong> est lié au contexte d'erreur et comporte le même texte que le message d'erreur (un énoncé d'appel à l'action pour le corriger).</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/fr/components/anatomy/gcds-error-summary-anatomy.svg" alt="Un rectangle rouge encadre un titre proéminent lisant 'Il y a un problème' ainsi qu’une liste numérotée comprenant 3 liens avec des éléments du résumé des erreurs dans le texte de lien." />
+<img class="b-sm b-default p-300" src="/images/fr/components/anatomy/gcds-error-summary-anatomy.svg" alt="Un rectangle rouge encadre un titre proéminent lisant 'Il y a un problème' ainsi qu’une liste numérotée comprenant 3 liens avec des éléments du résumé des erreurs dans le texte de lien." />
 
 ## Conception et accessibilité des résumés des erreurs
 
diff --git a/src/fr/composants/selection/cas-dutilisation.md b/src/fr/composants/selection/cas-dutilisation.md
index a68a40a71..4990a6e2a 100644
--- a/src/fr/composants/selection/cas-dutilisation.md
+++ b/src/fr/composants/selection/cas-dutilisation.md
@@ -25,8 +25,8 @@ Utilisez la sélection dans un formulaire afin de :
 - Limiter le nombre de réponses admises pour une question.
 - Permettre à une personne de répondre à une question sans devoir rédiger une réponse, en sélectionnant un élément à partir d'une liste.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Composants connexes</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Composants connexes</h2>
 
 <a href="{{ links.checkbox }}" class="link-light">Cases à cocher</a> : lorsque vous prévoyez que l'utilisateur·rice sélectionne une ou plusieurs options parmi une liste d'éléments.
 
diff --git a/src/fr/composants/selection/design.md b/src/fr/composants/selection/design.md
index 80eaeb4dd..61c8f9c82 100644
--- a/src/fr/composants/selection/design.md
+++ b/src/fr/composants/selection/design.md
@@ -15,7 +15,7 @@ date: 'git Last Modified'
   <li>L'<strong>icône</strong> est utilisée comme aide visuelle pour indiquer que le champ peut être agrandi.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/fr/components/anatomy/gcds-select-anatomy.svg" alt="Le composant sélection avec des chiffres pointant les parties individuelles de la structure de la sélection." />
+<img class="b-sm b-default p-300" src="/images/fr/components/anatomy/gcds-select-anatomy.svg" alt="Le composant sélection avec des chiffres pointant les parties individuelles de la structure de la sélection." />
 
 ## Design et accessibilité de la sélection
 
diff --git a/src/fr/composants/signature/base.md b/src/fr/composants/signature/base.md
index 74b8b9573..c017e3597 100644
--- a/src/fr/composants/signature/base.md
+++ b/src/fr/composants/signature/base.md
@@ -17,11 +17,11 @@ La signature est l’image de marque du gouvernement du Canada placée dans l’
 
 {% componentPreview "Aperçu du composant de la signature" %}
 
-<div class="d-inline-block me-400">
+<div class="d-inline-block me-300">
 <gcds-signature type="signature"></gcds-signature>
 </div>
 <div class="d-inline-block">
-<gcds-signature class="px-400" type="wordmark"></gcds-signature>
+<gcds-signature class="px-300" type="wordmark"></gcds-signature>
 </div>
 
 {% endcomponentPreview %}
diff --git a/src/fr/composants/signature/cas-dutilisation.md b/src/fr/composants/signature/cas-dutilisation.md
index aea0e7ead..4af2d94fa 100644
--- a/src/fr/composants/signature/cas-dutilisation.md
+++ b/src/fr/composants/signature/cas-dutilisation.md
@@ -40,7 +40,7 @@ Placez la **signature** dans l'en-tête à côté de la bascule de langue pour :
 - Afficher la signature de marque du gouvernement du Canada;
 - Fournir un point de repère aux utilisateur·rice·s qui souhaiteraient retourner à la page d'accueil du site.
 
-<img class="b-sm b-default mt-400 mb-100 p-400" src="/images/fr/components/example/example-signature-signature-type-fr.svg" alt="La signature du gouvernement du Canada. La signature comprend l'unifolié rouge, suivi par le texte « Gouvernement du Canada / Government of Canada »" />
+<img class="b-sm b-default mt-300 mb-75 p-300" src="/images/fr/components/example/example-signature-signature-type-fr.svg" alt="La signature du gouvernement du Canada. La signature comprend l'unifolié rouge, suivi par le texte « Gouvernement du Canada / Government of Canada »" />
 
 ### Type de mot-symbole
 
@@ -49,10 +49,10 @@ Insérez le **mot-symbole** dans le coin inférieur droit du pied de page pour :
 - Accompagner la signature ou toute autre signature organisationnelle approuvée du gouvernement du Canada sur les sites et produits internes et destinés au public;
 - Afficher ce symbole officiel qui est l'identificateur mondial du gouvernement du Canada.
 
-<img class="b-sm b-default mt-400 mb-300 p-400" src="/images/fr/components/example/example-signature-wordmark-type-fr.svg" alt="Le mot-symbole « Canada ». Le mot-symbole comprend le mot « Canada » avec l'unifolié rouge juste au-dessus de la dernière lettre « a »." />
+<img class="b-sm b-default mt-300 mb-225 p-300" src="/images/fr/components/example/example-signature-wordmark-type-fr.svg" alt="Le mot-symbole « Canada ». Le mot-symbole comprend le mot « Canada » avec l'unifolié rouge juste au-dessus de la dernière lettre « a »." />
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Composants connexes</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Composants connexes</h2>
 
 <a href="{{ links.header }}" class="link-light">En-tête :</a> utilisé pour le placement de l'en-tête portant l'image de marque du gouvernement du Canada;
 
diff --git a/src/fr/composants/signature/design.md b/src/fr/composants/signature/design.md
index f7da69b6d..473529ea8 100644
--- a/src/fr/composants/signature/design.md
+++ b/src/fr/composants/signature/design.md
@@ -13,7 +13,7 @@ date: 'git Last Modified'
   <li>Le <strong>mot-symbole « Canada »</strong> est l'identificateur de l'image de marque placé dans le <gcds-link href="{{ links.footer }}">pied de page</gcds-link> du site. Il renforce l'image de marque en informant les visiteur·rice·s du site que le contenu qui leur est présenté provient du gouvernement du Canada.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/fr/components/anatomy/gcds-signature-anatomy-fr.svg" alt="structure de la signature montrant les étiquettes 1 (signature du gouvernement du Canada) et 2 (mot-symbole « Canada »)" />
+<img class="b-sm b-default p-300" src="/images/fr/components/anatomy/gcds-signature-anatomy-fr.svg" alt="structure de la signature montrant les étiquettes 1 (signature du gouvernement du Canada) et 2 (mot-symbole « Canada »)" />
 
 ## Design et accessibilité de la signature
 
@@ -31,18 +31,18 @@ Affichez d'abord la signature en français sur les pages en français. De même,
 - Utilisez toujours la même combinaison de couleurs dans la signature et le mot-symbole. Par exemple, si la signature est en noir et blanc, alors le mot-symbole doit également l'être;
 - Lorsqu'une seule couleur est utilisée, vérifiez le rapport de contraste entre les éléments de la signature pour vous assurer que le ratio est à tout le moins conforme à la norme WCAG, niveau AA.
 
-<img class="b-sm b-default p-400 mt-400 mb-400" src="/images/fr/components/example/example-signature-side-by-side-fr.svg" alt="Une image représentant les deux versions de la signature. La signature se trouve à gauche et le mot-symbole est placé à droite." />
+<img class="b-sm b-default p-300 mt-300 mb-300" src="/images/fr/components/example/example-signature-side-by-side-fr.svg" alt="Une image représentant les deux versions de la signature. La signature se trouve à gauche et le mot-symbole est placé à droite." />
 
 Le style de couleur standard utilise un texte noir et un drapeau rouge sur fond blanc.
 
-<img class="b-sm b-default p-400 mt-500 mb-400" src="/images/fr/components/example/example-signature-side-by-side-reversed-fr.svg" alt="Une image représentant les deux versions de la signature. La signature se trouve à gauche et le mot-symbole est placé à droite. Cette version utilise du texte blanc sur un fond noir." />
+<img class="b-sm b-default p-300 mt-600 mb-300" src="/images/fr/components/example/example-signature-side-by-side-reversed-fr.svg" alt="Une image représentant les deux versions de la signature. La signature se trouve à gauche et le mot-symbole est placé à droite. Cette version utilise du texte blanc sur un fond noir." />
 
 Le style de couleur inversé utilise un texte blanc et un drapeau rouge sur fond noir.
 
-<img class="b-sm b-default p-400 mt-500 mb-400" src="/images/fr/components/example/example-signature-bw-fr.svg" alt="Une image présentant deux combinaisons de signature et de mot-symbole. Dans un cas, la signature et le mot-symbole sont noirs sur fond blanc. Dans l'autre cas, la signature et le mot-symbole sont blancs sur fond noir." />
+<img class="b-sm b-default p-300 mt-600 mb-300" src="/images/fr/components/example/example-signature-bw-fr.svg" alt="Une image présentant deux combinaisons de signature et de mot-symbole. Dans un cas, la signature et le mot-symbole sont noirs sur fond blanc. Dans l'autre cas, la signature et le mot-symbole sont blancs sur fond noir." />
 
 Le style noir et blanc utilise un fond soit entièrement noir, soit entièrement blanc. Le style entièrement noir est le plus fréquemment employé.
 
-<img class="b-sm b-default p-400 mt-500 mb-400" src="/images/fr/components/example/example-signature-single-colour-style-fr.svg" alt="Une image montrant la signature et le mot-symbole en violet foncé sur un fond violet pâle. Des barres et des cases simulent du texte et des images sur une page web fictive. Les cases de texte et d'images sont également violet foncé." />
+<img class="b-sm b-default p-300 mt-600 mb-300" src="/images/fr/components/example/example-signature-single-colour-style-fr.svg" alt="Une image montrant la signature et le mot-symbole en violet foncé sur un fond violet pâle. Des barres et des cases simulent du texte et des images sur une page web fictive. Les cases de texte et d'images sont également violet foncé." />
 
 Le style couleur unique utilise une couleur autre que le noir ou le blanc si uniquement cette couleur est utilisée pour le produit.
diff --git a/src/fr/composants/tableau-de-donnees/cas-dutilisation.md b/src/fr/composants/tableau-de-donnees/cas-dutilisation.md
index 6cd838f58..a804c478e 100644
--- a/src/fr/composants/tableau-de-donnees/cas-dutilisation.md
+++ b/src/fr/composants/tableau-de-donnees/cas-dutilisation.md
@@ -24,8 +24,8 @@ Use a Tableau de données
 
 -
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Composants connexes</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Composants connexes</h2>
 
 <a href="" class="link-light">component</a>
 
diff --git a/src/fr/composants/tableau-de-donnees/design.md b/src/fr/composants/tableau-de-donnees/design.md
index d3bb7e8fc..76f4be344 100644
--- a/src/fr/composants/tableau-de-donnees/design.md
+++ b/src/fr/composants/tableau-de-donnees/design.md
@@ -13,6 +13,6 @@ nocrawl: true
   <li><strong>list</strong></li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/{local}/components/anatomy/gcds-data-table-anatomy.svg" alt="An image of the anatomy." />
+<img class="b-sm b-default p-300" src="/images/{local}/components/anatomy/gcds-data-table-anatomy.svg" alt="An image of the anatomy." />
 
 ## Accessibilité et design des Tableau de données
diff --git a/src/fr/composants/televerseur-de-fichiers/cas-dutilisation.md b/src/fr/composants/televerseur-de-fichiers/cas-dutilisation.md
index d16ee2c5e..d69f7d704 100644
--- a/src/fr/composants/televerseur-de-fichiers/cas-dutilisation.md
+++ b/src/fr/composants/televerseur-de-fichiers/cas-dutilisation.md
@@ -24,8 +24,8 @@ Utilisez le téléverseur de fichiers pour :
 - Permettre à une personne de téléverser un fichier ou plus à partir d'un ordinateur ou d'un appareil.
 - Vérifier les fichiers sélectionnés à téléverser.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Composants connexes</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Composants connexes</h2>
 
 <a href="{{ links.textarea }}" class="link-light">Zones de texte</a> : permettent la saisie de réponses libres de plusieurs lignes.
 
diff --git a/src/fr/composants/televerseur-de-fichiers/design.md b/src/fr/composants/televerseur-de-fichiers/design.md
index a25ada116..447ea7c28 100644
--- a/src/fr/composants/televerseur-de-fichiers/design.md
+++ b/src/fr/composants/televerseur-de-fichiers/design.md
@@ -17,7 +17,7 @@ date: 'git Last Modified'
   <li>Le bouton <strong>supprimer</strong> permet de supprimer un fichier téléversé avant la soumission.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/fr/components/anatomy/gcds-file-uploader-anatomy.svg" alt="Une image de la structure du composant téléverseur de fichiers." />
+<img class="b-sm b-default p-300" src="/images/fr/components/anatomy/gcds-file-uploader-anatomy.svg" alt="Une image de la structure du composant téléverseur de fichiers." />
 
 ## Design et accessibilité du téléverseur de fichiers
 
diff --git a/src/fr/composants/texte/cas-dutilisation.md b/src/fr/composants/texte/cas-dutilisation.md
index 7c78e3e49..c5048c5cc 100644
--- a/src/fr/composants/texte/cas-dutilisation.md
+++ b/src/fr/composants/texte/cas-dutilisation.md
@@ -27,8 +27,8 @@ Utilisez le composant texte pour :
 - Renforcer l'identité de marque avec des styles et des formats de messagerie uniformes sur toutes les pages Web. Par exemple, l'utilisation de la typographie Système de design GC comme norme pour un style de police uniforme.
 - Diviser le contenu en sections compréhensibles avec des marges verticales et horizontales. La décomposition de votre contenu favorise la lisibilité, simplifie la navigation sur le site et réduit le risque que les gens abandonnent leur tâche.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Composants connexes</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Composants connexes</h2>
 
 <a href="{{ links.heading }}" class="link-light">Titre</a> pour structurer le contenu en créant des niveaux hiérarchiques qui permettent l'organisation visuelle et mentale du contenu de la page à l'aide des styles de Système de design GC.
 
diff --git a/src/fr/composants/texte/design.md b/src/fr/composants/texte/design.md
index 01fe521bf..750db29d8 100644
--- a/src/fr/composants/texte/design.md
+++ b/src/fr/composants/texte/design.md
@@ -13,7 +13,7 @@ tags: ['textFR', 'design']
   <li>Le <strong>titre</strong> est une ligne de texte mis en évidence qui introduit le paragraphe ou tout autre contenu du corps qui le suit immédiatement. Le titre donne une structure aux sections de texte selon un ordre hiérarchique.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/fr/components/anatomy/gcds-text-anatomy.svg" alt="Une ligne de grand texte en caractères gras au-dessus d'un bloc de texte plus petit. Le texte en gras indique « Ceci est un titre » et le bloc de contenu écrit indique « Il s'agit d'un texte lié au titre qui décrit plus en détail le sujet ou l'action du titre. Le texte est généralement une ou plusieurs lignes ou paragraphes qui forment le contenu d'une section ou introduisent une liste à puces, un tableau ou tout autre contenu, comme une image ou une vidéo. » Un libellé avec un « 1 » pointe vers le plus petit bloc de texte et un libellé avec « 2 » pointe vers le texte gras plus grand." />
+<img class="b-sm b-default p-300" src="/images/fr/components/anatomy/gcds-text-anatomy.svg" alt="Une ligne de grand texte en caractères gras au-dessus d'un bloc de texte plus petit. Le texte en gras indique « Ceci est un titre » et le bloc de contenu écrit indique « Il s'agit d'un texte lié au titre qui décrit plus en détail le sujet ou l'action du titre. Le texte est généralement une ou plusieurs lignes ou paragraphes qui forment le contenu d'une section ou introduisent une liste à puces, un tableau ou tout autre contenu, comme une image ou une vidéo. » Un libellé avec un « 1 » pointe vers le plus petit bloc de texte et un libellé avec « 2 » pointe vers le texte gras plus grand." />
 
 ## Conception et accessibilité du composant texte
 
diff --git a/src/fr/composants/titre/cas-dutilisation.md b/src/fr/composants/titre/cas-dutilisation.md
index 21e5b46c8..85632b7ad 100644
--- a/src/fr/composants/titre/cas-dutilisation.md
+++ b/src/fr/composants/titre/cas-dutilisation.md
@@ -29,8 +29,8 @@ Utilisez des titres pour :
 - Diviser le contenu long en sections gérables. Le découpage de votre contenu favorise la lisibilité, simplifie la navigation sur le site et réduit le risque que les gens abandonnent leur tâche.
 - Appliquer des styles et des tailles de typographie cohérents sur l'ensemble d'un site Web pour créer un design cohérent et convivial.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Composants connexes</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Composants connexes</h2>
 
 <a href="{{ links.text }}" class="link-light">Texte</a> pour des paragraphes affichant du contenu autre qu'un titre avec les styles correspondants de Système de design GC.
 
diff --git a/src/fr/composants/titre/design.md b/src/fr/composants/titre/design.md
index 3b21ec6bd..c019e5a83 100644
--- a/src/fr/composants/titre/design.md
+++ b/src/fr/composants/titre/design.md
@@ -13,7 +13,7 @@ tags: ['headingFR', 'design']
   <li>Le composant <strong>texte</strong> ne contient pas de titre. Son sujet est lié à l'idée principale du titre correspondant.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/fr/components/anatomy/gcds-heading-anatomy.svg" alt="Un titre en gros caractères au-dessus d'un bloc de texte plus petit. Le texte en se lit comme suit : « Ceci est un titre. » Le bloc suivant se lit comme suit : « Il s'agit de texte qui décrit plus en détail le sujet ou l'action indiqués dans la section qui suit. Le texte est généralement constitué d'une ou de plusieurs lignes ou paragraphes de contenu pour la section. On peut aussi s'en servir pour introduire une liste à puces, un tableau ou d'autres contenus, comme une image ou une vidéo. » Il y a une étiquette pointant vers le plus grand texte indiquant « 1 » et il y a une étiquette pointant vers le plus petit bloc de texte qui indique « 2 »." />
+<img class="b-sm b-default p-300" src="/images/fr/components/anatomy/gcds-heading-anatomy.svg" alt="Un titre en gros caractères au-dessus d'un bloc de texte plus petit. Le texte en se lit comme suit : « Ceci est un titre. » Le bloc suivant se lit comme suit : « Il s'agit de texte qui décrit plus en détail le sujet ou l'action indiqués dans la section qui suit. Le texte est généralement constitué d'une ou de plusieurs lignes ou paragraphes de contenu pour la section. On peut aussi s'en servir pour introduire une liste à puces, un tableau ou d'autres contenus, comme une image ou une vidéo. » Il y a une étiquette pointant vers le plus grand texte indiquant « 1 » et il y a une étiquette pointant vers le plus petit bloc de texte qui indique « 2 »." />
 
 ## Conception et accessibilité du composant titre
 
diff --git a/src/fr/composants/zone-de-texte/base.md b/src/fr/composants/zone-de-texte/base.md
index c5359ad79..c37a69ec0 100644
--- a/src/fr/composants/zone-de-texte/base.md
+++ b/src/fr/composants/zone-de-texte/base.md
@@ -15,7 +15,7 @@ Une zone de texte est un espace permettant de saisir une réponse détaillée à
 {% docLinks locale stage figma github %}
 {% enddocLinks %}
 
-{% componentPreview "Aperçu du composant de zone de texte" "px-300 pt-400" %}
+{% componentPreview "Aperçu du composant de zone de texte" "px-225 pt-300" %}
 <gcds-textarea textarea-id="textarea-example" label="Libellé de champ" hint="Texte explicatif / Exemple de message." value="Contenu de la zone de texte.">
 </gcds-textarea>
 {% endcomponentPreview %}
diff --git a/src/fr/composants/zone-de-texte/cas-dutilisation.md b/src/fr/composants/zone-de-texte/cas-dutilisation.md
index ed785a034..eb457305a 100644
--- a/src/fr/composants/zone-de-texte/cas-dutilisation.md
+++ b/src/fr/composants/zone-de-texte/cas-dutilisation.md
@@ -28,8 +28,8 @@ Utilisez une zone de texte pour obtenir des renseignements multilignes :
 
 Note : Ne recueillez que les renseignements que vous êtes autorisé·e à traiter et veillez à les protéger conformément aux normes du gouvernement du Canada.
 
-<article class="bg-full-width bg-primary text-light pt-500 pb-400 my-500">
-  <h2 class="mt-0 mb-400">Composants connexes</h2>
+<article class="bg-full-width bg-primary text-light pt-600 pb-300 my-600">
+  <h2 class="mt-0 mb-300">Composants connexes</h2>
 
 <a href="{{ links.input }}" class="link-light">Champs de saisie</a> : lorsque vous cherchez à obtenir des réponses courtes d'une seule ligne.
 
diff --git a/src/fr/composants/zone-de-texte/design.md b/src/fr/composants/zone-de-texte/design.md
index 5e26927d3..e42b38927 100644
--- a/src/fr/composants/zone-de-texte/design.md
+++ b/src/fr/composants/zone-de-texte/design.md
@@ -14,7 +14,7 @@ date: 'git Last Modified'
   <li>Le <strong>champ</strong> est la boîte avec laquelle l'utilisateur·rice interagit pour fournir sa réponse.</li>
 </ol>
 
-<img class="b-sm b-default p-400" src="/images/fr/components/anatomy/gcds-textarea-anatomy.svg" alt="L'anatomie de la zone de texte identifiant l'étiquette, le message d'aide et le champ qui forme le composant" />
+<img class="b-sm b-default p-300" src="/images/fr/components/anatomy/gcds-textarea-anatomy.svg" alt="L'anatomie de la zone de texte identifiant l'étiquette, le message d'aide et le champ qui forme le composant" />
 
 ## Conception et accessibilité des zones de texte
 
diff --git a/src/fr/contactez/contactez.md b/src/fr/contactez/contactez.md
index 87c63ac55..d81ce8698 100644
--- a/src/fr/contactez/contactez.md
+++ b/src/fr/contactez/contactez.md
@@ -17,13 +17,13 @@ date: 'git Last Modified'
 
 Avec votre compte GitHub, utilisez notre <gcds-link external href="{{ links.githubCompsIssues }}">formulaire de soutien</gcds-link> pour signaler des bogues et obtenir un soutien technique. Vous aurez accès aux problèmes (issues) passés et verrez les progrès accomplis.
 
-<hr class="my-500" />
+<hr class="my-600" />
 
 ## Envoyer des commentaires, demander de l’aide ou s’inscrire
 
 Remplissez le formulaire suivant pour nous envoyer vos commentaires, demander de l’aide pour utiliser Système de design GC, ou vous inscrire à notre liste d’envoi ou à une démo.
 
-<form class="my-500 contact-us-form" name="contactFR" method="post" style="min-height: 32rem;" action="/api/submission">
+<form class="my-600 contact-us-form" name="contactFR" method="post" style="min-height: 32rem;" action="/api/submission">
   <input type="hidden" name="form-name" value="contactFR" />
   <input name="honeypot" type="text" aria-label="bot" hidden/>
 
diff --git a/src/fr/pages/index.md b/src/fr/pages/index.md
index 64d6b7c26..b6ad13877 100644
--- a/src/fr/pages/index.md
+++ b/src/fr/pages/index.md
@@ -8,65 +8,65 @@ date: 'git Last Modified'
 
 <h2 class="py-450">Commencez à utiliser Système de design GC</h2>
 
-<article class="py-500 bg-primary text-light bg-full-width">
-  <gcds-grid tag="ul" columns="1fr" columns-tablet="1fr 1fr" gap="450">
-    <li class="list-none md:mb-0 mb-500">
-      <img class="mb-400" src="../../images/common/home/icon-design.svg" alt="" />
-      <h3 class="mb-400">Concevoir des expériences</h3>
-      <p class="mb-400">Visitez notre bibliothèque Figma pour explorer nos ressources de conception.</p>
+<article class="py-600 bg-primary text-light bg-full-width">
+  <gcds-grid tag="ul" columns="1fr" columns-tablet="1fr 1fr">
+    <li class="list-none md:mb-0 mb-600">
+      <img class="mb-300" src="../../images/common/home/icon-design.svg" alt="" />
+      <h3 class="mb-300">Concevoir des expériences</h3>
+      <p class="mb-300">Visitez notre bibliothèque Figma pour explorer nos ressources de conception.</p>
       <a class="link-light" href="{{ links.figma }}" target="_blank">
         Commencer à concevoir
         <gcds-icon name="external-link" label="S'ouvre dans un nouvel onglet." margin-left="50" />
       </a>
     </li>
     <li class="list-none">
-      <img class="mb-400" src="../../images/common/home/icon-develop.svg" alt="" />
-      <h3 class="mb-400">Développer des produits</h3>
-      <p class="mb-400">Installez l'ensemble de composants.</p>
+      <img class="mb-300" src="../../images/common/home/icon-develop.svg" alt="" />
+      <h3 class="mb-300">Développer des produits</h3>
+      <p class="mb-300">Installez l'ensemble de composants.</p>
       <a class="link-light" href="{{ links.installation }}">Commencer à développer</a>
     </li>
   </gcds-grid>
 </article>
 
 <article class="py-450">
-  <h2 class="mb-400">Un système de design rien que pour vous</h2>
-  <p class="mb-500">Explorez notre outil de conception. <gcds-link href="{{ links.contact }}">Donnez-nous votre avis</gcds-link>.</p>
-  <gcds-grid tag="ul" columns="1fr" columns-tablet="1fr 1fr" columns-desktop="1fr 1fr 1fr" gap="450">
+  <h2 class="mb-300">Un système de design rien que pour vous</h2>
+  <p class="mb-600">Explorez notre outil de conception. <gcds-link href="{{ links.contact }}">Donnez-nous votre avis</gcds-link>.</p>
+  <gcds-grid tag="ul" columns="1fr" columns-tablet="1fr 1fr" columns-desktop="1fr 1fr 1fr">
     <li class="list-none">
-      <img class="mb-200" src="../../images/common/home/icon-components.svg" alt="" />
-      <h3 class="mb-400">Composants</h3>
-      <p class="mb-400">Les blocs de construction de l'interface utilisateur servent différents objectifs.</p>
-      <p class="mb-400">Sélectionnez du code réutilisable pour les composants courants et obtenez des conseils relatifs aux meilleures pratiques pour l'infrastructure que vous utilisez.</p>
+      <img class="mb-150" src="../../images/common/home/icon-components.svg" alt="" />
+      <h3 class="mb-300">Composants</h3>
+      <p class="mb-300">Les blocs de construction de l'interface utilisateur servent différents objectifs.</p>
+      <p class="mb-300">Sélectionnez du code réutilisable pour les composants courants et obtenez des conseils relatifs aux meilleures pratiques pour l'infrastructure que vous utilisez.</p>
       <gcds-link href="{{ links.components }}">Découvrez les composants</gcds-link>
     </li>
     <li class="list-none">
-      <img class="mb-200" src="../../images/common/home/icon-template.svg" alt="" />
-      <h3 class="mb-400">Modèles de page</h3>
-      <p class="mb-400">Les mises en page réutilisables sont des agencements de composants propres à des types de page communs.</p>
-      <p class="mb-400">Entamez votre projet à l’aide de pages de base préfabriquées pour offrir une expérience Canada.ca uniforme et reconnaissable.</p>
+      <img class="mb-150" src="../../images/common/home/icon-template.svg" alt="" />
+      <h3 class="mb-300">Modèles de page</h3>
+      <p class="mb-300">Les mises en page réutilisables sont des agencements de composants propres à des types de page communs.</p>
+      <p class="mb-300">Entamez votre projet à l’aide de pages de base préfabriquées pour offrir une expérience Canada.ca uniforme et reconnaissable.</p>
       <p>Développement en cours</p>
     </li>
     <li class="list-none">
-      <img class="mb-200" src="../../images/common/home/icon-tokens.svg" alt="" />
-      <h3 class="mb-400">Unités de style</h3>
-      <p class="mb-400">Des décisions en matière d'image de marque et de conception directement intégrées dans le code.</p>
-      <p class="mb-400">Découvrez comment les décisions encodées façonnent la conception des services offerts par le gouvernement du Canada et permettent d'offrir une expérience visuelle uniforme.</p>
+      <img class="mb-150" src="../../images/common/home/icon-tokens.svg" alt="" />
+      <h3 class="mb-300">Unités de style</h3>
+      <p class="mb-300">Des décisions en matière d'image de marque et de conception directement intégrées dans le code.</p>
+      <p class="mb-300">Découvrez comment les décisions encodées façonnent la conception des services offerts par le gouvernement du Canada et permettent d'offrir une expérience visuelle uniforme.</p>
       <gcds-link href="{{ links.styles }}">Découvrez les unités de style</gcds-link>
     </li>
   </gcds-grid>
 </article>
 
-<article class="py-500 bg-light bg-full-width">
-  <h2 class="mb-400">Nouveautés</h2>
-  <gcds-grid tag="ul" columns="1fr" columns-tablet="1fr 1fr" gap="450">
+<article class="py-600 bg-light bg-full-width">
+  <h2 class="mb-300">Nouveautés</h2>
+  <gcds-grid tag="ul" columns="1fr" columns-tablet="1fr 1fr">
     <li class="list-none bg-white p-450 b-radius-md">
-      <h3 class="mb-400">
+      <h3 class="mb-300">
         <gcds-link href="{{ links.getInvolved }}">S'impliquer</gcds-link>
       </h3>
       <p>Découvrez ce sur quoi nous travaillons.</p>
     </li>
-    <li class="list-none bg-white px-250 py-450 b-radius-md">
-      <h3 class="mb-400">
+    <li class="list-none bg-white px-175 py-450 b-radius-md">
+      <h3 class="mb-300">
         <gcds-link external href="{{ links.releaseNotes }}">Notes de publication</gcds-link>
       </h3>
       <p>Les derniers ajouts.</p>
@@ -75,15 +75,15 @@ date: 'git Last Modified'
 </article>
 
 <article class="py-450">
-  <h2 class="mb-400">Composant vedette</h2>
+  <h2 class="mb-300">Composant vedette</h2>
 
-  <h3 class="mb-400">Carte</h3>
+  <h3 class="mb-300">Carte</h3>
   <p class="mb-450">La carte est un encadré contenant du contenu structuré et pratique sur un sujet unique.</p>
-  <img class="d-block mb-400" src="../../images/common/components/preview-card.svg" alt="Le composant Carte montre un encadré contenant une image rectangulaire dans la moitié supérieure. Juste en dessous se trouve une barre bleue rectangulaire occupant les trois quarts de la largeur de l'encadré et représentant le titre de la carte. Encore en dessous, deux barres grises plus longues l'une au-dessus de l'autre représentent respectivement la zone consacrée au contexte et la zone consacrée aux métadonnées." />
+  <img class="d-block mb-300" src="../../images/common/components/preview-card.svg" alt="Le composant Carte montre un encadré contenant une image rectangulaire dans la moitié supérieure. Juste en dessous se trouve une barre bleue rectangulaire occupant les trois quarts de la largeur de l'encadré et représentant le titre de la carte. Encore en dessous, deux barres grises plus longues l'une au-dessus de l'autre représentent respectivement la zone consacrée au contexte et la zone consacrée aux métadonnées." />
   <gcds-link href="{{ links.card }}">En savoir plus sur la carte</gcds-link>
 
-  <h3 class="mt-500 mb-400">Champ de date</h3>
+  <h3 class="mt-600 mb-300">Champ de date</h3>
   <p class="mb-450">Le champ de date est un espace permettant de saisir une date connue.</p>
-  <img class="d-block mb-400" src="../../images/fr/components/preview/preview-date-input.svg" alt="Des lignes grises épaisses représentent la légende et le texte explicatif. En dessous, trois cases blanches à fine bordure grise sont alignées horizontalement : une petite case représentant le champ de texte pour le jour, une case contenant une ligne grise et une flèche grise et représentant le champ de sélection du mois, puis une petite case représentant le champ de texte pour l’année." />
+  <img class="d-block mb-300" src="../../images/fr/components/preview/preview-date-input.svg" alt="Des lignes grises épaisses représentent la légende et le texte explicatif. En dessous, trois cases blanches à fine bordure grise sont alignées horizontalement : une petite case représentant le champ de texte pour le jour, une case contenant une ligne grise et une flèche grise et représentant le champ de sélection du mois, puis une petite case représentant le champ de texte pour l’année." />
   <gcds-link href="{{ links.dateInput }}">En savoir plus sur le champ de date</gcds-link>
 </article>
diff --git a/src/fr/simpliquer.md b/src/fr/simpliquer.md
index 3bfd88095..c25874252 100644
--- a/src/fr/simpliquer.md
+++ b/src/fr/simpliquer.md
@@ -21,20 +21,20 @@ Nous faisons savoir quels sont nos travaux en cours et quels sont ceux qui s'en
 
 <hr/>
 
-<gcds-heading tag="h2" margin-top="300">Comment s'impliquer</gcds-heading>
+<gcds-heading tag="h2" margin-top="225">Comment s'impliquer</gcds-heading>
 
 ### Contribuez à nos prochaines priorités
 
 <div>
   <gcds-heading tag="h4" margin-bottom="0">Tableau de données</gcds-heading>
-  <ul class="mb-400">
+  <ul class="mb-300">
     <li>Les tableaux de données sont un moyen d'organiser et d'afficher de grandes quantités de données en lignes et en colonnes.</li>
   </ul>
 </div>
 
 <div>
   <gcds-heading tag="h4" margin-bottom="0">Étiquette</gcds-heading>
-  <ul class="mb-400">
+  <ul class="mb-300">
     <li>L'etiquette est un composant utilisé pour des éléments qui doivent être étiquetés, catégorisés ou organisés à l'aide de mots-clés qui les décrivent.</li>
   </ul>
 </div>
@@ -51,13 +51,13 @@ Fournissez l'un des éléments suivants pour chaque composant ou bloc réutilisa
 
 <hr/>
 
-<gcds-heading tag="h2" margin-top="300">À venir</gcds-heading>
+<gcds-heading tag="h2" margin-top="225">À venir</gcds-heading>
 
 ### Composants et modèles à venir
 
 <div>
   <gcds-heading tag="h4" margin-bottom="0">Avis</gcds-heading>
-  <ul class="mb-400">
+  <ul class="mb-300">
     <li>L’avis est un message court et visible destiné à attirer l’attention et à informer.</li>
     <li><strong>Sortie prévue :</strong> automne 2024</li>
   </ul>
@@ -65,7 +65,7 @@ Fournissez l'un des éléments suivants pour chaque composant ou bloc réutilisa
 
 <div>
   <gcds-heading tag="h4" margin-bottom="0">Modèle de page de sujet</gcds-heading>
-  <ul class="mb-400">
+  <ul class="mb-300">
     <li>Le modèle de page de sujet est un modèle réutilisable pour les pages qui donnent accès à des sujets et à des pages de destination permettant l’achèvement d’une tâche.</li>
     <li><strong>Sortie prévue :</strong> automne 2024</li>
   </ul>
@@ -73,7 +73,7 @@ Fournissez l'un des éléments suivants pour chaque composant ou bloc réutilisa
 
 <div>
   <gcds-heading tag="h4" margin-bottom="0">Modèle de page ministérielle</gcds-heading>
-  <ul class="mb-400">
+  <ul class="mb-300">
     <li>Le modèle de page ministérielle est un modèle réutilisable pour les pages de destination des ministres, des secrétaires parlementaires et des responsables d’organismes quasi judiciaires.</li>
     <li><strong>Sortie prévue :</strong> automne 2024</li>
   </ul>
@@ -81,7 +81,7 @@ Fournissez l'un des éléments suivants pour chaque composant ou bloc réutilisa
 
 <div>
   <gcds-heading tag="h4" margin-bottom="0">Modèle d’application de départ VueJS</gcds-heading>
-  <ul class="mb-400">
+  <ul class="mb-300">
     <li>Le modèle d’application de départ VueJS fournit le code de base pour développer une application à l’aide du cadriciel front-end VueJS.</li>
     <li><strong>Sortie prévue :</strong> automne 2024</li>
   </ul>
diff --git a/src/fr/styles/unites-de-style/unites-de-style.md b/src/fr/styles/unites-de-style/unites-de-style.md
index 227eff7cf..00063e3df 100644
--- a/src/fr/styles/unites-de-style/unites-de-style.md
+++ b/src/fr/styles/unites-de-style/unites-de-style.md
@@ -37,7 +37,7 @@ Les composants de Système de design GC possèdent leurs propres unités de styl
 
 Si elles sont utilisées incorrectement, les unités de style de composant peuvent avoir des comportements imprévisibles. Elles sont mises à jour chaque fois que le composant associé est mis à jour.
 
-<img class="b-sm b-default p-400" src="/images/fr/foundations/tokens/design-tokens-component.svg" alt="Trois carrés bleus représentent les trois étapes pour créer l’unité de style de la couleur d’arrière-plan du composant Bouton standard. À droite du carré le plus haut, un texte indique la couleur #26374a. Juste en-dessous du carré, une flèche pointe vers le carré suivant, à droite duquel un texte indique --gcds-color-blue-900. Une autre flèche pointe vers le troisième et dernier carré, à droite duquel un texte indique --gcds-button-primary-default-background. Une dernière flèche pointe du troisième carré à un bouton dont l’arrière-plan est bleu foncé, soit le résultat de l’unité de style nouvellement créée pour le composant."/>
+<img class="b-sm b-default p-300" src="/images/fr/foundations/tokens/design-tokens-component.svg" alt="Trois carrés bleus représentent les trois étapes pour créer l’unité de style de la couleur d’arrière-plan du composant Bouton standard. À droite du carré le plus haut, un texte indique la couleur #26374a. Juste en-dessous du carré, une flèche pointe vers le carré suivant, à droite duquel un texte indique --gcds-color-blue-900. Une autre flèche pointe vers le troisième et dernier carré, à droite duquel un texte indique --gcds-button-primary-default-background. Une dernière flèche pointe du troisième carré à un bouton dont l’arrière-plan est bleu foncé, soit le résultat de l’unité de style nouvellement créée pour le composant."/>
 
 ### Unités de style globales
 
@@ -47,7 +47,7 @@ Les unités de style globales suivent des règles sémantiques. C'est-à-dire qu
 
 Les unités de style globales aident à réduire les besoins futurs en maintenance et à établir un langage visuel pour une meilleure communication.
 
-<img class="b-sm b-default p-400" src="/images/en/foundations/tokens/design-tokens-global.svg" alt="Trois lignes de texte montrent respectivement un exemple d’unité de style globale pour la taille de police, l’espacement et la couleur de police. La première ligne affiche une taille de police de 1.25rem suivie d’une flèche pointant vers l’unité de style --gcds-font-sizes-text. La deuxième ligne affiche un espacement de 3rem suivi d’une flèche pointant vers l’unité de style --gcds-spacing-500. La troisième ligne affiche une couleur de police #333333 suivie d’une flèche pointant vers l’unité de style --gcds-text-primary."/>
+<img class="b-sm b-default p-300" src="/images/en/foundations/tokens/design-tokens-global.svg" alt="Trois lignes de texte montrent respectivement un exemple d’unité de style globale pour la taille de police, l’espacement et la couleur de police. La première ligne affiche une taille de police de 1.25rem suivie d’une flèche pointant vers l’unité de style --gcds-font-sizes-text. La deuxième ligne affiche un espacement de 3rem suivi d’une flèche pointant vers l’unité de style --gcds-spacing-600. La troisième ligne affiche une couleur de police #333333 suivie d’une flèche pointant vers l’unité de style --gcds-text-primary."/>
 
 ## Unités de style de base
 
@@ -55,7 +55,7 @@ Utilisez les unités de style de base lorsque vous avez épuisé toutes les opti
 
 Les unités de style de base n’emploient aucune structure sémantique et sont donc plus difficiles à interpréter. Il est important de les utiliser judicieusement et de façon uniforme afin d’assurer une expérience utilisateur familière et prévisible pour votre service.
 
-<img class="b-sm b-default p-400" src="/images/fr/foundations/tokens/design-tokens-base.svg" alt="Trois lignes de texte montrent des exemples d’unités de style de base pour des niveaux de gris. La première ligne affiche un niveau de gris 50 suivi d’une flèche pointant vers l’unité de style --gcds-color-grayscale-50. La deuxième ligne affiche un niveau de gris 100 suivi d’une flèche pointant vers l’unité de style --gcds-color-grayscale-100. La troisième ligne affiche un niveau de gris 300 suivi d’une flèche pointant vers l’unité de style --gcds-color-grayscale-300."/>
+<img class="b-sm b-default p-300" src="/images/fr/foundations/tokens/design-tokens-base.svg" alt="Trois lignes de texte montrent des exemples d’unités de style de base pour des niveaux de gris. La première ligne affiche un niveau de gris 50 suivi d’une flèche pointant vers l’unité de style --gcds-color-grayscale-50. La deuxième ligne affiche un niveau de gris 100 suivi d’une flèche pointant vers l’unité de style --gcds-color-grayscale-100. La troisième ligne affiche un niveau de gris 300 suivi d’une flèche pointant vers l’unité de style --gcds-color-grayscale-300."/>
 
 ## Structure et nomenclature progressive des unités de style
 
@@ -70,18 +70,18 @@ Les unités de style sont caractérisées par une nomenclature progressive.
 
 ### Unité de style de composant
 
-<img class="b-sm b-default p-400" src="/images/fr/foundations/anatomy/anatomy-design-tokens-component.svg" alt="Une ligne de cinq mots où chaque mot est surligné et souligné d’une couleur différente. Deux traits d’union précèdent le premier mot, et un trait d’union sépare chaque mot. Chaque mot est rattaché à une étiquette affichant son type de nom. Le type de nom du premier mot est un préfixe : gcds. Le type de nom du deuxième mot est une catégorie (composant) : button. Le type de nom du troisième mot est un rôle : primary. Le type de nom du quatrième mot est un état : default. Le type de nom du cinquième mot est une propriété : background L’unité de style entière se lit comme suit : --gcds-button-primary-default-background."/>
+<img class="b-sm b-default p-300" src="/images/fr/foundations/anatomy/anatomy-design-tokens-component.svg" alt="Une ligne de cinq mots où chaque mot est surligné et souligné d’une couleur différente. Deux traits d’union précèdent le premier mot, et un trait d’union sépare chaque mot. Chaque mot est rattaché à une étiquette affichant son type de nom. Le type de nom du premier mot est un préfixe : gcds. Le type de nom du deuxième mot est une catégorie (composant) : button. Le type de nom du troisième mot est un rôle : primary. Le type de nom du quatrième mot est un état : default. Le type de nom du cinquième mot est une propriété : background L’unité de style entière se lit comme suit : --gcds-button-primary-default-background."/>
 
 ### Unité de style globale
 
-<img class="b-sm b-default p-400" src="/images/fr/foundations/anatomy/anatomy-design-tokens-global.svg" alt="Une ligne de trois mots où chaque mot est surligné et souligné d’une couleur différente. Deux traits d’union précèdent le premier mot, et un trait d’union sépare chaque mot. Chaque mot est rattaché à une étiquette affichant son type de nom. Le type de nom du premier mot est un préfixe : gcds. Le type de nom du deuxième mot est une catégorie (composant) : text. Le type de nom du troisième mot est un rôle ou un état : primary. L’unité de style entière se lit comme suit : --gcds-text-primary."/>
+<img class="b-sm b-default p-300" src="/images/fr/foundations/anatomy/anatomy-design-tokens-global.svg" alt="Une ligne de trois mots où chaque mot est surligné et souligné d’une couleur différente. Deux traits d’union précèdent le premier mot, et un trait d’union sépare chaque mot. Chaque mot est rattaché à une étiquette affichant son type de nom. Le type de nom du premier mot est un préfixe : gcds. Le type de nom du deuxième mot est une catégorie (composant) : text. Le type de nom du troisième mot est un rôle ou un état : primary. L’unité de style entière se lit comme suit : --gcds-text-primary."/>
 
 ### Unité de style globale – état global
 
-<img class="b-sm b-default p-400" src="/images/fr/foundations/anatomy/anatomy-design-tokens-global-state.svg" alt="Une ligne de trois mots où chaque mot est surligné et souligné d’une couleur différente. Deux traits d’union précèdent le premier mot, et un trait d’union sépare chaque mot. Chaque mot est rattaché à une étiquette affichant son type de nom. Le type de nom du premier mot est un préfixe : gcds. Le type de nom du deuxième mot est une catégorie (état) : focus. Le type de nom du troisième mot est une propriété : text. L’unité de style entière se lit comme suit : --gcds-focus-text."/>
+<img class="b-sm b-default p-300" src="/images/fr/foundations/anatomy/anatomy-design-tokens-global-state.svg" alt="Une ligne de trois mots où chaque mot est surligné et souligné d’une couleur différente. Deux traits d’union précèdent le premier mot, et un trait d’union sépare chaque mot. Chaque mot est rattaché à une étiquette affichant son type de nom. Le type de nom du premier mot est un préfixe : gcds. Le type de nom du deuxième mot est une catégorie (état) : focus. Le type de nom du troisième mot est une propriété : text. L’unité de style entière se lit comme suit : --gcds-focus-text."/>
 
 ### Unité de style de base
 
-<img class="b-sm b-default mb-500 p-400" src="/images/fr/foundations/anatomy/anatomy-design-tokens-base.svg" alt="Une ligne de trois mots où chaque mot est surligné et souligné d’une couleur différente. Deux traits d’union précèdent le premier mot, et un trait d’union sépare chaque mot. Chaque mot est rattaché à une étiquette affichant son type de nom. Le type de nom du premier mot est un préfixe : gcds. Le type de nom du deuxième mot est une catégorie (couleur) : grayscale. Le type de nom du troisième mot est une échelle : 100. L’unité de style entière se lit comme suit : --gcds-grayscale-100."/>
+<img class="b-sm b-default mb-600 p-300" src="/images/fr/foundations/anatomy/anatomy-design-tokens-base.svg" alt="Une ligne de trois mots où chaque mot est surligné et souligné d’une couleur différente. Deux traits d’union précèdent le premier mot, et un trait d’union sépare chaque mot. Chaque mot est rattaché à une étiquette affichant son type de nom. Le type de nom du premier mot est un préfixe : gcds. Le type de nom du deuxième mot est une catégorie (couleur) : grayscale. Le type de nom du troisième mot est une échelle : 100. L’unité de style entière se lit comme suit : --gcds-grayscale-100."/>
 
 {% include "partials/helpus.njk" %}
diff --git a/utils/display-tokens.js b/utils/display-tokens.js
index b6e09a68c..54e563283 100644
--- a/utils/display-tokens.js
+++ b/utils/display-tokens.js
@@ -27,7 +27,7 @@ const displayTokens = (token, subCategory, locale) => {
         tableBody += `<tr>
             <td>
               <div
-                style="width: var(--gcds-spacing-500); height: var(--gcds-spacing-500); border-radius: var(--gcds-spacing-500); background-color: ${
+                style="width: var(--gcds-spacing-600); height: var(--gcds-spacing-600); border-radius: var(--gcds-spacing-600); background-color: ${
                   tokens[i].value
                 }; border: 1px solid #EDEDED"
               >
@@ -223,7 +223,7 @@ const displayTokens = (token, subCategory, locale) => {
           tableBody += `<tr>
             <td>
               <div
-                style="width: var(--gcds-spacing-500); height: var(--gcds-spacing-500); border-radius: var(--gcds-spacing-500); background-color: ${
+                style="width: var(--gcds-spacing-600); height: var(--gcds-spacing-600); border-radius: var(--gcds-spacing-600); background-color: ${
                   tokens[i].value
                 }; border: 1px solid #EDEDED"
               >
@@ -239,7 +239,7 @@ const displayTokens = (token, subCategory, locale) => {
           tableBody += `<tr>
               <td>
                 <div
-                  style="width: var(--gcds-spacing-500); height: var(--gcds-spacing-500); border-radius: var(--gcds-spacing-500); background-color: ${tokens[i].value}; border: 1px solid #EDEDED"
+                  style="width: var(--gcds-spacing-600); height: var(--gcds-spacing-600); border-radius: var(--gcds-spacing-600); background-color: ${tokens[i].value}; border: 1px solid #EDEDED"
                 >
                 </div>
               </td>
@@ -268,7 +268,7 @@ const displayTokens = (token, subCategory, locale) => {
         tableBody += `<tr>
             <td>
               <div
-                style="width: var(--gcds-spacing-500); height: var(--gcds-spacing-500); border-radius: var(--gcds-spacing-500); background-color: ${
+                style="width: var(--gcds-spacing-600); height: var(--gcds-spacing-600); border-radius: var(--gcds-spacing-600); background-color: ${
                   tokens[i].value
                 }; border: 1px solid #EDEDED"
               >

From f0ac260e3e36184753781e3582025e743a4563ee Mon Sep 17 00:00:00 2001
From: Melanie Boeckmann <melanie.bockmann@gmail.com>
Date: Tue, 10 Dec 2024 09:01:04 -0800
Subject: [PATCH 04/11] refactor: update docs site with new typography and
 spacing

---
 src/fr/composants/groupe-de-boutons-radio/base.md         | 2 +-
 src/images/en/foundations/tokens/design-tokens-global.svg | 1 -
 2 files changed, 1 insertion(+), 2 deletions(-)

diff --git a/src/fr/composants/groupe-de-boutons-radio/base.md b/src/fr/composants/groupe-de-boutons-radio/base.md
index c540566eb..9ad58de46 100644
--- a/src/fr/composants/groupe-de-boutons-radio/base.md
+++ b/src/fr/composants/groupe-de-boutons-radio/base.md
@@ -16,7 +16,7 @@ Le groupe de boutons radio est un ensemble d’options permettant une sélection
 {% enddocLinks %}
 
 {% componentPreview "Aperçu du composant du groupe de boutons radio" "px-225 pt-300 pb-150" %}
-<gcds-fieldset fieldset-id="fieldset" legend="Legend" hint="Texte explicatif/Exemple de message.">
+<gcds-fieldset fieldset-id="fieldset" legend="Légende" hint="Texte explicatif/Exemple de message.">
 <gcds-radio-group name="radio" options='[{"id":"form-radio-1","label":"Libellé 1","hint":"Ceci est une description ou un exemple à titre de clarification."},{"id":"form-radio-2","label":"Libellé 2","hint":"Ceci est une description ou un exemple à titre de clarification."}]'>
 </gcds-radio-group>
 </gcds-fieldset>
diff --git a/src/images/en/foundations/tokens/design-tokens-global.svg b/src/images/en/foundations/tokens/design-tokens-global.svg
index baaf1a041..f95b22e72 100644
--- a/src/images/en/foundations/tokens/design-tokens-global.svg
+++ b/src/images/en/foundations/tokens/design-tokens-global.svg
@@ -1,6 +1,5 @@
 <svg width="350" height="193" viewBox="0 0 350 193" fill="none" xmlns="http://www.w3.org/2000/svg">
 <g clip-path="url(#clip0_375_4970)">
-<rect width="350" height="193" fill="white"/>
 <path d="M6.95028 4.72727V20H5.10085V6.66619H5.01136L1.28267 9.14204V7.26278L5.10085 4.72727H6.95028ZM11.7528 20.1193C11.3849 20.1193 11.0692 19.9876 10.8058 19.7241C10.5423 19.4606 10.4105 19.1449 10.4105 18.777C10.4105 18.4091 10.5423 18.0934 10.8058 17.8299C11.0692 17.5664 11.3849 17.4347 11.7528 17.4347C12.1207 17.4347 12.4364 17.5664 12.6999 17.8299C12.9634 18.0934 13.0952 18.4091 13.0952 18.777C13.0952 19.0206 13.033 19.2443 12.9087 19.4482C12.7894 19.652 12.6278 19.8161 12.424 19.9403C12.2251 20.0597 12.0014 20.1193 11.7528 20.1193ZM16.2235 20V18.6577L21.2647 13.1392C21.8564 12.4929 22.3436 11.9311 22.7264 11.4538C23.1092 10.9716 23.3926 10.5192 23.5765 10.0966C23.7654 9.66903 23.8599 9.22159 23.8599 8.75426C23.8599 8.21733 23.7306 7.75249 23.4721 7.35973C23.2186 6.96697 22.8706 6.66371 22.4281 6.44993C21.9856 6.23615 21.4885 6.12926 20.9366 6.12926C20.35 6.12926 19.8379 6.25107 19.4004 6.49467C18.9679 6.73331 18.6323 7.06889 18.3936 7.50142C18.16 7.93395 18.0431 8.44105 18.0431 9.02273H16.2832C16.2832 8.12784 16.4895 7.34233 16.9022 6.66619C17.3148 5.99006 17.8766 5.46307 18.5875 5.08523C19.3034 4.70739 20.1064 4.51847 20.9963 4.51847C21.8912 4.51847 22.6841 4.70739 23.3752 5.08523C24.0662 5.46307 24.6081 5.97266 25.0009 6.61399C25.3936 7.25533 25.59 7.96875 25.59 8.75426C25.59 9.31605 25.4881 9.86541 25.2843 10.4023C25.0854 10.9343 24.7374 11.5284 24.2402 12.1847C23.748 12.8359 23.0645 13.6314 22.1895 14.571L18.7591 18.2401V18.3594H25.8585V20H16.2235ZM33.7111 20.2088C32.8361 20.2088 32.0481 20.0348 31.3471 19.6868C30.6461 19.3388 30.0843 18.8615 29.6618 18.255C29.2392 17.6484 29.008 16.9574 28.9682 16.1818H30.758C30.8276 16.8729 31.1408 17.4446 31.6976 17.897C32.2594 18.3445 32.9306 18.5682 33.7111 18.5682C34.3375 18.5682 34.8944 18.4215 35.3816 18.1282C35.8738 17.8349 36.2591 17.4322 36.5375 16.9201C36.8208 16.4031 36.9625 15.8189 36.9625 15.1676C36.9625 14.5014 36.8159 13.9073 36.5226 13.3853C36.2342 12.8583 35.8365 12.4432 35.3294 12.1399C34.8223 11.8366 34.2431 11.6825 33.5918 11.6776C33.1245 11.6726 32.6447 11.7447 32.1525 11.8938C31.6603 12.038 31.2551 12.2244 30.937 12.4531L29.2069 12.2443L30.1316 4.72727H38.0662V6.3679H31.6827L31.1458 10.8722H31.2353C31.5485 10.6236 31.9412 10.4173 32.4135 10.2532C32.8858 10.0891 33.378 10.0071 33.8901 10.0071C34.8248 10.0071 35.6575 10.2308 36.3883 10.6783C37.1241 11.1207 37.7008 11.7273 38.1184 12.4979C38.541 13.2685 38.7523 14.1484 38.7523 15.1378C38.7523 16.1122 38.5336 16.9822 38.0961 17.7479C37.6635 18.5085 37.0669 19.1101 36.3063 19.5526C35.5456 19.9901 34.6806 20.2088 33.7111 20.2088ZM41.7446 20V8.54545H43.4449V10.2756H43.5642C43.773 9.70881 44.1508 9.24893 44.6977 8.89595C45.2446 8.54297 45.8611 8.36648 46.5471 8.36648C46.6764 8.36648 46.838 8.36896 47.0319 8.37393C47.2258 8.37891 47.3724 8.38636 47.4719 8.39631V10.1861C47.4122 10.1712 47.2755 10.1488 47.0617 10.119C46.8529 10.0842 46.6317 10.0668 46.398 10.0668C45.8412 10.0668 45.344 10.1836 44.9065 10.4173C44.474 10.646 44.1309 10.9641 43.8774 11.3718C43.6288 11.7745 43.5045 12.2344 43.5045 12.7514V20H41.7446ZM54.012 20.2386C52.9083 20.2386 51.9562 19.995 51.1558 19.5078C50.3604 19.0156 49.7464 18.3295 49.3138 17.4496C48.8863 16.5646 48.6725 15.5355 48.6725 14.3622C48.6725 13.1889 48.8863 12.1548 49.3138 11.2599C49.7464 10.3601 50.3479 9.65909 51.1185 9.15696C51.8941 8.64986 52.7989 8.39631 53.833 8.39631C54.4296 8.39631 55.0187 8.49574 55.6004 8.6946C56.1821 8.89347 56.7116 9.21662 57.1888 9.66406C57.6661 10.1065 58.0464 10.6932 58.3298 11.424C58.6132 12.1548 58.7549 13.0547 58.7549 14.1236V14.8693H49.9253V13.348H56.9651C56.9651 12.7017 56.8358 12.125 56.5773 11.6179C56.3238 11.1108 55.9608 10.7106 55.4885 10.4173C55.0212 10.1239 54.4694 9.97727 53.833 9.97727C53.132 9.97727 52.5255 10.1513 52.0134 10.4993C51.5063 10.8423 51.116 11.2898 50.8426 11.8416C50.5692 12.3935 50.4324 12.9851 50.4324 13.6165V14.6307C50.4324 15.4957 50.5816 16.229 50.8799 16.8306C51.1831 17.4272 51.6032 17.8821 52.1402 18.1953C52.6771 18.5036 53.301 18.6577 54.012 18.6577C54.4743 18.6577 54.892 18.593 55.2648 18.4638C55.6427 18.3295 55.9683 18.1307 56.2417 17.8672C56.5152 17.5987 56.7265 17.2656 56.8756 16.8679L58.5759 17.3452C58.3969 17.9219 58.0961 18.429 57.6736 18.8665C57.251 19.299 56.729 19.6371 56.1075 19.8807C55.4861 20.1193 54.7876 20.2386 54.012 20.2386ZM61.4321 20V8.54545H63.1324V10.3352H63.2815C63.5202 9.72372 63.9055 9.24893 64.4374 8.91087C64.9694 8.56783 65.6082 8.39631 66.354 8.39631C67.1096 8.39631 67.7385 8.56783 68.2407 8.91087C68.7478 9.24893 69.143 9.72372 69.4264 10.3352H69.5457C69.839 9.74361 70.279 9.27379 70.8657 8.92578C71.4523 8.5728 72.1558 8.39631 72.9761 8.39631C74.0003 8.39631 74.838 8.71697 75.4893 9.35831C76.1405 9.99467 76.4662 10.9865 76.4662 12.3338V20H74.7062V12.3338C74.7062 11.4886 74.4751 10.8846 74.0127 10.5217C73.5503 10.1587 73.0059 9.97727 72.3795 9.97727C71.5741 9.97727 70.9502 10.2209 70.5077 10.7081C70.0653 11.1903 69.844 11.8018 69.844 12.5426V20H68.0542V12.1548C68.0542 11.5036 67.843 10.979 67.4204 10.5813C66.9978 10.1786 66.4534 9.97727 65.7872 9.97727C65.3298 9.97727 64.9023 10.0991 64.5045 10.3427C64.1118 10.5863 63.7936 10.9244 63.55 11.3569C63.3113 11.7844 63.192 12.2791 63.192 12.8409V20H61.4321ZM133.497 12.6321V14.2727H126.815V12.6321H133.497ZM143.156 12.6321V14.2727H136.474V12.6321H143.156ZM150.876 24.5341C150.026 24.5341 149.295 24.4247 148.684 24.206C148.072 23.9922 147.562 23.7088 147.155 23.3558C146.752 23.0078 146.431 22.6349 146.193 22.2372L147.595 21.2528C147.754 21.4616 147.955 21.7003 148.199 21.9688C148.442 22.2422 148.775 22.4783 149.198 22.6772C149.626 22.881 150.185 22.983 150.876 22.983C151.801 22.983 152.564 22.7592 153.165 22.3118C153.767 21.8643 154.068 21.1634 154.068 20.2088V17.8821H153.919C153.789 18.0909 153.605 18.3494 153.367 18.6577C153.133 18.9609 152.795 19.2319 152.353 19.4705C151.915 19.7042 151.323 19.821 150.578 19.821C149.653 19.821 148.823 19.6023 148.087 19.1648C147.356 18.7273 146.777 18.0909 146.349 17.2557C145.927 16.4205 145.715 15.4062 145.715 14.2131C145.715 13.0398 145.922 12.0181 146.334 11.1481C146.747 10.2731 147.321 9.59695 148.057 9.11967C148.793 8.63743 149.643 8.39631 150.608 8.39631C151.353 8.39631 151.945 8.5206 152.382 8.76918C152.825 9.01278 153.163 9.29119 153.397 9.6044C153.635 9.91264 153.819 10.1662 153.948 10.3651H154.127V8.54545H155.828V20.3281C155.828 21.3125 155.604 22.1129 155.157 22.7294C154.714 23.3509 154.117 23.8058 153.367 24.0941C152.621 24.3874 151.791 24.5341 150.876 24.5341ZM150.816 18.2401C151.522 18.2401 152.119 18.0785 152.606 17.7553C153.093 17.4322 153.464 16.9673 153.717 16.3608C153.971 15.7543 154.098 15.0284 154.098 14.1832C154.098 13.358 153.973 12.6296 153.725 11.9982C153.476 11.3668 153.108 10.8722 152.621 10.5142C152.134 10.1562 151.532 9.97727 150.816 9.97727C150.071 9.97727 149.449 10.1662 148.952 10.544C148.46 10.9219 148.089 11.429 147.841 12.0653C147.597 12.7017 147.475 13.4077 147.475 14.1832C147.475 14.9787 147.6 15.6822 147.848 16.2937C148.102 16.9002 148.475 17.3775 148.967 17.7255C149.464 18.0685 150.081 18.2401 150.816 18.2401ZM163.703 20.2386C162.629 20.2386 161.704 19.9851 160.929 19.478C160.153 18.9709 159.556 18.2724 159.139 17.3825C158.721 16.4925 158.512 15.4759 158.512 14.3324C158.512 13.169 158.726 12.1424 159.154 11.2525C159.586 10.3576 160.188 9.65909 160.958 9.15696C161.734 8.64986 162.639 8.39631 163.673 8.39631C164.478 8.39631 165.204 8.54545 165.85 8.84375C166.497 9.14205 167.026 9.55966 167.439 10.0966C167.851 10.6335 168.108 11.2599 168.207 11.9759H166.447C166.313 11.4538 166.014 10.9915 165.552 10.5888C165.095 10.1811 164.478 9.97727 163.703 9.97727C163.017 9.97727 162.415 10.1562 161.898 10.5142C161.386 10.8672 160.986 11.3668 160.697 12.0131C160.414 12.6545 160.272 13.4077 160.272 14.2727C160.272 15.1577 160.411 15.9283 160.69 16.5845C160.973 17.2408 161.371 17.7504 161.883 18.1133C162.4 18.4762 163.007 18.6577 163.703 18.6577C164.16 18.6577 164.575 18.5781 164.948 18.419C165.321 18.2599 165.637 18.0312 165.895 17.733C166.154 17.4347 166.338 17.0767 166.447 16.6591H168.207C168.108 17.3352 167.861 17.9442 167.469 18.4862C167.081 19.0231 166.566 19.4506 165.925 19.7688C165.289 20.082 164.548 20.2386 163.703 20.2386ZM175.105 20.2386C174.15 20.2386 173.308 19.9975 172.577 19.5153C171.846 19.0281 171.274 18.342 170.862 17.457C170.449 16.5671 170.243 15.5156 170.243 14.3026C170.243 13.0994 170.449 12.0554 170.862 11.1705C171.274 10.2855 171.849 9.60192 172.584 9.11967C173.32 8.63743 174.17 8.39631 175.135 8.39631C175.881 8.39631 176.47 8.5206 176.902 8.76918C177.34 9.01278 177.673 9.29119 177.902 9.6044C178.135 9.91264 178.317 10.1662 178.446 10.3651H178.595V4.72727H180.355V20H178.655V18.2401H178.446C178.317 18.4489 178.133 18.7124 177.894 19.0305C177.655 19.3437 177.315 19.6246 176.872 19.8732C176.43 20.1168 175.841 20.2386 175.105 20.2386ZM175.344 18.6577C176.05 18.6577 176.646 18.4737 177.133 18.1058C177.621 17.733 177.991 17.2184 178.245 16.5621C178.498 15.9009 178.625 15.1378 178.625 14.2727C178.625 13.4176 178.501 12.6694 178.252 12.0281C178.003 11.3817 177.636 10.8796 177.148 10.5217C176.661 10.1587 176.06 9.97727 175.344 9.97727C174.598 9.97727 173.976 10.1687 173.479 10.5515C172.987 10.9293 172.617 11.4439 172.368 12.0952C172.125 12.7415 172.003 13.4673 172.003 14.2727C172.003 15.0881 172.127 15.8288 172.376 16.495C172.629 17.1562 173.002 17.6832 173.494 18.076C173.991 18.4638 174.608 18.6577 175.344 18.6577ZM191.936 11.1108L190.355 11.5582C190.256 11.2947 190.109 11.0387 189.915 10.7901C189.726 10.5366 189.468 10.3278 189.14 10.1637C188.812 9.99964 188.392 9.91761 187.88 9.91761C187.179 9.91761 186.594 10.0792 186.127 10.4023C185.665 10.7205 185.434 11.1257 185.434 11.6179C185.434 12.0554 185.593 12.4009 185.911 12.6545C186.229 12.908 186.726 13.1193 187.402 13.2884L189.103 13.706C190.127 13.9545 190.89 14.3349 191.392 14.8469C191.894 15.354 192.145 16.0078 192.145 16.8082C192.145 17.4645 191.956 18.0511 191.578 18.5682C191.206 19.0852 190.684 19.4929 190.012 19.7912C189.341 20.0895 188.561 20.2386 187.671 20.2386C186.502 20.2386 185.535 19.9851 184.77 19.478C184.004 18.9709 183.519 18.2301 183.316 17.2557L184.986 16.8381C185.145 17.4545 185.446 17.9169 185.888 18.2251C186.336 18.5334 186.92 18.6875 187.641 18.6875C188.461 18.6875 189.112 18.5135 189.595 18.1655C190.082 17.8125 190.326 17.3899 190.326 16.8977C190.326 16.5 190.186 16.1669 189.908 15.8984C189.63 15.625 189.202 15.4212 188.625 15.2869L186.716 14.8395C185.667 14.5909 184.897 14.2056 184.404 13.6836C183.917 13.1566 183.674 12.4979 183.674 11.7074C183.674 11.0611 183.855 10.4893 184.218 9.99219C184.586 9.49503 185.085 9.10476 185.717 8.82138C186.353 8.538 187.074 8.39631 187.88 8.39631C189.013 8.39631 189.903 8.64489 190.549 9.14204C191.201 9.6392 191.663 10.2955 191.936 11.1108ZM201.357 12.6321V14.2727H194.675V12.6321H201.357ZM209.554 8.54545V10.0369H203.38V8.54545H209.554ZM205.229 20V6.96449C205.229 6.30824 205.383 5.76136 205.691 5.32386C206 4.88636 206.4 4.55824 206.892 4.33949C207.384 4.12074 207.904 4.01136 208.451 4.01136C208.883 4.01136 209.236 4.04616 209.51 4.11577C209.783 4.18537 209.987 4.25 210.121 4.30966L209.614 5.83097C209.525 5.80114 209.4 5.76385 209.241 5.7191C209.087 5.67436 208.883 5.65199 208.63 5.65199C208.048 5.65199 207.628 5.79865 207.369 6.09197C207.116 6.3853 206.989 6.81534 206.989 7.3821V20H205.229ZM216.203 20.2386C215.169 20.2386 214.261 19.9925 213.481 19.5004C212.705 19.0082 212.099 18.3196 211.661 17.4347C211.229 16.5497 211.012 15.5156 211.012 14.3324C211.012 13.1392 211.229 12.0977 211.661 11.2077C212.099 10.3178 212.705 9.62678 213.481 9.13459C214.261 8.6424 215.169 8.39631 216.203 8.39631C217.237 8.39631 218.142 8.6424 218.917 9.13459C219.698 9.62678 220.304 10.3178 220.737 11.2077C221.174 12.0977 221.393 13.1392 221.393 14.3324C221.393 15.5156 221.174 16.5497 220.737 17.4347C220.304 18.3196 219.698 19.0082 218.917 19.5004C218.142 19.9925 217.237 20.2386 216.203 20.2386ZM216.203 18.6577C216.988 18.6577 217.634 18.4563 218.142 18.0536C218.649 17.6509 219.024 17.1214 219.268 16.4652C219.511 15.8089 219.633 15.098 219.633 14.3324C219.633 13.5668 219.511 12.8533 219.268 12.1921C219.024 11.5309 218.649 10.9964 218.142 10.5888C217.634 10.1811 216.988 9.97727 216.203 9.97727C215.417 9.97727 214.771 10.1811 214.264 10.5888C213.757 10.9964 213.381 11.5309 213.138 12.1921C212.894 12.8533 212.772 13.5668 212.772 14.3324C212.772 15.098 212.894 15.8089 213.138 16.4652C213.381 17.1214 213.757 17.6509 214.264 18.0536C214.771 18.4563 215.417 18.6577 216.203 18.6577ZM225.839 13.1094V20H224.08V8.54545H225.78V10.3352H225.929C226.197 9.75355 226.605 9.28622 227.152 8.93324C227.699 8.57528 228.405 8.39631 229.27 8.39631C230.045 8.39631 230.724 8.5554 231.306 8.87358C231.887 9.18679 232.34 9.66406 232.663 10.3054C232.986 10.9418 233.148 11.7472 233.148 12.7216V20H231.388V12.8409C231.388 11.9411 231.154 11.2401 230.687 10.7379C230.219 10.2308 229.578 9.97727 228.763 9.97727C228.201 9.97727 227.699 10.0991 227.256 10.3427C226.819 10.5863 226.473 10.9418 226.22 11.4091C225.966 11.8764 225.839 12.4432 225.839 13.1094ZM241.345 8.54545V10.0369H235.409V8.54545H241.345ZM237.139 5.80114H238.899V16.7188C238.899 17.2159 238.971 17.5888 239.116 17.8374C239.265 18.081 239.454 18.245 239.682 18.3295C239.916 18.4091 240.162 18.4489 240.421 18.4489C240.614 18.4489 240.774 18.4389 240.898 18.419C241.022 18.3942 241.122 18.3743 241.196 18.3594L241.554 19.9403C241.435 19.9851 241.268 20.0298 241.054 20.0746C240.841 20.1243 240.57 20.1491 240.242 20.1491C239.744 20.1491 239.257 20.0423 238.78 19.8285C238.308 19.6147 237.915 19.2891 237.602 18.8516C237.293 18.4141 237.139 17.8622 237.139 17.196V5.80114ZM250.145 12.6321V14.2727H243.463V12.6321H250.145ZM261.355 11.1108L259.774 11.5582C259.675 11.2947 259.528 11.0387 259.334 10.7901C259.145 10.5366 258.887 10.3278 258.559 10.1637C258.231 9.99964 257.811 9.91761 257.298 9.91761C256.597 9.91761 256.013 10.0792 255.546 10.4023C255.084 10.7205 254.852 11.1257 254.852 11.6179C254.852 12.0554 255.012 12.4009 255.33 12.6545C255.648 12.908 256.145 13.1193 256.821 13.2884L258.521 13.706C259.546 13.9545 260.309 14.3349 260.811 14.8469C261.313 15.354 261.564 16.0078 261.564 16.8082C261.564 17.4645 261.375 18.0511 260.997 18.5682C260.624 19.0852 260.102 19.4929 259.431 19.7912C258.76 20.0895 257.98 20.2386 257.09 20.2386C255.921 20.2386 254.954 19.9851 254.189 19.478C253.423 18.9709 252.938 18.2301 252.735 17.2557L254.405 16.8381C254.564 17.4545 254.865 17.9169 255.307 18.2251C255.755 18.5334 256.339 18.6875 257.06 18.6875C257.88 18.6875 258.531 18.5135 259.014 18.1655C259.501 17.8125 259.744 17.3899 259.744 16.8977C259.744 16.5 259.605 16.1669 259.327 15.8984C259.048 15.625 258.621 15.4212 258.044 15.2869L256.135 14.8395C255.086 14.5909 254.316 14.2056 253.823 13.6836C253.336 13.1566 253.093 12.4979 253.093 11.7074C253.093 11.0611 253.274 10.4893 253.637 9.99219C254.005 9.49503 254.504 9.10476 255.136 8.82138C255.772 8.538 256.493 8.39631 257.298 8.39631C258.432 8.39631 259.322 8.64489 259.968 9.14204C260.619 9.6392 261.082 10.2955 261.355 11.1108ZM264.213 20V8.54545H265.973V20H264.213ZM265.108 6.63636C264.765 6.63636 264.469 6.51953 264.221 6.28587C263.977 6.0522 263.855 5.77131 263.855 5.44318C263.855 5.11506 263.977 4.83416 264.221 4.6005C264.469 4.36683 264.765 4.25 265.108 4.25C265.451 4.25 265.745 4.36683 265.988 4.6005C266.237 4.83416 266.361 5.11506 266.361 5.44318C266.361 5.77131 266.237 6.0522 265.988 6.28587C265.745 6.51953 265.451 6.63636 265.108 6.63636ZM268.869 20V18.6577L275.371 10.3054V10.1861H269.077V8.54545H277.638V9.94744L271.315 18.2401V18.3594H277.847V20H268.869ZM285.032 20.2386C283.929 20.2386 282.977 19.995 282.176 19.5078C281.381 19.0156 280.767 18.3295 280.334 17.4496C279.907 16.5646 279.693 15.5355 279.693 14.3622C279.693 13.1889 279.907 12.1548 280.334 11.2599C280.767 10.3601 281.368 9.65909 282.139 9.15696C282.915 8.64986 283.819 8.39631 284.854 8.39631C285.45 8.39631 286.039 8.49574 286.621 8.6946C287.203 8.89347 287.732 9.21662 288.209 9.66406C288.687 10.1065 289.067 10.6932 289.35 11.424C289.634 12.1548 289.775 13.0547 289.775 14.1236V14.8693H280.946V13.348H287.986C287.986 12.7017 287.856 12.125 287.598 11.6179C287.344 11.1108 286.981 10.7106 286.509 10.4173C286.042 10.1239 285.49 9.97727 284.854 9.97727C284.153 9.97727 283.546 10.1513 283.034 10.4993C282.527 10.8423 282.137 11.2898 281.863 11.8416C281.59 12.3935 281.453 12.9851 281.453 13.6165V14.6307C281.453 15.4957 281.602 16.229 281.9 16.8306C282.204 17.4272 282.624 17.8821 283.161 18.1953C283.698 18.5036 284.322 18.6577 285.032 18.6577C285.495 18.6577 285.912 18.593 286.285 18.4638C286.663 18.3295 286.989 18.1307 287.262 17.8672C287.536 17.5987 287.747 17.2656 287.896 16.8679L289.596 17.3452C289.417 17.9219 289.117 18.429 288.694 18.8665C288.271 19.299 287.749 19.6371 287.128 19.8807C286.507 20.1193 285.808 20.2386 285.032 20.2386ZM300.566 11.1108L298.985 11.5582C298.886 11.2947 298.739 11.0387 298.545 10.7901C298.356 10.5366 298.098 10.3278 297.77 10.1637C297.442 9.99964 297.021 9.91761 296.509 9.91761C295.808 9.91761 295.224 10.0792 294.757 10.4023C294.295 10.7205 294.063 11.1257 294.063 11.6179C294.063 12.0554 294.222 12.4009 294.541 12.6545C294.859 12.908 295.356 13.1193 296.032 13.2884L297.732 13.706C298.757 13.9545 299.52 14.3349 300.022 14.8469C300.524 15.354 300.775 16.0078 300.775 16.8082C300.775 17.4645 300.586 18.0511 300.208 18.5682C299.835 19.0852 299.313 19.4929 298.642 19.7912C297.971 20.0895 297.191 20.2386 296.301 20.2386C295.132 20.2386 294.165 19.9851 293.4 19.478C292.634 18.9709 292.149 18.2301 291.945 17.2557L293.616 16.8381C293.775 17.4545 294.076 17.9169 294.518 18.2251C294.966 18.5334 295.55 18.6875 296.271 18.6875C297.091 18.6875 297.742 18.5135 298.225 18.1655C298.712 17.8125 298.955 17.3899 298.955 16.8977C298.955 16.5 298.816 16.1669 298.538 15.8984C298.259 15.625 297.832 15.4212 297.255 15.2869L295.346 14.8395C294.297 14.5909 293.526 14.2056 293.034 13.6836C292.547 13.1566 292.303 12.4979 292.303 11.7074C292.303 11.0611 292.485 10.4893 292.848 9.99219C293.216 9.49503 293.715 9.10476 294.347 8.82138C294.983 8.538 295.704 8.39631 296.509 8.39631C297.643 8.39631 298.533 8.64489 299.179 9.14204C299.83 9.6392 300.293 10.2955 300.566 11.1108ZM309.987 12.6321V14.2727H303.305V12.6321H309.987ZM318.065 8.54545V10.0369H312.129V8.54545H318.065ZM313.859 5.80114H315.619V16.7188C315.619 17.2159 315.691 17.5888 315.835 17.8374C315.984 18.081 316.173 18.245 316.402 18.3295C316.636 18.4091 316.882 18.4489 317.14 18.4489C317.334 18.4489 317.493 18.4389 317.618 18.419C317.742 18.3942 317.841 18.3743 317.916 18.3594L318.274 19.9403C318.154 19.9851 317.988 20.0298 317.774 20.0746C317.56 20.1243 317.289 20.1491 316.961 20.1491C316.464 20.1491 315.977 20.0423 315.5 19.8285C315.027 19.6147 314.635 19.2891 314.321 18.8516C314.013 18.4141 313.859 17.8622 313.859 17.196V5.80114ZM325.392 20.2386C324.288 20.2386 323.336 19.995 322.536 19.5078C321.74 19.0156 321.126 18.3295 320.694 17.4496C320.266 16.5646 320.052 15.5355 320.052 14.3622C320.052 13.1889 320.266 12.1548 320.694 11.2599C321.126 10.3601 321.728 9.65909 322.498 9.15696C323.274 8.64986 324.179 8.39631 325.213 8.39631C325.809 8.39631 326.399 8.49574 326.98 8.6946C327.562 8.89347 328.091 9.21662 328.569 9.66406C329.046 10.1065 329.426 10.6932 329.71 11.424C329.993 12.1548 330.135 13.0547 330.135 14.1236V14.8693H321.305V13.348H328.345C328.345 12.7017 328.216 12.125 327.957 11.6179C327.704 11.1108 327.341 10.7106 326.868 10.4173C326.401 10.1239 325.849 9.97727 325.213 9.97727C324.512 9.97727 323.905 10.1513 323.393 10.4993C322.886 10.8423 322.496 11.2898 322.222 11.8416C321.949 12.3935 321.812 12.9851 321.812 13.6165V14.6307C321.812 15.4957 321.961 16.229 322.26 16.8306C322.563 17.4272 322.983 17.8821 323.52 18.1953C324.057 18.5036 324.681 18.6577 325.392 18.6577C325.854 18.6577 326.272 18.593 326.645 18.4638C327.023 18.3295 327.348 18.1307 327.622 17.8672C327.895 17.5987 328.106 17.2656 328.256 16.8679L329.956 17.3452C329.777 17.9219 329.476 18.429 329.053 18.8665C328.631 19.299 328.109 19.6371 327.487 19.8807C326.866 20.1193 326.167 20.2386 325.392 20.2386ZM333.817 8.54545L336.561 13.2287L339.305 8.54545H341.334L337.635 14.2727L341.334 20H339.305L336.561 15.5554L333.817 20H331.788L335.428 14.2727L331.788 8.54545H333.817ZM348.827 8.54545V10.0369H342.891V8.54545H348.827ZM344.621 5.80114H346.381V16.7188C346.381 17.2159 346.453 17.5888 346.597 17.8374C346.746 18.081 346.935 18.245 347.164 18.3295C347.397 18.4091 347.643 18.4489 347.902 18.4489C348.096 18.4489 348.255 18.4389 348.379 18.419C348.504 18.3942 348.603 18.3743 348.678 18.3594L349.036 19.9403C348.916 19.9851 348.75 20.0298 348.536 20.0746C348.322 20.1243 348.051 20.1491 347.723 20.1491C347.226 20.1491 346.739 20.0423 346.261 19.8285C345.789 19.6147 345.396 19.2891 345.083 18.8516C344.775 18.4141 344.621 17.8622 344.621 17.196V5.80114Z" fill="black"/>
 <path d="M6.74148 105.209C5.7571 105.209 4.87962 105.04 4.10902 104.702C3.3434 104.364 2.73438 103.894 2.28196 103.292C1.83452 102.686 1.59091 101.982 1.55114 101.182H3.4304C3.47017 101.674 3.6392 102.099 3.9375 102.457C4.2358 102.81 4.62607 103.083 5.10831 103.277C5.59055 103.471 6.125 103.568 6.71165 103.568C7.3679 103.568 7.94957 103.454 8.45668 103.225C8.96378 102.996 9.36151 102.678 9.64986 102.271C9.93821 101.863 10.0824 101.391 10.0824 100.854C10.0824 100.292 9.94318 99.7972 9.66477 99.3697C9.38636 98.9371 8.97869 98.5991 8.44176 98.3555C7.90483 98.1119 7.24858 97.9901 6.47301 97.9901H5.25V96.3494H6.47301C7.07955 96.3494 7.61151 96.2401 8.06889 96.0213C8.53125 95.8026 8.89169 95.4943 9.15021 95.0966C9.41371 94.6989 9.54545 94.2315 9.54545 93.6946C9.54545 93.1776 9.43111 92.7276 9.20242 92.3448C8.97372 91.962 8.65057 91.6637 8.23295 91.4499C7.82031 91.2362 7.3331 91.1293 6.77131 91.1293C6.24432 91.1293 5.74716 91.2262 5.27983 91.4201C4.81747 91.609 4.43963 91.8849 4.14631 92.2479C3.85298 92.6058 3.69389 93.0384 3.66903 93.5455H1.87926C1.90909 92.745 2.15021 92.044 2.60263 91.4425C3.05504 90.8359 3.64666 90.3636 4.37749 90.0256C5.11328 89.6875 5.92117 89.5185 6.80114 89.5185C7.74574 89.5185 8.55611 89.7099 9.23224 90.0927C9.90838 90.4705 10.4279 90.9702 10.7908 91.5916C11.1538 92.2131 11.3352 92.8842 11.3352 93.6051C11.3352 94.4652 11.109 95.1985 10.6566 95.805C10.2092 96.4116 9.60014 96.8317 8.82955 97.0653V97.1847C9.79403 97.3437 10.5472 97.7539 11.0891 98.4151C11.631 99.0714 11.902 99.8842 11.902 100.854C11.902 101.684 11.6758 102.43 11.2234 103.091C10.7759 103.747 10.1644 104.264 9.38885 104.642C8.61328 105.02 7.73082 105.209 6.74148 105.209ZM14.9819 105V93.5455H16.6822V95.2756H16.8015C17.0103 94.7088 17.3881 94.2489 17.935 93.896C18.4819 93.543 19.0984 93.3665 19.7844 93.3665C19.9137 93.3665 20.0753 93.369 20.2692 93.3739C20.4631 93.3789 20.6097 93.3864 20.7092 93.3963V95.1861C20.6495 95.1712 20.5128 95.1488 20.299 95.119C20.0902 95.0842 19.869 95.0668 19.6353 95.0668C19.0785 95.0668 18.5813 95.1836 18.1438 95.4173C17.7113 95.646 17.3683 95.9641 17.1147 96.3718C16.8661 96.7745 16.7418 97.2344 16.7418 97.7514V105H14.9819ZM27.2493 105.239C26.1456 105.239 25.1935 104.995 24.3931 104.508C23.5977 104.016 22.9837 103.33 22.5511 102.45C22.1236 101.565 21.9098 100.536 21.9098 99.3622C21.9098 98.1889 22.1236 97.1548 22.5511 96.2599C22.9837 95.3601 23.5852 94.6591 24.3558 94.157C25.1314 93.6499 26.0362 93.3963 27.0703 93.3963C27.6669 93.3963 28.256 93.4957 28.8377 93.6946C29.4194 93.8935 29.9489 94.2166 30.4261 94.6641C30.9034 95.1065 31.2837 95.6932 31.5671 96.424C31.8505 97.1548 31.9922 98.0547 31.9922 99.1236V99.8693H23.1626V98.348H30.2024C30.2024 97.7017 30.0732 97.125 29.8146 96.6179C29.5611 96.1108 29.1982 95.7106 28.7259 95.4173C28.2585 95.1239 27.7067 94.9773 27.0703 94.9773C26.3693 94.9773 25.7628 95.1513 25.2507 95.4993C24.7436 95.8423 24.3533 96.2898 24.0799 96.8416C23.8065 97.3935 23.6697 97.9851 23.6697 98.6165V99.6307C23.6697 100.496 23.8189 101.229 24.1172 101.831C24.4205 102.427 24.8406 102.882 25.3775 103.195C25.9144 103.504 26.5384 103.658 27.2493 103.658C27.7116 103.658 28.1293 103.593 28.5021 103.464C28.88 103.33 29.2056 103.131 29.479 102.867C29.7525 102.599 29.9638 102.266 30.1129 101.868L31.8132 102.345C31.6342 102.922 31.3335 103.429 30.9109 103.866C30.4883 104.299 29.9663 104.637 29.3448 104.881C28.7234 105.119 28.0249 105.239 27.2493 105.239ZM34.6694 105V93.5455H36.3697V95.3352H36.5188C36.7575 94.7237 37.1428 94.2489 37.6747 93.9109C38.2067 93.5678 38.8455 93.3963 39.5913 93.3963C40.3469 93.3963 40.9759 93.5678 41.478 93.9109C41.9851 94.2489 42.3803 94.7237 42.6637 95.3352H42.783C43.0763 94.7436 43.5163 94.2738 44.103 93.9258C44.6896 93.5728 45.3931 93.3963 46.2134 93.3963C47.2376 93.3963 48.0753 93.717 48.7266 94.3583C49.3778 94.9947 49.7035 95.9865 49.7035 97.3338V105H47.9435V97.3338C47.9435 96.4886 47.7124 95.8846 47.25 95.5217C46.7876 95.1587 46.2433 94.9773 45.6168 94.9773C44.8114 94.9773 44.1875 95.2209 43.745 95.7081C43.3026 96.1903 43.0813 96.8018 43.0813 97.5426V105H41.2915V97.1548C41.2915 96.5036 41.0803 95.979 40.6577 95.5813C40.2351 95.1786 39.6907 94.9773 39.0245 94.9773C38.5671 94.9773 38.1396 95.0991 37.7418 95.3427C37.3491 95.5863 37.0309 95.9244 36.7873 96.3569C36.5487 96.7844 36.4293 97.2791 36.4293 97.8409V105H34.6694ZM106.734 97.6321V99.2727H100.052V97.6321H106.734ZM116.393 97.6321V99.2727H109.711V97.6321H116.393ZM124.113 109.534C123.263 109.534 122.532 109.425 121.921 109.206C121.309 108.992 120.8 108.709 120.392 108.356C119.989 108.008 119.669 107.635 119.43 107.237L120.832 106.253C120.991 106.462 121.192 106.7 121.436 106.969C121.68 107.242 122.013 107.478 122.435 107.677C122.863 107.881 123.422 107.983 124.113 107.983C125.038 107.983 125.801 107.759 126.403 107.312C127.004 106.864 127.305 106.163 127.305 105.209V102.882H127.156C127.027 103.091 126.843 103.349 126.604 103.658C126.37 103.961 126.032 104.232 125.59 104.471C125.152 104.704 124.561 104.821 123.815 104.821C122.89 104.821 122.06 104.602 121.324 104.165C120.593 103.727 120.014 103.091 119.587 102.256C119.164 101.42 118.953 100.406 118.953 99.2131C118.953 98.0398 119.159 97.0181 119.572 96.1481C119.984 95.2731 120.559 94.5969 121.294 94.1197C122.03 93.6374 122.88 93.3963 123.845 93.3963C124.591 93.3963 125.182 93.5206 125.62 93.7692C126.062 94.0128 126.4 94.2912 126.634 94.6044C126.873 94.9126 127.056 95.1662 127.186 95.3651H127.365V93.5455H129.065V105.328C129.065 106.312 128.841 107.113 128.394 107.729C127.951 108.351 127.355 108.806 126.604 109.094C125.858 109.387 125.028 109.534 124.113 109.534ZM124.054 103.24C124.76 103.24 125.356 103.078 125.843 102.755C126.331 102.432 126.701 101.967 126.955 101.361C127.208 100.754 127.335 100.028 127.335 99.1832C127.335 98.358 127.211 97.6296 126.962 96.9982C126.713 96.3668 126.346 95.8722 125.858 95.5142C125.371 95.1562 124.77 94.9773 124.054 94.9773C123.308 94.9773 122.686 95.1662 122.189 95.544C121.697 95.9219 121.327 96.429 121.078 97.0653C120.835 97.7017 120.713 98.4077 120.713 99.1832C120.713 99.9787 120.837 100.682 121.086 101.294C121.339 101.9 121.712 102.377 122.204 102.725C122.701 103.069 123.318 103.24 124.054 103.24ZM136.94 105.239C135.866 105.239 134.941 104.985 134.166 104.478C133.39 103.971 132.794 103.272 132.376 102.382C131.958 101.493 131.75 100.476 131.75 99.3324C131.75 98.169 131.963 97.1424 132.391 96.2525C132.824 95.3576 133.425 94.6591 134.196 94.157C134.971 93.6499 135.876 93.3963 136.91 93.3963C137.716 93.3963 138.441 93.5455 139.088 93.8438C139.734 94.142 140.263 94.5597 140.676 95.0966C141.089 95.6335 141.345 96.2599 141.444 96.9759H139.684C139.55 96.4538 139.252 95.9915 138.789 95.5888C138.332 95.1811 137.716 94.9773 136.94 94.9773C136.254 94.9773 135.652 95.1562 135.135 95.5142C134.623 95.8672 134.223 96.3668 133.935 97.0131C133.651 97.6545 133.51 98.4077 133.51 99.2727C133.51 100.158 133.649 100.928 133.927 101.585C134.211 102.241 134.608 102.75 135.12 103.113C135.637 103.476 136.244 103.658 136.94 103.658C137.397 103.658 137.812 103.578 138.185 103.419C138.558 103.26 138.874 103.031 139.132 102.733C139.391 102.435 139.575 102.077 139.684 101.659H141.444C141.345 102.335 141.099 102.944 140.706 103.486C140.318 104.023 139.804 104.451 139.162 104.769C138.526 105.082 137.785 105.239 136.94 105.239ZM148.342 105.239C147.388 105.239 146.545 104.998 145.814 104.515C145.083 104.028 144.512 103.342 144.099 102.457C143.686 101.567 143.48 100.516 143.48 99.3026C143.48 98.0994 143.686 97.0554 144.099 96.1705C144.512 95.2855 145.086 94.6019 145.822 94.1197C146.558 93.6374 147.408 93.3963 148.372 93.3963C149.118 93.3963 149.707 93.5206 150.14 93.7692C150.577 94.0128 150.91 94.2912 151.139 94.6044C151.373 94.9126 151.554 95.1662 151.683 95.3651H151.832V89.7273H153.592V105H151.892V103.24H151.683C151.554 103.449 151.37 103.712 151.131 104.031C150.893 104.344 150.552 104.625 150.11 104.873C149.667 105.117 149.078 105.239 148.342 105.239ZM148.581 103.658C149.287 103.658 149.884 103.474 150.371 103.106C150.858 102.733 151.228 102.218 151.482 101.562C151.735 100.901 151.862 100.138 151.862 99.2727C151.862 98.4176 151.738 97.6694 151.489 97.0281C151.241 96.3817 150.873 95.8796 150.386 95.5217C149.898 95.1587 149.297 94.9773 148.581 94.9773C147.835 94.9773 147.214 95.1687 146.717 95.5515C146.224 95.9293 145.854 96.4439 145.605 97.0952C145.362 97.7415 145.24 98.4673 145.24 99.2727C145.24 100.088 145.364 100.829 145.613 101.495C145.866 102.156 146.239 102.683 146.732 103.076C147.229 103.464 147.845 103.658 148.581 103.658ZM165.174 96.1108L163.593 96.5582C163.493 96.2947 163.347 96.0387 163.153 95.7901C162.964 95.5366 162.705 95.3278 162.377 95.1637C162.049 94.9996 161.629 94.9176 161.117 94.9176C160.416 94.9176 159.832 95.0792 159.364 95.4023C158.902 95.7205 158.671 96.1257 158.671 96.6179C158.671 97.0554 158.83 97.4009 159.148 97.6545C159.466 97.908 159.963 98.1193 160.64 98.2884L162.34 98.706C163.364 98.9545 164.127 99.3349 164.629 99.8469C165.131 100.354 165.382 101.008 165.382 101.808C165.382 102.464 165.194 103.051 164.816 103.568C164.443 104.085 163.921 104.493 163.25 104.791C162.578 105.089 161.798 105.239 160.908 105.239C159.74 105.239 158.773 104.985 158.007 104.478C157.241 103.971 156.757 103.23 156.553 102.256L158.223 101.838C158.382 102.455 158.683 102.917 159.126 103.225C159.573 103.533 160.157 103.688 160.878 103.688C161.699 103.688 162.35 103.513 162.832 103.165C163.319 102.812 163.563 102.39 163.563 101.898C163.563 101.5 163.424 101.167 163.145 100.898C162.867 100.625 162.439 100.421 161.863 100.287L159.953 99.8395C158.904 99.5909 158.134 99.2056 157.642 98.6836C157.154 98.1566 156.911 97.4979 156.911 96.7074C156.911 96.0611 157.092 95.4893 157.455 94.9922C157.823 94.495 158.323 94.1048 158.954 93.8214C159.591 93.538 160.311 93.3963 161.117 93.3963C162.25 93.3963 163.14 93.6449 163.787 94.142C164.438 94.6392 164.9 95.2955 165.174 96.1108ZM174.594 97.6321V99.2727H167.912V97.6321H174.594ZM185.805 96.1108L184.224 96.5582C184.124 96.2947 183.977 96.0387 183.784 95.7901C183.595 95.5366 183.336 95.3278 183.008 95.1637C182.68 94.9996 182.26 94.9176 181.748 94.9176C181.047 94.9176 180.463 95.0792 179.995 95.4023C179.533 95.7205 179.302 96.1257 179.302 96.6179C179.302 97.0554 179.461 97.4009 179.779 97.6545C180.097 97.908 180.594 98.1193 181.27 98.2884L182.971 98.706C183.995 98.9545 184.758 99.3349 185.26 99.8469C185.762 100.354 186.013 101.008 186.013 101.808C186.013 102.464 185.824 103.051 185.447 103.568C185.074 104.085 184.552 104.493 183.881 104.791C183.209 105.089 182.429 105.239 181.539 105.239C180.371 105.239 179.404 104.985 178.638 104.478C177.872 103.971 177.388 103.23 177.184 102.256L178.854 101.838C179.013 102.455 179.314 102.917 179.757 103.225C180.204 103.533 180.788 103.688 181.509 103.688C182.329 103.688 182.981 103.513 183.463 103.165C183.95 102.812 184.194 102.39 184.194 101.898C184.194 101.5 184.055 101.167 183.776 100.898C183.498 100.625 183.07 100.421 182.493 100.287L180.584 99.8395C179.535 99.5909 178.765 99.2056 178.273 98.6836C177.785 98.1566 177.542 97.4979 177.542 96.7074C177.542 96.0611 177.723 95.4893 178.086 94.9922C178.454 94.495 178.954 94.1048 179.585 93.8214C180.221 93.538 180.942 93.3963 181.748 93.3963C182.881 93.3963 183.771 93.6449 184.417 94.142C185.069 94.6392 185.531 95.2955 185.805 96.1108ZM188.663 109.295V93.5455H190.363V95.3651H190.572C190.701 95.1662 190.88 94.9126 191.109 94.6044C191.342 94.2912 191.675 94.0128 192.108 93.7692C192.545 93.5206 193.137 93.3963 193.883 93.3963C194.847 93.3963 195.697 93.6374 196.433 94.1197C197.169 94.6019 197.743 95.2855 198.156 96.1705C198.568 97.0554 198.775 98.0994 198.775 99.3026C198.775 100.516 198.568 101.567 198.156 102.457C197.743 103.342 197.171 104.028 196.441 104.515C195.71 104.998 194.867 105.239 193.913 105.239C193.177 105.239 192.588 105.117 192.145 104.873C191.703 104.625 191.362 104.344 191.123 104.031C190.885 103.712 190.701 103.449 190.572 103.24H190.422V109.295H188.663ZM190.393 99.2727C190.393 100.138 190.519 100.901 190.773 101.562C191.027 102.218 191.397 102.733 191.884 103.106C192.371 103.474 192.968 103.658 193.674 103.658C194.41 103.658 195.024 103.464 195.516 103.076C196.013 102.683 196.386 102.156 196.634 101.495C196.888 100.829 197.015 100.088 197.015 99.2727C197.015 98.4673 196.891 97.7415 196.642 97.0952C196.398 96.4439 196.028 95.9293 195.531 95.5515C195.039 95.1687 194.42 94.9773 193.674 94.9773C192.958 94.9773 192.356 95.1587 191.869 95.5217C191.382 95.8796 191.014 96.3817 190.766 97.0281C190.517 97.6694 190.393 98.4176 190.393 99.2727ZM204.83 105.268C204.104 105.268 203.446 105.132 202.854 104.858C202.262 104.58 201.793 104.18 201.445 103.658C201.097 103.131 200.922 102.494 200.922 101.749C200.922 101.092 201.052 100.56 201.31 100.153C201.569 99.7401 201.914 99.4169 202.347 99.1832C202.779 98.9496 203.257 98.7756 203.779 98.6612C204.306 98.5419 204.835 98.4474 205.367 98.3778C206.063 98.2884 206.627 98.2212 207.06 98.1765C207.497 98.1268 207.816 98.0447 208.014 97.9304C208.218 97.8161 208.32 97.6172 208.32 97.3338V97.2741C208.32 96.5384 208.119 95.9666 207.716 95.5589C207.318 95.1513 206.714 94.9474 205.904 94.9474C205.064 94.9474 204.405 95.1314 203.928 95.4993C203.451 95.8672 203.115 96.2599 202.921 96.6776L201.251 96.081C201.549 95.3849 201.947 94.843 202.444 94.4553C202.946 94.0625 203.493 93.7891 204.084 93.6349C204.681 93.4759 205.268 93.3963 205.844 93.3963C206.212 93.3963 206.635 93.4411 207.112 93.5305C207.594 93.6151 208.059 93.7915 208.507 94.06C208.959 94.3285 209.334 94.7337 209.633 95.2756C209.931 95.8175 210.08 96.5433 210.08 97.4531V105H208.32V103.449H208.231C208.111 103.697 207.913 103.963 207.634 104.247C207.356 104.53 206.985 104.771 206.523 104.97C206.061 105.169 205.496 105.268 204.83 105.268ZM205.099 103.688C205.795 103.688 206.381 103.551 206.859 103.277C207.341 103.004 207.704 102.651 207.947 102.218C208.196 101.786 208.32 101.331 208.32 100.854V99.2429C208.246 99.3324 208.082 99.4144 207.828 99.489C207.579 99.5586 207.291 99.6207 206.963 99.6754C206.64 99.7251 206.324 99.7699 206.016 99.8097C205.713 99.8445 205.467 99.8743 205.278 99.8991C204.82 99.9588 204.393 100.056 203.995 100.19C203.602 100.319 203.284 100.516 203.04 100.779C202.802 101.038 202.682 101.391 202.682 101.838C202.682 102.45 202.909 102.912 203.361 103.225C203.818 103.533 204.398 103.688 205.099 103.688ZM217.946 105.239C216.872 105.239 215.947 104.985 215.172 104.478C214.396 103.971 213.8 103.272 213.382 102.382C212.964 101.493 212.756 100.476 212.756 99.3324C212.756 98.169 212.969 97.1424 213.397 96.2525C213.829 95.3576 214.431 94.6591 215.202 94.157C215.977 93.6499 216.882 93.3963 217.916 93.3963C218.721 93.3963 219.447 93.5455 220.094 93.8438C220.74 94.142 221.269 94.5597 221.682 95.0966C222.095 95.6335 222.351 96.2599 222.45 96.9759H220.69C220.556 96.4538 220.258 95.9915 219.795 95.5888C219.338 95.1811 218.721 94.9773 217.946 94.9773C217.26 94.9773 216.658 95.1562 216.141 95.5142C215.629 95.8672 215.229 96.3668 214.941 97.0131C214.657 97.6545 214.515 98.4077 214.515 99.2727C214.515 100.158 214.655 100.928 214.933 101.585C215.216 102.241 215.614 102.75 216.126 103.113C216.643 103.476 217.25 103.658 217.946 103.658C218.403 103.658 218.818 103.578 219.191 103.419C219.564 103.26 219.88 103.031 220.138 102.733C220.397 102.435 220.581 102.077 220.69 101.659H222.45C222.351 102.335 222.105 102.944 221.712 103.486C221.324 104.023 220.809 104.451 220.168 104.769C219.532 105.082 218.791 105.239 217.946 105.239ZM225.023 105V93.5455H226.783V105H225.023ZM225.918 91.6364C225.575 91.6364 225.279 91.5195 225.03 91.2859C224.787 91.0522 224.665 90.7713 224.665 90.4432C224.665 90.1151 224.787 89.8342 225.03 89.6005C225.279 89.3668 225.575 89.25 225.918 89.25C226.261 89.25 226.554 89.3668 226.798 89.6005C227.046 89.8342 227.171 90.1151 227.171 90.4432C227.171 90.7713 227.046 91.0522 226.798 91.2859C226.554 91.5195 226.261 91.6364 225.918 91.6364ZM231.766 98.1094V105H230.006V93.5455H231.707V95.3352H231.856C232.124 94.7536 232.532 94.2862 233.079 93.9332C233.626 93.5753 234.332 93.3963 235.197 93.3963C235.972 93.3963 236.651 93.5554 237.233 93.8736C237.814 94.1868 238.267 94.6641 238.59 95.3054C238.913 95.9418 239.074 96.7472 239.074 97.7216V105H237.315V97.8409C237.315 96.9411 237.081 96.2401 236.614 95.7379C236.146 95.2308 235.505 94.9773 234.69 94.9773C234.128 94.9773 233.626 95.0991 233.183 95.3427C232.746 95.5863 232.4 95.9418 232.147 96.4091C231.893 96.8764 231.766 97.4432 231.766 98.1094ZM246.914 109.534C246.064 109.534 245.333 109.425 244.722 109.206C244.11 108.992 243.6 108.709 243.193 108.356C242.79 108.008 242.469 107.635 242.231 107.237L243.633 106.253C243.792 106.462 243.993 106.7 244.237 106.969C244.48 107.242 244.814 107.478 245.236 107.677C245.664 107.881 246.223 107.983 246.914 107.983C247.839 107.983 248.602 107.759 249.203 107.312C249.805 106.864 250.106 106.163 250.106 105.209V102.882H249.957C249.827 103.091 249.643 103.349 249.405 103.658C249.171 103.961 248.833 104.232 248.391 104.471C247.953 104.704 247.362 104.821 246.616 104.821C245.691 104.821 244.861 104.602 244.125 104.165C243.394 103.727 242.815 103.091 242.387 102.256C241.965 101.42 241.754 100.406 241.754 99.2131C241.754 98.0398 241.96 97.0181 242.373 96.1481C242.785 95.2731 243.359 94.5969 244.095 94.1197C244.831 93.6374 245.681 93.3963 246.646 93.3963C247.391 93.3963 247.983 93.5206 248.42 93.7692C248.863 94.0128 249.201 94.2912 249.435 94.6044C249.673 94.9126 249.857 95.1662 249.987 95.3651H250.165V93.5455H251.866V105.328C251.866 106.312 251.642 107.113 251.195 107.729C250.752 108.351 250.156 108.806 249.405 109.094C248.659 109.387 247.829 109.534 246.914 109.534ZM246.854 103.24C247.56 103.24 248.157 103.078 248.644 102.755C249.131 102.432 249.502 101.967 249.755 101.361C250.009 100.754 250.136 100.028 250.136 99.1832C250.136 98.358 250.011 97.6296 249.763 96.9982C249.514 96.3668 249.146 95.8722 248.659 95.5142C248.172 95.1562 247.57 94.9773 246.854 94.9773C246.109 94.9773 245.487 95.1662 244.99 95.544C244.498 95.9219 244.127 96.429 243.879 97.0653C243.635 97.7017 243.513 98.4077 243.513 99.1832C243.513 99.9787 243.638 100.682 243.886 101.294C244.14 101.9 244.513 102.377 245.005 102.725C245.502 103.069 246.119 103.24 246.854 103.24ZM261.65 97.6321V99.2727H254.968V97.6321H261.65ZM269.788 105.209C269.161 105.199 268.535 105.08 267.908 104.851C267.282 104.622 266.71 104.237 266.193 103.695C265.676 103.148 265.261 102.41 264.948 101.48C264.635 100.545 264.478 99.3722 264.478 97.9602C264.478 96.608 264.605 95.4098 264.858 94.3658C265.112 93.3168 265.48 92.4343 265.962 91.7184C266.444 90.9975 267.026 90.4506 267.707 90.0778C268.393 89.7049 269.166 89.5185 270.026 89.5185C270.881 89.5185 271.642 89.69 272.308 90.033C272.979 90.3711 273.526 90.8434 273.949 91.4499C274.372 92.0565 274.645 92.755 274.769 93.5455H272.95C272.781 92.8594 272.453 92.2901 271.965 91.8377C271.478 91.3853 270.832 91.1591 270.026 91.1591C268.843 91.1591 267.911 91.6737 267.23 92.7028C266.554 93.7319 266.213 95.1761 266.208 97.0355H266.328C266.606 96.6129 266.937 96.2525 267.319 95.9542C267.707 95.6509 268.135 95.4173 268.602 95.2532C269.069 95.0891 269.564 95.0071 270.086 95.0071C270.961 95.0071 271.761 95.2259 272.487 95.6634C273.213 96.0959 273.795 96.695 274.232 97.4606C274.67 98.2212 274.889 99.0938 274.889 100.078C274.889 101.023 274.677 101.888 274.255 102.673C273.832 103.454 273.238 104.075 272.472 104.538C271.712 104.995 270.817 105.219 269.788 105.209ZM269.788 103.568C270.414 103.568 270.976 103.412 271.473 103.098C271.975 102.785 272.37 102.365 272.659 101.838C272.952 101.311 273.099 100.724 273.099 100.078C273.099 99.4467 272.957 98.8725 272.674 98.3555C272.395 97.8335 272.01 97.4183 271.518 97.1101C271.031 96.8018 270.474 96.6477 269.847 96.6477C269.375 96.6477 268.935 96.7422 268.527 96.9311C268.12 97.1151 267.762 97.3686 267.454 97.6918C267.15 98.0149 266.912 98.3853 266.738 98.8029C266.564 99.2156 266.477 99.6506 266.477 100.108C266.477 100.714 266.618 101.281 266.902 101.808C267.19 102.335 267.583 102.76 268.08 103.083C268.582 103.407 269.151 103.568 269.788 103.568ZM282.803 105.209C281.679 105.209 280.722 104.903 279.932 104.292C279.141 103.675 278.537 102.783 278.119 101.614C277.702 100.441 277.493 99.0241 277.493 97.3636C277.493 95.7131 277.702 94.3036 278.119 93.1353C278.542 91.962 279.149 91.0671 279.939 90.4506C280.735 89.8292 281.689 89.5185 282.803 89.5185C283.916 89.5185 284.868 89.8292 285.659 90.4506C286.454 91.0671 287.061 91.962 287.479 93.1353C287.901 94.3036 288.112 95.7131 288.112 97.3636C288.112 99.0241 287.904 100.441 287.486 101.614C287.068 102.783 286.464 103.675 285.674 104.292C284.883 104.903 283.926 105.209 282.803 105.209ZM282.803 103.568C283.916 103.568 284.781 103.031 285.398 101.957C286.014 100.884 286.323 99.3523 286.323 97.3636C286.323 96.0412 286.181 94.9151 285.898 93.9854C285.619 93.0558 285.216 92.3473 284.689 91.8601C284.167 91.3729 283.539 91.1293 282.803 91.1293C281.699 91.1293 280.836 91.6737 280.215 92.7624C279.594 93.8462 279.283 95.38 279.283 97.3636C279.283 98.6861 279.422 99.8097 279.7 100.734C279.979 101.659 280.379 102.363 280.901 102.845C281.428 103.327 282.062 103.568 282.803 103.568ZM295.928 105.209C294.804 105.209 293.847 104.903 293.057 104.292C292.266 103.675 291.662 102.783 291.244 101.614C290.827 100.441 290.618 99.0241 290.618 97.3636C290.618 95.7131 290.827 94.3036 291.244 93.1353C291.667 91.962 292.274 91.0671 293.064 90.4506C293.86 89.8292 294.814 89.5185 295.928 89.5185C297.041 89.5185 297.993 89.8292 298.784 90.4506C299.579 91.0671 300.186 91.962 300.604 93.1353C301.026 94.3036 301.237 95.7131 301.237 97.3636C301.237 99.0241 301.029 100.441 300.611 101.614C300.193 102.783 299.589 103.675 298.799 104.292C298.008 104.903 297.051 105.209 295.928 105.209ZM295.928 103.568C297.041 103.568 297.906 103.031 298.523 101.957C299.139 100.884 299.448 99.3523 299.448 97.3636C299.448 96.0412 299.306 94.9151 299.023 93.9854C298.744 93.0558 298.341 92.3473 297.814 91.8601C297.292 91.3729 296.664 91.1293 295.928 91.1293C294.824 91.1293 293.961 91.6737 293.34 92.7624C292.719 93.8462 292.408 95.38 292.408 97.3636C292.408 98.6861 292.547 99.8097 292.825 100.734C293.104 101.659 293.504 102.363 294.026 102.845C294.553 103.327 295.187 103.568 295.928 103.568Z" fill="black"/>
 <path d="M7.30824 188L9.81392 172.727H11.3054L8.79972 188H7.30824ZM0.357955 183.764L0.596591 182.273H11.9915L11.7528 183.764H0.357955ZM1.93892 188L4.4446 172.727H5.93608L3.4304 188H1.93892ZM1.25284 178.455L1.49148 176.963H12.8864L12.6477 178.455H1.25284ZM19.9895 188.209C19.0051 188.209 18.1277 188.04 17.3571 187.702C16.5914 187.364 15.9824 186.894 15.53 186.292C15.0826 185.686 14.839 184.982 14.7992 184.182H16.6784C16.7182 184.674 16.8873 185.099 17.1855 185.457C17.4838 185.81 17.8741 186.083 18.3564 186.277C18.8386 186.471 19.373 186.568 19.9597 186.568C20.6159 186.568 21.1976 186.454 21.7047 186.225C22.2118 185.996 22.6096 185.678 22.8979 185.271C23.1863 184.863 23.3304 184.391 23.3304 183.854C23.3304 183.292 23.1912 182.797 22.9128 182.37C22.6344 181.937 22.2267 181.599 21.6898 181.355C21.1529 181.112 20.4966 180.99 19.7211 180.99H18.498V179.349H19.7211C20.3276 179.349 20.8596 179.24 21.3169 179.021C21.7793 178.803 22.1397 178.494 22.3983 178.097C22.6618 177.699 22.7935 177.232 22.7935 176.695C22.7935 176.178 22.6792 175.728 22.4505 175.345C22.2218 174.962 21.8986 174.664 21.481 174.45C21.0684 174.236 20.5811 174.129 20.0194 174.129C19.4924 174.129 18.9952 174.226 18.5279 174.42C18.0655 174.609 17.6877 174.885 17.3944 175.248C17.101 175.606 16.9419 176.038 16.9171 176.545H15.1273C15.1571 175.745 15.3983 175.044 15.8507 174.442C16.3031 173.836 16.8947 173.364 17.6255 173.026C18.3613 172.687 19.1692 172.518 20.0492 172.518C20.9938 172.518 21.8042 172.71 22.4803 173.093C23.1564 173.471 23.676 173.97 24.0389 174.592C24.4018 175.213 24.5833 175.884 24.5833 176.605C24.5833 177.465 24.3571 178.199 23.9047 178.805C23.4572 179.412 22.8482 179.832 22.0776 180.065V180.185C23.0421 180.344 23.7953 180.754 24.3372 181.415C24.8791 182.071 25.15 182.884 25.15 183.854C25.15 184.684 24.9238 185.43 24.4714 186.091C24.024 186.747 23.4125 187.264 22.6369 187.642C21.8613 188.02 20.9789 188.209 19.9895 188.209ZM33.3606 188.209C32.3762 188.209 31.4988 188.04 30.7282 187.702C29.9625 187.364 29.3535 186.894 28.9011 186.292C28.4537 185.686 28.21 184.982 28.1703 184.182H30.0495C30.0893 184.674 30.2583 185.099 30.5566 185.457C30.8549 185.81 31.2452 186.083 31.7275 186.277C32.2097 186.471 32.7441 186.568 33.3308 186.568C33.987 186.568 34.5687 186.454 35.0758 186.225C35.5829 185.996 35.9806 185.678 36.269 185.271C36.5574 184.863 36.7015 184.391 36.7015 183.854C36.7015 183.292 36.5623 182.797 36.2839 182.37C36.0055 181.937 35.5978 181.599 35.0609 181.355C34.524 181.112 33.8677 180.99 33.0922 180.99H31.8691V179.349H33.0922C33.6987 179.349 34.2306 179.24 34.688 179.021C35.1504 178.803 35.5108 178.494 35.7694 178.097C36.0328 177.699 36.1646 177.232 36.1646 176.695C36.1646 176.178 36.0502 175.728 35.8216 175.345C35.5929 174.962 35.2697 174.664 34.8521 174.45C34.4395 174.236 33.9522 174.129 33.3904 174.129C32.8635 174.129 32.3663 174.226 31.899 174.42C31.4366 174.609 31.0588 174.885 30.7654 175.248C30.4721 175.606 30.313 176.038 30.2882 176.545H28.4984C28.5282 175.745 28.7694 175.044 29.2218 174.442C29.6742 173.836 30.2658 173.364 30.9966 173.026C31.7324 172.687 32.5403 172.518 33.4203 172.518C34.3649 172.518 35.1752 172.71 35.8514 173.093C36.5275 173.471 37.0471 173.97 37.41 174.592C37.7729 175.213 37.9544 175.884 37.9544 176.605C37.9544 177.465 37.7282 178.199 37.2757 178.805C36.8283 179.412 36.2193 179.832 35.4487 180.065V180.185C36.4132 180.344 37.1664 180.754 37.7083 181.415C38.2502 182.071 38.5211 182.884 38.5211 183.854C38.5211 184.684 38.2949 185.43 37.8425 186.091C37.3951 186.747 36.7836 187.264 36.008 187.642C35.2324 188.02 34.35 188.209 33.3606 188.209ZM46.7317 188.209C45.7473 188.209 44.8699 188.04 44.0993 187.702C43.3336 187.364 42.7246 186.894 42.2722 186.292C41.8248 185.686 41.5811 184.982 41.5414 184.182H43.4206C43.4604 184.674 43.6294 185.099 43.9277 185.457C44.226 185.81 44.6163 186.083 45.0985 186.277C45.5808 186.471 46.1152 186.568 46.7019 186.568C47.3581 186.568 47.9398 186.454 48.4469 186.225C48.954 185.996 49.3517 185.678 49.6401 185.271C49.9284 184.863 50.0726 184.391 50.0726 183.854C50.0726 183.292 49.9334 182.797 49.655 182.37C49.3766 181.937 48.9689 181.599 48.432 181.355C47.8951 181.112 47.2388 180.99 46.4632 180.99H45.2402V179.349H46.4632C47.0698 179.349 47.6017 179.24 48.0591 179.021C48.5215 178.803 48.8819 178.494 49.1404 178.097C49.4039 177.699 49.5357 177.232 49.5357 176.695C49.5357 176.178 49.4213 175.728 49.1926 175.345C48.964 174.962 48.6408 174.664 48.2232 174.45C47.8105 174.236 47.3233 174.129 46.7615 174.129C46.2346 174.129 45.7374 174.226 45.2701 174.42C44.8077 174.609 44.4299 174.885 44.1365 175.248C43.8432 175.606 43.6841 176.038 43.6593 176.545H41.8695C41.8993 175.745 42.1404 175.044 42.5929 174.442C43.0453 173.836 43.6369 173.364 44.3677 173.026C45.1035 172.687 45.9114 172.518 46.7914 172.518C47.736 172.518 48.5463 172.71 49.2225 173.093C49.8986 173.471 50.4181 173.97 50.7811 174.592C51.144 175.213 51.3255 175.884 51.3255 176.605C51.3255 177.465 51.0993 178.199 50.6468 178.805C50.1994 179.412 49.5904 179.832 48.8198 180.065V180.185C49.7843 180.344 50.5375 180.754 51.0794 181.415C51.6213 182.071 51.8922 182.884 51.8922 183.854C51.8922 184.684 51.666 185.43 51.2136 186.091C50.7662 186.747 50.1547 187.264 49.3791 187.642C48.6035 188.02 47.7211 188.209 46.7317 188.209ZM60.1028 188.209C59.1184 188.209 58.2409 188.04 57.4703 187.702C56.7047 187.364 56.0957 186.894 55.6433 186.292C55.1958 185.686 54.9522 184.982 54.9125 184.182H56.7917C56.8315 184.674 57.0005 185.099 57.2988 185.457C57.5971 185.81 57.9874 186.083 58.4696 186.277C58.9519 186.471 59.4863 186.568 60.073 186.568C60.7292 186.568 61.3109 186.454 61.818 186.225C62.3251 185.996 62.7228 185.678 63.0112 185.271C63.2995 184.863 63.4437 184.391 63.4437 183.854C63.4437 183.292 63.3045 182.797 63.0261 182.37C62.7477 181.937 62.34 181.599 61.8031 181.355C61.2662 181.112 60.6099 180.99 59.8343 180.99H58.6113V179.349H59.8343C60.4409 179.349 60.9728 179.24 61.4302 179.021C61.8926 178.803 62.253 178.494 62.5115 178.097C62.775 177.699 62.9068 177.232 62.9068 176.695C62.9068 176.178 62.7924 175.728 62.5637 175.345C62.335 174.962 62.0119 174.664 61.5943 174.45C61.1816 174.236 60.6944 174.129 60.1326 174.129C59.6056 174.129 59.1085 174.226 58.6412 174.42C58.1788 174.609 57.801 174.885 57.5076 175.248C57.2143 175.606 57.0552 176.038 57.0304 176.545H55.2406C55.2704 175.745 55.5115 175.044 55.964 174.442C56.4164 173.836 57.008 173.364 57.7388 173.026C58.4746 172.687 59.2825 172.518 60.1625 172.518C61.1071 172.518 61.9174 172.71 62.5936 173.093C63.2697 173.471 63.7892 173.97 64.1522 174.592C64.5151 175.213 64.6966 175.884 64.6966 176.605C64.6966 177.465 64.4703 178.199 64.0179 178.805C63.5705 179.412 62.9615 179.832 62.1909 180.065V180.185C63.1554 180.344 63.9086 180.754 64.4505 181.415C64.9924 182.071 65.2633 182.884 65.2633 183.854C65.2633 184.684 65.0371 185.43 64.5847 186.091C64.1373 186.747 63.5257 187.264 62.7502 187.642C61.9746 188.02 61.0922 188.209 60.1028 188.209ZM73.4739 188.209C72.4895 188.209 71.612 188.04 70.8414 187.702C70.0758 187.364 69.4668 186.894 69.0144 186.292C68.5669 185.686 68.3233 184.982 68.2836 184.182H70.1628C70.2026 184.674 70.3716 185.099 70.6699 185.457C70.9682 185.81 71.3585 186.083 71.8407 186.277C72.323 186.471 72.8574 186.568 73.4441 186.568C74.1003 186.568 74.682 186.454 75.1891 186.225C75.6962 185.996 76.0939 185.678 76.3823 185.271C76.6706 184.863 76.8148 184.391 76.8148 183.854C76.8148 183.292 76.6756 182.797 76.3972 182.37C76.1188 181.937 75.7111 181.599 75.1742 181.355C74.6373 181.112 73.981 180.99 73.2054 180.99H71.9824V179.349H73.2054C73.812 179.349 74.3439 179.24 74.8013 179.021C75.2637 178.803 75.6241 178.494 75.8826 178.097C76.1461 177.699 76.2779 177.232 76.2779 176.695C76.2779 176.178 76.1635 175.728 75.9348 175.345C75.7061 174.962 75.383 174.664 74.9654 174.45C74.5527 174.236 74.0655 174.129 73.5037 174.129C72.9767 174.129 72.4796 174.226 72.0123 174.42C71.5499 174.609 71.1721 174.885 70.8787 175.248C70.5854 175.606 70.4263 176.038 70.4015 176.545H68.6117C68.6415 175.745 68.8826 175.044 69.335 174.442C69.7875 173.836 70.3791 173.364 71.1099 173.026C71.8457 172.687 72.6536 172.518 73.5336 172.518C74.4782 172.518 75.2885 172.71 75.9647 173.093C76.6408 173.471 77.1603 173.97 77.5233 174.592C77.8862 175.213 78.0676 175.884 78.0676 176.605C78.0676 177.465 77.8414 178.199 77.389 178.805C76.9416 179.412 76.3326 179.832 75.562 180.065V180.185C76.5265 180.344 77.2797 180.754 77.8216 181.415C78.3635 182.071 78.6344 182.884 78.6344 183.854C78.6344 184.684 78.4082 185.43 77.9558 186.091C77.5083 186.747 76.8968 187.264 76.1213 187.642C75.3457 188.02 74.4632 188.209 73.4739 188.209ZM86.845 188.209C85.8606 188.209 84.9831 188.04 84.2125 187.702C83.4469 187.364 82.8379 186.894 82.3855 186.292C81.938 185.686 81.6944 184.982 81.6547 184.182H83.5339C83.5737 184.674 83.7427 185.099 84.041 185.457C84.3393 185.81 84.7296 186.083 85.2118 186.277C85.6941 186.471 86.2285 186.568 86.8152 186.568C87.4714 186.568 88.0531 186.454 88.5602 186.225C89.0673 185.996 89.465 185.678 89.7534 185.271C90.0417 184.863 90.1859 184.391 90.1859 183.854C90.1859 183.292 90.0467 182.797 89.7683 182.37C89.4899 181.937 89.0822 181.599 88.5453 181.355C88.0083 181.112 87.3521 180.99 86.5765 180.99H85.3535V179.349H86.5765C87.1831 179.349 87.715 179.24 88.1724 179.021C88.6348 178.803 88.9952 178.494 89.2537 178.097C89.5172 177.699 89.649 177.232 89.649 176.695C89.649 176.178 89.5346 175.728 89.3059 175.345C89.0772 174.962 88.7541 174.664 88.3365 174.45C87.9238 174.236 87.4366 174.129 86.8748 174.129C86.3478 174.129 85.8507 174.226 85.3833 174.42C84.921 174.609 84.5431 174.885 84.2498 175.248C83.9565 175.606 83.7974 176.038 83.7725 176.545H81.9828C82.0126 175.745 82.2537 175.044 82.7061 174.442C83.1586 173.836 83.7502 173.364 84.481 173.026C85.2168 172.687 86.0247 172.518 86.9047 172.518C87.8493 172.518 88.6596 172.71 89.3358 173.093C90.0119 173.471 90.5314 173.97 90.8944 174.592C91.2573 175.213 91.4387 175.884 91.4387 176.605C91.4387 177.465 91.2125 178.199 90.7601 178.805C90.3127 179.412 89.7037 179.832 88.9331 180.065V180.185C89.8975 180.344 90.6507 180.754 91.1926 181.415C91.7346 182.071 92.0055 182.884 92.0055 183.854C92.0055 184.684 91.7793 185.43 91.3269 186.091C90.8794 186.747 90.2679 187.264 89.4924 187.642C88.7168 188.02 87.8343 188.209 86.845 188.209ZM148.898 180.632V182.273H142.216V180.632H148.898ZM158.557 180.632V182.273H151.875V180.632H158.557ZM166.277 192.534C165.427 192.534 164.696 192.425 164.085 192.206C163.473 191.992 162.964 191.709 162.556 191.356C162.153 191.008 161.833 190.635 161.594 190.237L162.996 189.253C163.155 189.462 163.357 189.7 163.6 189.969C163.844 190.242 164.177 190.478 164.599 190.677C165.027 190.881 165.586 190.983 166.277 190.983C167.202 190.983 167.965 190.759 168.567 190.312C169.168 189.864 169.469 189.163 169.469 188.209V185.882H169.32C169.191 186.091 169.007 186.349 168.768 186.658C168.534 186.961 168.196 187.232 167.754 187.471C167.316 187.704 166.725 187.821 165.979 187.821C165.054 187.821 164.224 187.602 163.488 187.165C162.757 186.727 162.178 186.091 161.751 185.256C161.328 184.42 161.117 183.406 161.117 182.213C161.117 181.04 161.323 180.018 161.736 179.148C162.148 178.273 162.723 177.597 163.458 177.12C164.194 176.637 165.044 176.396 166.009 176.396C166.755 176.396 167.346 176.521 167.784 176.769C168.226 177.013 168.564 177.291 168.798 177.604C169.037 177.913 169.221 178.166 169.35 178.365H169.529V176.545H171.229V188.328C171.229 189.312 171.005 190.113 170.558 190.729C170.115 191.351 169.519 191.806 168.768 192.094C168.022 192.387 167.192 192.534 166.277 192.534ZM166.218 186.24C166.924 186.24 167.52 186.078 168.007 185.755C168.495 185.432 168.865 184.967 169.119 184.361C169.372 183.754 169.499 183.028 169.499 182.183C169.499 181.358 169.375 180.63 169.126 179.998C168.877 179.367 168.51 178.872 168.022 178.514C167.535 178.156 166.934 177.977 166.218 177.977C165.472 177.977 164.85 178.166 164.353 178.544C163.861 178.922 163.491 179.429 163.242 180.065C162.999 180.702 162.877 181.408 162.877 182.183C162.877 182.979 163.001 183.682 163.25 184.294C163.503 184.9 163.876 185.377 164.368 185.725C164.865 186.069 165.482 186.24 166.218 186.24ZM179.104 188.239C178.03 188.239 177.105 187.985 176.33 187.478C175.554 186.971 174.958 186.272 174.54 185.382C174.123 184.493 173.914 183.476 173.914 182.332C173.914 181.169 174.127 180.142 174.555 179.252C174.988 178.358 175.589 177.659 176.36 177.157C177.135 176.65 178.04 176.396 179.074 176.396C179.88 176.396 180.605 176.545 181.252 176.844C181.898 177.142 182.428 177.56 182.84 178.097C183.253 178.634 183.509 179.26 183.608 179.976H181.848C181.714 179.454 181.416 178.991 180.953 178.589C180.496 178.181 179.88 177.977 179.104 177.977C178.418 177.977 177.816 178.156 177.299 178.514C176.787 178.867 176.387 179.367 176.099 180.013C175.815 180.654 175.674 181.408 175.674 182.273C175.674 183.158 175.813 183.928 176.091 184.585C176.375 185.241 176.772 185.75 177.284 186.113C177.801 186.476 178.408 186.658 179.104 186.658C179.561 186.658 179.977 186.578 180.349 186.419C180.722 186.26 181.038 186.031 181.297 185.733C181.555 185.435 181.739 185.077 181.848 184.659H183.608C183.509 185.335 183.263 185.944 182.87 186.486C182.482 187.023 181.968 187.451 181.326 187.769C180.69 188.082 179.949 188.239 179.104 188.239ZM190.506 188.239C189.552 188.239 188.709 187.998 187.978 187.515C187.248 187.028 186.676 186.342 186.263 185.457C185.85 184.567 185.644 183.516 185.644 182.303C185.644 181.099 185.85 180.055 186.263 179.17C186.676 178.286 187.25 177.602 187.986 177.12C188.722 176.637 189.572 176.396 190.536 176.396C191.282 176.396 191.871 176.521 192.304 176.769C192.741 177.013 193.074 177.291 193.303 177.604C193.537 177.913 193.718 178.166 193.847 178.365H193.996V172.727H195.756V188H194.056V186.24H193.847C193.718 186.449 193.534 186.712 193.295 187.031C193.057 187.344 192.716 187.625 192.274 187.873C191.831 188.117 191.242 188.239 190.506 188.239ZM190.745 186.658C191.451 186.658 192.048 186.474 192.535 186.106C193.022 185.733 193.392 185.218 193.646 184.562C193.9 183.901 194.026 183.138 194.026 182.273C194.026 181.418 193.902 180.669 193.653 180.028C193.405 179.382 193.037 178.88 192.55 178.522C192.063 178.159 191.461 177.977 190.745 177.977C189.999 177.977 189.378 178.169 188.881 178.551C188.388 178.929 188.018 179.444 187.77 180.095C187.526 180.741 187.404 181.467 187.404 182.273C187.404 183.088 187.528 183.829 187.777 184.495C188.031 185.156 188.403 185.683 188.896 186.076C189.393 186.464 190.009 186.658 190.745 186.658ZM207.338 179.111L205.757 179.558C205.657 179.295 205.511 179.039 205.317 178.79C205.128 178.537 204.869 178.328 204.541 178.164C204.213 178 203.793 177.918 203.281 177.918C202.58 177.918 201.996 178.079 201.528 178.402C201.066 178.721 200.835 179.126 200.835 179.618C200.835 180.055 200.994 180.401 201.312 180.654C201.63 180.908 202.127 181.119 202.804 181.288L204.504 181.706C205.528 181.955 206.291 182.335 206.793 182.847C207.295 183.354 207.547 184.008 207.547 184.808C207.547 185.464 207.358 186.051 206.98 186.568C206.607 187.085 206.085 187.493 205.414 187.791C204.743 188.089 203.962 188.239 203.072 188.239C201.904 188.239 200.937 187.985 200.171 187.478C199.406 186.971 198.921 186.23 198.717 185.256L200.387 184.838C200.547 185.455 200.847 185.917 201.29 186.225C201.737 186.533 202.321 186.688 203.042 186.688C203.863 186.688 204.514 186.513 204.996 186.165C205.483 185.812 205.727 185.39 205.727 184.898C205.727 184.5 205.588 184.167 205.309 183.898C205.031 183.625 204.603 183.421 204.027 183.287L202.118 182.839C201.069 182.591 200.298 182.206 199.806 181.684C199.319 181.157 199.075 180.498 199.075 179.707C199.075 179.061 199.256 178.489 199.619 177.992C199.987 177.495 200.487 177.105 201.118 176.821C201.755 176.538 202.475 176.396 203.281 176.396C204.414 176.396 205.304 176.645 205.951 177.142C206.602 177.639 207.064 178.295 207.338 179.111ZM216.758 180.632V182.273H210.076V180.632H216.758ZM224.836 176.545V178.037H218.9V176.545H224.836ZM220.631 173.801H222.39V184.719C222.39 185.216 222.463 185.589 222.607 185.837C222.756 186.081 222.945 186.245 223.173 186.33C223.407 186.409 223.653 186.449 223.912 186.449C224.106 186.449 224.265 186.439 224.389 186.419C224.513 186.394 224.613 186.374 224.687 186.359L225.045 187.94C224.926 187.985 224.759 188.03 224.546 188.075C224.332 188.124 224.061 188.149 223.733 188.149C223.236 188.149 222.748 188.042 222.271 187.828C221.799 187.615 221.406 187.289 221.093 186.852C220.785 186.414 220.631 185.862 220.631 185.196V173.801ZM232.163 188.239C231.06 188.239 230.108 187.995 229.307 187.508C228.512 187.016 227.898 186.33 227.465 185.45C227.038 184.565 226.824 183.536 226.824 182.362C226.824 181.189 227.038 180.155 227.465 179.26C227.898 178.36 228.499 177.659 229.27 177.157C230.045 176.65 230.95 176.396 231.984 176.396C232.581 176.396 233.17 176.496 233.752 176.695C234.333 176.893 234.863 177.217 235.34 177.664C235.817 178.107 236.198 178.693 236.481 179.424C236.765 180.155 236.906 181.055 236.906 182.124V182.869H228.077V181.348H235.116C235.116 180.702 234.987 180.125 234.729 179.618C234.475 179.111 234.112 178.711 233.64 178.417C233.173 178.124 232.621 177.977 231.984 177.977C231.283 177.977 230.677 178.151 230.165 178.499C229.658 178.842 229.267 179.29 228.994 179.842C228.721 180.393 228.584 180.985 228.584 181.616V182.631C228.584 183.496 228.733 184.229 229.031 184.831C229.335 185.427 229.755 185.882 230.292 186.195C230.828 186.504 231.452 186.658 232.163 186.658C232.626 186.658 233.043 186.593 233.416 186.464C233.794 186.33 234.12 186.131 234.393 185.867C234.667 185.599 234.878 185.266 235.027 184.868L236.727 185.345C236.548 185.922 236.248 186.429 235.825 186.866C235.402 187.299 234.88 187.637 234.259 187.881C233.637 188.119 232.939 188.239 232.163 188.239ZM240.588 176.545L243.333 181.229L246.077 176.545H248.105L244.407 182.273L248.105 188H246.077L243.333 183.555L240.588 188H238.56L242.199 182.273L238.56 176.545H240.588ZM255.598 176.545V178.037H249.662V176.545H255.598ZM251.392 173.801H253.152V184.719C253.152 185.216 253.224 185.589 253.368 185.837C253.518 186.081 253.706 186.245 253.935 186.33C254.169 186.409 254.415 186.449 254.673 186.449C254.867 186.449 255.026 186.439 255.151 186.419C255.275 186.394 255.374 186.374 255.449 186.359L255.807 187.94C255.688 187.985 255.521 188.03 255.307 188.075C255.094 188.124 254.823 188.149 254.494 188.149C253.997 188.149 253.51 188.042 253.033 187.828C252.561 187.615 252.168 187.289 251.855 186.852C251.546 186.414 251.392 185.862 251.392 185.196V173.801ZM264.398 180.632V182.273H257.716V180.632H264.398ZM267.495 192.295V176.545H269.195V178.365H269.404C269.533 178.166 269.712 177.913 269.941 177.604C270.174 177.291 270.507 177.013 270.94 176.769C271.377 176.521 271.969 176.396 272.715 176.396C273.679 176.396 274.529 176.637 275.265 177.12C276.001 177.602 276.575 178.286 276.988 179.17C277.4 180.055 277.607 181.099 277.607 182.303C277.607 183.516 277.4 184.567 276.988 185.457C276.575 186.342 276.003 187.028 275.273 187.515C274.542 187.998 273.699 188.239 272.745 188.239C272.009 188.239 271.42 188.117 270.977 187.873C270.535 187.625 270.194 187.344 269.956 187.031C269.717 186.712 269.533 186.449 269.404 186.24H269.255V192.295H267.495ZM269.225 182.273C269.225 183.138 269.351 183.901 269.605 184.562C269.859 185.218 270.229 185.733 270.716 186.106C271.203 186.474 271.8 186.658 272.506 186.658C273.242 186.658 273.856 186.464 274.348 186.076C274.845 185.683 275.218 185.156 275.467 184.495C275.72 183.829 275.847 183.088 275.847 182.273C275.847 181.467 275.723 180.741 275.474 180.095C275.23 179.444 274.86 178.929 274.363 178.551C273.871 178.169 273.252 177.977 272.506 177.977C271.79 177.977 271.188 178.159 270.701 178.522C270.214 178.88 269.846 179.382 269.598 180.028C269.349 180.669 269.225 181.418 269.225 182.273ZM280.291 188V176.545H281.992V178.276H282.111C282.32 177.709 282.698 177.249 283.245 176.896C283.791 176.543 284.408 176.366 285.094 176.366C285.223 176.366 285.385 176.369 285.579 176.374C285.773 176.379 285.919 176.386 286.019 176.396V178.186C285.959 178.171 285.822 178.149 285.609 178.119C285.4 178.084 285.179 178.067 284.945 178.067C284.388 178.067 283.891 178.184 283.453 178.417C283.021 178.646 282.678 178.964 282.424 179.372C282.176 179.775 282.051 180.234 282.051 180.751V188H280.291ZM288.105 188V176.545H289.865V188H288.105ZM289 174.636C288.657 174.636 288.361 174.52 288.112 174.286C287.869 174.052 287.747 173.771 287.747 173.443C287.747 173.115 287.869 172.834 288.112 172.6C288.361 172.367 288.657 172.25 289 172.25C289.343 172.25 289.636 172.367 289.88 172.6C290.128 172.834 290.253 173.115 290.253 173.443C290.253 173.771 290.128 174.052 289.88 174.286C289.636 174.52 289.343 174.636 289 174.636ZM293.088 188V176.545H294.789V178.335H294.938C295.176 177.724 295.562 177.249 296.094 176.911C296.626 176.568 297.264 176.396 298.01 176.396C298.766 176.396 299.395 176.568 299.897 176.911C300.404 177.249 300.799 177.724 301.083 178.335H301.202C301.495 177.744 301.935 177.274 302.522 176.926C303.109 176.573 303.812 176.396 304.632 176.396C305.657 176.396 306.494 176.717 307.146 177.358C307.797 177.995 308.122 178.987 308.122 180.334V188H306.362V180.334C306.362 179.489 306.131 178.885 305.669 178.522C305.207 178.159 304.662 177.977 304.036 177.977C303.23 177.977 302.606 178.221 302.164 178.708C301.722 179.19 301.5 179.802 301.5 180.543V188H299.71V180.155C299.71 179.504 299.499 178.979 299.077 178.581C298.654 178.179 298.11 177.977 297.443 177.977C296.986 177.977 296.559 178.099 296.161 178.343C295.768 178.586 295.45 178.924 295.206 179.357C294.968 179.784 294.848 180.279 294.848 180.841V188H293.088ZM314.711 188.268C313.985 188.268 313.326 188.132 312.735 187.858C312.143 187.58 311.673 187.18 311.325 186.658C310.977 186.131 310.803 185.494 310.803 184.749C310.803 184.092 310.933 183.56 311.191 183.153C311.45 182.74 311.795 182.417 312.228 182.183C312.66 181.95 313.138 181.776 313.66 181.661C314.187 181.542 314.716 181.447 315.248 181.378C315.944 181.288 316.508 181.221 316.941 181.176C317.378 181.127 317.696 181.045 317.895 180.93C318.099 180.816 318.201 180.617 318.201 180.334V180.274C318.201 179.538 318 178.967 317.597 178.559C317.199 178.151 316.595 177.947 315.785 177.947C314.945 177.947 314.286 178.131 313.809 178.499C313.331 178.867 312.996 179.26 312.802 179.678L311.131 179.081C311.43 178.385 311.828 177.843 312.325 177.455C312.827 177.062 313.374 176.789 313.965 176.635C314.562 176.476 315.149 176.396 315.725 176.396C316.093 176.396 316.516 176.441 316.993 176.531C317.475 176.615 317.94 176.792 318.388 177.06C318.84 177.328 319.215 177.734 319.514 178.276C319.812 178.817 319.961 179.543 319.961 180.453V188H318.201V186.449H318.112C317.992 186.697 317.793 186.963 317.515 187.247C317.237 187.53 316.866 187.771 316.404 187.97C315.941 188.169 315.377 188.268 314.711 188.268ZM314.979 186.688C315.676 186.688 316.262 186.551 316.739 186.277C317.222 186.004 317.585 185.651 317.828 185.218C318.077 184.786 318.201 184.331 318.201 183.854V182.243C318.127 182.332 317.962 182.414 317.709 182.489C317.46 182.559 317.172 182.621 316.844 182.675C316.521 182.725 316.205 182.77 315.897 182.81C315.593 182.844 315.347 182.874 315.158 182.899C314.701 182.959 314.274 183.056 313.876 183.19C313.483 183.319 313.165 183.516 312.921 183.779C312.683 184.038 312.563 184.391 312.563 184.838C312.563 185.45 312.79 185.912 313.242 186.225C313.699 186.533 314.278 186.688 314.979 186.688ZM323.173 188V176.545H324.874V178.276H324.993C325.202 177.709 325.58 177.249 326.126 176.896C326.673 176.543 327.29 176.366 327.976 176.366C328.105 176.366 328.267 176.369 328.461 176.374C328.654 176.379 328.801 176.386 328.901 176.396V178.186C328.841 178.171 328.704 178.149 328.49 178.119C328.282 178.084 328.06 178.067 327.827 178.067C327.27 178.067 326.773 178.184 326.335 178.417C325.903 178.646 325.56 178.964 325.306 179.372C325.058 179.775 324.933 180.234 324.933 180.751V188H323.173ZM332.469 192.295C332.171 192.295 331.905 192.271 331.671 192.221C331.437 192.176 331.276 192.131 331.186 192.087L331.634 190.536C332.061 190.645 332.439 190.685 332.767 190.655C333.095 190.625 333.386 190.478 333.64 190.215C333.898 189.956 334.134 189.536 334.348 188.955L334.676 188.06L330.441 176.545H332.35L335.512 185.673H335.631L338.793 176.545H340.702L335.84 189.67C335.621 190.262 335.35 190.752 335.027 191.14C334.704 191.532 334.328 191.823 333.901 192.012C333.478 192.201 333.001 192.295 332.469 192.295Z" fill="black"/>

From f1583b732a333f8c41dd633b3a2142929ecc08e3 Mon Sep 17 00:00:00 2001
From: Melanie Boeckmann <melanie.bockmann@gmail.com>
Date: Tue, 10 Dec 2024 14:31:02 -0800
Subject: [PATCH 05/11] refactor: update container, heading + text guidance
 based on new prop values

---
 .eleventy.js                             |  9 +++++++++
 src/_includes/layouts/demo.njk           |  6 +++---
 src/_includes/partials/token_table.njk   |  3 ++-
 src/en/components/container/code.md      |  2 +-
 src/en/components/container/design.md    |  2 +-
 src/en/components/heading/code.md        |  4 ++--
 src/en/components/heading/design.md      |  4 ++--
 src/en/components/text/code.md           |  4 ++--
 src/en/styles/typography/typography.md   | 10 ++++------
 src/fr/composants/boite/code.md          |  2 +-
 src/fr/composants/boite/design.md        |  2 +-
 src/fr/composants/texte/code.md          |  4 ++--
 src/fr/composants/titre/code.md          |  4 ++--
 src/fr/composants/titre/design.md        |  4 ++--
 src/fr/recherche.md                      |  2 +-
 src/fr/styles/typographie/typographie.md | 10 ++++------
 src/styles/components/_table.scss        |  7 -------
 src/styles/style.css                     |  5 -----
 src/styles/style.css.map                 |  2 +-
 19 files changed, 40 insertions(+), 46 deletions(-)

diff --git a/.eleventy.js b/.eleventy.js
index 72105ca21..75bd31d70 100644
--- a/.eleventy.js
+++ b/.eleventy.js
@@ -301,6 +301,15 @@ module.exports = function (eleventyConfig) {
     return displayTokens(token, subCategory, locale);
   });
 
+  /*
+   * Convert token name from camelCase to kebab-case
+   */
+  eleventyConfig.addFilter("camelToKebab", function(str) {
+    return str.replace(/[a-z][A-Z]/g, function(match) {
+      return match[0] + '-' + match[1].toLowerCase();
+    }).toLowerCase();
+  });
+
   // Misc
 
   eleventyConfig.setLibrary('md', markdownLibrary);
diff --git a/src/_includes/layouts/demo.njk b/src/_includes/layouts/demo.njk
index f4ff0b318..11179aa5a 100644
--- a/src/_includes/layouts/demo.njk
+++ b/src/_includes/layouts/demo.njk
@@ -222,7 +222,7 @@ layout: "layouts/base.njk"
   {# ------------- Icons ------------- #}
 
   <h3 class="container-full mt-600 mb-300 bb-sm">{{ demo[locale].icons.heading }}</h3>
-  <gcds-icon name="tree" size="caption" margin-right="200"></gcds-icon>
+  <gcds-icon name="tree" size="text-small" margin-right="200"></gcds-icon>
   <gcds-icon name="tree" size="text" margin-right="200"></gcds-icon>
   <gcds-icon name="tree" size="h6" margin-right="200"></gcds-icon>
   <gcds-icon name="tree" size="h5" margin-right="200"></gcds-icon>
@@ -232,7 +232,7 @@ layout: "layouts/base.njk"
   <gcds-icon name="tree" size="h1" margin-right="200"></gcds-icon>
 
   <h4 class="mt-600 mb-300">{{ demo[locale].icons.content.fixed }}</h4>
-  <gcds-icon name="tree" size="caption" fixed-width></gcds-icon>
+  <gcds-icon name="tree" size="text-small" fixed-width></gcds-icon>
   <gcds-icon name="tree" size="text" fixed-width></gcds-icon>
   <gcds-icon name="tree" size="h6" fixed-width></gcds-icon>
   <gcds-icon name="tree" size="h5" fixed-width></gcds-icon>
@@ -242,7 +242,7 @@ layout: "layouts/base.njk"
   <gcds-icon name="tree" size="h1" fixed-width></gcds-icon>
 
   <h4 class="mt-600 mb-300">{{ demo[locale].icons.content.variable }}</h4>
-  <gcds-icon name="tree" size="caption"></gcds-icon>
+  <gcds-icon name="tree" size="text-small"></gcds-icon>
   <gcds-icon name="tree" size="text"></gcds-icon>
   <gcds-icon name="tree" size="h6"></gcds-icon>
   <gcds-icon name="tree" size="h5"></gcds-icon>
diff --git a/src/_includes/partials/token_table.njk b/src/_includes/partials/token_table.njk
index 7b80f8fc5..30e81506f 100644
--- a/src/_includes/partials/token_table.njk
+++ b/src/_includes/partials/token_table.njk
@@ -37,7 +37,7 @@
                     {%- when 'spacing-preview' -%}
                         <div class="spacing-preview" style="width: {{item[1].value}}; height: {{item[1].value}};"></div>
                     {%- when 'token-name' %}
-                        <span lang="en">--gcds-{{ concatToken | replace: ".", "-" | fixTokenName }}-{{ item[0] }}</span>
+                        <span lang="en">--gcds-{{ concatToken | replace: ".", "-" | fixTokenName | camelToKebab }}-{{ item[0] | camelToKebab }}</span>
                     {%- when 'value' %}
                         {{- item[1].value }}
                     {%- when 'contrast' %}
@@ -45,6 +45,7 @@
                     {%- when 'rgb' %}
                         {{- item[1].value | hexTo: 'rgb' }}
                     {%- when 'px' %}
+                        PX
                         {{- item[1].value | replace: "rem", "" | times: 16 }}px
                     {%- when 'font-value' %}
                         {%- case type %}
diff --git a/src/en/components/container/code.md b/src/en/components/container/code.md
index 041c41feb..888b75def 100644
--- a/src/en/components/container/code.md
+++ b/src/en/components/container/code.md
@@ -14,7 +14,7 @@ Use containers to add a wrapper element with a defined maximum width, providing
 
 ### Limit width of content
 
-- Keep text line length below 75 characters for a comfortable, accessible reading length.
+- Keep text line length below 65 characters for a comfortable, accessible reading length.
 - Limit column width to stop large screens from displaying lines of text that are overly long and difficult to read.
 - Avoid exceeding the maximum width of 71.25rem (1140px) wide.
 
diff --git a/src/en/components/container/design.md b/src/en/components/container/design.md
index 0656a3789..353f0e62e 100644
--- a/src/en/components/container/design.md
+++ b/src/en/components/container/design.md
@@ -19,7 +19,7 @@ date: 'git Last Modified'
 
 ### Limit width of content
 
-- Keep text line length below 75 characters for a comfortable, accessible reading length.
+- Keep text line length below 65 characters for a comfortable, accessible reading length.
 - Limit container width to stop large screens from displaying lines of text that are overly long and difficult to read.
 - Avoid exceeding the maximum width of 71.25rem (1140px) wide.
 
diff --git a/src/en/components/heading/code.md b/src/en/components/heading/code.md
index 3246be4c1..77da97f52 100644
--- a/src/en/components/heading/code.md
+++ b/src/en/components/heading/code.md
@@ -38,8 +38,8 @@ Heading levels follow a sequential, hierarchical order: higher levels have large
 
 - Maintain default spacing for a comfortable and accessible reading experience. These defaults create visual breaks and separation between different sections.
 - Keep spacing values to the following to maintain a visual balance across headings on a page:
-  - Default `margin-bottom`: `400` for all
-  - Default `margin-top`: `0` for H1 and `500` for H2–3
+  - Default `margin-bottom`: `300` for all
+  - Default `margin-top`: `0` for H1 and `600` for H2–3
 
 {% include "partials/getcode.njk" %}
 
diff --git a/src/en/components/heading/design.md b/src/en/components/heading/design.md
index ceebfe4e0..4d576fb23 100644
--- a/src/en/components/heading/design.md
+++ b/src/en/components/heading/design.md
@@ -52,5 +52,5 @@ Heading levels follow a sequential, hierarchical order: higher levels have large
 
 - Maintain the default spacing for a comfortable and accessible reading experience. These defaults create visual breaks and separation between different sections.
 - Keep spacing values to the following to maintain a visual balance across headings on a page:
-  - Bottom margin: 400 for all.
-  - Top margin: 0 for H1 and 500 for H2-3.
+  - Bottom margin: 300 for all.
+  - Top margin: 0 for H1 and 600 for H2-3.
diff --git a/src/en/components/text/code.md b/src/en/components/text/code.md
index bc6fcbcde..43f609303 100644
--- a/src/en/components/text/code.md
+++ b/src/en/components/text/code.md
@@ -19,10 +19,10 @@ Text displays non-heading content with matching GC Design System styles to provi
 
 ### Set the text size
 
-- Set the text `size` attribute to `body` or `caption`.
+- Set the text `size` attribute to `body` or `small`.
 - Use the default `body` `size` value to render a `p` element with the recommended font size and colour contrast.
 - Choose a caption to present brief context about a section or piece of content.
-- Opt to display smaller text by setting the `size` attribute to `caption` to render a `small` element inside a `p` element.
+- Opt to display smaller text by setting the `size` attribute to `small` to render a `small` element inside a `p` element.
 
 ### Use text styling sparingly
 
diff --git a/src/en/styles/typography/typography.md b/src/en/styles/typography/typography.md
index 1a9fdd6b5..d9048a82e 100644
--- a/src/en/styles/typography/typography.md
+++ b/src/en/styles/typography/typography.md
@@ -25,10 +25,8 @@ tokenTable:
     font-h4: Heading 4
     font-h5: Heading 5
     font-h6: Heading 6
-    font-label: Label
     font-text: Text
-    font-textLong: Paragraph
-    font-caption: Caption
+    font-textSmall: Text small
     fontFamilies-heading: Heading
     fontFamilies-body: Text
     fontFamilies-monospace: Monospace
@@ -75,10 +73,10 @@ Note: The font property is a shorthand property for font-weight, font-size/line-
 
 ### Text
 
-- For font size, keep text line length below 75 characters for a comfortable, accessible reading length.
-- Use the css unit `75ch` or lower to set the maximum width of your paragraphs.
+- For font size, keep text line length below 65 characters for a comfortable, accessible reading length.
+- Use the css unit `65ch (--gcds-text-character-limit)` or lower to set the maximum width of your paragraphs.
 
-{% include "partials/token_table.njk", token: 'font', subTokens: "label text textLong caption", type: 'typography' %}
+{% include "partials/token_table.njk", token: 'font', subTokens: "text textSmall", type: 'typography' %}
 
 ### Font families
 
diff --git a/src/fr/composants/boite/code.md b/src/fr/composants/boite/code.md
index edd0f5881..b76d056dd 100644
--- a/src/fr/composants/boite/code.md
+++ b/src/fr/composants/boite/code.md
@@ -14,7 +14,7 @@ Utilisez les boîtes pour ajouter un élément enveloppant associé à une large
 
 ### Limiter la largeur du contenu
 
-- Veillez à ce que vos lignes de texte ne dépassent pas 75 caractères pour obtenir une longueur de lecture acceptable.
+- Veillez à ce que vos lignes de texte ne dépassent pas 65 caractères pour obtenir une longueur de lecture acceptable.
 - Limitez la largeur de la boîte pour éviter que les grands écrans n’affichent des lignes de texte trop longues et difficiles à lire.
 - Évitez de dépasser la largeur maximale de 71,25 rem (1140 px).
 
diff --git a/src/fr/composants/boite/design.md b/src/fr/composants/boite/design.md
index 6373c116e..440d9a5b3 100644
--- a/src/fr/composants/boite/design.md
+++ b/src/fr/composants/boite/design.md
@@ -19,7 +19,7 @@ date: 'git Last Modified'
 
 ### Limiter la largeur du contenu
 
-- Veillez à ce que vos lignes de texte ne dépassent pas 75 caractères pour obtenir une longueur de lecture acceptable.
+- Veillez à ce que vos lignes de texte ne dépassent pas 65 caractères pour obtenir une longueur de lecture acceptable.
 - Limitez la largeur de la boîte pour éviter que les grands écrans n’affichent des lignes de texte trop longues et difficiles à lire.
 - Évitez de dépasser la largeur maximale de 71,25 rem (1140 px).
 
diff --git a/src/fr/composants/texte/code.md b/src/fr/composants/texte/code.md
index c0e0e8227..66e61438d 100644
--- a/src/fr/composants/texte/code.md
+++ b/src/fr/composants/texte/code.md
@@ -19,10 +19,10 @@ Le composant texte affiche du contenu sans titre avec les styles correspondants
 
 ### Définissez la taille du texte
 
-- Définissez l'attribut de texte `size` à `body` ou `caption`.
+- Définissez l'attribut de texte `size` à `body` ou `small`.
 - Utilisez la valeur par défaut `body` `size` pour produire un élément `p` avec la taille de police et le contraste de couleur recommandés.
 - Choisissez une légende pour présenter brièvement le contexte d'une section ou d'un élément de contenu.
-- Choisissez d'afficher un texte plus petit en définissant l'attribut `size` à `caption` pour produire un élément `small` à l'intérieur d'un élément `p`.
+- Choisissez d'afficher un texte plus petit en définissant l'attribut `size` à `small` pour produire un élément `small` à l'intérieur d'un élément `p`.
 
 ### Utilisez des styles de texte avec prudence
 
diff --git a/src/fr/composants/titre/code.md b/src/fr/composants/titre/code.md
index 87b33b80e..f8b5ec92f 100644
--- a/src/fr/composants/titre/code.md
+++ b/src/fr/composants/titre/code.md
@@ -38,8 +38,8 @@ Les niveaux de titre suivent un ordre séquentiel et hiérarchique : les niveaux
 
 - Conservez l'espacement par défaut pour une expérience de lecture agréable et accessible. Ces valeurs par défaut créent des espaces visuels et des séparations entre les différentes sections.
 - Conservez les valeurs d'espacement suivantes pour maintenir un équilibre visuel entre les titres d'une page :
-  - Par défaut `margin-bottom`: `400` pour tous les niveaux
-  - Par défaut `margin-top`: `0` pour H1 et `500` pour H2 et 3
+  - Par défaut `margin-bottom`: `300` pour tous les niveaux
+  - Par défaut `margin-top`: `0` pour H1 et `600` pour H2 et 3
 
 {% include "partials/getcode.njk" %}
 
diff --git a/src/fr/composants/titre/design.md b/src/fr/composants/titre/design.md
index c019e5a83..a1bf1fec4 100644
--- a/src/fr/composants/titre/design.md
+++ b/src/fr/composants/titre/design.md
@@ -52,5 +52,5 @@ Les niveaux de titre suivent un ordre séquentiel et hiérarchique : les niveaux
 
 - Conservez l'espacement par défaut pour une expérience de lecture agréable et accessible. Ces valeurs par défaut créent des espaces visuels et des séparations entre les différentes sections.
 - Conservez les valeurs d'espacement suivantes pour maintenir un équilibre visuel entre les titres d'une page :
-  - Marge inférieure : 400 pour tous les niveaux.
-  - Marge supérieure : 0 pour H1 et 500 pour H2 et 3.
+  - Marge inférieure : 300 pour tous les niveaux.
+  - Marge supérieure : 0 pour H1 et 600 pour H2 et 3.
diff --git a/src/fr/recherche.md b/src/fr/recherche.md
index 17c0378ad..ac999b52d 100644
--- a/src/fr/recherche.md
+++ b/src/fr/recherche.md
@@ -23,7 +23,7 @@ eleventyNavigation:
 >
 </gcds-search>
 
-<gcds-text size="caption">
+<gcds-text size="small">
   N'incluez pas de renseignements personnels (téléphone, courriel, NAS, renseignements financiers, médicaux ou professionnels).
 </gcds-text>
 
diff --git a/src/fr/styles/typographie/typographie.md b/src/fr/styles/typographie/typographie.md
index 117557b5c..57d046212 100644
--- a/src/fr/styles/typographie/typographie.md
+++ b/src/fr/styles/typographie/typographie.md
@@ -25,10 +25,8 @@ tokenTable:
     font-h4: En-tête 4
     font-h5: En-tête 5
     font-h6: En-tête 6
-    font-label: Label
     font-text: Texte
-    font-textLong: Paragraph
-    font-caption: Caption
+    font-textSmall: Texte petit
     fontFamilies-heading: En-tête
     fontFamilies-body: Texte
     fontFamilies-monospace: Espacement fixe
@@ -76,10 +74,10 @@ Remarque : La propriété de la police représente à la fois l'épaisseur, la t
 
 ### Texte
 
-- Pour la taille de police, conservez la longueur d'une ligne à moins de 75 caractères pour assurer une lecture aisée et accessible.
-- Insérez la valeur css `75ch` ou moins pour régler la largeur maximale de vos paragraphes.
+- Pour la taille de police, conservez la longueur d'une ligne à moins de 65 caractères pour assurer une lecture aisée et accessible.
+- Insérez la valeur css `65ch (--gcds-text-character-limit)` ou moins pour régler la largeur maximale de vos paragraphes.
 
-{% include "partials/token_table.njk", token: 'font', subTokens: "label text textLong caption", type: 'typography' %}
+{% include "partials/token_table.njk", token: 'font', subTokens: "text textSmall", type: 'typography' %}
 
 ### Familles de police
 
diff --git a/src/styles/components/_table.scss b/src/styles/components/_table.scss
index d2e026374..e9752541c 100644
--- a/src/styles/components/_table.scss
+++ b/src/styles/components/_table.scss
@@ -120,13 +120,6 @@ table {
   }
 }
 
-.table-display-token-typography {
-  tr.row-label,
-  tr.row-textLong {
-    display: none;
-  }
-}
-
 .table-display-token-fontFamilies {
   .row-icons {
     display: none;
diff --git a/src/styles/style.css b/src/styles/style.css
index ef52dfe0e..eaf6515c4 100644
--- a/src/styles/style.css
+++ b/src/styles/style.css
@@ -311,11 +311,6 @@ table .spacing-preview {
   width: 40%;
 }
 
-.table-display-token-typography tr.row-label,
-.table-display-token-typography tr.row-textLong {
-  display: none;
-}
-
 .table-display-token-fontFamilies .row-icons {
   display: none;
 }
diff --git a/src/styles/style.css.map b/src/styles/style.css.map
index e94fb5175..131810acb 100644
--- a/src/styles/style.css.map
+++ b/src/styles/style.css.map
@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["utilities/_backgrounds.scss","_typography.scss","_general.scss","components/_anatomy-list.scss","components/_code-showcase.scss","components/_copy-code.scss","components/_component-preview.scss","components/_component-preview-box.scss","components/_table.scss","components/_tabs.scss","pages/_home.scss","pages/_search.scss"],"names":[],"mappings":"AACA;EACE;EACA;EACA;EACA;;AAEA;EAEE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;;AAIJ;EACE;EACA;;;AC3BF;EACE;;AAEA;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAIJ;EAGE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAIF;AAAA;EAEE;EACA;;;AAGF;AAAA;EAEE;;;AAIF;AAAA;EAEE;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;ACxEF;AAAA;AAAA;AAIA;EACE;IACE;;EAEF;IACE;;;AAIJ;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAIA;AAAA;EAEE;;AAGF;EACE;;;AChCJ;EACE;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIJ;EACE;EACA;;;AC7BJ;AAAA;AAAA;AAKE;EACE;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAIJ;EACE;;AAGF;EACE;EACA;;;AC9BJ;AAAA;AAAA;AAIA;EACE;EACA;;;AAGF;EACE;;;ACTA;EACE;;AAGF;EACE;;;ACNJ;EACE;EACA;EACA;;AAEA;EACE;;AAEA;EACE;;AAIJ;EACE;EACA;EACA;;AAEA;EACE;;;AClBJ;EADF;IAEI;IACA;IACA,YACE;;;;AAMN;EACE;EACA;;AAEA;EACE;EACA,YACE;;AAKJ;EACE;;AAGF;EACE;;AAIF;EACE;;AAIF;AAAA;EAEE;;AAEA;AAAA;EACE;;AAGF;AAAA;EACE;;AAIJ;EACE;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAGF;EACE;;;AAMF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;;AAKF;EACE;;AAGF;EACE;;AAGF;EACE;;;AAOF;AAAA;AAAA;EACE;EACA;;AAGF;AAAA;AAAA;EACE;;;AAKF;AAAA;EAEE;;;AAKF;EACE;;;AAIJ;EACE;;AAEA;EACE;;;AC1IF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIF;EACE;EACA;EAEA;EAEA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EAEA;EACA;EACA;EAEA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;EACA;;AAGF;EACE;;;ACtDN;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AC1BN;EACE;EACA;;AAEA;EACE;EACA;;;AAIJ;EACE;EACA;EACA;EACA;EACA,WACE;;;AAIJ;EACE;IAAO;;EACP;IAAO;;EACP;IAAO;;EACP;IAAO;;EACP;IAAO;;EACP;IAAO;;EACP;IAAO;;;AAGT;EACE;IAAO;;EACP;IAAO;;EACP;IAAO;;EACP;IAAO","file":"style.css"}
\ No newline at end of file
+{"version":3,"sourceRoot":"","sources":["utilities/_backgrounds.scss","_typography.scss","_general.scss","components/_anatomy-list.scss","components/_code-showcase.scss","components/_copy-code.scss","components/_component-preview.scss","components/_component-preview-box.scss","components/_table.scss","components/_tabs.scss","pages/_home.scss","pages/_search.scss"],"names":[],"mappings":"AACA;EACE;EACA;EACA;EACA;;AAEA;EAEE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;;AAIJ;EACE;EACA;;;AC3BF;EACE;;AAEA;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAIJ;EAGE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAIF;AAAA;EAEE;EACA;;;AAGF;AAAA;EAEE;;;AAIF;AAAA;EAEE;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;ACxEF;AAAA;AAAA;AAIA;EACE;IACE;;EAEF;IACE;;;AAIJ;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAIA;AAAA;EAEE;;AAGF;EACE;;;AChCJ;EACE;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIJ;EACE;EACA;;;AC7BJ;AAAA;AAAA;AAKE;EACE;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAIJ;EACE;;AAGF;EACE;EACA;;;AC9BJ;AAAA;AAAA;AAIA;EACE;EACA;;;AAGF;EACE;;;ACTA;EACE;;AAGF;EACE;;;ACNJ;EACE;EACA;EACA;;AAEA;EACE;;AAEA;EACE;;AAIJ;EACE;EACA;EACA;;AAEA;EACE;;;AClBJ;EADF;IAEI;IACA;IACA,YACE;;;;AAMN;EACE;EACA;;AAEA;EACE;EACA,YACE;;AAKJ;EACE;;AAGF;EACE;;AAIF;EACE;;AAIF;AAAA;EAEE;;AAEA;AAAA;EACE;;AAGF;AAAA;EACE;;AAIJ;EACE;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAGF;EACE;;;AAMF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;;AAKF;EACE;;AAGF;EACE;;AAGF;EACE;;;AAOF;AAAA;AAAA;EACE;EACA;;AAGF;AAAA;AAAA;EACE;;;AAKF;EACE;;;AAIJ;EACE;;AAEA;EACE;;;ACnIF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIF;EACE;EACA;EAEA;EAEA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EAEA;EACA;EACA;EAEA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;EACA;;AAGF;EACE;;;ACtDN;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AC1BN;EACE;EACA;;AAEA;EACE;EACA;;;AAIJ;EACE;EACA;EACA;EACA;EACA,WACE;;;AAIJ;EACE;IAAO;;EACP;IAAO;;EACP;IAAO;;EACP;IAAO;;EACP;IAAO;;EACP;IAAO;;EACP;IAAO;;;AAGT;EACE;IAAO;;EACP;IAAO;;EACP;IAAO;;EACP;IAAO","file":"style.css"}
\ No newline at end of file

From fd365264549e22d41b027dc0fa55e06656e67d9a Mon Sep 17 00:00:00 2001
From: Melanie Boeckmann <melanie.bockmann@gmail.com>
Date: Tue, 10 Dec 2024 14:31:50 -0800
Subject: [PATCH 06/11] chore: revert accidental colour updates

---
 src/styles/components/_table.scss | 6 +++---
 src/styles/components/_tabs.scss  | 4 ++--
 src/styles/style.css              | 8 ++++----
 3 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/src/styles/components/_table.scss b/src/styles/components/_table.scss
index e9752541c..1e723234c 100644
--- a/src/styles/components/_table.scss
+++ b/src/styles/components/_table.scss
@@ -4,8 +4,8 @@
     overflow-x: scroll;
     box-shadow:
       inset calc(-1 * var(--gcds-border-width-xl)) 0 0
-        var(--gcds-color-grayscale-25),
-      inset var(--gcds-border-width-xl) 0 0 var(--gcds-color-grayscale-25);
+        var(--gcds-color-grayscale-50),
+      inset var(--gcds-border-width-xl) 0 0 var(--gcds-color-grayscale-50);
   }
 }
 
@@ -62,7 +62,7 @@ table {
   }
 
   .spacing-preview {
-    background-color: var(--gcds-color-blue-600);
+    background-color: var(--gcds-color-blue-500);
   }
 }
 
diff --git a/src/styles/components/_tabs.scss b/src/styles/components/_tabs.scss
index ba83cb8d3..e0db24004 100644
--- a/src/styles/components/_tabs.scss
+++ b/src/styles/components/_tabs.scss
@@ -9,7 +9,7 @@ nav.tabs {
     gap: var(--gcds-spacing-75);
     flex-wrap: wrap;
     border-block-end: var(--gcds-border-width-md) solid
-      var(--gcds-color-grayscale-75);
+      var(--gcds-color-grayscale-100);
   }
 
   a {
@@ -38,7 +38,7 @@ nav.tabs {
     }
 
     &:hover {
-      background-color: var(--gcds-color-grayscale-25);
+      background-color: var(--gcds-color-grayscale-50);
     }
 
     &:active {
diff --git a/src/styles/style.css b/src/styles/style.css
index eaf6515c4..2b7b0fc17 100644
--- a/src/styles/style.css
+++ b/src/styles/style.css
@@ -223,7 +223,7 @@ ul li ul li {
   .table-overflow {
     max-width: var(--gcds-container-full);
     overflow-x: scroll;
-    box-shadow: inset calc(-1 * var(--gcds-border-width-xl)) 0 0 var(--gcds-color-grayscale-25), inset var(--gcds-border-width-xl) 0 0 var(--gcds-color-grayscale-25);
+    box-shadow: inset calc(-1 * var(--gcds-border-width-xl)) 0 0 var(--gcds-color-grayscale-50), inset var(--gcds-border-width-xl) 0 0 var(--gcds-color-grayscale-50);
   }
 }
 
@@ -267,7 +267,7 @@ table .color-preview {
   border-radius: var(--gcds-spacing-600);
 }
 table .spacing-preview {
-  background-color: var(--gcds-color-blue-600);
+  background-color: var(--gcds-color-blue-500);
 }
 
 .table-display-token-color tr {
@@ -331,7 +331,7 @@ nav.tabs ul {
   background-color: var(--gcds-color-grayscale-0);
   gap: var(--gcds-spacing-75);
   flex-wrap: wrap;
-  border-block-end: var(--gcds-border-width-md) solid var(--gcds-color-grayscale-75);
+  border-block-end: var(--gcds-border-width-md) solid var(--gcds-color-grayscale-100);
 }
 nav.tabs a {
   display: block;
@@ -354,7 +354,7 @@ nav.tabs a[aria-current=page] {
   pointer-events: none;
 }
 nav.tabs a:hover {
-  background-color: var(--gcds-color-grayscale-25);
+  background-color: var(--gcds-color-grayscale-50);
 }
 nav.tabs a:active {
   color: var(--gcds-focus-text) !important;

From ad0808a8e8c366042d58d47e01eb7eb8bf508c59 Mon Sep 17 00:00:00 2001
From: Melanie Boeckmann <melanie.bockmann@gmail.com>
Date: Wed, 11 Dec 2024 08:32:31 -0800
Subject: [PATCH 07/11] Update .eleventy.js

Co-authored-by: Daine Trinidad <daine.trinidad@cds-snc.ca>
---
 .eleventy.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.eleventy.js b/.eleventy.js
index 75bd31d70..67f76ccc5 100644
--- a/.eleventy.js
+++ b/.eleventy.js
@@ -302,7 +302,7 @@ module.exports = function (eleventyConfig) {
   });
 
   /*
-   * Convert token name from camelCase to kebab-case
+   * Convert string from camelCase to kebab-case
    */
   eleventyConfig.addFilter("camelToKebab", function(str) {
     return str.replace(/[a-z][A-Z]/g, function(match) {

From bb1a0a12c97c3e8d50259475b8bafd68accf78f3 Mon Sep 17 00:00:00 2001
From: Melanie Boeckmann <melanie.bockmann@gmail.com>
Date: Wed, 11 Dec 2024 08:32:44 -0800
Subject: [PATCH 08/11] Update src/_includes/partials/token_table.njk

Co-authored-by: Daine Trinidad <daine.trinidad@cds-snc.ca>
---
 src/_includes/partials/token_table.njk | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/_includes/partials/token_table.njk b/src/_includes/partials/token_table.njk
index 30e81506f..a47a7753e 100644
--- a/src/_includes/partials/token_table.njk
+++ b/src/_includes/partials/token_table.njk
@@ -45,7 +45,6 @@
                     {%- when 'rgb' %}
                         {{- item[1].value | hexTo: 'rgb' }}
                     {%- when 'px' %}
-                        PX
                         {{- item[1].value | replace: "rem", "" | times: 16 }}px
                     {%- when 'font-value' %}
                         {%- case type %}

From dc3361414a27957c7e9b335c89785623b8f53062 Mon Sep 17 00:00:00 2001
From: Melanie Boeckmann <melanie.bockmann@gmail.com>
Date: Wed, 11 Dec 2024 11:38:03 -0800
Subject: [PATCH 09/11] chore: update text guidance

---
 src/en/components/text/code.md    | 1 -
 src/en/components/text/design.md  | 3 +--
 src/fr/composants/texte/code.md   | 1 -
 src/fr/composants/texte/design.md | 3 +--
 4 files changed, 2 insertions(+), 6 deletions(-)

diff --git a/src/en/components/text/code.md b/src/en/components/text/code.md
index 43f609303..3893ff635 100644
--- a/src/en/components/text/code.md
+++ b/src/en/components/text/code.md
@@ -21,7 +21,6 @@ Text displays non-heading content with matching GC Design System styles to provi
 
 - Set the text `size` attribute to `body` or `small`.
 - Use the default `body` `size` value to render a `p` element with the recommended font size and colour contrast.
-- Choose a caption to present brief context about a section or piece of content.
 - Opt to display smaller text by setting the `size` attribute to `small` to render a `small` element inside a `p` element.
 
 ### Use text styling sparingly
diff --git a/src/en/components/text/design.md b/src/en/components/text/design.md
index f4ab1722d..d4a8d1a64 100644
--- a/src/en/components/text/design.md
+++ b/src/en/components/text/design.md
@@ -36,11 +36,10 @@ Tip: Think about whether the message could be interpreted another way.
 
 Tip: To adopt a more human tone, think about explaining aloud to someone. How does it sound when you speak the content in conversation?
 
-### Choose regular text or a caption
+### Choose regular or small text
 
 - Set the text size based on the role of the content and product context.
 - Use regular text for most non-heading content. Regular text uses the default font size.
-- Choose a caption to present brief context about a section or piece of content. Caption text displays a smaller font size.
 
 ### Use text styling sparingly
 
diff --git a/src/fr/composants/texte/code.md b/src/fr/composants/texte/code.md
index 66e61438d..bb9227ec9 100644
--- a/src/fr/composants/texte/code.md
+++ b/src/fr/composants/texte/code.md
@@ -21,7 +21,6 @@ Le composant texte affiche du contenu sans titre avec les styles correspondants
 
 - Définissez l'attribut de texte `size` à `body` ou `small`.
 - Utilisez la valeur par défaut `body` `size` pour produire un élément `p` avec la taille de police et le contraste de couleur recommandés.
-- Choisissez une légende pour présenter brièvement le contexte d'une section ou d'un élément de contenu.
 - Choisissez d'afficher un texte plus petit en définissant l'attribut `size` à `small` pour produire un élément `small` à l'intérieur d'un élément `p`.
 
 ### Utilisez des styles de texte avec prudence
diff --git a/src/fr/composants/texte/design.md b/src/fr/composants/texte/design.md
index 750db29d8..91e3d6441 100644
--- a/src/fr/composants/texte/design.md
+++ b/src/fr/composants/texte/design.md
@@ -37,11 +37,10 @@ Conseil : Demandez-vous si le message risque d'être interprété autrement.
 
 Conseil : Pour adopter un ton plus humain, faites comme si vous parliez à quelqu'un à voix haute. Que pensez-vous du contenu lorsque vous le prononcez de vive voix?
 
-### Choisissez un texte ordinaire ou une légende
+### Choisissez la taille de texte
 
 - Définissez la taille du texte en fonction du rôle du contenu et du contexte du produit.
 - Utilisez du texte ordinaire pour la plupart du contenu qui n'est pas un titre. Le texte normal utilise la taille de police par défaut.
-- Choisissez une légende pour présenter brièvement le contexte d'une section ou d'un élément de contenu. Le texte de la légende s'affiche avec une taille de police plus petite.
 
 ### Utilisez des styles de texte avec prudence
 

From 6453180296ac95914601087a833ee5a34ce02e63 Mon Sep 17 00:00:00 2001
From: Melanie Boeckmann <melanie.bockmann@gmail.com>
Date: Wed, 11 Dec 2024 12:14:32 -0800
Subject: [PATCH 10/11] chore: update text guidance

---
 src/fr/styles/typographie/typographie.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/fr/styles/typographie/typographie.md b/src/fr/styles/typographie/typographie.md
index 57d046212..1c1e43f70 100644
--- a/src/fr/styles/typographie/typographie.md
+++ b/src/fr/styles/typographie/typographie.md
@@ -26,7 +26,7 @@ tokenTable:
     font-h5: En-tête 5
     font-h6: En-tête 6
     font-text: Texte
-    font-textSmall: Texte petit
+    font-textSmall: Petit texte
     fontFamilies-heading: En-tête
     fontFamilies-body: Texte
     fontFamilies-monospace: Espacement fixe

From eebf7d24052f1d75b4c1f903000bac4206956e97 Mon Sep 17 00:00:00 2001
From: Melanie Boeckmann <melanie.bockmann@gmail.com>
Date: Wed, 11 Dec 2024 12:15:59 -0800
Subject: [PATCH 11/11] chore: update tokens package

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index 415aa4ceb..d8682cac6 100644
--- a/package.json
+++ b/package.json
@@ -35,7 +35,7 @@
   "devDependencies": {
     "@11ty/eleventy-plugin-syntaxhighlight": "^5.0.0",
     "@cdssnc/gcds-components": "^0.28.0",
-    "@cdssnc/gcds-tokens": "^2.0.0",
+    "@cdssnc/gcds-tokens": "^2.0.1",
     "@cdssnc/gcds-utility": "^1.5.0",
     "@quasibit/eleventy-plugin-sitemap": "^2.1.4",
     "chroma-js": "^2.4.2",