.packages {
  position: relative;
  overflow: hidden;
  background: var(--grey-100) 50%/cover no-repeat;
  padding: 85px 0 90px;
}

.packages__title {
  margin-bottom: 45px;
}

.packages:not(.bg_none) .packages__title {
  color: var(--white);
}

.packages__container {
  position: relative;
  z-index: 1;
}

.packages__items {
  overflow: hidden;
  margin-right: -23vw;
}

.packages__item {
  border-radius: 5px;
  background: var(--white);
  padding: 20px;
}

.packages__item_title {
  color: var(--secondary);
  font-size: var(--h3);
  text-transform: uppercase;
  margin-bottom: 20px;
}

.packages__item_image {
  text-align: center;
  min-height: 205px;
  margin-bottom: 20px;
}

.packages__item_image img {
  max-height: 200px;
}

.packages__item_text {
  font-size: var(--s);
  line-height: 157.143%;
  height: 66px;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  margin-bottom: 20px;
}

.packages__item_complete {
  margin-bottom: 25px;
}

.packages__item_complete .complete_title {
  color: var(--secondary);
  font-size: var(--m);
  font-weight: 700;
  margin-bottom: 15px;
}

.packages__item_complete ul li {
  display: flex;
  justify-content: space-between;
  margin-bottom: 10px;
  font-weight: 600;
  font-size: var(--s);
  line-height: 157.143%;
}

.packages__item_complete ul li:first-child {
  min-height: 44px;
}

.packages__item_complete ul li span:first-child {
  color: #AFAFAF;
  width: 30%;
}

.packages__item_complete ul li span:last-child {
  text-align: right;
  width: 65%;
}

.packages__item_rating {
  margin-bottom: 20px;
}

.packages__item_rating li {
  display: flex;
  justify-content: space-between;
  padding-left: 21px;
  margin-bottom: 10px;
  font-weight: 600;
  font-size: var(--s);
  line-height: 157.143%;
}

.packages__item_rating li.energo {
  background: no-repeat 0 50% url(../../img/energo.svg);
}

.packages__item_rating li.sun {
  background: no-repeat 0 50% url(../../img/sun.svg);
}

.packages__item_rating li.save {
  background: no-repeat 0 50% url(../../img/save.svg);
}

.packages__item_rating li.noise {
  background: no-repeat 0 50% url(../../img/noise.svg);
}

.packages__item_rating .stars {
  display: flex;
  gap: 5px;
}

.packages__item_rating .star {
  font-size: 0;
  background: url(../../img/star.svg);
  width: 16px;
  height: 16px;
}

.packages__item_rating .star-full {
  font-size: 0;
  background: url(../../img/star_full.svg);
  width: 16px;
  height: 16px;
}

.packages__item_application {
  margin-bottom: 25px;
}

.packages__item_application_title {
  color: var(--secondary);
  font-size: var(--m);
  font-weight: 700;
  margin-bottom: 5px;
}

.packages__item_button .btn-main {
  margin: 0 auto;
  max-width: 100%;
}

.packages .swiper-action {
  margin-left: 45%;
}

.packages .swiper-action .swiper-indicator {
  color: var(--grey-300);
}

.packages .swiper-action .swiper-indicator span {
  color: var(--white);
}

.packages.bg_none .swiper-indicator {
  color: var(--grey-400);
}

.packages.bg_none .swiper-indicator span {
  color: var(--secondary);
}

.packages_slider_prev {
  position: static;
  top: auto;
  transform: none;
}

.packages_slider_next {
  position: static;
  top: auto;
  transform: none;
}

.packages .swiper-button-prev {
  background: rgba(255, 255, 255, 0.9) 50% no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M7.49981 12L14.9998 19.5L16.0498 18.45L9.5998 12L16.0498 5.55L14.9998 4.5L7.49981 12Z' fill='%23333'/%3E%3C/svg%3E");
}

.packages .swiper-button-next {
  background: rgba(255, 255, 255, 0.9) 50% no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M16.5 12L9 4.5L7.95 5.55L14.4 12L7.95 18.45L9 19.5L16.5 12Z' fill='%23333'/%3E%3C/svg%3E");
}

.packages::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  display: block;
  background: rgba(255, 255, 255, 0.3);
  -webkit-backdrop-filter: blur(25px);
  backdrop-filter: blur(25px);
}

@media (max-width: 760px) {
  .packages {
    padding: 40px 0;
  }

  .packages__title {
    margin: 0 0 23px;
  }

  .packages__items {
    margin-right: 0;
  }

  .packages__item_text {
    height: 57px;
  }

  .packages__item_button,
  .packages__item_readmore {
    width: 100%;
  }

  .packages .swiper-action {
    margin: 25px 0 0;
  }
}