html {
  line-height: 1.15;
}

body {
  margin: 0;
}

hr {
  box-sizing: content-box;
  height: 0;
  overflow: visible;
}

pre {
  font-family: monospace, monospace;
  font-size: 1em;
}

abbr[title] {
  border-bottom: none;
  text-decoration: underline dotted;
}

code,
kbd,
samp {
  font-family: monospace, monospace;
  font-size: 1em;
}

small {
  font-size: 80%;
}

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  font-size: 100%;
  line-height: 1.15;
  margin: 0;
}

button,
[type=button],
[type=reset],
[type=submit] {
  -webkit-appearance: button;
}

fieldset {
  padding: 0.35em 0.75em 0.625em;
}

legend {
  box-sizing: border-box;
  display: table;
  max-width: 100%;
  padding: 0;
  white-space: normal;
}

progress {
  vertical-align: baseline;
}

[type=search] {
  -webkit-appearance: textfield;
  outline-offset: -2px;
}

[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}

::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit;
}

details {
  display: block;
}

summary {
  display: list-item;
}

ul,
ol {
  list-style: none;
  padding: 0;
  margin: 0;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

:root {
  --color-primary: 0 104 223;
  /* #0068DF */
  --color-primary-hover: 61 140 231;
  /*#3D8CE7*/
  --color-primary-active: 0 60 128;
  /*#003C80*/
  --color-accident: 22 171 136;
  /* #16AB88 */
  --color-black: 27 27 27;
  /* #1B1B1B */
  --color-yellow: 255 192 74;
  /* #FFC04A */
  --color-light-blue: 83 163 255;
  /* #53A3FF */
  --color-purple: 172 110 254;
  /* #AC6EFE */
  --color-green: 45 189 127;
  /* #2DBD7F */
  --color-red: 255 82 82;
  /* #FF5252 */
  --color-gray: 109 121 148;
  /* #6D7994 */
  --color-white: 255 255 255;
  /* #FFFFFF */
  --color-L-green: 14 207 65;
  /* #0ECF41 */
  --color-dark-gray: 68 68 68;
  /* #444444 */
  --color-bg-main: 248 248 248;
  /* #F8F8F8 */
  --color-bg-secondary: 255 255 255;
  /* #FFFFFF */
  --color-bg-L-gray: 238 238 238;
  /* #EEEEEE */
  --color-bg-blue: 238 242 252;
  /* #EEF2FC */
  --color-bg-gray: 243 243 243;
  /* #F3F3F3 */
  --color-bg-black: 27 27 27;
  /* #1B1B1B */
  --color-text-white: 255 255 255;
  /* #FFFFFF */
  --color-text-blue-gray: 109 121 148;
  /* #6D7994 */
  --color-text-gray: 188 188 188;
  /* #BCBCBC */
  --color-text-black: 27 27 27;
  /* #1B1B1B */
  --color-text-primary: 0 104 223;
  /* #0068DF */
  --color-text-L-blue: 82 123 225;
  /* #527BE1 */
  --color-line-super-light-blue: 210 220 244;
  /* #D2DCF4 */
  --color-line-gray: 230 230 230;
  /* #E6E6E6 */
  --color-line-light-blue: 122 163 255;
  /* #7AA3FF */
  --color-line-primary: 0 104 223;
  /* #0068DF */
  /*other*/
  --Light-gray: #A0AAC2;
  --colors-accident: #16AB88;
  --colors-purple: #AC6EFE;
  --colors-primary: #0068DF;
  --colors-yellow: #FFC04A;
  --Red: #FF5252;
  --colors-red: #FF5252;
  --colors-red-10: rgba(255, 82, 82, 0.10);
  --Primary: #527BE1;
  --text-primary: #0068DF;
  --background-main: #F8F8F8;
  --Background-main: #F8F8F8;
  --Background-second: #FFF;
  --colors-primary-10: rgba(0, 104, 223, 0.10);
  --colors-purple-10: rgba(172, 110, 254, 0.10);
  --colors-accident-10: rgba(22, 171, 136, 0.10);
  --colors-yellow-10: rgba(255, 192, 74, 0.10);
  --colors-light-blue-10: rgba(83, 163, 255, 0.10);
  --colors-green-10: rgba(45, 189, 127, 0.10);
  --Red-10: rgba(255, 82, 82, 0.10);
  --background-blue: #EEF2FC;
  --text-gray: #6D7994;
  --text-white: #fff;
  --text-black: #1B1B1B;
  --colors-black: #1B1B1B;
  --colors-white: #FFF;
  --colors-green: #2DBD7F;
  --colors-light-blue: #53A3FF;
  --text-line-black: #1B1B1B;
  --background-secondary: #FFF;
  --line-gray: #E6E6E6;
  --text-L-gray: #BCBCBC;
  --colors-gray: #6D7994;
  --text-line-grey-medium: #E6E6E6;
  --background-gray: #F3F3F3;
  --Text-Gray-Medium: #B1B1B1;
  --line-super-light-blue: #D2DCF4;
  --Line-Light-gray: #D2DCF4;
  --Second-bg: #FFF;
  --Black: #000;
  --Grey: #6D7994;
  --Light-blue: #A2CBFF;
  --font-family-main: "Rubik";
}

.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));
}

.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;
  }
}

.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;
}

.tab-nav {
  display: flex;
  position: relative;
}
.tab-nav::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: clamp(1px, 0.27777vw, 0.27777vw) solid rgb(var(--color-line-super-light-blue));
  border-radius: 3.33333vw;
}
@media (min-width: 1200px) {
  .tab-nav::before {
    border-width: 1px;
    border-radius: 12px;
  }
}
.tab-nav__item:not(:first-child) {
  margin-left: -2.77778vw;
}
@media (min-width: 1200px) {
  .tab-nav__item:not(:first-child) {
    margin-left: -10px;
  }
}
.tab-nav__btn {
  background: none;
  border: none;
  padding: 2.77778vw 5.55556vw;
  min-height: 13.33333vw;
  color: rgb(var(--color-text-black));
  font-size: 3.88889vw;
  font-weight: 500;
  position: relative;
  z-index: 2;
  border-radius: 3.33333vw;
}
@media (min-width: 1200px) {
  .tab-nav__btn {
    padding: 10px 20px;
    font-size: 14px;
    min-height: 48px;
    border-radius: 12px;
  }
}
.tab-nav__btn.active {
  background: rgb(var(--color-bg-black));
  color: rgb(var(--color-white));
}

.tab {
  display: none;
}
.tab.active {
  display: block;
}

.tag {
  display: flex;
  align-items: center;
  gap: 2.22222vw;
  text-decoration: none;
  --tag-color: var(--color-green);
}
@media (min-width: 1200px) {
  .tag {
    gap: 8px;
  }
}
.tag__icon {
  width: 5vw;
  aspect-ratio: 1;
  padding: 0.55556vw;
  background: rgb(var(--tag-color)/0.1);
  fill: rgb(var(--tag-color));
  border-radius: 10vw;
}
@media (min-width: 1200px) {
  .tag__icon {
    width: 18px;
    height: 18px;
    padding: 2px;
    border-radius: 100px;
  }
}
.tag__icon svg {
  display: block;
  width: 100%;
  height: 100%;
}
.tag__text {
  background: rgb(var(--tag-color)/0.1);
  color: rgb(var(--tag-color));
  min-height: 5vw;
  display: flex;
  align-items: center;
  border-radius: 10vw;
  padding: 0.55556vw 2.77778vw;
  font-size: 3.05556vw;
}
@media (min-width: 1200px) {
  .tag__text {
    padding: 2px 10px;
    font-size: 11px;
    border-radius: 100px;
    min-height: 18px;
  }
}

.banner {
  width: 100%;
  border-radius: 5.55556vw;
  position: relative;
  overflow: hidden;
}
@media (min-width: 1200px) {
  .banner {
    border-radius: 20px;
  }
}

.banner__img {
  display: block;
  width: 100%;
}

.bk-cta {
  background: linear-gradient(119.09deg, #00C7B1 6.39%, #000000 98.73%);
  padding: 8.33333vw 5.55556vw 5.55556vw;
  border-radius: 5.55556vw;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5.55556vw;
}
@media (min-width: 1200px) {
  .bk-cta {
    padding: 30px 20px 20px;
    border-radius: 20px;
    gap: 20px;
  }
}
.bk-cta__img {
  width: 44.44444vw;
}
@media (min-width: 1200px) {
  .bk-cta__img {
    width: 160px;
  }
}
.bk-cta__bonus {
  font-size: 5vw;
  font-weight: 500;
  color: rgb(var(--color-white));
  position: relative;
  z-index: 2;
  padding: 2.77778vw 0;
  --bg-bonus: rgb(var(--color-bg-black));
}
@media (min-width: 1200px) {
  .bk-cta__bonus {
    font-size: 18px;
    padding: 10px 0;
  }
}
.bk-cta__bonus::before {
  content: "";
  background: var(--bg-bonus);
  position: absolute;
  top: 0;
  left: -12.77778vw;
  width: calc(100% + 21.66667vw);
  height: 100%;
  z-index: -1;
  border-radius: 1.38889vw;
  transform: skew(-22deg);
  transform-origin: left bottom;
}
@media (min-width: 1200px) {
  .bk-cta__bonus::before {
    left: -46px;
    border-radius: 5px;
    width: calc(100% + 78px);
  }
}
.bk-cta__title {
  margin: 0;
  font-size: 4.44444vw;
  font-weight: 500;
  text-align: center;
  color: rgb(var(--color-white));
  line-height: 1.1875;
}
@media (min-width: 1200px) {
  .bk-cta__title {
    font-size: 16px;
  }
}
.bk-cta__actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  width: 100%;
  gap: 2.77778vw;
}
@media (min-width: 1200px) {
  .bk-cta__actions {
    gap: 10px;
  }
}

