pr for mistakes solution

src/styles/_fonts.scss

@@ -4,3 +4,6 @@
   font-weight: normal;
   font-style: normal;
 }
+
+@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@200..800&display=swap');

src/styles/_typography.scss

@@ -1,3 +1,176 @@
-h1 {
-  @extend %h1;
+.main-title {
+  margin: 0;
+  margin-bottom: 30px;
+  font-family: "Bebas Neue", Arial, sans-serif;
+  font-size: 35px;
+  line-height: 43.2px;
+  letter-spacing: 0.154em;
+  -webkit-text-stroke: 0.08px $main-text-color;
+  color: #fff;
+  text-transform: uppercase;
+
+  &--fill-color {
+    color: $main-text-color;
+  }
+}
+
+.header {
+  &__price {
+    margin: 0;
+    font-family: "Manrope", sans-serif;
+    font-weight: 700;
+    font-size: 26px;
+    line-height: 35.52px;
+  }
+
+  &__promotion {
+    margin: 0;
+    margin-bottom: 20px;
+    font-family: "Manrope", sans-serif;
+  }
+
+  &__button {
+    font-family: "Manrope", sans-serif;
+    font-weight: 600;
+    text-transform: uppercase;
+    line-height: 21px;
+    font-size: 14px;
+  }
+
+  &__link {
+    font-family: "Manrope", sans-serif;
+    line-height: 18px;
+    font-size: 12px;
+    text-decoration: none;
+    color: $main-text-color;
+  }
+}
+
+.top-bar {
+  &__logo {
+    font-family: "Bebas Neue", Arial, sans-serif;
+    font-size: 36px;
+    text-decoration: none;
+    color: rgba(51, 51, 51, 1);
+    line-height: 43.2px;
+    letter-spacing: 6%;
+  }
+}
+
+.nav {
+  &__list {
+    font-family: "Manrope", sans-serif;
+    font-size: 16px;
+    line-height: 24px;
+  }
+
+  &__link {
+    text-decoration: none;
+    color: #F8F8F8;
+  }
+
+  &__item--sell-count {
+    &::after {
+      font-size: 9px;
+      color: #F8F8F8;
+      line-height: 14px;
+      font-family: "Bebas Neue", Arial, sans-serif;
+    }
+  }
+}
+
+.close-text {
+  font-family: "Manrope", sans-serif;
+  text-transform: uppercase;
+  color: #F8F8F8;
+  font-size: 12px;
+}
+
+.section-title {
+  position: relative;
+  font-size: 57px;
+  line-height: 69.6px;
+  letter-spacing: 8px;
+  font-weight: 400;
+  font-family: "Bebas Neue", Arial, sans-serif;
+  color: $main-text-color;
+  z-index: 2;
+
+  &--for-whom {
+    font-size: 36px;
+    line-height: 54px;
+    letter-spacing: 5.6px;
+  }
+
+  &--black {
+    color: #333333;
+  }
+
+  &--fill-color {
+    color: #fff;
+    -webkit-text-stroke: 1px $main-text-color;
+  }
+}
+
+.section-subtitle {
+  font-size: 36px;
+  line-height: 54px;
+  letter-spacing: 5.6px;
+  font-weight: 400;
+  font-family: "Bebas Neue", Arial, sans-serif;
+}
+
+.article-title {
+  margin: 0;
+  margin-bottom: 20px;
+  font-size: 24px;
+  line-height: 24px;
+  letter-spacing: 3.72px;
+  font-family: "Bebas Neue", Arial, sans-serif;
+  font-weight: 400;
+  text-align: center;
+
+  &--small {
+    margin-bottom: 10px;
+    font-size: 18px;
+    line-height: 18px;
+    letter-spacing: 2.79px;
+    text-align: left;
+  }
+}
+
+.regular-text {
+  position: relative;
+  margin: 0;
+  font-size: 16px;
+  line-height: 24px;
+  color: #4F4F4F;
+  font-family: "Manrope", sans-serif;
+  z-index: 2;
+
+  &--center {
+    text-align: center;
+  }
+
+  &--white {
+    color: #F8F8F8;
+  }
+
+  &--margin-bottom {
+    margin-bottom: 25px;
+  }
+}
+
+.for-whom {
+  &__article-number {
+    font-size: 36px;
+    line-height: 64.8px;
+    font-family: "Bebas Neue", Arial, sans-serif;
+  }
+
+  &__right-text {
+    font-family: "Bebas Neue", Arial, sans-serif;
+    letter-spacing: 2.64px;
+    color: #828282;
+  }
 }