@charset "UTF-8";
.btn {
  border: clamp(1px, .27777vw, .27777vw) solid rgb(var(--color-primary));
  background: rgb(var(--color-primary));
  color: rgb(var(--color-text-white));
  fill: rgb(var(--color-text-white));
  stroke: rgb(var(--color-text-white));
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 2.77777vw;
  border-radius: 3.33333vw;
  text-decoration: none;
  font-size: 3.88888vw;
  font-weight: 500;
  padding: 3.05555vw 3.88888vw;
  min-height: 13.33333vw;
}
@media (min-width: 1200px) {
  .btn {
    border-width: 1px;
    gap: 10px;
    border-radius: 12px;
    font-size: 14px;
    padding: 11px 14px;
    min-height: 48px;
  }
}
.btn__icon {
  width: 6.66666vw;
  aspect-ratio: 1;
}
@media (min-width: 1200px) {
  .btn__icon {
    width: 24px;
  }
}
.btn:hover {
  background: #3D8CE7;
  border-color: #3D8CE7;
}
.btn:active {
  background: #003C80;
  border-color: #003C80;
}
.btn--disabled, .btn[disabled] {
  opacity: 0.2;
  cursor: default;
  pointer-events: none;
}
.btn:has(> .btn__icon):not(:has(> :not(.btn__icon))) {
  padding: 3.05555vw;
}
@media (min-width: 1200px) {
  .btn:has(> .btn__icon):not(:has(> :not(.btn__icon))) {
    padding: 11px;
  }
}
.btn--secondary {
  background: rgb(var(--color-L-green));
  border-color: rgb(var(--color-L-green));
}
.btn--secondary:hover {
  background: #00A719;
  border-color: #00A719;
}
.btn--secondary:active {
  background: #007F00;
  border-color: #007F00;
}
.btn--grey {
  background: rgb(var(--color-bg-gray));
  border-color: rgb(var(--color-bg-gray));
  color: rgb(var(--color-text-black));
  fill: rgb(var(--color-text-black));
  stroke: rgb(var(--color-text-black));
}
.btn--grey:hover, .btn--grey:active {
  background: rgb(var(--color-bg-gray));
  border-color: rgb(var(--color-bg-gray));
  color: rgb(var(--color-text-black));
  fill: rgb(var(--color-text-black));
  stroke: rgb(var(--color-text-black));
}
.btn--str {
  background: transparent;
  color: rgb(var(--color-primary));
  fill: rgb(var(--color-primary));
  stroke: rgb(var(--color-primary));
}
.btn--str:hover {
  background: transparent;
  color: #3D8CE7;
  fill: #3D8CE7;
  stroke: #3D8CE7;
}
.btn--str:active {
  background: transparent;
  color: #003C80;
  fill: #003C80;
  stroke: #003C80;
}
.btn--str-secondary {
  border-color: rgb(var(--color-accident));
  color: rgb(var(--color-accident));
  fill: rgb(var(--color-accident));
  stroke: rgb(var(--color-accident));
  background: transparent;
}
.btn--str-secondary:hover {
  color: #00A719;
  fill: #00A719;
  stroke: #00A719;
  border-color: #00A719;
  background: transparent;
}
.btn--str-secondary:active {
  color: #007F00;
  fill: #007F00;
  stroke: #007F00;
  border-color: #007F00;
  background: transparent;
}
.btn--str-white {
  border-color: rgb(var(--color-white));
  color: rgb(var(--color-white));
  fill: rgb(var(--color-white));
  stroke: rgb(var(--color-white));
  background: transparent;
}
.btn--str-white:hover {
  background: transparent;
  color: rgb(var(--color-black));
  fill: rgb(var(--color-black));
  stroke: rgb(var(--color-black));
  border-color: rgb(var(--color-black));
}
.btn--str-white:active {
  background: rgb(var(--color-black));
  border-color: rgb(var(--color-black));
  color: rgb(var(--color-white));
  fill: rgb(var(--color-white));
  stroke: rgb(var(--color-white));
}
.btn--str-grey {
  border-color: rgb(var(--color-gray));
  color: rgb(var(--color-gray));
  fill: rgb(var(--color-gray));
  stroke: rgb(var(--color-gray));
  background: transparent;
}
.btn--str-grey:hover {
  background: transparent;
  color: rgb(var(--color-black));
  fill: rgb(var(--color-black));
  stroke: rgb(var(--color-black));
  border-color: rgb(var(--color-black));
}
.btn--str-grey:active {
  background: rgb(var(--color-black));
  border-color: rgb(var(--color-black));
  color: rgb(var(--color-white));
  fill: rgb(var(--color-white));
  stroke: rgb(var(--color-white));
}
.btn--str-light-grey {
  border-color: #D7D7D7;
  background: transparent;
  color: rgb(var(--color-primary));
  fill: rgb(var(--color-primary));
  stroke: rgb(var(--color-primary));
}
.btn--str-light-grey:hover {
  border-color: #EBEBEB;
  color: #3D8CE7;
  fill: #3D8CE7;
  stroke: #3D8CE7;
  background: transparent;
}
.btn--str-light-grey:active {
  border-color: #E1E1E1;
  background: transparent;
  color: #003C80;
  fill: #003C80;
  stroke: #003C80;
}
.btn--link {
  color: rgb(var(--color-primary));
  fill: rgb(var(--color-primary));
  stroke: rgb(var(--color-primary));
  background: transparent;
  border-color: transparent;
}
.btn--link:hover {
  background: transparent;
  border-color: transparent;
  color: #3D8CE7;
  fill: #3D8CE7;
  stroke: #3D8CE7;
}
.btn--link:active {
  background: transparent;
  border-color: transparent;
  color: #003C80;
  fill: #003C80;
  stroke: #003C80;
}
.btn--link-black {
  background: transparent;
  border-color: transparent;
  color: rgb(var(--color-black));
  fill: rgb(var(--color-black));
  stroke: rgb(var(--color-black));
}
.btn--link-black:hover {
  background: transparent;
  border-color: transparent;
  color: rgb(var(--color-black));
  fill: rgb(var(--color-black));
  stroke: rgb(var(--color-black));
}
.btn--link-black:active {
  background: transparent;
  border-color: transparent;
  color: #0A0A0A;
  fill: #0A0A0A;
  stroke: #0A0A0A;
}
.btn--small {
  min-height: 10vw;
  padding: 1.94444vw 3.88888vw;
  border-radius: 2.22222vw;
}
@media (min-width: 1200px) {
  .btn--small {
    min-height: 36px;
    padding: 7px 14px;
    border-radius: 8px;
  }
}
.btn--small .btn__icon {
  width: 5vw;
}
@media (min-width: 1200px) {
  .btn--small .btn__icon {
    width: 18px;
  }
}
.btn--small:has(> .btn__icon):not(:has(> :not(.btn__icon))) {
  padding: 2.22222vw;
}
@media (min-width: 1200px) {
  .btn--small:has(> .btn__icon):not(:has(> :not(.btn__icon))) {
    padding: 8px;
  }
}
.btn--full-width {
  width: 100%;
}