.widget-bk-list {
  padding: 6.66667vw 3.33333vw 3.33333vw;
  border-radius: 5.55556vw;
  background: rgb(var(--color-bg-secondary));
  display: flex;
  flex-direction: column;
  gap: 4.44444vw;
}
@media (min-width: 1200px) {
  .widget-bk-list {
    padding: 24px 12px 12px;
    border-radius: 20px;
    gap: 16px;
  }
}
.widget-bk-list__title {
  font-size: 5.55556vw;
  font-weight: 500;
  text-align: center;
  line-height: 1.2;
  margin: 0;
}
@media (min-width: 1200px) {
  .widget-bk-list__title {
    font-size: 20px;
  }
}
.widget-bk-list__content {
  background: rgb(var(--color-bg-main));
  border-radius: 4.44444vw;
  padding: 2.22222vw;
  display: flex;
  flex-direction: column;
  gap: 2.22222vw;
}
@media (min-width: 1200px) {
  .widget-bk-list__content {
    padding: 8px;
    border-radius: 16px;
    gap: 8px;
  }
}
.widget-bk-list__items {
  display: flex;
  flex-direction: column;
  gap: 2.22222vw;
}
@media (min-width: 1200px) {
  .widget-bk-list__items {
    gap: 8px;
  }
}
.widget-bk-list__link {
  background: rgb(var(--color-bg-secondary));
  color: rgb(var(--color-text-black));
  border-radius: 3.33333vw;
  padding: 2.22222vw;
  display: flex;
  align-items: center;
  text-decoration: none;
}
@media (min-width: 1200px) {
  .widget-bk-list__link {
    padding: 8px;
    border-radius: 12px;
  }
}
.widget-bk-list__info {
  display: flex;
  align-items: center;
  gap: 4.44444vw;
}
@media (min-width: 1200px) {
  .widget-bk-list__info {
    gap: 8px;
  }
}
.widget-bk-list__logo {
  border-radius: 2.22222vw;
  width: 23.61111vw;
}
@media (min-width: 1200px) {
  .widget-bk-list__logo {
    width: 85px;
    border-radius: 8px;
  }
}
.widget-bk-list__rating {
  display: flex;
  align-items: center;
  gap: 1.38889vw;
  color: rgb(var(--color-text-blue-gray));
  font-size: 3.88889vw;
}
@media (min-width: 1200px) {
  .widget-bk-list__rating {
    gap: 5px;
    font-size: 14px;
  }
}
.widget-bk-list__rating-icon {
  width: 6.66667vw;
  aspect-ratio: 1;
}
@media (min-width: 1200px) {
  .widget-bk-list__rating-icon {
    width: 24px;
  }
}
.widget-bk-list__bonus {
  margin-left: auto;
  margin-right: 3.61111vw;
  color: rgb(var(--color-accident));
  font-size: 3.33333vw;
  line-height: 1.16667;
  padding: 1.66667vw 0;
  position: relative;
  white-space: nowrap;
}
@media (min-width: 1200px) {
  .widget-bk-list__bonus {
    font-size: 12px;
    margin-right: 13px;
    padding: 5px 0;
  }
}
.widget-bk-list__bonus::before {
  content: "";
  position: absolute;
  top: -0.55556vw;
  left: -3.88889vw;
  width: calc(100% + 6.11111vw);
  height: 8.05556vw;
  border: 0.27778vw solid rgb(var(--color-accident));
  border-radius: 2.22222vw;
  transform: skew(-10deg);
  transform-origin: left bottom;
}
@media (min-width: 1200px) {
  .widget-bk-list__bonus::before {
    border-width: 1px;
    top: -3px;
    left: -13px;
    width: calc(100% + 21px);
    height: 29px;
    border-radius: 8px;
  }
}
.widget-bk-list__offer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 3.33333vw;
}
@media (min-width: 1200px) {
  .widget-bk-list__offer {
    flex-direction: column;
    gap: 10px;
    padding-top: 5px;
  }
}
.widget-bk-list__offer-text {
  margin: 0 0 0 1.38889vw;
  font-size: 3.88889vw;
  font-weight: 500;
  flex: 1 1 0;
}
@media (min-width: 1200px) {
  .widget-bk-list__offer-text {
    margin: 0;
    font-size: 14px;
    text-align: center;
  }
}
.widget-bk-list__offer-btn {
  flex-shrink: 0;
}
@media (min-width: 1200px) {
  .widget-bk-list__offer-btn {
    width: 100%;
  }
}

.bk-recommend {
  background: rgb(var(--color-bg-secondary));
  border-radius: 4.44444vw;
  padding: 3.33333vw 2.22222vw 2.22222vw;
  display: flex;
  flex-direction: column;
  gap: 3.33333vw;
}
@media (min-width: 1200px) {
  .bk-recommend {
    padding: 12px;
    border-radius: 20px;
    gap: 12px;
  }
}
.bk-recommend__title {
  font-size: 5.55556vw;
  line-height: 1.2;
  text-align: center;
  font-weight: 500;
}
@media (min-width: 1200px) {
  .bk-recommend__title {
    font-size: 20px;
  }
}
.bk-recommend__list {
  background: rgb(var(--color-bg-gray));
  border-radius: 3.33333vw;
  padding: 2.22222vw;
  display: flex;
  flex-direction: column;
  gap: 2.22222vw;
}
@media (min-width: 1200px) {
  .bk-recommend__list {
    background: none;
    gap: 8px;
    padding: 0;
    border-radius: 0;
  }
}
.bk-recommend__card {
  background: rgb(var(--color-bg-secondary));
  border-radius: 3.33333vw;
  padding: 3.33333vw 2.77778vw;
  display: flex;
  flex-direction: column;
  gap: 1.66667vw;
}
@media (min-width: 1200px) {
  .bk-recommend__card {
    background: rgb(var(--color-bg-main));
    border-radius: 16px;
    padding: 12px;
    gap: 8px;
  }
}
.bk-recommend__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.bk-recommend__logo {
  width: 34.72222vw;
  height: 8.33333vw;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media (min-width: 1200px) {
  .bk-recommend__logo {
    width: 124px;
    height: 30px;
  }
}
.bk-recommend__logo-img {
  max-width: 100%;
  max-height: 100%;
}
.bk-recommend__btns {
  display: flex;
  align-items: center;
  gap: 1.11111vw;
}
@media (min-width: 1200px) {
  .bk-recommend__btns {
    gap: 4px;
  }
}
.bk-recommend__btn {
  width: 8.33333vw;
  min-height: 8.33333vw;
  border-radius: 1.66667vw;
  padding: 1.38889vw !important;
}
@media (min-width: 1200px) {
  .bk-recommend__btn {
    width: 36px;
    min-height: 36px;
    border-radius: 8px;
    padding: 2px !important;
  }
}
.bk-recommend__info {
  display: flex;
  justify-content: space-between;
}
@media (min-width: 1200px) {
  .bk-recommend__info {
    flex-direction: column;
    gap: 4px;
  }
}
.bk-recommend__stats {
  display: flex;
  align-items: center;
  gap: 2.77778vw;
}
@media (min-width: 1200px) {
  .bk-recommend__stats {
    justify-content: space-between;
    padding: 6px 0;
  }
}
.bk-recommend__stat {
  display: flex;
  align-items: center;
  gap: 1.11111vw;
  color: rgb(var(--color-gray));
  fill: rgb(var(--color-gray));
  stroke: rgb(var(--color-gray));
}
@media (min-width: 1200px) {
  .bk-recommend__stat {
    gap: 8px;
    font-size: 14px;
  }
}
.bk-recommend__stat-icon {
  width: 5.55556vw;
  aspect-ratio: 1;
}
@media (min-width: 1200px) {
  .bk-recommend__stat-icon {
    width: 18px;
  }
}
.bk-recommend__stat--accent {
  color: rgb(var(--color-accident));
  fill: rgb(var(--color-accident));
  stroke: rgb(var(--color-accident));
}
@media (min-width: 1200px) {
  .bk-recommend__stat--accent {
    font-weight: 500;
  }
  .bk-recommend__stat--accent .bk-recommend__stat-icon {
    width: 24px;
  }
}
.bk-recommend__label {
  font-weight: 500;
  color: rgb(var(--color-white));
  background: rgb(var(--color-accident));
  padding: 1.38889vw 1.66667vw 1.38889vw 0;
  border-radius: 0 1.66667vw 1.66667vw 0;
  position: relative;
  z-index: 2;
  line-height: 1.16667;
}
@media (min-width: 1200px) {
  .bk-recommend__label {
    background: none;
    color: rgb(var(--color-accident));
    border-radius: 6px 10px;
    border: 1px solid;
    padding: 6px;
    transform: skew(-12deg);
    margin: 0 3px 0 1px;
    font-size: 12px;
    font-weight: 400;
    text-align: center;
  }
}
.bk-recommend__label::before {
  content: "";
  position: absolute;
  width: 5.55556vw;
  height: 100%;
  top: 0;
  left: -2.5vw;
  z-index: -1;
  background: rgb(var(--color-accident));
  transform: skew(-10deg);
  border-radius: 1.11111vw 0 0 2.22222vw;
}
@media (min-width: 1200px) {
  .bk-recommend__label::before {
    display: none;
  }
}
@media (min-width: 1200px) {
  .bk-recommend__label-text {
    transform: skew(12deg);
  }
}

.bonuses {
  padding: 4.44444vw 3.33333vw;
  display: flex;
  flex-direction: column;
  gap: 3.33333vw;
  background: rgb(var(--color-bg-secondary));
  border-radius: 3.33333vw;
}
@media (min-width: 1200px) {
  .bonuses {
    padding: 30px 20px 20px;
    gap: 30px;
    border-radius: 20px;
  }
}
.bonuses__title {
  margin: 0;
  font-size: 5.55556vw;
  font-weight: 500;
  line-height: 1.2;
  color: rgb(var(--color-text-black));
}
@media (min-width: 1200px) {
  .bonuses__title {
    font-size: 24px;
    font-weight: 400;
    line-height: 1.16667;
    text-align: center;
  }
}
.bonuses__list {
  display: flex;
  flex-direction: column;
  gap: 2.77778vw;
}
@media (min-width: 1200px) {
  .bonuses__list {
    gap: 10px;
  }
}
.bonuses__link {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border: 0.27778vw solid rgb(var(--color-line-super-light-blue));
  border-radius: 3.33333vw;
  color: rgb(var(--color-text-black));
  text-decoration: none;
  padding: 3.88889vw;
  min-height: 13.88889vw;
  font-size: 3.88889vw;
  gap: 2.77778vw;
  white-space: nowrap;
}
.bonuses__link:hover, .bonuses__link:active {
  border-color: rgb(var(--color-text-L-blue));
}
@media (min-width: 1200px) {
  .bonuses__link {
    border-width: 1px;
    padding: 14px;
    font-size: 16px;
    min-height: 50px;
    border-radius: 12px;
    gap: 10px;
  }
}
.bonuses__name {
  flex: 1 0 0;
  text-overflow: ellipsis;
  overflow: hidden;
}
.bonuses__count {
  color: rgb(var(--color-text-gray));
}

.cta {
  padding: 3.33333vw;
  background: rgb(var(--color-white));
  border-radius: 5.55556vw;
  display: flex;
  flex-direction: column;
  gap: 3.33333vw;
  color: rgb(var(--color-black));
  text-decoration: none;
  text-align: center;
}
@media (min-width: 1200px) {
  .cta {
    padding: 12px;
    border-radius: 20px;
    gap: 12px;
    font-size: 14px;
    line-height: 1.21429;
  }
}
.cta__img {
  width: 100%;
  border-radius: 3.33333vw;
  height: 28.61111vw;
  object-fit: cover;
}
@media (min-width: 1200px) {
  .cta__img {
    border-radius: 12px;
    height: 114px;
  }
}
.cta__content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.11111vw;
}
@media (min-width: 1200px) {
  .cta__content {
    gap: 8px;
  }
}
.cta__title {
  font-size: 4.44444vw;
  font-weight: 500;
  margin: 0;
  line-height: 1.1875;
}
@media (min-width: 1200px) {
  .cta__title {
    font-size: 20px;
    font-weight: 500;
    line-height: 1.2;
  }
}
.cta__title--big {
  font-size: 5.55556vw;
  font-weight: 600;
  line-height: 1.2;
}
@media (min-width: 1200px) {
  .cta__title--big {
    font-size: 20px;
    font-weight: 500;
  }
}
.cta__description {
  margin: 0;
}
.cta__btn {
  margin-top: 1.11111vw;
  padding-left: 5.55556vw;
  padding-right: 5.55556vw;
}
@media (min-width: 1200px) {
  .cta__btn {
    margin-top: 4px;
    font-size: 14px;
    padding: 11px 14px;
    min-height: 48px;
    border-radius: 12px;
  }
}
.cta--dark {
  background: rgb(var(--color-bg-black));
  color: rgb(var(--color-white));
}
.cta--big {
  padding: 0;
  border-radius: 2.77778vw;
  gap: 0;
  font-size: 3.88889vw;
  line-height: 1.42857;
}
@media (min-width: 1200px) {
  .cta--big {
    padding: 0;
    gap: 0;
    border-radius: 20px;
    font-size: 16px;
    line-height: 1.5;
  }
}
.cta--big .cta__img {
  height: 79.44444vw;
  border-radius: 0;
  border-top-left-radius: inherit;
  border-top-right-radius: inherit;
}
@media (min-width: 1200px) {
  .cta--big .cta__img {
    height: 186px;
  }
}
.cta--big .cta__content {
  padding: 4.16667vw;
  gap: 2.22222vw;
}
@media (min-width: 1200px) {
  .cta--big .cta__content {
    padding: 20px;
    gap: 8px;
  }
}

