.zntech-fg {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 1rem;
  position: relative;
  overflow: hidden;
  margin: 2rem auto;
}

/* Общие стили для изображений */
.zntech-fg-item img {
  width: 260px;
  height: auto;
  border-radius: 12px;
  box-shadow: 0 8px 20px rgba(0,0,0,0.15);
  animation: float 6s ease-in-out infinite;
  transition: all .4s ease;
}

@keyframes float {
  0%, 100% { transform: translateY(0px); }
  50% { transform: translateY(-15px); }
}

/* Противофаза — у чётных картинок */
.zntech-fg-item:nth-child(even) img {
  animation-delay: 3s;
}

/* ==============================================================
   STYLE 1 — точная копия Happy Addons с внутренним контейнером
   ============================================================== */

@keyframes ha_bounce_sm {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(8%); }
}

/* Внешний контейнер */
.zntech-fg-style-1 {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  overflow: visible;
  margin: 0 auto;
  width: 100%;
}

/* 
.zntech-fg-style-1::before {
  content: "";
  display: block;
  width: 550px;
  height: 550px;
} 
*/

.zntech-fg-style-1 .zntech-fg-inner {
  position: relative;
  width: 550px;
  min-height: 550px;
  overflow: visible;
}

/* Позиционирование картинок */
.zntech-fg-style-1 .zntech-fg-item {
  position: absolute;
  transition: transform 0.6s ease;
}
.zntech-fg-style-1 .zntech-fg-item img {
  width: 260px;
  height: auto;
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.12);
  animation: ha_bounce_sm 6s ease-in-out infinite;
  will-change: transform;
}

/* Задержки */
.zntech-fg-style-1 .zntech-fg-item:nth-child(2) img { animation-delay: 1.5s; }
.zntech-fg-style-1 .zntech-fg-item:nth-child(3) img { animation-delay: 3s; }

/* Координаты (по исходнику) */
.zntech-fg-style-1 .zntech-fg-item:nth-child(1) { top: 0; left: 35px; z-index: 2; }
.zntech-fg-style-1 .zntech-fg-item:nth-child(2) { top: 220px; left: 0; z-index: 1; }
.zntech-fg-style-1 .zntech-fg-item:nth-child(3) { top: 100px; left: 180px; z-index: 3; }

/* Hover */
.zntech-fg-style-1 .zntech-fg-item:hover img {
  transform: scale(1.04);
}

/* ---- Мобильная версия с сохранением композиции ---- */
@media (max-width: 768px) {
  .zntech-fg-style-1 {
    transform: scale(0.75);
    transform-origin: top center;
    width: 100%;
    overflow: visible;
    margin: 0 auto 1rem;
  }

  .zntech-fg-style-1 .zntech-fg-inner {
    width: 100%;
    max-width: 400px;
    min-height: 400px;
  }

  .zntech-fg-style-1 .zntech-fg-item img {
    width: 210px;
  }

  /* подправим позиции, чтобы не вылезали */
  .zntech-fg-style-1 .zntech-fg-item:nth-child(1) {
    top: 0;
    left: 25px;
  }
  .zntech-fg-style-1 .zntech-fg-item:nth-child(2) {
    top: 180px;
    left: 0;
  }
  .zntech-fg-style-1 .zntech-fg-item:nth-child(3) {
    top: 70px;
    left: 120px;
  }
}

/* ==============================================================
   STYLE 2 — в ряд
   ============================================================== */
.zntech-fg-style-2 {
  flex-direction: row;
}
.zntech-fg-style-2 .zntech-fg-item img {
  width: 200px;
}

/* ==============================================================
   STYLE 3 — ступенчато
   ============================================================== */
.zntech-fg-style-3 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.zntech-fg-style-3 .zntech-fg-item:nth-child(2) { margin-left: 3rem; }
.zntech-fg-style-3 .zntech-fg-item:nth-child(3) { margin-left: 6rem; }

/* ==============================================================
   Общая адаптивность
   ============================================================== */
@media (max-width: 768px) {
  .zntech-fg-style-2,
  .zntech-fg-style-3 {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .zntech-fg-item img {
    width: 90%;
    max-width: 280px;
  }
}

/* ==============================================================
   Без эффекта появления при загрузке
   ============================================================== */
.zntech-fg-item img {
  opacity: 1 !important;
  animation-fill-mode: both;
  backface-visibility: hidden;
  transform: translateY(0);
}