.checkbox {
  display: inline-flex;
  align-items: flex-start;
  position: relative;
  gap: 2.22222vw;
  font-size: 4.44444vw;
  cursor: pointer;
}
@media (min-width: 1200px) {
  .checkbox {
    gap: 8px;
    font-size: 16px;
  }
}
.checkbox--outline {
  padding: 3.05555vw;
  min-height: 13.33333vw;
  border-radius: 3.33333vw;
  border: clamp(1px, .27777vw, .27777vw) solid rgb(var(--color-line-super-light-blue));
  align-items: center;
}
@media (min-width: 1200px) {
  .checkbox--outline {
    padding: 11px;
    min-height: 48px;
    border-radius: 12px;
    border-width: 1px;
  }
}
.checkbox:has([disabled]) {
  opacity: 0.2;
  cursor: default;
  pointer-events: none;
}
.checkbox:hover .checkbox__custom {
  border-color: rgb(var(--color-primary));
}
.checkbox__input {
  position: absolute;
  top: 0;
  left: 0;
  width: 0;
  height: 0;
  opacity: 0;
  visibility: hidden;
  overflow: hidden;
}
.checkbox__input[type=radio] + .checkbox__custom {
  border-radius: 50%;
}
.checkbox__input[type=radio] + .checkbox__custom::before {
  background: rgb(var(--color-primary));
  top: clamp(2px, .55555vw, .55555vw);
  left: clamp(2px, .55555vw, .55555vw);
  width: calc(100% - 1.11111vw);
  height: calc(100% - 1.11111vw);
}
@media (min-width: 1200px) {
  .checkbox__input[type=radio] + .checkbox__custom::before {
    top: 2px;
    left: 2px;
    width: calc(100% - 4px);
    height: calc(100% - 4px);
  }
}
.checkbox__input:checked + .checkbox__custom::before {
  opacity: 1;
  visibility: visible;
}
.checkbox__custom {
  width: 5.27777vw;
  aspect-ratio: 1;
  border: clamp(1px, .27777vw, .27777vw) solid rgb(var(--color-line-super-light-blue));
  border-radius: 1.38888vw;
  flex-shrink: 0;
  position: relative;
  transition: 0.3s;
}
@media (min-width: 1200px) {
  .checkbox__custom {
    width: 19px;
    border-width: 1px;
    border-radius: 5px;
  }
}
.checkbox__custom::before {
  content: "";
  position: absolute;
  top: clamp(-.27777vw, -.27777vw, -1px);
  left: clamp(-.27777vw, -.27777vw, -1px);
  width: calc(100% + .55555vw);
  height: calc(100% + .55555vw);
  border-radius: inherit;
  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 13 13' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10.8809 3.14927C11.0395 3.30793 11.0395 3.56516 10.8808 3.7238L5.13511 9.46898C4.97646 9.62762 4.71924 9.62761 4.5606 9.46896L1.87949 6.78785C1.72084 6.6292 1.72084 6.37198 1.87949 6.21333C2.03814 6.05468 2.29536 6.05468 2.45401 6.21333L4.84787 8.60719L10.3063 3.14925C10.465 2.9906 10.7222 2.99062 10.8809 3.14927Z' fill='white'/%3E%3C/svg%3E") no-repeat center/3.61111vw 3.61111vw rgb(var(--color-primary));
  transition: 0.3s;
  opacity: 0;
  visibility: hidden;
}
@media (min-width: 1200px) {
  .checkbox__custom::before {
    top: -1px;
    left: -1px;
    width: calc(100% + 2px);
    height: calc(100% + 2px);
    background-size: 13px 13px;
  }
}
.checkbox__counter {
  color: rgb(var(--color-gray));
}