.news-widget {
  margin: 0 4.44444vw;
  background: rgb(var(--color-bg-secondary));
  padding: 6.66666vw 3.33333vw 3.33333vw;
  border-radius: 5.55556vw;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3.33333vw;
}
@media (min-width: 1200px) {
  .news-widget {
    margin: 0;
    padding: 24px 12px 12px;
    border-radius: 20px;
    gap: 12px;
  }
}
.news-widget__title {
  margin: 0;
  font-size: 5.55556vw;
  font-weight: 500;
  line-height: 1.2;
}
@media (min-width: 1200px) {
  .news-widget__title {
    font-size: 20px;
  }
}
.news-widget__list {
  display: flex;
  flex-direction: column;
  gap: 2.22222vw;
  width: 100%;
}
@media (min-width: 1200px) {
  .news-widget__list {
    gap: 8px;
  }
}
.news-widget__link {
  background: rgb(var(--color-bg-main));
  color: rgb(var(--color-text-black));
  stroke: rgb(var(--color-gray));
  display: flex;
  align-items: center;
  justify-content: space-between;
  text-decoration: none;
  padding: 4.44444vw;
  gap: 2.77778vw;
  font-size: 3.88889vw;
  line-height: 1.21429;
  border-radius: 4.44444vw;
}
@media (min-width: 1200px) {
  .news-widget__link {
    gap: 10px;
    padding: 16px;
    border-radius: 16px;
    font-size: 14px;
  }
}
.news-widget__link-icon {
  width: 6.66667vw;
  aspect-ratio: 1;
  flex-shrink: 0;
}
@media (min-width: 1200px) {
  .news-widget__link-icon {
    width: 24px;
  }
}
.news-widget__more {
  font-weight: 400;
}

.qr {
  padding: 6.66667vw;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8.3333vw;
  border-radius: 3.33333vw;
  text-align: center;
  font-size: 4.44444vw;
  line-height: 1.1875;
  color: #A0AAC2;
  fill: rgb(var(--color-black));
  background: rgb(var(--color-bg-secondary));
}
@media (min-width: 1200px) {
  .qr {
    padding: 20px;
    gap: 30px;
    border-radius: 20px;
    font-size: 16px;
  }
}
.qr__img {
  width: 80.55556vw;
  height: 80.55556vw;
}
@media (min-width: 1200px) {
  .qr__img {
    width: 236px;
    height: 236px;
  }
}
.qr__text {
  margin: 0;
}

