.loader {
  grid-column: 1 / -1;
  margin: 50px auto;
  display: block;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  position: relative;
  animation: flash 0.3s ease-in infinite alternate;
}
.loader::before,
.loader::after {
  content: '';
  position: absolute;
  left: -64px;
  top: 0;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  transform-origin: 35px -35px;
  transform: rotate(45deg);
  animation: hitL 0.3s ease-in infinite alternate;
}

.loader::after {
  left: 64px;
  transform: rotate(-45deg);
  transform-origin: -35px -35px;
  animation: hitR 0.3s ease-out infinite alternate;
}

@keyframes flash {
  0%,
  100% {
    background-color: rgba(43, 0, 100, 0.25);
    box-shadow: 32px 0 rgba(43, 0, 100, 0.25), -32px 0 rgba(43, 0, 100, 0.25);
  }
  25% {
    background-color: rgba(43, 0, 100, 0.25);
    box-shadow: 32px 0 rgba(43, 0, 100, 0.25), -32px 0 rgb(43, 0, 97);
  }
  50% {
    background-color: rgb(43, 0, 97);
    box-shadow: 32px 0 rgba(43, 0, 100, 0.25), -32px 0 rgba(43, 0, 100, 0.25);
  }
  75% {
    background-color: rgba(43, 0, 100, 0.25);
    box-shadow: 32px 0 rgb(43, 0, 97), -32px 0 rgba(43, 0, 100, 0.25);
  }
}

@keyframes hitL {
  0% {
    transform: rotate(45deg);
    background-color: rgb(43, 0, 100);
  }
  25%,
  100% {
    transform: rotate(0deg);
    background-color: rgba(43, 0, 100, 0.25);
  }
}

@keyframes hitR {
  0%,
  75% {
    transform: rotate(0deg);
    background-color: rgba(43, 0, 100, 0.25);
  }
  100% {
    transform: rotate(-45deg);
    background-color: rgb(3, 0, 100);
  }
}

.tovarka li > img {
  width: 100%;
  height: auto;
  min-width: 255px;
  min-height: 255px;
}

.tovarka__wrap {
  justify-content: center;
  display: grid;
  grid-template-columns: repeat(4, 255px);
  gap: 30px;
}
.tovars__slider {
  position: relative;
  display: grid;
  /* max-width: 990px; */
  overflow: visible;
}
.tovar__btn {
  border: 1px solid #262626;
  box-shadow: unset;
  color: inherit;
  margin: auto;
}
.tovar__btn:hover {
  color: #2d5dd8;
  border-color: #2d5dd8;
  box-shadow: unset;
}

.splide__track {
  /* overflow: visible; */
  width: 100%;
  left: 0;
  top: 0;
}

.splide__track {
  cursor: pointer;
}

.tovar {
  border-radius: 10px;
  position: relative;
  overflow: hidden;
}
.splide__pagination {
  position: absolute;
  bottom: -19px;
  left: 0;
  right: 0;
  margin: auto;
  display: flex;
  gap: 5px;
  max-height: 20px;
}
.splide__pagination__page {
  width: 8px;
  height: 8px;
  background-color: rgba(44, 44, 44, 0.40);
  transition: 0.3s;
  border-radius: 50%;
  border: none;
  outline: none;
  cursor: pointer;
}
.splide__pagination__page.is-active {
  width: 10px;
  height: 10px;
  background: #2C2C2C;
}
.tovar__info {
  display: grid;
  grid-template-columns: auto max-content;
  align-items: start;
  margin: 7px 0;
  width: 100%;
  margin-top: 24px;
}
.splide__pagination li {
  display: inline-block;
  line-height: 0;
  list-style-type: none;
  margin: 0;
  pointer-events: auto;
  display: flex;
}
.tovar__about_icon {
  grid-column: 2/3;
  grid-row: 1/3;
  width: 20px;
  height: 20px;
  cursor: pointer;
}
.tovar_title {
  font-weight: 400;
  font-size: 16px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  color: #2C2C2C;
}
.tovar__bottom {
  display: grid;
  grid-template-columns: min-content 1fr;
  align-items: center;
  justify-items: flex-end;
  gap: 17px;
  color: #2C2C2C;
}
.tovar_new_price {
  font-weight: 300;
  font-size: 18px;
}
.tovar_button {
  border-radius: 4px;
  font-size: 14px;
  font-weight: 500;
  border: none;
  transition: 0.3s;
  cursor: pointer;
  width: 100%;
  max-width: 180px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.btn_green {
  color: #fff;
  background: #30ca47;
}

.btn_green:hover {
  background: #1fa934;
  box-shadow: 0 0 12px rgba(123, 226, 87, 0.8),
    0 12px 20px rgba(23, 72, 52, 0.15);
}

.desc__wrap {
  /* background: url('https://cloud.devtome.top/domains/prize-me.com/homepage-2024-11/background.png')
    center / cover; */
  background: url(https://cloud.devtome.top/domains/prize-me.com/homepage-2025-05/popup_bg.png) no-repeat center / cover;
  background-color: #2B0064;
  padding: 50px;
  border-radius: 10px;
  width: MIN(100vw, 690px);
  font-size: 16px;
  overflow: hidden;
  position: relative;
  z-index: 0;
  margin: 20px 0;
}
/* .desc__wrap::before {
  content: '';
  position: absolute;
  z-index: -1;
  bottom: 0;
  right: 0;
  background-color: #ffe920;
  filter: blur(120px);
  width: 200px;
  height: 200px;
  border-radius: 50%;
  transform: translate(20%, 20%);
} */
.desc__text_wrap {
  display: grid;
  gap: 20px;
}
.desc__title {
  font-size: 24px;
  margin-bottom: 0;
}
.desc__item {
  display: grid;
  gap: 10px;
}
.desc__descSlide_title {
  font-weight: 700;
}
.desc__tovar_btn {
  border: none;
  outline: none;
  padding: 10px 50px;
  font-size: 18px;
  font-weight: 500;
  transition: 0.3s;
  border-radius: 4px;
  margin: 0 auto;
  display: block;
  cursor: pointer;
}

@media (max-width: 1199px) {
  .tovarka__wrap {
    grid-template-columns: repeat(3, 255px);
  }
}
@media (max-width: 991px) {
  .tovarka__wrap {
    grid-template-columns: repeat(2, 255px);
  }
}
@media (max-width: 767px) {
  .tovarka__wrap {
    grid-template-columns: repeat(1, 330px);
    gap: 20px 10px;
  }
    .tovar__info {
    margin: 7px 0;
    gap: 0 10px;
    grid-template-columns: auto 20px;
    margin-top: 13px;
  }
  .splide__pagination__page {
    width: 5px;
    height: 5px;
  }
  .splide__pagination__page.is-active {
    width: 7px;
    height: 7px;
  }
  .splide__pagination {
    bottom: -11px;
    gap: 3px;
  }
  .splide__pagination li {
    display: flex;
  }
  .tovar_title {
    font-size: 16px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
  }
  .tovar_new_price {
    font-size: 16px;
  }
  .desc__wrap {
    border-radius: 0;
    padding: 60px 10px;
    margin: 0;
    min-height: 100vh;
    font-size: 14px;
  }
  .desc__title {
    font-size: 20px;
  }
  .desc__text_wrap {
    gap: 15px;
  }
}

@media (max-width: 350px) {
  .tovarka__wrap {
      grid-template-columns: 1fr;
      gap: 15px 15px;
  }
  .tovar__bottom {
    justify-content: unset;
  }
  .tovar_button {
    padding: 6px 56px;
  }
  .tovar__info {
    grid-template-columns: auto 20px;
  }
}