.range-slider {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-wrap: wrap;
  column-gap: 1.1111vw;
  row-gap: 5.5556vw;
}
@media (min-width: 1200px) {
  .range-slider {
    column-gap: 4px;
    row-gap: 20px;
  }
}
.range-slider__input {
  width: calc(50% - 0.5556vw) !important;
}
@media (min-width: 1200px) {
  .range-slider__input {
    width: calc(50% - 2px) !important;
  }
}
.range-slider__control {
  position: relative;
  width: 100%;
  height: 2.2222vw;
}
@media (min-width: 1200px) {
  .range-slider__control {
    height: 8px;
  }
}
.range-slider__slider {
  position: absolute;
  width: 100%;
  height: 100%;
  background: none;
  outline: none;
  appearance: none;
  pointer-events: none;
  z-index: 5;
}
.range-slider__slider::-webkit-slider-thumb {
  appearance: none;
  height: 4.4444vw;
  width: 4.4444vw;
  border-radius: 50%;
  background: rgb(var(--color-primary));
  cursor: pointer;
  pointer-events: all;
  z-index: 5;
}
@media (min-width: 1200px) {
  .range-slider__slider::-webkit-slider-thumb {
    height: 16px;
    width: 16px;
  }
}
.range-slider__slider::-moz-range-thumb {
  height: 4.4444vw;
  width: 4.4444vw;
  border-radius: 50%;
  background: rgb(var(--color-primary));
  cursor: pointer;
  pointer-events: all;
  z-index: 5;
}
@media (min-width: 1200px) {
  .range-slider__slider::-moz-range-thumb {
    height: 16px;
    width: 16px;
  }
}
.range-slider__track {
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgb(var(--color-line-super-light-blue));
  border-radius: 1.6667vw;
  z-index: 1;
}
@media (min-width: 1200px) {
  .range-slider__track {
    border-radius: 6px;
  }
}
.range-slider__range {
  position: absolute;
  height: 100%;
  background: rgb(var(--color-primary));
  border-radius: 1.6667vw;
  z-index: 2;
}
@media (min-width: 1200px) {
  .range-slider__range {
    border-radius: 6px;
  }
}
.range-slider__minmax {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  color: rgb(var(--color-gray));
}
.field {
  --field-border: rgb(var(--color-line-super-light-blue));
  --field-label-color: rgb(var(--color-gray));
  --field-icon-color: rgb(var(--color-gray));
  --field-note-color: rgb(var(--color-gray));
  --text-align: left;
  width: 55.55555vw;
  text-align: var(--text-align);
}
@media (min-width: 1200px) {
  .field {
    width: 200px;
  }
}
.field--full-width {
  width: 100%;
}
@media (min-width: 1200px) {
  .field {
    width: 100%;
  }
}
.field__wrapper {
  position: relative;
  display: block;
  width: 100%;
  height: 13.33333vw;
  border: clamp(1px, .27777vw, .27777vw) solid var(--field-border);
  border-radius: 3.33333vw;
  transition: 0.3s;
}
@media (min-width: 1200px) {
  .field__wrapper {
    height: 48px;
    border-width: 1px;
    border-radius: 12px;
  }
}
.field__wrapper:has(.field__textarea) {
  height: 41.66666vw;
  display: flex;
  flex-direction: column;
}
@media (min-width: 1200px) {
  .field__wrapper:has(.field__textarea) {
    height: 150px;
  }
}
.field__wrapper:hover {
  --field-border: rgb(var(--color-primary));
  --field-label-color: rgb(var(--color-primary));
  --field-icon-color: rgb(var(--color-black));
}
.field__wrapper:has(.field__input:focus) {
  --field-border: rgb(var(--color-primary));
  --field-label-color: rgb(var(--color-gray));
  --field-icon-color: rgb(var(--color-black));
}
.field__input, .field__textarea {
  width: 100%;
  height: 100%;
  outline: none;
  border: none;
  padding: 1.66666vw 3.05555vw;
  color: rgb(var(--color-black));
  font-size: 3.88888vw;
  transition: 0.3s;
  background: rgb(var(--color-white));
  border-radius: inherit;
  text-align: var(--text-align);
}
@media (min-width: 1200px) {
  .field__input, .field__textarea {
    padding: 6px 11px;
    font-size: 14px;
  }
}
.field__textarea {
  resize: none;
  padding-top: 0;
  padding-bottom: 0;
}
.field__textarea ~ .field__label {
  top: 2.5vw;
}
@media (min-width: 1200px) {
  .field__textarea ~ .field__label {
    top: 9px;
  }
}
.field__label {
  position: absolute;
  top: 4.16666vw;
  left: 3.05555vw;
  width: calc(100% - 3.05555vw * 2);
  font-size: 3.88888vw;
  transition: 0.3s;
  color: var(--field-label-color);
}
@media (min-width: 1200px) {
  .field__label {
    top: 15px;
    left: 11px;
    font-size: 14px;
    width: calc(100% - 22px);
  }
}
.field__btn {
  position: absolute;
  top: calc(50% - 3.33333vw);
  right: 3.05555vw;
  background: none;
  border: none;
  padding: 0;
  width: 6.66666vw;
  aspect-ratio: 1;
}
@media (min-width: 1200px) {
  .field__btn {
    top: calc(50% - 12px);
    right: 11px;
    width: 24px;
  }
}
.field__btn .field__icon {
  top: 0;
  right: 0;
  width: 100%;
}
.field__btn--bg-color-primary {
  background: rgb(var(--color-primary));
  border-radius: 2.22222vw;
  width: 10vw;
  top: calc(50% - 5vw);
  right: 1.38888vw;
}
@media (min-width: 1200px) {
  .field__btn--bg-color-primary {
    border-radius: 8px;
    width: 36px;
    top: calc(50% - 18px);
    right: 5px;
  }
}
.field__btn--bg-color-primary .field__icon {
  fill: rgb(var(--color-white));
  stroke: rgb(var(--color-white));
  width: 5vw;
  top: calc(50% - 2.5vw);
  right: calc(50% - 2.5vw);
}
@media (min-width: 1200px) {
  .field__btn--bg-color-primary .field__icon {
    width: 18px;
    top: calc(50% - 9px);
    right: calc(50% - 9px);
  }
}
.field__btn--bg-color-primary:hover {
  background: #3D8CE7;
  border-color: #3D8CE7;
}
.field__btn--bg-color-primary:active {
  background: #003C80;
  border-color: #003C80;
}
.field__btn--bg-color-primary--disabled, .field__btn--bg-color-primary[disabled] {
  opacity: 0.2;
  cursor: default;
  pointer-events: none;
}
.field__icon {
  width: 6.66666vw;
  aspect-ratio: 1;
  position: absolute;
  top: calc(50% - 3.33333vw);
  right: 3.05555vw;
  fill: var(--field-icon-color);
  stroke: var(--field-icon-color);
  transition: 0.3s;
}
@media (min-width: 1200px) {
  .field__icon {
    width: 24px;
    top: calc(50% - 12px);
    right: 11px;
  }
}
.field__counter {
  font-size: 2.77777vw;
  color: rgb(var(--color-gray));
  position: absolute;
  right: 2.5vw;
  bottom: 2.77777vw;
}
@media (min-width: 1200px) {
  .field__counter {
    font-size: 10px;
    right: 9px;
    bottom: 10px;
  }
}
.field__current--error {
  color: rgb(var(--color-red));
}
.field__note {
  margin: 0.83333vw 0 0;
  font-size: 2.77777vw;
  color: var(--field-note-color);
}
@media (min-width: 1200px) {
  .field__note {
    margin: 3px 0 0;
    font-size: 10px;
  }
}
.field:has(.field__label) .field__input {
  padding-top: 5vw;
}
@media (min-width: 1200px) {
  .field:has(.field__label) .field__input {
    padding-top: 18px;
  }
}
.field:has(.field__label) .field__textarea {
  margin-top: 5.83333vw;
}
@media (min-width: 1200px) {
  .field:has(.field__label) .field__textarea {
    margin-top: 21px;
  }
}
.field:has(.field__icon) .field__input {
  padding-right: 13.33333vw;
}
@media (min-width: 1200px) {
  .field:has(.field__icon) .field__input {
    padding-right: 48px;
  }
}
.field:has(.field__counter) .field__textarea {
  margin-bottom: 6.66666vw;
}
@media (min-width: 1200px) {
  .field:has(.field__counter) .field__textarea {
    margin-bottom: 24px;
  }
}
.field__input:focus + .field__label, .field__textarea:focus + .field__label, .field--filled .field__label {
  top: 2.5vw;
  font-size: 2.77777vw;
}
@media (min-width: 1200px) {
  .field__input:focus + .field__label, .field__textarea:focus + .field__label, .field--filled .field__label {
    top: 9px;
    font-size: 10px;
  }
}
.field--filled {
  --field-icon-color: rgb(var(--color-black));
}
.field--error {
  --field-border: rgb(var(--color-red));
  --field-label-color: rgb(var(--color-gray));
  --field-icon-color: rgb(var(--color-black));
  --field-note-color: rgb(var(--color-red));
}
.field--text-center {
  --text-align: center;
}

