.ussr-menu {
  background: linear-gradient(to right, #8B0000, #A52A2A);
  padding: 0;
  font-family: 'Georgia', serif;
  overflow: hidden; /* предотвращает выход элементов за границы */
}

.ussr-menu ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap; /* позволяет переносить элементы */
  justify-content: center;
}

.ussr-menu li {
  margin: 0;
}

.ussr-menu a {
  display: block;
  color: #FFD700;
  text-decoration: none;
  padding: 12px 15px;
  transition: all 0.3s ease;
  border-right: 1px solid #B22222;
  font-size: 14px;
  white-space: normal; /* разрешает перенос текста */
  text-align: center; /* центрирует текст для лучшей читаемости */
}

.ussr-menu a:hover {
  background-color: #B22222;
  color: white;
  transform: translateY(-2px);
}

.ussr-menu a:first-child {
  border-left: 1px solid #B22222;
}

/* Адаптивность для мобильных устройств */
@media (max-width: 768px) {
  .ussr-menu ul {
    flex-direction: column; /* вертикальное расположение на мобильных */
    align-items: stretch; /* растягивает элементы на всю ширину */
  }
  
  .ussr-menu a {
    text-align: center;
    border-right: none; /* убирает вертикальные границы */
    border-bottom: 1px solid #B22222; /* добавляет горизонтальные разделители */
    padding: 10px 15px; /* корректирует отступы */
    font-size: 16px; /* увеличивает шрифт для удобства чтения */
  }
  
  .ussr-menu a:first-child {
    border-top: 1px solid #B22222; /* верхняя граница для первого элемента */
  }
}

/* Дополнительная адаптация для очень маленьких экранов (до 480 px) */
@media (max-width: 480px) {
  .ussr-menu a {
    font-size: 14px; /* немного уменьшает шрифт, если нужно */
    padding: 8px 12px; /* уменьшает отступы для компактности */
  }
}