.clan-rating-table {
    width: 100%;
    border-collapse: collapse;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5); /* Тень для таблицы */
    overflow: hidden; /* Скрытие переполнения */
    color: #b7c7e5; /* Светлый цвет текста */
    font-family: 'Arial', sans-serif;
}

/* Стили заголовков */
.clan-rating-table thead {
    background-color: #5b4b7f; /* Темный фон для заголовка с оттенком */
    text-align: left;
}

.clan-rating-table th {
    padding: 15px;
    border-bottom: 2px solid #ff3e8b; /* Розовая линия */
    text-transform: uppercase; /* Заглавные буквы */
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.5); /* Тень под заголовками */
}

/* Стили строк таблицы */
.clan-rating-table tbody tr {
    transition: background-color 0.3s, transform 0.2s, box-shadow 0.3s; /* Плавные переходы */
}

/* Чередование цветов строк */
.clan-rating-table tbody tr:nth-child(even) {
    background-color: #2b2b2b; /* Более светлый фон для четных строк */
}

.clan-rating-table tbody tr:hover {
    background-color: rgba(255, 62, 139, 0.5); /* Эффект при наведении */
    transform: translateY(-4px); /* Подъем при наведении */
    box-shadow: 0 10px 30px rgba(255, 62, 139, 0.7); /* Тень при наведении */
}

/* Стили ячеек */
.clan-rating-table td {
    padding: 15px;
    border-bottom: 1px solid #444; /* Темная линия между строками */
    position: relative; /* Позволяет использовать абсолютное позиционирование для эффектов */
}

.clan-rating-table td:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(255, 255, 255, 0.05); /* Легкий блеск */
    transition: background 0.3s; /* Плавный переход */
    z-index: 0; /* Позади содержимого ячейки */
}

.clan-rating-table td:hover:before {
    background: rgba(255, 255, 255, 0.1); /* Более яркий блеск при наведении */
}

/* Стили ссылок */
.clan-rating-table a {
    color: #ff3e8b; /* Цвет ссылок с оттенком */
    text-decoration: none;
    transition: color 0.3s; /* Плавный переход цвета */
    position: relative; /* Для добавления эффекта */
    z-index: 1; /* Поверх эффекта блеска */
}

.clan-rating-table a:hover {
    color: #FFE4E1; /* Светлее цвет при наведении */
}

/* Стили для изображений */
.rank img {
    width: 36px;
    height: 36px;
    position: sticky;
    left: 20px; /* Изменено для улучшения положения */
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.5); /* Эффект тени для изображений */
}
.details-section {
    padding: 40px 20px;
    width: 90%;
    background-color: #f9f9f900;
}
.details-section h2 {
    font-size: 2em;
    margin-bottom: 20px;
}
.product-description, .service-description {
    display: flex;
    flex-wrap: wrap;
}
.product-item, .service-item {
    margin: 15px;
    padding: 15px;
    border: 1px solid #ccc;
    border-radius: 5px;
    background-color: #ff000011;
    flex: 1 0 30%; /* Гибкое поведение элементов */
}
.product-image {
    max-width: 100%;
    height: auto;
}
.spacer {
    height: 50px;
    width: 100%;
}