.categories-widget {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 5.5556vw;
  padding: 3.33333vw 2.22222vw 2.22222vw;
  background: var(--background-secondary);
}
@media (min-width: 1200px) {
  .categories-widget {
    gap: 20px;
    padding: 20px;
    border-radius: 20px;
  }
}
.categories-widget__group {
  width: 100%;
}
.categories-widget__sport {
  color: var(--text-gray);
  font-size: 3.8889vw;
  font-weight: 500;
  line-height: 4.7222vw;
}
@media (min-width: 1200px) {
  .categories-widget__sport {
    font-size: 16px;
    line-height: 19px;
  }
}
.categories-widget__items {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  width: 100%;
  gap: 1.1111vw;
  margin-top: 3.3333vw;
}
@media (min-width: 1200px) {
  .categories-widget__items {
    gap: 4px;
    margin-top: 16px;
  }
}
.categories-widget__item {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  box-sizing: border-box;
  width: 100%;
  gap: 2.7778vw;
  padding: 4.1667vw;
  border-radius: 4.4444vw;
  text-decoration: none;
  border: 1px solid var(--line-super-light-blue);
}
@media (min-width: 1200px) {
  .categories-widget__item {
    gap: 10px;
    padding: 15px;
    border-radius: 16px;
  }
}
.categories-widget__icon {
  display: block;
  width: 6.6667vw;
  height: 6.6667vw;
}
@media (min-width: 1200px) {
  .categories-widget__icon {
    width: 24px;
    height: 24px;
  }
}
.categories-widget__name {
  color: var(--text-black);
  font-size: 3.8889vw;
  font-weight: 400;
  line-height: 4.7222vw;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
@media (min-width: 1200px) {
  .categories-widget__name {
    font-size: 16px;
    line-height: 19px;
  }
}
.categories-widget__count {
  color: var(--text-gray);
  font-size: 4.4444vw;
  font-weight: 400;
  line-height: 5.2778vw;
}
@media (min-width: 1200px) {
  .categories-widget__count {
    font-size: 16px;
    line-height: 19px;
  }
}
.categories-widget__item.current {
  background-color: #1B1B1B;
  border-color: #1B1B1B;
}
.categories-widget__item.current .categories-widget__name {
  color: var(--colors-white);
}
.categories-widget__item.current .categories-widget__count {
  color: var(--Light-blue);
}

.subscription {
  background: rgb(var(--color-bg-secondary));
  border-radius: 4.44444vw;
  position: relative;
  overflow: hidden;
}
@media (min-width: 1200px) {
  .subscription {
    border-radius: 10px;
  }
}
.subscription__img {
  width: 100%;
  height: 112.5vw;
  display: block;
  object-fit: cover;
}
@media (min-width: 1200px) {
  .subscription__img {
    height: auto;
  }
}
.subscription__form {
  padding: 5.55556vw;
  display: flex;
  flex-direction: column;
  gap: 5.55556vw;
}
@media (min-width: 1200px) {
  .subscription__form {
    padding: 20px;
    gap: 20px;
  }
}
.subscription__title {
  font-size: 5.55556vw;
  font-weight: 500;
  line-height: 1.4;
  margin: 0;
}
@media (min-width: 1200px) {
  .subscription__title {
    font-size: 20px;
    line-height: 1.2;
  }
}
.subscription__elements {
  display: flex;
  flex-direction: column;
  gap: 2.77778vw;
}
@media (min-width: 1200px) {
  .subscription__elements {
    gap: 10px;
  }
}
@media (min-width: 1200px) {
  .subscription .subscription__field {
    --text-align: left;
  }
}
.subscription__checkbox {
  align-items: center;
  gap: 3.33333vw;
  color: rgb(var(--color-gray));
}
@media (min-width: 1200px) {
  .subscription__checkbox {
    align-items: flex-start;
    gap: 8px;
    font-size: 14px;
    line-height: 1.21429;
  }
}

.toc {
  padding: 4.44444vw 3.33333vw;
  display: flex;
  flex-direction: column;
  gap: 3.33333vw;
  background: rgb(var(--color-bg-secondary));
  border-radius: 3.33333vw;
}
@media (min-width: 1200px) {
  .toc {
    padding: 20px;
    gap: 20px;
    border-radius: 20px;
  }
}
.toc__title {
  margin: 0;
  font-size: 5.55556vw;
  font-weight: 500;
  line-height: 1.2;
  color: rgb(var(--color-text-black));
}
@media (min-width: 1200px) {
  .toc__title {
    font-size: 24px;
    font-weight: 400;
    text-align: center;
    line-height: 1.16667;
  }
}
.toc__list {
  display: flex;
  flex-direction: column;
  gap: 2.77778vw;
}
@media (min-width: 1200px) {
  .toc__list {
    gap: 8px;
  }
}
.toc__link {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  border: 0.27778vw solid rgb(var(--color-line-super-light-blue));
  border-radius: 3.33333vw;
  color: rgb(var(--color-text-black));
  text-decoration: none;
  padding: 3.88889vw;
  min-height: 13.88889vw;
  font-size: 3.88889vw;
  gap: 2.77778vw;
  white-space: nowrap;
}
.toc__link:hover, .toc__link:active {
  border-color: rgb(var(--color-text-L-blue));
}
@media (min-width: 1200px) {
  .toc__link {
    border-width: 1px;
    padding: 11px 14px;
    font-size: 16px;
    min-height: 48px;
    border-radius: 8px;
    gap: 10px;
  }
}
.toc__link-icon {
  width: 5vw;
  height: 5vw;
  fill: currentColor;
  margin-left: auto;
  flex-shrink: 0;
}
@media (min-width: 1200px) {
  .toc__link-icon {
    width: 18px;
    height: 18px;
  }
}
.toc__link-name {
  text-overflow: ellipsis;
  overflow: hidden;
}

.top-bet {
  padding: 10vw 3.33333vw 2.77778vw;
  border-radius: 5.55556vw;
  background: rgb(var(--color-bg-secondary));
  display: flex;
  flex-direction: column;
  gap: 4.44444vw;
  position: relative;
  overflow: hidden;
}
@media (min-width: 1200px) {
  .top-bet {
    padding: 36px 12px 10px;
    border-radius: 20px;
    gap: 16px;
  }
}
.top-bet__title {
  margin: 0;
  color: rgb(var(--color-primary));
  background: rgb(var(--color-primary)/0.1);
  position: absolute;
  top: 0;
  left: 0;
  font-size: 3.33333vw;
  font-weight: 500;
  padding: 1.94444vw 5.83333vw 2.5vw 4.72222vw;
  border-bottom-right-radius: 2.22222vw;
}
@media (min-width: 1200px) {
  .top-bet__title {
    font-size: 12px;
    padding: 7px 21px 9px 17px;
    border-bottom-right-radius: 8px;
  }
}
.top-bet__match {
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 2.22222vw;
  font-size: 3.88889vw;
  font-weight: 500;
  line-height: 1.21429;
}
@media (min-width: 1200px) {
  .top-bet__match {
    gap: 8px;
    font-size: 14px;
  }
}
.top-bet__time {
  color: rgb(var(--color-text-blue-gray));
}
.top-bet__win {
  padding-top: 4.44444vw;
  position: relative;
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 1.11111vw;
}
@media (min-width: 1200px) {
  .top-bet__win {
    padding-top: 16px;
    gap: 4px;
  }
}
.top-bet__win::before {
  content: "";
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 376 2' preserveAspectRatio='none'%3E%3Cpath d='M0 -1C-0.552285 -1 -1 -0.552285 -1 0C-1 0.552285 -0.552285 1 0 1V0V-1ZM376 1C376.552 1 377 0.552285 377 0C377 -0.552285 376.552 -1 376 -1V0V1ZM370.125 -1C369.573 -1 369.125 -0.552285 369.125 0C369.125 0.552285 369.573 1 370.125 1V0V-1ZM358.375 1C358.927 1 359.375 0.552285 359.375 0C359.375 -0.552285 358.927 -1 358.375 -1V0V1ZM346.625 -1C346.073 -1 345.625 -0.552285 345.625 0C345.625 0.552285 346.073 1 346.625 1V0V-1ZM334.875 1C335.427 1 335.875 0.552285 335.875 0C335.875 -0.552285 335.427 -1 334.875 -1V0V1ZM323.125 -1C322.573 -1 322.125 -0.552285 322.125 0C322.125 0.552285 322.573 1 323.125 1V0V-1ZM311.375 1C311.927 1 312.375 0.552285 312.375 0C312.375 -0.552285 311.927 -1 311.375 -1V0V1ZM299.625 -1C299.073 -1 298.625 -0.552285 298.625 0C298.625 0.552285 299.073 1 299.625 1V0V-1ZM287.875 1C288.427 1 288.875 0.552285 288.875 0C288.875 -0.552285 288.427 -1 287.875 -1V0V1ZM276.125 -1C275.573 -1 275.125 -0.552285 275.125 0C275.125 0.552285 275.573 1 276.125 1V0V-1ZM264.375 1C264.927 1 265.375 0.552285 265.375 0C265.375 -0.552285 264.927 -1 264.375 -1V0V1ZM252.625 -1C252.073 -1 251.625 -0.552285 251.625 0C251.625 0.552285 252.073 1 252.625 1V0V-1ZM240.875 1C241.427 1 241.875 0.552285 241.875 0C241.875 -0.552285 241.427 -1 240.875 -1V0V1ZM229.125 -1C228.573 -1 228.125 -0.552285 228.125 0C228.125 0.552285 228.573 1 229.125 1V0V-1ZM217.375 1C217.927 1 218.375 0.552285 218.375 0C218.375 -0.552285 217.927 -1 217.375 -1V0V1ZM205.625 -1C205.073 -1 204.625 -0.552285 204.625 0C204.625 0.552285 205.073 1 205.625 1V0V-1ZM193.875 1C194.427 1 194.875 0.552285 194.875 0C194.875 -0.552285 194.427 -1 193.875 -1V0V1ZM182.125 -1C181.573 -1 181.125 -0.552285 181.125 0C181.125 0.552285 181.573 1 182.125 1V0V-1ZM170.375 1C170.927 1 171.375 0.552285 171.375 0C171.375 -0.552285 170.927 -1 170.375 -1V0V1ZM158.625 -1C158.073 -1 157.625 -0.552285 157.625 0C157.625 0.552285 158.073 1 158.625 1V0V-1ZM146.875 1C147.427 1 147.875 0.552285 147.875 0C147.875 -0.552285 147.427 -1 146.875 -1V0V1ZM135.125 -1C134.573 -1 134.125 -0.552285 134.125 0C134.125 0.552285 134.573 1 135.125 1V0V-1ZM123.375 1C123.927 1 124.375 0.552285 124.375 0C124.375 -0.552285 123.927 -1 123.375 -1V0V1ZM111.625 -1C111.073 -1 110.625 -0.552285 110.625 0C110.625 0.552285 111.073 1 111.625 1V0V-1ZM99.875 1C100.427 1 100.875 0.552285 100.875 0C100.875 -0.552285 100.427 -1 99.875 -1V0V1ZM88.125 -1C87.5727 -1 87.125 -0.552285 87.125 0C87.125 0.552285 87.5727 1 88.125 1V0V-1ZM76.375 1C76.9273 1 77.375 0.552285 77.375 0C77.375 -0.552285 76.9273 -1 76.375 -1V0V1ZM64.625 -1C64.0727 -1 63.625 -0.552285 63.625 0C63.625 0.552285 64.0727 1 64.625 1V0V-1ZM52.875 1C53.4273 1 53.875 0.552285 53.875 0C53.875 -0.552285 53.4273 -1 52.875 -1V0V1ZM41.125 -1C40.5727 -1 40.125 -0.552285 40.125 0C40.125 0.552285 40.5727 1 41.125 1V0V-1ZM29.375 1C29.9273 1 30.375 0.552285 30.375 0C30.375 -0.552285 29.9273 -1 29.375 -1V0V1ZM17.625 -1C17.0727 -1 16.625 -0.552285 16.625 0C16.625 0.552285 17.0727 1 17.625 1V0V-1ZM5.875 1C6.42728 1 6.875 0.552285 6.875 0C6.875 -0.552285 6.42728 -1 5.875 -1V0V1ZM376 0V-1H370.125V0V1H376V0ZM358.375 0V-1H346.625V0V1H358.375V0ZM334.875 0V-1H323.125V0V1H334.875V0ZM311.375 0V-1H299.625V0V1H311.375V0ZM287.875 0V-1H276.125V0V1H287.875V0ZM264.375 0V-1H252.625V0V1H264.375V0ZM240.875 0V-1H229.125V0V1H240.875V0ZM217.375 0V-1H205.625V0V1H217.375V0ZM193.875 0V-1H182.125V0V1H193.875V0ZM170.375 0V-1H158.625V0V1H170.375V0ZM146.875 0V-1H135.125V0V1H146.875V0ZM123.375 0V-1H111.625V0V1H123.375V0ZM99.875 0V-1H88.125V0V1H99.875V0ZM76.375 0V-1H64.625V0V1H76.375V0ZM52.875 0V-1H41.125V0V1H52.875V0ZM29.375 0V-1H17.625V0V1H29.375V0ZM5.875 0V-1H0V0V1H5.875V0ZM0 -2C-1.10457 -2 -2 -1.10457 -2 0C-2 1.10457 -1.10457 2 0 2V0V-2ZM376 2C377.105 2 378 1.10457 378 0C378 -1.10457 377.105 -2 376 -2V0V2ZM370.125 -2C369.02 -2 368.125 -1.10457 368.125 0C368.125 1.10457 369.02 2 370.125 2V0V-2ZM358.375 2C359.48 2 360.375 1.10457 360.375 0C360.375 -1.10457 359.48 -2 358.375 -2V0V2ZM346.625 -2C345.52 -2 344.625 -1.10457 344.625 0C344.625 1.10457 345.52 2 346.625 2V0V-2ZM334.875 2C335.98 2 336.875 1.10457 336.875 0C336.875 -1.10457 335.98 -2 334.875 -2V0V2ZM323.125 -2C322.02 -2 321.125 -1.10457 321.125 0C321.125 1.10457 322.02 2 323.125 2V0V-2ZM311.375 2C312.48 2 313.375 1.10457 313.375 0C313.375 -1.10457 312.48 -2 311.375 -2V0V2ZM299.625 -2C298.52 -2 297.625 -1.10457 297.625 0C297.625 1.10457 298.52 2 299.625 2V0V-2ZM287.875 2C288.98 2 289.875 1.10457 289.875 0C289.875 -1.10457 288.98 -2 287.875 -2V0V2ZM276.125 -2C275.02 -2 274.125 -1.10457 274.125 0C274.125 1.10457 275.02 2 276.125 2V0V-2ZM264.375 2C265.48 2 266.375 1.10457 266.375 0C266.375 -1.10457 265.48 -2 264.375 -2V0V2ZM252.625 -2C251.52 -2 250.625 -1.10457 250.625 0C250.625 1.10457 251.52 2 252.625 2V0V-2ZM240.875 2C241.98 2 242.875 1.10457 242.875 0C242.875 -1.10457 241.98 -2 240.875 -2V0V2ZM229.125 -2C228.02 -2 227.125 -1.10457 227.125 0C227.125 1.10457 228.02 2 229.125 2V0V-2ZM217.375 2C218.48 2 219.375 1.10457 219.375 0C219.375 -1.10457 218.48 -2 217.375 -2V0V2ZM205.625 -2C204.52 -2 203.625 -1.10457 203.625 0C203.625 1.10457 204.52 2 205.625 2V0V-2ZM193.875 2C194.98 2 195.875 1.10457 195.875 0C195.875 -1.10457 194.98 -2 193.875 -2V0V2ZM182.125 -2C181.02 -2 180.125 -1.10457 180.125 0C180.125 1.10457 181.02 2 182.125 2V0V-2ZM170.375 2C171.48 2 172.375 1.10457 172.375 0C172.375 -1.10457 171.48 -2 170.375 -2V0V2ZM158.625 -2C157.52 -2 156.625 -1.10457 156.625 0C156.625 1.10457 157.52 2 158.625 2V0V-2ZM146.875 2C147.98 2 148.875 1.10457 148.875 0C148.875 -1.10457 147.98 -2 146.875 -2V0V2ZM135.125 -2C134.02 -2 133.125 -1.10457 133.125 0C133.125 1.10457 134.02 2 135.125 2V0V-2ZM123.375 2C124.48 2 125.375 1.10457 125.375 0C125.375 -1.10457 124.48 -2 123.375 -2V0V2ZM111.625 -2C110.52 -2 109.625 -1.10457 109.625 0C109.625 1.10457 110.52 2 111.625 2V0V-2ZM99.875 2C100.98 2 101.875 1.10457 101.875 0C101.875 -1.10457 100.98 -2 99.875 -2V0V2ZM88.125 -2C87.0204 -2 86.125 -1.10457 86.125 0C86.125 1.10457 87.0204 2 88.125 2V0V-2ZM76.375 2C77.4796 2 78.375 1.10457 78.375 0C78.375 -1.10457 77.4796 -2 76.375 -2V0V2ZM64.625 -2C63.5204 -2 62.625 -1.10457 62.625 0C62.625 1.10457 63.5204 2 64.625 2V0V-2ZM52.875 2C53.9796 2 54.875 1.10457 54.875 0C54.875 -1.10457 53.9796 -2 52.875 -2V0V2ZM41.125 -2C40.0204 -2 39.125 -1.10457 39.125 0C39.125 1.10457 40.0204 2 41.125 2V0V-2ZM29.375 2C30.4796 2 31.375 1.10457 31.375 0C31.375 -1.10457 30.4796 -2 29.375 -2V0V2ZM17.625 -2C16.5204 -2 15.625 -1.10457 15.625 0C15.625 1.10457 16.5204 2 17.625 2V0V-2ZM5.875 2C6.97957 2 7.875 1.10457 7.875 0C7.875 -1.10457 6.97957 -2 5.875 -2V0V2ZM376 0V-2H370.125V0V2H376V0ZM358.375 0V-2H346.625V0V2H358.375V0ZM334.875 0V-2H323.125V0V2H334.875V0ZM311.375 0V-2H299.625V0V2H311.375V0ZM287.875 0V-2H276.125V0V2H287.875V0ZM264.375 0V-2H252.625V0V2H264.375V0ZM240.875 0V-2H229.125V0V2H240.875V0ZM217.375 0V-2H205.625V0V2H217.375V0ZM193.875 0V-2H182.125V0V2H193.875V0ZM170.375 0V-2H158.625V0V2H170.375V0ZM146.875 0V-2H135.125V0V2H146.875V0ZM123.375 0V-2H111.625V0V2H123.375V0ZM99.875 0V-2H88.125V0V2H99.875V0ZM76.375 0V-2H64.625V0V2H76.375V0ZM52.875 0V-2H41.125V0V2H52.875V0ZM29.375 0V-2H17.625V0V2H29.375V0ZM5.875 0V-2H0V0V2H5.875V0Z' fill='%23D2DCF4'/%3E%3C/svg%3E") repeat-x center/104.44444vw 0.55556vw;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 0.55556vw;
}
@media (min-width: 1200px) {
  .top-bet__win::before {
    background-size: 376px 2px;
    height: 2px;
  }
}
.top-bet__win-sum {
  font-size: 8.88889vw;
  font-weight: 700;
  color: rgb(var(--color-accident));
  line-height: 1.1875;
}
@media (min-width: 1200px) {
  .top-bet__win-sum {
    font-size: 32px;
  }
}
.top-bet__win-info {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2.77778vw;
  color: rgb(var(--color-gray));
  stroke: rgb(var(--color-gray));
}
@media (min-width: 1200px) {
  .top-bet__win-info {
    gap: 10px;
    font-size: 14px;
  }
}
.top-bet__win-icon {
  width: 6.66667vw;
  aspect-ratio: 1;
  margin-right: -5.55556vw;
}
@media (min-width: 1200px) {
  .top-bet__win-icon {
    width: 24px;
    margin-right: -20px;
  }
}
.top-bet__bottom {
  background: rgb(var(--color-bg-main));
  border-radius: 4.44444vw;
  padding: 3.33333vw;
  display: flex;
  flex-direction: column;
  gap: 3.33333vw;
}
@media (min-width: 1200px) {
  .top-bet__bottom {
    padding: 12px;
    border-radius: 16px;
    gap: 12px;
  }
}
.top-bet__details {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
.top-bet__author {
  display: flex;
  align-items: center;
  gap: 4.16667vw;
}
@media (min-width: 1200px) {
  .top-bet__author {
    gap: 10px;
  }
}
.top-bet__author-img {
  width: 11.11111vw;
  height: 11.11111vw;
  border-radius: 30vw;
}
@media (min-width: 1200px) {
  .top-bet__author-img {
    width: 40px;
    height: 40px;
    border-radius: 100px;
  }
}
.top-bet__author-meta {
  display: flex;
  flex-direction: column;
  gap: 1.38889vw;
}
@media (min-width: 1200px) {
  .top-bet__author-meta {
    gap: 5px;
  }
}
.top-bet__author-name {
  font-size: 3.88889vw;
  font-weight: 500;
  line-height: 1.21429;
}
@media (min-width: 1200px) {
  .top-bet__author-name {
    font-size: 14px;
  }
}
.top-bet__author-bet {
  line-height: 1.16667;
}
@media (min-width: 1200px) {
  .top-bet__author-bet {
    font-size: 0;
  }
}
.top-bet__bet-type {
  font-weight: 500;
  color: rgb(var(--color-primary));
}
@media (min-width: 1200px) {
  .top-bet__bet-type {
    font-size: 12px;
  }
}
.top-bet__bookmaker {
  display: flex;
  align-items: center;
  gap: 3.05556vw;
  font-size: 3.88889vw;
  font-weight: 500;
  color: rgb(var(--color-primary));
  position: relative;
  border-top: 0.27778vw solid rgb(var(--color-line-super-light-blue));
  border-bottom: 0.27778vw solid rgb(var(--color-line-super-light-blue));
  padding: 0.83333vw 0.83333vw 0.83333vw 0.27778vw;
  margin-right: 1.38889vw;
}
@media (min-width: 1200px) {
  .top-bet__bookmaker {
    gap: 11px;
    font-size: 14px;
    border-width: 1px;
    margin-right: 6px;
    padding: 3px 2px 3px 0px;
  }
}
.top-bet__bookmaker::before {
  content: "";
  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 11 28' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11 27.5H8.7666C4.03138 27.5 0.480835 23.166 1.41309 18.5234L3.82324 6.52344C4.50472 3.12992 7.4133 0.658914 10.8428 0.507812' stroke='%23D2DCF4'/%3E%3C/svg%3E") no-repeat center/3.05556vw 7.77778vw;
  position: absolute;
  top: -0.27778vw;
  left: -2.77778vw;
  width: 3.05556vw;
  height: 7.77778vw;
}
@media (min-width: 1200px) {
  .top-bet__bookmaker::before {
    width: 11px;
    height: 28px;
    top: -1px;
    left: -11px;
    background-size: 11px 28px;
  }
}
.top-bet__bookmaker::after {
  content: "";
  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 9 28' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0.123 0.5C4.2651 0.500067 7.623 3.85791 7.623 8V20C7.623 24.1421 4.2651 27.4999 0.123 27.5' stroke='%23D2DCF4'/%3E%3C/svg%3E") no-repeat center/2.5vw 7.77778vw;
  position: absolute;
  top: -0.27778vw;
  right: -2.22222vw;
  width: 2.5vw;
  height: 7.77778vw;
}
@media (min-width: 1200px) {
  .top-bet__bookmaker::after {
    width: 8px;
    height: 28px;
    background-size: 9px 28px;
    top: -1px;
    right: -8px;
  }
}
.top-bet__bookmaker-logo {
  height: 5.55556vw;
  max-width: 30.55556vw;
}
@media (min-width: 1200px) {
  .top-bet__bookmaker-logo {
    height: 20px;
    max-width: 40px;
  }
}
.top-bet__actions {
  display: flex;
  flex-direction: column;
  gap: 2.22222vw;
}
@media (min-width: 1200px) {
  .top-bet__actions {
    gap: 8px;
  }
}
.top-bet__btns {
  display: flex;
  gap: 2.22222vw;
}
@media (min-width: 1200px) {
  .top-bet__btns {
    gap: 8px;
  }
}
.top-bet__bet {
  flex-grow: 1;
}
.top-bet__bonus {
  padding-left: 5.55556vw;
  padding-right: 5.55556vw;
}
@media (min-width: 1200px) {
  .top-bet__bonus {
    padding-left: 23px;
    padding-right: 23px;
  }
}
@media (min-width: 1200px) {
  .top-bet__bonus span {
    display: none;
  }
}

.header {
  padding: 2.77777vw 3.88888vw;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  transition: 0.3s;
  z-index: 12;
}
@media (min-width: 1200px) {
  .header {
    padding: 20px 0;
  }
}
.header.active {
  background: rgb(var(--color-white));
  box-shadow: 0px 1px 4px #E3EBFC, 0px 24px 48px rgba(230, 235, 245, 0.4);
}
@media (min-width: 1200px) {
  .header.active {
    padding-top: 12px;
    padding-bottom: 12px;
  }
}
@media (min-width: 1200px) {
  .header.active .header__logo {
    height: 40px;
  }
}
.header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
@media (min-width: 1200px) {
  .header__inner {
    width: 1200px;
    margin: 0 auto;
  }
}
.header__logo {
  height: 6.66666vw;
}
@media (min-width: 1200px) {
  .header__logo {
    height: 60px;
  }
}
.header__logo-img {
  display: block;
  height: 100%;
}
.header__nav {
  display: none;
}
@media (min-width: 1200px) {
  .header__nav {
    display: block;
  }
  .header__nav-list {
    display: flex;
    gap: 36px;
  }
  .header__nav-link {
    font-weight: 500;
    text-decoration: none;
    color: rgb(var(--color-text-black));
  }
  .header__nav-link:hover {
    color: rgb(var(--color-primary));
  }
}
@media (min-width: 1200px) {
  .header__right {
    display: flex;
    gap: 20px;
    align-items: center;
  }
}
.header-group {
  display: flex;
  align-items: center;
  gap: 4.16666vw;
}
@media (min-width: 1200px) {
  .header-group {
    gap: 18px;
  }
}
.header-btns {
  display: flex;
  align-items: center;
  gap: 2.22222vw;
}
@media (min-width: 1200px) {
  .header-btns {
    gap: 8px;
  }
}
.header-btn {
  width: 6.66666vw;
  aspect-ratio: 1;
  background: none;
  border: none;
  padding: 0;
  fill: rgb(var(--color-black));
  stroke: rgb(var(--color-black));
  position: relative;
}
.header-btn__icon {
  display: block;
  width: 100%;
  aspect-ratio: 1;
  transition: 0.3s;
}
.header-btn__icon:nth-child(2) {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  visibility: hidden;
}
@media (min-width: 1200px) {
  .header-btn {
    width: 40px;
    padding: 8px;
    border-radius: 8px;
  }
  .header-btn--gray {
    background: rgb(var(--color-bg-L-gray));
  }
  .header-btn:hover {
    background: rgb(var(--color-primary));
    fill: rgb(var(--color-text-white));
    stroke: rgb(var(--color-text-white));
  }
  .header-btn:active {
    background: #A2CBFF;
    fill: rgb(var(--color-text-white));
    stroke: rgb(var(--color-text-white));
  }
  .header-btn[disabled] {
    fill: rgb(var(--color-text-gray));
    stroke: rgb(var(--color-text-gray));
    background: rgb(var(--color-bg-gray));
    cursor: default;
    pointer-events: none;
  }
  .header-btn__icon {
    width: 24px;
  }
  .header-btn__icon:nth-child(2) {
    top: calc(50% - 12px);
    left: calc(50% - 12px);
  }
}
.header-gift {
  position: relative;
}
.header-gift__btn {
  z-index: 2;
}
.header-gift__btn.active {
  fill: rgb(var(--color-primary));
  stroke: rgb(var(--color-primary));
  background: none;
}
.header-gift__content {
  position: absolute;
  top: 0;
  left: 50%;
  width: 65vw;
  padding: 2.22222vw;
  border-radius: 5.55556vw;
  background: rgb(var(--color-white));
  box-shadow: 0 clamp(1px, .27777vw, .27777vw) 1.11111vw #E3EBFC, 0 6.66667vw 13.33333vw rgba(230, 235, 245, 0.4);
  overflow: hidden;
  opacity: 0;
  visibility: hidden;
  transition: 0.3s;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  gap: 4.44444vw;
}
@media (min-width: 1200px) {
  .header-gift__content {
    width: 234px;
    padding: 8px;
    border-radius: 20px;
    box-shadow: 0 1px 4px #E3EBFC, 0 24px 48px rgba(230, 235, 245, 0.4);
    gap: 16px;
  }
}
.header-gift__content.active {
  top: calc(100% + 2.22222vw);
  opacity: 1;
  visibility: visible;
}
@media (min-width: 1200px) {
  .header-gift__content.active {
    top: calc(100% + 8px);
  }
}
.header-gift__logo {
  width: 35.55556vw;
  height: 8.88889vw;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 3.33333vw auto 0;
}
@media (min-width: 1200px) {
  .header-gift__logo {
    width: 128px;
    height: 32px;
    margin-top: 12px;
  }
}
.header-gift__logo-img {
  max-width: 100%;
  max-height: 100%;
}
.header-gift__title {
  text-align: center;
  font-size: 3.88889vw;
  line-height: 1.21429;
}
@media (min-width: 1200px) {
  .header-gift__title {
    font-size: 14px;
  }
}
@media (min-width: 1200px) {
  .header__menu {
    position: relative;
  }
  .header__menu-btn {
    z-index: 2;
  }
  .header__menu-list {
    position: absolute;
    top: 0;
    right: 0;
    width: 200px;
    padding: 4px 0;
    border-radius: 12px;
    background: rgb(var(--color-white));
    box-shadow: 0 24px 48px rgba(230, 235, 245, 0.4), 0 1px 4px #E3EBFC;
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    transition: 0.3s;
  }
  .header__menu-link {
    display: block;
    color: rgb(var(--color-black));
    text-decoration: none;
    font-weight: 500;
    padding: 14px 20px;
    line-height: 1.1875;
  }
  .header__menu-link:hover {
    background: rgb(var(--color-bg-blue));
    color: rgb(var(--color-primary));
  }
  .header__menu.active .header-btn {
    background: rgb(var(--color-primary));
    fill: rgb(var(--color-text-white));
    stroke: rgb(var(--color-text-white));
  }
  .header__menu.active .header-btn__icon {
    opacity: 0;
    visibility: hidden;
  }
  .header__menu.active .header-btn__icon:nth-child(2) {
    opacity: 1;
    visibility: visible;
  }
  .header__menu.active .header__menu-list {
    top: calc(100% + 8px);
    opacity: 1;
    visibility: visible;
  }
}

.login-btn {
  display: block;
  background: none;
  font-size: 2.77777vw;
  font-weight: 500;
  font-style: italic;
  padding: 1.38888vw 3.88888vw;
  position: relative;
  border: none;
  text-transform: uppercase;
  --login-btn-bg: transparent;
  --login-btn-color: rgb(var(--color-primary));
  --login-btn-border: rgb(var(--color-primary));
  color: var(--login-btn-color);
}
.login-btn::before {
  content: "";
  border: 0.325vw solid var(--login-btn-border);
  background: var(--login-btn-bg);
  border-radius: 1.16111vw;
  position: absolute;
  top: clamp(-.27777vw, -.27777vw, -1px);
  left: 1.38888vw;
  width: calc(100% - 1.11111vw);
  height: calc(100% + .55555vw);
  transform: skewX(-10deg);
  transform-origin: 0 0;
  z-index: -1;
  transition: 0.3s ease-in-out;
}
.login-btn:hover {
  --login-btn-bg: rgb(var(--color-primary));
  --login-btn-color: rgb(var(--color-text-white));
}
.login-btn:active {
  --login-btn-bg: rgb(var(--color-light-blue));
  --login-btn-color: rgb(var(--color-text-white));
  --login-btn-border: rgb(var(--color-light-blue));
}
.login-btn[disabled] {
  --login-btn-bg: transparent;
  --login-btn-color: rgb(var(--color-text-white));
  --login-btn-border: rgb(var(--color-text-white));
  cursor: default;
}
@media (min-width: 1200px) {
  .login-btn {
    font-size: 15px;
    padding: 11px 42px;
  }
  .login-btn::before {
    border-width: 2px;
    border-radius: 7px;
    top: -1px;
    left: 8px;
    width: calc(100% - 9px);
    height: calc(100% + 1px);
  }
}

.language-selector {
  position: relative;
  z-index: 2;
}
.language-selector__btn {
  padding: 1.94444vw 3.05556vw;
  display: flex;
  align-items: center;
  gap: 2.22222vw;
  border-radius: 3.33333vw;
  border: clamp(1px, .27777vw, .27777vw) solid rgb(var(--color-bg-gray));
  background: rgb(var(--color-bg-gray));
  font-weight: 500;
  position: relative;
  z-index: 2;
}
@media (min-width: 1200px) {
  .language-selector__btn {
    gap: 8px;
    padding: 7px 11px;
    border-radius: 8px;
    background: rgb(var(--color-bg-L-gray));
    border-color: rgb(var(--color-bg-L-gray));
    border-width: 1px;
    font-size: 12px;
    font-weight: 400;
  }
}
.language-selector__btn:hover {
  background: rgb(var(--color-line-super-light-blue));
  border-color: rgb(var(--color-line-super-light-blue));
}
@media (min-width: 1200px) {
  .language-selector__btn:hover {
    background: rgb(var(--color-line-gray));
    border-color: rgb(var(--color-line-gray));
  }
}
.language-selector__btn.active {
  border-color: rgb(var(--color-primary));
  background: rgb(var(--color-bg-gray));
}
.language-selector__btn.active + .language-selector__list {
  top: calc(100% + 1.11111vw);
  opacity: 1;
  visibility: visible;
}
@media (min-width: 1200px) {
  .language-selector__btn.active + .language-selector__list {
    top: calc(100% + 4px);
  }
}
.language-selector__btn.active .language-selector__dropdown {
  transform: rotate(180deg);
  fill: rgb(var(--color-black));
}
.language-selector__current {
  display: flex;
  align-items: center;
  gap: 1.11111vw;
}
@media (min-width: 1200px) {
  .language-selector__current {
    gap: 4px;
  }
}
.language-selector__flag {
  width: 6.66667vw;
  aspect-ratio: 1;
}
@media (min-width: 1200px) {
  .language-selector__flag {
    width: 24px;
  }
}
.language-selector__dropdown {
  width: 4.44444vw;
  aspect-ratio: 1;
  fill: rgb(var(--color-gray));
  transition: 0.3s ease-in-out;
}
@media (min-width: 1200px) {
  .language-selector__dropdown {
    width: 14px;
    fill: rgb(var(--color-black));
  }
}
.language-selector__list {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  opacity: 0;
  visibility: hidden;
  transition: 0.3s ease-in-out;
  background: rgb(var(--color-bg-secondary));
  border-radius: 3.33333vw;
  overflow: hidden;
}
@media (min-width: 1200px) {
  .language-selector__list {
    border-radius: 8px;
    background: rgb(var(--color-bg-main));
  }
}
.language-selector__list::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: clamp(1px, .27777vw, .27777vw) solid rgb(var(--color-line-super-light-blue));
  border-radius: inherit;
}
@media (min-width: 1200px) {
  .language-selector__list::before {
    border-width: 1px;
  }
}
.language-selector__link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2.22222vw;
  padding: 2.22222vw 4.16667vw;
  color: rgb(var(--color-text-black));
  text-decoration: none;
  position: relative;
  z-index: 2;
}
@media (min-width: 1200px) {
  .language-selector__link {
    padding: 8px 15px;
    gap: 12px;
    font-size: 12px;
  }
}
.language-selector__link:hover {
  background: rgb(var(--color-text-L-blue)/0.1);
}
.language-selector__link-icon {
  width: 6.66667vw;
  aspect-ratio: 1;
  flex-shrink: 0;
}
@media (min-width: 1200px) {
  .language-selector__link-icon {
    width: 24px;
  }
}

