/* Основные стили для иконок социальных сетей */
.social_icon .list-inline {
    display: flex; /* Делаем иконки в строку */
    justify-content: center; /* Центрируем иконки по умолчанию */
    flex-wrap: wrap; /* Если иконки не помещаются, переносим на новую строку */
    padding: 0; /* Убираем внутренние отступы */
    margin: 0; /* Убираем внешние отступы */
}

.social_icon .list-inline-item {
    margin: 0 10px; /* Отступ между иконками */
}

.social_icon .list-inline-item a {
    color: #fff; /* Белый цвет иконок */
    font-size: 24px; /* Размер иконок */
    transition: all 0.3s ease; /* Плавное изменение всех свойств */
    display: inline-block; /* Для корректной анимации */
    text-decoration: none; /* Убираем подчёркивание */
}

/* Общие эффекты при наведении */
.social_icon .list-inline-item a:hover {
    transform: scale(1.2); /* Увеличение иконки */
}

/* Индивидуальные цвета брендбука при наведении */

/* VK — синий */
.social_icon .list-inline-item a.vk:hover i {
    color: #0077FF; /* Цвет VK */
}

/* YouTube — красный */
.social_icon .list-inline-item a.youtube:hover i {
    color: #FF0000; /* Цвет YouTube */
}

/* Telegram — голубой */
.social_icon .list-inline-item a.telegram:hover i {
    color: #0088CC; /* Цвет Telegram */
}

/* Instagram — градиент (розовый и оранжевый) */
.social_icon .list-inline-item a.instagram:hover i {
    background: linear-gradient(45deg, #405DE6, #5851DB, #833AB4, #C13584, #E1306C, #FD1D1D, #F56040, #F77737, #FCAF45, #FFDC80);
    -webkit-background-clip: text; /* Применяем градиент к тексту (иконке) */
    -webkit-text-fill-color: transparent; /* Делаем текст прозрачным */
}

/* Facebook — синий */
.social_icon .list-inline-item a.facebook:hover i {
    color: #1877F2; /* Цвет Facebook */
}

/* Стили для иконок в мобильной версии */
.mobile-social-icons .list-inline {
    display: flex;
    justify-content: center;
    padding: 0;
    margin: 0;
}

.mobile-social-icons .list-inline-item {
    margin: 0 10px; /* Отступ между иконками */
}

.mobile-social-icons .list-inline-item a {
    font-size: 20px; /* Размер иконок */
    transition: all 0.3s ease; /* Плавное изменение всех свойств */
    display: inline-block; /* Для корректной анимации */
    text-decoration: none; /* Убираем подчёркивание */
}

.mobile-social-icons .list-inline-item a:hover {
    transform: scale(1.2); /* Увеличение иконки */
}

/* Индивидуальные цвета брендбука для мобильной версии */

/* VK — синий */
.mobile-social-icons .list-inline-item a.vk i {
    color: #0077FF; /* Цвет VK */
}

/* YouTube — красный */
.mobile-social-icons .list-inline-item a.youtube i {
    color: #FF0000; /* Цвет YouTube */
}

/* Telegram — голубой */
.mobile-social-icons .list-inline-item a.telegram i {
    color: #0088CC; /* Цвет Telegram */
}

/* Instagram — градиент (розовый и оранжевый) */
.mobile-social-icons .list-inline-item a.instagram i {
    background: linear-gradient(45deg, #405DE6, #5851DB, #833AB4, #C13584, #E1306C, #FD1D1D, #F56040, #F77737, #FCAF45, #FFDC80);
    -webkit-background-clip: text; /* Применяем градиент к тексту (иконке) */
    -webkit-text-fill-color: transparent; /* Делаем текст прозрачным */
}

/* Facebook — синий */
.mobile-social-icons .list-inline-item a.facebook i {
    color: #1877F2; /* Цвет Facebook */
}

/* Стили для иконок в выпадающей строке на мобильных устройствах */
header.sticky .social_icon .list-inline-item a {
    color: #fff; /* Белый цвет иконок по умолчанию */
}

header.sticky .social_icon .list-inline-item a.vk i {
    color: #0077FF; /* Цвет VK */
}

header.sticky .social_icon .list-inline-item a.youtube i {
    color: #FF0000; /* Цвет YouTube */
}

header.sticky .social_icon .list-inline-item a.telegram i {
    color: #0088CC; /* Цвет Telegram */
}

header.sticky .social_icon .list-inline-item a.instagram i {
    background: linear-gradient(45deg, #405DE6, #5851DB, #833AB4, #C13584, #E1306C, #FD1D1D, #F56040, #F77737, #FCAF45, #FFDC80);
    -webkit-background-clip: text; /* Применяем градиент к тексту (иконке) */
    -webkit-text-fill-color: transparent; /* Делаем текст прозрачным */
}

header.sticky .social_icon .list-inline-item a.facebook i {
    color: #1877F2; /* Цвет Facebook */
}

/* Адаптация для мобильных устройств */
@media (max-width: 767px) {
    .mobile-social-section {
        text-align: center; /* Центрируем текст и иконки */
        margin-top: 50px; /* Отступ от заголовка (можно изменить) */
    }

    .subscribe-text {
        font-size: 12px !important; /* Уменьшенный размер текста (можно изменить) */
        color: #fff; /* Белый цвет текста */
        margin-top: 10px; /* Отступ сверху */
        font-weight: bold; /* Жирный шрифт */
    }

    /* Скрыть иконки в шапке на мобильных устройствах при загрузке */
    header .social_icon {
        display: none;
    }

    /* Показать иконки в шапке при прокрутке */
    header.sticky .social_icon {
        display: flex; /* Показываем иконки при прокрутке */
        justify-content: center; /* Центрируем иконки */
    }
}