animated style in desktop menu

styles.css

@@ -130,13 +130,17 @@ header {
 }
 
 .header-menu ul li a {
+  display: inline-block;
   color: #fff;
   text-decoration: none;
   font-size: 16px;
+  padding: 5px 10px;
+  transition: background-color 0.3s;
 }
 
 .header-menu ul li a:hover {
-  text-decoration: underline;
+  background-color: var(--border);
+  border-radius: 5px;
 }
 
 .header-right {
@@ -232,14 +236,14 @@ header h1 {
 }
 
 /* Скрываем обычное меню на мобильных устройствах */
-@media (max-width: 768px) {
+@media (max-width: 808px) {
   .header-center {
     display: none;
   }
 }
 
 /* Скрытие кнопки меню на десктопе */
-@media (min-width: 769px) {
+@media (min-width: 809px) {
   .menu-button,
   .mobile-menu {
     display: none !important;