.breadcrumbs {
  margin: 0 4.44444vw -1.66667vw;
  display: flex;
  gap: 1.11111vw;
  font-size: 3.33333vw;
  line-height: 2;
}
@media (min-width: 1200px) {
  .breadcrumbs {
    font-size: 12px;
    margin: 0 0 -4px;
    gap: 4px;
  }
}
.breadcrumbs__item {
  display: flex;
  gap: 1.11111vw;
}
@media (min-width: 1200px) {
  .breadcrumbs__item {
    gap: 4px;
  }
}
.breadcrumbs__item:not(:last-child) {
  color: rgb(var(--color-gray));
}
.breadcrumbs__item:not(:last-child)::after {
  content: "/";
}
.breadcrumbs__link {
  color: inherit;
  text-decoration: none;
}
.breadcrumbs__link:hover {
  color: rgb(var(--color-primary));
}

.content {
  line-height: 1.5;
  color: rgb(var(--color-gray));
  --img-margin-top: 2.22222vw;
  --img-margin-bottom: 3.33333vw;
  --p-margin-top: 2.22222vw;
  --p-margin-bottom: 3.33333vw;
  --h-margin-top: 2.22222vw;
  --h-margin-bottom: 2.22222vw;
  --h-weight: 500;
  --l-margin-top: 2.22222vw;
  --l-margin-bottom: 3.33333vw;
  --l-margin-left: 5vw;
  --table-margin-top: 2.22222vw;
  --table-margin-bottom: 3.33333vw;
  --h-line-height: 1.1875;
}
@media (min-width: 1200px) {
  .content {
    line-height: 1.5;
    --img-margin-top: 20px;
    --img-margin-bottom: 20px;
    --p-margin-top: 20px;
    --p-margin-bottom: 20px;
    --h-margin-top: 20px;
    --h-margin-bottom: 20px;
    --l-margin-top: 20px;
    --l-margin-bottom: 20px;
    --l-margin-left: 24px;
    --table-margin-top: 20px;
    --table-margin-bottom: 20px;
  }
}
.content > *:first-child {
  margin-top: 0;
}
.content > *:last-child {
  margin-bottom: 0;
}
.content a {
  color: inherit;
  text-decoration-skip-ink: none;
}
@media (min-width: 1200px) {
  .content a {
    color: rgb(var(--color-primary));
    text-decoration-thickness: 1px;
    text-underline-offset: 1px;
  }
}
.content a:hover {
  text-decoration-color: transparent;
}
.content img {
  max-width: 100%;
  border-radius: 2.77778vw;
  margin-top: var(--img-margin-top);
  margin-bottom: var(--img-margin-bottom);
  display: block;
  height: auto;
}
@media (min-width: 1200px) {
  .content img {
    border-radius: 16px;
  }
}
.content p {
  margin-top: var(--p-margin-top);
  margin-bottom: var(--p-margin-bottom);
}
.content h1,
.content h2,
.content h3,
.content h4 {
  font-weight: var(--h-weight);
  color: rgb(var(--color-black));
  line-height: var(--h-line-height);
  margin-top: var(--h-margin-top);
  margin-bottom: var(--h-margin-bottom);
}
.content h1 {
  font-size: 5.55556vw;
}
@media (min-width: 1200px) {
  .content h1 {
    font-size: 24px;
  }
}
.content h2 {
  font-size: 4.44444vw;
}
@media (min-width: 1200px) {
  .content h2 {
    font-size: 20px;
  }
}
.content h3 {
  font-size: 3.88888vw;
}
@media (min-width: 1200px) {
  .content h3 {
    font-size: 18px;
  }
}
.content h4 {
  font-size: 3.33333vw;
}
@media (min-width: 1200px) {
  .content h4 {
    font-size: 16px;
  }
}
.content ul,
.content ol {
  margin-top: var(--l-margin-top);
  margin-bottom: var(--l-margin-bottom);
}
.content ul {
  list-style: disc;
  margin-left: var(--l-margin-left);
}
.content ol {
  list-style: decimal;
  margin-left: var(--l-margin-left);
}
.content .table-wrapper {
  overflow: auto;
  margin-top: var(--table-margin-top);
  margin-bottom: var(--table-margin-bottom);
}
.content table {
  background: rgb(var(--color-bg-main));
  border-radius: 4.44444vw;
  border-spacing: 0 0.55556vw;
  padding: 1.66667vw 2.22222vw;
  --td-border-radius: 3.33333vw;
}
@media (min-width: 1200px) {
  .content table {
    border-radius: 16px;
    border-spacing: 0 2px;
    padding: 6px 8px;
    --td-border-radius: 12px;
  }
}
.content table th {
  color: rgb(var(--color-text-gray));
  font-weight: 400;
  padding: 2.22222vw 3.33333vw;
}
@media (min-width: 1200px) {
  .content table th {
    padding: 8px 12px;
  }
}
.content table td {
  padding: 2.22222vw 3.33333vw;
  background: rgb(var(--color-bg-secondary));
}
@media (min-width: 1200px) {
  .content table td {
    padding: 8px 12px;
  }
}
.content table tr:first-child td:first-child,
.content table tr:has(th) + tr td:first-child {
  border-top-left-radius: var(--td-border-radius);
}
.content table tr:first-child td:last-child,
.content table tr:has(th) + tr td:last-child {
  border-top-right-radius: var(--td-border-radius);
}
.content table tr:last-child td:first-child,
.content table tr:has(+ tr th) td:first-child {
  border-bottom-left-radius: var(--td-border-radius);
}
.content table tr:last-child td:last-child,
.content table tr:has(+ tr th) td:last-child {
  border-bottom-right-radius: var(--td-border-radius);
}
.content table:has(thead), .content table:has(tbody tr:first-child th) {
  padding-top: 0;
}

.content-tags {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 1.1111vw;
}
@media (min-width: 1200px) {
  .content-tags {
    gap: 4px;
  }
}
.content-tags__item {
  outline: 1px solid var(--line-gray);
  padding: 2.5vw 3.3333vw;
  color: var(--text-black);
  font-size: 3.3333vw;
  font-weight: 500;
  line-height: 3.8889vw;
  border-radius: 2.2222vw;
}
@media (min-width: 1200px) {
  .content-tags__item {
    padding: 10px 20px;
    font-size: 14px;
    line-height: 17px;
    border-radius: 12px;
  }
}