.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));
}

.layout {
  display: contents;
}
@media (min-width: 1200px) {
  .layout {
    display: flex;
    gap: 24px;
  }
}
.layout__content {
  display: contents;
}
@media (min-width: 1200px) {
  .layout__content {
    display: flex;
    flex-direction: column;
    gap: 20px;
    flex: 1 1 0;
    width: 0;
  }
  .layout__content .layout__sidebar {
    width: 285px;
  }
}
.layout__sidebar {
  display: contents;
}
@media (min-width: 1200px) {
  .layout__sidebar {
    display: flex;
    flex-direction: column;
    gap: 10px;
    flex-shrink: 0;
    width: 276px;
  }
}

.section {
  background: rgb(var(--color-bg-secondary));
  padding: 3.33333vw 2.22222vw 2.22222vw;
  border-radius: 4.44444vw;
  gap: 3.33333vw;
  display: flex;
  flex-direction: column;
}
@media (min-width: 1200px) {
  .section {
    padding: 20px;
    border-radius: 20px;
    gap: 24px;
  }
}
.section__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 3.33333vw;
}
@media (min-width: 1200px) {
  .section__header {
    gap: 24px;
  }
}
.section__header-left {
  display: flex;
  align-items: center;
  gap: 2.22222vw;
}
@media (min-width: 1200px) {
  .section__header-left {
    gap: 10px;
  }
}
.section__header-right {
  display: flex;
  align-items: center;
  gap: 2.22222vw;
  flex-shrink: 0;
}
@media (min-width: 1200px) {
  .section__header-right {
    gap: 10px;
  }
}
@media (max-width: 1199.98px) {
  .section__header-link {
    gap: 2.22222vw;
    font-size: 3.33333vw;
    border: none;
    background: none;
    padding: 0;
    border-radius: 0;
    min-height: auto;
    font-weight: 400;
    color: rgb(var(--color-gray));
    fill: rgb(var(--color-gray));
    stroke: rgb(var(--color-gray));
  }
  .section__header-link:hover, .section__header-link:active {
    border: none;
    background: none;
    color: rgb(var(--color-gray));
    fill: rgb(var(--color-gray));
    stroke: rgb(var(--color-gray));
  }
  .section__header-link .btn__icon {
    width: 3.88889vw;
  }
}
.section__title {
  font-size: 5.55555vw;
  font-weight: 500;
  line-height: 1.2;
  color: rgb(var(--color-text-black));
  margin: 0;
}
.section__title--sm-small {
  font-size: 3.88889vw;
}
@media (min-width: 1200px) {
  .section__title {
    font-size: 24px;
  }
}
.section__counter {
  background: rgb(var(--color-bg-main));
  color: rgb(var(--color-text-blue-gray));
  height: 10vw;
  min-width: 10vw;
  border-radius: 30vw;
  font-size: 3.88888vw;
  line-height: 10vw;
  text-align: center;
  padding: 0 1.11111vw;
}
@media (min-width: 1200px) {
  .section__counter {
    min-width: 40px;
    height: 40px;
    line-height: 40px;
    font-size: 16px;
    border-radius: 100px;
    padding: 0 4px;
  }
}
.section__slider-btns {
  display: flex;
  align-items: center;
  gap: 0.55556vw;
}
@media (min-width: 1200px) {
  .section__slider-btns {
    gap: 4px;
  }
}
.section__slider-btn {
  width: 6.66667vw;
  aspect-ratio: 1;
  background: rgb(var(--color-bg-main));
  fill: rgb(var(--color-gray));
  stroke: rgb(var(--color-gray));
  border: none;
  padding: 1.66667vw;
  border-radius: 2.22222vw;
}
@media (min-width: 1200px) {
  .section__slider-btn {
    width: 48px;
    border-radius: 12px;
    padding: 12px;
  }
}
.section__slider-btn[data-direction=prev] {
  transform: rotate(180deg);
}
.section__slider-btn-icon {
  display: block;
  width: 100%;
  height: 100%;
}
.section__slider-btn[disabled] {
  opacity: 0.2;
  cursor: default;
  pointer-events: none;
}

