/*=================
  IMAGE GALLERY
=================*/

.image-gallery {
  padding: var(--space-7) 0px;
}

.image-gallery img {
  height: 550px;
  object-fit: cover;
}

.image-gallery .bottom-section {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: var(--space-5);
}

.image-gallery .carousel-navigation {
  display: flex;
  gap: var(--space-1);
}
.image-gallery .carousel-navigation .swiper-prev,
.image-gallery .carousel-navigation .swiper-next {
  padding: 0px 12px 4px;
  border: 2px solid var(--color-p);
  transition: .15s;
}
.image-gallery .carousel-navigation .swiper-prev:hover,
.image-gallery .carousel-navigation .swiper-next:hover {
  background: var(--color-p)
}
.image-gallery .carousel-navigation .swiper-prev svg {
  rotate: 180deg;
}
.image-gallery .carousel-navigation svg {
  width: 24px;
}

@media (prefers-color-scheme: dark) {
  .image-gallery .carousel-navigation svg path {
    stroke: var(--color-n-white);
  }
}

@media only screen and (max-width: 992px) {
  .image-gallery {
    padding: var(--space-6) 0px;
  }
  .image-gallery img {
    height: 450px;
  }
}

@media only screen and (max-width: 768px) {
  .image-gallery img {
    height: 350px;
  }
  .image-gallery .swiper-slide .content svg path {
    stroke-width: 1px;
  }
  .image-gallery .carousel-navigation .swiper-prev,
  .image-gallery .carousel-navigation .swiper-next {
    padding: 3px 10px 5px;
    border: 1px solid var(--color-p);
  }
  .image-gallery .carousel-navigation .swiper-prev svg path,
  .image-gallery .carousel-navigation .swiper-next svg path {
    stroke-width: 1px;
  }
}

@media only screen and (max-width: 578px) {
  .image-gallery img {
    height: 250px;
  }
  .image-gallery .bottom-section {
    margin-top: var(--space-4);
  }
}