.bonus-head img {
  display: block;
  max-width: 100%;
  height: auto;
  border-radius: 2.7778vw;
}
@media (min-width: 1200px) {
  .bonus-head img {
    border-radius: 10px;
  }
}
.bonus-head__date {
  align-self: flex-start;
  position: relative;
  padding: 2.2222vw 1px 2.2222vw 2.7778vw;
  border-radius: 2.2222vw 0 0 2.2222vw;
  color: var(--text-gray);
  font-size: 3.3333vw;
  font-weight: 400;
  line-height: 3.8889vw;
  background: var(--background-blue);
}
@media (min-width: 1200px) {
  .bonus-head__date {
    padding: 8px 1px 8px 10px;
    border-radius: 8px 0 0 8px;
    font-size: 14px;
    line-height: 17px;
  }
}
.bonus-head__date:after {
  content: "";
  display: block;
  position: absolute;
  left: calc(100% - 1px);
  top: 0;
  height: 100%;
  width: 2.7778vw;
  background-color: var(--background-blue);
  mask: url("../../../assets/img/ui/bonus-head-date-background.svg") no-repeat left center/auto 100%;
  -webkit-mask: url("../../../assets/img/ui/bonus-head-date-background.svg") no-repeat left center/auto 100%;
}
@media (min-width: 1200px) {
  .bonus-head__date:after {
    width: 12px;
  }
}

.bonus-counter {
  display: flex;
  align-items: stretch;
  justify-content: flex-start;
  flex-wrap: wrap;
  padding: 1.1111vw;
  gap: 1.1111vw;
  border-radius: 3.3333vw;
  background: var(--background-main);
}
@media (min-width: 1200px) {
  .bonus-counter {
    padding: 8px;
    gap: 8px;
    border-radius: 20px;
  }
}
.bonus-counter__item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  width: calc(50% - 0.5556vw);
  border-radius: 2.2222vw;
  background: var(--colors-white);
  padding: 3.3333vw 4.4444vw;
  gap: 1.1111vw;
}
@media (min-width: 1200px) {
  .bonus-counter__item {
    align-items: center;
    justify-content: center;
    width: calc(50% - 4px);
    border-radius: 16px;
    padding: 10px;
    gap: 0;
  }
}
.bonus-counter__label {
  color: var(--text-line-black);
  font-size: 2.7778vw;
  font-weight: 400;
  line-height: 3.0556vw;
}
@media (min-width: 1200px) {
  .bonus-counter__label {
    font-size: 16px;
    line-height: 24px;
  }
}
.bonus-counter__value {
  color: var(--Primary);
  font-size: 3.3333vw;
  font-weight: 500;
  line-height: 3.8889vw;
}
@media (min-width: 1200px) {
  .bonus-counter__value {
    font-size: 16px;
    line-height: 19px;
  }
}

@media (max-width: 1199.98px) {
  .sidebar-filter {
    position: fixed;
    display: none;
    color: rgb(var(--color-black));
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background: var(--background-secondary);
  }
  .sidebar-filter.open {
    display: block;
  }
}
@media (min-width: 1200px) {
  .sidebar-filter {
    position: relative;
  }
}
.sidebar-filter.loading:before {
  content: "";
  display: block;
  position: absolute;
  inset: 0;
  z-index: 99999;
  background: rgba(255, 255, 255, 0.5);
}
.sidebar-filter__head {
  display: flex;
  align-items: center;
}
@media (max-width: 1199.98px) {
  .sidebar-filter__head {
    justify-content: flex-start;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 11.1111vw;
    padding: 0 3.8889vw;
    background: var(--background-secondary);
    box-shadow: 0 1.1111vw 2.2222vw 2.2222vw rgba(0, 0, 0, 0.06);
    z-index: 10;
  }
}
@media (min-width: 1200px) {
  .sidebar-filter__head {
    justify-content: space-between;
  }
}
@media (max-width: 1199.98px) {
  .sidebar-filter__body {
    position: absolute;
    top: 11.1111vw;
    left: 0;
    width: 100%;
    height: calc(100% - 22.2222vw);
    padding: 3.8889vw 3.8889vw 10vw 3.8889vw;
    overflow-y: auto;
    background: var(--background-secondary);
    z-index: 5;
  }
}
.sidebar-filter__bottom {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 16.6667vw;
  padding: 0 3.8889vw;
  gap: 1.1111vw;
  background: linear-gradient(0deg, #FFF 39.67%, rgba(255, 255, 255, 0) 100%);
  z-index: 10;
}
.sidebar-filter__bottom > * {
  flex: 0 1 100%;
}
.sidebar-filter__close {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 2.2222vw;
  color: var(--text-gray);
  fill: var(--text-gray);
  stroke: var(--text-gray);
  font-size: 3.3333vw;
  font-weight: 500;
}
.sidebar-filter__close svg {
  display: block;
  width: 1.9444vw;
  height: auto;
}
.sidebar-filter__heading {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  margin-left: 18.3333vw;
  gap: 1.1111vw;
  font-size: 3.3333vw;
  font-weight: 500;
}
@media (min-width: 1200px) {
  .sidebar-filter__heading {
    margin: 0;
    gap: 5px;
    font-size: 16px;
  }
}
.sidebar-filter__heading svg {
  display: block;
  width: 6.6667vw;
  height: auto;
}
@media (min-width: 1200px) {
  .sidebar-filter__heading svg {
    width: 24px;
  }
}
@media (min-width: 1200px) {
  .sidebar-filter__clear {
    color: rgb(var(--color-primary));
    text-decoration: none;
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
    transition: all 0.3s ease;
  }
  .sidebar-filter__clear:hover {
    color: rgb(var(--color-primary-hover));
  }
  .sidebar-filter__clear:active {
    color: rgb(var(--color-primary-active));
  }
}
.sidebar-filter__tags {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 1.1111vw;
}
@media (min-width: 1200px) {
  .sidebar-filter__tags {
    gap: 4px;
    margin-top: 16px;
  }
}
.sidebar-filter__tag {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 2.7778vw;
  padding: 2.7778vw 4.4444vw;
  color: var(--text-white);
  font-size: 3.8889vw;
  font-weight: 400;
  border-radius: 2.2222vw;
  background: var(--colors-black);
}
@media (min-width: 1200px) {
  .sidebar-filter__tag {
    gap: 10px;
    padding: 10px 16px;
    font-size: 14px;
    border-radius: 8px;
  }
}
.sidebar-filter__tag span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 4.4444vw;
  height: 4.4444vw;
  border-radius: 50%;
  cursor: pointer;
  background: var(--colors-white);
  fill: var(--colors-black);
  stroke: var(--colors-black);
}
@media (min-width: 1200px) {
  .sidebar-filter__tag span {
    width: 16px;
    height: 16px;
  }
}
.sidebar-filter__tag span svg {
  display: block;
  width: 3.3333vw;
  height: auto;
}
@media (min-width: 1200px) {
  .sidebar-filter__tag span svg {
    width: 12px;
  }
}
.sidebar-filter__tags + .sidebar-filter__groups {
  margin-top: 5.5556vw;
}
@media (min-width: 1200px) {
  .sidebar-filter__tags + .sidebar-filter__groups {
    margin-top: 20px;
  }
}
.sidebar-filter__groups {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 5.5556vw;
}
@media (min-width: 1200px) {
  .sidebar-filter__groups {
    margin-top: 20px;
    gap: 20px;
  }
}
.sidebar-filter__group {
  width: 100%;
}