.author {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 2.22222vw 3.33333vw;
  min-height: 15.55556vw;
  background: rgb(var(--color-bg-main));
  border-radius: 3.33333vw;
  gap: 1.11111vw;
}
@media (min-width: 1200px) {
  .author {
    background: none;
    padding: 0;
    min-height: auto;
    border-radius: 0;
    gap: 24px;
  }
}
.author__left {
  display: flex;
  align-items: center;
  gap: 1.80833vw;
  margin-left: 1.11111vw;
}
@media (min-width: 1200px) {
  .author__left {
    margin: 0;
    padding: 12px;
    gap: 10px;
  }
}
.author__img {
  width: 6.50556vw;
  height: 6.50556vw;
  border-radius: 50%;
}
@media (min-width: 1200px) {
  .author__img {
    width: 36px;
    height: 36px;
  }
}
.author__info {
  display: flex;
  flex-direction: column;
  gap: 0.72222vw;
}
@media (min-width: 1200px) {
  .author__info {
    gap: 4px;
  }
}
.author__name {
  margin: 0;
  font-size: 3.33333vw;
  font-weight: 500;
}
@media (min-width: 1200px) {
  .author__name {
    font-size: 14px;
    line-height: 1.21429;
  }
}
.author__meta {
  display: flex;
  gap: 4.44444vw;
}
@media (min-width: 1200px) {
  .author__meta {
    gap: 26px;
  }
}
.author__position {
  font-size: 2.53056vw;
  font-weight: 500;
  background: rgb(var(--color-L-green));
  color: rgb(var(--color-white));
  min-height: 4.33889vw;
  display: flex;
  align-items: center;
  border-radius: 0.55556vw 0 0 0.55556vw;
  padding: clamp(1px, .27777vw, .27777vw) 0 0 1.38889vw;
  position: relative;
  z-index: 2;
}
@media (min-width: 1200px) {
  .author__position {
    font-size: 14px;
    min-height: 24px;
    padding: 1px 0 0 7px;
    border-radius: 4px 0 0 4px;
  }
}
.author__position::after {
  content: "";
  background: rgb(var(--color-L-green));
  position: absolute;
  top: 0;
  right: -1.80556vw;
  width: 4.16667vw;
  height: 100%;
  transform-origin: left center;
  transform: skew(-12deg);
  border-radius: 0 0.55556vw clamp(1px, .27777vw, .27777vw) 0;
  z-index: -1;
}
@media (min-width: 1200px) {
  .author__position::after {
    right: -11px;
    width: 30px;
    border-radius: 0 4px 2px 0;
  }
}
.author__social {
  display: flex;
  align-items: center;
  gap: 1.36111vw;
  background: #0068DF;
  border-radius: 0 0.55556vw 0.55556vw 0;
  fill: rgb(var(--color-white));
  padding: clamp(1px, .27777vw, .27777vw) 2.22222vw 0 0;
  min-height: 4.33889vw;
  position: relative;
  z-index: 2;
}
@media (min-width: 1200px) {
  .author__social {
    min-height: 24px;
    gap: 6px;
    border-radius: 0 4px 4px 0;
    padding: 1px 13px 0 0;
  }
}
.author__social::after {
  content: "";
  background: #0068DF;
  position: absolute;
  top: 0;
  left: -2.16667vw;
  width: 4.16667vw;
  height: 100%;
  transform-origin: left center;
  transform: skew(-12deg);
  border-radius: clamp(1px, .27777vw, .27777vw) 0 0 0.55556vw;
  z-index: -1;
}
@media (min-width: 1200px) {
  .author__social::after {
    left: -13px;
    width: 30px;
    border-radius: 2px 0 0 4px;
  }
}
.author__social-link {
  width: 2.77778vw;
  height: 1.94444vw;
  display: block;
}
@media (min-width: 1200px) {
  .author__social-link {
    width: 16px;
    height: 11px;
  }
}
.author__social-icon {
  display: block;
  width: 100%;
  height: 100%;
}
.author__share {
  flex-shrink: 0;
}
@media (max-width: 1199.98px) {
  .author__share {
    gap: 1.11111vw;
    font-size: 2.77778vw;
    font-weight: 400;
    padding: 2.22222vw 3.05556vw;
    min-height: auto;
    border-radius: 2.22222vw;
  }
}
@media (min-width: 1200px) {
  .author__share {
    padding-left: 19px;
    padding-right: 19px;
  }
}
@media (max-width: 1199.98px) {
  .author__share .btn__icon {
    width: 3.88889vw;
  }
}

