/* 🔗 Убираем подчёркивание у ссылок */
a.btn-card {
    text-decoration: none;
}

/* 🎛 Общий стиль всех кнопок */
.btn-card {
    padding: 6px 14px;
    margin-right: 6px;
    border-radius: 8px;
    font-weight: 500;
    font-size: 14px;
    border: none;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
    display: inline-block;
    text-align: center;
    white-space: nowrap;        /* Не переносить текст */
    min-height: 36px;           /* Унифицированная высота */
    line-height: 1.4;
}

/* 🔵 "Перейти" — синий */
.btn-go {
    background: #1c1f30;
    color: #2196f3;
    border: 1px solid #2196f3;
    box-shadow: inset 0 0 4px #2196f3, 0 0 6px rgba(33, 150, 243, 0.3);
}

/* 🟦 "Отзывы" — фиолетово-сиреневый */
.btn-reviews {
    background: #1c1f30;
    color: #00cfff;
    border: 1px solid #00cfff;
    box-shadow: inset 0 0 4px #00cfff, 0 0 6px rgba(0, 204, 255, 0.3);
}

/* 🔵 "Обзоры" — лазурный */
.btn-video {
    background: #1c1f30;
    color: #2196f3;
    border: 1px solid #2196f3;
    box-shadow: inset 0 0 4px #2196f3, 0 0 6px rgba(33, 150, 243, 0.3);
}

/* ✅ "Сравнить" — зелёный */
.btn-compare {
    background: #1c1f30;
    color: #44d444;
    border: 1px solid #44d444;
    box-shadow: inset 0 0 4px #44d444, 0 0 6px rgba(68, 212, 68, 0.3);
    min-width: 95px;

    min-width: 95px;                      /* уже есть */
    max-width: 110px;                     /* 🔒 ограничиваем максимум */
    overflow: hidden;                     /* 💥 прячем лишний текст */
    text-overflow: ellipsis;             /* … в конце, если не влезает */
    white-space: nowrap;                 /* ❌ не переносим на новую строку */
    display: inline-block;               /* 💡 для совместимости */
}

/* 💡 Hover-эффект — общий, мягкий неон */
.btn-card:hover {
    box-shadow: 0 0 10px currentColor, 0 0 20px currentColor;
    transform: translateY(-1px);
    transition: 0.3s ease;
}




.neuro-card {
    background: rgba(255, 255, 255, 0.1);           /* 💎 Полупрозрачный белый фон — создаёт эффект стекла */
    border: 1px solid rgba(255, 255, 255, 0.25);    /* 🧊 Светлая граница — делает контуры карточки видимыми, но мягкими */
    border-radius: 16px;                            /* 🟦 Скруглённые углы — добавляют современности и плавности */
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.25);     /* 🌫 Глубокая тень — придаёт объём и эффект "плавающей карточки" */
    backdrop-filter: blur(10px);                     /* 🔮 Эффект размытия заднего фона — основа стеклянного стиля */
    -webkit-backdrop-filter: blur(10px);             /* 🍏 Поддержка blur для Safari — чтобы везде было одинаково */
    transition: transform 0.3s ease, box-shadow 0.3s ease;  /* ⏳ Плавный переход при наведении */
    padding: 20px;                                  /* 📦 Внутренние отступы — обеспечивают "воздух" внутри карточки */

    display: flex;                                     /* 🧱 Делаем карточку флекс-контейнером */
    flex-direction: column;                            /* ⬇️ Контент вертикально */
    justify-content: space-between;                    /* 🔄 Равномерное распределение */
    min-height: 360px;                                 /* 📏 Устанавливаем минимальную высоту(ДЕЛАТЬ КАРТОЧКУ БОЛЬШЕ/МЕНЬШЕ) */
}

/* Hover: лёгкое приподнимание и сияние */
.neuro-card:hover {
    transform: translateY(-4px);                         /* ⬆️ Приподнимает карточку — создаёт эффект “нажатия” */
    box-shadow: 0 0 20px rgba(0, 123, 255, 0.4);         /* ✨ Голубое внешнее свечение — подчёркивает активное состояние */
}


/* 🧱 Отступы заголовка нейросети внутри карточки */
.neuro-card h2 {
    margin-bottom: 10px;      /* 📏 Отступ снизу — создаёт пространство между заголовком и описанием */
    margin-top: 2px;              /* 🔽 Минимальный отступ сверху — приближаем к логотипу/ УДАЛИТЬ ЭТУ СТРОКУ И БУДЕТ КАК РАНЬШЕ*/
}

/* 🎯 Стили заголовка нейросети в карточке (неоновый голубой) */
.neuro-card h2 a {
    color: #00cfff !important;        /* 💠 Неоново-голубой цвет — подчёркивает заголовок */
    font-size: 1.8rem;                /* 🔠 Крупный размер — делает название заметным */
    font-weight: 600;                 /* 🅱️ Полужирный текст — визуальный акцент */
    text-decoration: none;           /* 🚫 Без подчёркивания — чистый заголовок */
    transition: color 0.2s ease-in-out; /* 🌊 Плавное изменение цвета при наведении */
}

/* ✨ Эффект при наведении на заголовок */
.neuro-card h2 a:hover {
    color: #00eaff !important;       /* 💫 Ещё ярче при наведении — для интерактивности */
}



/* Описание и текст */
.neuro-card p {
    color: #DCDCDC;                        /* 🎨 Светло-серый цвет текста: хорошо читается на тёмном и стеклянном фоне */
    font-size: 0.95rem;                    /* 🔠 Немного меньше стандартного размера — подходит для второстепенного текста */
    font-weight: 500;                      /* 🅱️ Немного утолщает шрифт — делает текст более читаемым */
    text-shadow: 0 0 2px rgba(0,0,0,0.4);  /* 🌫 Лёгкий затемняющий ореол — улучшает читаемость на фоне */
}


/* 🔧 Подпись "Разработчик:" */
.label-dev {
    color: #2196f3;                            /* ✅ Зелёный, как на кнопке "Сравнить" */
    font-weight: 500;
    text-shadow: 0 0 2px rgba(68, 212, 68, 0.3);
}

/* ⭐ Подпись "Рейтинг:" */
.label-rating {
    color: #00cfff;                            /* 🌟 Оранжевый, ассоциируется со звёздами */
    font-weight: 500;
    text-shadow: 0 0 2px rgba(255, 152, 0, 0.3);
}


.favorite-icon-btn i {
    color: #ff0033 !important;       /* ❤️ Яркий красный, который ты указал */
    transition: all 0.3s ease;       /* 🔄 Плавный переход для эффекта */

    text-shadow: 0 0 6px rgba(255, 0, 51, 0.5);
    transform: scale(1.15);         /* 💓 слегка увеличивает сердечко */
}




.plain-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  font-size: 0.8rem;
  margin-top: 6px;
}

.tag-glow {
  color: #00ccff;
  font-weight: 500;
  text-shadow: 0 0 0px #00ccff, 0 0 5px #00ccff;
}