.project-content__item img {
  width: 100%;
  height: auto;
  opacity: 0;
  will-change: opacity, transform;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  image-rendering: -webkit-optimize-contrast;
  image-rendering: crisp-edges;
}

.project-content__item img.lazy {
  opacity: 0;
  transform: scale(0.95) translateY(20px);
  -webkit-transform: scale(0.95) translateY(20px);
}

.project-content__item img.fade-in {
  opacity: 1;
  transform: scale(1) translateY(0);
  -webkit-transform: scale(1) translateY(0);
  transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);
  -webkit-transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Базовые стили для всех изображений */
.project-content__item {
  width: 100%;
  position: relative;
  will-change: transform;
}

.project-content__item ul {
  list-style: disc;
  padding-left: 17px;
}

.project-content__item ul li {
  margin-bottom: 7px;
}




.project-content__item a {
  display: inline;
  color: var(--green);
}

.project-content__item img {
  border-radius: 40px;
  overflow: hidden;
}

/* Удаляем фиксированное соотношение сторон */
.project-content__item::before {
  content: none;
}

/* Прелоадер */
.project-content__item::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  width: max(80px, calc(80 / var(--gfs) * 100vw));
  height: max(80px, calc(80 / var(--gfs) * 100vw));
  background-image: url('../images/icons/logo.svg');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  opacity: 0.7;
  transition: opacity 0.4s ease-out;
  animation: fly_logo 2s linear infinite;
}

@keyframes fly_logo {
  0% {
    transform: translateY(-10px) scale(0.9);
  }

  50% {
    transform: translateY(10px) scale(1);
  }

  100% {
    transform: translateY(-10px) scale(0.9);
  }
}

/* Базовые стили для изображений */
.project-content__item img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  image-rendering: -webkit-optimize-contrast;
  image-rendering: crisp-edges;
}

/* Стили для вертикальных изображений */
.project-content__item.vertical {
  width: 100%;
}

.project-content__item.vertical img {
  width: 100%;
  height: auto;
}

/* Плавно скрываем прелоадер когда изображение загружено */
.project-content__item.loading-complete::after {
  opacity: 0;
}

/* Стили для кнопки прокрутки вверх */
.project-scroll-top {
  position: fixed;
  right: max(30px, calc(30 / var(--gfs) * 100vw));
  bottom: max(30px, calc(30 / var(--gfs) * 100vw));
  cursor: pointer;
  z-index: 100;
  padding: max(15px, calc(15 / var(--gfs) * 100vw));
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(10px);
  border-radius: 50%;
  will-change: transform, opacity;
}

.project-scroll-top img {
  width: max(24px, calc(24 / var(--gfs) * 100vw));
  height: max(24px, calc(24 / var(--gfs) * 100vw));
  transition: transform 0.3s ease;
}

.project-scroll-top:hover img {
  transform: translateY(-3px);
}

/* Медиа-запросы для адаптивности */
@media (max-width: 768px) {

  .project-content__item {
    border-radius: 20px;
  }

  .project-content__item img {
    border-radius: 20px;
  }

  .project-content__item.vertical {
    max-height: 80vh;
  }

  .project-content__item.vertical img {
    max-height: 80vh;
  }

  .project-content__item::after {
    width: max(40px, calc(40 / var(--gfs) * 100vw));
    height: max(40px, calc(40 / var(--gfs) * 100vw));
  }
}

@media (max-width: 480px) {
  .project-content__item.vertical {
    max-height: 70vh;
  }

  .project-content__item.vertical img {
    max-height: 70vh;
  }
}

/* Ensure content wrapper takes full height */
/* .project-block {
  min-height: calc(100vh - max(160px, calc(160 / var(--gfs) * 100vw)));
  width: 100%;
  position: relative;
  will-change: transform;
} */

/* GLightbox customization */
#glightbox-body {
  z-index: 99999999999999 !important;
}

.glightbox-clean .gclose, .glightbox-clean .gnext, .glightbox-clean .gprev {
  background-color: var(--green) !important;
  border-radius: 50% !important;
  width: max(30px, calc(30 / var(--gfs) * 100vw)) !important;
  height: max(30px, calc(30 / var(--gfs) * 100vw)) !important;
}

.gclose svg, .gnext svg, .gprev svg {
  width: max(12px, calc(12 / var(--gfs) * 100vw)) !important;
  margin-left: 2px;
}

.gclose svg path, .gnext svg path, .gprev svg path {
  fill: var(--black) !important;
}

.goverlay {
  background: rgba(0, 0, 0, .3) !important;
  backdrop-filter: blur(10px) !important;
}

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  .project-content__item img {
    image-rendering: auto;
  }
}