body {
    background-color: #0a0a2a; /* Темно-синий основной фон */
    color: #e0e0e0;
    font-family: sans-serif;
    margin: 0;
    padding: 0;
}

header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 5%;
    background-color: #1d1d23; /* Более светлый синий для шапки */
    position: fixed;
    width: 90%;
    top: 0;
    z-index: 100;
}

/* Стилизуем контейнер логотипа, чтобы элементы были на одной строке по центру */
.logo {
    font-size: 24px;
    font-weight: bold;
    color: #ff8c00; /* Оранжевый акцент */
    display: flex; /* Используем Flexbox для выравнивания */
    align-items: center; /* Выравниваем элементы вертикально по центру */
}

/* Стилизуем саму иконку */
.logo-icon {
    /* Задаем размер иконки, например, 30x30 пикселей */
    width: 30px; 
    height: auto; /* Автоматическая высота для сохранения пропорций */
    /* Добавляем небольшой отступ справа, чтобы текст не прилипал к картинке */
    margin-right: 10px; 
}

nav ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
}

nav ul li a {
    color: #e0e0e0;
    text-decoration: none;
    padding: 10px 15px;
    display: block;
}

/* Стили для выпадающего меню (требует дополнительного JS для функциональности) */
.dropdown-content {
    display: none;
    position: absolute;
    background-color: #1a1a4a;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}

.dropdown:hover .dropdown-content {
    display: block;
}

/* Главная обложка */
.hero-section {
    background-image: url('/CSGROZ.jpg');
    background-size: cover;
    background-position: center;
    height: 100vh;
    display: flex;
    align-items: center; /* Выравнивание контента по центру вертикали */
    padding-top: 0px; /* Учитываем высоту шапки */
}

.hero-content {
    text-align: left; /* Контент слева, как вы просили */
    margin-left: 5%;
}

/* Оранжевые кнопки */
.btn-orange {
    background-color: #ff8c00; /* Ярко-оранжевый */
    color: #000;
    padding: 20px 45px;
    text-decoration: none;
    border-radius: 20px;
    font-weight: bold;
    display: block; /* Каждая кнопка на новой строке */
    margin-bottom: 10px; /* Отступ между кнопками */
    width: fit-content; /* Ширина по содержимому */
    transition: background-color 0.3s;
    font-size: 18px;
    color: white;
}

.btn-orange:hover {
    background-color: #e67e00;
}