/* =========================================
   СТИЛИ ДЛЯ ВИДЖЕТА ПРЕИМУЩЕСТВ (FEATURES)
   ========================================= */

.adev-features-grid {
  display: grid;
  /* grid-template-columns и gap внедряются динамически из Elementor */
  align-items: start;
  width: 100%;
}

/* Базовый контейнер карточки */
.adev-feature-item {
  display: flex;
  width: 100%;
  box-sizing: border-box;
}

.adev-feature-icon {
  flex-shrink: 0; /* Чтобы иконка не сжималась, если текста много */
  display: flex;
  align-items: center;
  justify-content: center;
}

.adev-feature-icon img {
  height: auto;
  display: block;
  object-fit: contain;
}

.adev-feature-content {
  flex-grow: 1;
}

.adev-feature-title {
  margin: 0;
  color: var(--ast-global-color-2, #111111);
  font-weight: 500;
}

.adev-feature-desc {
  margin: 0;
  color: var(--ast-global-color-3, #666666);
  line-height: 1.5;
}

/* =========================================
   ЛОГИКА ПОЗИЦИОНИРОВАНИЯ ИКОНКИ
   ========================================= */

/* 1. Иконка сверху (По умолчанию) */
.adev-fpos-top .adev-feature-item {
  flex-direction: column;
}

/* Выравнивание flex-элементов (иконки) в зависимости от text-align Elementor */
.adev-fpos-top .adev-feature-item[style*="text-align: center;"] {
  align-items: center;
}
.adev-fpos-top .adev-feature-item[style*="text-align: right;"] {
  align-items: flex-end;
}
.adev-fpos-top .adev-feature-item[style*="text-align: left;"] {
  align-items: flex-start;
}

/* 2. Иконка слева */
.adev-fpos-left .adev-feature-item {
  flex-direction: row;
  align-items: flex-start;
}

/* 3. Иконка справа */
.adev-fpos-right .adev-feature-item {
  flex-direction: row-reverse;
  align-items: flex-start;
}

/* Для мобильных устройств часто удобнее сбрасывать иконку наверх,
   если она была сбоку, но Elementor позволяет настроить размер и отступы
   отдельно, поэтому оставляем гибкость пользователю */