.sidebar-filter-group__name {
  width: 100%;
  justify-content: space-between;
}
.sidebar-filter-group__name svg {
  transform: rotate(180deg);
}
.sidebar-filter-group__search {
  margin-top: 1.3889vw;
  width: 100%;
}
@media (min-width: 1200px) {
  .sidebar-filter-group__search {
    margin-top: 5px;
  }
}
@media (min-width: 1200px) {
  .sidebar-filter-group__checkboxes_wrapper {
    --scroll-bar-width: 15px;
    position: relative;
    width: calc(100% + var(--scroll-bar-width));
  }
  .sidebar-filter-group__checkboxes_wrapper:after {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: calc(100% - var(--scroll-bar-width));
    height: 100%;
    pointer-events: none;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 70.96%, #FFF 100%);
    z-index: 5;
  }
}
.sidebar-filter-group__checkboxes {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  position: relative;
  margin-top: 1.3889vw;
  gap: 1.3889vw;
  width: 100%;
}
@media (min-width: 1200px) {
  .sidebar-filter-group__checkboxes {
    margin-top: 5px;
    gap: 5px;
  }
}
@media (min-width: 1200px) {
  .sidebar-filter-group__checkboxes_wrapper .sidebar-filter-group__checkboxes {
    max-height: 313px;
    overflow-y: auto;
    padding-right: 5px;
    padding-bottom: 40px;
  }
}
.sidebar-filter-group__checkbox {
  width: 100%;
}
.sidebar-filter-group__range {
  margin-top: 1.3889vw;
}
@media (min-width: 1200px) {
  .sidebar-filter-group__range {
    margin-top: 5px;
  }
}
.sidebar-filter-group.hide .sidebar-filter-group__name svg {
  transform: rotate(0deg);
}
.sidebar-filter-group.hide .sidebar-filter-group__search {
  display: none;
}
.sidebar-filter-group.hide .sidebar-filter-group__checkboxes {
  display: none;
}
.sidebar-filter-group.hide .sidebar-filter-group__range {
  display: none;
}

