начал адаптировать стили

src/components/Header/Header.module.css

@@ -121,7 +121,7 @@
 @media (max-width: 768px) {
   .headerMenu {
     flex-direction: column;
-    padding: 0;
+    
   }
   
   .headerMenu a {
@@ -143,4 +143,74 @@
 
 .headerMenu a[onclick]:hover::before {
   background: linear-gradient(90deg, #ffd89b, #ff6b6b);
+}
+
+/*бургер*/
+.burger {
+  display: none;
+  flex-direction: column;
+  cursor: pointer;
+  gap: 5px;
+}
+
+.burger span {
+  width: 25px;
+  height: 3px;
+  background: black;
+  transition: 0.3s;
+}
+
+/* Анимация крестика */
+.burger.active span:nth-child(1) {
+  transform: rotate(45deg) translate(5px, 5px);
+}
+
+.burger.active span:nth-child(2) {
+  opacity: 0;
+}
+
+.burger.active span:nth-child(3) {
+  transform: rotate(-45deg) translate(6px, -6px);
+}
+
+@media (max-width: 1090px) {
+
+  .burger {
+    display: flex;
+  }
+
+  .headerMenu {
+    flex-direction: row;
+    justify-content: space-between;
+  }
+
+  .headerNav {
+    position: absolute;
+    top: 100%;
+    left: 0;
+    width: 100%;
+    background: white;
+
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+
+    max-height: 0;
+    overflow: hidden;
+    transition: 0.3s ease;
+  }
+
+  .headerNav.open {
+    max-height: 300px;
+  }
+
+  .headerNav a {
+    width: 100%;
+    text-align: center;
+    padding: 1rem;
+  }
+
+  .phoneBlock {
+    display: none;
+  }
 }