.mobile-bar {
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  z-index: 17;
  background: rgb(var(--color-white));
  box-shadow: 0 clamp(-.27777vw, -.27777vw, -1px) 1.11111vw #E3EBFC, 0 -6.66667vw 13.33333vw rgba(230, 235, 245, 0.4);
  border-radius: 2.77778vw 2.77778vw 0 0;
  display: flex;
}
@media (min-width: 1200px) {
  .mobile-bar {
    display: none;
  }
}
.mobile-bar__item {
  flex: 1 0 0;
  width: 0;
}
.mobile-bar__item:first-child .mobile-bar__link {
  border-bottom-left-radius: 0;
}
.mobile-bar__item:last-child .mobile-bar__link {
  border-bottom-right-radius: 0;
}
.mobile-bar__link {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 1.38889vw;
  background: none;
  border: none;
  padding: 1.38889vw;
  font-size: 2.77778vw;
  line-height: 1.2;
  text-decoration: none;
  color: var(--text-gray);
  stroke: var(--text-gray);
  fill: var(--text-gray);
  width: 100%;
  height: 16.66667vw;
  border-radius: 2.77778vw;
}
.mobile-bar__link.active {
  background: rgb(var(--color-primary));
  color: rgb(var(--color-white));
  fill: rgb(var(--color-white));
  stroke: rgb(var(--color-white));
}
.mobile-bar__icon {
  width: 5.55556vw;
  aspect-ratio: 1;
}
.mobile-bar__text {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  width: 100%;
}

