/* Новый дизайн блока тарифов (listtariff_col3_new) — страница /elektronnaya-otchetnost/otchet-fns */

.bprcnew__divider {
  height: 1px;
  margin: 0 0 64px;
  background: #d6dcf1;
}

.bprcnew__intro {
  margin: 0 0 64px;
  font-family: var(--font_inter);
  font-size: 24px;
  line-height: 1.4;
  color: #424758;
}

.bprcnew {
  box-sizing: border-box;
  width: 100%;
  max-width: 1308px;
  margin: 0 auto;
  padding: 32px 24px 64px;
  background: #4772ff;
  border-radius: 32px;
  display: flex;
  flex-direction: column;
  gap: 32px;
}

.bprcnew__title {
  margin: 0;
  font-family: var(--font_golos);
  font-weight: 600;
  font-size: 48px;
  line-height: 1.2;
  color: #fff;
}

.bprcnew__grid {
  display: flex;
  flex-wrap: nowrap;
  justify-content: safe center;
  gap: 32px;
  margin-top: -20px;
  margin-bottom: -44px;
  padding-top: 20px;
  padding-bottom: 48px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.bprcnew__grid::-webkit-scrollbar {
  display: none;
}

.bprcnew__item {
  position: relative;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  flex: 1 1 0;
  min-width: 288px;
  gap: 24px;
  max-width: 372px;
  padding: 24px;
  background: #fff;
  border-radius: 24px;
  box-shadow: 0 32px 16px rgba(0, 6, 26, 0.1);
  scroll-snap-align: start;
}

.bprcnew__top {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.bprcnew__head {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.bprcnew__name {
  margin: 0;
  font-family: var(--font_golos);
  font-weight: 600;
  font-size: 32px;
  line-height: 1.2;
  color: #00061a;
  word-wrap: break-word;
  overflow-wrap: break-word;
}
.bprcnew__name_accent {
  color: #4772ff;
}

.bprcnew__desc {
  margin: 0;
  font-family: var(--font_inter);
  font-weight: 400;
  font-size: 14px;
  line-height: 1.5;
  color: #7a8093;
}

.bprcnew__prices {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}

.bprcnew__dayone {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  background: #e9eeff;
  border-radius: 12px;
  color: #4772ff;
  white-space: nowrap;
}
.bprcnew__day {
  font-family: var(--font_golos);
  font-weight: 600;
  font-size: 32px;
  line-height: 1.2;
}
.bprcnew__perday {
  font-family: var(--font_inter);
  font-weight: 400;
  font-size: 14px;
  line-height: 1.5;
}

.bprcnew__year {
  color: #00061a;
  white-space: nowrap;
}
.bprcnew__yearval {
  font-family: var(--font_golos);
  font-weight: 500;
  font-size: 20px;
  line-height: 1.3;
}
.bprcnew__peryear {
  font-family: var(--font_inter);
  font-weight: 400;
  font-size: 14px;
  line-height: 1.5;
}

.bprcnew__free {
  font-family: var(--font_golos);
  font-weight: 600;
  font-size: 32px;
  line-height: 1.2;
  color: #1fa84f;
}

.bprcnew__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 100%;
  padding: 12px 32px;
  background: #4772ff;
  border-radius: 12px;
  font-family: var(--font_inter);
  font-weight: 500;
  font-size: 24px;
  line-height: 1.16;
  text-align: center;
  text-decoration: none;
  color: #fff;
  transition: background-color 0.3s;
}
.bprcnew__btn:hover {
  background: #3a61e0;
  color: #fff;
}

.bprcnew__featureswrap {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
}

.bprcnew__features {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.bprcnew__features li {
  display: flex;
  align-items: center;
  gap: 12px;
  font-family: var(--font_inter);
  font-weight: 400;
  font-size: 14px;
  line-height: 1.5;
  color: #424758;
}
.bprcnew__check {
  flex: none;
}

.bprcnew__features li:nth-child(n + 6) {
  display: none;
}
.bprcnew__featureswrap_open .bprcnew__features li:nth-child(n + 6) {
  display: flex;
}
.bprcnew__featureswrap_open .bprcnew__more {
  display: none;
}

.bprcnew__more {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
  font-family: var(--font_inter);
  font-weight: 500;
  font-size: 16px;
  line-height: 1.3;
  color: #4772ff;
}
.bprcnew__more svg {
  transition: transform 0.3s;
}

.bprcnew__badge {
  position: absolute;
  top: -17px;
  right: 24px;
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px 8px;
  background: #fd2c5d;
  border: 2px solid rgba(255, 255, 255, 0.75);
  border-radius: 12px;
  font-family: var(--font_inter);
  font-weight: 500;
  font-size: 14px;
  line-height: 1.5;
  color: #fff;
  white-space: nowrap;
}

/* Форма «Поможем выбрать выгодный тариф» внутри подложки */
.bprcnew__cta {
  position: relative;
  box-sizing: border-box;
  overflow: hidden;
  border-radius: 24px;
  background: #002dc0;
  padding: 24px;
}
.bprcnew__cta::before,
.bprcnew__cta::after {
  content: '';
  position: absolute;
  width: 510px;
  height: 510px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 50%;
  pointer-events: none;
}
.bprcnew__cta::before {
  left: -282px;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
.bprcnew__cta::after {
  right: -230px;
  bottom: -400px;
}
.bprcnew__cta .bctaspaced {
  position: relative;
  z-index: 1;
  padding: 0;
  min-height: 0;
  background-image: none;
  background-color: transparent;
}
.bprcnew__cta .bctaspaced__text .h2,
.bprcnew__cta .bctaspaced__text p {
  color: #fff;
}
.bprcnew__cta .bcta__form .checkbox__text,
.bprcnew__cta .bcta__form .form__checkbox,
.bprcnew__cta .bcta__form .form__agreement,
.bprcnew__cta .bcta__form label {
  color: rgba(255, 255, 255, 0.75);
}
.bprcnew__cta .bcta__form .form__wrapcheckbox,
.bprcnew__cta .bcta__form .form__wrapcheckbox .txt_tertiary {
  color: rgba(255, 255, 255, 0.75);
}
.bprcnew__cta .bcta__form .form__link1 {
  color: rgba(255, 255, 255, 0.75) !important;
  text-decoration: underline !important;
}
.bprcnew__cta .bcta__form .form__link1:hover {
  color: #fff;
}

@media (max-width: 991px) {
  .bprcnew {
    padding: 32px 24px 24px;
    border-radius: 32px;
  }
  .bprcnew__grid {
    justify-content: flex-start;
    gap: 24px;
    margin-right: -24px;
  }
  .bprcnew__grid::after {
    content: '';
    flex: 0 0 24px;
  }
  .bprcnew__item {
    flex: 0 0 288px;
    max-width: 288px;
  }
  /* цены в столбик, как в макете */
  .bprcnew__prices {
    flex-direction: column;
    align-items: flex-start;
  }
}

@media (max-width: 600px) {
  .bprcnew {
    padding: 32px 16px 24px;
  }
  .bprcnew__title {
    font-size: 28px;
  }
  .bprcnew__intro {
    font-size: 18px;
    margin-bottom: 40px;
  }
  .bprcnew__divider {
    margin-bottom: 40px;
  }
  .bprcnew__grid {
    gap: 16px;
    margin-right: -16px;
  }
  .bprcnew__grid::after {
    flex: 0 0 16px;
  }
  .bprcnew__item {
    flex: 0 0 212px;
    min-width: 0;
    max-width: 212px;
    padding: 24px 16px;
  }
  /* CTA — компактнее, как в мобильном макете */
  .bprcnew__cta {
    border-radius: 12px;
    padding: 24px 16px;
  }
  .bprcnew__cta .bctaspaced__text .h2 {
    font-size: 24px;
  }
}

/* --- Правки по замечаниям --- */

/* блок тарифов шире остальных блоков страницы */
.bprcnew {
  margin-left: -64px;
  margin-right: -64px;
}

/* текст внутри кнопок — по центру по вертикали */
.bprcnew__btn,
.bprcnew__cta .button,
.bprcnew__cta .form__button {
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1.2;
}

/* бейдж «Популярный» — центрирование текста */
.bprcnew__badge {
  line-height: 1.2;
}

/* CTA «Поможем выбрать…» крупнее */
.bprcnew__cta {
  padding: 32px;
}
.bprcnew__cta .bctaspaced__text .h2 {
  font-size: 32px;
}

@media (max-width: 991px) {
  .bprcnew {
    margin-left: -24px;
    margin-right: -24px;
  }
}

@media (max-width: 600px) {
  .bprcnew {
    margin-left: -16px;
    margin-right: -16px;
  }
  .bprcnew__name {
    font-size: 24px;
  }
  .bprcnew__cta {
    padding: 24px 16px;
  }
}

/* --- Панель тарифов на уровне контейнера --- */
.bprcnew {
  width: auto;
  max-width: none;
  margin-left: calc(-1 * var(--indent_xs));
  margin-right: calc(-1 * var(--indent_xs));
  -webkit-transform: none;
          transform: none;
}

@media (min-width: 576px) {
  .bprcnew {
    margin-left: calc(-1 * var(--indent_sm));
    margin-right: calc(-1 * var(--indent_sm));
  }
}

@media (min-width: 992px) {
  .bprcnew {
    margin-left: calc(-1 * var(--indent_lg));
    margin-right: calc(-1 * var(--indent_lg));
  }
}

/* --- Панель тарифов и CTA — в границах контейнера (не шире) --- */
.bprcnew {
  width: auto;
  max-width: none;
  margin-left: 0;
  margin-right: 0;
  -webkit-transform: none;
          transform: none;
}
.bprcnew__cta {
  width: 100%;
  max-width: 100%;
}

/* --- Панель шире контейнера, содержимое — по ширине контейнера --- */
.bprcnew {
  box-sizing: border-box;
  width: calc(100% + 2 * var(--indent_xs));
  max-width: 100vw;
  margin-left: 50%;
  margin-right: 0;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  padding-left: calc(2 * var(--indent_xs));
  padding-right: calc(2 * var(--indent_xs));
}

@media (min-width: 576px) {
  .bprcnew {
    width: calc(100% + 2 * var(--indent_sm));
    padding-left: calc(2 * var(--indent_sm));
    padding-right: calc(2 * var(--indent_sm));
  }
}

@media (min-width: 992px) {
  .bprcnew {
    width: calc(100% + 2 * var(--indent_lg));
    padding-left: calc(2 * var(--indent_lg));
    padding-right: calc(2 * var(--indent_lg));
  }
}

/* --- Правка: внутренний отступ панели = 1x отступ контейнера (контент по ширине контейнера) --- */
.bprcnew {
  padding-left: var(--indent_xs);
  padding-right: var(--indent_xs);
}

@media (min-width: 576px) {
  .bprcnew {
    padding-left: var(--indent_sm);
    padding-right: var(--indent_sm);
  }
}

@media (min-width: 992px) {
  .bprcnew {
    padding-left: var(--indent_lg);
    padding-right: var(--indent_lg);
  }
}

/* --- Планшет/мобайл: 8px от краёв экрана --- */
@media (max-width: 1300px) {
  .bprcnew {
    max-width: calc(100vw - 16px);
  }
}