﻿
@font-face {
    font-family: 'MTS Text';
    font-weight: 400;
    src: url('./Fonts/MTSText-Regular.ttf') format('truetype');
    font-display: swap;
}

@font-face {
    font-family: 'MTS Text';
    font-weight: 500;
    src: url('./Fonts/MTSText-Medium.ttf') format('truetype');
    font-display: swap;
}

@font-face {
    font-family: "MTS Wide";
    font-weight: 400;
    src: url('./Fonts/MTSWide-Regular.TTF') format('truetype');
    font-display: swap;
}

@font-face {
    font-family: "MTS Wide";
    font-weight: 500;
    src: url('./Fonts/MTSWide-Medium.ttf') format('truetype');
    font-display: swap;
}

@font-face {
    font-family: "MTS Wide";
    font-weight: 700;
    src: url('./Fonts/MTSWide-Bold.TTF') format('truetype');
    font-display: swap;
}

:root {
    --padding-inline: clamp(0.75rem, -4.107rem + 10.12vw, 5rem);
    --padding-24-16: clamp(1rem, 0.429rem + 1.19vw, 1.5rem);
    --padding-24-12: clamp(0.75rem, -0.107rem + 1.79vw, 1.5rem);
    /* colors */
    --red: #FF0032;
    --red-hover: rgba(255, 0, 81, 1);
    --black: rgba(0, 0, 0, 1);
    --black-hover: rgba(43, 43, 47, 1);
    --deep-blue: rgba(11, 113, 255, 1);
    --deep-blue-hover: #4693FF;
    --light-blue: rgba(231, 239, 255, 1);
    --white: rgba(255, 255, 255, 1);
    --gray-50: rgba(246, 247, 251, 1);
    --gray-100: rgba(230, 233, 239, 1);
    --gray-400: rgba(186, 190, 207, 1);
    --gray-600: #818899;
    --gray-600-hover: rgba(155, 162, 169, 1);
    --gray-800: #54585C;
    --violet: rgba(247, 215, 255, 1);
    --light-violet: rgba(178, 11, 255, 1);
    --white-08: rgba(255, 255, 255, .8);
    /* shadow */
    --shadow: 0px 0px 20px 0px rgba(12, 26, 85, 0.12);
    /* bg-linar */
    --defaul-linar: linear-gradient(90deg, #B4C4FF 0%, #E4D9FF 100%);
    /* border-radius */
    --border-radius: 16px;
    --border-radius-btn: 8px;
}

/* ============================================================   RESET   ============================================================ */

body {
    margin: 0;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    font-family: 'MTS Text';
    font-style: normal;
    font-size: 16px;
    font-weight: 400;
    line-height: 1;
    color: var(--black);
    /*    background: var(--gray-50);*/
}

input,
button,
textarea,
select {
    font-family: inherit;
}

main {
    flex: 1;
}

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

h1,
h2,
h3,
h4,
h5,
h6,
p {
    margin: 0;
}

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

a {
    text-decoration: none;
    color: inherit;
    cursor: pointer;
    transition: color .3s;
}

img, picture {
    line-height: 0;
}

.reset p {
    margin: revert;
}

.reset ul,
.reset ol,
.reset menu,
.reset fieldset {
    margin: revert;
    padding: revert;
    list-style: revert;
}

/* ============================================================   FONTS   ============================================================ */


.title-min,
.span-h1,
.h2-max-medium {
    font-family: "MTS Wide";
    font-weight: 500;
}

.h2-max {
    font-family: "MTS Wide";
    font-weight: 700;
    font-size: 30px;
    text-transform: uppercase;
}

h1,
.h1-main,
.h1-accent,
h2,
.span-h2,
.h2-min,
.h3-accent,
.h3-accent-min,
.txt-phone,
.btn,
.btn-link,
.p-medium,
.p-input-medium,
.p-question,
.title,
.section-title,
.numeric,
.numeric-max,
.numeric-m,
.value-lg,
.new-price-rates-cards,
.price-lg,
.btn-lg,
.description-medium,
input[type="text"] {
    font-family: "MTS Text";
    font-weight: 500;
}

h3,
.header-link,
.promo-title-card,
.link,
button.link_blue,
p,
li,
ol,
.normal,
.p-min,
.txt-text-min,
.hover-txt,
.p-extra-min,
.p-input,
.subtitle,
.old-price,
.numeric-min,
.why li,
.why .link_blue,
input::placeholder,
.description {
    font-family: "MTS Text";
    font-weight: 400;
}

h1 {
    font-size: clamp(1.188rem, 0.545rem + 1.34vw, 1.75rem);
    line-height: 110%;
}

.h1-main {
    font-size: clamp(1.188rem, 0.259rem + 1.93vw, 2rem);
    text-transform: none;
    line-height: 110%;
}

.h1-accent, .h1-accent h1 {
    font-size: clamp(1.125rem, 0.554rem + 1.19vw, 1.625rem);
    text-transform: initial;
}

.span-h1 {
    font-size: clamp(1.375rem, -0.768rem + 4.46vw, 3.25rem);
    letter-spacing: -0.44px;
}

.span-h2 {
    font-size: clamp(1.063rem, 0.848rem + 0.45vw, 1.25rem);
    line-height: 1.1;
}


h2 {
    font-size: clamp(1.125rem, 0.411rem + 1.49vw, 1.75rem);
}

.h2-min {
    font-size: clamp(1.063rem, 0.705rem + 0.74vw, 1.375rem);
    line-height: 1.1;
    text-transform: none;
}

.h2-max-medium {
    font-size: clamp(1.625rem, -2.232rem + 8.04vw, 5rem);
    text-transform: uppercase;
}

h3 {
    font-size: clamp(1rem, 0.571rem + 0.89vw, 1.375rem);
    line-height: 1.1;
}

.h3-accent {
    font-size: clamp(1rem, 0.429rem + 1.19vw, 1.5rem);
    line-height: 1.1;
}

.h3-accent-min {
    font-size: clamp(1rem, 0.714rem + 0.6vw, 1.25rem);
    line-height: 1.1;
}

.txt-phone {
    font-size: 19px;
}

.header-link {
    font-size: clamp(0.875rem, 0.732rem + 0.3vw, 1rem);
}

.btn-lg {
    font-size: clamp(1.063rem, 0.563rem + 1.04vw, 1.5rem);
}

.promo-title-card {
    font-size: clamp(0.875rem, 0.589rem + 0.6vw, 1.125rem);
}

.description-medium {
    font-size: clamp(1.188rem, 0.402rem + 1.64vw, 1.875rem);
    line-height: 1.1;
}

.btn {
    font-size: 17px;
}

.btn-link {
    font-size: clamp(0.938rem, 0.723rem + 0.45vw, 1.125rem);
}

.link {
    color: black;
    font-size: 14px;
    line-height: 1.2;
}

p,
.normal,
li,
ol {
    font-size: clamp(0.938rem, 0.723rem + 0.45vw, 1.125rem);
    line-height: 1.2;
}

button.link_blue {
    font-size: clamp(0.938rem, 0.723rem + 0.45vw, 1.125rem);
}

.p-medium,
.reelPlus .radio-box .numeric {
    font-size: 15px;
}

.p-min {
    font-size: 12px;
    line-height: 1.1;
}

.txt-text-min,
.hover-txt {
    font-size: 14px;
    line-height: 1.1;
}

.p-extra-min {
    font-size: 12px;
    line-height: .9;
}

.p-question {
    font-size: clamp(0.938rem, 0.438rem + 1.04vw, 1.375rem);
}

.p-input,
.p-input-medium,
.numeric {
    font-size: 17px;
}

.subtitle {
    font-size: clamp(0.938rem, 0.295rem + 1.34vw, 1.5rem);
}

.numeric {
    line-height: .9;
}

.numeric-m {
    font-size: clamp(1.375rem, 0.661rem + 1.49vw, 2rem);
    line-height: 100%;
}

.numeric-max,
.new-price-rates-cards {
    font-size: 26px;
}

.old-price,
.numeric-min {
    font-size: clamp(0.938rem, 0.795rem + 0.3vw, 1.063rem);
}

.title {
    font-size: clamp(0.938rem, -0.277rem + 2.53vw, 2rem);
}

.title-min {
    font-size: 15px;
}

.section-title {
    color: var(--gray-600);
    font-size: 15px;
    line-height: 1.1;
}

.why li, .why .link_blue {
    align-items: center;
    font-size: clamp(0.938rem, 0.723rem + 0.45vw, 1.125rem);
    line-height: 1.25;
}

.why .link_blue {
    display: flex;
}

.description {
    font-size: clamp(1.188rem, 0.402rem + 1.64vw, 1.875rem);
    line-height: 1.1;
}

.value-lg {
    font-size: clamp(1.25rem, 0.393rem + 1.79vw, 2rem);
}

.price-lg {
    font-size: clamp(2rem, 1.143rem + 1.79vw, 2.75rem);
    letter-spacing: -0.88px;
}

@media (min-width: 768px) {
    h1, h2 {
        font-family: "MTS Wide";
/*        text-transform: uppercase;*/
    }

    .h1-main {
        font-family: "MTS Wide";
        line-height: 100%;
    }

    .h1-accent, .header-link, h1, h2 {
        line-height: 1.1;
    }

    .span-h1 {
        letter-spacing: -1.04px;
    }
    .p-sm {
        font-family: "MTS Text";
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 110%;
    }

    .h2-max {
        font-size: 80px;
    }

    h3 {
        font-weight: 500;
    }

    .btn.header-link {
        font-size: 16px;
    }

    .p-min {
        font-size: 14px
    }

    p {
        line-height: 1.25;
    }

    .subtitle {
        line-height: 1.1;
    }

    .promo-title-card {
        line-height: 1.1;
    }

    .description, .description-medium, .h2-max-medium {
        line-height: 1;
    }

    .price-lg {
        letter-spacing: -0.64px;
    }
}

/* ============================================================   COMMON   ============================================================ */

header, main, footer, .f-center {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.mob-scroll {
    width: 100%;
}

.container {
    max-width: 1304px;
    width: 100%;
    padding-inline: 12px;
}

.container-mob {
    max-width: 1280px;
    width: 100%;
}

.container-wide {
    width: 100%;
}

/*.block {
    margin-bottom: clamp(2.5rem, -2.321rem + 9.52vw, 6.25rem);
}*/

    .block:empty {
        margin-bottom: 0;
    }

.no-wrap {
    white-space: nowrap;
}

.first-block {
    margin-top: 16px;
}

button {
    padding: 16px 28px;
    border-radius: var(--border-radius-btn);
    background: var(--red);
    color: white;
    border: none;
    line-height: 1;
    cursor: pointer;
    transition: color .3s, background-color .3s;
}

    button.menu, button.phones {
        padding: 0;
        background: none;
    }

    button:focus-visible {
        outline: none;
    }

    button.red {
        background: var(--red);
    }

    button.black {
        background: var(--black);
    }

    button.gray {
        background: var(--gray-400);
    }

    button.inline {
        border: none;
        background: none;
        padding: 0;
        font-size: inherit;
    }

a.btn {
    color: var(--white);
    padding: 16px 28px;
    border-radius: 8px;
    text-align: center;
    transition: background-color .3s;
}

    a.btn.black {
        background: var(--black);
    }

    a.btn.gray {
        display: inline-flex;
        justify-content: center;
        align-items: center;
        gap: 10px;
        background: var(--gray-600);
    }

button.red:hover {
    background: var(--red-hover);
}

button.black:hover,
a.btn.black:hover {
    background: var(--black-hover);
}

button.gray:hover,
a.btn.gray:hover {
    background: var(--gray-600-hover);
}

button.gray50,
a.btn.gray50 {
    color: var(--black);
    background: var(--gray-50);
}

    button.gray50:hover,
    a.btn.gray50:hover {
        background: var(--gray-600-hover);
    }

button.red:disabled:hover,
button.black:disabled:hover,
button:disabled,
.button:disabled svg {
    background: var(--gray-400);
    fill: var(--gray-400);
    cursor: default;
}

.btn-link:disabled,
.btn-link:disabled svg {
    color: var(--gray-400);
    fill: var(--gray-400);
    cursor: default;
}

a.link {
    color: var(--black);
}

    a.link:hover,
    a.link:hover svg {
        color: var(--deep-blue);
        fill: var(--deep-blue);
    }

.link_blue {
    color: var(--deep-blue);
    display: inline-flex;
    align-items: center;
    gap: 2px;
}

.inline.link_blue {
    font-weight: 500;
    font-size: clamp(0.938rem, 0.723rem + 0.45vw, 1.125rem);
}

.color-blue {
    color: var(--deep-blue);
}

.color-red {
    color: var(--red);
}

.color-white {
    color: var(--white);
}

.color-black {
    color: #000;
}

.chips {
    padding: 12px 16px;
    border-radius: 8px;
    background: var(--gray-50);
    transition: background-color .3s;
}

    .chips a {
        color: var(--black);
    }

        .chips a.color-blue {
            color: var(--deep-blue);
        }

    .chips:hover {
        background: #DBDBE7;
    }

a.chips.link:hover {
    color: var(--black);
}

.plate {
    padding: 8px;
    border-radius: 4px;
    background: #FFF;
    display: flex;
    align-items: center;
    gap: 4px;
    cursor: default;
}

.gray50 {
    color: var(--gray-50) !important;
}

.gray400 {
    color: var(--gray-400) !important;
}

.gray600 {
    color: var(--gray-600) !important;
}

.gray800 {
    color: var(--gray-800) !important;
}

.no-scroll {
    overflow: hidden;
    height: 100%;
    position: fixed;
    width: 100%;
    top: 0;
    left: 0;
}

.scroll-block {
    overflow-y: auto;
}

    .scroll-block::-webkit-scrollbar {
        width: 4px;
    }

    .scroll-block::-webkit-scrollbar-track {
        background: transparent;
    }

    .scroll-block::-webkit-scrollbar-thumb {
        background: var(--gray-600);
        cursor: pointer;
        border-radius: 8px;
    }

        .scroll-block::-webkit-scrollbar-thumb:hover {
            background: var(--gray-600);
        }

.mobile-scroll {
    overflow-x: auto;
    -ms-overflow-style: none;
    scrollbar-width: none;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    padding-inline: 12px;
}

.line_clamp {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    overflow: hidden;
}

.content-block {
    padding: var(--padding-24-16);
    border-radius: var(--padding-24-16);
    background: var(--white);
}

.reelPlus .content-block {
    padding: clamp(1rem, -0.714rem + 3.57vw, 2.5rem);
    max-width: 550px;
    width: 100%;
}

.reelPlus .price {
    gap: clamp(0.5rem, 0.214rem + 0.6vw, 0.75rem);
    align-items: center;
}

.drop-header {
    display: grid;
    grid-template-columns: 1fr 24px;
    align-items: center;
    gap: 12px;
}

.drop-content_wrap {
    transition: grid-template-rows .2s, padding-top .2s;
    display: grid;
    grid-template-rows: 0fr;
}

.active .drop-content_wrap {
    grid-template-rows: 1fr;
    transition: grid-template-rows .4s, padding-top .4s;
    cursor: default;
}

.drop-content {
    overflow: hidden;
}

.h-title,
.h_title_block {
    margin-bottom: clamp(0.75rem, 0.179rem + 1.19vw, 1.25rem);
}

.header-label {
    max-width: 900px;
    margin-top: 12px;
    color:var(--gray-600);
}

.square-icon {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    display: flex;
    justify-content: center;
    align-items: center;
}

    .square-icon img {
        width: 40px;
        height: 40px;
        aspect-ratio: 1;
    }

.splitted-block .h_title_block {
    display: flex;
    justify-content: space-between;
    align-items: end;
}

.splitted-block_mob-scroll {
    padding-inline: 0;
}

    .splitted-block_mob-scroll .h_title_block {
        padding-inline: 12px;
    }

.text-arrow_right {
    margin-right: 8px;
}

/*  ===========================================================     INPUT    ===========================================================  */

.text-input {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

    .text-input .error {
        color: var(--red);
        min-height: 11px;
        padding-left: 12px;
    }

    .text-input:hover {
        cursor: text;
    }

    .text-input .reset {
        position: absolute;
        width: 24px;
        height: 24px;
        top: 12px;
        right: 4px;
        display: none;
    }

    .text-input.small .reset {
        top: 9px;
    }

    .text-input input {
        border-radius: var(--border-radius-btn);
        border: 1px solid var(--white-08);
        background: var(--white-08);
        transition: border-color 0.15s;
        padding: 11px 36px 12px 12px;
        caret-color: var(--deep-blue);
        font-size: 17px;
    }

    .text-input.small input {
        padding: 7px 36px 8px 12px;
    }


    .text-input.gray input {
        background: var(--gray-50);
        border-color: var(--white-08);
    }

    .text-input.error input {
        border-color: var(--red);
    }

    .text-input input::placeholder {
        color: var(--gray-600);
        font-size: 17px;
        transition: color .15s;
    }

    .text-input input:-webkit-autofill {
        transition: background-color 600000s 0s;
    }

    .text-input input:focus {
        outline: none;
    }

        .text-input input:focus::placeholder {
            color: var(--gray-400);
        }

    .text-input.filling .reset {
        display: initial;
        cursor: pointer;
        z-index: 1;
    }

.form-agreement_input {
    width: 15px;
    height: 15px;
}


@media (min-width: 768px) {
    .header-label {
        margin-top: 20px;
    }
    .cities .text-input {
        width: 789px;
    }

    .text-input.small .reset {
        top: 12px;
    }

    .text-input.small input {
        padding: 11px 36px 12px 12px;
    }
}

/*  ===========================================================     POPUP    ===========================================================  */

.overlay {
    position: fixed;
    top: 100%;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(33, 33, 33, .5);
    backdrop-filter: blur(2px);
    z-index: 1000;
    display: flex;
    align-items: flex-end;
    cursor: pointer;
    transition: opacity 0.5s ease-out, top 0.5s step-end;
    opacity: 0;
}

    .overlay.opened {
        transition: opacity 0.5s ease-out, top 0.5s step-start;
        opacity: 1;
        top: 0;
    }

.popup-container {
    z-index: 1001;
    position: relative;
    background-color: #fff;
    cursor: default;
    width: 100%;
    border-radius: 10px 10px 0 0;
    padding: 0 12px 20px;
    top: 100%;
}

    .popup-container.smooth {
        transition: top .5s ease-out;
    }

    .popup-container .close-icon {
        position: absolute;
        top: 32px;
        right: 32px;
        transition: opacity .3s;
    }

    .popup-container::after {
        content: '';
        position: absolute;
        background-color: #fff;
        width: 100%;
        height: 100vh;
        left: 0;
        top: 100%;
    }

.opened .popup-container {
    top: 0;
}

.grabber-container {
    display: flex;
    justify-content: center;
    width: 100%;
}

.grabber {
    width: 60px;
    height: 4px;
    flex-shrink: 0;
    border-radius: 2.5px;
    background: var(--gray-400);
    margin: 8px auto 24px;
}

.popup-order_form {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 20px 0 12px;
}

.cities .title {
    margin-bottom: 12px;
}

.simbol_city {
    display: flex;
    flex-direction: column;
    gap: 12px;
    -webkit-column-break-inside: avoid;
    break-inside: avoid-column;
    page-break-inside: avoid;
}

.city_wrapper {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 204px);
    height: calc(100svh - 204px);
    margin-top: 2px;
}

    .city_wrapper .hold {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        margin-bottom: 20px;
    }

.city_choise__all {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding-bottom: 20px
}

.region {
    color: var(--gray-600);
}

.city_choise__all .region {
    display: none;
}

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

    .city_result .link {
        font-size: 17px;
    }

.city_empty {
    display: none;
    flex: 1;
    flex-direction: column;
    gap: 24px;
}

    .city_empty.active {
        display: flex;
    }

.city_empty-info svg {
    margin: 12px 0;
}

.filling .city_choise__all, .filling .hold {
    display: none;
}

.support-links2 {
    display: flex;
    flex-direction: column;
    padding: 12px;
    align-items: center;
    gap: 12px;
    align-self: stretch;
    border-radius: 12px;
    background: var(--light-blue, #E7EFFF);
    margin-top: clamp(1rem, 0.429rem + 1.19vw, 1.5rem);
}

    .support-links2 .apps2 {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
    }

.filling .city_result {
    display: flex;
}

.filling .link {
    display: inline-flex;
    gap: 8px;
}

.link a:hover {
    color: var(--deep-blue);
}

.city_choise .city_list {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

    .city_choise .city_list ul {
        display: flex;
        flex-direction: column;
        gap: 12px;
    }

.city_tab {
    display: flex;
    padding: 12px 16px;
    justify-content: center;
    align-items: center;
    gap: 2px;
    border-radius: 8px;
    background: var(--gray-50);
}

.phones_form {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding-top: 12px;
}

.cities .popup-container {
    padding-bottom: 0;
}

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

.apps-container {
    margin-top: 12px;
}

.apps {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 8px;
}

.menu_navigation {
    display: flex;
    flex-direction: column;
    gap: 20px;
    overflow: hidden;
}

    .menu_navigation .list {
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        gap: 8px;
    }

    .menu_navigation .chips {
        width: 100%;
        text-align: center;
    }
    .menu_navigation li{
      display: flex;
      padding: 12px 16px;
      justify-content: center;
      align-items: center;
      gap: 2px;
	  border-radius: 12px;
	  background: var(--gray-50, #F6F7FB);
    }

.navigation {
    display: grid;
    grid-auto-columns: 100%;
    grid-auto-flow: column;
    gap: 24px;
    position: relative;
    left: 0;
    transition: left .3s ease-out;
}

    .navigation .list img {
        width: 32px;
        height: 32px;
    }

.menu .color-blue.chips {
    width: 100%;
    margin-top: 16px;
    text-align: center;
}



.navigation_banner.red {
    background: linear-gradient(90deg, transparent 0 20%, var(--red) 20% 100%);
}

.navigation_banner.deep-blue {
    background: linear-gradient(90deg, transparent 0 20%, var(--deep-blue) 20% 100%);
}

.navigation_banner.dark-blue {
    background: linear-gradient(90deg, transparent 0 20%, #5063B1 20% 100%);
}

.navigation_banner.puce-red {
    background: linear-gradient(90deg, transparent 0 20%, #7D293D 20% 100%);
}

.navigation_banner.cinnabar {
    background: linear-gradient(90deg, transparent 0 20%, #E2402A 20% 100%);
}




.best-info_block {
    display: flex;
    gap: 4px;
    position: relative;
}

.best-info_button {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.30);
    display: flex;
    justify-content: center;
    align-items: center;
}

.best-info {
    display: none;
    position: absolute;
    top: -113px;
    left: 25px;
    width: 227px;
    padding: 8px;
    border-radius: 8px;
    background: rgba(231, 239, 255, 0.70);
    backdrop-filter: blur(8px);
    z-index: 1002;
}

.nav_tabs {
    display: flex;
    width: 100%;
    gap: 24px;
}

    .nav_tabs button {
        cursor: pointer;
        color: var(--gray-600);
        background: none;
        padding: 0;
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 110%;
    }

        .nav_tabs button.active {
            cursor: pointer;
            color: var(--red);
            justify-content: center;
        }

/*  ===========================================================     FORMS    ===========================================================  */

.form-result {
    display: flex;
    flex-direction: column;
    gap: clamp(0.75rem, 0.179rem + 1.19vw, 1.25rem);
}

    .form-result .span-h2 {
        margin-bottom: 4px;
        display: inline-block;
    }

.status_img {
    width: clamp(5rem, 3.571rem + 2.98vw, 6.25rem);
    aspect-ratio: 1;
}

.form-agreement {
    display: flex;
    align-items: center;
    gap: 6px;
}

    .form-agreement label {
        line-height: 0;
    }

/*  ===========================================================     HEADER    ===========================================================  */

.header-bg_placeholder {
    height: 70px;
    width: 100%;
    background-color: #fff;
    border-radius: 0 0 16px 16px;
}

header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 100;
    background: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(10px);
    border-radius: 0px 0px 16px 16px;
      padding-block:clamp(12px, 2.381vw - 6.286px, 28px);
}

.header {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: clamp(1rem, -0.714rem + 3.57vw, 2.5rem);
}

.header-logo {
    line-height: 0;
}

    .header-logo img {
        aspect-ratio: 1;
        width: 32px;
        object-fit: contain;
    }

.header_city {
    display: flex;
    gap: 4px;
    padding: 0;
    background: none;
    color: var(--black);
    align-items: center;
}

.header_btn {
    display: flex;
    gap: 8px;
    margin-left: auto;
    align-items: center;
}

.header_city.active span,
.header_city.active path {
    color: var(--deep-blue);
    fill: var(--deep-blue);
}

/*  ===========================================================     ORDER FORM WITH ADDRESS    ===========================================================  */

.order-address {
    padding-top: 16px;
}

    .order-address .content-block {
        display: flex;
        flex-direction: column;
        gap: 16px;
    }

.order-address-info {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

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

.order-address-subtitle {
    line-height: 1.25;
}

.order-address-form {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.order-addres-inputs {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 8px;
}

.order-address .form-result {
    padding: 24px;
    border-radius: 24px;
    background: var(--gray-50);
    min-height: 333px;
    justify-content: center;
}

.order-address-remark .form-agreement {
    margin-top: 4px;
}

/*  ===========================================================   TOP BANNER   =================================================  */

.top-banner {
    background: #fff;
    padding-block: 12px;
    margin-top: 4px;
    border-radius: 16px;
}

.gigabit {
    display: flex;
    gap: clamp(0.5rem, -0.357rem + 1.79vw, 1.25rem);
}

.gigabit_img {
    display: flex;
    align-items: center;
}

    .gigabit_img img {
        border-radius: var(--padding-24-16);
    }

.gigabit-text {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 4px;
}

/*.action-banner img {
    object-fit: contain;
    width: 100%;
    padding-inline: 12px;
}

.action-banner-text {
    padding: 12px 0 8px;
}

    .action-banner-text h1 {
        margin-bottom: 8px;
    }*/

/*  ===========================================================   ADVANTAGES  =================================================  */

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

.advantages-header_wrap {
    display: flex;
    align-items: center;
    gap: 8px;
}

.no-svg .square-icon {
    background: none;
}

    .no-svg .square-icon img {
        width: 40px;
        height: 40px;
        border-radius: 12px;
    }

/*  ===========================================================   TARIFF   =================================================  */

.card_body__header {
    margin-bottom: 8px;
}

.tariffs-two_cards {
    padding-inline: 0;
}

    .tariffs-two_cards .h_title_block {
        padding-inline: 12px;
    }

.half-price_cards {
    margin-top: 16px;
}

    .half-price_cards .h_title_block {
        margin-bottom: 8px;
    }

    .half-price_cards .subtitle {
        padding-inline: 12px;
        margin-bottom: 12px;
    }

.tariff_slider {
    display: flex;
    width: 100%;
    padding: 15px;
    margin-left: 15px;
}

.tariff_slider_item,
.advantage_slider_item {
    width: 326px;
    padding-left: 8px;
    scroll-snap-align: start;
}

.tariff-card {
    display: flex;
    flex-direction: column;
    align-items: start;
    width: 318px;
    height: 100%;
    border-radius: 20px;
    background: var(--white, #FFF);
    box-shadow: 0 0 24px 0 rgba(97, 72, 197, 0.10);
}

.card_body {
    flex: 1;
}

.card_header {
    margin-bottom: 8px;
    white-space: nowrap;
}

.reelPlus .card_header {
    margin-bottom: clamp(0.5rem, -0.357rem + 1.79vw, 1.25rem);
}


.service_opt .txt-text-min,
.info_fall__i .txt-text-min,
.card_footer .bonus {
    color: var(--Gray800);
}

.tariff-speed {
    margin-bottom: 12px;
}

.tariff-speed_title {
    margin-bottom: 4px;
}

.mob_option {
    display: flex;
    flex-wrap: wrap;
    gap: clamp(0.5rem, 0.214rem + 0.6vw, 0.75rem);
    margin-bottom: 12px;
}

.tariff-data {
    display: flex;
    align-items: center;
    gap: 2px;
}

.equipment {
    display: flex;
    flex-direction: column;
    gap: 3px;
    align-items: start;
}

.info_fall__i {
    position: relative;
    display: flex;
    align-items: center;
    cursor: pointer;
}

.sub_item {
    display: none;
    width: max-content;
    max-width: 325px;
    position: absolute;
    padding: 8px 8px 8px 4px;
    left: 0;
    bottom: 19px;
    border-radius: 8px;
    background: rgba(231, 239, 255, 0.70);
    backdrop-filter: blur(8px);
    z-index: 2;
    cursor: default;
}

    .sub_item .hover-txt,
    .sub_item .p-txt {
        color: var(--gray-800);
    }

    .sub_item ul {
        list-style: initial;
        padding-left: 30px;
    }

.info_fall__i:hover .sub_item {
    display: block;
}

.card_footer {
    display: flex;
    flex-direction: column;
    gap: clamp(0.75rem, 0.464rem + 0.6vw, 1rem);
    margin-top: auto;
}

    .card_footer,
    .card_footer button {
        width: 100%;
    }

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

.price {
    display: flex;
    gap: 4px;
    align-items: end;
}

    .price .numeric-min, .price .p-medium {
        margin-bottom: 3px;
    }

    .price .numeric-min {
        text-decoration-line: line-through;
    }

.h-title-header.date {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: clamp(0.75rem, 0.179rem + 1.19vw, 1.25rem);
}

.date h1 {
    max-width: 600px;
}

.radio-box {
    color: var(--gray-50);
    display: flex;
    padding: 12px 16px;
    justify-content: center;
    align-items: flex-end;
    gap: 5px;
    border-radius: 8px;
    background: var(--gray-50);
    cursor: pointer;
}

    .radio-box .numeric {
        color: var(--gray-600);
    }

    .radio-box.active .numeric {
        color: var(--white);
    }

    .radio-box .radio {
        width: 12px;
        height: 12px;
        border: 3px solid var(--gray-600);
        border-radius: 50%;
    }

    .radio-box.active {
        color: var(--white);
        background: var(--black)
    }

        .radio-box.active .radio {
            border: 4px solid var(--white);
        }

.tariff-card .options {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 16px;
}

.add-info {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

    .add-info .violet {
        color: var(--light-violet);
        padding: 2px 4px 4px;
        border-radius: 4px;
        background: var(--violet);
    }

.slider_wrapper {
    display: flex;
    gap: 8px;
}

/*  ===========================================================   MAIN BANNER   =================================================  */

.main_banner {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.baner_akcii {
    padding-block: 20px;
    overflow: hidden;
    background: var(--white);
    margin-top: 4px;
    border-radius: 16px;
}

    .baner_akcii .promo-title-card {
        width: min-content;
    }

.main_banner .banner_content {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding-block: 20px;
    background: var(--white);
    margin-top: 4px;
    border-radius: 16px;
}

    .main_banner .banner_content .text_content {
        display: flex;
        flex-direction: column;
        gap: clamp(0.5rem, -0.071rem + 1.19vw, 1rem);
        width: 100%;
    }

.banner_card__links {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
}

    .banner_card__links .card {
        display: flex;
        flex-direction: column;
        align-items: start;
        gap: 12px;
        background: var(--light-blue);
        border-radius: 12px;
        padding: 12px;
    }

.baner_akcii .card {
    display: flex;
    align-items: center;
    gap: clamp(0.25rem, -0.321rem + 1.19vw, 0.75rem);
    background-color: var(--white);
    border-radius: 20px;
    min-width: 140px;
    cursor: pointer;
}

.baner_akcii img {
    border-radius: 50%;
    width: clamp(3.25rem, 2.393rem + 1.79vw, 4rem);
    aspect-ratio: 1;
}

.moscow-banner {
    margin: clamp(1.25rem, -0.179rem + 2.98vw, 2.5rem) 0;
    border-radius: var(--padding-24-12);
    overflow: hidden;
}

    .moscow-banner picture {
        display: block;
    }

    .moscow-banner img {
        width: 100%;
        aspect-ratio: 3.6 / 1;
    }

/*  ===========================================================     SURVEY    ===========================================================  */

.survey_num {
    font-family: "MTS Text";
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: .9;
    color: var(--gray-600);
    position: absolute;
    top: 0;
    right: var(--padding-24-12);
    z-index: 2;
}

    .survey_num span {
        color: var(--black);
    }

.survey input[type="radio"] {
    display: none;
}

.survey-radio_wrap {
    display: flex;
    flex-direction: column;
    align-items: start;
    gap: 4px;
}

.survey .p-question {
    min-height: 30px;
}

.survey .custom-radio {
    display: flex;
    gap: clamp(0.25rem, -0.036rem + 0.6vw, 0.5rem);
    padding: 4px 0;
    cursor: pointer;
}

.radio-indicator {
    width: 15px;
    height: 15px;
    border: 3px solid #BABECF;
    border-radius: 50%;
    margin-top: 3px;
    transition: background-color 0.3s, border-color 0.3s;
}

input[type="radio"]:checked + .radio-indicator {
    border: 6px solid var(--red);
}

.survey_card {
    display: flex;
    flex-direction: column;
    gap: 16px;
    overflow: hidden;
}

.survey_header {
    display: flex;
    justify-content: space-between;
    margin-bottom: 16px;
}

.pre_next {
    display: flex;
    gap: 8px;
}

.splitted-block.survey {
    position: relative;
}

.survey .h_title_block {
    flex-direction: column;
    align-items: start;
    gap: 8px;
}

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

.survey-button {
    display: flex;
    padding: 8px 18px;
    min-width: 104px;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    background: var(--light-blue)
}

    .survey-button.left {
        transform: rotate(180deg);
    }

    .survey-button[disabled] {
        cursor: default;
        background: var(--gray-100);
    }

        .survey-button[disabled] path {
            fill: #BABECF;
        }

.survey-container {
    display: grid;
    grid-template-columns: repeat(6, 100%);
    gap: var(--padding-24-16);
    position: relative;
    left: 0;
    transition: left .3s ease-out;
}

/*  ===========================================================     SURVEY POPUP    ===========================================================  */

.popup.survey .popup-content {
    width: 100%;
}

.popup.survey .popup_content__header {
    display: flex;
    justify-content: space-between;
    margin-bottom: clamp(0.75rem, -0.107rem + 1.79vw, 1.5rem);
}

.survey .answer_links {
    display: flex;
    gap: 20px;
    margin-top: 20px;
}

.popup.survey .answer {
    display: flex;
    gap: 4px;
    flex-wrap: wrap;
}

.popup.survey .answer_header {
    margin-bottom: clamp(0.5rem, 0.214rem + 0.6vw, 0.75rem);
}

.survey .answer_content {
    display: flex;
    flex-direction: column-reverse;
    gap: 20px;
    margin-top: 12px;
}

.popup.survey .answer span {
    padding: 8px;
    border-radius: 4px;
    background: var(--gray-50);
}

.tariff-container .tariff-card {
    width: 100%;
    box-shadow: 0px 0px 20px 0px rgba(12, 26, 85, 0.12);
}

/*  ===========================================================     ACTION LIST    ===========================================================  */

.action_list {
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin-top: 12px;
}

.action-header_wrap {
    display: grid;
    grid-template-columns: 60px 1fr;
    gap: 8px;
    align-items: center;
}

.action-card {
    border-radius: 20px;
    background: var(--white, #FFF);
    box-shadow: 0 0 24px 0 rgba(97, 72, 197, 0.10);
    display: flex;
    padding: 4px;
    flex-direction: column;
    align-items: flex-start;
    align-self: stretch;
    max-width: auto;
}


.action_list .card_header {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 8px;
}

.action_img {
    border-radius: 16px;
    overflow: hidden;
    height: 140px;
    width: 100%;
}

    .action_img img {
        width: 100%;
        height: 140px;
        object-fit: cover;
    }

.actions .active .drop-content_wrap, .advantages .active .drop-content_wrap, .nav_card .active .drop-content_wrap {
    padding-top: 12px;
}

.action-card_content {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 16px;
}

.action-page {
    margin-top: 24px;
}

    .action-page .gray800 {
        font-size: 18px;
        line-height: 1.25;
    }

/*  ===========================================================     LAST NEWS    ===========================================================  */

.last-news-list {
    display: flex;
    flex-direction: column;
    gap: clamp(0.5rem, -0.357rem + 1.79vw, 1.25rem);
}

.last-news-item {
    display: flex;
    gap: 12px;
    min-height: 104px;
}

    .last-news-item .last-news-text {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }

    .last-news-item img {
        width: 100px;
        border-radius: var(--padding-24-12);
        aspect-ratio: 5 / 4;
    }

/*  ===========================================================     SERVICES    ===========================================================  */

.service {
    width: 100%;
    overflow: hidden;
}

    .service .h_title_block {
        width: 100%;
    }

.service-slider {
    width: 100%;
    display: flex;
}

.service-item_wrap {
    padding-left: 8px;
    scroll-snap-align: start; /* �������� ��������� � ������ ��� ��������� */
}

.service-item {
    width: 232px;
    height: 100%;
    display: flex;
    flex-direction: column;
    padding: var(--padding-24-12);
}

    .service-item h3 {
        margin-block: 12px 4px;
    }

.service-img {
    border-radius: var(--padding-24-16);
    aspect-ratio: 26 / 19;
    object-fit: cover;
}

/*  ===========================================================     FAQ    ===========================================================  */

.faq h2 {
    max-width: 600px;
}

.faq .header-label {
    margin: -4px 0 12px;
}

.faq_answer .content {
    max-width: 900px;
    color: var(--gray-800);
}

.active .faq_answer {
    padding-top: 8px;
}

    .active .faq_answer p:not(:last-child) {
        margin-bottom: 10px;
    }

/*.faq_item {
    background-color: #fff;
    padding: 12px 16px;
    border-radius: 0;
    border-bottom: 1px solid var(--gray-100);
    cursor: pointer;
}*/

.faq_item a, .faq_item button {
    font-size: clamp(0.938rem, 0.723rem + 0.45vw, 1.125rem);
    line-height: 1.2;
    white-space: nowrap;
    color: var(--deep-blue);
}

.faq_item button {
    border: none;
    background: none;
    padding: 0;
}

/*    .faq_item:first-child {
        border-radius: var(--padding-24-16) var(--padding-24-16) 0 0;
        padding-top: 16px
    }

    .faq_item:last-child {
        border-radius: 0 0 var(--padding-24-16) var(--padding-24-16);
        border-bottom: none;
        padding-bottom: 16px;
    }*/

/* arrow */
.chevron {
    transition: transform 0.3s ease, opacity 0.3s ease;
}

.active .chevron {
    transform: rotate(180deg);
}

/*  ===========================================================     ORDER FORM    ===========================================================  */

/*.order-form .form_container {
    padding: 20px 16px;
    background: var(--defaul-linar);
    border-radius: var(--border-radius);
    min-height: 275px;
}

.form_container .order {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 16px 0 12px;
}*/

/*  ===========================================================     FOOTER    ===========================================================  */

.footer.politica .container {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding-bottom: 24px;
}

footer {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding-block: 40px 20;
    border-top: 1px solid var(--gray-400);
}

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

.footer_body {
    display: flex;
    justify-content: space-between;
    gap: 20px;
}

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

.footer_bottom .container {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.police-pages {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.nav_item {
    display: flex;
    flex-direction: column;
    background: white;
    padding: var(--padding-24-16);
    border-radius: var(--border-radius);
    cursor: pointer
}

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

.nav_links {
    transition: grid-template-rows .2s, padding-top .2s;
    display: grid;
    grid-template-rows: 0fr;
    cursor: default;
}

a.link.nav_link-item {
    font-family: "MTS Text";
    font-size: 15px;
    font-style: normal;
    font-weight: 500;
    line-height: 100%;
    display: inline-block;
}

.footer.politica {
    padding-top: 0;
}

.nav_item.active .nav_links {
    transition: grid-template-rows .4s, padding-top .4s;
    grid-template-rows: 1fr;
    padding-top: 12px;
}

.mouse-friend {
    display: none;
}

.cookie {
    border-top: 1px solid var(--gray-100);
    background: rgba(255, 255, 255, 0.70);
}

/*  ===========================================================     ActionBannerReel+    ===========================================================  */

.reelPlus {
    overflow: hidden;
    display: flex;
    padding-block: 20px 12px;
    padding-inline: 12px;
    position: relative;
    background: #EB6774;
    border-radius: 20px;
}

    .reelPlus .container-mob {
        display: flex;
        margin-inline: auto;
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
        justify-content: space-between;
        position: relative;
        z-index: 2;
        height: max-content;
    }

    .reelPlus .btn {
        width: 100% !important;
        padding: 16px 28px;
        font-size: clamp(1.063rem, 0.563rem + 1.04vw, 1.5rem);
        line-height: 100%;
    }

.reelPlusBreadcrumbs {
    width: 100%;
    background: white;
    display: flex;
    justify-content: center;
}

    .reelPlusBreadcrumbs .breadcrumbs {
        margin-inline: auto;
    }

.reel_text_content {
    max-width: 554px;
}

    .reel_text_content h1 {
        margin-bottom: clamp(0.5rem, -0.071rem + 1.19vw, 1rem);
    }

    .reel_text_content h1-main,
    .reel_text_content .subtitle {
        color: white;
    }

.reelPlus .mob_option {
    margin-bottom: clamp(0.25rem, -0.321rem + 1.19vw, 0.75rem);
    flex-direction: column;
}

    .reelPlus .mob_option > div {
        display: flex;
        gap: clamp(1rem, 0.714rem + 0.6vw, 1.25rem);
    }

.reelPlus .card_body {
    width: 100%;
}

.reelPlus .card_footer {
    gap: clamp(0.75rem, 0.179rem + 1.19vw, 1.25rem);
}

.reelPlus .header-label {
    margin-top: clamp(0.5rem, 0.214rem + 0.6vw, 0.75rem);
    font-size: clamp(0.938rem, 0.295rem + 1.34vw, 1.5rem);
}

.reelPlus .tariff-card .options {
    display: grid;
    margin-bottom: clamp(0.813rem, 0.313rem + 1.04vw, 1.25rem);
    grid-template-columns: 1fr 1fr 1fr;
    width: 100%;
}

    .reelPlus .tariff-card .options .radio-box {
        padding-block: clamp(0.75rem, 0.464rem + 0.6vw, 1rem);
        align-items: center;
    }

.reelPlus .radio-box {
    gap: 8px;
    padding: 12px;
}

    .reelPlus .radio-box .numeric-m {
        color: var(--gray-600);
    }

    .reelPlus .radio-box.active .numeric-m {
        color: var(--white);
    }

    .reelPlus .radio-box .radio {
        border: 3px solid #818899;
        border: 3px solid var(--gray-600);
        border-radius: 50%;
        height: 16px;
        width: 16px;
        margin-top: 4px;
    }

    .reelPlus .radio-box.active .radio {
        border: 5px solid #fff;
        border: 5px solid var(--white);
        margin-top: 4px;
    }

.blob3b {
    position: absolute;
    bottom: 156px;
    left: 131px;
    width: 650px;
    height: 699px;
    flex-shrink: 0;
    fill: #FF0126;
    filter: blur(150px);
    z-index: 1;
}

.blob5b {
    position: absolute;
    width: 700px;
    height: 480px;
    flex-shrink: 0;
    fill: #FF0D42;
    filter: blur(150px);
    bottom: 156px;
    left: 131px;
    z-index: 1;
}

.blob9b {
    position: absolute;
    bottom: -15px;
    right: 211px;
    position: absolute;
    width: 1069.356px;
    height: 549.798px;
    transform: rotate(-56.887deg);
    flex-shrink: 0;
    fill: #FF2172;
    filter: blur(150px);
    z-index: 1;
}

.blob13b {
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    bottom: -88px;
    right: 0;
    left: 0;
    width: 1069.356px;
    height: 549.798px;
    transform: rotate(-56.887deg);
    flex-shrink: 0;
    fill: #FF2172;
    filter: blur(150px);
    z-index: 1;
}
.tariffs {
    margin: -15px;
}

/*  ===========================================================     DESK    ===========================================================  */

@media (min-width: 768px) {
    header .header.header_main {
        padding: 28px 40px;
        background: var(--gray-50);
        border-radius: 40px 40px 0 0;
    }

    .header-bg_placeholder {
        height: 98px;
    }

    header, .header-bg_placeholder {
        border-radius: 0;
    }

    .header-logo img {
        aspect-ratio: 19 / 3;
        width: 190px;
    }

    .first-block {
        margin-top: 0;
    }

    button.menu .open {
        transform: translateY(1px);
    }

    a, button {
        transition: color .3s;
    }

    .link_blue path {
        transition: fill .3s;
    }

    .link_blue:hover, a.color-blue:hover {
        color: var(--deep-blue-hover);
    }

        .link_blue:hover path {
            fill: var(--deep-blue-hover);
        }

    .square-icon {
        width: 88px;
        height: 88px;
        border-radius: 24px;
    }

        .square-icon img {
            width: 88px;
            height: 88px;
        }

    .text-arrow_right {
        margin-right: 17px;
    }


    .header_city span {
        transition: color .3s;
    }

    .header_city:hover path {
        transition: fill .3s;
    }

    .header_city:hover span,
    .header_city:hover path {
        color: var(--deep-blue);
        fill: var(--deep-blue);
    }

    .btn.contacts {
        background-color: var(--gray-100);
    }

    .btn.menu,
    .btn.order,
    .btn.contacts {
        display: flex;
        align-items: center;
        padding: 12px 20px;
        gap: 4px;
        margin-inline: auto;
    }

        .btn.contacts.active, .btn.contacts:hover {
            background: #DBE2EF;
        }

    .header_btn {
        margin-left: 0;
    }

    .main_banner .baner_akcii {
        border-bottom: none;
        background-color: transparent;
    }

    .btn.menu.active {
        background: var(--red-hover);
    }

    .btn.menu .close {
        display: none;
        transform: translateY(1px);
    }


    .btn.menu.active .open {
        display: none;
    }

    .btn.menu.active .close {
        display: initial;
    }

    .btn.round-desk {
        width: 140px;
        height: 140px;
        border-radius: 50%;
        margin: 0;
        padding: 0;
        text-align: center;
    }

    .banner_content .h1-main, .banner_card__links, .main-subtitle {
        padding: 0;
    }

    .scroll-actions {
        cursor: grab;
        position: relative;
    }

    body.dragging, body.dragging .scroll-actions, body.dragging .service-slider, body.dragging a {
        cursor: grabbing;
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -o-user-select: none;
        user-select: none;
    }

    .baner_akcii .card {
        min-width: 305px;
        padding: 16px;
    }

    .baner_akcii img {
        transition: transform .3s;
    }

    .baner_akcii .img-wrap {
        width: 64px;
        height: 64px;
        overflow: hidden;
        border-radius: 50%;
    }

    .baner_akcii .card:hover img {
        transform: scale(1.3);
    }

    .baner_akcii .promo-title-card {
        width: max-content;
    }

    .scroll-actions .card {
        cursor: inherit;
    }

    .breadcrumbs {
        padding-top: 20px;
        padding-bottom: 28px;
    }

        .breadcrumbs ul {
            display: flex;
            gap: 4px;
            align-items: center;
        }

        .breadcrumbs .p-min {
            color: var(--gray-600);
        }

            .breadcrumbs .p-min.last {
                color: var(--black);
            }

    .popup .popup-container {
        padding: 32px;
        border-radius: 24px;
    }

    .expand .popup-container {
        -webkit-clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
        clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
        inset-block-start: 4px;
        opacity: 0;
        position: fixed;
        transition: opacity 0s ease-in-out .3s, visibility 0s ease-in-out .3s, -webkit-clip-path .3s ease-in-out 0s;
        transition: opacity 0s ease-in-out .3s, visibility 0s ease-in-out .3s, clip-path .3s ease-in-out 0s;
        transition: opacity 0s ease-in-out .3s, visibility 0s ease-in-out .3s, clip-path .3s ease-in-out 0s, -webkit-clip-path .3s ease-in-out 0s;
        visibility: hidden;
    }

    .cities.popup .popup-container {
        inset-inline: calc(50% - 464px);
    }

    /*    .menu.popup .popup-container {
        inset-inline: calc(50% - 406px);
    }*/

    .support.popup .popup-container {
        position: absolute;
        inset-inline: auto 35px;
    }

    .overlay.expand.opened .popup-container {
        -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
        clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
        opacity: 1;
        transition: opacity 0s ease-in-out 0s, visibility 0s ease-in-out 0s, -webkit-clip-path .3s ease-in-out 0s;
        transition: opacity 0s ease-in-out 0s, visibility 0s ease-in-out 0s, clip-path .3s ease-in-out 0s;
        transition: opacity 0s ease-in-out 0s, visibility 0s ease-in-out 0s, clip-path .3s ease-in-out 0s, -webkit-clip-path .3s ease-in-out 0s;
        visibility: visible;
    }

    .overlay.expand.menu.opened .popup-container {
        clip-path: polygon(0 0, 110% 0, 110% 100%, 0 100%);
    }

    .popup-container .close-icon:hover {
        cursor: pointer;
        opacity: .7;
    }

    .popup-container::after {
        content: none;
    }

    .overlay.opened.expand {
        top: 98px;
    }

    .overlay:not(.expand) .popup-container.smooth {
        transition: none;
    }

    .popup.cities .popup-container {
        max-width: 928px;
    }

    .popup.menu .popup-container {
        max-width: 536px;
        padding: 4px;
    }

    .survey .popup-container {
        width: 897px;
    }

    .survey .answer_content {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 20px;
        margin-top: 12px;
    }

    .survey .answer_links {
        margin-top: auto;
    }

    .survey .left {
        display: flex;
        flex-direction: column;
        height: 100%;
    }

    .support .container {
        position: relative;
        height: 100%;
    }

    .support .popup-container {
        display: flex;
        flex-direction: column;
        padding: 24px;
        gap: 32px;
        width: 433px;
    }

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

    .order-form .popup-container {
        width: 500px;
    }

    .cities .title {
        margin-bottom: 16px;
    }

    .city_choise {
        height: auto;
    }

    .city_wrapper {
        height: 489px;
    }

    .city_choise__all {
        display: block;
        column-count: 4;
        padding-bottom: 0;
    }

    .simbol_city {
        gap: 8px;
        margin-bottom: 20px;
    }

    .form-result {
        align-items: start;
    }

    .support-links {
        display: grid;
        grid-template-columns: 88px 1fr;
        align-items: center;
        gap: 8px;
        margin-top: 12px;
    }

    .support .popup-header {
        display: flex;
        flex-direction: column;
        gap: 8px;
    }

    .support-links .apps {
        gap: 5px;
    }

    .support-links2 {
        border-radius: 16px;
        flex-direction: row;
    }

        .support-links2 .apps2 {
            display: none;
        }

    .overlay {
        align-items: flex-start;
        justify-content: center;
    }

    .order-form.overlay, .survey.overlay {
        align-items: center;
    }

    .city_wrapper {
        margin-bottom: 0;
    }

    .city_empty-info {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

        .city_empty-info svg {
            transform: scale(1.5);
            margin: 50px 0 22px;
        }

        .city_empty-info p {
            max-width: 482px;
            text-align: center;
        }

    .menu_navigation {
        gap: 24px;
        padding: 20px 0 20px 24px;
    }

        .menu_navigation .nav_tabs {
            width: 280px;
        }

        .menu_navigation .list {
            flex-direction: row;
            flex-wrap: wrap;
            height: fit-content;
            max-width: 504px;
            gap: 8px;
        }

        .menu_navigation .chips {
            width: auto;
        }

    .baner_akcii .slider_wrapper {
        position: relative;
        left: 0;
        overflow: visible;
        gap: 20px;
    }

    .slider_wrapper.smooth {
        transition: left .3s ease-out;
    }



    .navigation_banner.red {
        background: var(--red);
    }

    .navigation_banner.deep-blue {
        background: var(--deep-blue);
    }

    .navigation_banner.dark-blue {
        background: #5063B1;
    }

    .navigation_banner.puce-red {
        background: #7D293D;
    }

    .navigation_banner.cinnabar {
        background: #E2402A;
    }




    .top-banner {
        padding: 0;
        margin-top: 0;
        border-radius: 0;
    }


    .gigabit {
        padding-bottom: 40px;
    }

    .gigabit-text {
        gap: 8px;
    }

        .gigabit-text .subtitle {
            max-width: 420px;
        }

    .best-info_button:hover .best-info {
        display: block;
    }

    /*    .action-banner {
        position: relative;
        padding: 0;
        margin: 0;
        height: 500px;
        width: 100%;
        display: flex;
        justify-content: center;
    }

    .action-banner-text_wrap {
        align-content: end;
    }

        .action-banner-text_wrap::before {
            content: '';
        }

    .action-banner img {
        aspect-ratio: unset;
        padding: 0;
        height: 100%;
        object-fit: cover;
        position: absolute;
        left: 0;
        top: 0;
    }

    .action-banner-text {
        color: #fff;
        width: 657px;
        z-index: 1;
        padding-bottom: 34px;
    }

        .action-banner-text h1 {
            margin-bottom: 16px;
        }*/

    .tariffs-two_cards {
        padding-inline: 12px;
    }

        .tariffs-two_cards .h_title_block {
            padding-inline: 0;
        }

        .tariffs-two_cards .tariff_slider {
            flex-wrap: wrap;
        }

    .half-price_cards {
        margin-top: 0;
    }

        .half-price_cards .subtitle {
            padding-inline: 0;
            margin-bottom: 24px;
        }

    .tariff_slider {
        gap: 20px;
    }

    .tariff_slider_item {
        width: auto;
        padding-left: 0;
    }

    .tariff-img, .card_header, .options, .mob_option {
        margin-bottom: 16px;
    }

    .card_body__header {
        margin-bottom: 4px;
    }

    .reelPlus .card_body__header {
        margin-bottom: clamp(0.5rem, 0.214rem + 0.6vw, 0.75rem);
    }

    .service_btn {
        flex-direction: column;
        width: 100%;
    }

    .tariff-slider_wrap {
        overflow: hidden;
        width: 100%;
    }

    .tariffs {
        position: relative;
        margin: -15px;
    }

    .tariff_slider-wrap {
        overflow: auto;
        -ms-overflow-style: none;
        scrollbar-width: none;
    }

    .tariff-card .btn.red {
        width: fit-content;
    }

    .tariff-img img {
        border-radius: 32px;
    }

    .tariff_slider {
        position: relative;
        left: 0;
        transition: left .3s ease-out;
        width: min-content;
        padding: 15px;
        padding-right: 30px;
        margin-left:0;
    }

    .tariff-card {
        width: 413px;
        border-radius:40px;
    }

    .card_hidden {
        visibility: hidden;
        transition: opacity 0.3s ease, visibility 0.3s ease;
    }


    .tariff-speed {
        margin-bottom: 16px;
    }

    .price .p-medium {
        margin-bottom: 5px;
    }

    .slider-arrows {
        width: calc(100% + 80px);
        position: absolute;
        left: -40px;
        top: calc(50% - 28px);
        display: flex;
        justify-content: space-between;
        z-index: 5;
        pointer-events: none;
    }

        .slider-arrows .arrow, .onClickSlider .arrow {
            display: flex;
            justify-content: center;
            align-items: center;
            width: 56px;
            height: 56px;
            padding: 10px;
            aspect-ratio: 1/1;
            border-radius: 50%;
            background: var(--white);
            box-shadow: -3px 0px 20px 0px rgba(12, 26, 85, 0.08);
            cursor: pointer;
            pointer-events: all;
        }

            .slider-arrows .arrow svg, .onClickSlider .arrow svg {
                transition: transform .3s ease-out;
            }

            .slider-arrows .arrow:hover svg, .onClickSlider .arrow:hover svg {
                transform: translateX(7px);
            }

            .slider-arrows .arrow.left, .onClickSlider .arrow.left {
                transform: rotate(180deg);
            }

    .action-card {
        border-radius: 28px;
        background: var(--white, #FFF);
        box-shadow: 0 0 24px 0 rgba(97, 72, 197, 0.10);
        max-width: 413px;
    }

    .action-card_content {
        gap: 12px;
        padding: 20px;
    }

    .action_img {
        border-radius: 24px;
        width: 100%;
        height: 200px;
    }

    .action-card img {
        transition: transform .3s ease-out;
        height: 200px;
    }

    .action-card:hover img {
        transform: scale(1.1);
    }

    .action-page {
        margin-top: 0;
    }

        .action-page .action_list {
            display: flex;
            flex-direction: row;
            gap: 20px;
        }

        .action-page .action_img {
            width: 100%;
            border-radius: 24px;
            height: auto;
        }

    .survey_num {
        top: 24px;
        right: 24px;
    }

    .survey-button {
        transition: background-color .3s, color .3s;
    }

        .survey-button path {
            transition: fill .3s;
        }

        .survey-button:hover {
            background-color: var(--deep-blue);
            color: var(--white);
        }

            .survey-button:hover path {
                fill: var(--white);
            }

        .survey-button[disabled]:hover {
            background-color: var(--gray-100);
            color: var(--gray-400);
        }

            .survey-button[disabled]:hover path {
                fill: var(--gray-400);
            }

    .moscow-banner img {
        aspect-ratio: 64 / 11;
    }

    .faq .header-label {
        margin: -12px 0 20px;
    }

    .faq_answer .content {
        color: inherit;
    }

    .faq_item {
        padding: 20px 24px;
    }

        .faq_item:first-child {
            padding-top: 24px
        }

        .faq_item:last-child {
            padding-bottom: 24px;
        }

    .last-news h2 {
        margin-bottom: 4px;
    }

    .last-news-list {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }

        .last-news-list article, .last-news-item, .last-news-text {
            height: 100%;
        }

    .last-news-item {
        flex-direction: column;
    }

        .last-news-item .last-news-text {
            gap: 12px;
        }

        .last-news-item img {
            width: 120px;
            aspect-ratio: 1.1 / 1;
        }


    /*    .order-form .form_container {
        padding: 40px;
        min-height: 199px;
        display: flex;
        align-items: center;
    }*/

    /*    .form_container .order {
        flex-direction: row;
        flex-wrap: wrap;
        margin-top: 20px;
    }*/

    .splitted-block .h_title_block {
        justify-content: flex-start;
        flex-direction: column;
        align-items: start;
        gap: 8px;
    }

    .actions .h_title_block .link_blue {
        margin-top: 16px;
    }

    .splitted-block .form-result {
        flex-direction: row;
        align-items: center;
    }

    .main_banner {
        background: var(--light-blue);
        flex-direction: column-reverse;
    }

        .main_banner .banner_content {
            display: grid;
            align-items: center;
            grid-template-columns: 1fr 1fr;
            gap: 0;
            background-color: transparent;
            padding-inline: 12px;
        }

            .main_banner .banner_content img {
                width: 100%;
                aspect-ratio: 315 / 148;
            }

    .attenuation {
        position: absolute;
        top: 0;
        right: 0;
        height: 100%;
        width: 140px;
        background: linear-gradient(270deg, #E6EFFF 0, rgba(230, 239, 255, 0) 100%);
        pointer-events: none;
        z-index: 10;
    }

        .attenuation.left {
            left: 0;
            background: linear-gradient(270deg, rgba(230, 239, 255, 0) 0, #E6EFFF 100%);
        }

    .splitted-block {
        display: grid;
        grid-template-columns: 1fr 2fr;
        gap: 20px;
    }

    .splitted-block_mob-scroll {
        padding-inline: 12px;
    }

        .splitted-block_mob-scroll .h_title_block {
            padding-inline: 0;
        }

    .order-addres-inputs {
        display: grid;
        grid-template-columns: 1fr 1fr;
        margin-top: 12px;
    }

    .order-address {
        padding-top: 0;
    }

    .order-address-geo .order-addres-inputs {
        grid-template-columns: 220px 1fr;
    }

    .order-address .content-block {
        gap: 32px;
    }

    .order-address .btn.red {
        align-self: start;
    }

    .order-address-form {
        gap: 28px;
    }

    .popup-order_form button[type="submit"] {
        align-self: flex-start;
    }

    .form-agreement {
        align-items: center;
    }

        .form-agreement .p-min {
            max-width: none;
        }

    .form-agreement_input {
        margin: 0;
    }

    .footer_header {
        display: grid;
        grid-template-columns: 279px minmax(min-content, 847px);
        gap: 20px;
        align-items: start;
        justify-content: space-between;
    }


    .footer_bottom {
        border-top: 1px solid var(--gray-400);
        padding-top: 20px;
        width: 100%;
        display: flex;
        justify-content: center;
    }

    .footer_form.order-form {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }

    .footer_form form {
        display: flex;
        gap: 8px;
        margin: 12px 0 8px;
        flex-wrap: wrap;
    }

    .footer_form .form-result {
        max-width: 500px;
        gap: 4px;
    }

    .footer_form input[type="text"] {
        min-width: 367px;
    }

    .mouse-friend {
        display: flex;
        justify-content: center;
        align-items: center;
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100px;
        height: 100px;
        opacity: 0;
        transform: scale(0);
        border-radius: 50%;
        background: rgba(0, 0, 0, 0.40);
        backdrop-filter: blur(5px);
        transition: transform .3s ease-out, opacity .3s ease-in;
        pointer-events: none;
        z-index: 2;
    }

        .mouse-friend.active {
            opacity: 1;
            transform: scale(1);
        }

    .advantages {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 20px;
    }

        .advantages .chevron {
            display: none;
        }

    .advantages-header_wrap {
        flex-direction: column;
        align-items: flex-start;
        gap: 48px;
    }

    .advantages .drop-content_wrap {
        padding-top: 12px;
        grid-template-rows: 1fr;
    }

    .drop-header {
        display: grid;
        grid-template-columns: 1fr 0fr;
        align-items: center;
        gap: 0;
    }

    .service .container-mob {
        position: relative;
    }

    .service-slider {
        gap: 20px;
        overflow-x: visible;
        position: relative;
        left: 0;
    }

    .service-item_wrap {
        padding-left: 0;
    }

    .service-item {
        width: 305px;
        padding: var(--padding-24-12);
    }

        .service-item h3 {
            margin-block: 20px 8px;
        }

    .service-img {
        border-radius: 24px;
        aspect-ratio: 1.69 / 1;
    }

    .ball-wrap {
        position: absolute;
        top: 45px;
        left: 905px;
        border-radius: 50%;
    }

    .ball {
        user-select: none;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        cursor: grab;
        position: relative;
        width: 120px;
        height: 120px;
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 4px;
        border-radius: 50%;
        background: rgba(194, 220, 255, 0.40);
        backdrop-filter: blur(5px);
        z-index: 1;
    }

        .ball.smooth {
            transition: left .3s ease-out;
        }

        .ball span {
            font-size: 17px;
            font-weight: 500;
        }

    .dragging .ball {
        cursor: grabbing;
    }

    button[data-scramble].red:hover {
        background: var(--red);
    }


    /*  ===========================================================     ActionBannerReel+    ===========================================================  */

    .reelPlus {
        overflow: hidden;
        display: flex;
        padding-block: 60px;
        position: relative;
        background: #EB6774;
        border-radius: 0;
    }

        .reelPlus .container-mob {
            flex-direction: row;
            align-items: center;
        }

    .reel_text_content {
        max-width: 554px;
    }

        .reel_text_content h1 {
            margin-bottom: clamp(0.5rem, -0.071rem + 1.19vw, 1rem);
        }

        .reel_text_content h1-main,
        .reel_text_content .subtitle {
            color: white;
        }

    .reelPlus .mob_option {
        display: flex;
        flex-direction: column;
        margin-bottom: clamp(0.25rem, -0.321rem + 1.19vw, 0.75rem);
    }

    .reelPlus .content-block {
        padding: clamp(1rem, -0.714rem + 3.57vw, 2.5rem);
        max-width: 550px;
        width: 100%;
    }

    .reelPlus .card_footer {
        gap: clamp(0.75rem, 0.179rem + 1.19vw, 1.25rem);
    }

    .reelPlus .header-label {
        margin-top: clamp(0.5rem, 0.214rem + 0.6vw, 0.75rem);
        font-size: clamp(0.938rem, 0.295rem + 1.34vw, 1.5rem);
    }

    .reelPlus .radio-box {
        gap: 12px;
    }

        .reelPlus .radio-box .radio {
            border: 3px solid #818899;
            border: 3px solid var(--gray-600);
            border-radius: 50%;
            height: 18px;
            width: 18px;
            margin-top: 5px;
        }

    .reelPlus .btn {
        width: 100% !important;
        padding: 24px 28px;
        font-size: clamp(1.063rem, 0.563rem + 1.04vw, 1.5rem);
    }

    .reelPlus .radio-box.active .radio {
        border: 6px solid #fff;
        border: 6px solid var(--white);
        margin-top: 5px;
    }

    .blob3b {
        position: absolute;
        bottom: 156px;
        left: 131px;
        width: 650px;
        height: 699px;
        flex-shrink: 0;
        fill: #FF0126;
        filter: blur(150px);
        z-index: 1;
    }

    .blob5b {
        position: absolute;
        width: 700px;
        height: 480px;
        flex-shrink: 0;
        fill: #FF0D42;
        filter: blur(150px);
        bottom: 156px;
        left: 131px;
        z-index: 1;
    }

    .blob9b {
        position: absolute;
        bottom: -15px;
        right: 211px;
        position: absolute;
        width: 1069.356px;
        height: 549.798px;
        transform: rotate(-56.887deg);
        flex-shrink: 0;
        fill: #FF2172;
        filter: blur(150px);
        z-index: 1;
    }

    .blob13b {
        position: absolute;
        margin-left: auto;
        margin-right: auto;
        bottom: -88px;
        right: 0;
        left: 0;
        width: 1069.356px;
        height: 549.798px;
        transform: rotate(-56.887deg);
        flex-shrink: 0;
        fill: #FF2172;
        filter: blur(150px);
        z-index: 1;
    }

    .mary-bait {
        position: fixed;
        top: 98px;
        left: calc(50% + 141px);
        width: calc(50% - 141px);
        z-index: 500;
        height: 302px;
        cursor: pointer;
    }

    .mary-bait_button-wrap {
        width: 100%;
        height: 100%;
        position: relative;
    }

    .mary-bait_button {
        position: absolute;
        top: 18px;
        left: 262px;
        padding: 12px 20px 12px 12px;
        border-radius: 16px;
        background: var(--deep-blue, #0B71FF);
        box-shadow: 0px 0px 12px 0px rgba(13, 33, 60, 0.30);
        opacity: 0;
        display: flex;
        gap: 8px;
        align-items: center;
        transition: opacity .3s;
        color: #fff;
        z-index: 500;
    }

    .mary-bait:hover .mary-bait_button {
        opacity: 1;
    }

    .mary-bait.fixed .mary-bait_button {
        opacity: 1;
        top: 0;
        left: 0;
    }

    .mary-bait.fixed {
        height: 74px;
        width: 238px;
        top: 116px;
        left: calc(50% + 402px);
    }

    .mary-bait_text {
        color: #fff;
        font-family: "MTS Text";
        font-size: 17px;
        font-weight: 500;
        display: flex;
        flex-direction: column;
    }

        .mary-bait_text .p-min {
            opacity: .6;
        }

    .survey-mary.overlay {
        align-items: center;
    }

    .survey-mary .popup-container {
        padding: 24px 0;
        width: 417px;
        min-height: 359px;
        display: flex;
        flex-direction: column;
    }

    .mary-container {
        flex: 1;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: flex-start;
        gap: 12px;
        overflow: hidden;
    }

    .mary-question_text {
        margin-bottom: 12px;
    }

    .survey-mary .custom-radio {
        display: flex;
        align-items: end;
        gap: clamp(0.25rem, -0.036rem + 0.6vw, 0.5rem);
        padding: 4px 0;
        cursor: pointer;
    }

    .survey-mary input[type="radio"] {
        display: none;
    }

    .mary-question_wrap {
        flex: 1;
        width: 100%;
        display: grid;
        grid-auto-columns: 100%;
        grid-auto-flow: column;
        position: relative;
        left: 0;
        transition: left .3s ease-out;
    }

    .mary-button_next {
        margin-left: 24px;
    }

    .mary-question {
        display: flex;
        flex-direction: column;
        padding: 0 24px;
    }

    .mary-textarea {
        flex: 1;
        padding: 12px 16px;
        font-size: 17px;
        width: 100%;
        border-radius: 8px;
        background: var(--gray-50);
        resize: none;
        border: none;
    }

        .mary-textarea::placeholder {
            color: var(--gray-600);
            font-size: 17px;
        }

    .final .popup-container {
        justify-content: center;
    }

    .final .mary-question_wrap {
        left: auto !important;
        right: 0;
    }

    .final .mary-container {
        flex: 0;
        align-items: center;
        gap: 20px;
    }

    .final .mary-question {
        align-items: center;
        gap: 20px;
        display: none;
    }

        .final .mary-question[data-question_id="8"] {
            display: flex;
        }

    .final .mary-question_text {
        text-align: center;
        margin-bottom: 0;
    }

    .final .mary-button_next {
        margin: 0;
    }
}

@media (min-width: 1280px) {
    .tariffs-two_cards .tariff_slider {
        flex-wrap: nowrap;
    }

    .form_container .order {
        display: grid;
        grid-template-columns: 1fr 1fr min-content;
    }

    .splitted-block {
        grid-template-columns: 413px 846px;
    }

    .mobile-scroll {
        padding: 15px;
        padding-right: 30px;
    }
}

/*  ===========================================================     Tariffs Page    ===========================================================  */
.tariff_banner {
    background: rgba(0, 0, 0, 0.91);
    overflow: hidden;
}

    .tariff_banner .container {
        max-width: 1304px;
        padding-left: 12px;
        padding-right: 12px;
        margin-inline: auto;
        width: 100%;
        display: flex;
        padding-block: 32px;
        flex-direction: column;
    }

    .tariff_banner h2 {
        color: white;
    }

.tariff_banner__img {
    position: relative;
    z-index: 2;
    width: clamp(20.438rem, 12.276rem + 28.51vw, 37.938rem);
    height: clamp(13.5rem, 8.107rem + 18.84vw, 25.063rem);
    flex-shrink: 0;
    margin: 28px 0 24px;
}

    .tariff_banner__img .kion_img__banner {
        position: relative;
        z-index: 2;
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
    }

.blobT2 {
    position: absolute;
    z-index: 1;
    width: 350px;
    right: -143px;
    bottom: 5px;
}

.blobT1 {
    position: absolute;
    z-index: 1;
    width: 350px;
    left: -155px;
    bottom: -130px;
}


.tariff_banner__text {
    position: relative;
    z-index: 2;
    padding-left: 0px;
    margin-left: 0;
    max-width: auto;
    min-width: 320px;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.tariff_banner__header {
    white-space: nowrap;
}

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

.linksCard .advantages-header_wrap {
    gap: clamp(0.5rem, 0.214rem + 0.6vw, 0.75rem);
}

.linksCard .square-icon,
.linksCard .square-icon img {
    background: none;
    width: clamp(6.25rem, 1.964rem + 8.93vw, 10rem);
    height: clamp(6.25rem, 1.964rem + 8.93vw, 10rem);
    transform: none;
}

.advantages.container-mob {
    display: flex;
    width: 100%;
}

.advantages_wrapper {
    width: 100%;
}

.advantages_slider {
    display: flex;
    grid-template-columns: 1fr 1fr;
    gap: 0px;
}

.advantages.container-mob .advantages_wrapper {
    display: flex;
    width: 100%;
    position: relative;
}

.splitted-block.linksCard {
    padding-inline: 0;
}

.linksCard .drop-content {
    margin-bottom: auto;
}

.link_clue__card {
    font-size: 15px;
    margin-top: clamp(0.75rem, -0.536rem + 2.68vw, 1.875rem);
}

.advantage_slider_item .content-block {
    display: flex;
    flex-direction: column;
    align-items: start;
    width: 318px;
    height: 100%;
}

.advantage_slider_item .advantages-header_wrap {
    flex-direction: column;
    margin-bottom: 8px;
}

.mleft-mob .h_title_block {
    margin-left: 8px;
    margin-right: auto;
    margin-bottom: 12px;
}

.mleft-mob .h-title-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: clamp(0.75rem, 0.179rem + 1.19vw, 1.25rem);
    flex-direction: column;
}

.mleft-mob {
    margin-top: 16px;
}

.linksCard.mleft-mob {
    margin-top: 0px;
}

.mleft-mob .h-title-header .main-date {
    margin-top: clamp(0.5rem, -0.357rem + 1.79vw, 1.25rem);
}


    .mleft-mob .h-title-header .main-date :last-child {
        display: flex;
        flex-direction: column-reverse;
    }
.splitted-block .tariff_slider {
    margin-left: -10px;
    margin-right: -15px;
    padding-right: 15px;
}


@media (min-width: 768px) {
    .splitted-block .tariff_slider {
        margin-left: 0px;
    }
    .tariff_banner {
        background: rgba(0, 0, 0, 0.91);
    }

        .tariff_banner .container {
            flex-direction: row;
            padding-block: 73.3px 80.55px;
        }

        .tariff_banner h2 {
            color: white;
        }

    .tariff_banner__img {
        width: clamp(20.438rem, 12.276rem + 28.51vw, 37.938rem);
        height: clamp(13.5rem, 8.107rem + 18.84vw, 25.063rem);
        flex-shrink: 0;
    }

        .tariff_banner__img .kion_img__banner {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
            position: relative;
            z-index: 2;
        }

    .blobT2 {
        position: absolute;
        z-index: 1;
        width: 480px;
        right: -187px;
        top: -95px;
    }

    .blobT1 {
        position: absolute;
        z-index: 1;
        width: 480px;
        left: -130px;
        bottom: -98px;
    }



    .tariff_banner__text {
        padding-left: 12px;
        margin-left: auto;
        max-width: 413px;
        min-width: 350px;
        width: 100%;
        display: flex;
        flex-direction: column;
        gap: 72px;
    }

        .tariff_banner__text .banner_text__content {
            display: flex;
            flex-direction: column;
            gap: 12px;
        }

    .advantages.container-mob {
        display: flex;
        width: 100%;
    }

    .advantages_wrapper {
        width: 100%;
    }

    .advantages_slider {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 20px;
    }

    .advantages.container-mob .advantages_wrapper {
        display: flex;
        width: 100%;
        position: relative;
    }

    .advantage_slider_item .content-block {
        width: 100%;
    }

    .link_clue__card {
        font-size: 15px;
        margin-top: clamp(0.75rem, -0.536rem + 2.68vw, 1.875rem);
    }

    .advantage_slider_item {
        width: auto;
        padding-left: 0px;
        scroll-snap-align: none;
    }

    .splitted-block.linksCard {
        padding-inline: 12px;
    }

    .advantage_slider_item .advantages-header_wrap {
        flex-direction: column;
        margin-bottom: 12px;
    }

    .mleft-mob .h_title_block {
        margin-bottom: auto;
        margin-right: 0;
    }

    .mleft-mob .h-title-header {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        margin-bottom: clamp(0.75rem, 0.179rem + 1.19vw, 1.25rem);
        flex-direction: column;
    }

        .mleft-mob .h-title-header .main-date {
            margin-top: clamp(0.5rem, -0.357rem + 1.79vw, 1.25rem);
            display: flex;
            width: 100%;
            justify-content: space-between;
        }

            .mleft-mob .h-title-header .main-date p {
                max-width: 602px;
            }

            .mleft-mob .h-title-header .main-date :last-child {
                display: flex;
                flex-direction: column-reverse;
            }

    .mleft-mob {
        margin-top: 0px;
    }
}
/*  ===========================================================     TOOLS    ===========================================================  */

.hidden {
    display: none !important;
}

@media (min-width: 769px) {
    .mob {
        display: none;
    }
}

@media (max-width: 768px) {
    .desk {
        display: none;
    }
}



/*--------------------------------moscow_gmts---------------------------------*/

.header_main {
    display: flex;
    margin-inline: auto;
    justify-content: space-between;
    width: 100%;
    margin-top: 0;
    border-radius: 20px 20px 0 0;
    padding: 12px;
}

    .header_main .header_city {
        margin-left: 16px;
    }

    .header_main.container {
        display: flex;
        margin-top: 0;
        padding: 0;
        background: none;
        transition: background-color 0.3s ease, padding 0.3s ease;
        align-items: center;
    }

.scrolled .header_main.container {
    background: rgba(0, 0, 0, 0);
}

.main_action_banner {
    margin: auto;
    max-width: 1304px;
    display: flex;
    padding: 20px;
    flex-direction: column;
    align-items: flex-end;
    gap: 36px;
    border-radius: 20px;
    background: var(--gray-50, #F6F7FB);
}

    .main_action_banner h1 {
        font-family: "MTS Wide";
        font-size: clamp(1.188rem, 0.259rem + 1.93vw, 2rem);
        font-style: normal;
        font-weight: 500;
        line-height: 110%;
    }

    .main_action_banner .header-label {
        max-width: 807px;
        margin: 0;
        color: var(--gray-600, #818899);
        font-family: "MTS Text";
        font-size: clamp(1rem, 0.857rem + 0.3vw, 1.125rem);
        font-style: normal;
        font-weight: 400;
        line-height: 125%;
    }

    .main_action_banner .txt-content {
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        align-items: flex-start;
        gap: 8px;
        margin: 0;
    }

.navigation_banner {
    position: relative;
    width: 247px;
    height: 238px;
    flex-shrink: 0;
    background: linear-gradient(203deg, rgba(134, 156, 255, 0.00) 51%, rgba(134, 156, 255, 0.50) 84.89%);
    backdrop-filter: blur(6px);
    overflow: hidden;
    border-radius: 20px;
}

    .navigation_banner .best-subtitle {
        display: flex;
        padding: 4px 8px;
        justify-content: center;
        align-items: center;
        width: fit-content;
        gap: 10px;
        color: var(--white, #FFF);
        font-family: "MTS Text";
        font-size: 14px;
        font-style: normal;
        font-weight: 500;
        line-height: 100%;
        border-radius: 6px;
        background: var(--deep-blue, #0B71FF);
    }

    .navigation_banner .content {
        display: flex;
        flex-direction: column-reverse;
        gap: 12px;
        position: absolute;
        z-index: 2;
        bottom: 24px;
        left: 24px;
    }

    .navigation_banner .h3-accent-min {
        color: white;
        max-width: 272px;
    }

.chips.link.nav_link-item {
    display: flex;
    align-items: center;
    gap: 12px;
}

@media (min-width: 768px) {
    .header_main {
        display: flex;
        margin-inline: auto;
        justify-content: space-between;
        width: 100%;
        margin-top: 12px;
        border-radius: 20px 20px 0 0;
        padding-inline: 12px;
        padding-block: 0;
    }

        .header_main.container {
            background: var(--gray-50);
            padding: 28px 40px;
            transition: background-color 0.3s ease, padding 0.3s ease;
            max-width: 1280px;
        }

        .header_main .header_city {
            margin-left: 40px;
        }

    .scrolled .header_main.container {
        background: rgba(0, 0, 0, 0);
    }

    .main_action_banner {
        display: flex;
        flex-direction: row;
        margin-top: -1px;
        border-radius: 0 0 20px 20px;
        width: 100%;
        padding: 60px 40px 40px 40px;
        align-items: flex-start;
        gap: 20px;
        align-self: stretch;
        align-items: flex-end;
        justify-content: space-between;
    }

        .main_action_banner .txt-content {
            display: flex;
            max-width: 616px;
            flex-direction: column;
            justify-content: flex-end;
            align-items: flex-start;
            gap: 20px;
            margin: 0;
        }

    .navigation_banner {
        position: relative;
        width: 373px;
        height: 348px;
        flex-shrink: 0;
        background: linear-gradient(203deg, rgba(134, 156, 255, 0.00) 51%, rgba(134, 156, 255, 0.50) 84.89%);
        backdrop-filter: blur(6px);
        overflow: hidden;
        border-radius: 32px;
    }

        .navigation_banner img {
            position: absolute;
            z-index: 1;
            width: 373px;
            height: 348px;
        }

        .navigation_banner .content {
            display: flex;
            flex-direction: column-reverse;
            gap: 12px;
            position: absolute;
            z-index: 2;
            bottom: 24px;
            left: 24px;
        }

    .navigation .list img {
        display: none;
    }
}

/*---------------------- tariff ------------------------*/
/*.tariffs {
    margin-left: -30px;
}
.tariff_slider_item{
    margin-block:10px;
}
.tariff_slider_item:first-child {
    margin-left: 20px;
}
.tariff_slider_item:last-child {
    margin-right: 20px;
}*/
/*-----------------------------advanteges 2col*--------------------------------*/
.el_2col {
    display: block;
    flex-direction: column;
    gap: 12px;
    padding: 16px;
    background: var(--gray-50);
    height: auto;
    padding: 20px;
}

    .el_2col .square-icon img {
        width: 40px;
    }

@media (min-width: 768px) {
    .el_2col {
        display: flex;
        flex-direction: column;
        gap: 12px;
        padding: 16px;
        background: var(--gray-50);
        height: auto;
        padding: 40px;
    }

        .el_2col .drop-header {
            gap: 48px;
        }

        .el_2col .drop-content_wrap {
            padding: 0;
        }

        .el_2col .square-icon img {
            width: 88px;
            transform: scale(1)
        }
}

/*-----------------------------order_form--------------------------------*/
.order-form form > div {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.order-form .order_header {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

    .order-form .order_header h2 {
        color: var(--gray-400, #BABECF);
        font-family: "MTS Text";
        font-size: 18px;
        font-style: normal;
        font-weight: 500;
        line-height: 100%;
    }

.order-form .order {
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.form-agreement_correct {
    margin-top: -12px;
}

@media (min-width: 768px) {
    .order-form form > div {
        align-items: center;
        gap: 40px;
    }

    .order-form .order_header {
        gap: 20px;
        align-items: center;
        max-width: 830px;
    }

        .order-form .order_header h2 {
            color: var(--gray-400, #BABECF);
            text-align: center;
            font-family: "MTS Wide";
            font-size: 30px;
            font-style: normal;
            font-weight: 500;
            line-height: 110%;
        }

    .order-form .order {
        display: grid;
        grid-template-columns: 1fr 1fr min-content;
        max-width: 686px;
        flex-direction: row;
        gap: 12px;
    }

    .form-agreement_correct {
        margin-top: -20px;
    }
}

/*  -------------------------------------------  faq ------------------------------------*/

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

.faq_item {
    cursor: pointer;
    padding: 16px;
    background: var(--gray-50);
    border-radius: 16px;
}

.linarr {
    border-radius: 16px;
    background: var(--gray-50, #F6F7FB);
}

@media (min-width: 768px) {
    .linarr {
        border-radius: 40px;
        background: linear-gradient(180deg, #F6F7FB 0%, rgba(246, 247, 251, 0.00) 100%);
    }

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

    .faq_item {
        border-radius: 24px;
        padding: 28px;
    }
}
/*----------------------------------nav_card---------------------------------*/

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

.nav_card_el {
    display: flex;
    flex-direction: column;
    padding: 16px;
    border-radius: 16px;
}

.half_size .nav_img {
    width: 40px;
}

.full_size .nav_img {
    width: 100%;
}

.nav_card .half_size,
.nav_card .full_size {
    width: 100%;
}

.nav_card_el.blue, .half_size.blue {
    background: #F0F9FF;
}

.nav_card_el.green, .half_size.green {
    background: #EDFFF4;
}

.half_size.purple {
    background: #F1ECFF;
}

.nav_card_el.red {
    background: linear-gradient(180deg, #FEEEFF 0%, #FFF3EC 100%);
}

.half_size.red {
    background: #FFEDED;
}

.half_size.gray {
    background: var(--gray-50);
}

@media (min-width: 768px) {
    .nav_card {
        display: grid;
        gap: 20px;
        grid-template-columns: 1fr 1fr;
    }

        .nav_card .full_size {
            display: grid;
            grid-template-columns: 1fr 1fr;
            min-height: 400px;
            grid-column: 1 / -1;
            align-items: center;
            padding: 40px;
            gap: 20px;
            border-radius: 40px;
        }

        .nav_card .half_size {
            min-height: 220px;
            padding: 40px;
            gap: 48px;
            border-radius: 40px;
        }

        .nav_card .drop-content_wrap {
            padding-top: 0;
            gap: 12px;
        }

        .nav_card .full_size .drop-content_wrap {
            max-width: 444px;
        }

        .nav_card .chevron {
            display: none;
        }

    .half_size .nav_img {
        width: 88px;
    }
}

/*----------------------------------news---------------------------------*/
.last-news-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.last-news-item {
    display: flex;
    min-width: 318px;
    padding: 20px;
    flex-direction: column;
    align-items: flex-start;
    gap: 32px;
    border-radius: 20px;
    background: var(--gray-50, #F6F7FB);
}

@media (min-width: 768px) {
    .last-news-list {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        gap: 20px;
    }

    .last-news-item {
        padding: 40px;
        gap: 48px;
    }
}
/*-------------------------------------------footer-----------------------------------------*/
footer {
    padding-block: 40px 20px;
}

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

.footer_header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 28px;
    flex-direction: column;
}

    .footer_header img {
        width: 255px;
    }

.footer_moreLinks, .footer_moreLinks2 {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
    margin-top: 8px;
}

.footer_moreLinks2 {
    gap: 8px;
}

.footer_moreLinks .link_clue__card {
    font-size: 15px;
    margin-top: 0;
}

.nav_link-list {
    overflow: hidden;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}
.nav_link-list li{
  cursor:pointer;
border-radius: 12px;
background: var(--gray-50, #F6F7FB);
  display: flex;
padding: 12px 16px;
justify-content: center;
align-items: center;
gap: 2px;
}
.nav_link-list li:hover{
 background:#DBE2EF;
}

.footer_moreLinks2 a {
    margin-right: 16px;
}

.footer_moreLinks .link_blue {
    margin-right: 8px;
}

.footer_moreLinks:nth-child(2) {
    margin-bottom: 20px;
}

@media (min-width: 768px) {
    footer {
        padding-block: 60px 40px;
    }

    .footer_header {
        display: grid;
        grid-template-columns: 279px minmax(min-content, 847px);
        gap: 20px;
        align-items: start;
        justify-content: space-between;
    }

        .footer_header img {
            width: 278px;
        }

    .footer_moreLinks {
        margin-bottom: 20px;
        margin-top: 20px;
    }

    .footer_moreLinks, .footer_moreLinks2 {
        gap: 40px;
    }

    .
{
        gap: 8px;
    }

    .footer_moreLinks .link_blue {
        margin: 0;
    }
}

/*-------------------- main-slider-tab -----------------------*/

.tab_banner {
    overflow: hidden; /* Предотвращаем выход за границы */
    width: 100%;
}

    .tab_banner .slider {
        display: flex;
        flex-direction: column;
        gap: 12px;
        height: 100%;
        transition: transform 0.3s ease;
        width: 100%;
    }

    .tab_banner p {
        color: var(--gray-800);
    }


        .tab_banner .el {
            display: flex;
            padding: 20px;
            flex-direction: column;
            align-items: center;
            gap: 16px;
            align-self: stretch;
            border-radius: 40px;
            background: linear-gradient(180deg, #F6F7FB 0%, rgba(246, 247, 251, 0.20) 100%);
            flex-shrink: 0;
            width: 100%;
            position: relative; /* Добавляем для позиционирования bg_img */
            overflow: hidden; /* Чтобы bg_img не выходили за пределы */
        }

.tab_banner_textContent {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

    .tab_banner_textContent a {
        margin-top: 4px;
    }

.tab_banner_main_img {
    position: relative;
    z-index: 2;
    width: 166px;
}
.el_solo .tab_banner__img .tab_banner_main_img {
    width: 311px;
    height: 192px;
}

.bg_img {
    position: absolute;
    visibility: hidden;
    z-index: 1;
}

.onClickSlider {
    display: none;
}

    .onClickSlider .arrow {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 60px;
        height: 60px;
        padding: 10px;
        aspect-ratio: 1/1;
        border-radius: 50%;
        background: var(--gray-100);
        cursor: pointer;
        pointer-events: all;
        box-shadow:none;
    }

        .onClickSlider .arrow svg {
            transition: transform .3s ease-out;
        }

        .onClickSlider .arrow:hover svg {
            transform: translateX(7px);
        }

        .onClickSlider .arrow.left {
            transform: rotate(180deg);
        }
.double_p{
    padding-block:20px;
}


@media (min-width: 768px) {
    .double_p {
        padding-block: 60px;
    }
    .onClickSlider {
        display: flex;
        gap: 8px;
        margin-top: 24px;
        overflow: hidden;
    }

    .tab_banner {
        overflow: hidden;
        border-radius: 40px;
        width: 100%;
        background: linear-gradient(180deg, #F6F7FB 0%, rgba(246, 247, 251, 0.20) 100%);
        min-height: 516px;
        align-self: stretch;
    }

        .tab_banner .el {
            position: relative;
            overflow: hidden;
            flex-direction: row;
            justify-content: space-between;
            padding: 58px 109px;
            min-height: 100%;
        }


    .tab_banner_textContent {
        position: relative;
        z-index: 2;
        display: flex;
        flex-direction: column;
        gap: 16px;
        max-width: 521px;
    }
    .tab_banner .el_solo {
        gap: 20px;
    }
    .el_solo .tab_banner_textContent {
        max-width: 737px;
    }

        .tab_banner_textContent a {
            margin-top: 8px;
        }

    .tab_banner_main_img {
        width: 439px;
    }
    .el_solo .tab_banner__img .tab_banner_main_img {
        width: 355px;
        height: 229px;
    }

    .bg_img {
        visibility: visible;
    }

        .bg_img.tab_banner__img-1 {
            position: absolute;
            width: 755px;
            top: 17px;
            left: 21%;
        }

        .bg_img.tab_banner__img-2 {
            position: absolute;
            width: 582px;
            top: 40px;
            left: 39px;
        }

        .bg_img.tab_banner__img-3 {
            position: absolute;
            top: 96px;
            left: 14%;
            width: 778px;
        }

        .bg_img.tab_banner__img-4 {
            position: absolute;
            top: 12px;
            left: 257px;
            width: 378px;
        }

        .bg_img.tab_banner__img-5 {
            position: absolute;
            top: 12px;
            left: 7%;
            width: 767px;
        }

    .tab_banner .slider {
        display: flex;
        flex-direction: row;
        transition: transform 0.3s ease;
        width: 100%;
        height: 100%;
        gap: 0px;
    }
}

/*----------------------------action page--------------------------------*/

.action_banner__img, .action_banner__img img {
    width: 311px;
    height: 160px;
    object-position: right;
    object-fit: cover;
    flex-shrink: 0;
    display: flex;
    background: linear-gradient(203deg, rgba(134, 156, 255, 0.00) 51%, rgba(134, 156, 255, 0.50) 84.89%);
    backdrop-filter: blur(6px);
    border-radius: 20px;
}

.action_banner__content {
    display: grid;
    z-index: 1;
    padding: 20px;
    align-items: center;
    grid-template-columns: 1fr;
    gap: 20px;
    align-self: stretch;
    border-radius: 20px;
    background: var(--gray-50, #F6F7FB);
}

.action_banner__content_txt {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.action_banner__content .p-md {
    color: var(--gray-600);
}

.action_banner .p-sm {
    font-family: "MTS Text";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 110%;
    display: flex;
    width: fit-content;
    gap: 4px;
    padding: 4px;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    background: var(--deep-blue, #0B71FF);
    color: white;
}

.action_banner.noImg .action_banner__content {
    gap: 12px;
}

.action_banner.noImg .p-md {
    max-width: 700px;
}

@media (min-width: 768px) {
    .action_banner__img, .action_banner__img img {
        width: 580px;
        height: 348px;
        object-position: right;
        object-fit: cover;
        flex-shrink: 0;
        display: flex;
        background: linear-gradient(203deg, rgba(134, 156, 255, 0.00) 51%, rgba(134, 156, 255, 0.50) 84.89%);
        backdrop-filter: blur(6px);
        border-radius: 32px;
    }

    .action_banner__content {
        display: grid;
        z-index: 1;
        position: relative;
        padding: 40px;
        align-items: center;
        grid-template-columns: 1fr 1fr;
        gap: 40px;
        align-self: stretch;
        border-radius: 40px;
        background: var(--gray-50, #F6F7FB);
    }

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

    .action_banner .p-sm {
        padding: 8px;
    }

    .action_banner.noImg .action_banner__content {
        align-items: start;
        grid-template-columns: 1fr 2fr;
        gap: 20px;
    }
}
/*-----------------adwantages-----------------------*/
.advantages .content-block,
.splitted-block .advantages .content-block {
    padding: 16px;
}
.advantages.step .content-block.gray {
    background:var(--gray-50);
}
.tab_banner .btn {
    width: 100%;
}
.big_num {
    color: var(--gray-100, #E6E9EF);
    font-family: "MTS Wide";
    font-size: 80px;
    font-style: normal;
    font-weight: 500;
    line-height: 100%; /* 80px */
    text-transform: uppercase;
    height: 64px;
    overflow: hidden;
    margin-bottom:16px;
}
.num_step .drop-content_wrap {
    display: grid;
    grid-template-rows: 1fr;
    transition: grid-template-rows .4s, padding-top .4s;
    cursor: default;
}

@media (min-width: 768px) {
    
    .advantages.step {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        gap: 20px;
    }

        .advantages.step .drop-content_wrap {
            padding: 24px 0 12px 0;
        }

        .advantages.step .link_clue__card {
            margin: 0;
        }
        .advantages .content-block {
            padding: 40px;
        }
   

    .splitted-block .advantages .content-block {
        padding: 24px;
    }

    .big_num {
        color: var(--gray-100, #E6E9EF);
        font-family: "MTS Wide";
        font-size: 120px;
        font-style: normal;
        font-weight: 500;
        line-height: 100%;
        text-transform: uppercase;
        height: 96px;
        overflow: hidden;
        margin-bottom:0;
    }
}


/*------------delete------------*/
.old_nav_card {
    display: flex;
}

    .old_nav_card .nav_card_el {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

.old_nav .advantages-header_wrap {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-direction: column;
}

.old_nav .square-icon {
    width: 100%;
    height: 100%;
}

    .old_nav .square-icon img {
        width: 100%;
        object-fit: scale-down;
        height: 200px;
    }

.old_nav .drop-header {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.old_nav .chevron {
    display: none;
}

.old_nav .drop-content_wrap {
    display: flex;
    flex-direction: column;
}


.advantages.no_roll {
    grid-template-columns: 1fr;
}

    .advantages.no_roll .h3-accent {
        color: var(--gray-800, #54585C);
        font-family: "MTS Text";
        font-size: 15px;
        font-style: normal;
        font-weight: 400;
        line-height: 125%;
    }

    .advantages.no_roll .drop-header {
        display: flex;
    }

.wifi_tv {
    display: flex;
    flex-direction: column;
    gap: 20px;
    align-items: center;
}

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

    .wifi_tv__content li {
        list-style: inside;
    }

.wifi_tv img {
    width: auto;
}

.old_adw_container {
    display: grid;
    grid-template-columns: 1fr;
    gap: 40px;
}

.old_card_adwantages {
    display: flex;
    flex-direction: row;
    gap: 8px;
    align-items: center;
}

.old_adw_container span {
    font-weight: 500;
    text-align: start;
}

.old_adw_container img {
    width: 40px;
    aspect-ratio: 1;
}

.old_h2_title {
    margin-bottom: 12px;
}

.old_content_txt {
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-items: center
}

    .old_content_txt span {
        font-size: 1rem;
        font-weight: 400;
        color: var(--gray-800);
    }

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

.old_step__card {
    display: flex;
    flex-direction: column;
    gap: 30px;
    padding: 30px 17px 20px;
    border-radius: 15px;
    border: 1px solid var(--gray-100);
}

@media (min-width: 768px) {
    .old_step {
        display: grid;
        grid-template-columns: repeat(4,1fr);
        gap: 20px;
    }

    .old_step__card {
        display: flex;
        flex-direction: column;
        gap: 30px;
        padding: 80px 17px 20px;
        border-radius: 15px;
        border: 1px solid var(--gray-100);
    }

    .old_content_txt {
        display: flex;
        flex-direction: column;
        gap: 12px;
        align-items: center
    }

        .old_content_txt h3 {
            text-align: center;
        }

        .old_content_txt span {
            font-size: 1rem;
            font-weight: 400;
            color: var(--gray-800);
        }

    .old_h2_title {
        margin-bottom: 50px;
    }

    .old_nav_card {
        display: flex;
    }

        .old_nav_card .nav_card_el {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 40px;
        }

    .old_nav .drop-content_wrap {
        display: flex;
    }

    .old_nav .advantages-header_wrap {
        display: none;
    }

    .advantages.no_roll {
        grid-template-columns: 1fr 1fr 1fr;
    }

        .advantages.no_roll .h3-accent {
            color: var(--gray-800, #54585C);
            font-family: "MTS Text";
            font-size: 18px;
            font-style: normal;
            font-weight: 400;
            line-height: 125%;
        }

    .wifi_tv {
        display: grid;
        grid-template-columns: 1fr 2fr;
        gap: 20px;
    }

        .wifi_tv img {
            width: 500px;
        }

    .wifi_tv__content {
        display: flex;
        flex-direction: column;
        gap: 12px;
    }

    .old_card_adwantages {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 12px;
    }

    .old_adw_container {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        gap: 40px;
    }

    .wifi_tv__content li {
        list-style: inside;
    }

    .old_adw_img {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 117px;
        height: 117px;
        box-shadow: 2px 2px 35px rgba(13, 18, 64, 0.15);
        border-radius: 50%;
        margin-bottom: 20px;
    }

    .old_adw_container img {
        width: 40px;
        aspect-ratio: 1;
    }

    .old_adw_container span {
        text-align: center;
    }
}

/*-------------news-article-----------*/
.read-info {
    display: flex;
    flex-wrap: wrap;
    align-self: start;
    gap: 20px;
    margin-top: 12px;
}

    .read-info .date {
        display: flex;
        gap: 4px;
        align-items: center;
        border-radius: 0;
        border: none;
        color: #000;
        padding: 0;
        color: var(--gray-600, #818899);
        font-family: "MTS Text";
        font-size: 18px;
        font-style: normal;
        font-weight: 500;
        line-height: 110%; /* 19.8px */
        text-wrap: nowrap;
        margin-bottom: 12px;
    }
.news-item-content {
    display: flex;
    flex-direction: column;
    margin-bottom: 28px;
    align-items: center;
}

.content-paragraphes {
    width: 100%;
    max-width: 100%;
    display: flex;
    flex-direction: column;
}


.content-paragraphes .article-image,
.content-paragraphes p,
.content-paragraphes span,
.content-paragraphes h2,
.content-paragraphes h3,
.content-paragraphes h4,
.content-paragraphes ul,
.content-paragraphes div {
    max-width: 846px;
}
.news_page_content{
    display:grid;
    grid-template-columns:1fr 2fr;
    margin-bottom:50px;
}

.news-item .tariffs {
    margin-bottom: 50px;
}

.news_page_content .content-paragraphes .article-image,
.news_page_content .content-paragraphes p,
.news_page_content .content-paragraphes span,
.news_page_content .content-paragraphes h2,
.news_page_content .content-paragraphes h3,
.news_page_content .content-paragraphes h4,
.news_page_content .content-paragraphes ul,
.news_page_content .content-paragraphes div {
    max-width: 100%;
}

.content-paragraphes h1 {
    width: 100%;
    text-align: start;
}

.news_page_content .content-paragraphes h1 {
    width: 100%;
    text-align: start;
}

.content-paragraphes h1, .content-paragraphes h2 {
    margin: 28px 0 12px;
}

.container_min {
    display: flex;
    flex-direction: column;
    max-width: 846px;
}

.statiy-container .tariffs {
    margin-bottom: 20px;
}

.pd-re .show-more input {
    width: fit-content;
    cursor: pointer;
    border: 0;
    color: var(--white);
    display: flex;
    padding: 16px 28px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 12px;
    background: var(--red, #FF0032);
    font-family: "MTS Text";
    font-size: 17px;
    font-style: normal;
    font-weight: 500;
    line-height: 100%;
}

    .pd-re .show-more input:hover {
        background: var(--red-hover);
    }

.news-item-content .btn.black {
    width: fit-content;
    margin-top: 12px;
}


@media (min-width: 768px) {
    .news-item-content .btn.black {
        margin-top: 20px;
    }

    .read-info {
    display: flex;
    flex-wrap: wrap;
    align-self: center;
    gap:40px;
    margin-top:20px;
}
    .read-info .date {
        display:flex;
        gap:4px;
        align-items:center;
        border-radius: 0;
        border: none;
        color: #000;
        padding: 0;
        color: var(--gray-600, #818899);
        font-family: "MTS Text";
        font-size: 18px;
        font-style: normal;
        font-weight: 500;
        line-height: 110%; /* 19.8px */
        text-wrap: nowrap;
        margin-bottom:20px;
    }
.news-item-content {
    display: flex;
    flex-direction: column;
    margin-bottom: 50px;
    align-items: center;
}
.content-paragraphes {
    width: 100%;
    max-width: 100%;
    display: flex;
    flex-direction: column;
}


        .content-paragraphes .article-image,
        .content-paragraphes p,
        .content-paragraphes span,
        .content-paragraphes h2,
        .content-paragraphes h3,
        .content-paragraphes h4,
        .content-paragraphes ul,
        .content-paragraphes div {
            max-width: 846px;
        }

    .news_page_content {
        display: grid;
        grid-template-columns: 1fr 2fr;
        margin-bottom: 50px;
    }

    .news-item .tariffs {
        margin-bottom: 50px;
    }

    .news_page_content .content-paragraphes .article-image,
    .news_page_content .content-paragraphes p,
    .news_page_content .content-paragraphes span,
    .news_page_content .content-paragraphes h2,
    .news_page_content .content-paragraphes h3,
    .news_page_content .content-paragraphes h4,
    .news_page_content .content-paragraphes ul,
    .news_page_content .content-paragraphes div {
        max-width: 100%;
    }

    .content-paragraphes h1 {
        width: 100%;
        text-align: center;
    }

    .news_page_content .content-paragraphes h1 {
        width: 100%;
        text-align: start;
    }

    .container_min {
        display: flex;
        flex-direction: column;
        max-width: 846px;
    }

    .statiy-container .tariffs {
        margin-bottom: 20px;
    }

    .statiy-h1 {
        max-width: 1064px;
    }

    .pd-re .show-more input {
        width: fit-content;
        cursor: pointer;
        border: 0;
        color: var(--white);
        display: flex;
        padding: 16px 28px;
        justify-content: center;
        align-items: center;
        gap: 10px;
        border-radius: 12px;
        background: var(--red, #FF0032);
        font-family: "MTS Text";
        font-size: 17px;
        font-style: normal;
        font-weight: 500;
        line-height: 100%;
    }

        .pd-re .show-more input:hover {
            background: var(--red-hover);
        }

    .news-item-content .btn.black {
        width: fit-content;
        margin-top: 12px;
    }

    .content-paragraphes h1, .content-paragraphes h2 {
        margin: 50px 0 20px;
    }
    .news-grid{
        grid-template-columns: repeat(3,1fr);
    }
}








.main_slider{
            position: relative;
            width: 100%;
            height: auto;
            overflow: hidden;
        }
        .main_slider img{
            width: 100%;
            object-fit: contain;
            border-radius: 36px;
        }
        .slider_wrapper {
            display: flex;
            transition: transform 0.3s ease;
            width: 100%;
        }
        .arrow_wrapper{
            position: absolute;
            bottom: 20px;
            right: 20px;
            display: flex;
            gap: 8px;
        }
        .arrow_wrapper .arrow{
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;
            width: 60px;
            height: 60px;
            border-radius: 100%;
            padding: 12px;
            background: var(--gray-100, #E6E9EF);
        }
        .arrow_wrapper .arrow.right{
            transform: rotate(180deg);
        }
        .arrow.box{
            width: 48px;
            height: 48px;
            border-radius: 16px;
            padding: 12px;
            background: white;
        }
		.arrow:hover path{
            fill: black;
        }
.menu_navigation .list li svg{
    display:none;
}
.menu_navigation .list li a{
    color: var(--black, #000);
    font-family: "MTS Text";
    font-size: 15px;
    font-style: normal;
    font-weight: 500;
    line-height: 100%;
}

        @media(max-width: 768px){
            .arrow_wrapper{display: none;}
            .slider_wrapper img{
                max-width: 90%;
                gap: 8px;
                margin-right: -12px;
            }
             .slider_wrapper {
                cursor: grab; /* Подсказка, что можно тащить */
            }

            .slider_wrapper:active {
                cursor: grabbing; /* Во время перетаскивания */
            }


.menu_navigation .list{
  flex-direction: row;
  width: 100%;	
}
.menu_navigation .list li{
    width: calc(50% - 4px);
    position:relative;
	height: 100px;	
  	display:flex;
    flex-direction: column;
    gap:29px;
}
.menu_navigation .list li.multi{
  	width:100%;
}
.menu_navigation .list li a{
    width:100%; 
  	height: 100%;
    margin-top: 55px;

}
.menu_navigation .list li svg{
  	position:absolute;
  top:12px;
  left:12px;
  	display: flex;
    width: 32px;
    height: 32px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
    aspect-ratio: 1/1;
    border-radius: 12px;
  	background: rgba(255, 0, 50, 0.10);
  padding: 6px;
}
.menu_navigation .list li.multi svg:last-of-type{
  	top:12px;
    right:12px;
    left:auto;
}
.menu_navigation .list li.class_li{
	width: 100%;
}


        }