.overlay {
  position: fixed;
  top: calc(2.77777vw * 2 + 6.66666vw);
  left: 0;
  width: 100vw;
  height: calc(var(--vh, 1vh) * 100 - (2.77777vw * 2 + 6.66666vw));
  backdrop-filter: blur(6.66667vw);
  z-index: 15;
  opacity: 0;
  visibility: hidden;
  transition: 0.6s;
}
@media (min-width: 1200px) {
  .overlay {
    top: 0;
    height: 100vh;
  }
}
.overlay.active {
  opacity: 1;
  visibility: visible;
}

.modal {
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100vw;
  border-radius: 2.77778vw 2.77778vw 0 0;
  background: rgb(var(--color-bg-secondary));
  z-index: 20;
  padding: 8.33333vw 2.77778vw 5.55556vw;
  transform: translateY(100%);
  opacity: 0;
  visibility: hidden;
  transition: 0.6s;
  max-height: calc(var(--vh, 1vh) * 100 - (2.77777vw * 2 + 6.66666vw) - 7.42857vw);
}
@media (min-width: 1200px) {
  .modal {
    height: 100vh;
    max-height: none;
    overflow: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 20px;
    border-radius: 0;
    background: none;
    transform: translateY(100px);
    --modal-width: 408px;
  }
}
@media (max-width: 1199.98px) {
  .modal--under-mobile-menu {
    z-index: 16;
    padding: 13.88889vw 2.77778vw 25vw;
  }
  .modal--under-mobile-menu .modal__inner {
    max-height: calc(var(--vh, 1vh) * 100 - 12.2222vw - 7.42857vw - 13.88889vw - 25vw);
  }
  .modal--under-mobile-menu .modal__content {
    margin-bottom: -8.33333vw;
    padding-bottom: 8.33333vw;
  }
}
@media (min-width: 1200px) {
  .modal--big {
    --modal-width: 800px;
  }
}
.modal.active {
  transform: none;
  opacity: 1;
  visibility: visible;
}
.modal__inner {
  max-height: calc(var(--vh, 1vh) * 100 - (2.77777vw * 2 + 6.66666vw) - 7.42857vw - 8.33333vw - 5.55556vw);
  display: flex;
  flex-direction: column;
}
@media (min-width: 1200px) {
  .modal__inner {
    position: relative;
    max-width: calc(100vw - 40px);
    max-height: none;
    width: var(--modal-width);
    margin: auto;
    background: rgb(var(--color-bg-secondary));
    border-radius: 20px;
    padding: 30px;
  }
}
.modal__handle {
  position: absolute;
  top: 2.77778vw;
  left: calc(50% - 20.83333vw);
  width: 41.66667vw;
  height: 1.66667vw;
  background: var(--background-blue);
  border-radius: 2.77778vw;
}
@media (min-width: 1200px) {
  .modal__handle {
    display: none;
  }
}
.modal__close {
  position: absolute;
  top: 4.16667vw;
  right: 4.16667vw;
  width: 5.55556vw;
  aspect-ratio: 1;
  background: none;
  padding: 0;
  border: none;
  fill: rgb(var(--color-black));
}
@media (min-width: 1200px) {
  .modal__close {
    top: 30px;
    right: 30px;
    width: 24px;
  }
}
.modal__close:hover {
  fill: rgb(var(--color-primary));
}
.modal__close-icon {
  display: block;
  width: 100%;
  height: 100%;
}
.modal__content {
  overflow: auto;
  margin-bottom: -5.55556vw;
  padding-bottom: 5.55556vw;
}
@media (min-width: 1200px) {
  .modal__content {
    overflow: visible;
    margin: 0;
    padding: 0;
  }
}

.tooltip {
  --tooltip-size: 6.66667vw;
  position: relative;
  fill: rgb(var(--color-gray));
  stroke: rgb(var(--color-gray));
  color: rgb(var(--color-gray));
  font-size: 3.33333vw;
  font-weight: 400;
  position: relative;
}
@media (min-width: 1200px) {
  .tooltip {
    --tooltip-size: 24px;
    font-size: 16px;
  }
}
.tooltip__icon {
  width: var(--tooltip-size);
  height: var(--tooltip-size);
  display: block;
}
.tooltip__content {
  position: absolute;
  top: calc(100% + 3.33333vw);
  right: -2.77778vw;
  width: 52.77778vw;
  font-size: 3.33333vw;
  line-height: 1.16667;
  background: rgb(var(--color-bg-main));
  padding: 2.77778vw 4.44444vw;
  border-radius: 2.77778vw;
  box-shadow: 0 2.22222vw 2.22222vw rgba(0, 0, 0, 0.12);
  opacity: 0;
  visibility: hidden;
  transition: 0.3s;
  z-index: 2;
}
@media (min-width: 1200px) {
  .tooltip__content {
    top: calc(100% + 12px);
    right: -20px;
    width: 220px;
    font-size: 14px;
    padding: 14px 18px;
    border-radius: 10px;
    box-shadow: 0 8px 8px rgba(0, 0, 0, 0.12);
  }
}
.tooltip__content::before {
  content: "";
  position: absolute;
  top: -4.44444vw;
  right: 3.888889vw;
  border: 2.22222vw solid transparent;
  border-bottom-color: rgb(var(--color-bg-main));
}
@media (min-width: 1200px) {
  .tooltip__content::before {
    top: -16px;
    right: 24px;
    border-width: 8px;
  }
}
.tooltip:hover .tooltip__content {
  opacity: 1;
  visibility: visible;
}

.select {
  display: block;
  position: relative;
}
.select label {
  display: block;
  position: absolute;
  pointer-events: none;
  color: var(--text-gray);
  left: 3.3333vw;
  top: 2.6389vw;
  font-size: 2.7778vw;
  font-weight: 400;
  line-height: 3.3333vw;
  z-index: 3;
}
@media (min-width: 1200px) {
  .select label {
    left: 12px;
    top: 9.5px;
    font-size: 10px;
    line-height: 12px;
  }
}
.select select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background: transparent;
  border: none;
  outline: none;
  font: inherit;
  color: inherit;
  cursor: pointer;
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}
.select select::-ms-expand {
  display: none;
}
.select select:focus {
  outline: none;
}
.select select {
  display: block;
  width: 100%;
  color: var(--text-black);
  font-weight: 400;
  line-height: 1;
  padding: 3.3333vw 13.3333vw 0 3.3333vw;
  height: 13.3333vw;
  font-size: 3.8889vw;
  border-radius: 3.3333vw;
  background: var(--background-secondary) url("../../img/ui/select-arrow.svg") no-repeat right 3.3333vw center/6.6667vw auto;
  border: 1px solid var(--line-super-light-blue);
}
@media (min-width: 1200px) {
  .select select {
    padding: 12px 48px 0 12px;
    height: 48px;
    font-size: 14px;
    border-radius: 12px;
    background: var(--background-secondary) url("../../img/ui/select-arrow.svg") no-repeat right 12px center/24px auto;
  }
}

body {
  font-family: var(--font-family-main);
  font-size: 3.33333vw;
  color: rgb(var(--color-text-black));
  background: rgb(var(--color-bg-main));
}
@media (min-width: 1200px) {
  body {
    font-size: 16px;
  }
}

a,
button {
  cursor: pointer;
  transition: 0.3s ease-in-out;
}

.hidden {
  display: none !important;
}
@media (max-width: 1199.98px) {
  .hidden-sm {
    display: none !important;
  }
}
@media (min-width: 1200px) {
  .hidden-lg {
    display: none !important;
  }
}

.wrapper {
  display: flex;
  flex-direction: column;
  gap: 3.33333vw;
}
@media (min-width: 1200px) {
  .wrapper {
    width: 1200px;
    margin: 0 auto;
    gap: 20px;
  }
}

.main {
  display: flex;
  flex-direction: column;
  gap: 3.33333vw;
  padding-top: calc(2.77777vw * 2 + 6.66666vw + 3.33333vw);
}
@media (min-width: 1200px) {
  .main {
    gap: 20px;
    padding-top: calc(100px + 16px);
  }
}

.c-scrollbar {
  --color-track: #e6f0fc;
  --color-thumb: #cfe2f9;
  --color-thumb-hover: #b8d4f7;
  scrollbar-width: thin;
  scrollbar-color: var(--color-thumb) var(--color-track);
}
.c-scrollbar::-webkit-scrollbar-button {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}
.c-scrollbar::-webkit-scrollbar-button:start:decrement, .c-scrollbar::-webkit-scrollbar-button:end:increment {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}
.c-scrollbar::-webkit-scrollbar-button:horizontal:start:decrement, .c-scrollbar::-webkit-scrollbar-button:horizontal:end:increment {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}
.c-scrollbar::-webkit-scrollbar-button:vertical:start:decrement, .c-scrollbar::-webkit-scrollbar-button:vertical:end:increment {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}
.c-scrollbar::-webkit-scrollbar {
  width: 8px;
  height: 8px;
  -webkit-appearance: none;
}
.c-scrollbar::-webkit-scrollbar-track {
  background: var(--color-track);
  border-radius: 10px;
  margin: 0;
  padding: 0;
}
.c-scrollbar::-webkit-scrollbar-thumb {
  background: var(--color-thumb);
  border-radius: 10px;
  -webkit-appearance: none;
}
.c-scrollbar::-webkit-scrollbar-thumb:hover {
  background: var(--color-thumb-hover);
}

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