:root {
  /* Шрифты */
  --font-family: 'MTS Text', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-size-h1: 40px;
  --font-size-h2: 32px;
  --font-size-h3: 24px;
  --font-size-body: 16px;
  --font-size-small: 14px;
  --font-weight-bold: 700;
  --font-weight-medium: 500;
  --font-weight-regular: 400;
  --line-height-h1: 48px;
  --line-height-body: 24px;
  --Background-Light-Stroke: rgba(188, 195, 208, 0.50)
  
}

.app {
  display: flex;
  flex-direction: column;
  min-height: 100vh; /* Важно: занимаем всю высоту viewport */
}

.main-content {
  flex: 1; /* Занимает всё доступное пространство, выталкивая футер вниз */
}

:root {
    --primary: $primary;
    --secondary: $secondary;
    --font-family-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}
*, :after, :before {
    box-sizing: border-box;
}
html {
    font-family: sans-serif;
    line-height: 1.15;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
article, aside, figcaption, figure, footer, header, hgroup, main, nav, section {
    display: block;
}
body { 
    margin: 0 auto; 
    width: 100%;
    font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, Liberation Sans, sans-serif;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    text-align: left;
    background-color: #fff;
}
[tabindex="-1"]:focus:not(:focus-visible) {
    outline: 0!important;
}
hr {
    box-sizing: content-box;
    height: 0;
    overflow: visible;
}
h1, h2, h3, h4, h5, h6 {
    margin-top: 0;
    margin-bottom: 0.5rem;
}
p {
    margin-top: 0;
    margin-bottom: 1rem;
}
abbr[data-original-title], abbr[title] {
    text-decoration: underline;
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted;
    cursor: help;
    border-bottom: 0;
    -webkit-text-decoration-skip-ink: none;
    text-decoration-skip-ink: none;
}
address {
    font-style: normal;
    line-height: inherit;
}
address, dl, ol, ul {
    margin-bottom: 1rem;
}
dl, ol, ul {
    margin-top: 0;
}
ol ol, ol ul, ul ol, ul ul {
    margin-bottom: 0;
}
dt {
    font-weight: 700;
}
dd {
    margin-bottom: .5rem;
    margin-left: 0;
}
blockquote {
    margin: 0 0 1rem;
}
b, strong {
    font-weight: bolder;
}
small {
    font-size: 80%}
sub, sup {
    position: relative;
    font-size: 75%;
    line-height: 0;
    vertical-align: baseline;
}
sub {
    bottom: -.25em;
}
sup {
    top: -.5em;
}
a {
    color: #007cff;
    text-decoration: underline;
    background-color: transparent;
}
a:hover {
    color: #0070e6;
    text-decoration: none;
}
a:not([href]):not([class]), a:not([href]):not([class]):hover {
    color: inherit;
    text-decoration: none;
}
code, kbd, pre, samp {
    font-family: SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace;
    font-size: 1em;
}
pre {
    margin-top: 0;
    margin-bottom: 1rem;
    overflow: auto;
    -ms-overflow-style: scrollbar;
}
figure {
    margin: 0 0 1rem;
}
img {
    border-style: none;
}
img, svg {
    vertical-align: middle;
}
svg {
    overflow: hidden;
}
table {
    border-collapse: collapse;
}
caption {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
    color: #6c757d;
    text-align: left;
    caption-side: bottom;
}
th {
    text-align: inherit;
    text-align: -webkit-match-parent;
}
label {
    display: inline-block;
    margin-bottom: 0.5rem;
}
button {
    border-radius: 0;
}
button:focus:not(:focus-visible) {
    outline: 0;
}
button, input, optgroup, select, textarea {
    margin: 0;
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
}
button, input {
    overflow: visible;
}
button, select {
    text-transform: none;
}
[role=button] {
    cursor: pointer;
}
select {
    word-wrap: normal;
}
[type=button], [type=reset], [type=submit], button {
    -webkit-appearance: button;
}
[type=button]:not(:disabled), [type=reset]:not(:disabled), [type=submit]:not(:disabled), button:not(:disabled) {
    cursor: pointer;
}
[type=button]::-moz-focus-inner, [type=reset]::-moz-focus-inner, [type=submit]::-moz-focus-inner, button::-moz-focus-inner {
    padding: 0;
    border-style: none;
}
input[type=checkbox], input[type=radio] {
    box-sizing: border-box;
    padding: 0;
}
textarea {
    overflow: auto;
    resize: vertical;
}
[type=number]::-webkit-inner-spin-button, [type=number]::-webkit-outer-spin-button {
    height: auto;
}
[type=search] {
    outline-offset: -2px;
    -webkit-appearance: none;
}
[type=search]::-webkit-search-decoration {
    -webkit-appearance: none;
}
::-webkit-file-upload-button {
    font: inherit;
    -webkit-appearance: button;
}
[hidden] {
    display: none!important;
}
.container {
    width: 100%;
    margin-right: auto;
    margin-left: auto;
}
.row {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -20px;
    margin-left: -20px;
}
.no-gutters {
    margin-right: 0;
    margin-left: 0;
}
.no-gutters>.col, .no-gutters>[class*=col-] {
    padding-right: 0;
    padding-left: 0;
}
.col, .col-6, .col-12 {
    position: relative;
    width: 100%;
    padding-right: 20px;
    padding-left: 20px;
}
.col {
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%}
.col-6 {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%}
.col-12 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%}
.btn {
    display: inline-block;
    font-weight: 400;
    color: #333;
    text-align: center;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-color: transparent;
    border: 1px solid transparent;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: 0.25rem;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
}
@media (prefers-reduced-motion:reduce) {
    .btn {
    transition: none;
}
}.btn:hover {
    color: #333;
    text-decoration: none;
}
.btn.focus, .btn:focus {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(255, 0, 50, .25);
}
.btn.disabled, .btn:disabled {
    opacity: 0.65;
}
.btn:not(:disabled):not(.disabled) {
    cursor: pointer;
}
a.btn.disabled, fieldset:disabled a.btn {
    pointer-events: none;
}
.btn-primary {
    color: #fff;
    background-color: #ff0032;
    border-color: #ff0032;
}
.btn-primary.focus, .btn-primary:focus, .btn-primary:hover {
    color: #fff;
    background-color: #cc0028;
    border-color: #e6002d;
}
.btn-primary.focus, .btn-primary:focus {
    background-color: #ff0032;
    box-shadow: 0 0 0 0.2rem rgba(255, 0, 50, .5);
}
.btn-primary.disabled, .btn-primary:disabled {
    color: #fff;
    background-color: #ff0032;
    border-color: #ff0032;
}
.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show>.btn-primary.dropdown-toggle {
    color: #fff;
    background-color: #cc0028;
    border-color: #cc0028;
}
.btn-primary:not(:disabled):not(.disabled).active:focus, .btn-primary:not(:disabled):not(.disabled):active:focus, .show>.btn-primary.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem rgba(255, 0, 50, .5);
}
.btn-secondary {
    color: #333;
    background-color: #f2f3f7;
    border-color: #f2f3f7;
}
.btn-secondary.focus, .btn-secondary:focus, .btn-secondary:hover {
    color: #333;
    background-color: #d2d6e4;
    border-color: #b3b9d0;
}
.btn-secondary.focus, .btn-secondary:focus {
    background-color: #f2f3f7;
    box-shadow: 0 0 0 0.2rem rgba(242, 243, 247, .5);
}
.btn-secondary.disabled, .btn-secondary:disabled, .btn-secondary:not(:disabled):not(.disabled).active, .btn-secondary:not(:disabled):not(.disabled):active, .show>.btn-secondary.dropdown-toggle {
    color: #333;
    background-color: #d2d6e4;
    border-color: #d2d6e4;
}
.btn-secondary:not(:disabled):not(.disabled).active:focus, .btn-secondary:not(:disabled):not(.disabled):active:focus, .show>.btn-secondary.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem rgba(242, 243, 247, .5);
}
.btn-link {
    font-weight: 400;
    color: #ff0032;
    text-decoration: none;
}
.btn-link:hover {
    color: #ff335b;
    text-decoration: none;
}
.btn-link.focus, .btn-link:focus, .btn-link:hover {
    text-decoration: underline;
}
.btn-link.disabled, .btn-link:disabled {
    color: #cc0028;
    pointer-events: none;
}
.fade {
    transition: opacity 0.15s linear;
}
@media (prefers-reduced-motion:reduce) {
    .fade {
    transition: none;
}
}.fade:not(.show) {
    opacity: 0;
}
.collapse:not(.show) {
    display: none;
}
.collapsing {
    position: relative;
    height: 0;
    overflow: hidden;
    transition: height 0.35s ease;
}
@media (prefers-reduced-motion:reduce) {
    .collapsing {
    transition: none;
}
}.custom-control {
    position: relative;
    z-index: 1;
    display: block;
    min-height: 1.5rem;
    padding-left: 1.5rem;
    -webkit-print-color-adjust: exact;
    color-adjust: exact;
}
.custom-control-inline {
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-right: 1rem;
}
.custom-control-input {
    position: absolute;
    left: 0;
    z-index: -1;
    width: 1rem;
    height: 1.25rem;
    opacity: 0;
}
.custom-control-input:checked~.custom-control-label:before {
    color: #fff;
    border-color: #ff0032;
    background-color: #ff0032;
}
.custom-control-input:focus~.custom-control-label:before {
    box-shadow: 0 0 0 0.2rem rgba(255, 0, 50, .25);
}
.custom-control-input:focus:not(:checked)~.custom-control-label:before {
    border-color: #ff1a47;
}
.custom-control-input:not(:disabled):active~.custom-control-label:before {
    color: #fff;
    background-color: #ffb3c2;
    border-color: #ffb3c2;
}
.custom-control-input:disabled~.custom-control-label, .custom-control-input[disabled]~.custom-control-label {
    color: #6c757d;
}
.custom-control-input:disabled~.custom-control-label:before, .custom-control-input[disabled]~.custom-control-label:before {
    background-color: #e9ecef;
}
.custom-control-label {
    position: relative;
    margin-bottom: 0;
    vertical-align: top;
}
.custom-control-label:before {
    pointer-events: none;
    background-color: #fff;
    border: 1px solid #adb5bd;
}
.custom-control-label:after, .custom-control-label:before {
    position: absolute;
    top: 0.25rem;
    left: -1.5rem;
    display: block;
    width: 1rem;
    height: 1rem;
    content: ""}
.custom-control-label:after {
    background: 50%/50% 50% no-repeat;
}
.custom-checkbox .custom-control-label:before {
    border-radius: 0.25rem;
}
.custom-checkbox .custom-control-input:checked~.custom-control-label:after {
    background-image: url("data:image/svg+xml, %3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26l2.974 2.99L8 2.193z'/%3e%3c/svg%3e");
}
.custom-checkbox .custom-control-input:indeterminate~.custom-control-label:before {
    border-color: #ff0032;
    background-color: #ff0032;
}
.custom-checkbox .custom-control-input:indeterminate~.custom-control-label:after {
    background-image: url("data:image/svg+xml, %3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='4' viewBox='0 0 4 4'%3e%3cpath stroke='%23fff' d='M0 2h4'/%3e%3c/svg%3e");
}
.custom-checkbox .custom-control-input:disabled:checked~.custom-control-label:before, .custom-checkbox .custom-control-input:disabled:indeterminate~.custom-control-label:before {
    background-color: rgba(255, 213, 0, .5);
}
.custom-control-label:before {
    transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
}
@media (prefers-reduced-motion:reduce) {
    .custom-control-label: before {
    transition: none;
}
}
.close {
    float: right;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    opacity: .5;
}
.close:hover {
    color: #000;
    text-decoration: none;
}
.close:not(:disabled):not(.disabled):focus, .close:not(:disabled):not(.disabled):hover {
    opacity: .75;
}
button.close {
    padding: 0;
    background-color: transparent;
    border: 0;
}
a.close.disabled {
    pointer-events: none;
}
.modal-open {
    overflow: hidden;
}
.modal-open .modal {
    overflow-x: hidden;
    overflow-y: auto;
}
.modal {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 6;
    display: none;
    width: 100%;
    height: 100%;
    overflow: hidden;
    outline: 0;
}
.modal-dialog {
    position: relative;
    width: auto;
    margin: 0.5rem;
    pointer-events: none;
}
.modal.fade .modal-dialog {
    transition: transform 0.3s ease-out;
    transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out;
    transform: translate(0,  -50px);
}
@media (prefers-reduced-motion:reduce) {
    .modal.fade .modal-dialog {
    transition: none;
}
}.modal.show .modal-dialog {
    transform: none;
}
.modal-dialog-centered {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    min-height: calc(100% - 1rem);
}
.modal-dialog-centered:before {
    display: block;
    height: calc(100vh - 1rem);
    height: -webkit-min-content;
    height: -moz-min-content;
    height: min-content;
    content: ""}
.modal-content {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    pointer-events: auto;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0, 0, 0, .2);
    border-radius: 0.3rem;
    outline: 0;
}
.modal-backdrop {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 5;
    width: 100vw;
    height: 100vh;
    background-color: #000;
}
.modal-backdrop.fade {
    opacity: 0;
}
.modal-backdrop.show {
    opacity: 0.5;
}
.modal-body {
    position: relative;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    padding: 1rem;
}
@media (min-width:576px) {
    .modal-dialog {
    max-width: 500px;
    margin: 1.75rem auto;
}
.modal-dialog-centered {
    min-height: calc(100% - 3.5rem);
}
.modal-dialog-centered:before {
    height: calc(100vh - 3.5rem);
    height: -webkit-min-content;
    height: -moz-min-content;
    height: min-content;
}
}.visible {
    visibility: visible!important;
}
.invisible {
    visibility: hidden!important;
}
.embed-responsive {
    position: relative;
    display: block;
    width: 100%;
    padding: 0;
    overflow: hidden;
}
.embed-responsive:before {
    display: block;
    content: ""}
.embed-responsive .embed-responsive-item, .embed-responsive embed, .embed-responsive iframe, .embed-responsive object, .embed-responsive video {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}
.embed-responsive-16by9:before {
    padding-top: 56.25%}
