/* ==================================================================
 * icon-hover-fx.css — универсальный hover-эффект для иконок icons-lib
 * Применяется ко всему сайту через подключение в head_custom.php
 * JS вешает классы .iconfx-host (на родителя-карточку) и .iconfx-img
 * ================================================================== */

.iconfx-img {
  position: relative;
  z-index: 1;
  transition: transform .25s ease, filter .25s ease;
  will-change: transform, filter;
}

.iconfx-host {
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

/* На hover родителя — карточка слегка поднимается с синей тенью */
.iconfx-host:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 40px rgba(30, 92, 184, 0.16);
}

/* На hover родителя — сама иконка увеличивается + голубой glow */
.iconfx-host:hover .iconfx-img,
.iconfx-img:hover {
  transform: scale(1.10);
  filter:
    drop-shadow(0 4px 10px rgba(30, 92, 184, 0.20))
    drop-shadow(0 0 14px rgba(74, 163, 245, 0.55));
}

/* Если иконка не внутри типовой карточки — отдельный hover на самой иконке */
.iconfx-img:not(.iconfx-host *) {
  cursor: default;
}

/* Уважение reduced-motion */
@media (prefers-reduced-motion: reduce) {
  .iconfx-img, .iconfx-host { transition: none; }
  .iconfx-host:hover { transform: none; }
  .iconfx-host:hover .iconfx-img, .iconfx-img:hover { transform: none; filter: none; }
}