.bonus-card {
  --accent-color: var(--colors-accident);
  --accent-background: var(--colors-accident-10);
  position: relative;
  background: var(--background-main);
  border-radius: 4.4444vw;
}
@media (min-width: 1200px) {
  .bonus-card {
    border-radius: 16px;
  }
}
.bonus-card.bonusy {
  --accent-color: var(--colors-accident);
  --accent-background: var(--colors-accident-10);
}
.bonus-card.promokody {
  --accent-color: var(--colors-primary);
  --accent-background: var(--colors-primary-10);
}
.bonus-card.fribety {
  --accent-color: var(--colors-purple);
  --accent-background: var(--colors-purple-10);
}
.bonus-card.akcii {
  --accent-color: var(--Red);
  --accent-background: var(--Red-10);
}
.bonus-card__link {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.bonus-card__image {
  display: block;
  position: relative;
}
.bonus-card__image:after {
  content: "";
  display: block;
  padding-top: 75.86%;
}
.bonus-card__image img {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  -o-object-fit: cover;
  border-radius: 4.4444vw;
}
@media (min-width: 1200px) {
  .bonus-card__image img {
    border-radius: 16px;
  }
}
.bonus-card__info {
  padding: 3.3333vw;
}
@media (min-width: 1200px) {
  .bonus-card__info {
    padding: 12px;
  }
}
.bonus-card__group {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  font-size: 3.8889vw;
  font-weight: 400;
  line-height: 4.7222vw;
}
@media (min-width: 1200px) {
  .bonus-card__group {
    font-size: 14px;
    line-height: 17px;
  }
}
.bonus-card__group--sb {
  justify-content: space-between;
}
.bonus-card__group + .bonus-card__group {
  margin-top: 4.4444vw;
}
@media (min-width: 1200px) {
  .bonus-card__group + .bonus-card__group {
    margin-top: 16px;
  }
}
.bonus-card__type {
  display: block;
  position: relative;
  color: var(--accent-color);
  background: var(--accent-background);
  padding: 2.2222vw 1px 2.2222vw 2.7778vw;
  border-radius: 2.2222vw 0 0 2.2222vw;
}
@media (min-width: 1200px) {
  .bonus-card__type {
    padding: 8px 1px 8px 10px;
    border-radius: 8px 0 0 8px;
  }
}
.bonus-card__type:after {
  content: "";
  display: block;
  position: absolute;
  left: 100%;
  top: 0;
  height: 100%;
  width: 3.3333vw;
  user-select: none;
  background-color: var(--accent-background);
  mask: url("../../../assets/img/ui/bonus-type-background.svg") no-repeat left top/auto 100%;
  -webkit-mask: url("../../../assets/img/ui/bonus-type-background.svg") no-repeat left top/auto 100%;
}
@media (min-width: 1200px) {
  .bonus-card__type:after {
    width: 12px;
  }
}
.bonus-card__finish {
  display: block;
  position: relative;
  color: var(--text-gray);
  background-color: var(--background-blue);
  margin-left: 7.7778vw;
  padding: 2.2222vw 2.7778vw 2.2222vw 1px;
  border-radius: 0 2.2222vw 2.2222vw 0;
}
@media (min-width: 1200px) {
  .bonus-card__finish {
    margin-left: 28px;
    padding: 8px 10px 8px 1px;
    border-radius: 0 8px 8px 0;
  }
}
.bonus-card__finish:after {
  content: "";
  display: block;
  position: absolute;
  right: calc(100% - 1px);
  top: 0;
  height: 100%;
  width: 3.3333vw;
  user-select: none;
  background-color: var(--background-blue);
  mask: url("../../../assets/img/ui/bonus-finish-background.svg") no-repeat right top/auto 100%;
  -webkit-mask: url("../../../assets/img/ui/bonus-finish-background.svg") no-repeat right top/auto 100%;
}
@media (min-width: 1200px) {
  .bonus-card__finish:after {
    width: 12px;
  }
}
.bonus-card__logo {
  --height: 8.3333vw;
  display: block;
  min-height: var(--height);
}
@media (min-width: 1200px) {
  .bonus-card__logo {
    --height: 30px;
  }
}
.bonus-card__logo img, .bonus-card__logo svg {
  display: block;
  height: var(--height);
  width: auto;
}
.bonus-card__sum {
  overflow: hidden;
  color: var(--text-black);
  font-weight: 500;
}
.bonus-card__promocode {
  display: block;
  position: relative;
  width: 100%;
  height: 13.3333vw;
  color: var(--text-black);
  font-weight: 500;
  border-radius: 3.3333vw;
  text-decoration: none;
  border: none;
  overflow: hidden;
  background: var(--background-blue);
  z-index: 10;
}
@media (min-width: 1200px) {
  .bonus-card__promocode {
    height: 48px;
    border-radius: 12px;
  }
}
.bonus-card__promocode span {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  left: 0;
  top: 0;
  width: calc(100% - 5vw);
  height: 100%;
  border-radius: 3.3333vw;
  color: var(--colors-white);
  background: var(--accent-color);
  transition: all 0.3s ease;
}
@media (min-width: 1200px) {
  .bonus-card__promocode span {
    width: calc(100% - 18px);
    border-radius: 12px;
  }
}
.bonus-card__promocode span:before, .bonus-card__promocode span:after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  width: 5.5556vw;
  height: 5.5556vw;
}
@media (min-width: 1200px) {
  .bonus-card__promocode span:before, .bonus-card__promocode span:after {
    width: 20px;
    height: 20px;
  }
}
.bonus-card__promocode span:before {
  background: var(--background-blue);
  border-radius: 0 0 0 2.7778vw;
  z-index: 1;
}
@media (min-width: 1200px) {
  .bonus-card__promocode span:before {
    border-radius: 0 0 0 10px;
  }
}
.bonus-card__promocode span:after {
  background-color: var(--colors-light-blue);
  mask: url("../../../assets/img/ui/bonus-promocode-bacground.svg") no-repeat center/100% 100%;
  -webkit-mask: url("../../../assets/img/ui/bonus-promocode-bacground.svg") no-repeat center top/100% 100%;
  z-index: 2;
}
.bonus-card__promocode:hover span {
  left: -5.5556vw;
}
@media (min-width: 1200px) {
  .bonus-card__promocode:hover span {
    left: -20px;
  }
}
.bonus-card__button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 13.3333vw;
  color: var(--colors-white);
  font-weight: 500;
  border-radius: 3.3333vw;
  text-decoration: none;
  background: var(--accent-color);
  z-index: 10;
  transition: all 0.3s ease;
}
@media (min-width: 1200px) {
  .bonus-card__button {
    height: 48px;
    border-radius: 12px;
  }
}
.bonus-card__button:hover {
  opacity: 0.7;
}
.bonus-card__vote {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.bonus-card__vote_label {
  color: var(--text-gray);
}
.bonus-card__vote_down, .bonus-card__vote_up {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  position: relative;
  gap: 1.3889vw;
  cursor: pointer;
  z-index: 10;
}
@media (min-width: 1200px) {
  .bonus-card__vote_down, .bonus-card__vote_up {
    gap: 5px;
  }
}
.bonus-card__vote_down svg, .bonus-card__vote_up svg {
  display: block;
  width: 4.4444vw;
  height: auto;
}
@media (min-width: 1200px) {
  .bonus-card__vote_down svg, .bonus-card__vote_up svg {
    width: 16px;
  }
}
.bonus-card__vote_down:after, .bonus-card__vote_up:after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  height: 100%;
  width: 3.3333vw;
  user-select: none;
}
@media (min-width: 1200px) {
  .bonus-card__vote_down:after, .bonus-card__vote_up:after {
    width: 12px;
  }
}
.bonus-card__vote_down {
  color: var(--text-gray);
  fill: var(--text-gray);
  stroke: var(--text-gray);
  background-color: var(--background-blue);
  padding: 2.2222vw 1px 2.2222vw 2.7778vw;
  border-radius: 2.2222vw 0 0 2.2222vw;
}
@media (min-width: 1200px) {
  .bonus-card__vote_down {
    padding: 8px 1px 8px 10px;
    border-radius: 8px 0 0 8px;
  }
}
.bonus-card__vote_down:after {
  left: calc(100% - 1px);
  background-color: var(--background-blue);
  mask: url("../../../assets/img/ui/bonus-type-background.svg") no-repeat left top/auto 100%;
  -webkit-mask: url("../../../assets/img/ui/bonus-type-background.svg") no-repeat left top/auto 100%;
}
.bonus-card__vote_up {
  color: var(--colors-white);
  fill: var(--colors-white);
  stroke: var(--colors-white);
  background: var(--colors-green);
  margin-left: 7.7778vw;
  padding: 2.2222vw 2.7778vw 2.2222vw 1px;
  border-radius: 0 2.2222vw 2.2222vw 0;
}
@media (min-width: 1200px) {
  .bonus-card__vote_up {
    margin-left: 28px;
    padding: 8px 10px 8px 1px;
    border-radius: 0 8px 8px 0;
  }
}
.bonus-card__vote_up:after {
  right: calc(100% - 1px);
  background-color: var(--colors-green);
  mask: url("../../../assets/img/ui/bonus-finish-background.svg") no-repeat right top/auto 100%;
  -webkit-mask: url("../../../assets/img/ui/bonus-finish-background.svg") no-repeat right top/auto 100%;
}