@font-face {
    font-family: MTS Sans;
    src: local("MTS Sans"), local("MTS Sans"), url(https://static2.mts.ru/structures/source/fonts/MTSSans-Regular.ttf) format("truetype");
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: MTS Sans;
    src: local("MTS Sans"), local("MTS Sans"), url(https://static2.mts.ru/structures/source/fonts/MTSSans-Medium.ttf) format("truetype");
    font-weight: 500;
    font-style: normal;
}
@font-face {
    font-family: MTS Sans;
    src: local("MTS Sans"), local("MTS Sans"), url(https://static2.mts.ru/structures/source/fonts/MTSSans-Bold.ttf) format("truetype");
    font-weight: 600;
    font-style: normal;
}
@font-face {
    font-family: MTS Sans;
    src: local("MTS Sans"), local("MTS Sans"), url(https://static2.mts.ru/structures/source/fonts/MTSSans-Black.ttf) format("truetype");
    font-weight: 700;
    font-style: normal;
}
@font-face {
    font-family: MTSSans-UltraWide;
    src: local("MTS Sans"), local("MTS Sans"), url(https://static2.mts.ru/structures/source/fonts/MTSSans-UltraWide.ttf) format("truetype");
    font-weight: 900;
    font-style: normal;
}
@font-face {
    font-family: MTS Text;
    src: url(https://static2.mts.ru/structures/source/fonts/Text/MTSText-Regular.eot);
    src: url(https://static2.mts.ru/structures/source/fonts/Text/MTSText-Regular.eot#iefix) format("embedded-opentype"), url(https://static2.mts.ru/structures/source/fonts/Text/MTSText-Regular.woff2) format("woff2"), url(https://static2.mts.ru/structures/source/fonts/Text/MTSText-Regular.woff) format("woff");
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: MTS Text;
    src: url(https://static2.mts.ru/structures/source/fonts/Text/MTSText-Medium.eot);
    src: url(https://static2.mts.ru/structures/source/fonts/Text/MTSText-Medium.eot#iefix) format("embedded-opentype"), url(https://static2.mts.ru/structures/source/fonts/Text/MTSText-Medium.woff2) format("woff2"), url(https://static2.mts.ru/structures/source/fonts/Text/MTSText-Medium.woff) format("woff");
    font-weight: 500;
    font-style: normal;
}
@font-face {
    font-family: MTS Text;
    src: url(https://static2.mts.ru/structures/source/fonts/Text/MTSText-Bold.eot);
    src: url(https://static2.mts.ru/structures/source/fonts/Text/MTSText-Bold.eot#iefix) format("embedded-opentype"), url(https://static2.mts.ru/structures/source/fonts/Text/MTSText-Bold.woff2) format("woff2"), url(https://static2.mts.ru/structures/source/fonts/Text/MTSText-Bold.woff) format("woff");
    font-weight: 600;
    font-style: normal;
}
@font-face {
    font-family: MTS Text;
    src: url(https://static2.mts.ru/structures/source/fonts/Text/MTSText-Black.eot);
    src: url(https://static2.mts.ru/structures/source/fonts/Text/MTSText-Black.eot#iefix) format("embedded-opentype"), url(https://static2.mts.ru/structures/source/fonts/Text/MTSText-Black.woff2) format("woff2"), url(https://static2.mts.ru/structures/source/fonts/Text/MTSText-Black.woff) format("woff");
    font-weight: 900;
    font-style: normal;
}
@font-face {
    font-family: MTS Extended;
    src: url(https://static2.mts.ru/structures/source/fonts/Extended/MTSExtended-Regular.eot);
    src: url(https://static2.mts.ru/structures/source/fonts/Extended/MTSExtended-Regular.eot#iefix) format("embedded-opentype"), url(https://static2.mts.ru/structures/source/fonts/Extended/MTSExtended-Regular.woff2) format("woff2"), url(https://static2.mts.ru/structures/source/fonts/Extended/MTSExtended-Regular.woff) format("woff");
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: MTS Extended;
    src: url(https://static2.mts.ru/structures/source/fonts/Extended/MTSExtended-Medium.eot);
    src: url(https://static2.mts.ru/structures/source/fonts/Extended/MTSExtended-Medium.eot#iefix) format("embedded-opentype"), url(https://static2.mts.ru/structures/source/fonts/Extended/MTSExtended-Medium.woff2) format("woff2"), url(https://static2.mts.ru/structures/source/fonts/Extended/MTSExtended-Medium.woff) format("woff");
    font-weight: 500;
    font-style: normal;
}
@font-face {
    font-family: MTS Extended;
    src: url(https://static2.mts.ru/structures/source/fonts/Extended/MTSExtended-Bold.eot);
    src: url(https://static2.mts.ru/structures/source/fonts/Extended/MTSExtended-Bold.eot#iefix) format("embedded-opentype"), url(https://static2.mts.ru/structures/source/fonts/Extended/MTSExtended-Bold.woff2) format("woff2"), url(https://static2.mts.ru/structures/source/fonts/Extended/MTSExtended-Bold.woff) format("woff");
    font-weight: 600;
    font-style: normal;
}
@font-face {
    font-family: MTS Extended;
    src: url(https://static2.mts.ru/structures/source/fonts/Extended/MTSExtended-Black.eot);
    src: url(https://static2.mts.ru/structures/source/fonts/Extended/MTSExtended-Black.eot#iefix) format("embedded-opentype"), url(https://static2.mts.ru/structures/source/fonts/Extended/MTSExtended-Black.woff2) format("woff2"), url(https://static2.mts.ru/structures/source/fonts/Extended/MTSExtended-Black.woff) format("woff");
    font-weight: 900;
    font-style: normal;
}
@font-face {
    font-family: MTS Compact;
    src: url(https://static2.mts.ru/structures/source/fonts/Compact/MTSCompact-Regular.eot);
    src: url(https://static2.mts.ru/structures/source/fonts/Compact/MTSCompact-Regular.eot#iefix) format("embedded-opentype"), url(https://static2.mts.ru/structures/source/fonts/Compact/MTSCompact-Regular.woff2) format("woff2"), url(https://static2.mts.ru/structures/source/fonts/Compact/MTSCompact-Regular.woff) format("woff");
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: MTS Compact;
    src: url(https://static2.mts.ru/structures/source/fonts/Compact/MTSCompact-Medium.eot);
    src: url(https://static2.mts.ru/structures/source/fonts/Compact/MTSCompact-Medium.eot#iefix) format("embedded-opentype"), url(https://static2.mts.ru/structures/source/fonts/Compact/MTSCompact-Medium.woff2) format("woff2"), url(https://static2.mts.ru/structures/source/fonts/Compact/MTSCompact-Medium.woff) format("woff");
    font-weight: 500;
    font-style: normal;
}
@font-face {
    font-family: MTS Compact;
    src: url(https://static2.mts.ru/structures/source/fonts/Compact/MTSCompact-Bold.eot);
    src: url(https://static2.mts.ru/structures/source/fonts/Compact/MTSCompact-Bold.eot#iefix) format("embedded-opentype"), url(https://static2.mts.ru/structures/source/fonts/Compact/MTSCompact-Bold.woff2) format("woff2"), url(https://static2.mts.ru/structures/source/fonts/Compact/MTSCompact-Bold.woff) format("woff");
    font-weight: 600;
    font-style: normal;
}
@font-face {
    font-family: MTS Compact;
    src: url(https://static2.mts.ru/structures/source/fonts/Compact/MTSCompact-Black.eot);
    src: url(https://static2.mts.ru/structures/source/fonts/Compact/MTSCompact-Black.eot#iefix) format("embedded-opentype"), url(https://static2.mts.ru/structures/source/fonts/Compact/MTSCompact-Black.woff2) format("woff2"), url(https://static2.mts.ru/structures/source/fonts/Compact/MTSCompact-Black.woff) format("woff");
    font-weight: 900;
    font-style: normal;
}
@font-face {
    font-family: MTS Wide;
    src: url(https://static2.mts.ru/structures/source/fonts/Wide/MTSWide-Medium.eot);
    src: url(https://static2.mts.ru/structures/source/fonts/Wide/MTSWide-Medium.eot#iefix) format("embedded-opentype"), url(https://static2.mts.ru/structures/source/fonts/Wide/MTSWide-Medium.woff2) format("woff2"), url(https://static2.mts.ru/structures/source/fonts/Wide/MTSWide-Medium.woff) format("woff");
    font-weight: 300;
    font-style: normal;
}
@font-face {
    font-family: MTS Wide;
    src: url(https://static2.mts.ru/structures/source/fonts/Wide/MTSWide-Regular.eot);
    src: url(https://static2.mts.ru/structures/source/fonts/Wide/MTSWide-Regular.eot#iefix) format("embedded-opentype"), url(https://static2.mts.ru/structures/source/fonts/Wide/MTSWide-Regular.woff2) format("woff2"), url(https://static2.mts.ru/structures/source/fonts/Wide/MTSWide-Regular.woff) format("woff");
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: MTS Wide;
    src: url(https://static2.mts.ru/structures/source/fonts/Wide/MTSWide-Medium.eot);
    src: url(https://static2.mts.ru/structures/source/fonts/Wide/MTSWide-Medium.eot#iefix) format("embedded-opentype"), url(https://static2.mts.ru/structures/source/fonts/Wide/MTSWide-Medium.woff2) format("woff2"), url(https://static2.mts.ru/structures/source/fonts/Wide/MTSWide-Medium.woff) format("woff");
    font-weight: 500;
    font-style: normal;
}
@font-face {
    font-family: MTS Wide;
    src: url(https://static2.mts.ru/structures/source/fonts/Wide/MTSWide-Bold.eot);
    src: url(https://static2.mts.ru/structures/source/fonts/Wide/MTSWide-Bold.eot#iefix) format("embedded-opentype"), url(https://static2.mts.ru/structures/source/fonts/Wide/MTSWide-Bold.woff2) format("woff2"), url(https://static2.mts.ru/structures/source/fonts/Wide/MTSWide-Bold.woff) format("woff");
    font-weight: 600;
    font-style: normal;
}
@font-face {
    font-family: MTS Wide;
    src: url(https://static2.mts.ru/structures/source/fonts/Wide/MTSWide-Black.eot);
    src: url(https://static2.mts.ru/structures/source/fonts/Wide/MTSWide-Black.eot#iefix) format("embedded-opentype"), url(https://static2.mts.ru/structures/source/fonts/Wide/MTSWide-Black.woff2) format("woff2"), url(https://static2.mts.ru/structures/source/fonts/Wide/MTSWide-Black.woff) format("woff");
    font-weight: 900;
    font-style: normal;
}
body {
    font-family: MTS Compact, MTS Sans, Helvetica Neue, Helvetica, sans-serif;
}
.wide {
    font-family: MTSSans-UltraWide, MTS Sans, Helvetica Neue, Helvetica, sans-serif;
    font-weight: 900;
}
.mts-extend {
    font-family: MTS Extended, MTS Sans, Helvetica Neue, Helvetica, sans-serif;
}
.mts-text {
    font-family: MTS Text, MTS Sans, Helvetica Neue, Helvetica, sans-serif;
}
.mts-compact {
    font-family: MTS Compact, MTS Sans, Helvetica Neue, Helvetica, sans-serif;
}
.mts-wide {
    font-family: MTS Wide, MTS Sans, Helvetica Neue, Helvetica, sans-serif;
}
#allrecords a {
    color: #fff;
    text-decoration: underline;
}
#allrecords .btn {
    text-decoration: none;
    color: #fff;
}
#allrecords .btn-collapse {
    color: #000;
}
#allrecords .faq__collapse a {
    color: #007cff;
}
.btn {
    border-radius: 8px;
}
.btn-link {
    padding: 10px 10px 10px 20px;
    background-image: url("data:image/svg+xml, %3Csvg width='12' height='20' viewBox='0 0 12 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.375 18.125L1.625 10L10.375 1.875' stroke='%23969FA8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
    background-repeat: no-repeat;
    background-position: 0px center;
    line-height: 1;
}
.btn-link, .btn-link:focus, .btn-link:hover {
    color: #626c77;
    text-decoration: none;
}
.img-fluid {
    max-width: 100%;
    display: block;
}
.modal {
    z-index: 120;
}
.modal-content {
    border: unset;
    box-shadow: unset;
    height: 100%}
.modal-backdrop {
    background-color: rgba(0, 0, 0, .5);
    z-index: 101;
    min-height: 120vh;
}
.modal-backdrop.show {
    opacity: 1;
}
.hero__block p {
    font-size: 17px;
}
#modalComplete .modal-dialog-centered {
    margin-top: 10px;
    margin-bottom: 20px;
    min-height: calc(100% - 30px);
    -ms-flex-align: end;
    align-items: flex-end;
    transform: translate(0,  350px);
    border-radius: 20px;
}
#modalComplete.show .modal-dialog-centered {
    transform: unset;
}
#modalComplete .modal-content {
    border-radius: 20px;
}
#modalComplete .modal-body {
    padding: 20px;
    border-radius: 20px;
}
#modalComplete .modal-body__icon {
    width: 44px;
    height: 44px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 16px;
    background-image: url("data:image/svg+xml, %3Csvg width='44' height='44' viewBox='0 0 44 44' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_111_29316)'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0.194233 16.9248C0.670174 10.53 0.908144 7.3325 4.11752 4.12313C7.3269 0.913754 10.5243 0.675785 16.9192 0.199846C18.577 0.0764707 20.287 0.00170898 21.997 0.00170898C23.707 0.00170898 25.417 0.076472 27.0747 0.199848C33.4696 0.675789 36.6671 0.91376 39.8765 4.12314C43.0858 7.33251 43.3238 10.53 43.7997 16.9249C43.9231 18.5826 43.9979 20.2926 43.9979 22.0026C43.9979 23.7126 43.9231 25.4226 43.7997 27.0804C43.3238 33.4753 43.0858 36.6727 39.8765 39.8821C36.6671 43.0915 33.4696 43.3294 27.0747 43.8054C25.417 43.9287 23.707 44.0035 21.997 44.0035C20.287 44.0035 18.577 43.9287 16.9192 43.8054C10.5243 43.3294 7.32689 43.0914 4.11751 39.8821C0.908139 36.6727 0.670169 33.4752 0.194231 27.0803C0.0708554 25.4226 -0.00390625 23.7126 -0.00390625 22.0026C-0.00390625 20.2926 0.0708567 18.5826 0.194233 16.9248Z' fill='%2326CD58'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M32.2837 17.6173C33.2384 16.6626 33.2384 15.1149 32.2837 14.1603C31.3291 13.2057 29.7814 13.2057 28.8268 14.1603L19.5553 23.4318L16.3949 20.2714C15.4402 19.3168 13.8925 19.3168 12.9379 20.2714C11.9833 21.226 11.9833 22.7738 12.9379 23.7284L17.8268 28.6173C18.7814 29.5719 20.3291 29.5719 21.2837 28.6173L32.2837 17.6173Z' fill='white'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_111_29316'%3E%3Crect width='44' height='44' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
}
#modalComplete .modal-body__heading {
    font-weight: 500;
    font-size: 20px;
    line-height: 1.2;
    text-align: center;
}
#modalComplete .modal-body__text {
    text-align: center;
}
button.close {
    position: absolute;
    right: 10px;
    top: 5px;
    z-index: 100;
}
.modal-body {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 45px 10px 10px;
}
.modal-body__heading {
    font-weight: 900;
    font-size: 24px;
    margin-bottom: 15px;
    line-height: 1.3;
}
.modal-body p {
    font-size: 17px;
    margin-bottom: 15px;
}
.modal-body p.modal-body__price {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-weight: 600;
    font-size: 24px;
    line-height: 1;
}
.modal-body p.modal-body__price span {
    text-decoration: line-through;
    font-size: 20px;
    color: #626c77;
    padding-right: 10px;
}
.modal-body__buttons {
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 10px;
    display: -ms-flexbox;
    display: flex;
}
.modal-body__buttons.button-cta-block {
    display: none;
}
.modal-body__buttons.button-cta-block.active {
    display: -ms-flexbox;
    display: flex;
}
.modal-body__buttons .btn {
    padding: 15px;
    font-size: 17px;
    font-weight: 500;
    line-height: 1;
}
.modal-body__buttons .btn+.btn {
    margin-top: 10px;
}
.modal-body__text ul {
    padding-left: 20px;
}
.modal-body__text ul li {
    font-size: 17px;
    padding-left: 0px;
    margin-bottom: 12px;
}
.modal-body__count {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between;
    position: relative;
}
.modal-body__count:after {
    content: '';
    display: block;
    position: absolute;
    width: calc(100% - 2px);
    left: 1px;
    height: 1px;
    background-color: #dde1e7;
    z-index: 1;
}
.modal-body__count .count {
    padding: 0 12px;
    background-color: #fff;
    z-index: 2;
    position: relative;
}
.modal-body__count .count:first-child {
    padding-left: 0;
}
.modal-body__count .count:last-child {
    padding-right: 0;
}
.modal-body__count .count__container {
    border-radius: 100px;
    border: 1px solid #dde1e7;
    width: 48px;
    height: 48px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: relative;
    transition: background-color .15s ease-in-out, border-color .15s ease-in-out;
}
.modal-body__count .count__number {
    font-weight: 500;
    font-size: 24px;
    line-height: 1;
    transition: color .15s ease-in-out;
}
.modal-body__count .count.active .count__container {
    background-color: #ff0032;
    border-color: #ff0032;
}
.modal-body__count .count.active .count__number {
    color: #fff;
}
.modal-body__count .count.done .count__container:after {
    content: '';
    background-image: url("data:image/svg+xml, %3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='24' height='24' rx='12' fill='%2326CD58'/%3E%3Cpath d='M8 11.5L11 14.5L16.5 9' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
    background-repeat: no-repeat;
    width: 24px;
    height: 24px;
    display: block;
    position: absolute;
    bottom: 0;
    right: -12px;
}
#modalDone .btn {
    text-decoration: none;
}
footer {
    padding: 20px 0 120px;
    color: #1a1919;
}
footer .col-12 {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-align: center;
    align-items: center;
    font-size: 14px;
}
@media (max-width:365px) {
    footer .col-12 {
    font-size: 12px;
}
}footer.small-pad {
    padding-bottom: 20px;
}
header {
    position: absolute;
    width: 100%;
    background-color: #fff;
}
header .row {
    position: relative;
}
header .col-12 {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 20px 15px;
}
header .col-12 .logo__image {
    margin-bottom: 0px;
    width: 105px;
    z-index: 5;
    position: relative;
}
header .col-12 .logo__text {
    font-size: 14px;
    font-weight: 500;
    color: #626c77;
    line-height: 1.1;
}
.btn-link-primary {
    color: #007cff;
    background-image: none;
}
.btn-link-primary:hover {
    color: #0063cc;
}
.blackmodal .modal-backdrop {
    background-color: #000;
}
.blackmodal .modal-backdrop.show {
    opacity: 0.5;
}
.modalBottom .modal-content {
    height: auto;
    border-radius: 20px 20px 0 0;
}
.modalBottom .modal-dialog-centered {
    min-height: 100vh;
    margin-top: 0;
    margin-bottom: 0;
    -ms-flex-align: end;
    align-items: flex-end;
}
.modalBottom.modal.fade .modal-dialog {
    margin-left: auto;
    margin-right: auto;
    transform: translate(0,  100%);
}
.modalBottom.modal.fade.show .modal-dialog {
    transform: translate(0);
}
.modalBottom .modal-body {
    position: relative;
    border-radius: 20px 20px 0 0;
}
.modalBottom .modal-body__heading {
    padding-right: 40px;
    background-color: #fff;
    font-family: MTS Compact;
    font-size: 24px;
}
.modalBottom button.close {
    width: 32px;
    height: 32px;
    position: absolute;
    top: 33px;
    right: 16px;
    opacity: 1;
    background-image: url("data:image/svg+xml, %3Csvg width='32' height='32' viewBox='0 0 32 32' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='32' height='32' rx='6' fill='%23F2F3F7'/%3E%3Cg clip-path='url(%23clip0_105_85518)'%3E%3Cpath d='M10.2929 20.2929C9.90237 20.6834 9.90237 21.3166 10.2929 21.7071C10.6834 22.0976 11.3166 22.0976 11.7071 21.7071L15.9999 17.4143L20.2929 21.7073C20.6834 22.0978 21.3166 22.0978 21.7071 21.7073C22.0976 21.3167 22.0976 20.6836 21.7071 20.293L17.4141 16.0001L21.7071 11.7071C22.0976 11.3166 22.0976 10.6834 21.7071 10.2929C21.3166 9.90237 20.6834 9.90237 20.2929 10.2929L15.9999 14.5859L11.7071 10.293C11.3166 9.90252 10.6834 9.90252 10.2929 10.293C9.90237 10.6836 9.90237 11.3167 10.2929 11.7073L14.5857 16.0001L10.2929 20.2929Z' fill='black'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_105_85518'%3E%3Crect width='24' height='24' fill='white' transform='translate(4 4)'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
}
.modalBottom .modal-body__text {
    overflow: auto;
    max-height: 320px;
}
.modalBottom .modal-body__text .faq__collapse-text {
    padding-left: 0;
    padding-right: 0;
}
.modalBottom .modal-body {
    padding: 32px 20px;
}
.link-block {
    margin: 20px 0 40px;
    padding: 20px;
    background: #fff;
    border-radius: 16px;
    margin-right: -20px;
    margin-left: -20px;
    display: none;
}
.link-block.active {
    display: block;
}
.link-block__heading {
    font-style: normal;
    font-weight: 500;
    font-size: 24px;
    line-height: 1.2;
    margin-bottom: 8px;
    color: #000;
}
.link-block__line {
    line-height: 1;
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    display: -ms-flexbox;
    background: #f2f3f7;
    border-radius: 6px;
    padding: 4px 6px;
    max-width: -webkit-max-content;
    max-width: -moz-max-content;
    max-width: max-content;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 4px;
}
.link-block__line:before {
    content: '';
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url("data:image/svg+xml, %3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M17.4523 2.48856C17.7914 2.78402 17.9605 3.31491 17.7128 3.81047L14.618 9.99995H16.8064C17.6684 9.99995 18.2432 10.9851 17.6999 11.7401C17.2287 12.395 15.2819 15.0682 13.7211 16.6928C11.9096 18.5782 8.89036 20.8498 7.9195 21.5663C7.45858 21.9064 6.89193 21.8114 6.54762 21.5113C6.20859 21.2159 6.03943 20.685 6.28721 20.1894L9.38195 13.9999H7.19351C6.33155 13.9999 5.75672 13.0148 6.30005 12.2598C6.77128 11.6049 8.71804 8.93167 10.2789 7.30712C12.0903 5.42172 15.1096 3.15009 16.0805 2.43363C16.5414 2.0935 17.108 2.18849 17.4523 2.48856Z' fill='black'/%3E%3C/svg%3E%0A");
    margin-right: 4px;
}
.link-block__about {
    font-weight: 400;
    font-size: 17px;
    line-height: 1.43;
    color: #333;
    margin-bottom: 20px;
}
.link-block__about ul {
    padding-left: 20px;
}
.link-block__text {
    font-size: 17px;
    line-height: 1.4;
    margin-bottom: 16px;
}
.link-block .options-list {
    display: -ms-flexbox;
    display: flex;
    margin: 0 -6px;
    width: calc(100% + 12px);
}
.link-block__link {
    font-weight: 500;
    font-size: 14px;
    line-height: 1;
    color: #007cff;
    margin-right: auto;
}
.link-block__badge {
    position: absolute;
    top: -10px;
    font-weight: 500;
    font-size: 12px;
    line-height: 1;
    text-align: center;
    color: #fff;
    padding: 2px 6px 4px;
    background: #ff0032;
    border-radius: 8px;
    z-index: 10;
}
.link-block__button {
    width: 100%;
    font-weight: 500;
    padding: 10px;
    font-size: 17px;
}
.link-block__button--white {
    width: calc(100% - 12px);
    position: relative;
    margin: 0 6px;
    background: #fff;
    box-shadow: 0px 0px 20px rgba(0, 0, 0, .15);
    border-radius: 12px;
    padding: 14px;
    text-align: left;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
@media (max-width:365px) {
    .link-block__button--white {
    padding: 11px 6px;
}
}.link-block__button--white:last-child {
    margin-bottom: 0;
}
.link-block__gb {
    margin-right: auto;
    font-weight: 700;
    font-size: 17px;
    margin-bottom: 5px;
    color: #030f12;
}
.link-block__gb .gray {
    display: block;
    font-weight: 400;
    font-size: 14px;
    line-height: 1.5;
    color: #7c7c7c;
}
.link-block__gb .gray:last-child {
    margin-bottom: 6px;
}
.link-block__price {
    margin-right: auto;
    font-weight: 400;
    font-size: 14px;
    line-height: 1;
    color: #7c7c7c;
    margin-bottom: 10px;
}
body {
    background: #f2f3f7;
    background-repeat: no-repeat;
}
.name-preheader {
    background-color: #fff!important;
}
.col-hero {
    position: relative;
    padding-top: 3px;
}
.col-hero.col-hero-main {
    padding-top: 20px;
}
.col-hero:not(.col-hero-main) .hero-main-image {
    max-height: 120px;
    -o-object-fit: cover;
    object-fit: cover;
}
.col-hero:not(.col-hero-main) .hero__block p {
    color: #1d2023;
}
.col-hero:not(.col-hero-main) .block-obnovi h2 {
    color: #000;
    font-family: MTS Wide;
    font-size: 32px;
    font-weight: 500;
    line-height: 1.12;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    margin-bottom: 10px;
}
.col-hero:not(.col-hero-main) .block-obnovi .badge-turbo {
    display: block;
    color: #fff;
    padding: 2px 10px 2px 26px;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.42;
    background-color: #ff0032;
    border-radius: 6px;
    font-family: MTS Compact;
    max-width: -webkit-max-content;
    max-width: -moz-max-content;
    max-width: max-content;
    margin-top: 10px;
    margin-bottom: 10px;
    position: relative;
}
.col-hero:not(.col-hero-main) .block-obnovi .badge-turbo:before {
    content: '';
    background-image: url("data:image/svg+xml, %3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_205_7)'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M13.1089 4.22455C13.4018 4.51744 13.4018 4.99232 13.1089 5.28521L7.19692 11.1972C7.05626 11.3379 6.8655 11.4169 6.66659 11.4169C6.46767 11.4169 6.27691 11.3379 6.13626 11.1972L2.80292 7.8639C2.51003 7.57101 2.51003 7.09614 2.80292 6.80324C3.09582 6.51035 3.57069 6.51035 3.86358 6.80324L6.66658 9.60625L12.0482 4.22455C12.3411 3.93166 12.816 3.93166 13.1089 4.22455Z' fill='white'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_205_7'%3E%3Crect width='16' height='16' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
    background-position: center;
    background-size: contain;
    display: block;
    width: 16px;
    height: 16px;
    position: absolute;
    left: 6px;
    top: 4px;
}
.col-hero.no-alert {
    padding-top: 0;
}
.col-hero.no-alert .hero__alert {
    display: none;
}
.col-hero.no-alert .hero__heading {
    margin-top: 22px;
}
.col-hero.col-hero-main:before {
    content: '';
    width: 100%;
    height: 220px;
    display: block;
    position: absolute;
    top: 3px;
    left: 0;
    z-index: 1;
    background: linear-gradient(135deg, #9e95fd 0%, #8891ff 38.54%, #a9c5ed 72.4%, #b3dbe7 100%), linear-gradient(135deg, #98d8ff 0%, #958eff 41.69%, #9586ff 50.39%, #9888ff 59.59%, #b199ff 100%, #b5a0ff 100%), linear-gradient(153deg, #98d8ff 1.04%, #958eff 11.46%, #1d1834 59.9%);
}
.hero__price {
    margin-top: 10px;
    margin-bottom: 20px;
    font-size: 20px;
    font-weight: 500;
}
.col-hero:not(.col-hero-main) .hero__block p.hero__price, .hero__price {
    color: #1d2023;
}
.link-block__about-item {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
}
.link-block__about-item .image {
    width: 44px;
    margin-right: 12px;
    -ms-flex: 0 0 44px;
    flex: 0 0 44px;
}
.link-block__about-item:not(:last-child) {
    margin-bottom: 20px;
}
.hero {
    position: relative;
}
.hero__alert {
    margin: 30px 0;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    padding: 11px 13px;
    background-color: #1d2023;
    border-radius: 12px;
    transition: transform .5s ease-in-out;
    transition: transform .5s ease-in-out, -webkit-transform .5s ease-in-out;
    transform: translateY(-300px);
}
.hero__alert.active {
    transform: translateY(0px);
}
.hero__alert .text {
    display: none;
    color: #fff;
    margin-left: 8px;
}
.hero__alert .text.active {
    display: block;
}
.hero__bg {
    position: absolute;
    right: 0;
    max-width: 125px;
    transform: translateY(-75px);
    z-index: 7;
}
.hero__block {
    background: #fafafa;
    border-radius: 16px;
    margin-right: -20px;
    margin-left: -20px;
    padding: 20px;
    position: relative;
    z-index: 6;
}
.hero__block p {
    margin-bottom: 10px;
}
.hero__block-collapse {
    margin-bottom: 14px;
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 1.43;
    color: #626c77;
}
.hero__block-collapse ul {
    padding-left: 25px;
    margin-bottom: 0;
}
.hero__block-collapse ul li:not(:last-child) {
    margin-top: 8px;
    margin-bottom: 8px;
}
.hero__heading {
    font-weight: 500;
    margin: 28px 0 20px;
    font-size: 24px;
    line-height: 1.1;
    color: #fff;
    padding-right: 80px;
}
.hero__heading, .hero__text {
    position: relative;
    z-index: 2;
}
.hero__text {
    font-size: 17px;
    line-height: 1.6;
    color: #333;
    margin-bottom: 25px;
}
.hero__button {
    margin-bottom: 40px;
    -ms-flex-direction: column;
    flex-direction: column;
    position: relative;
    z-index: 2;
    display: none;
}
.hero__button.active {
    display: -ms-flexbox;
    display: flex;
}
.hero__button .btn-hero {
    width: 100%;
    font-size: 17px;
    margin-right: 15px;
    font-weight: 500;
    line-height: 1;
    padding: 15px;
    margin-bottom: 8px;
    text-decoration: none;
}
.hero__button p {
    margin-bottom: 10px;
    text-align: center;
    font-size: 14px;
    color: #969fa8;
}
.hero__image {
    height: auto;
    position: relative;
    z-index: 0;
    margin-top: 20px;
}
.hero__image img {
    margin-left: -15px;
    width: calc(100% + 30px);
    border-radius: 14px;
    max-width: unset;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
}
.btn-with-price {
    display: none;
}
.btn-with-price.active {
    display: -ms-flexbox;
    display: flex;
}
h2 {
    font-weight: 500;
    font-size: 24px;
    line-height: 28px;
    margin-bottom: 10px;
    color: #000;
}
.about-services {
    padding: 40px 0;
    background-color: #001424;
    color: #fff;
}
.about-services__list {
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 15px;
}
.about-services__list:last-child {
    margin-bottom: 0;
}
.about-services__list span {
    margin-right: 15px;
    padding-top: 2px;
}
.about-services__list div {
    font-size: 17px;
}
.about-services__list div s {
    color: #fff;
    margin-left: 12px;
    -webkit-text-decoration-color: #fff;
    text-decoration-color: #fff;
}
.premium-slide .link-block__text {
    font-weight: 400;
    font-size: 17px;
    line-height: 1.43;
    color: #333;
    margin-bottom: 20px;
}
.premium-block {
    position: relative;
    background: linear-gradient(135deg, #9e95fd 0%, #8891ff 38.54%, #a9c5ed 76.56%, #cbe5df 100%), linear-gradient(135deg, #98d8ff 0%, #958eff 41.69%, #9586ff 50.39%, #9888ff 59.59%, #b199ff 100%, #b5a0ff 100%);
    border-radius: 16px;
    margin-bottom: 12px;
    padding: 16px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-direction: column;
    flex-direction: column;
    text-align: left;
}
.premium-block .premium-block__bg {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    z-index: 1;
    border-radius: 8px;
}
.premium-block .premium-block__head {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 15px;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 100%}
.premium-block .premium-block__badge {
    font-weight: 500;
    font-size: 12px;
    line-height: 1;
    padding: 2px 8px 4px;
    text-align: center;
    color: #fff;
    background: #26cd58;
    border-radius: 4px;
}
.premium-block__logo {
    max-width: 120px;
}
.premium-block__text {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 15px;
    font-weight: 400;
    font-size: 20px;
    line-height: 1.3;
    color: #fafafa;
}
.premium-block__text .second {
    margin-left: 8px;
    padding-left: 8px;
    font-size: 14px;
    padding-top: 3px;
    border-left: 1px solid hsla(0, 0%, 100%, .2);
}
.premium-block__button {
    width: 100%}
.premium-block__button .btn {
    width: 100%;
    font-weight: 500;
    font-size: 14px;
    line-height: 1;
    color: #000;
    padding: 8px 12px 10px;
}
.premium-block * {
    position: relative;
    z-index: 5;
}
.link-block__disc {
    font-weight: 400;
    font-size: 14px;
    line-height: 24px;
    text-align: left;
    color: #333;
    opacity: 0.5;
}
.img-about {
    margin-bottom: 20px;
}
.faq__collapse-text ul {
    padding-left: 20px;
}
.faq__collapse-text ul li {
    margin-bottom: 10px;
}
.additional-header {
    position: fixed;
    bottom: 0;
    width: 100%;
    padding: 15px 0 25px;
    background-color: #fff;
    box-shadow: 0px 0px 16px rgba(0, 0, 0, .08), 0px 4px 16px rgba(0, 0, 0, .08);
    z-index: 100;
    transform: translateY(200px);
    transition: transform .3s ease-in-out;
    transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out;
}
.additional-header.active {
    transform: translateY(0px);
}
.additional-header .btn {
    padding: 8px 10px;
    margin-left: auto;
}
.additional-header .main__button .btn {
    padding: 10px 0px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}
.additional-header .main__button-additional {
    color: rgba(0, 0, 0, .55);
    font-size: 12px;
}
.modal-body__text img {
    margin: 0 auto;
    display: block;
}
.btn {
    text-decoration: none;
}
.main__text {
    color: #626c77;
    font-size: 17px;
    line-height: 1.4;
    margin-bottom: 20px;
}
.main__button {
    -ms-flex-align: center;
    align-items: center;
    display: none;
}
.main__button.active {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
}
.main__button .btn {
    white-space: nowrap;
    padding: 10px 32px;
    line-height: 1.2;
    min-width: 156px;
    width: 100%;
    margin: 0 0 8px;
}
.main__button-text {
    font-size: 14px;
    line-height: 1.4;
    color: #626c77;
}
.block-obnovi {
    display: none;
    margin-bottom: 40px;
}
.block-obnovi.active {
    display: block;
}
.btn-refresh-gb {
    width: 100%;
    font-style: normal;
    font-weight: 500;
    font-size: 17px;
    line-height: 1;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: #fff;
    padding: 10px;
}
.btn-refresh-gb:before {
    content: '';
    display: block;
    width: 24px;
    height: 24px;
    position: relative;
    margin-right: 8px;
    background-position: center;
    background-image: url("data:image/svg+xml, %3Csvg width='25' height='24' viewBox='0 0 25 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M3.54479 11.6752C3.54479 16.5456 7.07599 19.864 11.0424 20.5504C11.1503 20.5691 11.2534 20.6089 11.346 20.6674C11.4385 20.726 11.5186 20.8022 11.5816 20.8917C11.6447 20.9812 11.6895 21.0823 11.7135 21.1891C11.7376 21.296 11.7403 21.4065 11.7216 21.5144C11.7029 21.6223 11.6631 21.7254 11.6046 21.818C11.546 21.9105 11.4698 21.9906 11.3803 22.0537C11.2907 22.1167 11.1897 22.1615 11.0828 22.1856C10.976 22.2096 10.8655 22.2123 10.7576 22.1936C6.09999 21.3872 1.87759 17.4608 1.87759 11.6752C1.87759 9.216 2.99599 7.2832 4.30159 5.8144C5.23759 4.7616 6.30799 3.9056 7.16879 3.2512H4.55119C4.33902 3.2512 4.13554 3.16691 3.98551 3.01688C3.83548 2.86686 3.75119 2.66337 3.75119 2.4512C3.75119 2.23903 3.83548 2.03554 3.98551 1.88551C4.13554 1.73548 4.33902 1.6512 4.55119 1.6512H9.35119C9.56337 1.6512 9.76685 1.73548 9.91688 1.88551C10.0669 2.03554 10.1512 2.23903 10.1512 2.4512V7.2512C10.1512 7.46337 10.0669 7.66686 9.91688 7.81688C9.76685 7.96691 9.56337 8.0512 9.35119 8.0512C9.13902 8.0512 8.93554 7.96691 8.78551 7.81688C8.63548 7.66686 8.55119 7.46337 8.55119 7.2512V4.2976L8.54959 4.3008C7.63439 4.9888 6.51759 5.832 5.54959 6.9216C4.40559 8.208 3.54479 9.7648 3.54479 11.6752ZM21.3176 12.3248C21.3176 7.5056 17.8616 4.208 13.9464 3.472C13.8373 3.45348 13.7329 3.41342 13.6395 3.35415C13.546 3.29489 13.4652 3.21759 13.402 3.12679C13.3387 3.03599 13.2941 2.93349 13.2708 2.82528C13.2476 2.71707 13.2461 2.60531 13.2665 2.49652C13.2869 2.38774 13.3288 2.2841 13.3896 2.19166C13.4505 2.09923 13.5292 2.01984 13.6211 1.95813C13.713 1.89642 13.8162 1.85363 13.9248 1.83225C14.0334 1.81087 14.1452 1.81133 14.2536 1.8336C18.852 2.6976 22.9848 6.6016 22.9848 12.3248C22.9848 14.784 21.8664 16.7152 20.5608 18.1856C19.6248 19.2384 18.5544 20.0944 17.6936 20.7488H20.3112C20.5234 20.7488 20.7268 20.8331 20.8769 20.9831C21.0269 21.1331 21.1112 21.3366 21.1112 21.5488C21.1112 21.761 21.0269 21.9645 20.8769 22.1145C20.7268 22.2645 20.5234 22.3488 20.3112 22.3488H15.5112C15.299 22.3488 15.0955 22.2645 14.9455 22.1145C14.7955 21.9645 14.7112 21.761 14.7112 21.5488V16.7488C14.7112 16.5366 14.7955 16.3331 14.9455 16.1831C15.0955 16.0331 15.299 15.9488 15.5112 15.9488C15.7234 15.9488 15.9268 16.0331 16.0769 16.1831C16.2269 16.3331 16.3112 16.5366 16.3112 16.7488V19.7008H16.3144C17.228 19.0096 18.3464 18.168 19.3128 17.0768C20.4568 15.792 21.3176 14.2368 21.3176 12.3248Z' fill='white'/%3E%3C/svg%3E%0A");
}
.btn-showmore {
    padding: 0;
    background: unset;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-weight: 400;
    font-size: 14px;
    line-height: 1;
    color: #007cff;
}
.btn-showmore:focus, .btn-showmore:hover {
    color: #007cff;
    outline: 0;
    box-shadow: unset;
}
.btn-showmore.collapsed:after {
    transform: rotate(0);
}
.btn-showmore:after {
    content: '';
    display: block;
    position: relative;
    margin-left: 4px;
    width: 24px;
    height: 24px;
    transition: transform .3s ease-in-out;
    transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out;
    transform: rotate(-180deg);
    background-repeat: no-repeat;
    background-position: right center;
    background-image: url("data:image/svg+xml, %3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_303_1668)'%3E%3Cg clip-path='url(%23clip1_303_1668)'%3E%3Cpath d='M5.01246 9C4.11226 9 3.66144 10.0766 4.29798 10.7062C4.29797 10.7062 4.29798 10.7062 4.29798 10.7062L7.4273 13.8016C9.58289 15.9339 10.6607 17 12 17C13.3393 17 14.4171 15.9339 16.5727 13.8016L19.702 10.7062C20.3386 10.0766 19.8877 9 18.9875 9C18.7196 9 18.4625 9.1053 18.2731 9.29274L15.1437 12.3882C14.0255 13.4942 13.3276 14.1786 12.7544 14.6112C12.2371 15.0016 12.0565 15.0012 12.0028 15.001L12 15.001L11.9973 15.001C11.9435 15.0012 11.7629 15.0016 11.2456 14.6112C10.6724 14.1786 9.97446 13.4942 8.85627 12.3882L5.72695 9.29274C5.72695 9.29274 5.72695 9.29274 5.72695 9.29274C5.53745 9.1053 5.28044 9 5.01246 9Z' fill='%23007CFF'/%3E%3C/g%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_303_1668'%3E%3Crect width='24' height='24' fill='white'/%3E%3C/clipPath%3E%3CclipPath id='clip1_303_1668'%3E%3Crect width='24' height='24' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
}
.form-row {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -5px;
    margin-left: -5px;
}
.form-row>.col, .form-row>[class*=col-] {
    padding-right: 5px;
    padding-left: 5px;
}
.form-control {
    display: block;
    width: 100%;
    height: calc(1.5em + 0.75rem + 2px);
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
}
.form-control:focus {
    border-color: #ff0032;
    box-shadow: 0 0 0 0.2rem rgba(255, 0, 50, .25);
    outline: 0px auto #ff0032;
}
.form-group {
    margin-bottom: 15px;
}
.form-group label span {
    color: #ff0032;
}
.form-group.invalid .invalid-feedback {
    display: block;
}
.custom-control-label {
    font-size: 12px;
    color: #626c77;
    padding-top: 3px;
}
.invalid-feedback {
    color: #c12;
    font-weight: 500;
    font-size: 14px;
    display: none;
}
.modal-open {
    max-height: 100vh;
}
.faq {
    padding: 0 20px;
    background: #fff;
    border-radius: 16px;
    margin-right: -20px;
    margin-left: -20px;
    background-color: #fff;
    color: #333;
}
.faq__collapse {
    border-bottom: 1px solid rgba(188, 195, 208, .5);
}
.faq__collapse:last-child {
    border-bottom: unset;
}
.faq__collapse-text {
    padding-bottom: 15px;
    font-size: 14px;
    color: #626c77;
}
.faq a {
    color: #45b6fc;
}
.btn-faq {
    text-align: left;
    padding: 20px 33px 20px 0;
    font-weight: 400;
    color: #1d2023;
    font-size: 17px;
    width: 100%;
    position: relative;
}
.btn-faq:after {
    content: '';
    width: 24px;
    height: 24px;
    position: absolute;
    right: 0;
    top: 22px;
    display: block;
    transform: rotate(-180deg);
    background-image: url("data:image/svg+xml, %3Csvg width='24' height='25' viewBox='0 0 24 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.01246 9.5C4.11226 9.5 3.66144 10.5766 4.29798 11.2062C4.29798 11.2062 4.29797 11.2062 4.29798 11.2062L7.4273 14.3016C9.58289 16.4339 10.6607 17.5 12 17.5C13.3393 17.5 14.4171 16.4339 16.5727 14.3016L19.702 11.2062C20.3386 10.5766 19.8877 9.5 18.9875 9.5C18.7196 9.5 18.4625 9.6053 18.2731 9.79274L15.1437 12.8882C14.0255 13.9942 13.3276 14.6786 12.7544 15.1112C12.2371 15.5016 12.0565 15.5012 12.0028 15.501L12 15.501L11.9973 15.501C11.9435 15.5012 11.7629 15.5016 11.2456 15.1112C10.6724 14.6786 9.97446 13.9942 8.85627 12.8882L5.72695 9.79274C5.72695 9.79274 5.72695 9.79274 5.72695 9.79274C5.53745 9.6053 5.28044 9.5 5.01246 9.5Z' fill='%23969FA8'/%3E%3C/svg%3E%0A");
    background-repeat: no-repeat;
    transition: transform .3s ease-in-out;
    transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out;
}
.btn-faq.collapsed:after {
    transform: rotate(0deg);
}
.btn-faq:focus {
    box-shadow: unset;
}
.btn-faq:hover {
    color: #333;
}
.btn-faq[data-toggle=modal].collapsed:after {
    transform: rotate(-90deg);
}
.hero-main-image {
    margin-left: -20px;
    margin-right: -20px;
    width: calc(100% + 40px);
    max-width: calc(100% + 40px);
    margin-bottom: -20px;
}
.footer {
    padding: 40px 0 24px;
    color: #7c7c7c;
}
.footer a {
    display: block;
    max-width: -webkit-max-content;
    max-width: -moz-max-content;
    max-width: max-content;
    color: #969fa8;
    margin-bottom: 10px;
    text-decoration: none;
    font-size: 17px;
}
.footer a:last-child {
    margin-bottom: 0;
}
.footer a:hover {
    color: #6d7984;
    text-decoration: none;
}
.footer .return-link {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    line-height: 1;
}
.footer .return-link span {
    text-decoration: underline;
}
.footer .return-link:before {
    content: '';
    display: block;
    background-image: url("data:image/svg+xml, %3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15 5.01246C15 4.11226 13.9234 3.66144 13.2938 4.29798L10.1984 7.4273C8.06612 9.58289 7 10.6607 7 12C7 13.3393 8.06612 14.4171 10.1984 16.5727L13.2938 19.702C13.9234 20.3386 15 19.8877 15 18.9875C15 18.7196 14.8947 18.4625 14.7073 18.2731L11.6118 15.1437C10.5058 14.0255 9.82141 13.3276 9.38882 12.7544C8.99838 12.2371 8.99883 12.0565 8.99897 12.0028L8.99897 12L8.99897 11.9973C8.99883 11.9435 8.99838 11.7629 9.38882 11.2456C9.8214 10.6724 10.5058 9.97446 11.6118 8.85627L14.7073 5.72695C14.8947 5.53745 15 5.28044 15 5.01246Z' fill='%23007CFF'/%3E%3C/svg%3E%0A");
    width: 20px;
    height: 20px;
    margin-right: 4px;
}
.copyright {
    color: #626c77;
    font-size: 17px;
}
.footer__application {
    padding-top: 10px;
    background-color: #001424;
    color: #fff;
}
.footer__application .col-12 {
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 20px;
}
.footer__application .col-12:first-child img {
    max-width: 48px;
    -ms-flex: 0 0 48px;
    flex: 0 0 48px;
    margin-right: 15px;
}
.footer__application .col-12:nth-child(2) {
    -ms-flex-pack: justify;
    justify-content: space-between;
}
.footer__application .col-disc {
    margin-top: 20px;
    font-size: 12px;
    margin-bottom: 0;
}
.footer__application a {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    max-width: 49%;
    color: #fff;
    text-decoration: none;
}
.footer__application a span {
    text-decoration: underline;
}
.footer__application a:last-child {
    margin-bottom: 0;
}
.footer__application a:hover span {
    text-decoration: none;
}
.about-premium {
    padding-top: 12px;
    padding-bottom: 0px;
}
.about-premium__heading {
    margin-bottom: 10px;
}
.about-premium__item {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    margin-bottom: 12px;
    position: relative;
}
.about-premium__icon {
    width: 24px;
    -ms-flex: 0 0 24px;
    flex: 0 0 24px;
    margin-right: 15px;
}
.about-premium__text {
    font-size: 18px;
    color: #000;
    position: absolute;
    z-index: 5;
    left: 24px;
    top: 24px;
    max-width: calc(100% - 48px);
    font-weight: 500;
}
@media (min-width:700px) {
    .about-premium__text {
    font-size: 26px;
    left: 40px;
    top: 40px;
}
}.about-premium__share {
    margin-top: 30px;
}
.about-premium {
    color: #7c7c7c;
    padding: 12px 0 0;
}
.about-premium__heading {
    margin-bottom: 30px;
    font-weight: 700;
    font-size: 24px;
    line-height: 1.3;
}
.about-premium__item {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: start;
    align-items: flex-start;
    margin-bottom: 15px;
    font-size: 17px;
}
.about-premium__item svg {
    width: 4px;
    margin-top: 9px;
    margin-right: 15px;
    -ms-flex: 0 0 4px;
    flex: 0 0 4px;
}
.about-premium--border .about-premium__heading {
    padding-top: 0px;
}
.about-premium--border .about-premium__item:last-child {
    padding-bottom: 0px;
    margin-bottom: 0;
    color: #1d2023;
}
.about-premium a {
    color: #fff;
    text-decoration: underline;
}
.about-premium a:hover {
    color: #fff;
    text-decoration: none;
}
.share__heading {
    font-size: 17px;
    color: #626c77;
    margin-bottom: 10px;
    text-align: center;
}
.share__icons {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 150px;
    margin: 0 auto;
}
.share__link {
    width: 38px;
    -ms-flex: 0 0 38px;
    flex: 0 0 38px;
}
.scrollable .col-12 {
    position: relative;
    height: 300vh;
    color: #fff;
    max-height: 1500px;
}
.scrollable__item {
    opacity: 1;
    transform: translateY(0px);
    display: block;
    font-size: 20px;
    font-weight: 500;
    margin-bottom: 50px;
    transition: opacity .3s ease-in-out, transform .3s ease-in-out;
    transition: opacity .3s ease-in-out, transform .3s ease-in-out, -webkit-transform .3s ease-in-out;
}
@media (max-width:365px) {
    .scrollable__item {
    margin-bottom: 20px;
}
}.scrollable__item.unactive {
    opacity: 0;
    transform: translateY(40px);
}
.scrollable__heading {
    font-weight: 900;
    font-size: 24px;
    margin-bottom: 40px;
}
.scrollable-block {
    position: sticky;
    top: 0;
    height: 100vh;
    background-size: cover;
    margin: 0 -15px;
    padding: 40px 15px;
    transition: background .3s ease-in-out;
}
.cashback {
    padding-top: 32px;
    padding-bottom: 32px;
    background-color: #fff;
}
.cashback__logo {
    max-width: 125px;
    margin-bottom: 24px;
}
.cashback__heading {
    font-weight: 900;
    font-size: 24px;
    line-height: 1.2;
    margin-bottom: 25px;
}
.cashback__image {
    width: 100%;
    margin-bottom: 10px;
}
.cashback__image img {
    width: 100%}
.cashback__text {
    font-size: 17px;
    line-height: 1.7;
}
.watch {
    padding-top: 32px;
    padding-bottom: 12px;
    background-color: #f2f3f7;
}
.watch__heading {
    font-weight: 900;
    font-size: 24px;
    line-height: 1.2;
    margin-bottom: 25px;
}
.watch__list {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex-pack: center;
    justify-content: center;
}
.watch__list-item {
    width: 33.333%;
    -ms-flex: 0 0 33.3333%;
    flex: 0 0 33.3333%;
    padding: 0 7px;
    margin-bottom: 20px;
}
.watch__list-item-image {
    width: 100%;
    margin-bottom: 4px;
}
.watch__list-item-image img {
    width: 100%;
    max-height: 60px;
    -o-object-fit: contain;
    object-fit: contain;
}
.watch__list-item-text {
    text-align: center;
    font-size: 12px;
}
@media (max-width:369px) {
    .link-block__heading {
    font-size: 18px;
}
.premium-block__logo {
    max-width: 126px;
}
.hero__heading {
    font-size: 20px;
}
}.premium-slide .link-block__text {
    color: #626c77;
}
.footer .return-link {
    margin-bottom: 16px;
}
.footer .return-link span {
    text-decoration: none;
}
.footer .return-link:before {
    display: none;
}
.turbo-ring {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    max-width: 290px;
    width: 290px;
    height: 290px;
    border-radius: 290px;
    background: #fff;
    box-shadow: 0px 3px 3px 0px rgba(0, 0, 0, .25) inset;
    margin: 0 auto;
    -ms-scroll-chaining: none;
    overscroll-behavior: contain;
    -ms-touch-action: none;
    touch-action: none;
}
.range {
    border-radius: 50%;
    display: table;
    height: 240px;
    position: relative;
    width: 240px;
}
.range input {
    opacity: 0;
    position: absolute;
}
.range .dial {
    background-image: url("data:image/svg+xml, %3Csvg width='42' height='43' viewBox='0 0 42 43' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg filter='url(%23filter0_i_28_1536)'%3E%3Cpath d='M42.0001 21.7798C42.0001 33.3441 32.5981 42.7188 21.0001 42.7188C9.40214 42.7188 0.00012207 33.3441 0.00012207 21.7798C0.00012207 10.2155 9.40214 0.84082 21.0001 0.84082C32.5981 0.84082 42.0001 10.2155 42.0001 21.7798Z' fill='%23CDCDCD' fill-opacity='0.2'/%3E%3C/g%3E%3Cpath d='M41.5001 21.7798C41.5001 33.0666 32.3233 42.2188 21.0001 42.2188C9.67691 42.2188 0.500122 33.0666 0.500122 21.7798C0.500122 10.493 9.67691 1.34082 21.0001 1.34082C32.3233 1.34082 41.5001 10.493 41.5001 21.7798Z' stroke='url(%23paint0_linear_28_1536)' stroke-opacity='0.3'/%3E%3Cdefs%3E%3Cfilter id='filter0_i_28_1536' x='0.00012207' y='0.84082' width='46' height='46.878' filterUnits='userSpaceOnUse' color-interpolation-filters='sRGB'%3E%3CfeFlood flood-opacity='0' result='BackgroundImageFix'/%3E%3CfeBlend mode='normal' in='SourceGraphic' in2='BackgroundImageFix' result='shape'/%3E%3CfeColorMatrix in='SourceAlpha' type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0' result='hardAlpha'/%3E%3CfeOffset dx='4' dy='5'/%3E%3CfeGaussianBlur stdDeviation='3'/%3E%3CfeComposite in2='hardAlpha' operator='arithmetic' k2='-1' k3='1'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.09 0'/%3E%3CfeBlend mode='normal' in2='shape' result='effect1_innerShadow_28_1536'/%3E%3C/filter%3E%3ClinearGradient id='paint0_linear_28_1536' x1='12' y1='11.13' x2='29.5' y2='32.13' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23F8F8F8'/%3E%3Cstop offset='1' stop-color='%23F8F8F8'/%3E%3C/linearGradient%3E%3C/defs%3E%3C/svg%3E%0A");
    background-repeat: no-repeat;
    background-size: contain;
    border-radius: 50%;
    cursor: pointer;
    height: 42px;
    margin-left: -21px;
    position: absolute;
    top: -21px;
    transform: translateX(120px) translateY(9px);
    width: 42px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    z-index: 40;
}
.range .dial:focus {
    outline: 0;
}
.range .dial:after {
    content: '';
    display: block;
    width: 28px;
    height: 28px;
    position: absolute;
    background-image: url("data:image/svg+xml, %3Csvg width='28' height='28' viewBox='0 0 28 28' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M28 13.63C28 21.0858 21.732 27.13 14 27.13C6.26801 27.13 0 21.0858 0 13.63C0 6.17416 6.26801 0.130005 14 0.130005C21.732 0.130005 28 6.17416 28 13.63Z' fill='url(%23paint0_radial_28_1537)'/%3E%3Cpath d='M27.5 13.63C27.5 20.7927 21.4731 26.63 14 26.63C6.52686 26.63 0.5 20.7927 0.5 13.63C0.5 6.46729 6.52686 0.630005 14 0.630005C21.4731 0.630005 27.5 6.46729 27.5 13.63Z' stroke='url(%23paint1_radial_28_1537)' stroke-opacity='0.9'/%3E%3Cdefs%3E%3CradialGradient id='paint0_radial_28_1537' cx='0' cy='0' r='1' gradientUnits='userSpaceOnUse' gradientTransform='translate(11 11.63) rotate(51.5819) scale(18.5068 19.1922)'%3E%3Cstop stop-color='%23E7E7E7'/%3E%3Cstop offset='1' stop-color='white' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='paint1_radial_28_1537' cx='0' cy='0' r='1' gradientUnits='userSpaceOnUse' gradientTransform='translate(45 55.63) rotate(-127.513) scale(62.4039 64.7152)'%3E%3Cstop stop-color='%23160000'/%3E%3Cstop offset='0.8125' stop-color='%23D0D0D0'/%3E%3C/radialGradient%3E%3C/defs%3E%3C/svg%3E%0A");
    background-repeat: no-repeat;
    background-size: contain;
}
.range .info {
    border-radius: 50%;
    color: #333;
    cursor: default;
    font: 400 16px/1.1 'Roboto', sans-serif;
    position: absolute;
    text-align: center;
    bottom: 30.6px;
    left: 30.6px;
    right: 30.6px;
    top: 30.6px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    text-transform: uppercase;
    z-index: 130;
    background-color: #fdfdfd;
    border: 1px solid #f5f5f5;
    border-radius: 1000px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    overflow: hidden;
}
.range .info:before {
    content: '';
    background-image: url("data:image/svg+xml, %3Csvg width='47' height='38' viewBox='0 0 47 38' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M23.4999 37.1299L-7.43648e-07 2.10328L5.22222 1.11662L10.4444 0.623276L16.9722 0.129945L23.4999 0.129946L30.0278 0.129946L35.9028 0.623279L41.125 1.60995L47 3.08995L23.4999 37.1299Z' fill='%23FF0032'/%3E%3C/svg%3E%0A");
    display: block;
    position: absolute;
    top: -5px;
    width: 47px;
    height: 38px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}
.range .info-inner {
    position: relative;
    display: block;
    width: 100%;
    margin-top: 20px;
    border-top: 1px solid #edebeb;
}
.range .swiper-slide {
    color: rgba(99, 99, 99, .8);
    text-align: center;
    padding-top: 10px;
    padding-bottom: 15px;
    font-size: 20px;
    max-width: 70px;
    height: 70px;
    width: 100%;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    transition: all .15s ease-in-out;
}
.range .swiper-slide:before {
    content: '';
    width: 1px;
    height: 8px;
    background-color: #edebeb;
    display: block;
    position: absolute;
    bottom: 0;
}
.range .swiper-slide.swiper-slide-active {
    font-size: 45px;
    font-weight: 600;
    color: #000;
}
.range .value {
    padding-top: 10px;
    font-weight: 600;
    font-size: 35px;
    width: 100%;
    display: block;
    text-align: center;
    border-top: 1px solid #edebeb;
}
.turbo-ring {
    position: relative;
}
.swiper-arrow-next, .swiper-arrow-prev {
    position: absolute;
    top: 144px;
    border-radius: 15px;
    background-color: #fbfbfb;
    box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, .25) inset;
    width: 45px;
    height: 45px;
    display: block;
    z-index: 99;
    background-repeat: no-repeat;
    background-position: center;
}
.swiper-arrow-next:after, .swiper-arrow-prev:after {
    display: none;
}
.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled {
    opacity: 1;
}
.swiper-arrow-next {
    right: -20px;
    background-image: url("data:image/svg+xml, %3Csvg width='17' height='17' viewBox='0 0 17 17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.68909 0.494385L8.68909 16.4109' stroke='%237B7B7B'/%3E%3Cline x1='16.6705' y1='8.95264' x2='0.707655' y2='8.95264' stroke='%237B7B7B'/%3E%3C/svg%3E%0A");
}
.swiper-arrow-prev {
    left: -20px;
    background-image: url("data:image/svg+xml, %3Csvg width='17' height='2' viewBox='0 0 17 2' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cline x1='16.3295' y1='0.952637' x2='0.36659' y2='0.952637' stroke='%237B7B7B'/%3E%3C/svg%3E%0A");
}
.slice {
    border-radius: 240px 0 0 240px;
    height: 100%;
    overflow: hidden;
    position: absolute;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    width: 50%;
    z-index: 10;
}
.slice.right {
    border-radius: 0 240px 240px 0;
    right: 0.25px;
}
.slice.right .blocker {
    left: 0;
    right: auto;
    transform-origin: 0 25%}
.slice .blocker {
    background-color: hsla(0, 0%, 100%, .5);
    height: 200%;
    position: absolute;
    right: 0;
    transform-origin: 100% 25%;
    width: 200%}
.hero__block-collapse {
    margin-bottom: 20px;
}
.turbo-button {
    margin-top: 10px;
}
.turbo-button .btn {
    font-weight: 500;
}
.turbo-badges {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-pack: start;
    justify-content: flex-start;
    margin-top: 40px;
    margin-bottom: 20px;
}
.turbo-badges, .turbo-badges__item {
    -ms-flex-align: center;
    align-items: center;
}
.turbo-badges__item {
    display: none;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
    padding: 0 4px;
    color: #1d2023;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.33;
    border-radius: 4px;
    background: #f2f3f7;
    margin-right: 8px;
    margin-bottom: 8px;
}
.turbo-badges__item.active, .turbo-prices {
    display: -ms-flexbox;
    display: flex;
}
.turbo-prices {
    padding: 12px;
    border-radius: 12px;
    background: #fff;
    -ms-flex-align: center;
    align-items: center;
}
.turbo-prices__price {
    color: #000;
    font-size: 30px;
    font-weight: 600;
    line-height: 20px;
    white-space: nowrap;
    margin-right: 40px;
}
.turbo-prices__heading {
    color: #000;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.42;
}
.turbo-prices__about {
    color: #626c77;
    font-size: 14px;
    line-height: 1.42;
}
@media (max-width:360px) {
    .range {
    width: 200px;
    height: 200px;
}
.turbo-ring {
    max-width: 250px;
    width: 250px;
    height: 250px;
}
.range .swiper-slide {
    max-width: 53px;
}
.range .swiper-slide.swiper-slide-active {
    font-size: 28px;
}
.range .value {
    font-size: 20px;
}
}.icon_internet {
    width: 24px;
    height: 24px;
}
.badge_active {
    width: 16px;
    height: 16px;
}
.badge_active {
    width: 74px;
    display: flex;
    height: 20px;
    padding: 1px 4px;
    justify-content: center;
    align-items: center;
}
.turbo_description {
    margin-left: 8px;
    font-size: 24px;
    text-transform: uppercase;
    font-weight: 500;
    text-align: end;
    flex-direction: column-reverse;
}
.active_block {
    height: 144px;
    overflow-x: scroll;
    white-space: nowrap;
    background: #fff;
    border-radius: 16px;
    border: 1px solid #d5d5d7;
    padding: 18px;
    margin-top: 10px;
    margin-bottom: 35px;
}
.active_heading {
    font-feature-settings: 'clig' off, 'liga' off;
    font-family: MTS Wide;
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: 28px;
}
.item_turbo {
    display: flex;
    height: 48px;
    padding: 8px;
    border-bottom: 1px solid #ccc;
    align-content: space-around;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap-reverse;
}
.turbo-prices__old_price{
color: lightslategrey;
font-size: 24px;
text-decoration: line-through;
text-decoration-color: red;
font-weight: 600;
line-height: 20px;
white-space: nowrap;
padding: 10px;
}

.turbo-prices__sale_badge{
    display: flex;
    padding: 2px 6px;
    justify-content: center;
    align-items: center;
    gap: 4px;
    border-radius: 8px;
    background: var(--Accent-Light-Positive, #26CD58);
    font-size: 12px;
    color: white;
    font-weight: 500;
    max-width: max-content;
    margin-top: 5px;
    margin-bottom: 5px;
    position: relative;
}

/* Базовые стили кнопки */
.mts-button {
  /* Layout */
  display: flex;
  justify-content: center;
  align-items: center;
  
  /* Базовые свойства */
  border: none;
  cursor: pointer;
  font-family: "MTS Wide", -apple-system, BlinkMacSystemFont, sans-serif;
  font-weight: 600;
  text-transform: uppercase;
  text-align: center;
  transition: background-color 0.2s ease, transform 0.2s ease;
  outline: none;
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
}

/* Размеры с правильной высотой */
.mts-button--size-24 {
  width: 335px;
  height: 24px;
  padding: 4px;
  border-radius: 8px;
  font-size: 12px;
  line-height: 16px;
  letter-spacing: 0.6px;
}

.mts-button--size-32 {
  width: 335px;
  height: 32px;
  padding: 8px;
  border-radius: 12px;
  font-size: 10px;
  line-height: 12px;
  letter-spacing: 0.5px;
}

.mts-button--size-44 {
  width: 335px;
  height: 44px;
  padding: 10px;
  border-radius: 16px;
  font-size: 12px;
  line-height: 16px;
  letter-spacing: 0.6px;
}

.mts-button--size-52 {
  width: 335px;
  height: 52px;
  padding: 14px;
  border-radius: 16px;
  font-size: 12px;
  line-height: 16px;
  letter-spacing: 0.6px;
}

.mts-button--size-72 {
  width: 335px;
  height: 72px;
  padding: 24px;
  border-radius: 20px;
  font-size: 14px;
  line-height: 20px;
  letter-spacing: 0.7px;
}

/* CSS переменные для цветов */
:root {
  /* Основные цвета кнопок */
  --Button-Primary: #FF0032;
  --Button-Primary-Hover: #E4002E;
  --Button-Primary-Alternative: #1D2023;
  --Button-Primary-Alternative-Hover: #36393D;
  --Button-Always-White: #FFF;
  --Button-Always-White-Hover: #E4E7EC;
  --Button-Secondary: #F2F3F7;
  --Button-Secondary-Hover: #E5E7ED;
  --Button-Blur: rgba(255, 255, 255, 0.08);
  --Button-Blur-Hover: #E7E9EC;
  --Button-Ghost: transparent;
  --Button-Ghost-Hover: #E7E9EC;
  --Button-Negative: #F2F3F7;
  --Button-Negative-Hover: #E5E7ED;
  --Button-Disabled: rgba(188, 195, 208, 0.50);
  
  /* Текстовые цвета */
  --Text-Primary: #FFF;
  --Text-Secondary: #1D2023;
  --Text-Negative: #D8400C;
  --Text-Disabled: #969FA8;
  
  /* Границы */
  --Border-Ghost: #E5E7EB;
}

/* Варианты кнопок - default состояния */
.mts-button--primary {
  background: var(--Button-Primary);
  color: var(--Text-Primary);
}

.mts-button--primary-alternative {
  background: var(--Button-Primary-Alternative);
  color: var(--Text-Primary);
}

.mts-button--always-white {
  background: var(--Button-Always-White);
  color: var(--Text-Secondary);
}

.mts-button--blur {
  background: var(--Button-Blur);
  color: var(--Text-Primary);
  backdrop-filter: blur(20px);
}

.mts-button--secondary {
  background: var(--Button-Secondary);
  color: var(--Text-Secondary);
}

.mts-button--ghost {
  background: var(--Button-Ghost);
  color: var(--Text-Secondary);
  border: 1px solid var(--Border-Ghost);
}

.mts-button--negative {
  background: var(--Button-Negative);
  color: var(--Text-Negative);
}

.mts-button--scroll {
  background: transparent;
  color: var(--Text-Secondary);
  width: auto !important;
  min-width: 44px;
  height: 44px;
  padding: 10px !important;
}

/* Hover эффекты для каждого типа */

/* Primary */
.mts-button--primary:hover:not(.mts-button--disabled):not(.mts-button--waiting) {
  background: var(--Button-Primary-Hover);
}

/* Primary Alternate */
.mts-button--primary-alternative:hover:not(.mts-button--disabled):not(.mts-button--waiting) {
  background: var(--Button-Primary-Alternative-Hover);
}

/* Always White */
.mts-button--always-white:hover:not(.mts-button--disabled):not(.mts-button--waiting) {
  background: var(--Button-Always-White-Hover);
}

/* Blur - при hover меняется на solid цвет */
.mts-button--blur:hover:not(.mts-button--disabled):not(.mts-button--waiting) {
  background: var(--Background-Hover, rgba(188, 195, 208, 0.25));
  backdrop-filter: blur(0px);
}

/* Secondary */
.mts-button--secondary:hover:not(.mts-button--disabled):not(.mts-button--waiting) {
  background: var(--Button-Secondary-Hover);
}

/* Ghost - добавляем background при hover */
.mts-button--ghost:hover:not(.mts-button--disabled):not(.mts-button--waiting) {
  background: var(--Button-Ghost-Hover);
}

/* Negative */
.mts-button--negative:hover:not(.mts-button--disabled):not(.mts-button--waiting) {
  background: var(--Button-Negative-Hover);
}

/* Scroll - hover для круглой кнопки */
.mts-button--scroll:hover:not(.mts-button--disabled):not(.mts-button--waiting) {
  background: var(--Button-Secondary-Hover);
}

/* Текст для разных вариантов */
.mts-button--primary,
.mts-button--primary-alternative,
.mts-button--blur {
  font-feature-settings: 'liga' off, 'clig' off;
}

/* Состояние disabled */
.mts-button--disabled {
  opacity: 0.6;
  background: var(--Button-Disabled) !important;
  cursor: not-allowed !important;
}

.mts-button--disabled .mts-button__text {
  color: var(--Text-Disabled) !important;
}

/* Убираем hover эффекты для disabled и waiting */
.mts-button--disabled:hover,
.mts-button--waiting:hover {
  background: var(--Button-Disabled) !important;
  transform: none !important;
  box-shadow: none !important;
}

/* Для ghost кнопки в disabled состоянии */
.mts-button--disabled.mts-button--ghost:hover {
  border: 1px solid var(--Border-Ghost);
}

/* Fluid вариант */
.mts-button--fluid {
  width: 100% !important;
}

/* Состояние waiting */
.mts-button--waiting {
  cursor: wait !important;
}

.mts-button--waiting .mts-button__text {
  opacity: 0.7;
}

/* Контейнер контента */
.mts-button__content {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  height: 100%;
}

.mts-button__text {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}

/* Спиннер */
.mts-button__spinner-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  animation: mts-spin 1s linear infinite;
}

.mts-button__spinner {
  width: 20px;
  height: 20px;
  color: currentColor;
}

.mts-button__spinner-dark {
  width: 24px;
  height: 24px;
  color: currentColor;
}

@keyframes mts-spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

/* Контекстные цвета фона */
.mts-button--context-primary {
  /* Дополнительные стили для фона primary */
}

.mts-button--context-secondary {
  /* Дополнительные стили для фона secondary */
}


/* Focus состояния */
.mts-button:not(.mts-button--disabled):focus {
  box-shadow: 0 0 0 3px rgba(255, 0, 50, 0.3);
}

.mts-button--always-white:not(.mts-button--disabled):focus {
  box-shadow: 0 0 0 3px rgba(29, 32, 35, 0.3);
}

/* Добавьте эти стили к существующим */

/* Состояние waiting - спиннер в центре */
.mts-button--waiting .mts-button__content {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}

.mts-button--waiting .mts-button__text {
  display: none; /* Скрываем текст при загрузке */
}

.mts-button__spinner-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  animation: mts-spin 1s linear infinite;
}

/* Размеры спиннера в зависимости от размера кнопки */
.mts-button--size-24 .mts-button__spinner,
.mts-button--size-24 .mts-button__spinner-dark {
  width: 16px;
  height: 16px;
}

.mts-button--size-32 .mts-button__spinner,
.mts-button--size-32 .mts-button__spinner-dark {
  width: 16px;
  height: 16px;
}

.mts-button--size-44 .mts-button__spinner,
.mts-button--size-44 .mts-button__spinner-dark {
  width: 24px;
  height: 24px;
}

.mts-button--size-52 .mts-button__spinner,
.mts-button--size-52 .mts-button__spinner-dark {
  width: 24px;
  height: 24px;
}

.mts-button--size-72 .mts-button__spinner,
.mts-button--size-72 .mts-button__spinner-dark {
  width: 24px;
  height: 24px;
}

/* Адаптивность */
@media (max-width: 768px) {
  .mts-button--size-24,
  .mts-button--size-32,
  .mts-button--size-44,
  .mts-button--size-52,
  .mts-button--size-72 {
    width: 100%;
    max-width: 335px;
  }
  
  .mts-button--fluid {
    max-width: 100% !important;
  }
}.header {
  border-bottom: 1px solid var(--Background-Light-Stroke, rgba(188, 195, 208, 0.50));
  background: var(--Background-Light-Primary, #FFF);
  position: sticky;
  top: 0;
  z-index: 1000;
  font-family: "MTS Compact";
  padding: 10px 20px;
}

.header__content {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.header__logo {
  display: flex;
  width: 32px;
  height: 32px;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
}

.logo-red {
  color: var(--mts-red);
  font-size: 1.5rem;
}

.logo-text {
  color: var(--mts-gray-dark);
  font-size: 0.9rem;
}

.header__nav {
  display: flex;
  gap: 2rem;
}

.nav-link {
  color: var(--mts-gray);
  font-weight: 500;
  transition: color 0.3s;
}

.nav-link:hover {
  color: var(--mts-red);
}

.header__phone {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  background: none;
  border: 1px solid var(--mts-red);
  color: var(--mts-red);
  padding: 0.5rem 1rem;
  border-radius: 4px;
  cursor: pointer;
  transition: all 0.3s;
}

.header__phone:hover {
  background: var(--mts-red);
  color: var(--mts-white);
}

.header__menu {
  display: none;
  flex-direction: column;
  gap: 4px;
  background: none;
  border: none;
  cursor: pointer;
}

.header__menu span {
  width: 24px;
  height: 2px;
  background: var(--mts-gray-dark);
}

.enter__button {
  display: flex;
  height: 32px;
  padding: 6px 8px;
  justify-content: center;
  align-items: center;
  border-radius: 6px;
  background: var(--Controls-Light-Primary-Active, #FF0032);
  color: var(--Constant-Greyscale-0, #FFF);
  text-align: center;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Compact";
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px; /* 142.857% */
  border-width: 0px;
}

@media (max-width: 768px) {
  .header__nav {
    display: none;
  }
  
  .header__phone {
    display: none;
  }
  
  .header__menu {
    display: flex;
  }
}.hero {
  padding: var(--spacing-xl) 0;
  overflow: hidden;
}

.hero__content {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-xl);
  align-items: flex-start;
  background: linear-gradient(156deg, #798EFB 27.85%, rgba(123, 143, 251, 0.96) 33.16%, rgba(127, 146, 250, 0.85) 41.66%, rgba(135, 150, 249, 0.68) 52.28%, rgba(145, 157, 248, 0.44) 65.02%, rgba(158, 165, 246, 0.13) 78.83%, rgba(164, 168, 245, 0.00) 85.2%), radial-gradient(56.7% 88.91% at 114.85% 80.66%, rgba(255, 197, 184, 0.70) 0%, rgba(255, 195, 183, 0.64) 6%, rgba(255, 188, 177, 0.42) 30%, rgba(255, 183, 172, 0.24) 52%, rgba(255, 179, 169, 0.11) 72%, rgba(255, 177, 167, 0.03) 89%, rgba(255, 176, 166, 0.00) 100%), linear-gradient(116deg, rgba(101, 176, 255, 0.30) 27.75%, rgba(255, 255, 255, 0.00) 65.16%), radial-gradient(64.71% 58.92% at 77.64% 65.16%, rgba(242, 216, 255, 0.60) 0%, rgba(242, 216, 255, 0.00) 100%), linear-gradient(24deg, #8CAFFF 9.11%, #E4F0FF 57.73%);
  padding: 48px;
  border-radius: 0px 0px 3.75rem 3.75rem;
}

.hero__grid-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  max-width: 1440px;
  align-self: center;
}

/* ===== СТИЛИ ДЛЯ КАРТОЧКИ ===== */
.card__header {
  display: flex;
  flex-direction: column;
  align-items: center;
  align-self: stretch;
}

.hero__card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  border-radius: 40px;
  background: var(--Background-Light-Primary-Elevated, #FFF);
  z-index: 2;
}

.hero__card__content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  max-width: 568px;
}

/* ===== ТИТУЛ ВНУТРИ КАРТОЧКИ (titleUp = false) ===== */
.hero__title {
  color: var(--Text-Inverted, #FAFAFA);
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Wide";
  font-size: 32px;
  font-style: normal;
  font-weight: 500;
  line-height: 36px;
  margin: 0;
}

.hero__subtitle {
  color: var(--Text-Inverted, #FAFAFA);
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Text";
  font-size: 17px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  margin: 0;
}

.hero__main__container{
  width: 100%;
  max-width: 1440px;
  align-self: center;
}

/* ===== ТИТУЛ ВНЕ КАРТОЧКИ (titleUp = true) ===== */
.hero__title-up-block {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  max-width: 568px;
  margin-bottom: 48px;
  width: 100%;
}

.hero__title-up-block--center {
  text-align: center;
}

.hero__title.hero__title--up {
  color: var(--Text-Primary, #1D2023);
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Wide";
  font-style: normal;
  font-weight: 500;
  margin: 0;
  font-size: 36px;
  font-style: normal;
  font-weight: 500;
  line-height: 40px; /* 111.111% */
  text-align: left;
}

.hero__subtitle.hero__subtitle--up {
  color: var(--Text-Secondary, #626C77);
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Text";
  font-style: normal;
  font-weight: 400;
  margin: 0;
  font-size: 20px;
  font-style: normal;
  line-height: 28px; 
  text-align: left;
}

/* ===== ОСТАЛЬНЫЕ СТИЛИ ===== */
.button__area,
.hero__actions {
  width: 100%;
  align-self: flex-start;
  display: flex;
}

.hero__actions {
  max-width: 600px;
}

.button__area {
  max-width: 335px;
}

.hero__image {
  width: 250px;
  height: 7vh;
  flex-shrink: 0;
}

.hero__image img {
  margin-left: -35vw;
  width: calc(100% + 600px);
  border-radius: 14px;
  max-width: unset;
  object-fit: cover;
  object-position: center;
  margin-top: -50%;
}

/* ===== ДЕСКТОПНЫЕ СТИЛИ (min-width: 1024px) ===== */
@media (min-width: 1024px) {
  .hero__desktop-direction--left .hero__grid-container {
    flex-direction: row;
  }
  
  .hero__desktop-direction--left .hero__card {
    order: 1;
  }
  
  .hero__desktop-direction--left .card__header {
    order: 2;
    z-index: 0;
  }
  
  .hero__desktop-direction--right .hero__grid-container {
    flex-direction: row-reverse;
  }
  
  .hero__desktop-direction--right .hero__card {
    order: 2;
  }
  
  .hero__desktop-direction--right .card__header {
    order: 1;
  }
  
  /* Стили для titleUp на десктопе */
  .hero__content--title-up {
    gap: 32px;
  }
  
  .hero__content--title-up .hero__title-up-block {
    max-width: 568px;
  }

}

/* ===== ТАБЛЕТ И МОБИЛЬНЫЕ СТИЛИ (max-width: 1023px) ===== */
@media (max-width: 1023px) {
  .hero__grid-container {
    flex-direction: column;
    gap: var(--spacing-xl);
  }
  
  .button__area {
    align-self: center;
  }
  
  .hero__card {
    padding: 32px;
    border-radius: 32px;
  }
  
  .hero__image img {
    margin-left: auto;
    width: calc(100%);
    margin-top: -24px;
    border-radius: 14px;
  }
}

/* ===== МОБИЛЬНЫЕ СТИЛИ (max-width: 768px) ===== */
@media (max-width: 768px) {
  .hero {
    padding: var(--spacing-lg) 0;
  }
  
  .hero__content {
    padding: 0;
  }
  
  .hero__content--title-up {
    padding-top: 32px;
  }
  
  /* Мобильные стили для title внутри карточки */
  .hero__title--up {
    font-size: 24px;
    line-height: 28px;
    text-align: center;
    
  }

  .hero:not(.hero__content--title-up) .hero__subtitle {
    font-size: 17px !important;
    line-height: 24px !important;
    text-align: center;
  }
  
  /* Мобильные стили для titleUp */
  .hero__content--title-up .hero__title-up-block {
    margin-bottom: 16px;
    max-width: 100%;
    padding: 0 20px;
    text-align: center;
  }
  
  .hero__content--title-up .hero__title--up {
    font-size: 24px !important;
    line-height: 28px !important;
    text-align: center;
  }
  
  .hero__content--title-up .hero__subtitle--up {
    font-size: 17px !important;
    line-height: 24px !important;
    text-align: center;
  }
}

/* ===== ОБЩИЕ СТИЛИ ДЛЯ ВСЕХ МОБИЛЬНЫХ УСТРОЙСТВ ===== */
@media (max-width: 780px) {
  .hero__content {
    border-radius: 0px 0px 32px 32px;
  }
  
  /* Центрирование текста в карточке на мобильных */
  .hero__card__content--center-mobile {
    text-align: center;
    align-items: center;
  }
  
  /* Центрирование titleUp на мобильных если нужно */
  .hero__title-up-block--center {
    text-align: center;
    align-items: center;
  }
}

/* ===== МАЛЕНЬКИЕ МОБИЛЬНЫЕ УСТРОЙСТВА (max-width: 480px) ===== */
@media (max-width: 480px) {
  .hero__card {
    padding: 20px;
    border-radius: 28px;
  }

  
  .hero__content--title-up .hero__title-up-block {
    padding: 0 16px;
    margin-bottom: 12px;
  }
  
  .hero__title {
    font-size: 24px !important;
    line-height: 28px !important;
  }

  
  .hero__title.hero__title--up {
    font-size: 24px !important;
    line-height: 28px !important;
  }
  
  .hero:not(.hero__content--title-up) .hero__subtitle {
    font-size: 17px !important;
    line-height: 24px !important;
  }
  
  .hero__content--title-up .hero__subtitle--up {
    font-size: 17px !important;
    line-height: 24px !important;
  }
  
  
}

/* ===== АНИМАЦИИ ===== */
.hero__content--animated {
  position: relative;
  overflow: auto;
}

.hero__content--animated::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
  animation: shimmerHero 3s infinite;
  z-index: 0;
}

.hero__content--animated::after {
  content: '';
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);
  animation: pulseHero 8s infinite alternate;
  z-index: 0;
}

@keyframes shimmerHero {
  0% { transform: translateX(-100%); }
  100% { transform: translateX(100%); }
}

@keyframes pulseHero {
  0% { 
    transform: scale(1) rotate(0deg);
    opacity: 0.3; 
  }
  50% { 
    transform: scale(1.1) rotate(180deg);
    opacity: 0.5; 
  }
  100% { 
    transform: scale(1) rotate(360deg);
    opacity: 0.3; 
  }
}

.hero__content--animated-gradient {
  background-size: 200% 200%;
  animation: gradientShift 15s ease infinite;
}

@keyframes gradientShift {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

/* ===== Z-INDEX ДЛЯ АНИМАЦИЙ ===== */
.hero__card,
.card__header,
.hero__title-up-block {
  position: relative;
  z-index: 1;
}

/* ===== АДАПТИВНЫЕ АНИМАЦИИ ===== */
@media (max-width: 768px) {
  .hero__content--animated::before {
    animation: shimmerHero 4s infinite;
  }
  
  .hero__content--animated::after {
    animation: pulseHero 10s infinite alternate;
  }
}

/* ===== ДОПОЛНИТЕЛЬНЫЕ СТИЛИ ===== */
.phone-mockup {
  position: relative;
  width: 300px;
  height: 600px;
  margin: 0 auto;
  border-radius: 40px;
  background: var(--mts-white);
  box-shadow: var(--shadow-lg);
  padding: 20px;
}

.phone-screen {
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, #e30613 0%, #ff6b6b 100%);
  border-radius: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2rem;
}

.payment-screen {
  text-align: center;
  color: white;
}

.payment-icon {
  font-size: 4rem;
  display: block;
  margin-bottom: 1rem;
}

.payment-screen h3 {
  font-size: 1.5rem;
  margin-bottom: 0.5rem;
}

.features {
  padding: var(--spacing-xl) 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 48px;
  align-self: stretch;
  margin-top: 12px;
  padding:48px;
  position: relative;
  border-radius: 3.75rem
}

.section-title {
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Wide";
  font-size: 32px;
  font-style: normal;
  font-weight: 500;
  line-height: 36px;
  margin: 0;
}

.features__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}

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

.features__container {
  width: 100%;
  margin-right: auto;
  margin-left: auto;
  display: flex;
  gap: 48px;
  flex-direction: column;
  max-width:1440px;
}

.section-description {
  align-self: stretch;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Text";
  font-size: 20px;
  font-style: normal;
  font-weight: 400;
  line-height: 28px;
  margin: 0;
}

.loading {
  text-align: center;
  padding: 40px;
  font-family: "MTS Text";
  color: var(--Text-Light-Secondary, #626C77);
}

/* Карусель стили */
.features-carousel {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.features-carousel__container {
  position: relative;
  width: 100%;
  overflow: hidden;
  touch-action: pan-y;
  margin-bottom: 24px;
}

.features-carousel__track {
  display: flex;
  transition: transform 0.3s ease;
  will-change: transform;
}

.features-carousel__slide {
  flex: 0 0 auto;
  box-sizing: border-box;
  transition: width 0.3s ease;
}

.carousel-navigation {
  margin-bottom: 1.5px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
}

.carousel-controls {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 12px;
  width: 100%;
}

.carousel-arrow {
  height: 48px;
  background: white;
  border: 1px solid #E5E7EB;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.2s ease;
  --button-icon-size: 1.5rem;
  border-radius: 1rem;
  padding: 0.625rem;
  width: 2.75rem;
}

.carousel-arrow:hover:not(:disabled) {
  background: #F3F4F6;
  transform: scale(1.05);
}

.carousel-arrow:disabled {
  opacity: 0.3;
  cursor: not-allowed;
}

.carousel-arrow svg {
  width: 24px;
  height: 24px;
  color: #1D2023;
}

/* Индикаторы (dots) */
.carousel-dots {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
}

.carousel-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #D1D5DB;
  border: none;
  padding: 0;
  cursor: pointer;
  transition: all 0.3s ease;
}

.carousel-dot--active {
  background: #8d969f;
  transform: scale(1.2);
}

.carousel-dot:hover {
  background: #9CA3AF;
}

/* Медиа-запросы */
@media (max-width: 1024px) {
  .features__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 768px) {
  .features__grid {
    grid-template-columns: 1fr;
  }

  .header_container {
    width: 100%;
    gap: 8px;
  }
  
  .section-title {
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
  }
  
  .features {
    display: flex;
    padding: 20px;
    flex-direction: column;
    align-items: flex-start;
    gap: 40px;
    align-self: stretch;
    border-radius: 32px;
  }

  .section-description {
    font-size: 17px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
  }
  
  .features__container {
    gap: 20px;
  }
  
  .features-carousel__slide {
    padding: 0 8px;
  }
  /* Новый класс для центрирования текста на мобильных */
  .header_container--center-mobile {
    align-items: center;
    text-align: center;
  }

}

/* Для планшетов показываем 2 карточки */
@media (min-width: 769px) and (max-width: 1023px) {
  .features-carousel__slide {
    padding: 0 8px;
  }
}

/* Для десктопа показываем 3 карточки */
@media (min-width: 1024px) {
  .features-carousel__slide {
    padding: 0 6px;
  }
  
  /* На десктопе скрываем dots и показываем стрелки */
  .carousel-dots {
    display: none;
  }
  
  .carousel-controls {
    display: flex;
  }
}

/* На планшетах и мобильных показываем dots, скрываем стрелки */
@media (max-width: 1023px) {
  .carousel-controls {
    display: none;
  }
  
  .carousel-dots {
    display: flex;
  }
}

@media (max-width: 768px) {
  .feature-section__title {
    text-align: center;
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "MTS Wide";
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
  }
}.feature-card {
  position: relative;
  border-radius: 12px;
  text-align: center;
  transition: transform 0.3s, box-shadow 0.3s;
  display: flex;
  height: 267px;
  padding: 8px;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  gap: 12px;
  align-self: stretch;
  border-radius: 32px;
  overflow: hidden;
}

.feature-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border-radius: 32px;
  background: linear-gradient(177deg, #F2F3F7 2.48%, #E8EDFF 58.35%);
  z-index: 1;
}

.feature-card:hover {
  transform: translateY(-5px);
  box-shadow: var(--shadow-lg);
}

.feature-card__icon-wrapper {
  position: relative;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 2;
  margin-bottom: var(--spacing-md);
  flex: 1;
}

.feature-card__icon {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  z-index: 3;
}

/* Стили для feature-image */
.feature-card__icon img.feature-image {
  max-width: 220px;
  max-height: 220px;
  width: auto;
  height: auto;
  object-fit: contain;
  position: relative;
  z-index: 3;
}

.feature-card__title {
  color: var(--Text-Light-Primary, #1D2023);
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Text";
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px; 
  margin:0
}

.feature-card__description {
  color: var(--Text-Light-Secondary, #626C77);
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Text";
  font-size: 17px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px; 
  margin: 0;
}

.feature-card__container {
  display: flex;
  padding: 16px;
  flex-direction: column;
  align-items: flex-start;
  align-self: stretch;
  border-radius: 24px;
  background: var(--Background-Light-Primary, #FFF);
  box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.08), 0 4px 16px 0 rgba(0, 0, 0, 0.08);
  gap: 4px;
  text-align: left;
  position: relative;
  z-index: 4;
}

/* Динамический фон */
.feature-card[style*="background"]::before {
  background: inherit;
}

/* СТИЛИ ДЛЯ ПЕРЕКРЫТИЯ ИЗОБРАЖЕНИЯ */
.feature-card--image-overlap .feature-card__icon-wrapper {
  margin-bottom: -24px; 
  z-index: 5; 
}

.feature-card--image-overlap .feature-card__icon {
  transform: translateY(12px); /* Слегка сдвигаем изображение вниз */
}

.feature-card--image-overlap .feature-card__container {
  position: relative;
  z-index: 5;
  margin-top: -12px; 
  
}

/* Альтернативный вариант с более сильным перекрытием */
.feature-card--image-overlap.feature-card--strong-overlap .feature-card__icon-wrapper {
  margin-bottom: -40px;
}

.feature-card--image-overlap.feature-card--strong-overlap .feature-card__icon {
  transform: translateY(24px);
}

.feature-card--image-overlap.feature-card--strong-overlap .feature-card__container {
  margin-top: -20px;
  padding-top: 40px;
}

@media (min-width: 768px) {
  .feature-card__container {
    min-height: 50%;
  }
  
  .feature-card__icon img.feature-image {
    max-width: 220px;
    max-height: 220px;
  }
  
  /* Для десктопа можно увеличить перекрытие */
  .feature-card--image-overlap .feature-card__icon-wrapper {
    margin-bottom: -32px;
  }
  
  .feature-card--image-overlap .feature-card__icon {
    transform: translateY(16px);
  }
  
  .feature-card--image-overlap .feature-card__container {
    margin-top: -16px;
   padding-top: 28;
  }
}

@media (max-width: 768px) {
  .feature-card__title {
    font-size: 17px;
  }
  .feature-card__description {
    font-size: 14px;
  }
}/* ========== ОСНОВНЫЕ СТИЛИ ========== */
.landing-classic-section {
  padding: 48px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 40px;
  align-self: stretch;
  position: relative;
  border-radius: 3.75rem;
  width: 100%;
  box-sizing: border-box;
  overflow: visible !important;
}

.landing-classic-section__container {
  width: 100%;
  margin-right: auto;
  margin-left: auto;
  display: flex;
  gap: 20px;
  flex-direction: row;
  box-sizing: border-box;
  min-height: 0;
  overflow: visible !important;
}

.landing-classic-section__header {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  box-sizing: border-box;
  flex-shrink: 0;
  overflow: visible !important;
}

.landing-classic-section__header--default {
  width: 592px;
  flex: 0 0 592px;
  max-width: 592px;
  min-width: 0;
}

.landing-classic-section__header--compact {
  width: 396px;
  flex: 0 0 396px;
  max-width: 396px;
  min-width: 0;
}

.landing-classic-section__header--full {
  width: 100%;
  flex: 1;
  min-width: 0;
}

.landing-classic-section__content {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  overflow: visible !important;
  flex-shrink: 1;
  position: relative;
}

[data-desktop-direction] {
  width: 100%;
  box-sizing: border-box;
}

/* ========== ТИПОГРАФИЯ ========== */
.landing-classic-section__title {
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Wide";
  font-size: 32px;
  font-style: normal;
  font-weight: 500;
  line-height: 36px;
  margin: 0;
  word-wrap: break-word;
  overflow-wrap: break-word;
  overflow: visible !important;
  white-space: normal !important;
  text-align: left;
}

.landing-classic-section__description {
  align-self: stretch;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Text";
  font-size: 20px;
  font-style: normal;
  font-weight: 400;
  line-height: 28px;
  margin: 0;
  word-wrap: break-word;
  overflow-wrap: break-word;
  overflow: visible !important;
  white-space: normal !important;
  text-align: left;
}

.landing-classic-section__badge-container {
  width: 100%;
  min-width: 0;
  overflow: visible !important;
}

/* ========== МОБИЛЬНАЯ ВЕРСИЯ (до 767px) ========== */
@media (max-width: 767px) {
  .landing-classic-section {
    padding: 20px;
    border-radius: 32px;
    margin-top: 12px !important;
    gap: 40px;
  }
  
  .landing-classic-section__container {
    flex-direction: column !important;
  }
  
  .landing-classic-section__header {
    width: 100% !important;
    gap: 8px;
    flex: 1 !important;
    min-width: 0 !important;
  }
  
  .landing-classic-section__header--default,
  .landing-classic-section__header--compact,
  .landing-classic-section__header--full {
    width: 100% !important;
    flex: 1 !important;
    max-width: 100% !important;
  }
  
  .landing-classic-section__title {
    font-size: 20px;
    line-height: 24px;
    font-family: "MTS Text";
  }
  
  .landing-classic-section__description {
    font-size: 17px;
    line-height: 24px;
  }
  
  [data-desktop-direction="bottom"],
  [data-desktop-direction="top"] {
    order: 0 !important;
    width: 100% !important;
  }
  
  /* Центрирование текста на мобилке */
  .landing-classic-section__header--center-mobile {
    align-items: center !important;
    text-align: center !important;
  }
  
  .landing-classic-section__header--center-mobile .landing-classic-section__title,
  .landing-classic-section__header--center-mobile .landing-classic-section__description {
    text-align: center !important;
  }
  
  /* Бордер-радиус видео на мобилке */
  .landing-classic-section .video-container,
  .landing-classic-section .video-container video,
  .landing-classic-section .video-container img,
  .landing-classic-section .video-container .feature-video,
  .landing-classic-section .video-container .feature-image {
    border-radius: 20px !important;
  }
}

/* ========== ДЕСКТОПНАЯ ВЕРСИЯ (от 768px) ========== */
@media (min-width: 768px) {
  .landing-classic-section {
    margin-top: var(--desktop-margin-top, 16px) !important;
  }
  
  .landing-classic-section__container {
    flex-wrap: wrap;
    gap: 40px;
  }
  
  .landing-classic-section__content {
    justify-content: center;
    align-items: stretch;
  }
  
  /* Стили для изображений и видео */
  .landing-classic-section__content img,
  .landing-classic-section__content video,
  .landing-classic-section__content .video-container {
    width: 100%;
    max-width: 100%;
    height: auto;
    max-height: min(427px, 40vh);
    object-fit: contain;
    object-position: center;
    display: block;
    flex-shrink: 1;
  }
  
  /* Бордер-радиус видео на десктопе */
  .landing-classic-section .video-container,
  .landing-classic-section .video-container video,
  .landing-classic-section .video-container img,
  .landing-classic-section .video-container .feature-video,
  .landing-classic-section .video-container .feature-image {
    border-radius: 48px !important;
  }
  
  /* Направления на десктопе */
  .landing-classic-section__desktop-direction--left .landing-classic-section__container {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    min-height: 0;
    max-width:1440px;
  }
  
  .landing-classic-section__desktop-direction--left .landing-classic-section__header {
    order: 1;
    flex: 0 0 auto;
    min-width: 0;
  }
  
  .landing-classic-section__desktop-direction--left .landing-classic-section__content {
    order: 2;
    flex: 1 1 0%;
    width: 0;
    min-width: 0;
    display: flex;
    align-items: flex-start;
    justify-content: flex-end;
    overflow: hidden;
    padding-top: 0;
  }
  
  .landing-classic-section__desktop-direction--right .landing-classic-section__container {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    min-height: 0;
  }
  
  .landing-classic-section__desktop-direction--right .landing-classic-section__header {
    order: 2;
    flex: 0 0 auto;
    min-width: 0;
  }
  
  .landing-classic-section__desktop-direction--right .landing-classic-section__content {
    order: 1;
    flex: 1 1 0%;
    width: 0;
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    overflow: hidden;
  }
  
  .landing-classic-section__desktop-direction--side .landing-classic-section__container {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    gap: 40px;
    min-height: 0;
  }
  
  .landing-classic-section__desktop-direction--side .landing-classic-section__header {
    order: 1;
    flex: 0 0 auto;
    min-width: 0;
  }
  
  .landing-classic-section__desktop-direction--side .landing-classic-section__content {
    order: 2;
    flex: 1 1 0%;
    width: 0;
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
  }
  
  /* Режимы bottom и top */
  .landing-classic-section__desktop-direction--bottom .landing-classic-section__container,
  .landing-classic-section__desktop-direction--top .landing-classic-section__container {
    flex-direction: column;
    gap: 40px;
  }
  
  .landing-classic-section__desktop-direction--top .landing-classic-section__container {
    flex-direction: column-reverse;
  }
  
  .landing-classic-section__desktop-direction--bottom .landing-classic-section__header,
  .landing-classic-section__desktop-direction--bottom .landing-classic-section__content,
  .landing-classic-section__desktop-direction--top .landing-classic-section__header,
  .landing-classic-section__desktop-direction--top .landing-classic-section__content {
    width: 100%;
  }
  
  /* Элементы с direction на десктопе */
  .landing-classic-section__desktop-direction--left [data-desktop-direction="bottom"],
  .landing-classic-section__desktop-direction--right [data-desktop-direction="bottom"],
  .landing-classic-section__desktop-direction--side [data-desktop-direction="bottom"],
  .landing-classic-section__desktop-direction--left [data-desktop-direction="top"],
  .landing-classic-section__desktop-direction--right [data-desktop-direction="top"],
  .landing-classic-section__desktop-direction--side [data-desktop-direction="top"] {
    width: 100% !important;
  }
  
  .landing-classic-section__desktop-direction--left [data-desktop-direction="bottom"],
  .landing-classic-section__desktop-direction--right [data-desktop-direction="bottom"],
  .landing-classic-section__desktop-direction--side [data-desktop-direction="bottom"],
  .landing-classic-section__desktop-direction--bottom [data-desktop-direction="bottom"],
  .landing-classic-section__desktop-direction--top [data-desktop-direction="bottom"] {
    order: 999;
  }
  
  .landing-classic-section__desktop-direction--left [data-desktop-direction="top"],
  .landing-classic-section__desktop-direction--right [data-desktop-direction="top"],
  .landing-classic-section__desktop-direction--side [data-desktop-direction="top"],
  .landing-classic-section__desktop-direction--bottom [data-desktop-direction="top"],
  .landing-classic-section__desktop-direction--top [data-desktop-direction="top"] {
    order: -999;
  }
}

/* ========== ВЫРАВНИВАНИЕ КОНТЕНТА (contentAlign) ========== */
.landing-classic-section__content--start {
  align-items: flex-start !important;
}

.landing-classic-section__content--center {
  align-items: center !important;
}

.landing-classic-section__content--end {
  align-items: flex-end !important;
}

.landing-classic-section__content--start > * {
  align-self: flex-start !important;
}

.landing-classic-section__content--center > * {
  align-self: center !important;
}

.landing-classic-section__content--end > * {
  align-self: flex-end !important;
}

/* ========== РАСКЛАДКА КОНТЕНТА ========== */
.landing-classic-section__content--grid {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.landing-classic-section__content--flex {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
}

/* ========== АДАПТИВНЫЕ ШИРИНЫ ДЛЯ ДЕСКТОПА ========== */
@media (min-width: 1024px) and (max-width: 1279px) {
  .landing-classic-section__header--default {
    width: 500px !important;
    flex: 0 0 500px !important;
    max-width: 500px !important;
  }
  
  .landing-classic-section__header--compact {
    width: 350px !important;
    flex: 0 0 350px !important;
    max-width: 350px !important;
  }
}

@media (min-width: 768px) and (max-width: 1023px) {
  .landing-classic-section__header--default {
    width: 450px !important;
    flex: 0 0 450px !important;
    max-width: 450px !important;
  }
  
  .landing-classic-section__header--compact {
    width: 300px !important;
    flex: 0 0 300px !important;
    max-width: 300px !important;
  }
}

/* ========== МЕЛКИЕ ИСПРАВЛЕНИЯ ========== */
@media (max-width: 480px) {
  .landing-classic-section__title,
  .landing-classic-section__description {
    word-break: break-word !important;
    hyphens: auto !important;
  }
}.footer {
  display: flex;
  padding: 24px;
  justify-content: space-between;
  align-items: flex-start;
  align-self: stretch;
}

.footer__content {
  display: grid;
  grid-template-columns: 1fr 2fr 1fr;
  gap: var(--spacing-xl);
  margin-bottom: var(--spacing-xl);
}

.footer__info {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-md);
}

.footer__logo {
  font-size: 2rem;
  font-weight: 700;
  color: var(--mts-red);
}

.footer__description {
  color: #aaa;
  line-height: 1.6;
  font-size: 0.9rem;
}

.footer__bottom {
  color: var(--Text-Secondary, #626C77);
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Compact";
  font-size: 17px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
}

.footer__copyright {
  margin: 0;
  text-align: left;
}

@media (min-width: 769px) {
  .footer__copyright {
    white-space: nowrap;
    text-align: left;
  }
}

@media (max-width: 768px) {
  .footer__copyright {
    display: inline-block;
    text-align: left;
    position: relative;
  }
  
  .footer__copyright::before {
    content: "© " attr(data-year) " ПАО «МТС»\A Все права защищены. 18+";
    white-space: pre-wrap;
    text-align: left;
    display: block;
  }
  
  .footer__copyright {
    font-size: 0;
  }
  
  .footer__copyright::before {
    font-size: 17px;
    font-family: "MTS Compact";
    line-height: 1.4;
  }
}

/* Адаптивность для футера */
@media (max-width: 1024px) {
  .footer{
    display: flex;
    padding: 20px;
    flex-direction: column;
    align-items: flex-start; /* Изменяем с center на flex-start */
    gap: 16px;
    align-self: stretch;
  }
}body.modal-open {
  position: fixed;
  width: 100%;
  overflow: hidden;
}

.modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  background-color: rgba(0, 0, 0, 0.5);
  animation: fadeIn 0.3s ease;
  z-index: 1000;
}

.modal-overlay--center {
  justify-content: center;
  align-items: center;
  padding: 20px;
}

.modal-overlay--bottom {
  justify-content: center;
  align-items: flex-end;
  padding: 0;
}

.modal-container {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
  background-color: #ffffff;
  position: relative;
}

.modal-container--center.modal-container--info {
  width: 520px;
  max-width: 90vw;
  max-height: 90vh;
  border-radius: 32px;
  padding: 24px;
}

.modal-container--center.modal-container--info.modal-container--image-above {
  padding: 4px !important;
}

.modal-container--bottom.modal-container--info {
  background-color: white;
  border-radius: 32px 32px 0 0;
  width: 100%;
  max-width: 100%;
  max-height: 85vh;
  transform: translateY(100%);
  animation: slideUpFromBottom 0.3s ease forwards;
  padding: 20px 20px 40px;
}

.modal-container--bottom.modal-container--info.modal-container--image-above {
  padding: 4px 4px 20px 4px !important;
}

.modal-container--center.modal-container--state {
  width: 450px;
  max-width: 90vw;
  max-height: 80vh;
  border-radius: 32px;
  padding: 24px;
  align-items: center;
  text-align: center;
}

.modal-container--success {
  --state-color: #10B981;
  --state-bg-color: rgba(16, 185, 129, 0.1);
}

.modal-container--error {
  --state-color: #EF4444;
  --state-bg-color: rgba(239, 68, 68, 0.1);
}

.modal-container--retry {
  --state-color: #F59E0B;
  --state-bg-color: rgba(245, 158, 11, 0.1);
}

.modal-close-btn {
  background: #f5f5f5;
  border: none;
  cursor: pointer;
  padding: 8px;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  transition: background-color 0.2s ease;
  box-sizing: border-box;
  flex-shrink: 0;
  z-index: 100;
  position: absolute;
}

.modal-container--image-above .modal-close-btn {
  background: #ffffff !important;
  z-index: 101;
}

.modal-close-btn--center {
  right: 20px;
  top: 20px;
}

.modal-close-btn--bottom {
  right: 20px;
  top: 20px;
}

.modal-close-btn:hover {
  background-color: #e0e0e0;
}

.modal-container--image-above .modal-close-btn:hover {
  background-color: #f0f0f0 !important;
}

.modal-close-btn:active {
  background-color: #d0d0d0;
}

.modal-close-btn svg {
  width: 12px;
  height: 12px;
}

.modal-state-image {
  width: 120px;
  height: 120px;
  object-fit: contain;
  margin-top: 12px;
  margin-bottom: 12px;
}

.modal-info-image {
  width: 100%;
  height: 200px;
  border-radius: 16px;
  overflow: hidden;
  margin: 20px 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}

.modal-info-image--above {
  width: 100%;
  height: 240px;
  border-radius: 28px 28px 16px 16px;
  margin: 0 0 4px 0 !important;
  position: relative;
  z-index: 100;
}

.modal-container--bottom.modal-container--info.modal-container--image-above .modal-info-image--above {
  margin: 0 0 4px 0 !important;
  border-radius: 28px 28px 16px 16px;
  height: 180px;
  width: 100%;
}

.modal-info-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.modal-container--bottom.modal-container--info .modal-info-image {
  height: 160px;
  margin: 16px 0;
}

.modal-text-content {
  width: 100%;
  padding: 0 20px 24px;
  margin-top: 20px;
}

.modal-state-title {
  font-family: "MTS Wide";
  font-size: 24px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
  margin: 0 0 12px 0;
}

.modal-state-description {
  font-family: 'MTS Text';
  font-size: 17px !important;
  font-weight: 400;
  line-height: 24px;
  margin: 0 0 40px 0;
}

.modal-info-title {
  font-family: "MTS Wide";
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
  margin-bottom: 8px !important;
  width: 100%;
}

.modal-header-title {
  font-family: "MTS Wide";
  font-size: 24px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
  margin: 0;
  width: 100%;
}

.modal-info-description {
  font-family: 'MTS Text';
  font-size: 17px !important;
  font-weight: 400;
  line-height: 24px;
  margin-bottom: 0 !important;
}

.modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-shrink: 0;
}

.modal-container--bottom.modal-container--info .modal-header {
  position: relative;
  margin-bottom: 0;
  align-items: flex-start;
}

.modal-buttons {
  display: block;
  gap: 12px;
  margin-top: 24px;
  width: 100%;
}

.modal-button-wrapper {
  flex: 1;
}

.modal-buttons .modal-button-wrapper:not(:last-child) {
  margin-bottom: 12px;
}

.modal-container--state .modal-buttons {
  justify-content: center;
}

.modal-button {
  padding: 12px 24px;
  border-radius: 12px;
  font-family: 'MTS Text', sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 20px;
  border: none;
  cursor: pointer;
  transition: all 0.2s ease;
  width: 100%;
}

.modal-button--primary {
  background-color: #007BFF;
  color: white;
}

.modal-button--primary:hover {
  background-color: #0056b3;
}

.modal-button--secondary {
  background-color: #f5f5f5;
  color: #1D2023;
}

.modal-button--secondary:hover {
  background-color: #e0e0e0;
}

.modal-container--state .modal-button {
  min-width: 140px;
}

.modal-content {
  flex: 1;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: #c1c1c1 transparent;
}

.modal-state-content {
  flex-direction: column;
  align-items: center;
  text-align: center;
  width: 100%;
}

.modal-info-content {
  width: 100%;
}

.modal-container--bottom.modal-container--info .modal-content {
  font-size: 14px;
  line-height: 20px;
  font-family: 'MTS Text';
  color: #626C77;
}

.modal-content::-webkit-scrollbar {
  width: 6px;
}

.modal-content::-webkit-scrollbar-track {
  background: transparent;
}

.modal-content::-webkit-scrollbar-thumb {
  background-color: #c1c1c1;
  border-radius: 3px;
}

.modal-content::-webkit-scrollbar-thumb:hover {
  background-color: #a1a1a1;
}

.modal-footer {
  margin-top: 24px;
  padding-top: 24px;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
  flex-shrink: 0;
  padding: 0 24px 24px 24px;
}

@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes scaleIn {
  from {
    opacity: 0;
    transform: scale(0.9);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes slideUpFromBottom {
  from {
    transform: translateY(100%);
  }
  to {
    transform: translateY(0);
  }
}

.modal-overlay--fadeIn .modal-container {
  animation: fadeIn 0.3s ease;
}

.modal-overlay--scaleIn .modal-container {
  animation: scaleIn 0.3s ease;
}

.modal-overlay--slideUpFromBottom .modal-container {
  animation: slideUpFromBottom 0.3s ease forwards;
}

@media (max-width: 767px) {
  .modal-container--center.modal-container--state {
    background-color: white;
    border-radius: 32px 32px 0 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    max-height: 85vh;
    padding: 20px 20px 40px !important;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    transform: translateY(100%);
    animation: slideUpFromBottom 0.3s ease forwards;
    margin: 0 !important;
  }
  
  .modal-state-title {
    font-family: "MTS Wide";
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: 28px;
    margin-bottom: 8px;
  }
  
  .modal-state-description {
    font-size: 14px;
    line-height: 20px;
    margin-bottom: 40px;
  }
  
  .modal-state-image {
    width: 120px;
    height: 120px;
    margin-bottom: 12px;
  }
  
  .modal-container--center.modal-container--info {
    width: 100% !important;
    max-width: 100% !important;
    max-height: 85vh;
    border-radius: 32px 32px 0 0 !important;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    transform: translateY(100%);
    animation: slideUpFromBottom 0.3s ease forwards;
    margin: 0 !important;
  }
  
  .modal-text-content {
    padding: 0 20px 20px !important;
  }
  
  .modal-info-title {
    font-family: "MTS Wide";
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    margin-bottom: 8px !important;
  }
  
  .modal-header-title {
    font-family: "MTS Wide";
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    padding: 4px 40px 8px 0;
    margin: 0;
  }
  
  .modal-header {
    margin-bottom: 16px;
  }
  
  .modal-container--bottom.modal-container--info.modal-container--image-above .modal-info-image--above {
    height: 180px;
    margin: 0 0 4px 0 !important;
  }
  
  .modal-info-description {
    line-height: 20px;
    margin-bottom: 20px;
    font-family: "MTS Text";
  }
  
  .modal-info-image {
    height: 140px;
    margin: 16px 0;
  }
  
  .modal-buttons {
    flex-direction: column;
    gap: 8px;
    margin-top: 20px;
  }
  
  .modal-button {
    padding: 10px 20px;
    font-size: 14px;
  }
  
  .modal-container--state .modal-button {
    min-width: auto;
    width: 100%;
  }
  
  .modal-overlay--center {
    align-items: flex-end;
    padding: 0;
  }
  
  .modal-container--center.modal-container--state .modal-close-btn {
    background: #f5f5f5;
    border: none;
    cursor: pointer;
    padding: 8px;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    position: absolute;
    right: 20px;
    top: 20px;
    transition: background-color 0.2s ease;
    box-sizing: border-box;
  }
}

@media (min-width: 768px) {
  .modal-container--bottom {
    display: none !important;
  }
  
  .modal-overlay--bottom {
    display: none !important;
  }
  
  .modal-container--center.modal-container--info {
    width: 520px;
  }
  
  .modal-container--center.modal-container--state {
    width: 450px;
  }
  
  .modal-info-title {
    font-family: "MTS Wide";
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: 28px;
    padding: 4px 40px 4px 0;
  }
  
  .modal-header-title {
    font-family: "MTS Wide";
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: 28px;
    margin-bottom: 20px;
    padding: 4px 40px 4px 0;
  }
}

.modal-state-header {
  height: 32px;
  flex-shrink: 0;
}

.modal-info-title--between {
  padding: 4px 25px 4px 0 !important;
}.mts-badge {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Compact";
  font-style: normal;
  font-weight: 500;
  white-space: nowrap;
  width: fit-content;
}

/* Размеры */
.mts-badge--xs {
  height: 16px;
  padding: 1px 4px;
  gap: 2px;
  border-radius: 6px;
  font-size: 12px;
  line-height: 16px;
}

.mts-badge--s {
  height: 20px;
  padding: 2px 4px;
  gap: 2px;
  border-radius: 6px;
  font-size: 12px;
  line-height: 16px;
  
  --mts-badge-image-size: 16px;
  --mts-badge-image-margin: 2px;
  --mts-badge-with-image-padding-left: 4px;
  --mts-badge-with-image-padding-right: 2px;
}

.mts-badge--m {
    height: 24px;
  padding: 2px 6px;
  gap: 4px;
  border-radius: 8px;
  font-size: 14px;
  line-height: 20px;

  --mts-badge-image-size: 16px;
  --mts-badge-image-margin: 2px;
  --mts-badge-with-image-padding-left: 6px;
  --mts-badge-with-image-padding-right: 4px;
}

.mts-badge--l {
    height: 32px;
  padding: 4px 8px;
  gap: 4px;
  border-radius: 12px;
  font-size: 17px;
  line-height: 24px;
  
  --mts-badge-image-size: 24px;
  --mts-badge-image-margin: 4px;
  --mts-badge-with-image-padding-left: 8px;
  --mts-badge-with-image-padding-right: 4px;
}

/* Стили для картинок */
.mts-badge__image {
  width: var(--mts-badge-image-size, 16px);
  height: var(--mts-badge-image-size, 16px);
  margin-right: var(--mts-badge-image-margin, 4px);
  object-fit: contain;
  display: inline-block;
  flex-shrink: 0;
  vertical-align: middle;
}


/* Цвета */
.mts-badge--gray {
  background-color: #F2F3F7;
  color: #1D2023;
}

.mts-badge--blue {
  background-color: #007CFF;
  color: #FFFFFF;
}

.mts-badge--green {
    background-color: #26CD58;
    color: #FFFFFF;
}

.mts-badge--negative {
    background-color: #F95721;
    color: #FFFFFF;
}

.mts-badge--warning {
    background-color: #FAC031;
    color: #FFFFFF;
}

.mts-badge--blue_second{
    background-color: #E1F3FE;
    color: #002094;
}

.mts-badge--green_second {
    background-color: #BEF4BD;
    color: #007502;
}

.mts-badge--negative_second {
    background-color: #FCD4C9;
    color: #AD3400;
}

.mts-badge--warning_second {
    background-color: #FAE89E;
    color: #806000;
}

.mts-badge--white {
    background-color: #FFFFFF;
    color: #1D2023;
}

/*Расположение*/
.mts-badge--position-left {
  margin-right: auto;
  display: block !important;
}

.mts-badge--position-center {
  margin-left: auto;
  margin-right: auto;
  display: block !important;
}

.mts-badge--position-right {
  margin-left: auto;
  display: block !important;
}
/* ========== ОБЩИЕ СТИЛИ BULLET ========== */

.bullet-container {
  width: 100%;
  max-width: 100%;
  margin: 0 auto;
  box-sizing: border-box;
}

.bullet-columns {
  width: 100%;
  display: grid;
  gap: 40px;
  justify-content: stretch;
}

/* Пункт */
.bullet-item {
  display: flex;
  align-items: flex-start;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

/* Маркер */
.bullet-marker {
  position: relative;
  flex-shrink: 0;
  display: flex;
  align-items: flex-start;
}

.bullet-marker-container {
  border-radius: 8px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: none;
}

.bullet-marker-image {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.bullet-marker-fallback {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: #4A90E2;
  color: white;
  font-weight: bold;
  font-size: 50%;
}

/* Контент */
.bullet-content {
  flex: 1;
  min-width: 0;
  width: 100%;
  word-wrap: break-word;
  overflow-wrap: break-word;
  display: flex;
  flex-direction: column;
}

/* Заголовок */
.bullet-title {
  margin: 0;
  font-family: 'MTS Text';
  font-weight: 500;
  line-height: 24px;
  font-style: normal;
  width: 100%;
  max-width: 100%;
  overflow-wrap: break-word;
}

/* Описание */
.bullet-description {
  margin: 0;
  font-family: 'MTS Text';
  font-weight: 400;
  line-height: 24px;
  opacity: 0.9;
  font-style: normal;
  width: 100%;
  max-width: 100%;
  overflow-wrap: break-word;
}

/* ========== ДЕСКТОПНАЯ ВЕРСИЯ (от 768px) ========== */

@media (min-width: 768px) {
  .bullet-columns {
    grid-template-columns: repeat(2, 1fr);
    gap: 32px;
    width: 100%;
  }
  
  .bullet-column {
    width: 100%;
  }
  
  .bullet-list {
    display: flex;
    flex-direction: column;
    width: 100%;
    gap: 32px; 
  }
  
  .bullet-item {
    width: 100%;
    gap: 16px;
  }
  
  /* Размеры маркеров на десктопе */
  .desktop-marker {
    width: 56px;
    height: 56px;
    display: flex !important;
  }
  
  .mobile-marker {
    display: none !important;
  }
  
  .bullet-content {
    max-width: calc(100% - 56px - 16px);
    gap: 6px;
  }
  
  .bullet-title {
    font-size: 20px;
  }
  
  .bullet-description {
    font-size: 17px;
  }
}

/* ========== МОБИЛЬНАЯ ВЕРСИЯ (до 767px) ========== */

@media (max-width: 767px) {
  .bullet-columns {
    grid-template-columns: 1fr;
    gap: 0;
    width: 100%;
    max-width: 100%;
  }
  
  .bullet-column {
    width: 100%;
    max-width: 100%;
  }
  
  .bullet-column:not(:last-child) {
    margin-bottom: 16px;
  }
  
  .bullet-list {
    width: 100%;
    max-width: 100%;
    display: flex;
    flex-direction: column;
    gap: 16px !important;
  }
  
  .bullet-item {
    width: 100%;
    max-width: 100%;
    gap: 12px;
  }
  
  /* Размеры маркеров на мобилке */
  .mobile-marker {
    width: 44px;
    height: 44px;
    display: flex !important;
  }
  
  .desktop-marker {
    display: none !important;
  }
  
  .bullet-content {
    max-width: calc(100% - 44px - 12px);
    gap: 4px;
  }
  
  .bullet-title {
    font-size: 17px;
  }
  
  .bullet-description {
    font-size: 14px;
    line-height: 20px;
  }
}

/* ========== АДАПТАЦИЯ ДЛЯ РАЗНЫХ СЦЕНАРИЕВ ========== */

.landing-classic-section .bullet-container {
  width: 100%;
  max-width: 100%;
}

.landing-classic-section .bullet-columns {
  width: 100%;
  max-width: 100%;
}


.landing-classic-section__desktop-direction--left .bullet-container,
.landing-classic-section__desktop-direction--right .bullet-container {
  width: 100%;
}

/* Для варианта bottom (полная ширина) */
.landing-classic-section__desktop-direction--bottom .bullet-container {
  width: 100%;
}

.landing-classic-section__desktop-direction--bottom .bullet-columns {
  width: 100%;
  max-width: 100%;
}

/* ========== ОПТИМИЗАЦИЯ ДЛЯ БОЛЬШИХ ЭКРАНОВ ========== */

@media (min-width: 1200px) {
  .bullet-columns {
    gap: 40px;
  }
  
  .bullet-list {
    gap: 40px;
  }
  
  .bullet-item {
    gap: 20px;
  }
  
  .bullet-content {
    gap: 8px;
  }
}

@media (min-width: 768px) {
  .bullet-columns:not(.bullet-columns--legacy) {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 32px !important;
    justify-content: stretch !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
  }
  
  .bullet-column:not(.bullet-column--legacy) {
    max-width: 100% !important;
    min-width: auto !important;
    width: 100% !important;
  }
  
  .bullet-container:not(.bullet-container--legacy) {
    padding-right: 0 !important;
    box-sizing: border-box !important;
  }
}/* FAQ контейнер */
.faq-container {
  width: 100%;
  max-width: 1550px;
  padding: 48px;
  box-sizing: border-box;
  border-radius: 60px;
}

/* ===== ДЕСКТОПНАЯ ВЕРСИЯ (768px и выше) ===== */
.faq-desktop {
  display: flex;
  align-items: flex-start;
}

.faq-mobile {
  display: none;
}

/* Заголовок слева вверху */
.faq-desktop-title {
  flex: 0 0 300px;
  position: sticky;
  top: 20px;
}

.faq-desktop-title h2 {
  font-family: 'MTS Wide';
  font-size: 32px;
  font-weight: 500;
  line-height: 36px;
  margin: 0;
}

/* Блок всех вопросов справа */
.faq-desktop-questions-block {
  flex: 1;
  border-radius: 32px;
  margin-left: auto;
  max-width: 900px;
}

/* Отдельный вопрос в десктопной версии */
.faq-desktop-question-item {
  width: 100%;
  cursor: pointer;
  overflow: hidden;
}

/* Контент вопроса (текст + иконка) */
.faq-desktop-question-content {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 24px;
  min-height: 56px;
  transition: background-color 0.2s ease;
}

.faq-desktop-question-content:hover {
  background-color: rgba(255, 255, 255, 0.1);
}

.faq-desktop-question-content h3 {
  font-family: 'MTS Text';
  font-size: 20px;
  font-weight: 500;
  line-height: 24px;
  margin: 0;
  flex: 1;
}

/* Иконка в десктопной версии */
.faq-desktop-item-icon {
  font-size: 18px;
  font-weight: 300;
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.3s ease;
}

/* Ответ в десктопной версии */
.faq-desktop-answer {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.faq-desktop-answer.open {
  max-height: 2000px;
}

.faq-desktop-answer-content {
  font-family: 'MTS Text';
  font-size: 17px;
  font-weight: 400;
  line-height: 24px;
  padding: 0 24px 24px 24px;
  opacity: 0.9;
}

/* Стили для HTML-контента */
.faq-desktop-answer-content p,
.faq-mobile-answer-content p,
.faq-modal-content p {
  margin: 0 0 12px 0;
}

.faq-desktop-answer-content p:last-child,
.faq-mobile-answer-content p:last-child,
.faq-modal-content p:last-child {
  margin-bottom: 0;
}

/* Списки */
.faq-desktop-answer-content ol,
.faq-desktop-answer-content ul,
.faq-mobile-answer-content ol,
.faq-mobile-answer-content ul,
.faq-modal-content ol,
.faq-modal-content ul {
  margin: 12px 0;
  padding-left: 24px;
}

.faq-desktop-answer-content li,
.faq-mobile-answer-content li,
.faq-modal-content li {
  margin-bottom: 8px;
  line-height: 1.5;
}

/* Нумерованные списки */
.faq-desktop-answer-content ol,
.faq-mobile-answer-content ol,
.faq-modal-content ol {
  list-style-type: decimal;
}

/* Маркированные списки */
.faq-desktop-answer-content ul,
.faq-mobile-answer-content ul,
.faq-modal-content ul {
  list-style-type: disc;
}

/* Жирный текст */
.faq-desktop-answer-content strong,
.faq-mobile-answer-content strong,
.faq-modal-content strong {
  font-weight: 600;
}

/* Курсив */
.faq-desktop-answer-content em,
.faq-mobile-answer-content em,
.faq-modal-content em {
  font-style: italic;
}

/* Ссылки */
.faq-desktop-answer-content a,
.faq-mobile-answer-content a,
.faq-modal-content a {
  color: #007bff;
  text-decoration: underline;
}

.faq-desktop-answer-content a:hover,
.faq-mobile-answer-content a:hover,
.faq-modal-content a:hover {
  text-decoration: none;
}

/* Разделительная линия между вопросами в десктопе */
.faq-desktop-divider {
  height: 1px;
  width: calc(100% - 48px);
  margin: 0 24px;
  background-color: var(--Background-Stroke, rgba(188, 195, 208, 0.50)) !important;
}

/* Убираем разделитель после последнего вопроса в десктопе */
.faq-desktop-question-item:last-of-type ~ .faq-desktop-divider {
  display: none;
}

/* ===== МОБИЛЬНАЯ ВЕРСИЯ (до 767px) ===== */
@media (max-width: 767px) {
  .faq-desktop {
    display: none;
  }
  .faq-desktop-divider {
    width: calc(100% - 40px) !important;
  }
  
  .faq-mobile {
    display: flex;
    flex-direction: column;
    width: 100%;
    gap: 24px;
  }
  
  .faq-container {
    padding: 20px;
    border-radius: 32px;
  }
  
.custom-faq-mobile-question-item {
  padding-bottom: 0 !important;
}

  /* Заголовок блока */
  .faq-mobile-header h2 {
    font-family: 'MTS Text', sans-serif;
    font-size: 20px;
    font-weight: 500;
    line-height: 24px;
    margin: 0;
  }
  
  /* Общий блок вопросов */
  .faq-mobile-questions-block {
    width: 100%;
    border-radius: 24px;
  }
  
  /* Отдельный вопрос внутри общего блока */
  .custom-faq-mobile-question-item {
   width: 100%;
    cursor: pointer;
    overflow: hidden;
    margin: 0 !important;
    padding: 0 !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }
  
  /* Контент вопроса (заголовок + иконка) */
  .faq-mobile-question-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px;
    min-height: 56px;
    gap: 12px;
    transition: background-color 0.2s ease;
  }
  
  .faq-mobile-question-content:hover {
    background-color: rgba(255, 255, 255, 0.1);
  }
  
  .faq-mobile-question-content h3 {
    font-family: 'MTS Text';
    font-size: 17px;
    font-weight: 500;
    line-height: 24px;
    margin: 0;
    flex: 1;
  }
  
  /* Иконка + / - */
  .faq-mobile-item-icon {
    font-size: 18px;
    font-weight: 300;
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.3s ease;
  }
  
  /* Ответ в мобильной версии */
  .faq-mobile-answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  }
  
  .faq-mobile-answer.open {
    max-height: 2000px;
  }
  
  .faq-mobile-answer-content {
    font-family: 'MTS Text';
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    padding: 0 20px 20px 20px;
    opacity: 0.9;
  }
  
  /* Разделительная линия между вопросами в мобильной версии - ТОЧЬ В ТОЧЬ КАК В ДЕСКТОПЕ */
  .faq-mobile-divider {
    height: 1px !important;
  width: calc(100% - 40px) !important;
  margin: 0 20px !important;
  padding: 0 !important;
  background-color: var(--Background-Stroke, rgba(188, 195, 208, 0.50)) !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  display: block !important;
  padding-bottom: 0 !important;
  }
  
  /* Убираем разделитель после последнего вопроса в мобилке */
  .faq-mobile-question-item:last-of-type ~ .faq-mobile-divider {
    display: none;
     padding-bottom: 0 !important;
  }
  
  /* Модалка на мобилке - снизу экрана */
  .faq-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: flex-end;
    z-index: 1000;
    padding: 0;
  }
  
  .faq-modal {
    background-color: white;
    border-radius: 32px 32px 0 0;
    padding: 0 0 20px;
    width: 100%;
    max-width: 100%;
    max-height: 85vh;
    overflow: hidden;
    transform: translateY(100%);
    animation: slideUpFromBottom 0.3s ease forwards;
  }
  
  .faq-modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
  }
  
  .faq-modal-header h3 {
    margin: 0;
   font-family: "MTS Wide";
font-size: 20px;
font-style: normal;
font-weight: 500;
line-height: 24px;
    flex: 1;
    text-align: center;
    padding: 20px 60px 0px 20px;
    box-sizing: border-box;
    word-wrap: break-word;
    overflow-wrap: break-word;
  }
  
  .faq-modal-close {
    background: #f5f5f5;
    border: none;
    cursor: pointer;
    padding: 8px;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    position: absolute;
    right: 20px;
    top: 20px;
    transition: background-color 0.2s ease;
    box-sizing: border-box;
  }
  
  .faq-modal-close svg {
    width: 16px;
    height: 16px;
  }
  
  .faq-modal-close:hover {
    background-color: #e0e0e0;
  }
  
  .faq-modal-content {
    padding: 8px 56px 20px 20px;
    font-family: "MTS Text";
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: 20px;
    overflow-y: auto;
    max-height: calc(85vh - 80px);
    color: #626C77;
  }
}

/* На десктопе модалка не показывается */
@media (min-width: 768px) {
  .faq-modal-overlay {
    display: none !important;
  }
}

/* ===== ПЛАНШЕТЫ (768px - 1023px) ===== */
@media (min-width: 768px) and (max-width: 1023px) {
  .faq-desktop {
    gap: 40px;
  }
  
  .faq-desktop-title {
    flex: 0 0 250px;
  }
  
  .faq-desktop-title h2 {
    font-size: 28px;
    line-height: 36px;
  }
  
  .faq-desktop-question-content h3 {
    font-size: 16px;
    line-height: 22px;
  }
  
  .faq-desktop-answer-content {
    font-size: 15px;
    line-height: 22px;
  }
}

/* Анимации */
@keyframes slideUpFromBottom {
  from {
    transform: translateY(100%);
  }
  to {
    transform: translateY(0);
  }
}
.flex-cards-section {
  width: 100%;
  max-width: 100%;
  margin: 0 auto;
  box-sizing: border-box;
}

.flex-cards-container {
  width: 100%;
  overflow: visible;
  box-sizing: border-box;
}

.flex-cards-grid {
  display: grid;
  width: 100%;
  box-sizing: border-box;
}

.flex-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.08), 0 4px 16px 0 rgba(0, 0, 0, 0.08);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  width: 100%;
  overflow: visible;
  position: relative;
  border-radius: 32px;
  padding: 20px;
  box-sizing: border-box;
  height: auto;
  min-height: auto;
  background-color: #fff;
}

.flex-card__corner-icon {
  position: absolute;
  top: 20px;
  left: 20px;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  width: 56px;
  height: 56px;
}

.flex-card__corner-icon-img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.flex-card__title {
  font-family: "MTS Text";
  font-size: 20px;
  font-weight: 500;
  line-height: 24px;
  margin: 0;
  padding-top: 76px;
  margin-bottom: 8px;
  width: 100%;
}

.flex-card__description {
  font-family: "MTS Text";
  font-size: 17px;
  line-height: 24px;
  margin: 0;
  overflow: visible;
  display: block;
  word-break: break-word;
  width: 100%;
}

.flex-card__custom {
  margin-top: 16px;
  width: 100%;
}

.flex-card:not(:has(.flex-card__title)) .flex-card__description,
.flex-card.no-title .flex-card__description {
  padding-top: 76px;
  margin-top: 0;
}

.flex-card:not(:has(.flex-card__corner-icon)) .flex-card__title,
.flex-card:not(:has(.flex-card__corner-icon)) .flex-card__description,
.flex-card.no-icon .flex-card__title,
.flex-card.no-icon .flex-card__description {
  padding-top: 0 !important;
}

@media (max-width: 767px) {
  .flex-cards-grid {
    grid-template-columns: repeat(var(--cards-columns, 2), 1fr);
    gap: 8px;
  }
  
  .flex-card.single-in-last-row {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  
  .flex-card {
    padding: 12px;
    border-radius: 24px !important;
    height: auto;
    min-height: auto;
    background-color: #fff;
  }
  
  .flex-card__corner-icon {
    top: 12px;
    left: 12px;
    width: 44px;
    height: 44px;
  }
  
  .flex-card__title {
    font-size: 17px;
    line-height: 24px;
    padding-top: 60px;
    margin-bottom: 4px;
  }
  
  .flex-card__description {
    font-size: 14px;
    line-height: 20px;
    overflow: visible;
    display: block;
    -webkit-line-clamp: none;
    -webkit-box-orient: horizontal;
    max-height: none;
  }
  
  .flex-card:hover {
    transform: none !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
  }
  
  .flex-card:not(:has(.flex-card__title)) .flex-card__description,
  .flex-card.no-title .flex-card__description {
    padding-top: 60px;
  }
}

@media (min-width: 768px) {
  .flex-cards-container {
    padding: 0;
  }
  
  .flex-card:hover {
    transform: none !important;
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.08), 0 4px 16px 0 rgba(0, 0, 0, 0.08) !important;
  }
  
  .flex-card {
    border-radius: 32px !important;
    background-color: #fff;
    padding: 20px !important;
  }
  
  .flex-card.single-in-last-row {
    grid-column: initial !important;
    width: initial !important;
    max-width: initial !important;
  }
  
  .flex-cards-container.flex-cards--desktop-bottom .flex-cards-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
    width: 100%;
    align-items: start;
    grid-auto-rows: min-content;
  }
  
  .flex-cards-container.flex-cards--desktop-bottom .flex-card {
    height: auto;
    min-height: auto;
    display: block;
    position: relative;
     transition: none !important;
  }
  
  .flex-cards-container.flex-cards--desktop-bottom .flex-card__description {
    overflow: visible;
    display: block;
    -webkit-line-clamp: none;
    -webkit-box-orient: horizontal;
    max-height: none;
    min-height: auto;
  }
  
  .flex-cards-container.flex-cards--desktop-bottom .flex-cards-grid:has(.flex-card:nth-child(3):last-child) {
    grid-template-columns: repeat(3, 1fr);
  }
  
  .flex-cards-container.flex-cards--desktop-bottom .flex-cards-grid:has(.flex-card:nth-child(2):last-child) {
    grid-template-columns: repeat(2, 1fr);
  }
  
  .flex-cards-container.flex-cards--desktop-bottom .flex-cards-grid:has(.flex-card:only-child) {
    grid-template-columns: 1fr;
  }
  
  .flex-cards-container.flex-cards--desktop-bottom .flex-cards-grid:has(.flex-card:only-child) .flex-card {
    max-width: 660px !important;
    width: 100%;
  }
  
  .flex-cards-container.flex-cards--desktop-side .flex-cards-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
    width: 100%;
    align-items: start;
    grid-auto-rows: min-content;
    justify-items: end;
    margin-right: 0;
    padding-right: 0;
  }
  
  .flex-cards-container.flex-cards--desktop-side .flex-cards-grid:has(.flex-card:only-child) {
    grid-template-columns: 1fr;
    justify-items: center;
  }
  
  .flex-cards-container.flex-cards--desktop-side .flex-card {
    height: auto;
    min-height: auto;
    display: block;
    position: relative;
    margin-right: 0;
    width: 100%;
    max-width: 100%;
    padding: 20px !important;
  }
  
  .flex-cards-container.flex-cards--desktop-side .flex-card__description {
    overflow: visible;
    display: block;
    -webkit-line-clamp: none;
    max-height: none;
    min-height: auto;
  }
  
  .flex-cards-container.flex-cards--desktop-bottom .flex-cards-grid.grid-4-cards,
  .flex-cards-container.flex-cards--desktop-bottom .flex-cards-grid.grid-8-cards,
  .flex-cards-container.flex-cards--desktop-bottom .flex-cards-grid.grid-12-cards {
    grid-template-columns: repeat(4, 1fr);
  }
  
  .flex-cards-container.flex-cards--desktop-bottom .flex-cards-grid.grid-3-cards {
    grid-template-columns: repeat(3, 1fr);
  }
  
  .flex-cards-container.flex-cards--desktop-bottom .flex-cards-grid.grid-2-cards {
    grid-template-columns: repeat(2, 1fr);
  }
  
  .flex-cards-container.flex-cards--desktop-bottom .flex-cards-grid.grid-1-card {
    grid-template-columns: 1fr;
  }
}

@media (min-width: 768px) and (max-width: 1023px) {
  .flex-cards-container.flex-cards--desktop-bottom .flex-cards-grid,
  .flex-cards-container.flex-cards--desktop-side .flex-cards-grid {
    gap: 24px;
  }
}

@media (min-width: 1024px) and (max-width: 1439px) {
  .flex-cards-container.flex-cards--desktop-bottom .flex-cards-grid,
  .flex-cards-container.flex-cards--desktop-side .flex-cards-grid {
    gap: 24px;
  }
}

@media (min-width: 1440px) {
  .flex-cards-container.flex-cards--desktop-bottom .flex-cards-grid,
  .flex-cards-container.flex-cards--desktop-side .flex-cards-grid {
    gap: 24px;
  }
  
  .flex-cards-container.flex-cards--desktop-side .flex-card {
    max-width: 500px;
  }
}

@media (min-width: 1920px) {
  .flex-cards-container.flex-cards--desktop-bottom .flex-cards-grid,
  .flex-cards-container.flex-cards--desktop-side .flex-cards-grid {
    gap: 40px;
  }
  
  .flex-cards-container.flex-cards--desktop-side .flex-card {
    max-width: 560px;
  }
}

.landing-classic-section .flex-cards-container {
  width: 100%;
}

.landing-classic-section .flex-cards-container.flex-cards--desktop-bottom .flex-cards-grid {
  width: 100%;
}

.landing-classic-section .flex-cards-container.flex-cards--desktop-side {
  flex-grow: 1;
  width: 100%;
  margin-right: 0;
  padding-right: 0;
}

.landing-classic-section .flex-cards-container.flex-cards--desktop-side .flex-cards-grid {
  width: 100%;
  height: auto;
  margin-right: 0;
  padding-right: 0;
}

.landing-classic-section__desktop-direction--left .flex-cards-container.flex-cards--desktop-side {
  flex: 1;
  min-width: 0;
  margin-right: 0;
  padding-right: 0;
}

.landing-classic-section__desktop-direction--left .flex-cards-container.flex-cards--desktop-side .flex-cards-grid {
  justify-items: end;
  margin-right: 0;
  padding-right: 0;
}

.landing-classic-section__desktop-direction--right .flex-cards-container.flex-cards--desktop-side {
  flex: 1;
  min-width: 0;
  margin-left: 0;
  padding-left: 0;
}

.landing-classic-section__desktop-direction--right .flex-cards-container.flex-cards--desktop-side .flex-cards-grid {
  justify-items: start;
  margin-left: 0;
  padding-left: 0;
}

.landing-classic-section__desktop-direction--top .flex-cards-container.flex-cards--desktop-side {
  width: 100%;
}

.landing-classic-section__desktop-direction--top .flex-cards-container.flex-cards--desktop-side .flex-cards-grid {
  justify-items: center;
}

.landing-classic-section__header--compact ~ .flex-cards-container.flex-cards--desktop-side,
.landing-classic-section__header--default ~ .flex-cards-container.flex-cards--desktop-side {
  flex: 1;
  margin-right: 0;
}

.landing-classic-section__header--full ~ .flex-cards-container.flex-cards--desktop-side {
  width: 100%;
}

.flex-card:has(.flex-card__corner-icon) {
  min-height: calc(56px + 40px);
}

.flex-card:has(.flex-card__corner-icon) .flex-card__title {
  min-height: 24px;
}

@media (max-width: 767px) {
  .flex-card:has(.flex-card__corner-icon) {
    min-height: calc(44px + 24px);
  }
  
  .flex-cards-grid {
    justify-items: stretch;
  }
}

.flex-cards-container.flex-cards--desktop-side {
  padding-right: 0 !important;
  margin-right: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow: visible !important;
}

.flex-cards-container.flex-cards--desktop-side .flex-cards-grid {
  width: 100% !important;
  max-width: 100% !important;
  margin-right: 0 !important;
  padding-right: 0 !important;
}

.flex-cards-container.flex-cards--desktop-side .flex-cards-grid > * {
  width: 100% !important;
  max-width: 100% !important;
  margin-right: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
}

.flex-cards-container.flex-cards--desktop-side .flex-card {
  width: 100% !important;
  max-width: 100% !important;
  margin-right: 0 !important;
  padding: 20px !important;
  box-sizing: border-box !important;
}

.flex-cards-container.flex-cards--desktop-side .flex-cards-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

.flex-cards-container.flex-cards--desktop-side .flex-card {
  width: 100% !important;
  min-width: 0 !important;
}

.flex-cards-container.flex-cards--desktop-side,
.flex-cards-container.flex-cards--desktop-side .flex-cards-grid,
.flex-cards-container.flex-cards--desktop-side .flex-cards-grid > *,
.flex-cards-container.flex-cards--desktop-side .flex-card {
  margin-inline-end: 0 !important;
  padding-inline-end: 0 !important;
  border-inline-end: none !important;
}

.flex-cards-container.flex-cards--desktop-side .flex-card,
.flex-cards-container.flex-cards--desktop-side .flex-cards-grid .flex-card,
.flex-card[class*="flex-cards--desktop-side"] {
  padding: 20px !important;
  padding-top: 20px !important;
  padding-right: 20px !important;
  padding-bottom: 20px !important;
  padding-left: 20px !important;
}

.flex-cards-container.flex-cards--desktop-side {
  --cards-margin-right: 0 !important;
  --cards-padding-right: 0 !important;
}

@media (min-width: 768px) {
  .flex-cards-container.flex-cards--desktop-bottom .flex-cards-grid {
    align-items: stretch !important;
  }
  
  .flex-cards-container.flex-cards--desktop-bottom .flex-card {
    height: 100% !important;
    display: flex !important;
    flex-direction: column;
  }
  
  .flex-cards-container.flex-cards--desktop-bottom .flex-card__description {
    flex-grow: 1 !important;
    min-height: 0;
  }
  
  .flex-cards-container.flex-cards--desktop-side .flex-cards-grid {
    align-items: stretch !important;
  }
  
  .flex-cards-container.flex-cards--desktop-side .flex-card {
    height: 100% !important;
    display: flex !important;
    flex-direction: column;
  }
  
  .flex-cards-container.flex-cards--desktop-side .flex-card__description {
    flex-grow: 1 !important;
    min-height: 0;
  }
}.non_tariff_parameter_group {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;
}

.non_tariff_parameter_title {
  color: #626C77;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Text";
  font-size: 17px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
}

.non_tariff_buttons_row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  width: 100%;
}

.non_tariff_value_button {
  display: inline-flex;
  padding: 8px 16px;
  align-items: center;
  border-radius: 12px;
  background: #F2F3F7;
  color: #1D2023;
  border: none;
  cursor: pointer;
  transition: all 0.2s ease;
  font-family: "MTS Text";
  font-size: 17px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
}

.non_tariff_value_button.selected {
  background: #1D2023;
  color: #FFF;
}

.non_tariff_parameter_group {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;
}

.non_tariff_radio_row {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  width: 100%;
}

.non_tariff_radio_option {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: none;
  background: transparent;
  padding: 0;
  cursor: pointer;
}

.non_tariff_radio {
  display: flex;
  padding: 3px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #FFF;
  border: 2px solid #8D969F;
  flex-shrink: 0;
}

.non_tariff_radio.selected {
  border-color: #FF0032;
}

.non_tariff_radio_dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #FF0032;
  opacity: 0;
  transition: opacity 0.2s ease;
}

.non_tariff_radio.selected .non_tariff_radio_dot {
  opacity: 1;
}

.non_tariff_radio_text {
  color: #1D2023;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Text";
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
}

.offer_action_zone {
  display: flex;
  flex-direction: column;
  gap: 24px;
  width: 100%;
}

.sticky_offer_footer {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2;
  display: flex;
  padding: 16px 20px;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  gap: 12px;
  align-self: stretch;
  border-radius: 32px 32px 0 0;
  background: #FFF;
  box-shadow: 0 -8px 24px rgba(0, 0, 0, 0.12);
  transform: translateY(100%);
  opacity: 0;
  pointer-events: none;
  transition: transform 0.28s ease, opacity 0.28s ease;
  box-sizing: border-box;
  width: 100%;
  max-width: 100vw;
}

.sticky_offer_footer.visible {
  transform: translateY(0);
  opacity: 1;
  pointer-events: auto;
}

.sticky_offer_prices {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.sticky_offer_button {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.sticky_offer_note {
  color: #626C77;
  text-align: center;
  font-family: 'MTS Compact';
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
}

.sticky_addons_count {
  color: #626C77;
  text-align: right;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: 'MTS Compact';
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
  width: 100%;
}

@media (min-width: 1024px) {
  .sticky_offer_footer {
    display: none;
  }
}

/* Основные стили компонента */

.abonements_block {
  display: flex;
  padding: 20px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 32px;
  width: 100%;
}

.abonements_header {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  align-self: stretch;
}

.abonements_h2 {
  color: #1D2023;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Wide";
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
}

.abonements_desc {
  color: #626C77;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Text";
  font-size: 17px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
}

.abonements_carousel {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  align-self: stretch;
  width: 100%;
}

.abonement_item {
  width: 100%;
  display: flex;
  padding: 16px;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  align-self: stretch;
  border-radius: 20px;
  background: #FFF;
  box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.08), 0 4px 16px 0 rgba(0, 0, 0, 0.08);
  cursor: pointer;
}

.abonement_item.selected {
  outline: 1px solid rgba(255, 0, 50, 0.12);
}

.abonement_top_row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-self: stretch;
  gap: 12px;
}

.abonemet_nominal {
  color: #1D2023;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Text";
  font-size: 17px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
}

.abonement_radio {
  display: flex;
  padding: 3px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #FFF;
  border: 2px solid #8D969F;
  flex-shrink: 0;
  cursor: pointer;
}

.abonement_radio.selected {
  border-color: #FF0032;
}

.abonement_radio_dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #FF0032;
  opacity: 0;
  transition: opacity 0.2s ease;
}

.abonement_radio.selected .abonement_radio_dot {
  opacity: 1;
}

.abonement_bottom_row {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  align-self: stretch;
  justify-content: space-between;
}

.abonement_prices_group {
  display: flex;
  align-items: baseline;
  gap: 12px;
  flex-wrap: wrap;
}

.abonement_price {
  color: #1D2023;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Text";
  font-size: 17px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
}

.abonement_old_price {
   color: #626C77;
    text-align: right;
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "MTS Text";
    font-size: 17px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    text-decoration: line-through;
    text-decoration-color: #ff0032;
    text-decoration-thickness: 1px;
}

.abonement_discount_badge {
    color: #0057B8;
    font-family: "MTS Text";
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px;
    white-space: nowrap;
    display: flex;
    padding: 2px 6px;
    justify-content: center;
    align-items: center;
    gap: 4px;
    border-radius: 8px;
    background:  #C7E1FF;
}

.offer_next_charge {
  display: flex;
  padding: 8px 12px;
  align-items: center;
  gap: 8px;
  align-self: stretch;
  border-radius: 16px;
  background: #F2F3F7;
}

.offer_next_charge_text {
  color: #1D2023;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Text";
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
}

.value_main{
display:flex;
align-items:center;
gap:6px;
color:#1D2023;
font-family:"MTS Text";
font-size:20px;
font-style:normal;
font-weight:500;
line-height:24px;
}

.value_main_applied{
  color:  #626C77;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Text";
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
}

.value_diff{
color:#969FA8;
font-family:"MTS Text";
font-size:14px;
font-style:normal;
font-weight:400;
line-height:20px;
margin-top:2px;
}

.sticky_button_wrapper {
  position: fixed;
  bottom: -200px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 999;

  display: flex;
  width: 390px;
  padding: 20px 20px 12px 20px;
  flex-direction: column;
  align-items: flex-start;

  border-radius: 36px 36px 0 0;
  background: #FFF;
  box-shadow: 0 0 16px 0 rgba(0, 0, 0, 0.08),
              0 4px 16px 0 rgba(0, 0, 0, 0.08);

  transition: bottom 0.35s ease;
}

.sticky_button_wrapper.visible {
  bottom: 0;
}

.sticky_doplata {
  margin-top: 8px;
  color: #626C77;
  text-align: center;
  font-family: "MTS Compact";
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  width: 100%;
}

/* Блок пресетов */
.presets_block {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 12px;
    align-self: stretch;
    width: 100%;
    margin-bottom: 8px;
}

.offer_title_header{
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-self: stretch;
}

.presets_header {
    color:  #1D2023;
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "MTS Wide";
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: 0.6px;
    text-transform: uppercase;
}

.presets_buttons {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    width: 100%;
}

.preset_button {
    display: flex;
    padding: 4px 10px 4px 4px;
    justify-content: center;
    align-items: center;
    gap: 6px;
    border-radius: 100px;
    background:  #FFF;
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.08), 0 4px 16px 0 rgba(0, 0, 0, 0.08);
    border: none;
    cursor: pointer;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    outline: none;
}

.preset_button:hover:not(:disabled) {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.12), 0 6px 20px 0 rgba(0, 0, 0, 0.12);
    color: cadetblue;
    border: 1.25px #626c77 solid;
}

.preset_button:active:not(:disabled) {
    transform: translateY(0);
}

.preset_button:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

.preset_icon {
    width: 20px;
    height: 20px;
    object-fit: contain;
}

.preset_name {
    color: #1D2023;
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "MTS Text";
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px;
    white-space: nowrap;
}

.offer_component {
    display: flex;
    padding: 24px 20px;
    flex-direction: column;
    align-items: flex-start;
    gap: 48px;
    align-self: stretch;
    border-radius: 32px;
    background: #E2E6EB;
  }
  
  .offer-component-deluxe {
    background: linear-gradient(352deg, #E4F0FF 26.6%, #8CAFFF 90.51%) !important;
    background-image: url(https://static2.mts.ru/structures/source/image/fire_icon.png);
    background-repeat: no-repeat;
    background-position: top right;
    background-size: 99px 88px;
  }
  
  .offer-component-deluxe .offer_description_before {
    color: #ffffff !important;
  }
  
  .offer_body {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 32px;
    align-self: stretch;
    width: 100%;
    background: #fff;
    border-radius: 32px;
    
  }


  .offer_title_container {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 6px;
    justify-content: space-between;
}
  
  .offer_desc_body {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    align-self: stretch;
    padding: 20px;
  }
  
  .offer_description_before {
    color: var(--Text-Light-Secondary, #626C77);
    font-feature-settings: 'liga' off, 'clig' off;
    font-style: normal;
    font-weight: 400;
    margin-bottom: 4px;
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "MTS Wide";
    font-size: 20px;
    font-weight: 500;
    line-height: 24px;
  }
  
  .operator_bonus_badge {
    display: inline-flex;
    padding: 2px 6px;
    align-items: center;
    gap: 4px;
    border-radius: 8px;
    background: var(--Constant-Lightest-Blueberry, #E1F3FE);
    color: var(--Constant-Darkest-Blueberry, #0048AA);
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "MTS Compact";
    font-size: 17px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px;
    margin-bottom: 8px;
  }
  
  .offer_main {
    display: flex;
    max-width: 100%;
    padding: 0px;
    flex-direction: column;
    align-items: flex-start;
    gap: 32px;
    align-self: stretch;
    border-radius: 32px;
    background: var(--Background-Light-Primary, #FFF);
    width: 100%;
  }
  
  .offer_title {
    align-self: stretch;
    color: var(--Text-Light-Primary, #1D2023);
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "MTS Wide";
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: 28px;
  }
  
  .type_badge {
    color: var(--Text-Light-Secondary, #626C77);
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "MTS Text";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
  }
  
  .offer_description {
    align-self: stretch;
    color: var(--Text-Light-Secondary, #626C77);
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "MTS Text";
    font-size: 17px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
  }
  
  /* Оптимальные настройки */
  .optimal_settings_toggle {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 0px !important;
    width: 100%;
    padding: 12px;
    justify-content: space-between;
    align-self: stretch;
    border-radius: 12px;
    background: #F2F3F7;
    height: 66px;
    padding: 12px 16px 12px 16px;
  }
  
  .toggle_switch {
    position: relative;
    display: inline-block;
    width: 44px;
    height: 24px;
    margin: 0;
  }
  
  .toggle_switch input {
    opacity: 0;
    width: 0;
    height: 0;
  }
  
  .slider_optimal {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    transition: .4s;
    border-radius: 24px;
  }
  
  .slider_optimal:before {
    position: absolute;
    content: "";
    height: 20px;
    width: 20px;
    left: 2px;
    bottom: 2px;
    background-color: white;
    transition: .4s;
    border-radius: 50%;
  }
  
  input:checked + .slider_optimal {
    background-color: #FF0032;
  }
  
  input:checked + .slider_optimal:before {
    transform: translateX(20px);
  }
  
  .toggle_label {
    font-family: "MTS Text";
    font-size: 17px;
    font-weight: 500;
    line-height: 24px;
    color: #1E2125;
  }
  
  /* Дефолтные значения */
  .default_tariff_values {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    width: 100%;
  }
  
  .default_gb,
  .default_min,
  .default_sms {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 8px;
  }
  
  .default_gb_value,
  .default_min_value,
  .default_sms_value {
    color: var(--Text-Light-Primary, #1D2023);
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "MTS Text";
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    display: flex;
    align-items: flex-start;
    gap: 4px;
    display: flex;
    flex-direction: column;
  }

  
  /* Параметры */
  .offer_params {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
    align-self: stretch;
  }
  
  .offer_param {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    align-self: stretch;
  }
  
  .offer_param_bullet {
    padding: 10px;
    align-items: center;
    border-radius: 12px;
    background: #007CFF;
  }
  
  .predifined_params {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    flex: 1;
  }
  
  .offer_param_value {
    color: var(--Text-Light-Primary, #1D2023);
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "MTS Text";
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
  }
  
  .offer_param_name {
    color: var(--Text-Light-Secondary, #626C77);
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "MTS Text";
    font-size: 17px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
  }
  
  /* Редактируемые параметры */
  .editable_parameters {
    display: flex;
    flex-direction: column;
    gap: 24px;
    width: 100%;
    margin-bottom: 24px;
  }
  
  .parameter-block {
    display: flex;
    flex-direction: column;
    gap: 12px;
    flex-direction: row;
  }
  
  .parameter_slider_container {
    width: 100%;
  }
  
  .parameter_header {
    display: flex;
    justify-content: space-between;
    margin-bottom: 8px;
  }
  
  .parameter_value_display {
    font-family: "MTS Text";
    font-size: 17px;
    font-weight: 500;
    line-height: 24px;
    color: #1E2125;
    display: flex;
    align-items: center;
    gap: 4px;
  }
  
  .parameter_slider {
    width: 100%;
    height: 4px;
    -webkit-appearance: none;
    appearance: none;
    border-radius: 2px;
    outline: none;
    margin: 12px 0;
    background: linear-gradient(
      to right,
      #FF0032 0%,
      #FF0032 var(--progress),
      rgba(188, 195, 208, 0.50) var(--progress),
      rgba(188, 195, 208, 0.50) 100%
    );
  }

  .parameter_slider_container.static-mode {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

  .static-value {
    font-family: "MTS Text";
    font-size: 20px;
    font-weight: 500;
    line-height: 24px;
    color: #1E2125;
    display: flex;
    align-content: center;
    align-items: center;
    gap: 4px;
  }
  
  .parameter_slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 32px;
    height: 32px;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    background: #FFF;
    border: none;
    cursor: pointer;
    filter: drop-shadow(0 12px 20px rgba(0, 0, 0, 0.14)) drop-shadow(0 4px 24px rgba(0, 0, 0, 0.12));
  }

  .parameter_slider::-moz-range-thumb {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #FFF;
    border: none;
    cursor: pointer;
    filter: drop-shadow(0 12px 20px rgba(0, 0, 0, 0.14)) drop-shadow(0 4px 24px rgba(0, 0, 0, 0.12));
  }
  
  .parameter_slider.infinity-mode::-webkit-slider-thumb {
    background: #C7C7C7 !important;
  }
  
  .slider_limits {
    color: var(--Text-Light-Secondary, #626C77);
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "MTS Text";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    display: flex;
    justify-content: space-between;
    margin-top: 8px;
  }
  
  /* Безлимит переключатель */
  .infinity_settings_toggle {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 0px !important;
    justify-content: space-between;
    align-self: stretch;
    border-radius: 12px;
    height: 44px;
  }
  
  .infinity_toggle {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    transition: .4s;
    border-radius: 24px;
  }
  
  .infinity_toggle:before {
    position: absolute;
    content: "";
    height: 20px;
    width: 20px;
    left: 2px;
    bottom: 2px;
    background-color: white;
    transition: .4s;
    border-radius: 50%;
  }
  
  input:checked + .infinity_toggle {
    background-color: #26CD58;
  }
  
  input:checked + .infinity_toggle:before {
    transform: translateX(20px);
  }
  
  .toggle_label_infinity {
    font-family: "MTS Compact";
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    color: #1E2125;
  }
  
  /* Радио кнопки */
  .parameter_radio_container {
    width: 100%;
  }
  
  .radio_options {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 8px;
  }
  
  .radio_options input[type="radio"] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
  }
  
  .radio_option {
    display: inline-flex;
    padding: 6px 12px;
    align-items: center;
    border-radius: 12px;
    background: #F5F7F9;
    color: #1E2125;
    cursor: pointer;
    transition: all 0.2s ease;
    user-select: none;
  }
  
  .radio_option.selected {
    background: #1D2023;
    color: white;
  }
  
  .radio_label {
    font-family: "MTS Text";
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
  }
  
  /* Цены */
  .offer_prices {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    align-self: stretch;
    flex-direction: column;
    width: 100%;
  }
  
  .current_price {
    display: flex;
    align-items: center;
    gap: 12px;
    justify-content: space-between;
    width: 100%;
  }
  
  .result_price {
    color: var(--Text-Light-Primary, #1D2023);
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "MTS Text";
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
  }
  
  .sale_badge {
    color: var(--Constant-Darkest-Apple, #027722);
    text-align: center;
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "MTS Compact";
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px;
    border-radius: 8px;
    background: var(--Constant-Lightest-Apple, #E8FAEB);
    display: flex;
    padding: 2px 6px;
    justify-content: center;
    align-items: center;
    gap: 4px;
    min-width: 100px;
  }
  
  .old_price {
    color: var(--Text-Light-Secondary, #626C77);
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "MTS Text";
    font-size: 17px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    text-decoration: line-through;
    text-decoration-color: red;
    text-decoration-thickness: 1px;
  }
  
  /* Детализация цены */
  .price-breakdown-toggle {
    margin-top: 8px;
    width: 100%;
  }
  
  .toggle-header {
    display: flex;
    align-items: center;
    cursor: pointer;
    color: #0070E0;
    font-size: 14px;
    font-weight: 500;
    gap: 4px;
    user-select: none;
    transition: color 0.2s;
  }
  
  .toggle-header:hover {
    color: #0056b3;
  }
  
  .toggle-arrow {
    transition: transform 0.2s ease;
    color: #0070E0;
  }
  
  .toggle-arrow.open {
    transform: rotate(180deg);
  }
  
  .price-breakdown-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
  }
  
  .price-breakdown-content.open {
    max-height: 350px;
  }
  
  .breakdown-details {
    padding-top: 8px;
    border-top: 1px solid #f0f0f0;
    margin-top: 4px;
  }
  
  .addon-price-name {
    width: 72%
  }

  .base-price-item,
  .addon-price-item,
  .total-price-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 4px;
    font-size: 14px;
  }
  
  .addon-price-item {
    color: #666;
    padding-left: 12px;
  }
  
  .total-price-separator {
    height: 1px;
    background-color: #e0e0e0;
    margin: 6px 0;
  }
  
  .total-price-item {
    font-weight: 500;
    margin-top: 4px;
    font-family: "MTS Text";
  }
  
  .price-name {
    flex: 1;
  }
  
  .price-value {
    margin-left: 8px;
  }
  
  /* Гарантия цены */
  .addon_item.garantia_addon {
    margin: 20px 0px 0px 0px;
    background-image: url('https://static2.mts.ru/structures/source/image/garantia_price.png');
    background-position: right top;
    background-repeat: no-repeat;
    background-size: 80px auto;
    padding: 15px;
    min-height: 130px;
    position: relative;
    background-color: #FFF;
    border-radius: 20px;
    box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.08), 
                0px 4px 16px 0px rgba(0, 0, 0, 0.08);
  }
  
  .addon_description.garantia_desc {
    width: 60%;
  }
  
  /* Аддоны */
  .addons_block {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    align-self: stretch;
    width: 100%;
    padding:20px;
  }
  
  .addons_header {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    align-self: stretch;
  }
  
  .addons_h2 {
    color: var(--Text-Light-Primary, #1D2023);
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "MTS Text";
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
  }
  
  .addons_col {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    align-self: stretch;
  }
  
  .addon_item {
    display: flex;
    padding: 16px;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    align-self: stretch;
    border-radius: 20px;
    background: var(--Background-Light-Primary, #FFF);
    box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.08), 
                0px 4px 16px 0px rgba(0, 0, 0, 0.08);
    width: 100%;
  }
  
  .addon_general_info {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    align-self: stretch;
  }
  
  .addon_title {
    color: var(--Text-Light-Primary, #1D2023);
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "MTS Text";
    font-size: 17px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
  }
  
  .addon_description {
    color: var(--Text-Light-Secondary, #626C77);
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "MTS Text";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
  }
  
  .addon_price_block {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    align-self: stretch;
    
  }
  
  .addon_price_info {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 12px;
  }
  
  .addon_price {
    color: var(--Text-Light-Primary, #1D2023);
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "MTS Text";
    font-size: 17px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
  }
  
  .addon_sale_badge {
    display: flex;
    height: 20px;
    padding: 2px 4px;
    justify-content: center;
    align-items: center;
    gap: 2px;
    border-radius: 6px;
    background: var(--Accent-Positive, #26CD58);
    color: white;
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "MTS Compact";
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 16px;
  }
  
  .addon_toggle {
    display: flex;
    align-items: center;
  }
  
  .toggle-input {
    display: none;
  }
  
  .toggle-label {
    display: flex;
    width: 42px;
    height: 24px;
    padding: 3px;
    align-items: center;
    border-radius: 100px;
    background: rgba(188, 195, 208, 0.5);
    position: relative;
    cursor: pointer;
    transition: background 0.2s;
  }
  
  .toggle-label::after {
    content: '';
    display: block;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: white;
    transition: transform 0.2s;
  }
  
  .toggle-input:checked + .toggle-label {
    background: #26CD58;
    padding: 3px 3px 3px 21px;
  }
  
  .toggle-input:checked + .toggle-label::after {
    transform: translateX(0);
  }
  
  .toggle-label-garant {
    display: flex;
    width: 42px;
    height: 24px;
    padding: 3px;
    align-items: center;
    border-radius: 100px;
    background: rgba(188, 195, 208, 0.5);
    position: relative;
    cursor: pointer;
    transition: background 0.2s;
  }
  
  .toggle-label-garant {
    display: flex;
    width: 42px;
    height: 24px;
    padding: 3px;
    align-items: center;
    border-radius: 100px;
    background: rgba(188, 195, 208, 0.5);
    position: relative;
    cursor: pointer;
    transition: background 0.2s;
  }
  
  .toggle-label-garant::after {
    content: '';
    display: block;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: white;
    transition: transform 0.2s;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9.73779 4.59393C9.5409 4.39354 9.34394 4.24831 9.12995 4.14099C9.12842 4.10888 9.12682 4.07685 9.12514 4.04492C9.06019 2.80955 9.02771 2.19186 8.38593 1.52135C8.34705 1.48073 8.25394 1.39239 8.21133 1.35569C7.50805 0.75 7.00537 0.75 6.00002 0.75C4.99467 0.75 4.492 0.75 3.78871 1.35569C3.74611 1.39239 3.653 1.48073 3.61412 1.52135C2.97234 2.19186 2.93986 2.80955 2.87491 4.04492C2.87323 4.07684 2.87163 4.10886 2.8701 4.14097C2.6561 4.24828 2.45912 4.39352 2.26221 4.59393C1.59101 5.27709 1.56377 5.88347 1.50929 7.09623C1.50327 7.23023 1.5 7.36512 1.5 7.5C1.5 7.63488 1.50327 7.76977 1.50929 7.90377C1.56377 9.11653 1.59101 9.72291 2.26221 10.4061C2.93342 11.0892 3.60551 11.1313 4.9497 11.2155C5.29242 11.237 5.64621 11.25 6 11.25C6.35379 11.25 6.70758 11.237 7.0503 11.2155C8.39449 11.1313 9.06658 11.0892 9.73779 10.4061C10.409 9.72291 10.4362 9.11653 10.4907 7.90376C10.4967 7.76977 10.5 7.63488 10.5 7.5C10.5 7.36512 10.4967 7.23023 10.4907 7.09623C10.4362 5.88347 10.409 5.27709 9.73779 4.59393ZM4.42684 2.29924C4.1352 2.60393 4.074 2.78599 4.01204 3.85508C4.28588 3.82608 4.5943 3.80676 4.9497 3.7845C5.29242 3.76304 5.64621 3.75 6 3.75C6.35379 3.75 6.70758 3.76304 7.0503 3.7845C7.40572 3.80676 7.71416 3.82608 7.98801 3.85508C7.92605 2.78599 7.86485 2.60393 7.57321 2.29924L7.57374 2.2998C7.4048 2.13219 7.21212 1.97686 6.97391 1.9237C6.78094 1.88063 6.54099 1.875 6.00002 1.875C5.45906 1.875 5.21911 1.88063 5.02614 1.9237C4.79055 1.97628 4.59241 2.13053 4.42622 2.29988L4.42684 2.29924ZM6.75 7.5C6.75 7.08579 6.41421 6.75 6 6.75C5.58579 6.75 5.25 7.08579 5.25 7.5C5.25 7.91421 5.58579 8.25 6 8.25C6.41421 8.25 6.75 7.91421 6.75 7.5Z' fill='%23626C77'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
  }
  
  .toggle-input:checked + .toggle-label-garant {
    background: #26CD58;
    padding: 3px 3px 3px 21px;
  }

  
  .toggle-input:checked + .toggle-label-garant::after {
    transform: translateX(0);
  }

  .offer_params{
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 24px;
align-self: stretch;
}

.offer_param{
    display: flex;
    align-items: flex-start;
    gap: 12px;
    align-self: stretch;
}

.predifined_params{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    flex: 1 0 0;
}

.offer_param_value{
    color: var(--Text-Light-Primary, #1D2023);
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "MTS Text";
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
}

.offer_param_name{
    color: var(--Text-Light-Secondary, #626C77);
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "MTS Text";
    font-size: 17px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px; /* 141.176% */
}

.optimal_settings_toggle {
        display: flex;
        align-items: center;
        gap: 12px;
        margin-bottom: 0px !important;
        width: 100%;
        padding: 12px;
        justify-content: space-between;
        align-self: stretch;
        border-radius: 12px;
        background: rgba(242, 243, 247, 0.50);
        height: 66px;
  }

   .infinity_settings_toggle {
        display: flex;
        align-items: center;
        gap: 8px;
        margin-bottom: 0px !important;
        width: 150px;
        justify-content: space-between;
        align-self: stretch;
        border-radius: 12px;
        height: 98px;
        flex-direction: row-reverse;
  }
  
  .toggle_switch {
    position: relative;
    display: inline-block;
    width: 44px;
    height: 24px;
    margin: 0;
  }
  
  .toggle_switch input {
    opacity: 0;
    width: 0;
    height: 0;
  }
  
  .slider_optimal {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    transition: .4s;
    border-radius: 24px;
  }
  
  .slider_optimal:before {
    position: absolute;
    content: "";
    height: 20px;
    width: 20px;
    left: 2px;
    bottom: 2px;
    background-color: white;
    transition: .4s;
    border-radius: 50%;
  }

  .infinity_toggle {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    transition: .4s;
    border-radius: 24px;
  }
  
  .infinity_toggle:before {
    position: absolute;
    content: "";
    height: 20px;
    width: 20px;
    left: 2px;
    bottom: 2px;
    background-color: white;
    transition: .4s;
    border-radius: 50%;
  }
  
  input:checked + .slider_optimal {
    background-color: #FF0032;
  }

  input:checked + .slider_optimal:before {
    transform: translateX(20px);
  }


  input:checked + .infinity_toggle {
    background-color: #26CD58;
  }
  

  input:checked + .infinity_toggle:before {
    transform: translateX(20px);
  }
  
  .toggle_label {
    font-family: "MTS Text";
    font-size: 17px;
    font-weight: 500;
    line-height: 24px;
    color: #1E2125;
  }

  .toggle_label_infinity {
    font-family: "MTS Compact";
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    color: #1E2125;
  }
  
  .editable_parameters {
    display: flex;
    flex-direction: column;
    gap: 24px;
    width: 100%;
    margin-bottom: 24px;
  }
  
  .parameter_slider_container {
    width: 100%;
  }
  
  .parameter_header {
    display: flex;
    justify-content: space-between;
    margin-bottom: 8px;
  }
  
  .parameter_name {
    font-family: "MTS Text";
    font-size: 17px;
    font-weight: 400;
    line-height: 24px;
    color: #1E2125;
  }
  
  .parameter_value_display {
    font-family: "MTS Text";
    font-size: 20px;
    font-weight: 500;
    line-height: 24px;
    color: #1E2125;
    display: flex;
    align-content: center;
    align-items: center;
    gap: 4px;
  }
  


  .parameter_slider.infinity-mode::-webkit-slider-thumb {
  background:rgb(199, 199, 199) !important; /* Grey color for infinity mode */
  }
  
  .slider_limits {
    color: var(--Text-Light-Secondary, #626C77);
    text-align: right;
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "MTS Text";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    display: flex;
    justify-content: space-between;
    margin-top: 8px;
  }
  
  .parameter_radio_container {
    width: 100%;
  }
  
  .radio_options {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 8px;
  }

  .radio_options input[type="radio"] {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}
  
  .radio_option {
    display: flex;
    padding: 8px 16px;
    align-items: center;
    border-radius: 20px;
    background: #F5F7F9;
    cursor: pointer;
  }
  
  .radio_option.selected {
    background: #1D2023;
    color: white;
  }
  
  .radio_option input {
    display: none;
  }
  
  .radio_label {
    font-family: "MTS Text";
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
  }
  
  .radio_option.selected .radio_label {
    color: white;
  }
  
  .offer_param_name {
    color: var(--Text-Light-Secondary, #626C77);
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "MTS Text";
    font-size: 17px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
  }

.offer_trial_badge {
display: flex;
padding: 2px 6px;
justify-content: center;
align-items: center;
gap: 4px;
border-radius: 8px;
background: var(--Constant-Dark-Blueberry, #007CFF);
color: var(--Constant-Greyscale-0, #FFF);
text-align: center;
font-feature-settings: 'liga' off, 'clig' off;
font-family: "MTS Compact";
font-size: 14px;
font-style: normal;
font-weight: 500;
line-height: 20px; /* 142.857% */
}

.radio_option.unselected {
  background: #F2F3F7;
  color: #1D2023;
}

.radio_option.selected {
  background: #1D2023;
  color: white;
  display: flex;
  align-items: center;
}

 .radio_option {
  display: inline-block;
  padding: 6px 12px;
  border-radius: 12px;
  margin: 0;
  background: #F5F7F9;
  color: #1E2125;
  cursor: pointer;
  transition: all 0.2s ease;
}

 .radio_option:last-child {
  margin-right: 0;
}

 .default_tariff_values {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
}

.default_gb {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  gap: 8px;
}

.default_min {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  gap: 8px;}

.default_gb_value {
  color: var(--Text-Light-Primary, #1D2023);
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Text";
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
}

.default_min_value{
  color: var(--Text-Light-Primary, #1D2023);
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Text";
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
}

.offer_main {
display: flex;
max-width: 100%;
flex-direction: column;
align-items: flex-start;
gap: 32px;
align-self: stretch;
border-radius: 32px;
background: var(--Background-Light-Primary, #FFF);
}

.offer_description_before {
    color: var(--Text-Light-Secondary, #626C77);
    font-feature-settings: 'liga' off, 'clig' off;
    font-style: normal;
    font-weight: 400;
    margin-bottom: 4px;
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "MTS Wide";
    font-size: 20px;
    font-weight: 500;
    line-height: 24px;
  }
  
  .price-breakdown {
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid rgba(188, 195, 208, 0.50);
  }
  
  .base-price-item,
  .addon-price-item,
  .total-price-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 4px;
    font-size: 14px;
  }
  
  .addon-price-item {
    color: #666;
  }
  
  .total-price-separator {
    height: 1px;
    background-color: rgba(188, 195, 208, 0.50);
    margin: 6px 0;
  }
  
  .total-price-item {
    font-weight: bold;
    margin-top: 4px;
  }
  
  .price-name {
    flex: 1;
  }
  
  .price-value {
    margin-left: 8px;
  }

  .offer_description_before {
    color: var(--Text-Light-Secondary, #626C77);
    font-feature-settings: 'liga' off, 'clig' off;
    font-style: normal;
    font-weight: 400;
    margin-bottom: 4px;
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "MTS Wide";
    font-size: 20px;
    font-weight: 500;
    line-height: 24px;
  }
  
  .price-breakdown-toggle {
    margin-top: 8px;
  }
  
  .toggle-header {
    display: flex;
    align-items: center;
    cursor: pointer;
    color: #0070E0;
    font-size: 14px;
    font-weight: 500;
    gap: 4px;
    user-select: none;
  }
  
  .toggle-header:hover {
    color: #0056b3;
  }
  
  .toggle-arrow {
    transition: transform 0.2s ease;
    color: #0070E0;
  }
  
  .toggle-arrow.open {
    transform: rotate(180deg);
  }
  
  .price-breakdown-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
  }
  
  .price-breakdown-content.open {
    max-height: fit-content;
  }
  
  .breakdown-details {
    border-top: 1px solid #f0f0f0;
    margin-top: 12px;
    padding: 12px;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    align-self: stretch;
    border-radius: 16px;
    border: 1px solid rgba(188, 195, 208, 0.50);
    background:  #F2F3F7;
  }
  
  .base-price-item,
  .addon-price-item,
  .total-price-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 4px;
    font-size: 14px;
  }
  
  .addon-price-item {
    color: #666;
    padding-left: 12px;
  }
  
  .total-price-separator {
    height: 1px;
    background-color: #e0e0e0;
    margin: 6px 0;
  }
  
  .total-price-item {
    font-weight: 500;
    margin-top: 4px;
    font-family: "MTS Text";
  }
  
  .price-name {
    flex: 1;
  }
  
  .price-value {
    margin-left: 8px;
  }

  .price-breakdown-toggle{
  width: 100%;
  }

  .addon_price_info{
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 12px;
  }

  .infinity-toggle {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border-radius: 8px;
    border: 1px solid #ccc;
    cursor: pointer;
    user-select: none;
    transition: 0.2s;
  }
  .infinity-toggle.active {
    background: #3eb75e;
    color: #fff;
    border-color: #3eb75e;
  }
  .infinity-symbol {
    font-size: 18px;
    font-weight: bold;
  }

  .parameter-block{
    display: flex;
    gap: 12px;
    align-content: center;
  }

  .addon_item.garantia_addon{
      margin: 20px 0px 0px 0px;
      background-image: url('https://static2.mts.ru/structures/source/image/garantia_price.png');
      background-position: right top;
      background-repeat: no-repeat;
      background-size: 80px auto; /* Adjust size as needed */
      padding: 15px;
      min-height: 130px; 
      position: relative;
  }

  .type_badge {
    color:  #969FA8;
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "MTS Text";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    justify-self: center;
  }

  /* TariffComponent.css - добавить эти стили */

/* Стили для скелетонов */
.skeleton {
    position: relative;
    overflow: hidden;
    background-color: #f0f0f0;
    border-radius: 4px;
  }
  
  .skeleton::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    transform: translateX(-100%);
    background-image: linear-gradient(
      90deg,
      rgba(255, 255, 255, 0) 0,
      rgba(255, 255, 255, 0.2) 20%,
      rgba(255, 255, 255, 0.5) 60%,
      rgba(255, 255, 255, 0)
    );
    animation: shimmer 2s infinite;
  }
  
  @keyframes shimmer {
    100% {
      transform: translateX(100%);
    }
  }
  
  .skeleton-text {
    height: 1em;
    width: 60%;
    margin: 0.2em 0;
  }
  
  .skeleton-price {
    display: block;
    width: 140px;
    height: 24px;
    border-radius: 8px;
  }
  
  .default_gb_value.skeleton,
  .default_min_value.skeleton,
  .default_sms_value.skeleton {
    min-width: 60px;
    min-height: 24px;
  }
  
  .result_price.skeleton {
     display: inline-flex;
     align-items: center;
     min-width: 140px;
     min-height: 24px;
     line-height: 24px;
  }
  
  .old_price.skeleton {
    min-height: 20px;
    min-width: 100px;
    margin-top: 4px;
  }

  .component_button{
    width:100%
  }

  .tariff_configuration_block{
    display: flex;
    flex-direction: column;
    gap: 24px;
    width:100%;
  }



  @media (min-width: 1024px) {

    .toggle_label_infinity {
    font-family: "MTS Compact";
    font-size: 17px;
    font-weight: 500;
    line-height: 24px;
  }

    .addons_col {
    flex-direction: column;
    align-items: flex-start;
    align-self: stretch;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
  }
  
    .addon_item{
    justify-content: space-between;
    gap: 24px;
    }


    .offer_desc_body{
      padding: 24px;
    }

    .addon_title {
      color:  #1D2023;
      font-feature-settings: 'liga' off, 'clig' off;
      font-family: "MTS Text";
      font-size: 20px;
      font-style: normal;
      font-weight: 500;
      line-height: 24px; /* 120% */
    }

    .addon_description{
      color:  #626C77;
      font-feature-settings: 'liga' off, 'clig' off;
      font-family: "MTS Text";
      font-size: 17px;
      font-style: normal;
      font-weight: 400;
      line-height: 24px; /* 141.176% */
    }

    .addon_price{
      color:  #1D2023;
      font-feature-settings: 'liga' off, 'clig' off;
      font-family: "MTS Text";
      font-size: 20px;
      font-style: normal;
      font-weight: 500;
      line-height: 24px; /* 120% */
    }

    .presets_header{
      color:  #1D2023;
      font-family: "MTS Wide";
      font-size: 14px;
      font-style: normal;
      font-weight: 600;
      line-height: 20px; /* 142.857% */
      letter-spacing: 0.7px;
      text-transform: uppercase;
    }

    .preset_button{
      display: flex;
      padding: 4px 12px 4px 4px;
      justify-content: center;
      align-items: center;
      gap: 8px;
      border-radius: 100px;
      background: #FFF; 
      box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.08), 0 4px 16px 0 rgba(0, 0, 0, 0.08);
    }

    .preset_icon {
      width: 36px;
      height: 36px;
      object-fit: contain;
    }

    .preset_name{
      color: #000000;
      font-feature-settings: 'liga' off, 'clig' off;
      font-family: "MTS Text";
      font-size: 17px;
      font-style: normal;
      font-weight: 500;
      line-height: 24px;
    }

    .default_gb_value {
    color: var(--Text-Light-Primary, #1D2023);
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "MTS Text";
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    }


    .offer_title {
      color:  #1D2023;
      font-feature-settings: 'liga' off, 'clig' off;
      font-family: "MTS Wide";
      font-size: 32px;
      font-style: normal;
      font-weight: 500;
      line-height: 36px; /* 112.5% */
    }

    .offer_description{
      color:  #626C77;
      font-feature-settings: 'liga' off, 'clig' off;
      font-family: "MTS Text";
      font-size: 20px;
      font-style: normal;
      font-weight: 400;
      line-height: 28px; /* 140% */
    }

    .toggle_label{
      color: #1D2023;
      font-feature-settings: 'liga' off, 'clig' off;
      font-family: "MTS Text";
      font-size: 20px;
      font-style: normal;
      font-weight: 500;
      line-height: 24px;
    }

    .parameter_value_display {
    font-family: "MTS Text";
    font-size: 20px;
    font-weight: 500;
    line-height: 24px;
    color: #1E2125;
    display: flex;
    align-items: center;
    gap: 4px;
  }

  .slider_limits{
    color:  #626C77;
    text-align: right;
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "MTS Text";
    font-size: 17px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px; /* 141.176% */
    margin-top: 8px;
  }

  .radio_label {
    font-family: "MTS Text";
    font-size: 17px;
    font-weight: 500;
    line-height: 24px;
  }

  .addon_general_info {
    gap: 8px;
  }


    
}/* PaymentModal.css */
.modal-overlay-payment {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(29, 32, 35, 0.70);
  display: flex;
  align-items: flex-end;
  justify-content: center;
  z-index: 1000;
  overflow: hidden;
}

.modal-container-payment {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  position: absolute;
  bottom: 0;
  width: 100%;
  max-width: 600px;
  border-radius: 32px 32px 0 0;
  background: #FFF;
  padding: 20px;
  box-sizing: border-box;
}

.modal-close-payment {
  position: absolute;
  top: 16px;
  right: 16px;
  background: none;
  border: none;
  cursor: pointer;
  z-index: 10;
  border-radius: var(--32, 12px);
  background: var(--Controls-Tertiary-Active, #F2F3F7);
  height: 36px;
}

.modal-content-payment {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  width: 100%;
  padding: 20px 0;
  max-width: 100%;
  overflow-x: hidden;
}

.modal-title-payment {
  color: #1D2023;
  text-align: center;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Wide";
  font-size: 24px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
  align-self: stretch;
  margin: 0;
}

.error-description {
  color: #D8400C;
  text-align: center;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Text";
  font-size: 17px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  margin: 0;
  width: 300px;
}

.balance-comparison {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  align-self: stretch;
  margin: 16px 0;
}

.balance-item {
  display: flex;
  height: 76px;
  flex-direction: column;
  align-items: flex-start;
  flex: 1 0 0;
  gap:4px;
}

.balance-label {
  color: #626C77;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Compact";
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
  margin: 0;
}

.balance-label {
  color: #D8400C;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Compact";
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
}

.balance-amount {
  display: flex;
  width: 100%;
  padding: 14px 8px 14px 12px;
  justify-content: center;
  align-items: center;
  border-radius: 12px;
  background: #FFF;
  color: #1D2023;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Text";
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
  border: 1px solid var(--Accent-Negative, #F95721);
  background: var(--Background-Secondary, #F2F3F7);
}

.price-amount {
  display: flex;
  width: 100%;
  padding: 14px 8px 14px 12px;
  justify-content: center;
  align-items: center;
  border-radius: 12px;
  background: #FFF;
  color: #1D2023;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Text";
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
  background: var(--Background-Secondary, #F2F3F7);
}

.refill-section {
  display: flex;
  padding: 20px 0;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 12px;
  align-self: stretch;
  border-radius: 32px 32px 0 0;
  background: #FFF;
  width: calc(100% + 40px);
  margin: 0 -20px -20px;
  padding: 20px;
}

.refill-title {
  color: #1D2023;
  text-align: center;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Wide";
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
  margin: 0;
  margin-bottom: 8px;
}

.refill-option {
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-self: stretch;
  border-radius: 24px;
  background: #FFF;
  cursor: pointer;
  transition: transform 0.2s;
  box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.08), 0 4px 16px 0 rgba(0, 0, 0, 0.08);
  padding: 12px;
  
}

.refill-option-main{
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-self: stretch;
  border-radius: 24px;
  background: #FFF;
  cursor: pointer;
  transition: transform 0.2s;
  padding: 12px;
}

.refill-option:hover {
  transform: translateY(-2px);
}

.refill-option-content {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.refill-option-title {
  color: #1D2023;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Text";
  font-size: 17px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
  margin: 0;
}

.refill-option-description {
  color: #626C77;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Text";
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
  margin: 0;
}

.confirm-button {
  background: #007AFF;
  color: white;
  border: none;
  border-radius: 24px;
  padding: 16px 32px;
  font-family: "MTS Text";
  font-size: 17px;
  font-weight: 500;
  cursor: pointer;
  transition: background 0.2s;
  width: 100%;
  max-width: 200px;
}

.confirm-button:hover {
  background: #0056CC;
}

.loading-spinner {
  width: 48px;
  height: 48px;
  border: 4px solid #f3f3f3;
  border-top: 4px solid #007AFF;
  border-radius: 50%;
  animation: spin 1s linear infinite;
}

/* New CSS to add to PaymentModal.css */

/* Icon container styles */
.refill-option-icon {
  display: flex;
  padding: 10px;
  justify-content: center;
  align-items: center;
  border-radius: 12px;
  background: var(--Accent-Active, #007CFF);
  margin-right: 12px;
  flex-shrink: 0;
}

.icon-container {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
}

/* Update refill-option to include icon */
.refill-option {
  display: flex;
  align-items: center; /* Changed from default */
}

.refill-option-content {
  flex-grow: 1; /* Allow content to take available space */
}

/* Arrow icon specific styles */
.arrow-icon {
  flex-shrink: 0;
  margin-left: 8px;
}

/* Price label styling */
.price-label {
  color: #626C77;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Compact";
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
  margin-bottom: 0px;
}

/* Ensure the icon container works with both icons */
.icon-container svg {
  display: block;
}

/* For the smaller plus icon (18x18) center it properly */
.refill-option-icon .icon-container svg[width="18"] {
  width: 18px;
  height: 18px;
}

body.modal-open {
  overflow: hidden;
  position: fixed;
  width: 100%;
  height: 100%;
}

/* Slide-up animation */
.slide-up {
  animation: slideUp 0.35s ease-out forwards;
}

@keyframes slideUp {
  from {
    transform: translateY(100%);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}

/* Improve animation performance */
.modal-container {
  will-change: transform, opacity;
}



@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.success-icon, .error-icon {
  margin-bottom: 16px;
}

/* Desktop styles */
@media (min-width: 768px) {
  .modal-overlay {
    align-items: center;
    justify-content: center;
  }

  .modal-container {
    position: relative;
    border-radius: 32px;
    bottom: auto;
    width: 90%;
    max-width: 440px;
  }

  .refill-section {
    border-radius: 32px;
  }
}.mts-tariff-overuse-card {
  padding: 20px;
  border-radius: 32px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  background: linear-gradient(116deg, #FF865E 6.26%, #F95721 82.57%);
}

/* Header */
.mts-tariff-overuse-header {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}

.offer_title_header{
display: flex;
flex-direction: column;
gap: 8px;
align-self: stretch;
}

.offer_title_container {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 6px;
}

.mts-tariff-overuse-title {
    display: flex;
    align-items: center;
    font-weight: 500;
    gap: 12px;
    color: #FAFAFA;
    font-family: "MTS Wide";
    font-size: 20px;
    line-height: 24px;
    text-align: left;
    width: 100%;
    justify-content: start;
}

.mts-tariff-overuse-description {
  color: #FAFAFA;
  font-family: "MTS Text";
  font-size: 17px;
  line-height: 24px;
  text-align: left;
}

/* Chart */
.mts-tariff-overuse-chart {
  background: #FFF;
  border-radius: 16px;
  padding: 12px;
}

.mts-tariff-overuse-summary {
  display: flex;
  flex-direction: column;
  gap: 4px;
  color:  #626C77;
  font-feature-settings: 'liga' off, 'clig' off;
font-family: "MTS Text";
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: 20px; /* 142.857% */
}

.mts-tariff-overuse-total {
  color: #D8400C;
  font-family: "MTS Wide";
  font-size: 32px;
  line-height: 36px;
  font-family: "MTS Wide";
  font-size: 32px;
  font-style: normal;
  font-weight: 450;
  line-height: 36px; /* 112.5% */
}

/* Content */
.mts-tariff-overuse-content {
  display: flex;
  margin-top: 12px;
}

.mts-tariff-overuse-legend {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-self: center;
}

.mts-tariff-overuse-legend-item {
  display: flex;
  align-items: center;
  gap: 6px;
  font-family: "MTS Text";
  font-size: 12px;
  color:  #626C77;
  font-feature-settings: 'liga' off, 'clig' off;
  font-style: normal;
  font-weight: 400; 
  line-height: 20px; 
}

.mts-tariff-overuse-bars {
  display: flex;
  align-items: flex-end;
  gap: 8px;
}

/* Bars */
.mts-tariff-overuse-bar-column {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
}

.mts-tariff-overuse-bar-stack {
  width: 46px;
  display: flex;
  flex-direction: column-reverse; /* 🔥 КЛЮЧ */
  justify-content: flex-start;
}

.mts-tariff-overuse-bar-plan {
  background: #E2E5EB;
  display: flex;
  justify-content: center;
  align-items: flex-end;
  padding-bottom: 6px;
  font-size: 12px;
  color: #969FA8;
}

.mts-tariff-overuse-bar-over {
  background: linear-gradient(143deg, #FF865E 21.83%, #F95721 79.24%);
  border-radius: 12px 12px 0 0;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  padding-top: 6px;
  font-size: 12px;
  color: #FAFAFA;
  transform-origin: bottom;
  animation: mts-overuse-grow 1.0s ease-out;
}

@keyframes mts-overuse-grow {
  from {
    transform: scaleY(0);
  }
  to {
    transform: scaleY(1);
  }
}

.mts-tariff-overuse-date {
  font-family: "MTS Text";
  font-size: 10px;
  line-height: 12px;
  color: #969FA8;
}

/* Default mobile size */
.mts-tariff-overuse-title svg {
  width: 21px;
  height: 21px;
}



@media (min-width: 1024px) {

  .mts-tariff-overuse-title svg {
    width: 35px;
    height: 35px;
  }
  /* Make the card title bigger */
  .mts-tariff-overuse-title span {
    font-size: 32px;
    font-style: normal;
    font-weight: 500;
    line-height: 36px; /
  }

  .mts-tariff-overuse-title{
    gap:12px;
  }

  .mts-tariff-overuse-description { 
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 28px; 
  }

  .mts-tariff-overuse-summary{
    font-size: 17px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px; 
  }

  .mts-tariff-overuse-total{
    font-size: 36px;
    font-style: normal;
    font-weight: 500;
    line-height: 40px; 
  }

  .mts-tariff-overuse-bar-column {
    width: 90px; /* adjust as needed, was maybe 40px */
    margin: 0 12px; /* optional: spacing between bars */
  }

  /* Optional: make bar stack slightly taller if needed */
  .mts-tariff-overuse-bar-stack {
    height: 140px; /* Was 120px, now bigger for desktop */
  }

  .mts-tariff-overuse-legend-item{
    font-size: 17px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px; 
  }

  .mts-tariff-overuse-bar-stack{
   width: 70px; 
  }

  .mts-tariff-overuse-date{
       font-size: 12px;
  }

  .mts-tariff-overuse-bar-over{
    font-size: 17px;
  }

  .mts-tariff-overuse-bar-plan{
     font-size: 17px;
  }

  .mts-tariff-overuse-card {
  padding: 24px;
  }


}h2 {
    font-weight: 500;
    font-size: 20px;
    line-height: 28px;
    margin-bottom: 10px;
    color: #1D2023;
}

.mts-bonus {
  position: relative;
  width: 100%;
  max-width: 1400px;
  margin: 0 auto;
}

.mts-bonus .blocked-notify {
  position: fixed;
  top: 7.5vh;
  left: 50%;
  z-index: 1000;
  display: flex;
  width: 350px;
  max-width: 100%;
  padding: 0 12px;
  flex-direction: column;
  align-items: center;
  border-radius: 16px;
  background: #1d2023;
  transform: translateX(-50%);
  animation: mts-bonus-notify-slide-down 0.7s ease-out;
}

.mts-bonus .blocked-notify--copied {
  position: fixed;
  top: calc(env(safe-area-inset-top, 0px) + 12px);
  z-index: 1300;
}

.mts-bonus .blocked-notify__content {
  display: flex;
  width: 100%;
  align-items: center;
  gap: 12px;
  padding: 12px 0;
}

.mts-bonus .blocked-notify__icon {
  flex-shrink: 0;
  width: 18px;
  height: 18px;
}

.mts-bonus .blocked-notify__icon svg {
  display: block;
  width: 18px;
  height: 18px;
}

.mts-bonus .blocked-notify__text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.mts-bonus .blocked-notify__title,
.mts-bonus .blocked-notify__subtitle {
  color: #fafafa;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Compact", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 17px;
  font-style: normal;
  line-height: 24px;
}

.mts-bonus .blocked-notify__title {
  font-weight: 500;
}

.mts-bonus .blocked-notify__subtitle {
  font-weight: 400;
}

.mts-bonus__top {
  display: flex;
  flex-direction: column;
  gap: 0;
  margin-bottom: 12px;
}

.mts-bonus__top.mts-bonus__top--withoutSlider {
  display: block;
}

.mts-bonus__topSlider,
.mts-bonus .welcome-section {
  min-width: 0;
}

.mts-bonus .welcome-section {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-top: -32px;
  padding: 24px 20px;
  border-radius: 32px;
  background: #fff;
  z-index: 2;
}

.mts-bonus .welcome-section.welcome-section--noSlider {
  margin-top: 0;
}

.mts-bonus .welcome-heading {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  align-self: stretch;
}

.mts-bonus .welcome-title {
  margin: 0;
  color: #1d2023;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Wide", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 24px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
}

.mts-bonus .welcome-title-name {
  color: #0048aa;
}

.mts-bonus .welcome-subtitle {
  margin: 0;
  color: #626c77;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Compact", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 17px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
}

.mts-bonus .welcome-tabs {
  position: relative;
  display: flex;
  width: 100%;
  padding: 4px;
  border-radius: 16px;
  background: #f2f3f7;
  overflow: hidden;
}

.mts-bonus .welcome-tabs::before {
  content: '';
  position: absolute;
  top: 4px;
  left: 4px;
  width: calc((100% - 8px) / 2);
  height: calc(100% - 8px);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.08), 0 4px 16px 0 rgba(0, 0, 0, 0.08);
  transform: translateX(0);
  transition: transform 0.28s ease;
  pointer-events: none;
}

.mts-bonus .welcome-tabs.is-partners::before {
  transform: translateX(100%);
}

.mts-bonus .welcome-tabs.is-mts::before {
  transform: translateX(0);
}

.mts-bonus .welcome-tab {
  position: relative;
  z-index: 1;
  width: 50%;
  border: none;
  background: transparent;
  color: #1d2023;
  text-align: center;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Wide", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 10px;
  font-style: normal;
  font-weight: 600;
  line-height: 12px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  padding: 12px 10px;
  border-radius: 12px;
  cursor: pointer;
}

.mts-bonus .welcome-tab.active {
  background: transparent;
}

.mts-bonus-slider {
  position: relative;
  width: 100%;
  height: 330px;
  overflow: hidden;
  background: #d9dce4;
}

.mts-bonus-slider__slides {
  position: relative;
  width: 100%;
  height: 100%;
}

.mts-bonus-slider__slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 0.3s ease;
}

.mts-bonus-slider__slide--active {
  opacity: 1;
}

.mts-bonus-slider__image {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
}

.mts-bonus-slider__content {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  gap: 16px;
  height: 100%;
  padding: 20px 20px 45px;
}

.mts-bonus-slider__title {
  margin: 0;
  color: #fafafa;
  text-align: center;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Wide", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
}

.mts-bonus-slider__description {
  margin: 0;
  color: #fafafa;
  text-align: center;
}

.mts-bonus .mts-bonus-slider__button.mts-button {
  width: fit-content !important;
  min-width: 120px;
  height: 32px;
  padding: 10px 12px;
  border-radius: 12px;
}

.mts-bonus-slider__progress {
  position: absolute;
  top: 12px;
  right: 12px;
  left: 12px;
  z-index: 3;
  display: flex;
  gap: 5px;
}

.mts-bonus-slider__progressItem {
  flex: 1;
  height: 5px;
  padding: 0;
  border: none;
  border-radius: 2px;
  background: rgba(255, 255, 255, 0.3);
  overflow: hidden;
  cursor: pointer;
}

.mts-bonus-slider__progressBar {
  display: block;
  width: 0;
  height: 100%;
  background: #fff;
  transition: width 0.1s linear;
}

.mts-bonus-slider__desktopBottom {
  display: none;
}

.mts-bonus .floating-navigation {
  position: static;
  display: flex;
  justify-content: space-around;
  margin-bottom: 12px;
  gap: 16px;
  margin-bottom: 12px;
  border-radius: 32px;
  padding: 0 20px;
}

.mts-bonus .floating-navigation-sticky {
  position: fixed;
  top: 72px;
  left: 50%;
  z-index: 30;
  width: min(100%, 1180px);
  padding: 12px 20px;
  border-radius: 0 0 32px 32px;
  background: #fff;
  box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.08), 0 4px 16px 0 rgba(0, 0, 0, 0.08);
  transform: translate(-50%, -16px);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.24s ease, transform 0.24s ease;
}

.mts-bonus .floating-navigation-sticky--visible {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translate(-50%, 0);
}

.mts-bonus .floating-navigation--sticky {
  margin-bottom: 0;
  justify-content: space-between;
  align-items: center;
  border-radius: 0;
}

.mts-bonus .floating-navigation--sticky .floating-nav-item {
  width: auto;
  height: auto;
  border-radius: 0;
  background: transparent;
  gap: 4px;
  flex: 1 0 0;
}

.mts-bonus .floating-navigation--sticky .floating-nav-item-punkt {
  background: #f2f3f7;
}

.mts-bonus .floating-nav-item {
  width: 70px;
  height: 70px;
  padding: 0;
  border: none;
  background: #ffffff00;
  border-radius: 16px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  cursor: pointer;
}

.mts-bonus .floating-nav-item-punkt {
  display: flex;
  width: 44px;
  height: 44px;
  padding: 10px;
  justify-content: center;
  align-items: center;
  border-radius: 16px;
  background: #fff;
}

.mts-bonus .floating-nav-item span {
  color: #1D2023;
  text-align: center;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Compact", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 16px;
  display: flex;
  padding: 2px;
  justify-content: center;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mts-bonus .floating-nav-item-icon {
  width: 24px;
  height: 24px;
}

.mts-bonus .floating-nav-item.active .floating-nav-item-punkt,
.mts-bonus .floating-nav-item-punkt.active {
  background: #000 !important;
}

.mts-bonus .floating-nav-item.active .floating-nav-item-icon,
.mts-bonus .floating-nav-item-punkt.active .floating-nav-item-icon {
  filter: brightness(0) invert(1);
}

.mts-bonus__sections {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.mts-bonus .section-anchor {
  position: relative;
  margin-bottom: 0;
  padding: 34px 20px 24px 20px;
  border-radius: 32px;
  background: #fff;
  scroll-margin-top: 150px;
}

.mts-bonus .section-anchor--voicetech {
  background: linear-gradient(
    180deg,
    rgba(135, 143, 181, 0.6) 0%,
    rgba(135, 143, 181, 0.2) 48.03%,
    rgba(135, 143, 181, 0) 89.17%
  );
  padding: 32px 0 0 0;
}

.mts-bonus .section-anchor--game {
  background: transparent;
}

.mts-bonus .cube-head-section,
.mts-bonus .section_bonus_block {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 20px;
}

.mts-bonus .cube-badge {
  display: inline-flex;
  padding: 2px 4px;
  justify-content: center;
  align-items: center;
  border-radius: 6px;
  background: #007cff;
}

.mts-bonus #cube-badge-number {
  color: #fff;
  text-align: center;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Compact", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
}

.mts-bonus .section-header {
  margin: 0 0 20px;
  color: #1d2023;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Compact", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
}

.mts-bonus .section-header--game {
  font-family: "MTS Wide", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
  text-align: center;
}

.mts-bonus .section-description {
  margin: 0 0 20px;
  color: #626c77;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Compact", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 17px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
}

.mts-bonus .voicetech-img {
  display: block;
  width: 280px;
  max-width: 100%;
  margin: 0 auto 16px;
}

.mts-bonus .section-description.voicetech {
  color: #fafafa;
  text-align: center;
  padding: 0 20px;
}

.mts-bonus .cards-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.mts-bonus .voicetech-cards-shell {
  width: 100%;
}

.mts-bonus--voicetech-only .section-anchor--voicetech {
  border-radius: 0;
  background: linear-gradient(169deg, #555964 3.25%, #c9d0e2 15.57%, #a1a8ba 26.44%, #727c96 39.15%, #fff 83.68%);
}

.mts-bonus--voicetech-only .card:not(.GAME) .card-image::before {
  background: linear-gradient(297deg, #b8bdc7 -16.63%, #e5ebf7 100%);
}

.mts-bonus--voicetech-only .badge-text:nth-child(1) {
  background: #d01b1b;
}

.mts-bonus .voicetech-empty-state {
  display: flex;
  min-height: 220px;
  width: 100%;
  padding: 20px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
}

.mts-bonus .voicetech-empty-state img {
  width: 90px;
  height: 90px;
  object-fit: contain;
}

.mts-bonus .voicetech-empty-state p {
  margin: 0;
  color: #626c77;
  text-align: center;
  font-feature-settings: 'liga' off, 'clig' off;
  font-style: normal;
  line-height: 20px;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  font-family: "MTS Wide";
  line-height: 24px;
}

.mts-bonus .cards-game {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.mts-bonus .card {
  position: relative;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-radius: 20px;
  background: transparent;
}

.mts-bonus .card--clickable {
  cursor: pointer;
  overflow: visible;
}

.mts-bonus .card-main {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.08), 0 4px 16px 0 rgba(0, 0, 0, 0.08);
}

.mts-bonus .card-main--adultGate {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
}

.mts-bonus .bonus-adult-gate {
  position: absolute;
  inset: 0;
  z-index: 10;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  padding: 12px;
  border: 8px solid #fff;
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.5);
  backdrop-filter: blur(30px);
  -webkit-backdrop-filter: blur(30px);
}

.mts-bonus .bonus-adult-gate__content {
  display: flex;
  flex: 1;
  width: 100%;
  flex-direction: column;
  justify-content: center;
  gap: 16px;
}

.mts-bonus .bonus-adult-gate__copy {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  align-self: stretch;
}

.mts-bonus .bonus-adult-gate__copy span {
  color: #1d2023;
  text-align: center;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Text", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
}

.mts-bonus .bonus-adult-gate__actions {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  align-self: stretch;
}

.mts-bonus .card--withOffer {
  padding-bottom: 8px;
  overflow: visible;
  background: #f2f3f7;
}

.mts-bonus .card--clickable .card-main {
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.mts-bonus .card--clickable:hover .card-main {
  transform: translateY(-2px);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

.mts-bonus .card-image {
  position: relative;
  height: 140px;
  margin: 4px;
  overflow: hidden;
  border-radius: 16px;
  background-size: contain;
  background-position: bottom;
  background-repeat: no-repeat;
}

.mts-bonus .card:not(.GAME) .card-image::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(237deg, #fff9fe 2.27%, #ecefff 97.73%);
  z-index: 1;
}

.mts-bonus .card:not(.GAME) .card-image::after {
  content: '';
  position: absolute;
  inset: 0;
  background: inherit;
  z-index: 2;
}

.mts-bonus .card.CUBE .card-image,
.mts-bonus .card.OFFER .card-image,
.mts-bonus .card.VOICETECH .card-image,
.mts-bonus .card.URL .card-image,
.mts-bonus .card.TARIFF .card-image {
  background-size: contain;
}

.mts-bonus .card.GAME .card-main {
  flex-direction: row;
  min-height: 200px;
}

.mts-bonus .card.GAME .card-image {
  width: 45%;
  height: auto;
  margin: 0;
  border-radius: 20px 0 0 20px;
  background-size: cover;
  background-position: center;
  flex-shrink: 0;
}

.mts-bonus .card-content {
  position: relative;
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: 12px;
  border-radius: 20px;
  background: #fff;
  min-height: 140px;
}

.mts-bonus .card--withOffer .card-content::before {
  content: '';
  position: absolute;
  bottom: -8px;
  left: 0;
  width: 100%;
  height: 20px;
  background: #f2f3f7;
  z-index: -1;
}

.mts-bonus .card-title {
  margin-bottom: 16px;
  color: #1d2023;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Compact", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 17px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px;
}

@media (max-width: 899px) {
  .mts-bonus .bonus-adult-gate__copy span {
    font-size: 17px;
    line-height: 20px;
  }

  .mts-bonus--voicetech-only .cards-grid {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }

  .mts-bonus--voicetech-only .card-title {
    font-size: 20px;
    line-height: 24px;
  }

  .mts-bonus--voicetech-only .card-tag {
    padding: 4px 6px;
    font-size: 14px;
    line-height: 20px;
  }

  .mts-bonus--voicetech-only .offer {
    padding: 8px 8px 0;
    font-size: 14px;
    line-height: 20px;
  }

  .mts-bonus--voicetech-only .current-price {
    font-size: 17px;
    line-height: 24px;
  }

  .mts-bonus--voicetech-only .old-price {
    font-size: 14px;
    line-height: 20px;
  }

  .mts-bonus--voicetech-only .badge-text {
    display: inline-block;
    width: fit-content;
    min-width: auto;
    padding: 2px 4px;
    text-align: center;
    white-space: nowrap;
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "MTS Compact", -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px;
    border-radius: 8px;
  }

  .mts-bonus--voicetech-only .badges {
    left: 8px;
  }

  .mts-bonus--voicetech-only .card-copy {
    gap: 12px;
  }

  .mts-bonus--voicetech-only .info-btn {
    right: 6px;
  }
}

.mts-bonus .card-copy {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  min-height: 88px;
  align-self: stretch;
}

.mts-bonus .card-title-slot {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.mts-bonus .card-copy .card-title {
  margin-bottom: 0;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mts-bonus .card-tags-slot {
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 20px;
}

.mts-bonus .card-tags-slot--empty {
  visibility: hidden;
  pointer-events: none;
}

.mts-bonus .card-tags {
  display: flex;
  align-items: center;
  gap: 4px;
  width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}

.mts-bonus .card-tags::-webkit-scrollbar {
  display: none;
}

.mts-bonus .card-tag {
  display: flex;
  height: 20px;
  padding: 2px 4px;
  justify-content: center;
  align-items: center;
  gap: 2px;
  border-radius: 6px;
  background: #f2f3f7;
  color: #626c77;
  text-align: center;
  white-space: nowrap;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Compact", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  flex: 0 0 auto;
}

.mts-bonus .card-bottom-content {
  margin-top: auto;
}

.mts-bonus .price-slot {
  display: flex;
  align-items: flex-end;
  min-height: 44px;
}

.mts-bonus .price-slot--empty {
  width: 100%;
}

.mts-bonus .price-container {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 20px;
  padding: 16px 0px 8px 0px;
}

.mts-bonus .price-container--placeholder {
  visibility: hidden;
}

.mts-bonus .price-slot--epStatus {
  align-items: center;
  min-height: 56px;
}

.mts-bonus .ep-order-progress {
  display: flex;
  align-items: center;
  width: 100%;
}

.mts-bonus .ep-order-progress__step {
  display: flex;
  padding: 8px;
  height: 28px;
  justify-content: center;
  align-items: center;
  border-radius: 10px;
  background: #f2f3f7;
  color: #8d969f;
  transition: background-color 0.25s ease, color 0.25s ease, transform 0.25s ease;
}

.mts-bonus .ep-order-progress__step.is-active {
  background: #71afff;
  color: #fafafa;
}

.mts-bonus .ep-order-progress__step svg {
  display: block;
}

.mts-bonus .ep-order-progress__connector {
  flex: 1;
  height: 4px;
  background: #f2f3f7;
  transition: background-color 0.25s ease;
}

.mts-bonus .ep-order-progress__connector.is-active {
  background: #71afff;
}

.mts-bonus .ep-order-progress--in_progress .ep-order-progress__step:nth-child(3).is-active {
  animation: mts-bonus-progress-pulse 1.4s ease-in-out infinite;
}

@keyframes mts-bonus-progress-pulse {
  0%,
  100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.05);
  }
}

.mts-bonus .current-price {
  color: #1d2023;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Compact", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px;
}

.mts-bonus .old-price {
  color: #969fa8;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Compact", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 16px;
  text-decoration: line-through;
  text-decoration-color: #ff0000;
}

.mts-bonus .offer-container {
  padding: 0 8px 0;
}

.mts-bonus .offer {
  margin: 0;
  padding: 6px 8px 0;
  color: #626c77;
  text-align: center;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Compact", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 16px;
}

.mts-bonus .badges {
  position: absolute;
  top: 14px;
  left: 4px;
  z-index: 3;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.mts-bonus .badge-text {
  display: inline-block;
  width: fit-content;
  min-width: auto;
  padding: 1px 4px;
  text-align: center;
  white-space: nowrap;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Compact", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 13px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  border-radius: 6px;
}

.mts-bonus .badge-text:nth-child(1) {
  background: #26cd58;
  color: #fff;
}

.mts-bonus .badge-text:nth-child(2) {
  background: #388eff;
  color: #fff;
}

.mts-bonus .info-btn {
  position: absolute;
  top: 6px;
  right: 4px;
  z-index: 3;
  display: flex;
  width: 32px;
  height: 32px;
  padding: 4px;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  aspect-ratio: 1 / 1;
  border: 0.5px solid rgba(188, 195, 208, 0.5);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.08), 0 4px 16px 0 rgba(0, 0, 0, 0.08);
  cursor: pointer;
}

.mts-bonus .info-btn svg {
  width: 24px;
  height: 24px;
  display: block;
}

.mts-bonus .card-description {
  color: #626c77;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Text", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
  flex-grow: 1;
}

.mts-bonus .card.GAME .card-content {
  width: 55%;
  padding: 10px;
  padding: 8px 12px;
}

.mts-bonus .bonus-card__buttonWrap,
.mts-bonus .bonus-card__buttonWrap .mts-button {
  width: 100%;
}

.mts-bonus .buy-btn.mts-button {
  height: 32px !important;
  padding: 0 8px !important;
  border-radius: 12px !important;
  margin-bottom: 0;
}

.mts-bonus .buy-btn.mts-button .mts-button__text,
.mts-bonus .buy-btn.mts-button .mts-button__content {
  font-size: 10px;
  line-height: 12px;
}

.mts-bonus .buy-btn--epCompleted.mts-button.mts-button--disabled,
.mts-bonus .buy-btn--epCompleted.mts-button.mts-button--disabled:hover {
  background: #eaf1ff !important;
}

.mts-bonus .buy-btn--epCompleted.mts-button.mts-button--disabled .mts-button__text {
  color: #1286d9 !important;
}

.mts-bonus .card.GAME .price-container,
.mts-bonus .card.GAME .offer-container {
  display: none;
}

.mts-bonus .bonus-details-modal__overlay {
  position: fixed;
  inset: 0;
  z-index: 1010;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 20px;
  background: rgba(0, 0, 0, 0.6);
}

.mts-bonus .bonus-details-modal__overlay::after {
  content: '';
  position: fixed;
  right: 0;
  bottom: 0;
  left: 0;
  height: 0;
  background: #fff;
  pointer-events: none;
}

.mts-bonus .bonus-details-modal__sheet {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 580px;
  max-height: min(80dvh, 860px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-radius: 32px;
  background: #f2f3f7;
}

@media (min-width: 581px) {
  .mts-bonus .bonus-details-modal__overlay {
    animation: mts-bonus-overlay-fade-in 0.22s ease;
  }

  .mts-bonus .bonus-details-modal__sheet {
    animation: mts-bonus-sheet-fade-in 0.24s ease;
  }
}

.mts-bonus .bonus-details-modal__hero {
  position: relative;
  flex-shrink: 0;
  min-height: 168px;
  overflow: hidden;
  background-position: center top;
  background-repeat: no-repeat;
  background-size: contain;
}

.mts-bonus .bonus-details-modal__hero::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background: #f2f3f7;
}

.mts-bonus .bonus-details-modal__heroHeader {
  position: absolute;
  inset: 0 0 auto;
  display: flex;
  justify-content: flex-end;
  padding: 20px;
}

.mts-bonus .bonus-details-modal__close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  padding: 0;
  border: 0.5px solid rgba(188, 195, 208, 0.5);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.08), 0 4px 16px 0 rgba(0, 0, 0, 0.08);
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  text-align: center;
  font-size: 0;
  line-height: 1;
}

.mts-bonus .bonus-details-modal__close svg {
  width: 12px;
  height: 12px;
  display: block;
  flex: 0 0 12px;
  pointer-events: none;
}

.mts-bonus .bonus-details-modal__panel {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: 12px;
  flex: 1 1 auto;
  min-height: 0;
  margin-top: -44px;
  padding: 0;
}

.mts-bonus .bonus-details-modal__scroll {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  flex: 1 1 auto;
  min-height: 0;
  max-height: calc(80dvh - 244px);
  overflow-y: auto;
  background: #f2f3f7;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

.mts-bonus .bonus-details-modal__scroll > * {
  flex-shrink: 0;
}

.mts-bonus .bonus-details-modal__intro,
.mts-bonus .bonus-details-modal__section,
.mts-bonus .bonus-details-modal__faq,
.mts-bonus .bonus-details-modal__footer {
  width: 100%;
  border-radius: 32px;
  background: #fff;
}

.mts-bonus .bonus-details-modal__intro {
  overflow: hidden;
}

.mts-bonus .bonus-details-modal__introMain {
  display: flex;
  width: 100%;
  box-sizing: border-box;
  padding: 24px 20px 12px;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
}

.mts-bonus .bonus-details-modal__title {
  margin: 0;
  width: 100%;
  color: #1d2023;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Wide", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
}

.mts-bonus .bonus-details-modal__description {
  width: 100%;
  color: #626c77;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Text", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
}

.mts-bonus .bonus-details-modal__tags {
  display: flex;
  padding: 0 20px 24px;
  align-items: flex-start;
  align-content: flex-start;
  gap: 8px;
  flex-wrap: wrap;
}

.mts-bonus .bonus-details-modal__tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 2px 6px;
  border-radius: 8px;
  background: #f2f3f7;
  color: #626c77;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Compact", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px;
}

.mts-bonus .bonus-details-modal__section {
  display: flex;
  padding: 24px 20px;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
}

.mts-bonus .bonus-details-modal__sectionTitle {
  color: #1d2023;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Text", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
}

.mts-bonus .bonus-details-modal__advantages {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  width: 100%;
}

.mts-bonus .bonus-details-modal__advantage {
  display: flex;
  align-items: center;
  gap: 12px;
}

.mts-bonus .bonus-details-modal__advantageCheck {
  display: flex;
  width: 40px;
  height: 40px;
  padding: 10px;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  border-radius: 12px;
  background: #f2f3f7;
}

.mts-bonus .bonus-details-modal__advantageCheck svg {
  width: 24px;
  height: 24px;
}

.mts-bonus .bonus-details-modal__advantageText {
  color: #1d2023;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Text", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
}

.mts-bonus .bonus-details-modal__faq {
  overflow: visible;
  padding: 24px 0 20px;
}

.mts-bonus .bonus-details-modal__faqHeader {
  width: 100%;
  padding: 0 20px;
  border: none;
  background: #fff;
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  color: #1d2023;
  text-align: left;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Text", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
}

.mts-bonus .bonus-details-modal__faqHeader svg,
.mts-bonus .bonus-details-modal__question svg {
  flex-shrink: 0;
  transition: transform 0.3s ease;
}

.mts-bonus .bonus-details-modal__faqHeader.active svg,
.mts-bonus .bonus-details-modal__question.active svg {
  transform: rotate(180deg);
}

.mts-bonus .bonus-details-modal__faqContent {
  display: none;
}

.mts-bonus .bonus-details-modal__faqContent.open {
  display: block;
  padding-top: 12px;
}

.mts-bonus .bonus-details-modal__faqItem {
  margin: 0 20px;
  border-bottom: 1px solid rgba(188, 195, 208, 0.5);
}

.mts-bonus .bonus-details-modal__faqItem:last-child {
  border-bottom: none;
}

.mts-bonus .bonus-details-modal__question {
  width: 100%;
  padding: 16px 0;
  border: none;
  background: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  color: #1d2023;
  text-align: left;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Text", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 17px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
}

.mts-bonus .bonus-details-modal__answer {
  color: #626c77;
  font-family: "MTS Text", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 14px;
  line-height: 20px;
}

.mts-bonus .bonus-details-modal__answer.open {
  padding: 0 0 16px;
}

.mts-bonus .bonus-details-modal__answer ul {
  padding-left: 20px;
}

.mts-bonus .bonus-details-modal__answer p {
  margin: 0 0 10px;
}

.mts-bonus .bonus-details-modal__footer {
  flex-shrink: 0;
  padding: 16px 20px 20px;
  border-radius: 32px 32px 0 0;
  box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.05);
}

.mts-bonus .bonus-details-modal__priceRow {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
}

.mts-bonus .bonus-details-modal__currentPrice {
  color: #1d2023;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Text", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
}

.mts-bonus .bonus-details-modal__oldPrice {
  color: #6f6f6f;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Text", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  text-decoration: line-through;
  text-decoration-color: #ff0000;
}

.mts-bonus .bonus-details-modal__button.mts-button {
  height: 44px !important;
  margin-bottom: 8px;
  border-radius: 16px !important;
}

.mts-bonus .bonus-details-modal__offer {
  color: #626c77;
  text-align: center;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Text", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
}

.mts-bonus .bonus-state {
  padding: 20px;
  border-radius: 32px;
  background: #fff;
  color: #626c77;
}

.mts-bonus .bonus-state--error {
  color: #626c77;
  text-align: center;
}

html.bonus-modal-open,
body.bonus-modal-open {
  background: #fff;
}

.mts-bonus .bonus-loading-section {
  padding-top: 24px;
}

.mts-bonus .bonus-loading-card .card-main {
  box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.08), 0 4px 16px 0 rgba(0, 0, 0, 0.08);
}

.mts-bonus .bonus-loading-card .card-image {
  height: 140px;
}

.mts-bonus .bonus-loading-card .card-image::before,
.mts-bonus .bonus-loading-card .card-image::after {
  display: none;
}

.mts-bonus .bonus-loading-shimmer {
  position: relative;
  overflow: hidden;
  background: #e6e8ee;
}

.mts-bonus .bonus-loading-shimmer::after {
  content: '';
  position: absolute;
  inset: 0;
  transform: translateX(-100%);
  background: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.55) 50%,
    rgba(255, 255, 255, 0) 100%
  );
  animation: bonus-skeleton-shimmer 1.2s ease-in-out infinite;
}

.mts-bonus .bonus-loading-image {
  border-radius: 16px;
}

.mts-bonus .bonus-loading-title {
  width: 78%;
  height: 20px;
  margin-bottom: 16px;
  border-radius: 8px;
}

.mts-bonus .bonus-loading-price {
  width: 72px;
  height: 20px;
  border-radius: 8px;
}

.mts-bonus .bonus-loading-price--small {
  width: 54px;
  height: 16px;
}

.mts-bonus .bonus-loading-button {
  width: 100%;
  height: 32px;
  border-radius: 12px;
}

@keyframes bonus-skeleton-shimmer {
  100% {
    transform: translateX(100%);
  }
}

.mts-bonus .timer-block {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 8px 4px 6px;
  border-radius: 12px;
  border: 1px solid rgba(188, 195, 208, 0.5);
  background: #f2f3f7;
}

.mts-bonus .timer-icon {
  width: 16px;
  height: 16px;
}

.mts-bonus .timer-time {
  color: #1d2023;
  text-align: center;
  font-family: "MTS Text", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 17px;
  font-weight: 500;
  line-height: 24px;
}

.mts-bonus .bonus-partners__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 20px;
  padding: 20px;
}

.mts-bonus .bonus-partner {
  display: flex;
  flex-direction: column;
  max-width: 450px;
  overflow: hidden;
  border-radius: 32px;
  background: #fff;
  box-shadow: 0 0 16px 0 rgba(0, 0, 0, 0.08), 0 4px 16px 0 rgba(0, 0, 0, 0.08);
}

.mts-bonus .bonus-partner__hero {
  min-height: 128px;
  background-size: cover;
  background-position: center;
}

.mts-bonus .bonus-partner__heroInner {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 64px 24px 24px;
}

.mts-bonus .bonus-partner__heroIcon {
  width: 40px;
  height: 40px;
}

.mts-bonus .bonus-partner__heroTitle {
  color: #fff;
  font-family: "MTS Text", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 20px;
  font-weight: 500;
  line-height: 24px;
}

.mts-bonus .bonus-partner__body {
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: flex-start;
  align-self: stretch;
  gap: 8px;
  padding: 20px 20px 12px;
}

.mts-bonus .bonus-partner__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-bottom: 12px;
}

.mts-bonus .bonus-partner__badge {
    display: inline-flex;
    align-items: center;
    border-radius: 8px;
    background: #f2f3f7;
    color: #1d2023;
    font-family: "MTS Compact", -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    padding: 2px 6px;
    justify-content: center;
    align-items: center;
    gap: 4px;
    height: 24px;
}

.mts-bonus .bonus-partner__badge img {
  width: auto;
  height: 14px;
}

.mts-bonus .bonus-partner__badge--new {
  background: #007cff;
  color: #fafafa;
}

.mts-bonus .bonus-partner__title {
  margin: 0;
  color: #1d2023;
  font-family: "MTS Compact";
  font-size: 17px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px;
}

.mts-bonus .bonus-partner__copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  align-self: stretch;
}

.mts-bonus .bonus-partner__description {
  margin: 0;
  align-self: stretch;
  color: #626c77;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Text", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
}

.mts-bonus .bonus-partner__description p {
  margin: 0;
}

.mts-bonus .bonus-partner__description * {
  color: inherit;
  font-family: inherit;
  font-size: inherit;
  font-style: inherit;
  font-weight: inherit;
  line-height: inherit;
}

.mts-bonus .bonus-partner__offers {
  display: flex;
  flex-direction: column;
  gap: 0;
  align-self: stretch;
  width: 100%;
}

.mts-bonus .bonus-partner__offerBlock {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0;
}

.mts-bonus .bonus-partner__offerBody {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
  align-self: stretch;
}

.mts-bonus .bonus-partner__info {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  align-self: stretch;
}

.mts-bonus .bonus-partner__offerFooter {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 12px;
  width: 100%;
}

.mts-bonus .bonus-partner__divider {
  height: 1px;
  align-self: stretch;
  margin: 24px;
  background: rgba(188, 195, 208, 0.5);
}

.mts-bonus .bonus-partner__promoDescription,
.mts-bonus .bonus-partner__date {
  color: #626c77;
  font-family: "MTS Text", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 12px;
  line-height: 16px;
  align-self: center;
}

.mts-bonus .bonus-partner__details,
.mts-bonus .bonus-partner__promoCopy,
.mts-bonus .bonus-partner__getQR,
.mts-bonus .bonus-partner__resultLink {
  border: none;
  border-radius: 12px;
  background: #F2F3F7;
  padding: 10px;
  color: #1D2023;
  font-family: "MTS Text", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  cursor: pointer;
  text-decoration: none;
  display: flex;
  align-items: center;
}

.mts-bonus .bonus-partner__details {
  color: #626C77;
}

.mts-bonus .bonus-partner__details,
.mts-bonus .bonus-partner__resultLink {
  width: 100%;
}

.mts-bonus .bonus-partner__promoCode {
  border-radius: 16px;
  background: #f2f3f7;
  padding: 12px 14px;
  color: #1d2023;
  font-family: "MTS Wide", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 14px;
  line-height: 20px;
  border: 1.5px solid rgba(188, 195, 208, 0.50);
}

.mts-bonus .bonus-partner__promoRow {
  margin-bottom: 0px;
}

.mts-bonus .bonus-partner__promoActions {
  display: flex;
  gap: 8px;
}

.mts-bonus .bonus-partner__promoCopy,
.mts-bonus .bonus-partner__getQR {
  flex: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  text-transform: uppercase;
  letter-spacing: 0.6px;
  font-family: "MTS Wide", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
  height: 44px;
  border-radius: 16px;
}

.mts-bonus .bonus-partner__getQR {
  background: #f2f3f7;
  color: #1d2023;
}

.mts-bonus .bonus-partner__promoCopy svg {
  width: 16px;
  height: 17px;
}

.mts-bonus .bonus-partner__getQR svg {
  width: 24px;
  height: 24px;
}

.mts-bonus .bonus-partner-qr__overlay {
  position: fixed;
  inset: 0;
  z-index: 1030;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  background: rgba(0, 0, 0, 0.6);
  animation: mts-bonus-overlay-fade-in 0.22s ease;
}

.mts-bonus .bonus-partner-qr__sheet {
  width: 100%;
  max-width: 600px;
  min-height: min(50dvh, 380px);
  border-radius: 32px 32px 0 0;
  background: #fff;
  animation: mts-bonus-sheet-fade-in 0.24s ease;
}

.mts-bonus .bonus-partner-qr__content {
  display: flex;
  padding: 20px;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  gap: 32px;
}

.mts-bonus .bonus-partner-qr__header {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 12px;
  align-self: stretch;
}

.mts-bonus .bonus-partner-qr__title {
  margin: 0;
  flex: 1;
  color: #1d2023;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Wide", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
}

.mts-bonus .bonus-partner-qr__close {
  display: flex;
  width: 32px;
  height: 32px;
  padding: 4px;
  justify-content: center;
  align-items: center;
  border-radius: 12px;
  border: 0.5px solid rgba(188, 195, 208, 0.5);
  background: #fff;
  box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.08), 0 4px 16px 0 rgba(0, 0, 0, 0.08);
  cursor: pointer;
}

.mts-bonus .bonus-partner-qr__code {
  display: flex;
  width: 100%;
  justify-content: center;
  align-items: center;
}

.mts-bonus .bonus-partner-qr__code img {
  width: 220px;
  height: 220px;
  object-fit: contain;
}

.mts-bonus .bonus-partner-qr__code span {
  color: #626c77;
  font-family: "MTS Text", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 14px;
  line-height: 20px;
}

@media (min-width: 900px) {
  .mts-bonus .bonus-partner-qr__overlay {
    align-items: center;
    padding: 24px;
  }

  .mts-bonus .bonus-partner-qr__sheet {
    max-width: 480px;
    border-radius: 32px;
  }
}

.mts-bonus .bonus-partner__accepted {
  display: inline-flex;
  align-self: flex-start;
  padding: 4px 8px;
  border-radius: 12px;
  background: #e8faeb;
  color: #027722;
  margin-bottom: 12px;
}

.mts-bonus .bonus-partner-modal__overlay {
  position: fixed;
  inset: 0;
  z-index: 1020;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  background: rgba(0, 0, 0, 0.6);
  animation: mts-bonus-overlay-fade-in 0.22s ease;
}

.mts-bonus .bonus-partner-modal__sheet {
  position: relative;
  width: 100%;
  max-width: 600px;
  max-height: min(84dvh, 840px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-radius: 32px 32px 0px 0px;
  background: #f2f3f7;
  animation: mts-bonus-sheet-fade-in 0.24s ease;
}

.mts-bonus .bonus-partner-modal__close {
  position: absolute;
  top: 16px;
  right: 16px;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  padding: 0;
  border: 0.5px solid rgba(188, 195, 208, 0.5);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.08), 0 4px 16px 0 rgba(0, 0, 0, 0.08);
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
}

.mts-bonus .bonus-partner-modal__close svg {
  display: block;
  width: 12px;
  height: 12px;
}

.mts-bonus .bonus-partner-modal__scroll {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 72px 0 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.mts-bonus .bonus-partner-modal__intro,
.mts-bonus .bonus-partner-modal__faq {
  margin: 0 12px;
  border-radius: 32px;
  background: #fff;
}

.mts-bonus .bonus-partner-modal__intro {
  padding: 24px 20px;
}

.mts-bonus .bonus-partner-modal__title {
  margin: 0;
  color: #1d2023;
  font-family: "MTS Wide", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 20px;
  font-weight: 500;
  line-height: 24px;
}

.mts-bonus .bonus-partner-modal__description {
  margin-top: 8px;
  color: #626c77;
  font-family: "MTS Text", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 14px;
  line-height: 20px;
}

.mts-bonus .bonus-partner-modal__linkWrap {
  margin-top: 8px;
}

.mts-bonus .bonus-partner__promoBlock{
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-self: stretch;
}

.mts-bonus .bonus-partner-modal__link {
  color: #0070e5;
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: "MTS Text", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px;
  text-decoration: none;
}

.mts-bonus .bonus-partner-modal__link:hover {
  text-decoration: underline;
}

.mts-bonus .bonus-partner-modal__faq {
  padding: 8px 20px;
}

.mts-bonus .bonus-partner-modal__faqItem {
  border-bottom: 1px solid #f2f3f7;
}

.mts-bonus .bonus-partner-modal__faqItem:last-child {
  border-bottom: none;
}

.mts-bonus .bonus-partner-modal__question {
  position: relative;
  display: block;
  list-style: none;
  cursor: pointer;
  padding: 16px 28px 16px 0;
  color: #1d2023;
  font-family: "MTS Compact", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 17px;
  font-weight: 500;
  line-height: 24px;
}

.mts-bonus .bonus-partner-modal__question::-webkit-details-marker {
  display: none;
}

.mts-bonus .bonus-partner-modal__question::after {
  content: '';
  position: absolute;
  top: 50%;
  right: 0;
  width: 12px;
  height: 12px;
  border-right: 2px solid #8d969f;
  border-bottom: 2px solid #8d969f;
  transform: translateY(-65%) rotate(45deg);
  transition: transform 0.2s ease;
}

.mts-bonus .bonus-partner-modal__faqItem[open] .bonus-partner-modal__question::after {
  transform: translateY(-35%) rotate(-135deg);
}

.mts-bonus .bonus-partner-modal__answer {
  padding: 0 0 16px;
  color: #626c77;
  font-family: "MTS Text", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 14px;
  line-height: 20px;
}

.mts-bonus .bonus-partner-modal__footer {
  padding: 12px;
}

@media (min-width: 900px) {
  .mts-bonus {
    padding: 16px 20px 56px;
  }

  .mts-bonus__top {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
    gap: 12px;
    min-height: 280px;
  }

  .mts-bonus__top.mts-bonus__top--withoutSlider {
    display: block;
  }

  .mts-bonus__topSlider {
    order: 2;
  }

  .mts-bonus .welcome-section {
    order: 1;
    height: 100%;
    margin-top: 0;
    gap: 64px;
    padding: 32px;
  }

  .mts-bonus .welcome-title {
    margin: 0;
    color: #1d2023;
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "MTS Wide", -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 36px;
    font-style: normal;
    font-weight: 500;
    line-height: 40px;
  }

  .mts-bonus .welcome-heading {
    gap: 24px;
  }

  .mts-bonus-slider {
    height: 100%;
    border-radius: 32px;
  }

  .mts-bonus-slider__image {
    background-position-y: 0%;
  }

  .mts-bonus-slider__content {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 16px;
    height: 100px;
    padding: 32px 20px 40px;
    border-radius: 32px;
  }

  .mts-bonus-slider__title {
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: 28px;
    text-align: left;
  }

  .mts-bonus .mts-bonus-slider__button.mts-button {
    display: none;
  }

  .mts-bonus-slider__desktopBottom {
    position: absolute;
    right: 20px;
    bottom: 20px;
    left: 20px;
    z-index: 4;
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
  }

  .mts-bonus .mts-bonus-slider__desktopAction.mts-button {
    width: fit-content !important;
    min-width: 120px;
  }

  .mts-bonus-slider__desktopControls {
    display: flex;
    align-items: center;
    gap: 12px;
  }

  .mts-bonus-slider__desktopArrow {
    display: flex;
    padding: 10px;
    justify-content: center;
    align-items: center;
    border: none;
    border-radius: 16px;
    background: #f2f3f7;
    cursor: pointer;
  }

  .mts-bonus-slider__desktopArrow svg {
    width: 24px;
    height: 24px;
  }

  .mts-bonus .floating-navigation {
    position: sticky;
    top: 84px;
    z-index: 3;
    justify-content: center;
    padding: 8px 12px;
    background: transparent;
    box-shadow: none;
  }

  .mts-bonus .floating-navigation-sticky {
    display: none;
  }

  .mts-bonus .floating-nav-item {
    display: flex;
    width: auto;
    height: auto;
    padding: 4px 20px 4px 4px;
    flex-direction: row;
    gap: 8px;
    align-items: center;
    justify-content: flex-start;
    border-radius: 100px;
    background: #fff;
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.08), 0 4px 16px 0 rgba(0, 0, 0, 0.08);
  }

  .mts-bonus .floating-nav-item-punkt {
    display: flex;
    width: 48px;
    height: 48px;
    padding: 3px 4px;
    gap: 10px;
    flex-shrink: 0;
    aspect-ratio: 1 / 1;
    justify-content: center;
    align-items: center;
    border-radius: 100px;
    background: #f2f3f7;
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.08), 0 4px 16px 0 rgba(0, 0, 0, 0.08);
  }

  .mts-bonus .floating-nav-item-icon {
    display: block;
    margin: 0 auto;
  }

  .mts-bonus .floating-nav-item span {
    display: block;
    width: auto;
    color: #1d2023;
    text-align: center;
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "MTS Text", -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 17px;
    font-style: normal;
    font-weight: 500;
    line-height: 21px;
    align-content: center;
  }

  .mts-bonus .cards-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;
  }

  .mts-bonus .section-header {
    color: #1d2023;
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "MTS Wide", -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 32px;
    font-style: normal;
    font-weight: 500;
    line-height: 36px;
  }

  .mts-bonus .section-description {
    margin: 0 0 32px;
    font-family: "MTS Text", -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 28px;
  }

  .mts-bonus .cards-game {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
  }

  .mts-bonus .card.GAME .card-main {
    flex-direction: column;
    min-height: auto;
  }

  .mts-bonus .card.GAME .card-image {
    width: auto;
    height: 200px;
    margin: 8px;
    border-radius: 16px;
    background-size: cover;
    background-position: bottom;
  }

  .mts-bonus .card.GAME .card-image::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(237deg, #fff9fe 2.27%, #ecefff 97.73%);
    z-index: 1;
  }

  .mts-bonus .card.GAME .card-image::after {
    content: '';
    position: absolute;
    inset: 0;
    background: inherit;
    z-index: 2;
  }

  .mts-bonus .card.GAME .card-content {
    width: 100%;
    padding: 20px;
  }

  .mts-bonus .card.GAME .game-card-copy {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    align-self: stretch;
  }

  .mts-bonus .card.GAME .card-title {
    margin-bottom: 0;
    color: #1d2023;
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "MTS Text", -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
  }

  .mts-bonus .card.GAME .card-description {
    display: block;
    flex-grow: 0;
    color: #626c77;
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "MTS Text", -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 17px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
  }

  .mts-bonus .section-anchor {
    padding: 34px 20px 24px;
    background: transparent;
  }

  .mts-bonus .section-anchor--voicetech {
    background: linear-gradient(
      180deg,
      rgba(135, 143, 181, 0.6) 0%,
      rgba(135, 143, 181, 0.2) 48.03%,
      rgba(135, 143, 181, 0) 89.17%
    );
    padding: 34px 20px 24px 20px;
  }

  .mts-bonus .card--withOffer {
    background: #fff;
  }

  .mts-bonus .card--withOffer .card-content::before {
    background: #fff;
  }

  .mts-bonus .card-title {
    margin-bottom: 32px;
    font-family: "MTS Text", -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
  }

  .mts-bonus .card-copy {
    gap: 12px;
    min-height: 84px;
  }

  .mts-bonus .card-copy .card-title {
    margin-bottom: 0;
    -webkit-line-clamp: 2;
  }

  .mts-bonus .card-tags-slot {
    min-height: 24px;
  }

  .mts-bonus .card-tags {
    gap: 8px;
  }

  .mts-bonus .card-tag {
    padding: 2px 6px;
    gap: 4px;
    border-radius: 8px;
    font-family: "MTS Compact", -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px;
  }

  .mts-bonus .badge-text {
    padding: 2px 6px;
    border-radius: 8px;
    font-family: "MTS Compact", -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px;
  }

  .mts-bonus .current-price {
    font-family: "MTS Text", -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
  }

  .mts-bonus .old-price {
    font-family: "MTS Text", -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
  }

  .mts-bonus .offer {
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
  }

  .mts-bonus .timer-time {
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: 28px;
  }

  .mts-bonus .welcome-subtitle {
    font-family: "MTS Text", -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 28px;
  }

  .mts-bonus .welcome-tab {
    font-family: "MTS Wide", -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: 0.6px;
    text-transform: uppercase;
  }

  .mts-bonus .buy-btn.mts-button {
    height: 44px !important;
    border-radius: 16px !important;
  }

  .mts-bonus .buy-btn.mts-button .mts-button__content {
    min-height: 44px;
    height: 44px;
  }

  .mts-bonus .buy-btn.mts-button .mts-button__text,
  .mts-bonus .buy-btn.mts-button .mts-button__content {
    font-size: 12px;
    line-height: 16px;
  }

  .mts-bonus .info-btn {
    width: 44px;
    height: 44px;
    padding: 10px;
    border-radius: 16px;
  }

  .mts-bonus .card-image {
    margin: 8px;
  }

  .mts-bonus .card-content {
    padding: 20px;
    min-height: 200px;
  }

  .mts-bonus .cube-head-section,
  .mts-bonus .section_bonus_block {
    margin-bottom: 12px;
  }

  .mts-bonus .section-header--game {
    margin: 0 0 40px;
  }

  .mts-bonus .price-container {
    padding: 24px 0px 12px 0px;
  }

  .mts-bonus .price-slot {
    min-height: 60px;
  }

  .mts-bonus .voicetech-cards-shell {
    padding: 0;
    border-radius: 0;
    background: transparent;
  }

  .mts-bonus .bonus-partners__grid {
    align-items: stretch;
    grid-auto-rows: 1fr;
  }

  .mts-bonus .bonus-partner {
    max-width: none;
    height: 100%;
  }

  .mts-bonus .bonus-partner__body {
    height: 100%;
    gap: 24px;
  }

  .mts-bonus .bonus-partner__offerBody {
    gap: 24px;
  }

  .mts-bonus .bonus-partner__title {
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
  }

  .mts-bonus .bonus-partner__description {
    font-family: "MTS Text", -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 17px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
  }

  .mts-bonus .bonus-partner--single .bonus-partner__offers {
    flex: 1;
  }

  .mts-bonus .bonus-partner__promoDescription,
  .mts-bonus .bonus-partner__date {
    font-size: 14px;
    line-height: 20px;
  }

  .mts-bonus .bonus-partner--single .bonus-partner__offerBlock,
  .mts-bonus .bonus-partner--single .bonus-partner__offerBody {
    height: 100%;
  }

  .mts-bonus .bonus-partner--single .bonus-partner__offerFooter {
    margin-top: auto;
  }
}

@media (max-width: 580px) {
  .mts-bonus .bonus-details-modal__overlay {
    padding: 0;
    align-items: flex-end;
  }

  .mts-bonus .bonus-details-modal__overlay::after {
    height: calc(env(safe-area-inset-bottom, 0px) + 24px);
  }

  .mts-bonus .bonus-details-modal__sheet {
    max-height: calc(85dvh - 4px);
    border-radius: 30px 30px 0 0;
    transform: translateY(100%);
    animation: mts-bonus-modal-slide-up 0.28s ease-out forwards;
  }

  .mts-bonus .bonus-details-modal__hero {
    min-height: 170px;
  }

  .mts-bonus .bonus-details-modal__heroHeader {
    padding: 16px 16px 0;
  }

  .mts-bonus .bonus-details-modal__introMain {
    padding: 20px 20px 12px;
  }

  .mts-bonus .bonus-details-modal__scroll {
    max-height: calc(100dvh - 300px);
  }

  .mts-bonus .voicetech-cards-shell {
    display: flex;
    padding: 24px 20px;
    flex-direction: column;
    align-items: center;
    gap: 20px;
    border-radius: 32px;
    background: #fff;
  }

  .mts-bonus .card.GAME .card-main {
    padding: 4px 0 4px 4px;
  }

  .mts-bonus .card.GAME .card-image {
    border-radius: 16px;
  }

  .mts-bonus .game-card-copy {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    align-self: stretch;
  }
}

@keyframes mts-bonus-overlay-fade-in {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes mts-bonus-sheet-fade-in {
  from {
    opacity: 0;
    transform: translateY(12px) scale(0.98);
  }

  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes mts-bonus-modal-slide-up {
  from {
    transform: translateY(100%);
  }

  to {
    transform: translateY(0);
  }
}

@keyframes mts-bonus-notify-slide-down {
  from {
    opacity: 0;
    transform: translate(-50%, -14px);
  }

  to {
    opacity: 1;
    transform: translate(-50%, 0);
  }
}

@media (max-width: 350px) {
  .mts-bonus .cards-grid {
    grid-template-columns: 1fr;
  }

  .mts-bonus .card.GAME .card-main {
    flex-direction: column;
  }

  .mts-bonus .card.GAME .card-image,
  .mts-bonus .card.GAME .card-content {
    width: 100%;
  }
}

/* Voicetech-only overrides (keep at end to win cascade) */
.mts-bonus.mts-bonus--voicetech-only .section-anchor--voicetech {
  border-radius: 0px 0px 32px 32px;
  background: linear-gradient(169deg, #555964 3.25%, #c9d0e2 15.57%, #a1a8ba 26.44%, #727c96 39.15%, #fff 83.68%);
}

.mts-bonus.mts-bonus--voicetech-only .card:not(.GAME) .card-image::before {
  background: linear-gradient(297deg, #b8bdc7 -16.63%, #e5ebf7 100%);
}

.mts-bonus.mts-bonus--voicetech-only .badge-text:nth-child(1) {
  background: #d01b1b;
}

.mts-bonus.mts-bonus--voicetech-only .card-description--voicetech {
  color: #626c77;
  font-family: "MTS Text", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
  flex-grow: 0;
}

.mts-bonus.mts-bonus--voicetech-only .card-description--voicetech p {
  margin: 0;
}

.mts-bonus.mts-bonus--voicetech-only .buy-btn.mts-button {
  height: 44px !important;
  border-radius: 16px !important;
}

.mts-bonus.mts-bonus--voicetech-only .buy-btn.mts-button .mts-button__content {
  min-height: 44px;
  height: 44px;
}

.mts-bonus.mts-bonus--voicetech-only .buy-btn.mts-button .mts-button__text,
.mts-bonus.mts-bonus--voicetech-only .buy-btn.mts-button .mts-button__content {
  font-size: 12px;
  line-height: 16px;
}

.mts-bonus.mts-bonus--voicetech-welcome {
  position: fixed;
  inset: 0;
  z-index: 2000;
  width: 100vw;
  height: 100dvh;
  background: #000;
  overflow: hidden;
  opacity: 1;
  transition: opacity 0.42s ease;
}

.mts-bonus.mts-bonus--voicetech-welcome::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0;
  background:
    radial-gradient(circle at center, rgba(255, 255, 255, 0.46) 0%, rgba(255, 255, 255, 0.16) 34%, rgba(255, 255, 255, 0) 68%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0) 55%);
  transition: opacity 0.42s ease;
}

.mts-bonus .mts-bonus__voicetechWelcomeVideo {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1);
  filter: brightness(1) saturate(1);
  transition: transform 0.42s ease, filter 0.42s ease;
}

.mts-bonus.mts-bonus--voicetech-welcome.is-exiting {
  opacity: 0;
}

.mts-bonus.mts-bonus--voicetech-welcome.is-exiting::after {
  opacity: 1;
}

.mts-bonus.mts-bonus--voicetech-welcome.is-exiting .mts-bonus__voicetechWelcomeVideo {
  transform: scale(1.016);
  filter: brightness(1.07) saturate(1.12);
}

@media (max-width: 899px) {
  .mts-bonus.mts-bonus--voicetech-only .cards-grid {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }

  .mts-bonus.mts-bonus--voicetech-only .card-title {
    font-size: 20px;
    line-height: 24px;
  }

  .mts-bonus.mts-bonus--voicetech-only .card-tag {
    padding: 4px 6px;
    font-size: 14px;
    line-height: 20px;
  }

  .mts-bonus.mts-bonus--voicetech-only .offer {
    padding: 8px 8px 0;
    font-size: 14px;
    line-height: 20px;
  }

  .mts-bonus.mts-bonus--voicetech-only .current-price {
    font-size: 17px;
    line-height: 24px;
  }

  .mts-bonus.mts-bonus--voicetech-only .old-price {
    font-size: 14px;
    line-height: 20px;
  }

  .mts-bonus.mts-bonus--voicetech-only .badge-text {
    display: inline-block;
    width: fit-content;
    min-width: auto;
    padding: 2px 4px;
    text-align: center;
    white-space: nowrap;
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "MTS Compact", -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px;
    border-radius: 8px;
  }

  .mts-bonus.mts-bonus--voicetech-only .badges {
    left: 8px;
  }

  .mts-bonus.mts-bonus--voicetech-only .card-copy {
    gap: 16px;
  }

  .mts-bonus.mts-bonus--voicetech-only .info-btn {
    right: 6px;
  }
}

@media (min-width: 900px) {
  .mts-bonus.mts-bonus--voicetech-only .section-anchor--voicetech {
    border-radius: 32px;
  }
}
/* Мобильные стили */
@media (max-width: 768px) {
  .guest-section {
    padding: var(--spacing-lg) 0;
  }

  .guest__content {
    flex-direction: column;
    padding: 0 !important;
    border-radius: 0 0 32px 32px;
    gap: 0;
    min-height: auto;
    align-items: stretch;
    background: linear-gradient(156deg, #798EFB 27.85%, rgba(123, 143, 251, 0.96) 33.16%, rgba(127, 146, 250, 0.85) 41.66%, rgba(135, 150, 249, 0.68) 52.28%, rgba(145, 157, 248, 0.44) 65.02%, rgba(158, 165, 246, 0.13) 78.83%, rgba(164, 168, 245, 0.00) 85.2%), radial-gradient(56.7% 88.91% at 114.85% 80.66%, rgba(255, 197, 184, 0.70) 0%, rgba(255, 195, 183, 0.64) 6%, rgba(255, 188, 177, 0.42) 30%, rgba(255, 183, 172, 0.24) 52%, rgba(255, 179, 169, 0.11) 72%, rgba(255, 177, 167, 0.03) 89%, rgba(255, 176, 166, 0.00) 100%), linear-gradient(116deg, rgba(101, 176, 255, 0.30) 27.75%, rgba(255, 255, 255, 0.00) 65.16%), radial-gradient(64.71% 58.92% at 77.64% 65.16%, rgba(242, 216, 255, 0.60) 0%, rgba(242, 216, 255, 0.00) 100%), linear-gradient(24deg, #8CAFFF 9.11%, #E4F0FF 57.73%);
  }
  
  .guest__title {
    font-size: 24px;
    line-height: 28px;
    text-align: center;
    font-weight: 500;
    font-family: "MTS Wide";
    margin-bottom: 16px;
  }
  
  .guest__subtitle {
    font-family: "MTS Text";
    font-size: 17px;
    line-height: 24px;
    text-align: center;
    margin-bottom: 32px;
  }

  .guest-card__header {
    width: 100%;
    margin: 0;
    padding: 0;
    display: block;
    background: none;
  }

  .guest__image {
    width: 100%;
    display: block;
    height: auto;
    overflow: visible;
    margin: 0;
    position: relative;
  }

  .guest__image img {
    width: 100%;
    height: auto;
    max-height: none;
    object-fit: contain;
    object-position: top center;
    display: block;
    border-radius: 0;
  }

  .guest__card {
    padding: 24px 20px;
    align-items: center;
    width: 100%;
    max-width: 100%;
    gap: 24px;
    border-radius: 32px;
    margin: 0;
    position: relative;
    z-index: 2;
    background: #FFF;
    margin: -30px 0 0 0;
  }

  .guest__card__content {
    align-items: center;
    text-align: center;
    gap: 8px;
    width: 100%;
  }

  .guest__card__content--center-mobile {
    text-align: center;
    align-items: center;
  }

  .guest__actions {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    margin-top: 16px !important;
  }
  
  /* Карусель карточек на мобилке */
  .guest__feature-cards-mobile {
    width: 100%;
    margin-top: 12px;
    padding: 20px 0;
    background: #FFF;
    border-radius: 32px;
    box-sizing: border-box;
    overflow: hidden;
  }
  
  .guest__feature-cards-header {
    text-align: center;
    margin-bottom: 20px;
  }
  
  .guest__feature-cards-title {
    font-family: "MTS Text";
    font-size: 17px;
    font-weight: 500;
    line-height: 24px;
    color: #1D2023;
    margin-bottom: 20px;
  }
  
  .guest__feature-cards-description {
    font-family: "MTS Text";
    font-size: 16px;
    line-height: 22px;
    color: #626C77;
    margin: 0;
  }
  
  .guest__feature-cards-grid {
    display: flex;
    gap: 16px;
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    -ms-overflow-style: none;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;

    scroll-padding: 0 20px;
  }

  .guest__feature-card:first-child {
    margin-left: 20px !important; 
  }
  
  .guest__feature-card:last-child {
    margin-right: 20px !important;
  }
  
  .guest__feature-cards-grid::-webkit-scrollbar {
    display: none;
  }
  
  .guest__feature-card {
    background: #F2F3F7;
    border-radius: 20px;
    padding: 16px;
    text-align: left;
    display: flex;
    flex-direction: column;
    flex: 0 0 auto;
    width: 194px;
    min-height: 140px;
    scroll-snap-align: start;
    position: relative;
    border: 1px solid var(--Background-Stroke, rgba(188, 195, 208, 0.50));

    scroll-padding: 0 20px;
  }
  
  .guest__feature-card-icon {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin-bottom: 16px;
  }
  
  .guest__feature-card-icon img {
    width: 44px;
    height: 44px;
    object-fit: contain;
  }
  
  .guest__feature-card-title {
    font-family: "MTS Text";
    font-size: 17px;
    font-weight: 500;
    line-height: 24px;
    color: #1D2023;
    margin-top: 0;
    margin-bottom: 0;
    width: 100%;
  }
  
  .guest__feature-card-description {
    font-family: "MTS Text";
    font-size: 14px;
    line-height: 20px;
    color: #626C77;
    margin: 0;
    width: 100%;
  }
  
  .guest__feature-cards--desktop {
    display: none !important;
  }
}

/* Десктопные стили */
@media (min-width: 769px) {
    .guest-section {
    width: 100%;
    background: #FFF;
  }

  .guest-section__container {
    max-width: 1440px;
    margin: 0 auto;
    box-sizing: border-box;
    width: 100%;
  }
  .guest__content {
    background: #FFF !important;
    min-height: 500px;
    gap: 12px !important;
    align-items: stretch !important; 
    justify-content: space-between;
    display: flex !important;
    flex-direction: row !important;
    padding: 12px !important;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }
  
  .guest__card {
    background: transparent !important;
    box-shadow: none !important;
    padding: clamp(24px, 5vw, 48px) !important;
    border-radius: 0 !important;
    margin: 0 !important;
    align-items: stretch !important; 
    flex: 1; 
    order: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important; 
    box-sizing: border-box;
    min-width: 0; 
    width: 100%; 
  }

  .guest__card__content {
    align-items: center !important;
    text-align: center !important;
    width: 100% !important;
    max-width: 100%;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important; 
    box-sizing: border-box;
    flex: 1; 
    min-height: 0; 
  }
  
  .guest__feature-cards--desktop {
    width: 100%;
    box-sizing: border-box;
    margin-top: auto !important; 
    max-width: 100%;
  }
  
  .guest-card__header {
    align-items: flex-end !important;
    justify-content: flex-end !important;
    flex: 1; 
    order: 2 !important;
    display: flex !important;
    height: 100%; 
    min-width: 0;
  }
  
  .guest__image {
    justify-content: flex-end !important;
    align-items: flex-end !important;
    width: 100% !important;
    height: 100% !important;
    display: flex !important;
  }
  
  .guest__image img {
    width: auto !important;
    height: auto !important;
    max-height: 100% !important;
    max-width: 100% !important;
    object-fit: contain !important;
    object-position: bottom right !important;

  }
  
  /* Адаптивные размеры */
  .guest__title {
    font-family: "MTS Wide" !important;
    font-size: clamp(28px, 2.5vw, 36px) !important;
    font-weight: 500 !important;
    line-height: 1.1 !important;
    margin-bottom: clamp(16px, 1.5vw, 20px) !important;
    color: #1D2023 !important;
    text-align: center !important;
    width: 100% !important;
    max-width: 100%;
  }
  
  .guest__subtitle {
    font-family: "MTS Text" !important;
    font-size: clamp(16px, 1.4vw, 20px) !important;
    font-weight: 400 !important;
    line-height: 1.4 !important;
    margin-bottom: clamp(32px, 3vw, 40px) !important;
    color: #626C77 !important;
    text-align: center !important;
    width: 100% !important;
    max-width: 100%;
  }
  
  .guest__actions {
    align-self: center !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: 100%;
    display: flex !important;
    justify-content: center !important;
  }
  
  .guest__feature-cards-header {
    text-align: center;
    margin-bottom: clamp(16px, 1.5vw, 20px) !important;
  }
  
  .guest__feature-cards-title {
    font-family: "MTS Text";
    font-size: clamp(18px, 1.4vw, 20px) !important;
    font-weight: 450;
    line-height: 24px;
    color: #1D2023;
    margin-bottom: clamp(8px, 1vw, 12px) !important;
  }
  
  .guest__feature-cards-description {
    font-family: "MTS Text";
    font-size: clamp(10px, 1.2vw, 17px) !important;
    line-height: 24px;
    color: #626C77;
    margin: 0;
  }
  
  .guest__feature-cards-grid {
    display: grid;
      grid-template-columns: repeat(3, 1fr);
    gap: clamp(16px, 1.7vw, 24px) !important;
    width: 100%;
    max-width: 100%;
    justify-content: center;
    align-items: stretch;
    flex-wrap: wrap !important;
  }
  
  .guest__feature-card {
    background: #F2F3F7;
    padding: clamp(16px, 1.4vw, 20px) !important;
    text-align: left;
    display: flex;
    flex-direction: column;
    
    border-radius: 24px;
    border: 1px solid var(--Background-Stroke, rgba(188, 195, 208, 0.50));
    box-sizing: border-box;
    
  }
  
  .guest__feature-card-icon {
    width: clamp(36px, 3.1vw, 44px) !important;
    height: clamp(36px, 3.1vw, 44px) !important;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin-bottom: 16px;
  }
  
  .guest__feature-card-icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
  }
  
  .guest__feature-card-title {
    font-family: "MTS Text";
    font-size: clamp(10px, 1.2vw, 17px) !important;
    font-weight: 500;
    line-height: 24px;
    color: #1D2023;
    margin-top: 0;
    margin-bottom: 0;
    width: 100%;
  }
  
  .guest__feature-card-description {
    font-family: "MTS Text";
    font-size: clamp(12px, 0.97vw, 14px) !important;
    line-height: 20px;
    color: #626C77;
    margin: 0;
    width: 100%;
    flex-grow: 1;
  }
  
  .guest__feature-cards-mobile {
    display: none !important;
  }
}