.pager {
  font-family: var(--main-font);
}
@media screen and (min-width: 576px) {
  .pager {
    margin-top: 40px;
  }
}
@media screen and (max-width: 575.98px) {
  .pager {
    margin-top: 20px;
  }
}
.pager .pager__items {
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 10px;
}
.pager .pager__items .pager__item {
  padding: 0;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
}
.pager .pager__items .pager__item.pagerer-breaker {
  color: var(--rose);
  font-size: 16px;
  font-weight: 600;
}
.pager .pager__items .pager__item a {
  color: var(--rose);
  font-size: 16px;
  font-weight: 600;
  text-decoration: none;
  border: 2px solid var(--rose);
  display: flex;
  justify-content: center;
  align-items: center;
  width: 35px;
  height: auto;
  aspect-ratio: 1/1;
  border-radius: 50%;
}
.pager .pager__items .pager__item.pager__item--last, .pager .pager__items .pager__item.pager__item--first {
  /*        a {
            aspect-ratio  : unset;
            width         : max-content;
            border-radius : 999px;
            padding       : 11px 15px;
          }*/
}
@media screen and (max-width: 575.98px) {
  .pager .pager__items .pager__item.pager__item--last, .pager .pager__items .pager__item.pager__item--first {
    display: none;
  }
}
.pager .pager__items .pager__item.is-active a, .pager .pager__items .pager__item:hover a {
  color: #fff;
  background: var(--rose);
}