.bonus-hero {
  --accent-color: var(--colors-accident);
  --accent-background: var(--colors-accident-10);
  display: flex;
  flex-direction: row;
  align-self: flex-start;
  justify-content: flex-start;
  flex-wrap: wrap;
  position: relative;
  row-gap: 4.1667vw;
}
@media (min-width: 1200px) {
  .bonus-hero {
    flex-direction: column;
    justify-content: center;
    min-height: 300px;
    padding: 20px 40px;
    width: 100%;
    row-gap: 20px;
  }
}
.bonus-hero.bonusy {
  --accent-color: var(--colors-accident);
  --accent-background: var(--colors-accident-10);
}
.bonus-hero.promokody {
  --accent-color: var(--colors-primary);
  --accent-background: var(--colors-primary-10);
}
.bonus-hero.fribety {
  --accent-color: var(--colors-purple);
  --accent-background: var(--colors-purple-10);
}
.bonus-hero.akcii {
  --accent-color: var(--Red);
  --accent-background: var(--Red-10);
}
.bonus-hero__image {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 2.7778vw;
}
@media (min-width: 1200px) {
  .bonus-hero__image {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    -o-object-fit: cover;
    border-radius: 20px;
    z-index: -1;
  }
}
.bonus-hero__logo {
  margin: -6.9444vw auto 0;
  min-width: 51%;
  padding: 1.3889vw 5.5556vw;
  border-radius: 5.5556vw;
  background: var(--background-secondary);
}
@media (min-width: 1200px) {
  .bonus-hero__logo {
    margin: 0;
    padding: 0;
    border-radius: 0;
    background: no-repeat;
  }
}
.bonus-hero__logo img {
  display: block;
  height: 11.1111vw;
  width: auto;
}
@media (min-width: 1200px) {
  .bonus-hero__logo img {
    height: 50px;
  }
}
.bonus-hero__info {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  row-gap: 1.3889vw;
  width: 50%;
  padding: 0 2.22222vw;
}
@media (min-width: 1200px) {
  .bonus-hero__info {
    row-gap: 4px;
    width: auto;
    padding: 0;
  }
}
.bonus-hero__type {
  display: block;
  position: relative;
  color: var(--text-white);
  font-size: 3.3333vw;
  font-weight: 500;
  line-height: 14px;
  padding: 0.8333vw 0.8333vw 0.8333vw 1.6667vw;
  border-radius: 1.1111vw 0 0 1.1111vw;
  background: var(--accent-color);
}
@media (min-width: 1200px) {
  .bonus-hero__type {
    font-size: 12px;
    font-style: italic;
    font-weight: 500;
    line-height: 14px;
    padding: 3px 3px 3px 6px;
    border-radius: 4px 0 0 4px;
  }
}
.bonus-hero__type:after {
  content: "";
  display: block;
  position: absolute;
  left: calc(100% - 1px);
  top: 0;
  width: 2.2222vw;
  height: 100%;
  background-color: var(--accent-color);
  mask: url("../../../assets/img/ui/bonus-hero-type.svg") no-repeat left top/auto 100%;
  -webkit-mask: url("../../../assets/img/ui/bonus-hero-type.svg") no-repeat left top/auto 100%;
}
@media (min-width: 1200px) {
  .bonus-hero__type:after {
    width: 8px;
  }
}
.bonus-hero__sum {
  color: var(--text-black);
  font-size: 5.5556vw;
  font-weight: 500;
  line-height: 6.6667vw;
}
@media (min-width: 1200px) {
  .bonus-hero__sum {
    color: var(--Background-main);
    font-size: 32px;
    font-weight: 600;
    line-height: 38px;
    letter-spacing: 3.2px;
  }
}
.bonus-hero__rating {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: flex-start;
  width: 50%;
  padding: 0 2.22222vw;
  row-gap: 1.3889vw;
}
@media (min-width: 1200px) {
  .bonus-hero__rating {
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    width: auto;
    padding: 0;
    gap: 10px;
  }
}
.bonus-hero__stars {
  display: flex;
  flex-direction: row;
  gap: 1.6667vw;
}
@media (min-width: 1200px) {
  .bonus-hero__stars {
    gap: 6px;
  }
}
.bonus-hero__stars svg {
  display: block;
  width: 3.8889vw;
  height: auto;
}
@media (min-width: 1200px) {
  .bonus-hero__stars svg {
    width: 20px;
  }
}
.bonus-hero__rating_counter {
  color: var(--Light-gray);
  font-size: 3.3333vw;
  font-weight: 400;
}
@media (min-width: 1200px) {
  .bonus-hero__rating_counter {
    font-size: 14px;
  }
}
.bonus-hero__benefits {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 2.2222vw;
  padding: 0 2.22222vw;
}
@media (min-width: 1200px) {
  .bonus-hero__benefits {
    gap: 12px;
    padding: 0;
  }
}
.bonus-hero__benefit {
  display: block;
  position: relative;
  padding-left: 3.3333vw;
  color: var(--text-black);
  font-size: 2.7778vw;
  font-weight: 400;
  line-height: 3.3333vw;
}
@media (min-width: 1200px) {
  .bonus-hero__benefit {
    color: var(--Background-main);
    padding: 4px 0 4px 30px;
    font-size: 14px;
    line-height: 17px;
  }
}
.bonus-hero__benefit svg {
  display: block;
  position: absolute;
  left: 0;
  top: calc(50% - 1.6667vw);
  width: 3.0556vw;
  height: 3.3333vw;
}
@media (min-width: 1200px) {
  .bonus-hero__benefit svg {
    top: calc(50% - 12px);
    width: 22px;
    height: 24px;
  }
}
.bonus-hero__buttons {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 0 2.22222vw;
  row-gap: 1.3889vw;
}
@media (min-width: 1200px) {
  .bonus-hero__buttons {
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    padding: 0;
    gap: 10px;
  }
}
.bonus-hero__buttons > * {
  width: 100%;
}
@media (min-width: 1200px) {
  .bonus-hero__buttons > * {
    width: auto;
  }
}

.bonus-params {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 1.1111vw;
  padding: 0 2.22222vw;
}
@media (min-width: 1200px) {
  .bonus-params {
    gap: 8px;
    padding: 0;
  }
}
.bonus-params__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: calc(50% - 0.5556vw);
  padding: 3.3333vw;
  gap: 1.6667vw;
  border-radius: 2.2222vw;
  background: var(--Background-second);
}
@media (min-width: 1200px) {
  .bonus-params__item {
    width: calc(16.6% - 7px);
    gap: 5px;
    padding: 20px;
    border-radius: 12px;
    box-shadow: 0 1px 4px 0 #E3EBFC, 0 24px 48px 0 rgba(230, 235, 245, 0.4);
  }
}
.bonus-params__value {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.6667vw;
  color: var(--text-line-black);
  font-size: 3.8889vw;
  font-weight: 500;
}
@media (min-width: 1200px) {
  .bonus-params__value {
    gap: 10px;
    font-size: 18px;
  }
}
.bonus-params__value svg {
  display: block;
  height: 6.6667vw;
  width: auto;
}
@media (min-width: 1200px) {
  .bonus-params__value svg {
    height: 24px;
  }
}
.bonus-params__label {
  color: var(--text-black);
  text-align: center;
  font-size: 2.7778vw;
  font-weight: 400;
  line-height: 3.3333vw;
}
@media (min-width: 1200px) {
  .bonus-params__label {
    color: var(--text-gray);
    font-size: 12px;
    font-weight: 400;
    line-height: 14px;
  }
}

/*Костыль чтобы не прыгало*/
.layout {
  max-width: 100%;
  overflow: auto;
}

@media (min-width: 1200px) {
  .layout__content {
    width: calc(100% - 300px);
  }
}

/*# sourceMappingURL=critical.css.map */