* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

:root {
    --primary-color: #2C3E50;
    --secondary-color: #3498DB;
    --accent-color: #E74C3C;
    --light-color: rgba(225, 231, 237, 1);
    --dark-color: #333;
    --text-color: #666;
    --white: rgba(255, 255, 255, 1);
    --shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.container {
    max-width: 1280px;
    margin: 0 auto;
    width: 100%;
    padding: 0 20px;

    @media screen and (max-width: 768px) {
        padding: 0 9px;
    }
}

.btn {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 24px;
    text-decoration: none;
}

.btn-big {
    width: 100%;
    height: 90px;
}

.btn-transparent {
    padding: 0 40px;
    background: #FFFFFF;
    border: 1px solid #2C3E50;
    border-radius: 36px;
    color: rgba(44, 62, 80, 1);
    transition: all .3s ease;
}

.btn-transparent:hover {
    background: #2C3E50;
    color: white;
}

h2 {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 600;
    font-size: 56px;
    line-height: 65px;
    text-align: center;
    text-transform: uppercase;
    color: #2C3E50;
}

h3 {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 45px;
    line-height: 61px;
    text-align: center;
    color: #2C3E50;
}

.about .container {
    @media screen and (max-width: 768px) {
        padding: 0 10px;
    }
}

.publications,
.about {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 80px 0;
    margin: 0 auto;
    overflow: hidden;
    width: 100%;
}

.about-tabs {
    max-width: max-content;
    margin: 0 auto 80px;
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 10px 20px;
    gap: 20px;
    background: #EEEFF0;
    border-radius: 36px;

    @media screen and (max-width: 1076px) {
        max-width: 274px;
    }
}

.tab-btn {
    background: none;
    cursor: pointer;
    padding: 0 20px;
    transition: all 0.3s ease;
    position: relative;
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 20px;
    color: rgba(183, 182, 182, 1);
    gap: 10px;
    height: 54px;
    background: var(--white);
    border-radius: 36px;
    border: 2px solid var(--white);

    @media screen and (max-width: 1076px) {
        max-width: 113px;
        font-size: 18px;
        line-height: 100%;

    }
}

.main-tabs {
    padding: 10px 16px;
    margin-bottom: 24px !important;
    max-width: 467px;

    @media screen and (max-width: 768px) {
        margin-bottom: 12px !important;
    }
}

@media screen and (max-width: 768px) {
    .main-tabs-content .brand-image__text {
        padding: 0 39px;
    }

    .main-tabs-content .brand-image__text--title {

    }
}

.main-tabs .tab-btn {
    max-width: 135px;
    height: 38px;
    font-size: 18px;
    padding: 0 24px;

    @media screen and (max-width: 768px) {
        font-size: 12px;
        padding: 0 12px;
        height: 33px;
    }
}

@media screen and (max-width: 1076px) {
    .about-tabs.main-tabs {
        max-width: 435px;
        gap: 16px;
    }

    .about-tabs.main-tabs .tab-btn {
        max-width: 121px;
        white-space: nowrap;
    }
}

.tab-btn:hover {
    color: var(--primary-color);
}

.tab-btn.active {
    color: rgba(0, 0, 0, 1);
    background: var(--light-color);
}

.tabs-content {
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin-bottom: 80px;
}

.tab-content {
    display: none;
    animation: fadeIn 0.3s ease-in-out;
}

.tab-content.active {
    display: block;
}

.tab-inner-brand {
    display: flex;
    flex-direction: column;
    gap: 80px;
}

.brand-images {
    position: relative;
    display: flex;
    align-items: center;
    gap: 15px;
}

.brand-image-left {
    overflow: hidden;

}

.brand-image-left img.brand-images__ellipse {
    position: absolute;
    top: 0;
    right: 0;
    left: auto;
    width: 100px;
    height: 100px;
    z-index: 1;
    opacity: .5;
}

.brand-image-left,
.brand-image-right {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-basis: 50%;
    min-height: 608px;
    border-radius: 50px;
    overflow: hidden;
}

.brand-image__text {
    padding: 0 65px;
    display: flex;
    flex-direction: column;
    gap: 35px;
    text-align: center;
}

.brand-image__text--subtitle {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: 20px;
    color: #FFFFFF;
}

.brand-image__text--title {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 600;
    font-size: 50px;
    text-align: center;
    color: #FFFFFF;

}

.brand-image-left img,
.brand-image-right img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 608px;
    object-fit: fill;
    border-radius: 15px;
    z-index: -1;

    @media screen and (max-width: 1250px) {
        height: auto;
    }
}

.brand-logo {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 74px;
    height: 74px;
}

.brand-logo img {
    width: 100%;
    height: auto;
}


.brand-cards-title {
    max-width: 565px;
    display: flex;
    flex-direction: column;
    gap: 30px;
    padding: 40px 0;
    margin: 0 auto;
    text-align: center;
}

.brand-cards-title p {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: 20px;
    color: #2C3E50;
}

.brand-cards {
    display: flex;
    flex-direction: row;
    gap: 0;
    justify-content: flex-start;
    align-items: stretch;
    position: relative;
}

.brand-card {
    display: flex;
    flex-direction: row;
    background: #2C3E50;
    border-radius: 50px;
    transition: all 0.4s cubic-bezier(0.3, 0.07, 0.61, 1.16);
    cursor: pointer;
    overflow: hidden;
    position: relative;
    height: 206px;
    -webkit-tap-highlight-color: transparent;
}

.brand-card:not(:first-child) {
    border-radius: 0 50px 50px 0;
    flex-direction: row-reverse;
    width: 100%;
    justify-content: space-between;
}

.brand-card:nth-child(1) {
    z-index: 4;
    background: #2C3E50;

    @media screen and (max-width: 992px) {
        flex: 4 !important;
    }
}

.brand-card:nth-child(2) {
    z-index: 3;
    background: #E1E7ED;
}

.brand-card:nth-child(3) {
    background: #FDF4DD;
    z-index: 2;
}

.brand-card:nth-child(4) {
    background: #B9D09C;
    z-index: 1;
}

.brand-card.active {
    flex: 4.5;
    min-width: 300px;
}

.brand-card:not(.active) {
    flex: 0.5 !important;
    min-width: 80px;

    @media screen and (max-width: 768px) {
        flex: 0.7 !important;
    }
}

.brand-card:not(:first-child) {
    margin-left: -60px;
}

.brand-card.active {
    margin-left: -60px;
}

.brand-card:first-child {
    margin-left: 0;
}

.brand-card-header {
    display: flex;
    flex-direction: column;
    align-items: start;
    gap: 15px;
    writing-mode: vertical-rl;
    white-space: nowrap;
    padding: 50px 17px;
}

.brand-card.active .brand-card-header {
    writing-mode: horizontal-tb;
    transform: rotate(0);
    flex-direction: row;
    justify-content: flex-start;
}

.brand-card:not(:first-child).active .brand-card-header,
.brand-card:not(:first-child) .brand-card-header {
    justify-content: flex-end;
}

.brand-card-icon {
    width: 24px;
    height: 24px;
    transition: transform 0.3s ease;
}

@media screen and (max-width: 768px) {
    .brand-card:not(:first-child) .brand-card-icon {
        display: none;
    }
}

.brand-card-title {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 20px;
    text-transform: uppercase;
    color: #FFFFFF;
    margin: 0;
    padding: 10px;
}

.brand-card:nth-child(2) .brand-card-title,
.brand-card:nth-child(3) .brand-card-title,
.brand-card:nth-child(4) .brand-card-title {
    color: #2C3E50;
}

.brand-card-content {
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    padding: 0 30px;
    transition: all 0.3s ease;
}

.brand-card.active .brand-card-content {
    opacity: 1;
    visibility: visible;
    padding: 0 30px 0 0;
}

.brand-card:not(:first-child).active .brand-card-content {
    margin-left: 30px;
    padding: 0 30px 0 30px;
}

.brand-card-content p {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: 18px;
    color: #FFFFFF;
    margin: 0;
    padding: 10px;
}

.brand-card:nth-child(2) .brand-card-content p,
.brand-card:nth-child(3) .brand-card-content p,
.brand-card:nth-child(4) .brand-card-content p {
    color: #2C3E50;
}

.posts-blocks {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    gap: 15px;
}

.posts-blocks .news,
.posts-blocks .articles {
    flex: 1;
    min-width: 0;
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 363px;
    flex-basis: 50%;
    overflow: hidden;
}

.posts-blocks .news img.tablet-img,
.posts-blocks .articles img.tablet-img,
.posts-blocks .news img.mobile-img,
.posts-blocks .articles img.mobile-img {
    display: none;
}

.posts-blocks .news img,
.posts-blocks .articles img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: fill;
    z-index: -1;
}

.posts-blocks .posts-content {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 30px 47px;
}

.articles .posts-content {
    align-items: end;
}

.post-link {
    display: inline-flex;
    flex-direction: row;
    justify-content: start;
    align-items: center;
    padding: 0 24px;
    height: 45px;
    background: #FFFFFF;
    border-radius: 20px;
    text-decoration: none;
    max-width: 100%;
    color: #2C3E50;
    width: max-content;
    border: 0 solid rgba(44, 62, 80, 1);
    transition: all 0.2s ease;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    box-sizing: border-box;
}

@media screen and (max-width: 1260px) {
    .posts-blocks {
        justify-content: center;
    }

    .posts-blocks .news,
    .posts-blocks .articles {
        max-width: 413px;
        width: 100%;
    }

    .posts-blocks .news img,
    .posts-blocks .articles img {
        display: none;
    }

    .posts-blocks .news img.tablet-img,
    .posts-blocks .articles img.tablet-img {
        display: block !important;
        width: 100%;
        height: 363px;
        object-fit: cover;
    }
}


@media screen and (max-width: 990px) {
    .post-link {
        max-width: 300px !important;
    }

    .posts-blocks .posts-content {
        gap: 12px !important;
    }

    .post-link-text {
        font-size: 14px !important;
    }

    .posts-blocks .news img.tablet-img,
    .posts-blocks .articles img.tablet-img {
        display: none !important;
    }

    .posts-blocks .news img.mobile-img,
    .posts-blocks .articles img.mobile-img {
        display: block !important;
        width: 100%;
        height: 320px;
        object-fit: cover;
    }

    .posts-blocks {
        flex-direction: column;
        gap: 15px;
        align-items: center;
    }

    .posts-blocks .news,
    .posts-blocks .articles {
        border-radius: 36px 0 36px 36px;
        flex: 1;
        width: 100%;
        max-width: 395px;
        min-width: 0;
        min-height: 320px;
        height: 320px;
        position: relative;
    }

    .posts-blocks .articles {
        border-radius: 36px 36px 36px 0;
    }

    .posts-blocks .button-all {
        position: absolute;

    }

    .posts-blocks .posts-content {
        padding: 20px 24px;
    }

    .post-link {
        max-width: calc(100% - 48px);
        width: 100%;
        justify-content: center;
        text-align: center;
    }
}

.posts-blocks .news {
    justify-content: end;
}

.posts-blocks .posts-content {
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 30px 47px;

    @media screen and (max-width: 500px) {
        padding: 30px;
    }
}

.articles .posts-content {
    align-items: end;
}

.post-link {
    display: inline-flex;
    flex-direction: row;
    justify-content: start;
    align-items: center;
    padding: 0 24px;
    height: 45px;
    background: #FFFFFF;
    border-radius: 20px;
    text-decoration: none;
    max-width: 510px;
    color: #2C3E50;
    width: max-content;
    border: 0 solid rgba(44, 62, 80, 1);
    transition: all 0.2s ease;
}

.post-link:hover {
    border-width: 1px;
}

@media screen and (max-width: 500px) {
    .post-link {
        max-width: calc(100% - 48px);
        padding: 0 16px;
    }
}

.post-link-text {
    font-family: 'Manrope', sans-serif;
    font-weight: 500;
    font-size: 18px;
    color: #2C3E50;
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.posts-blocks .button-all {
    position: absolute;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 0 46px;
    background: #2C3E50;
    border-radius: 20px;
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: 18px;
    color: #FFFFFF;
    width: 162px;
    height: 41px;
    text-decoration: none;
    z-index: 10;

    @media screen and (max-width: 990px) {
        width: 139px;
        height: 35px;
    }
}

.news .button-all {
    top: 0;
    right: 0;
}

.articles .button-all {
    bottom: 0;
    left: 0;
}

.media {
    display: flex;
    flex-direction: column;
    gap: 24px;
    margin-bottom: 80px;
    width: 100%;
}

@media screen and (max-width: 1260px) {
    .media {
        align-items: center;
        width: 100%;
    }
}

@media screen and (max-width: 992px) {
    .media h3 {
        font-size: 40px;
    }
}

.media-slider {
    width: 100%;
    height: 363px;
    position: relative;
    border-radius: 36px 0 0 36px;
    overflow: hidden;
    font-family: 'Manrope', sans-serif;
}

.media-slide {
    width: 100%;
    height: 100%;
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity 0.5s ease;
}


.media-slide.active {
    opacity: 1;
    z-index: 1;
}

.media-bg {
    position: absolute;
    width: 100%;
    height: 100%;
    inset: 0;

    @media screen and (max-width: 1260px) {
        display: none;
    }
}

.media-bg-tablet,
.media-bg-mobile {
    display: none;
}

@media screen and (max-width: 1260px) {
    .media {
        align-items: center;
    }

    .media-slider {
        width: 842px;
        height: 365px;
    }

    .media-bg {
        display: none;
    }

    .media-bg-tablet {
        display: block;
    }
}

@media screen and (max-width: 870px) {

    .media-text,
    .media-date {
        max-width: 350px;
    }

    .media-button {
        font-size: 14px !important;
        width: 110px !important;
        height: 35px !important;
    }

    .media-bg-tablet {
        display: none;
    }

    .media-bg-mobile {
        display: block;
    }

    .media-slider {
        max-width: 413px;
    }
}


.media-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(165.98deg,
    rgba(255, 255, 255, 0) 12.75%,
    #FFFFFF 89.81%);
}

.media-logo {
    position: absolute;
    width: 100px;
    height: 100px;
    left: 70px;
    top: 0;
    background: #fff;
    border-radius: 0 0 15px 15px;
    display: flex;
    justify-content: center;
    align-items: flex-end;
    padding-bottom: 10px;
}

.media-logo.vilvet {
    background: #221f73;
}

.media-logo img {
    width: 93px;
    height: auto;
}

.media-content {
    position: absolute;
    left: 26px;
    top: 139px;
    color: #2C3E50;
    max-width: 652px;
}

.media-date {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    color: #2C3E50;
    margin-bottom: 8px;
}

.media-title {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 800;
    font-size: 24px;
    line-height: 33px;
    color: #2C3E50;
    margin-bottom: 10px;
    text-align: left;
    text-transform: none;
    max-width: 606px;

    @media screen and (max-width: 1076px) {
        max-width: 395px;
    }

    @media screen and (max-width: 768px) {
        max-width: 315px;
    }
}

.media-text {
    font-weight: 400;
    font-size: 14px;
    line-height: 19px;
    margin: 0;

    @media screen and (max-width: 768px) {
        font-size: 10px !important;
        line-height: 100%;
    }

    @media screen and (max-width: 500px) {
        font-size: 8px !important;
        line-height: 100%;
    }
}

.media-button {
    position: absolute;
    top: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 164px;
    height: 41px;
    background: #2C3E50;
    color: #fff;
    border: none;
    border-radius: 20px;
    font-weight: 300;
    font-size: 18px;
    cursor: pointer;
    text-decoration: none;
}

.media-dots {
    position: absolute;
    right: 120px;
    bottom: 15px;
    display: flex;
    gap: 10px;
    z-index: 2;
}

.media-dots .dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    border: 2px solid #2C3E50;
    background: #2C3E50;
    cursor: pointer;
}

.media-dots .dot.active {
    background: transparent;
}

.media-arrow {
    position: absolute;
    width: 40px;
    height: 40px;
    right: 0;
    bottom: 0;
    background: #E1E7ED;
    border-radius: 50%;
    cursor: pointer;
    z-index: 2;
}

.contacts-commands {
    display: flex;
    flex-direction: column;
    gap: 80px;
}

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

.commands-block {
    flex-basis: 50%;
    display: flex;
    flex-direction: column;
    gap: 58px;
}

.commands-list a {
    display: block;
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 45px;
    text-decoration-line: underline;
    color: #2C3E50;
    margin-bottom: 15px;
    text-decoration-thickness: 1px;
    text-underline-offset: 2px;
}

.commands-list ul {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding-left: 25px;
    list-style-type: disc;
}

.commands-list ul li {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: 18px;
    color: #2C3E50;
}

.commands-list ul li::marker {
    font-size: 14px;
}

.contacts-links-title {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 24px;
    color: #2C3E50;
}

.contacts-links {
    display: flex;
    gap: 20px;
}

.contacts-links a {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #2C3E50;
    border-radius: 50px;
    text-decoration: none;
    width: 66px;
    height: 66px;
}

.technical-support {
    padding: 60px 40px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 52px;
    background: #E1E7ED;
    border-radius: 36px;
}

.technical-support-content {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.technical-support-title {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 36px;
    color: #2C3E50;
}

.technical-support-text,
.technical-support-list-title {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: 18px;
    color: #2C3E50;
}

.technical-support-list-title {
    margin-bottom: -10px;
}

.technical-support-list-title b {
    font-weight: 500;
}

.technical-support-content ul {
    padding-left: 8px;
    list-style: none;
}

.technical-support-content ul li {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 18px;
    color: #2C3E50;
}

.technical-support .btn {
    width: 487px;
    background: #2C3E50;
    border-radius: 50px;
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    color: #FFFFFF;
    text-decoration: none;
    transition: all 0.3s ease;
}

.technical-support .btn:hover {
    border: 1px solid #2C3E50;
    background: white;
    color: #2C3E50;
}

.technical-support .link {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 20px;
    color: #2C3E50;
}

.technical-support .btn,
.technical-support .link {
    margin: 0 auto;
}

.commands-block:first-child {
    max-width: 473px;
}

.commands-block:nth-child(2) {
    justify-content: space-between;
}

.commands-block .btn-transparent {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 10px 40px;
    height: 76px;
    background: #FFFFFF;
    border: 1px solid #2C3E50;
    border-radius: 36px;
    font-weight: 500;
    font-size: 20px;
    line-height: 27px;
    color: rgba(44, 62, 80, 1);
    transition: all 0.3s ease;
}

.commands-block .btn-transparent:hover {
    background: #2C3E50;
    color: #FFFFFF;
}

.foreign .contacts-links-title {
    display: block;
    margin-bottom: 10px;
}

.foreign .btn {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    background: #2C3E50;
    border-radius: 50px;
    padding: 0 30px;
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    color: #FFFFFF;
}

.foreign-icons {
    display: flex;
    gap: 8px;
}

.foreign-icon {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 45px;
    height: 45px;
    background: #E1E7ED;
    border-radius: 50px;
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: 18px;
    text-transform: uppercase;
    color: #2C3E50;
}

.history {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 160px;
    @media screen and (max-width: 768px) {
        gap: 100px;
    }
}

.history-mobile {
    display: none;
    flex-direction: column;
    gap: 11px;
    position: absolute;
    top: 30px;
    left: 30px;
    width: max-content;
    font-weight: 600;
    font-size: 14px;
    line-height: 100%;
    color: #2C3E50;

    @media screen and (max-width: 768px) {
        display: flex;
    }
}

.advantages {
    position: relative;
    display: flex;
    justify-content: space-between;
    gap: 10px;
    height: 400px;
    width: 100%;
    -webkit-tap-highlight-color: transparent;
}

.advantages-item {
    position: absolute;
    top: 0;
    left: 50%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 10px;
    padding: 34px;
    border-radius: 50px;
    flex-basis: 33%;
    cursor: pointer;
    min-height: 345px;
    max-width: 345px;
    transition: all .5s cubic-bezier(.81, -0.79, .24, 1.65);
    -webkit-tap-highlight-color: transparent;

    @media screen and (max-width: 768px) {
        flex-basis: 100%;
        width: 100%;
    }
}

.advantages-item p {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    color: #2C3E50;
}

.advantages-item p.advantages-item-heading {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    color: #2C3E50;
}

.advantages-item.blue {
    background: #E1E7ED;
}

.advantages-item.yellow {
    background: #FDF4DD;
}

.advantages-item.green {
    background: #B9D09C;
}

.advantages-item:first-child {
    z-index: 3;
    transform: translateX(-50%) rotate(-7.43deg);

}

.advantages-item:nth-child(2) {
    z-index: 2;
    transform: translateX(-50%) rotate(0);
}

.advantages-item:nth-child(3) {
    left: auto;
    right: 50%;
    z-index: 1;
    transform: translateX(50%) rotate(5deg);
}

@media screen and (max-width: 1260px) {
    .post-link {
        max-width: 350px;
    }

    .container {
        padding: 0 75px;
    }

    .brand-logo {
        width: 48px;
        height: 48px;
    }

    .brand-images {
        justify-content: center;
        min-width: 831px;
    }

    .brand-image-left,
    .brand-image-right,
    .brand-image-left img,
    .brand-image-right img {
        width: 410px;
        height: 410px;
        min-height: auto;
        flex-basis: auto;
    }

    .brand-image__text--title {
        font-size: 30px;
    }

    .brand-image__text {
        gap: 15px;
    }

    .brand-image__text--subtitle {
        font-size: 14px;
    }
}

@media screen and (max-width: 925px) {
    .brand-image-right {
        display: none;
    }

    .brand-logo {
        left: auto;
        bottom: 2px;
        right: -5px;
        transform: translateX(0);
        max-width: 410px;
        width: 45px;
        height: 45px;
    }

    .brand-images {
        min-width: auto;
        max-width: 410px;
        margin: 0 auto;
    }
}

@media screen and (max-width: 768px) {
    .container {
        padding: 0 10px;
    }

    .brand-card-title {
        font-size: 18px;
    }

    .brand-card-content p {
        font-size: 14px;
    }

    .advantages {
        height: auto;
        min-height: 345px;
        flex-direction: column;
        align-items: center;
        gap: 20px;
    }

    .advantages-item {
        transform: none;
        width: 90%;
        max-width: 100%;
        margin-bottom: 20px;
        z-index: 1;
        transition: z-index 0s ease;
    }

    .advantages-item.active {
        z-index: 10;
        opacity: 1;
    }

    .advantages-item:nth-child(2),
    .advantages-item:nth-child(3) {
        display: flex !important;
    }
}

.advantages.active .advantages-item:first-child {
    left: 0;
    transform: translateX(0) rotate(0);
}

.advantages.active .advantages-item:nth-child(2) {
    transform: translateX(-50%) rotate(0);
}

.advantages.active .advantages-item:nth-child(3) {
    left: auto;
    right: 0;
    transform: translateX(0%) rotate(0) !important;
}

.timeline-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    box-sizing: border-box;
    height: 500px;
}

.timeline {
    position: relative;
    width: 100%;
    height: 370px;
}

.timeline::before {
    content: "";
    position: absolute;
    top: 200px;
    left: 0;
    width: 100%;
    height: 1px;
    background: #2F4456;
}

.event {
    position: absolute;
}

.event:first-child .card {
    transform: translateX(-15%) !important;
}

.event:last-child .card {
    transform: translateX(-90%) !important;
}

.timeline .event:not(:first-child) .year {
    transform: translateX(10px);
}

.event .card {
    background: white;
}

.event .card.card--blue {
    background: #2F4456;
    color: white;
}


.year {
    position: absolute;
    top: 170px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 18px;
    color: #2F4456;
}

.dot-center {
    position: absolute;
    top: 200px;
    left: 50%;
    width: 12px;
    height: 12px;
    background: #2F4456;
    border-radius: 50%;
    transform: translate(-50%, -50%);
}

.connector {
    position: absolute;
    left: 50%;
    width: 1px;
    background: #2F4456;
    transform: translateX(-50%);
}

.dot-end {
    position: absolute;
    left: 50%;
    border-radius: 50%;
    transform: translate(-50%, -50%);
}

.dot-end.static {
    width: 12px;
    height: 12px;
    background: #2F4456;
}

.dot-end.clickable {
    width: 22px;
    height: 22px;
    background: #2F4456;
    cursor: pointer;
    transition: transform 0.3s ease;
}

.dot-end.clickable:hover {
    transform: translate(-50%, -50%) scale(1.15);
}

.event.active .dot-end.clickable {
    transform: translate(-50%, -50%) scale(1.25);
}

@keyframes pulseBlur {
    0% {
        filter: blur(0px);
        box-shadow: 0 0 0px rgba(47, 68, 86, 0.6);
    }

    50% {
        filter: blur(2px);
        box-shadow: 0 0 20px rgba(47, 68, 86, 0.9);
    }

    100% {
        filter: blur(0px);
        box-shadow: 0 0 0px rgba(47, 68, 86, 0.6);
    }
}

.dot-end.clickable.pulse {
    animation: pulseBlur 1.4s ease-in-out infinite;
}

.card {
    position: absolute;
    left: 50%;
    transform: translate(-50%, 0);

    width: 260px;
    background: #344A5F;
    color: #fff;
    padding: 16px;
    border-radius: 12px;
    font-size: 14px;
    text-align: center;

    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
}

.event.active .card {
    opacity: 1;
    visibility: visible;
    transform: translate(-50%, 0);
}

.card--transparent {
    background: transparent;
    color: #2F4456;
    border: 1px solid #2F4456;
}

.card--white {
    background: #fff;
    color: #2F4456;
    border: 1px solid #2F4456;
}

.event.active .dot-end.clickable {
    opacity: 0;
    pointer-events: none;
}

.address {
    display: flex;
    flex-direction: column;
    gap: 80px;
}

.address-content {
    display: flex;
    gap: 33px;
}

.address-text {
    display: flex;
    flex-direction: column;
    gap: 20px;
    flex-basis: 57%;
}

.address-text-item {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.address-text-title {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 600;
    font-size: 18px;
    color: #2C3E50;
}

.address-text-item p {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: 18px;
    color: #2C3E50;
}

.map {
    display: block;
    width: 514px;
    height: 462px;
    border-radius: 30px;
    overflow: hidden;
    flex-basis: 43%;
}

.map iframe {
    width: 514px;
    height: 462px;
}

.map img {
    width: 100%;
    height: 100%;
}


@media screen and (max-width: 1076px) {

    .media-text,
    .media-date {
        font-size: 12px;
    }

    .media-title {
        font-size: 18px;
        line-height: 100%;
    }

    .tabs-content {
        margin-bottom: 50px;
    }

    .brand-card.active {
        flex: 3.8;
    }

    .brand-cards-title h2 {
        font-size: 46px;
    }

    .brand-cards-title p {
        font-size: 18px;
    }


    .media,
    .tab-inner-brand {
        gap: 50px;
    }

    .commands-block {
        gap: 43px;
        flex-basis: auto;
    }

    .commands-block .btn-transparent {
        height: 76px;
    }

    .commands-list a {
        font-size: 28px;
    }


    .foreign .btn {
        height: 83px;
    }

    .foreign .btn,
    .technical-support-content ul li,
    .technical-support-list-title,
    .commands-list ul li {
        font-size: 14px;
    }

    .technical-support {
        padding: 43px;
    }

    .technical-support-title {
        font-size: 24px;
    }


    .foreign,
    .technical-support {
        gap: 25px;
        max-width: 374px;
    }

    .foreign .contacts-links-title {
        font-size: 18px;
    }

    .technical-support .btn {
        width: 282px;
        height: 59px;
        font-size: 14px;
    }

    .technical-support .link {
        font-size: 20px;
    }

    .commands-block:first-child {
        max-width: 347px;
    }

    .contacts-links-title {
        margin-bottom: -13px;
    }

    .address {
        gap: 50px;
    }

    .address h3 {
        font-size: 40px;
        margin: 0 auto;
        max-width: 510px;
    }

    .address-text-item p {
        font-size: 12px;
    }

    .map iframe,
    .map {
        width: 334px;
        height: 300px;
        flex-basis: auto;
    }

    .about-tabs {
        margin: 0 auto 50px;
    }
}

@media screen and (max-width: 768px) {
    .timeline::before {
        top: 200px;
        left: -200px;
        width: 1540px;
    }

    .timeline-wrapper {
        border: 3px solid rgba(44, 62, 80, 1);
        border-radius: 50px;
        overflow-x: auto;
        overflow-y: visible;
        -webkit-overflow-scrolling: touch;
        cursor: grab;
        position: relative;
        display: flex;
        align-items: center;
        min-height: 630px;
    }

    .timeline-wrapper:active {
        cursor: grabbing;
    }

    .timeline {
        min-width: 1200px;
        width: max-content;
        position: relative;
        margin-left: 130px;
    }

    .timeline-wrapper {
        scrollbar-width: none;
        -ms-overflow-style: none;
    }

    .timeline-wrapper::-webkit-scrollbar {
        display: none;
        width: 0;
        height: 0;
    }

    .about {
        padding: 40px 0;
    }

    .tab-btn {
        height: 47px;
        font-size: 10px;
    }

    .contacts-commands {
        gap: 40px;
    }

    .contacts-commands h3 {
        font-size: 30px;
        line-height: 100%;
    }

    .commands-content {
        flex-direction: column;
        align-items: center;
        gap: 40px;
    }

    .commands-block {
        justify-content: center;
        align-items: center;
    }

    .foreign,
    .technical-support {
        max-width: 100%;
    }

    .foreign .contacts-links-title,
    .commands-list a {
        text-align: center;
    }

    .address-content {
        flex-direction: column;
    }

    .address h3 {
        font-size: 30px;
        line-height: 100%;
    }

    .foreign .contacts-links-title {
        margin-bottom: 30px;
    }

    .address {
        gap: 30px;
    }

    .address-text {
        gap: 25px;
    }

    .map {
        margin: 0 auto;
    }

    .tabs-content {
        margin-bottom: 40px;
    }
}

.tab-inner-news {
    display: flex;
    gap: 80px;
    flex-direction: column;
}

.news-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 28px;
}

.news-article {
    display: none;
    padding: 40px 0;
    animation: fadeIn 0.3s ease;
}

.news-full {
    display: flex;
    flex-direction: column;
    gap: 30px;
    margin: 0 auto;
}

.news-full h3 {
    max-width: 986px;
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: 55px;
    line-height: 1.5;
    color: #000000;
    text-align: left;

    @media screen and (max-width: 768px) {
        font-size: 36px !important;
        line-height: 1.2;
    }
}

.news-full-content {
    display: flex;
    gap: 48px;

    @media screen and (max-width: 1076px) {
        flex-direction: column;
    }
}

.news-full-image {
    flex-basis: 45%;
    border-radius: 36px;
    overflow: hidden;
    max-height: 531px;
}

.news-full-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    min-height: 531px;

    @media screen and (max-width: 768px) {
        min-height: auto;
    }
}

.news-full-text {
    font-family: 'Manrope', sans-serif;
    font-weight: 300;
    font-size: 16px;
    line-height: 1.6;
    color: #2C3E50;
    flex-basis: 55%;

    @media screen and (max-width: 768px) {
        font-size: 14px;
        line-height: 100%;
    }
}

.news-full-text p {
    margin-bottom: 20px;
}

.news-full-text ul {
    padding-left: 30px;
    margin-bottom: 20px;
}

.news-full-text ul li {
    margin-bottom: 10px;
}

.back-to-news {
    font-family: 'Manrope', sans-serif;
    font-weight: 500;
    font-size: 20px !important;
    padding: 12px 30px !important;
    width: auto !important;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.news-content {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 28px;
}

.news-item {
    position: relative;
    max-width: 540px;
    min-height: 300px;
    padding: 36px 40px;
    display: flex;
    flex-direction: column;
    gap: 15px;
    text-decoration: none;
    background: rgba(238, 239, 240, 1);
    border-radius: 36px 0 36px 36px;
    margin-right: 70px;
}

.news-item:before {
    position: absolute;
    content: '';
    top: 0;
    right: -70px;
    width: 70px;
    height: 230px;
    background: rgba(238, 239, 240, 1);
    border-radius: 0 36px 36px 0;
    z-index: 1;
}

.news-item:after {
    position: absolute;
    content: "";
    bottom: 35px;
    right: -35px;
    border-radius: 0 0 36px 0;
    width: 70px;
    height: 70px;
    background: rgba(238, 239, 240, 1);
    mask: radial-gradient(circle at 93% 93%, transparent 30px, black 0);
    z-index: 2;
}

.mobile-off {
    @media screen and (max-width: 1076px) {
        display: none;
    }
}

.news-item-title {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: 34px;
    line-height: 130%;
    color: #2C3E50;
    max-width: 468px;
}

.news-item p {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: 14px;
    line-height: 120%;
    color: #2C3E50;
    max-width: 285px;
}

.news-item-icon {
    position: absolute;
    bottom: 0;
    right: -70px;
    width: 55px;
    height: 55px;
    z-index: 3;
}

.news-item-text {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.news-item:hover .news-item-icon {
    animation: flipRightToLeft 1s ease-in-out forwards;
}

@keyframes flipRightToLeft {
    0% {
        transform: translateX(0);
        opacity: 1;
    }

    40% {
        transform: translateX(30px);
        opacity: 0;
    }

    60% {
        transform: translateX(-30px);
        opacity: 0;
    }

    100% {
        transform: translateX(0);
        opacity: 1;
    }
}

.tab-inner-articles {
    display: flex;
    gap: 80px;
    flex-direction: column;
}

.articles-list {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 28px;
    width: 100%;
    flex-basis: 65%;
}

.articles-top {
    display: flex;
    flex-direction: column;
    gap: 40px;
    flex-basis: 35%;
}

.articles-top-title {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 40px;
    line-height: 100%;
    color: #2C3E50;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
    padding: 20px 30px;
    background: #FFFFFF;
    border-radius: 36px;
    transition: all 0.3s ease;
}

.articles-top-arrow {
    transition: transform 0.3s ease;
}

.articles-top-arrow.active {
    transform: rotate(180deg);
}

@media screen and (min-width: 1110px) {
    .articles-top-title {
        background: none;
        padding: 0;
        cursor: default;
    }

    .articles-top-arrow {
        display: none;
    }
}

.articles-top-list {
    display: flex;
    flex-direction: column;
    gap: 50px;
    background: #EEEFF0;
    border-radius: 36px;
    padding: 30px;
}

@media screen and (max-width: 1110px) {
    .articles-top-list {
        display: none;
    }
}

.articles-top-item {
    display: flex;
    flex-direction: column;
    gap: 20px;
    min-height: 300px;
    border-radius: 36px;
    padding: 35px 18px;
    text-decoration: none;
    background: rgba(44, 62, 80, 1);
}


.article-full {
    display: none;
    padding: 40px 0;
    animation: fadeIn 0.3s ease;
}

.article-full-content {
    display: flex;
    flex-direction: column;
    gap: 40px;
    margin: 0 auto;
}

.article-full-content h3 {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: 55px;
    line-height: 1.5;
    color: #000000;
    text-align: left;

    @media screen and (max-width: 768px) {
        font-size: 36px !important;
        line-height: 1.2;
    }
}

.article-full-content > div {
    display: flex;
    gap: 48px;

    @media screen and (max-width: 1076px) {
        flex-direction: column;
    }
}

.article-full-content .article-image {
    flex-basis: 45%;
    border-radius: 36px;
    overflow: hidden;
}

.article-full-content .article-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    min-height: 531px;
}

.article-text {
    font-family: 'Manrope', sans-serif;
    font-weight: 300;
    font-size: 16px;
    line-height: 1.6;
    color: rgba(0, 0, 0, 1);
    flex-basis: 55%;

    @media screen and (max-width: 768px) {
        font-size: 14px;
        line-height: 100%;
    }
}

.article-text p {
    margin-bottom: 20px;
}

.article-text ul {
    padding-left: 30px;
    margin-bottom: 20px;
    list-style-type: disc;
}

.article-text ul li {
    margin-bottom: 10px;
}

.article-text ul li::marker {
    font-size: 11px;
}

.article-date {
    font-family: 'Manrope', sans-serif;
    font-weight: 400;
    font-size: 16px;
    color: #666;
}

.articles-content {
    display: flex;
    gap: 40px;
}

.articles-top-toggle {
    display: none;
}

@media screen and (max-width: 1110px) {

    .articles-list {
        flex-basis: 100%;
    }

    .articles-top-toggle {
        display: block;
        cursor: pointer;
        text-align: center;
        margin-top: 20px;
        font-family: 'Manrope', sans-serif;
        font-weight: 500;
        font-size: 18px;
        color: #2C3E50;
        text-decoration: underline;
    }

    .articles-top-list {
        background: transparent;
        padding: 20px 30px;
        flex-direction: row;
    }

    .articles-top {
        background: rgba(238, 239, 240, 1);
        border-radius: 36px;
        transition: all 0.5s ease;
        gap: 0;
    }

    .articles-top-title {
        display: flex;
        justify-content: space-between;
        background: transparent;
        font-weight: 500;
        font-size: 40px;
        line-height: 55px;
    }

    .articles-top-item {
        min-height: 216px;
    }
}

@media screen and (max-width: 768px) {
    .articles-top-list {
        flex-direction: column;
        gap: 28px;
    }

    .articles-top-title {
        font-size: 30px;
        line-height: 100%;
    }
}

.articles-item {
    position: relative;
    max-width: 100%;
    min-height: 300px;
    padding: 36px 40px;
    display: flex;
    flex-direction: column;
    gap: 15px;
    text-decoration: none;
    background: rgba(185, 208, 156, 1);
    border-radius: 36px 0 36px 36px;
    margin-right: 70px;
}

.articles-item-text {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.publications .articles-item-text {
    gap: 20px;
}

.articles-item-category {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 0 10px;
    height: 31px;
    background: #EEEFF0;
    border-radius: 24px;
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: 14px;
    line-height: 19px;
    color: #2C3E50;
    width: max-content;
}

.articles-top-item .articles-item-category {
    background: rgba(185, 208, 156, 1);
}

.articles-item-title {
    max-width: 598px;
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: 34px;
    line-height: 46px;
    color: #2C3E50;
}

.articles-top-item .articles-item-title {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: 24px;
    line-height: 33px;
    color: #FFFFFF;
    max-width: 310px;
}

.articles-item-date {
    width: max-content;
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: 14px;
    line-height: 19px;
    color: #2C3E50;
}

.articles-top-item .articles-item-date {
    color: rgba(255, 255, 255, 1);
}

.articles-item:before {
    position: absolute;
    content: '';
    top: 0;
    right: -68px;
    width: 70px;
    height: 230px;
    background: rgba(185, 208, 156, 1);
    border-radius: 0 36px 36px 0;
    z-index: 1;
}

.articles-item:after {
    position: absolute;
    content: "";
    bottom: 35px;
    right: -35px;
    border-radius: 0 0 36px 0;
    width: 70px;
    height: 70px;
    background: rgba(185, 208, 156, 1);
    mask: radial-gradient(circle at 93% 93%, transparent 30px, black 0);
    z-index: 2;
}

.articles-item-icon {
    position: absolute;
    bottom: 0;
    right: -70px;
    width: 55px;
    height: 55px;
    z-index: 3;
}

.articles-item:hover .articles-item-icon {
    animation: flipRightToLeft 1s ease-in-out forwards;
}

.article-full-container {
    display: flex;
    gap: 48px;
}

.article-full-text {
    flex-basis: 60%;
}

.article-full-image {
    flex-basis: 40%;
    border-radius: 36px;
    overflow: hidden;
    max-height: 450px;
}

.article-full-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.article-date-category {
    display: flex;
    align-items: center;
    gap: 30px;
    margin-bottom: 40px;
}

.article-date-category .category {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 0 10px;
    width: 101px;
    height: 31px;
    background: #EEEFF0;
    border-radius: 24px;
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: 14px;
    line-height: 19px;
    color: #2C3E50;
}

.article-date-category .date {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 800;
    font-size: 14px;
    line-height: 19px;
    color: #2C3E50;
}

.article-text p b {
    font-weight: 500;
    color: #000000;
}

@media screen and (max-width: 1110px) {
    .articles-content {
        flex-direction: column-reverse;
    }
}

@media (max-width: 1076px) {
    .tab-inner-articles {
        gap: 50px;
    }

    .tab-inner-articles h3 {
        font-size: 40px;
    }

    .articles-content {
        grid-template-columns: repeat(1, 1fr);
        gap: 20px;
    }

    .articles-item {
        max-width: 100%;
    }

    .articles-item-title {
        font-size: 34px;
        line-height: 100%;
        max-width: 598px;
    }

    .articles-item-date {
        font-size: 14px;
        max-width: 100%;
    }
}

@media (max-width: 900px) {
    .articles-content {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .articles-item {
        max-width: 100%;
        padding: 30px 35px;
        margin-right: 70px;
    }

    .articles-item:before {
        right: -68px;
        width: 70px;
        height: 230px;
    }

    .articles-item:after {
        right: -35px;
        width: 70px;
        height: 70px;
        mask: radial-gradient(circle at 93% 93%, transparent 30px, black 0);
    }

    .articles-item-icon {
        right: -70px;
        width: 55px;
        height: 55px;
    }
}

@media (max-width: 1076px) {
    .tab-inner-news {
        gap: 50px;
    }

    .tab-inner-news h3 {
        font-size: 40px;
    }

    .news-content {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }

    .publications .container {
        padding: 0 30px;
    }

    .news-item {
        max-width: 407px;
        width: auto;
        min-height: 260px;
    }

    .news-item:before {
        height: 190px;
    }

    .news-item-title {
        font-size: 24px;
        max-width: 100%;
    }

    .news-item p {
        font-size: 14px;
        max-width: 100%;
    }
}

@media (max-width: 900px) {
    .news-content {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .news-item {
        max-width: 100%;
        padding: 30px 35px;
        margin-right: 70px;
    }

    .news-item:before {
        right: -70px;
        width: 70px;
        height: 190px;
    }

    .news-item:after {
        right: -35px;
        width: 70px;
        height: 70px;
        mask: radial-gradient(circle at 93% 93%, transparent 30px, black 0);
    }

    .news-item-icon {
        right: -70px;
        width: 55px;
        height: 55px;
    }

}

@media screen and (max-width: 768px) {
    .news-item {
        max-width: 100%;
        width: auto;
    }

    .about-tabs {
        width: max-content;
    }

    .articles-item-title {
        font-size: 24px;
    }
}

/*  Тарифы  */
.pricing-plans {
    padding: 50px 0;
}

.pricing-plans.pricing-plans__single .container {
    @media screen and (max-width: 768px) {
        padding: 0 6px;
    }
}

.pricing-filters {
    display: flex;
    flex-direction: column;
    gap: 50px;
    margin-bottom: 50px;
}

.services .pricing-filters {
    gap: 24px;
}

.pricing-filters__network,
.pricing-filters__plans {
    display: flex;
    flex-direction: row;
    gap: 6px;
    flex-wrap: wrap;

    @media screen and (max-width: 1076px) {
        align-items: center;
        justify-content: center;
    }
}

.pricing-filters__network-item {
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 0 16px;
    width: max-content;
    height: 41px;
    border: 1px solid #2C3E50;
    border-radius: 36px;
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 100;
    font-size: 18px;
    color: #2C3E50;
}

.pricing-filters__network-item.is-active {
    background: #2C3E50;
    color: #EEEFF0;
}

.pricing-filters__plans-item {
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 0 16px;
    width: max-content;
    height: 41px;
    background: #EEEFF0;
    border: 1px solid #2C3E50;
    border-radius: 36px;
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 100;
    font-size: 18px;
    color: #2C3E50;
}

.pricing-filters__network-item:hover,
.pricing-filters__plans-item:hover,
.pricing-filters__plans-item.is-active {
    background: #2C3E50;
    color: #EEEFF0;
    text-shadow: 0 0 1px currentColor;
    cursor: default;
}

.pricing-plans__list {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;

    @media screen and (max-width: 1300px) {
        justify-content: center;
        grid-template-columns: repeat(3, 0fr);
    }

    @media screen and (max-width: 1076px) {
        grid-template-columns: repeat(2, 0fr);
    }

    @media screen and (max-width: 660px) {
        grid-template-columns: repeat(1, 0fr);
    }
}

.services__show-all {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 0 24px;
    margin: 0 auto;
    background: #2C3E50;
    border-radius: 20px;
    max-width: 168px;
    height: 49px;
    font-weight: 500;
    font-size: 18px;
    line-height: 100%;
    color: #FFFFFF;
    border: none;
    outline: none;
    cursor: pointer;
}

.services .pricing-plans__list {
    grid-template-columns: repeat(3, 1fr);
    margin-bottom: 50px;

    @media screen and (max-width: 1300px) {
        justify-content: center;
        grid-template-columns: repeat(2, 0fr);
    }

    @media screen and (max-width: 1076px) {
        grid-template-columns: repeat(2, 0fr);
    }

    @media screen and (max-width: 860px) {
        grid-template-columns: repeat(1, 0fr);
        margin-bottom: 40px;
    }
}

.pricing-plans__item {
    position: relative;
    display: flex;
    flex-direction: column;;
    width: 292px;
    height: 415px;
    padding: 22px;
    background: url(../../images/pricing-plans/pricing-plans.svg) no-repeat center;
    transition: all 0.3s ease;
	flex: 0 0 292px;
}

.beautiful-number__form-container .pricing-plans__item.is-active {
    background: url(../../images/pricing-plans/pricing-plans-hover.svg) no-repeat center;;
}

.services .pricing-plans__item {
    width: 398px;
    background: url(../../images/services.svg) no-repeat center;
    padding: 50px 36px;
}

.pricing-plans__item:not(.visible) {
    opacity: 0;
    transform: translateY(20px);
    display: none;
}

.arrow--pricing-plans {
    position: absolute;
    width: 55px;
    height: 55px;
    top: 35.5%;
    right: 0;
}

.services .arrow--pricing-plans {
    top: 0;
}

.arrow--pricing-plans {
    transition: all .3s ease;
}

.arrow--pricing-plans:hover img {
    animation: flipRightToLeft 1s ease-in-out forwards;
}

.pricing-plans__button {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 0 24px;
    position: absolute;
    width: 157px;
    height: 49px;
    right: 0;
    bottom: 0;
    background: #E1FA3F;
    border-radius: 20px;
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    color: #2C3E50;
    border: 2px solid #E1FA3F;
    transition: background 1s linear;
}

.beautiful-number__form-container .pricing-plans__item .pricing-plans__button {
    background: #2C3E50;
    border: 2px solid #2C3E50;
    color: white;
    transition: all 0.5s ease;
}

.pricing-plans__button:hover {
    background: transparent;
}

.beautiful-number__form-container .pricing-plans__item.is-active .pricing-plans__button {
    color: #2C3E50;
    background: transparent;
}

.pricing-plans__item-title {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 0 16px;
    width: 100%;
    height: 41px;
    border: 1px solid #2C3E50;
    border-radius: 20px;
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 24px;
    color: #2C3E50;
    margin-bottom: 79px;
}

.services .pricing-plans__item-title {
    margin-bottom: 12px;
    max-width: 300px;
    border-radius: 0;
    border: none;
    align-items: start;
    justify-content: start;
    padding: 0;
    font-weight: 100;
    font-size: 34px;
    line-height: 47px;
    color: #2C3E50;
    height: auto;
}

.pricing-plans__item-text {
    display: flex;
    flex-direction: column;
    gap: 8px;
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    color: #2C3E50;
}

.pricing-plans__item-text p {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 100;
    font-size: 14px;
    color: #2C3E50;
    max-width: 194px;
}

.services .pricing-plans__item-text p,
.services .pricing-plans__item-text {
    font-weight: 100;
    font-size: 14px;
    line-height: 19px;
    color: #2C3E50;
    max-width: 100%;
}

.pricing-plans__item-price {
    position: absolute;
    bottom: 37px;
    left: 27px;
    display: flex;
    flex-direction: column;
}

.pricing-plans__item-price p {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: 12px;
    text-decoration-line: underline;
    color: #2C3E50;
    margin-bottom: 15px;
}

.pricing-plans__item-price p strong {
    font-weight: 500;
}

.pricing-plans__item-price span {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 24px;
    line-height: 100%;
    color: #2C3E50;
    margin-bottom: 0;
}

.services .pricing-plans__item-price span {
    font-size: 30px;
}

.pricing-plans__item-price span strong,
.pricing-plans__item-price span.pricing-plans__item-price--mounth {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 12px;
    line-height: 100%;
    color: #2C3E50;
}

.pricing-plans__banner {
    position: relative;
    width: 100%;
    height: 471px;
    margin-bottom: 50px;

    @media screen and (max-width: 1076px) {
        height: 320px;
    }

    @media screen and (max-width: 670px) {
        height: 296px;
        margin-bottom: 40px;
    }
}

.pricing-plans__banner::before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url(assets/images/pricing-plans/banner-first-step.svg) no-repeat center;
    background-size: contain;

    @media screen and (max-width: 670px) {
        background: url(assets/images/pricing-plans/banner-first-step-mobile.svg) no-repeat center;
        background-size: contain;
    }
}

.pricing-plans__banner.pricing-plans__banner-in-rhythm::before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url(assets/images/pricing-plans/banner-in-rhythm.svg) no-repeat center;
    background-size: contain;

    @media screen and (max-width: 670px) {
        background: url(assets/images/pricing-plans/banner-in-rhythm-mobile.svg) no-repeat center;
        background-size: contain;
    }
}

.pricing-plans__banner.on-waves::before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url(assets/images/pricing-plans/banner-on-waves.svg) no-repeat center;
    background-size: contain;

    @media screen and (max-width: 670px) {
        background: url(assets/images/pricing-plans/banner-on-waves-mobile.svg) no-repeat center;
        background-size: contain;
    }
}

.pricing-plans__banner.step::before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url(assets/images/pricing-plans/banner-step.svg) no-repeat center;
    background-size: contain;

    @media screen and (max-width: 670px) {
        background: url(assets/images/pricing-plans/banner-step-mobile.svg) no-repeat center;
        background-size: contain;
    }
}

.pricing-plans__banner.temp::before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url(assets/images/pricing-plans/banner-temp.svg) no-repeat center;
    background-size: contain;

    @media screen and (max-width: 670px) {
        background: url(assets/images/pricing-plans/banner-temp-mobile.svg) no-repeat center;
        background-size: contain;
    }
}

.pricing-plans__banner.flight::before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url(assets/images/pricing-plans/banner-flight.svg) no-repeat center;
    background-size: contain;

    @media screen and (max-width: 670px) {
        background: url(assets/images/pricing-plans/banner-flight-mobile.svg) no-repeat center;
        background-size: contain;
    }
}

.pricing-plans__banner.city::before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url(assets/images/pricing-plans/banner-495.svg) no-repeat center;
    background-size: contain;

    @media screen and (max-width: 670px) {
        background: url(assets/images/pricing-plans/banner-495-mobile.svg) no-repeat center;
        background-size: contain;
    }
}

.pricing-plans__banner.flow::before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url(assets/images/pricing-plans/banner-flow.svg) no-repeat center;
    background-size: contain;

    @media screen and (max-width: 670px) {
        background: url(assets/images/pricing-plans/banner-flow-mobile.svg) no-repeat center;
        background-size: contain;
    }
}

.pricing-plans__banner.base::before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url(assets/images/pricing-plans/banner-base.svg) no-repeat center;
    background-size: contain;

    @media screen and (max-width: 670px) {
        background: url(assets/images/pricing-plans/banner-base-mobile.svg) no-repeat center;
        background-size: contain;
    }
}

.pricing-plans__banner.stability::before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url(assets/images/pricing-plans/banner-stability.svg) no-repeat center;
    background-size: contain;

    @media screen and (max-width: 670px) {
        background: url(assets/images/pricing-plans/banner-stability-mobile.svg) no-repeat center;
        background-size: contain;
    }
}

.pricing-plans__banner.that::before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url(assets/images/pricing-plans/banner-that.svg) no-repeat center;
    background-size: contain;

    @media screen and (max-width: 670px) {
        background: url(assets/images/pricing-plans/banner-that-mobile.svg) no-repeat center;
        background-size: contain;
    }
}

.pricing-plans__banner.backup::before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url(assets/images/pricing-plans/banner-backup.svg) no-repeat center;
    background-size: contain;

    @media screen and (max-width: 670px) {
        background: url(assets/images/pricing-plans/banner-backup-mobile.svg) no-repeat center;
        background-size: contain;
    }
}

.pricing-plans__banner.always-connection::before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url(assets/images/pricing-plans/banner-always-connection.svg) no-repeat center;
    background-size: contain;

    @media screen and (max-width: 670px) {
        background: url(assets/images/pricing-plans/banner-always-connection-mobile.svg) no-repeat center;
        background-size: contain;
    }
}

.pricing-plans__banner.your-connection__banner::before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url(assets/images/your-connection.svg) no-repeat center;
    background-size: contain;

    @media screen and (max-width: 670px) {
        background: url(assets/images/your-connection-mobile.svg) no-repeat center;
        background-size: contain;
    }
}

.pricing-plans__connection {
    position: relative;
    display: flex;
    justify-content: space-between;
    width: 100%;
    border: 3px solid #2C3E50;
    border-radius: 54px;
    margin-bottom: 50px;
    padding: 68px 65px;
    overflow: hidden;
    max-height: 252px;

    @media screen and (max-width: 1076px) {
        padding: 90px 36px;
        max-height: 325px;
    }

    @media screen and (max-width: 768px) {
        margin-bottom: 0;
        padding: 53px 42px;
        max-height: 390px;
    }
}

.pricing-plans__connection__title {
    display: flex;
    flex-direction: column;
    gap: 0;
    flex-basis: 33%;
    order: 1;

    @media screen and (max-width: 1076px) {
        gap: 16px;
        flex-basis: 44%;
    }
    @media screen and (max-width: 768px) {
        align-items: center;
        flex-basis: 100%;
    }
}

.pricing-plans__connection__links {
    display: flex;
    align-items: start;
    gap: 36px;
    order: 2;

    @media screen and (max-width: 1076px) {
        order: 3;
    }
}

.pricing-plans__connection__links.is-mobile {
    display: none;

    @media screen and (max-width: 1076px) {
        display: flex;
    }
    @media screen and (max-width: 768px) {
        align-items: center;
    }
}

.pricing-plans__connection__links.is-mobile .pricing-plans__connection-qr {
    display: none;

    @media screen and (max-width: 768px) {
        display: block;
    }
}

.pricing-plans__connection__title .footer-apps__links {
    display: flex;
    flex-direction: row;
    gap: 8px;

}

.pricing-plans__connection__title .footer-apps__links img {
    width: 109px;
    height: 33px;
    max-width: 100%;
}

.pricing-plans__connection__title .footer-apps__links {
    @media screen and (max-width: 768px) {
        flex-direction: column;
    }
}

.pricing-plans__connection__title span {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 24px;
    color: #2C3E50;
    max-width: 214px;

    @media screen and (max-width: 1076px) {
        line-height: 100%;
    }
    @media screen and (max-width: 768px) {
        text-align: center;
    }
}

.pricing-plans__connection__title p {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: 14px;
    color: #2C3E50;
    max-width: 305px;

    @media screen and (max-width: 1076px) {
        line-height: 100%;
    }
}

.pricing-plans__connection__title {
    gap: 16px;

    .pricing-plans__connection__links.is-desktop {
        flex-basis: 33%;
    }
}

.pricing-plans__connection__links.is-desktop .pricing-plans__connection-qr {
    width: 100px;
    height: 100px;

    @media screen and (max-width: 1076px) {
        width: 134px;
        height: 134px;
    }
}

@media screen and (max-width: 1076px) {

    .pricing-plans__connection-phone--desktop,
    .pricing-plans__connection__links.is-desktop .footer-apps__links {
        display: none;
    }
}

@media screen and (max-width: 768px) {
    .pricing-plans__connection__links.is-desktop {
        display: none;
    }
}

.pricing-plans__connection-phone {
    flex-basis: 33%;
    width: 218px;
    order: 3;

    @media screen and (max-width: 1076px) {
        order: 2;
    }

    @media screen and (max-width: 768px) {
        display: none;
    }
}

.pricing-plans__connection-phone--mobile {
    display: none;

    @media screen and (max-width: 1076px) {
        display: block;
    }
}

.pricing-plans__connection-phone img {
    position: absolute;
    bottom: 0;
    right: 126px;
    width: 218px;

    @media screen and (max-width: 1076px) {
        right: 25%;
    }
}

.pricing-plans__single-content {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    gap: 74px;
    margin-bottom: 50px;

    @media screen and (max-width: 1076px) {
        flex-direction: column;
        align-items: center;
    }

    @media screen and (max-width: 768px) {
        margin-bottom: 40px;
        gap: 50px;
    }
}

.pricing-plans__single-forms {
    max-width: 625px;
    width: 100%;
    flex-basis: 52%;

    @media screen and (max-width: 1076px) {
        max-width: 702px;
        flex-basis: 100%;
    }
}

.pricing-plans__single-result {
    max-width: 517px;
    width: 100%;
    flex-basis: 48%;

    @media screen and (max-width: 1076px) {
        max-width: 649px;
        flex-basis: 100%;
    }
}

.pricing-plans__single-forms,
.pricing-plans__single-result {
    display: flex;
    flex-direction: column;
    gap: 50px;
}

.pricing-plans__single-form {
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 24px;
    background: #EEF1F6;
    border-radius: 36px;
}

.single-form__plan-header h2 {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 24px;
    color: #2C3E50;
    line-height: 100%;
    text-align: left;
    text-transform: none;
    margin-bottom: 16px;

    @media screen and (max-width: 650px) {
        max-width: 378px;
    }
}

.pricing-plans__single-form.blue .single-form__plan-header h2 {
    margin-bottom: 6px;
}

.single-form__plan-header p {
    font-weight: 100;
    font-size: 18px;
    color: #2C3E50;
    margin: 0;
}

.single-form__card {
    background: #fff;
    border-radius: 36px;
    padding: 20px 24px;
    display: flex;
    flex-direction: column;

    @media screen and (max-width: 768px) {
        padding: 24px 16px;
    }
}

.single-form__card-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.single-form__card-title {
    display: flex;
    align-items: center;
    gap: 16px;
    font-size: 18px !important;

    @media screen and (max-width: 768px) {
        flex-basis: 70%;
    }
}

.single-form__card-title span {
    font-weight: 500;
    font-size: 18px;
    color: #2C3E50;
}

.mobile-on {
    display: none;

    @media screen and (max-width: 768px) {
        display: block;
    }
}

.single-form__price {
    font-weight: 500;
    font-size: 24px;
    color: #2C3E50;
}

@media screen and (max-width: 1076px) {
    .pricing-plans__single-form.blue .single-form__price {
        font-size: 18px;
    }
}

.single-form__arrow {
    width: 8px;
    height: 8px;
    border-right: 2px solid #2C3E50;
    border-bottom: 2px solid #2C3E50;
    transform: rotate(-45deg);
}

.single-form__card-content {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.single-form__row {
    display: flex;
    justify-content: space-between;
    font-weight: 100;
    font-size: 18px;
    color: #2C3E50;

    @media screen and (max-width: 768px) {
        font-size: 14px;
    }
}

.pricing-plans__single-form .single-form__card-content .single-form__row {
    font-size: 18px;
}

.single-form__divider {
    height: 1px;
    background: rgba(44, 62, 80, 0.15);
}

.single-form__list-item {
    font-weight: 100;
    font-size: 18px;
    color: #2C3E50;

    @media screen and (max-width: 768px) {
        max-width: 285px;
    }
}

.single-form__switch {
    position: relative;
    width: 60px;
    height: 34px;
}

.single-form__switch input {
    display: none;
}

.single-form__slider {
    position: absolute;
    inset: 0;
    border-radius: 36px;
    border: 2px solid #2C3E50;
    cursor: pointer;
    transition: 0.3s;
}

.single-form__slider::before {
    content: "";
    position: absolute;
    width: 24px;
    height: 24px;
    left: 4px;
    top: 50%;
    transform: translateY(-50%);
    background: #2C3E50;
    border-radius: 50%;
    transition: 0.3s;
}

.single-form__switch input:checked + .single-form__slider::before {
    transform: translate(26px, -50%);
    background: white;
}

.single-form__switch input:checked + .single-form__slider {
    background: rgba(44, 62, 80, 1);
}

.single-form__select-card {
    background: #fff;
    border-radius: 36px;
    padding: 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 18px;
}

.single-form__radio {
    position: relative;
    width: 22px;
    height: 22px;
    padding: 10px;
}

.single-form__radio input {
    display: none;
}

.single-form__radio span {
    position: absolute;
    inset: 0;
    border: 2px solid #2C3E50;
    border-radius: 50%;
}

.single-form__radio input:checked + span::after {
    content: "";
    position: absolute;
    width: 12px;
    height: 12px;
    background: #2C3E50;
    border-radius: 50%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.single-form__description-link {
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 100;
    font-size: 18px;
    color: #2C3E50;
    cursor: pointer;
}

.single-form__card-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease, margin-top 0.1s ease;
    margin-top: 0;
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-top: 0;
}

.single-form__card.active .single-form__card-content {
    max-height: 500px;
    margin-top: 24px;

    @media screen and (max-width: 768px) {
        margin-top: 20px;
    }
}

.single-form__arrow {
    width: 8px;
    height: 8px;
    border-right: 2px solid #2C3E50;
    border-bottom: 2px solid #2C3E50;
    transform: rotate(45deg);
    transition: transform 0.3s ease;

    @media screen and (max-width: 768px) {
        display: none;
    }
}

.single-form__card.active .single-form__arrow {
    transform: rotate(-135deg);
}

.single-form__card-top {
    cursor: pointer;
}

.single-form__select-cards {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.single-form__cards {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.pricing-plans__single-result {
    display: flex;
    flex-direction: column;
    gap: 24px;
    background: #EEF1F6;
    border-radius: 36px;
    max-height: max-content;
    padding: 24px;
    min-height: 589px;

    @media screen and (max-width: 1076px) {
        margin: 0 40px;
        min-height: 539px;
    }

    @media screen and (max-width: 768px) {
        max-width: 389px;
        max-height: 564px;
        padding: 24px 0;
    }
}

.single-result__number {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 6px;

    @media screen and (max-width: 768px) {
        max-width: 389px;
        max-height: 564px;
        padding: 0 25px;
    }
}

.single-result__number input::placeholder {
    color: rgba(44, 62, 80, 0.3);
}

.single-result__number input {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    color: rgba(44, 62, 80, 1);
    width: max-content;
    border: none;
    background: transparent;
}

.custom-colored-placeholder {
    position: absolute;
    left: 0;
    bottom: 0;
    pointer-events: none;
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    white-space: nowrap;

    @media screen and (max-width: 768px) {
        left: 24px;
    }
}

.custom-colored-placeholder .first-part {
    color: #2C3E50;
}

.custom-colored-placeholder .rest-part {
    color: rgba(44, 62, 80, 0.3);
}

.single-result__number input::placeholder {
    color: transparent !important;
}

@media (max-width: 768px) {
    .custom-colored-placeholder {
        font-size: 16px;
    }
}


.single-result__price {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 50px;
    padding: 67px 0;

    @media screen and (max-width: 1076px) {
        padding: 40px 0;
    }

    @media screen and (max-width: 768px) {
        gap: 40px;
    }
}

.single-result__price::before {
    position: absolute;
    content: '';
    top: 0;
    left: -45px;
    width: 565px;
    height: 473px;
    background: url(assets/images/pricing-plans/single-result-price.svg) no-repeat center;

    @media screen and (max-width: 1076px) {
        background: url(assets/images/pricing-plans/single-result-price-tablet.svg) no-repeat center;
        width: 702px;
        height: 423px;
        background-size: contain;
    }

    @media screen and (max-width: 768px) {
        background: url(assets/images/pricing-plans/single-result-price-mobile.svg) no-repeat center;
        width: 417px;
        height: 423px;
        background-size: contain;
        left: -15px;
    }
}

.single-result__price-content {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-around;
    z-index: 1;
}

.single-result__price-content span {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 100;
    font-size: 18px;
    color: #FFFFFF;
}

.single-result__price-content span.big {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 40px;
    color: #E1FA3F;
}

.single-result__price-button.is-active,
.single-result__price-button--white {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 27px 16px;
    width: 100%;
    height: 100px;
    gap: 8px;
    background: #EEF1F6;
    border-radius: 36px;
    z-index: 1;
    cursor: pointer;
    white-space: normal;

    @media screen and (max-width: 768px) {
        height: 64px;
    }
}

.single-result__price-button.is-active span,
.single-result__price-button--white span {
    font-style: normal;
    font-weight: 300;
    font-size: 14px;
    line-height: 100%;
    color: #2C3E50;
}

.single-result__price-button.is-active span.single-result__price-button--title,
.single-result__price-button--white span.single-result__price-button--title {
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    color: #2C3E50;
    line-height: 100%;

    @media screen and (max-width: 1076px) {
        font-size: 16px;
    }
}

.single-result__price-next {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 6px;
    z-index: 1;
    width: 100%;

    @media screen and (max-width: 768px) {

        align-items: center;
    }
}

.single-result__price-next--button {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 0 24px;
    width: 400px;
    height: 57px;
    background: #E1FA3F;
    border-radius: 20px;
    border: none;
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    color: #2C3E50;
    margin: 0 auto;
    text-align: center;

    @media screen and (max-width: 768px) {
        width: 100%;
    }
}

.services-item__modal-container .custom-checkbox,
.sim-recovery__form .custom-checkbox,
.single-result__price-next .custom-checkbox {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    font-size: 14px;
    color: #BFBFBF;
    user-select: none;
}

.services-item__modal-container .custom-checkbox input,
.sim-recovery__form .custom-checkbox input,
.single-result__price-next .custom-checkbox input {
    display: none;
}

.services-item__modal-container .checkmark,
.sim-recovery__form .checkmark,
.single-result__price-next .checkmark {
    width: 18px;
    height: 18px;
    border: 2px solid #D9D9D9;
    border-radius: 50%;
    margin-right: 8px;
    position: relative;
    transition: all 0.2s ease;

}

.sim-recovery__form .checkmark {
    width: 12px;
    height: 12px;
    border-width: 1px;
    border-color: rgba(44, 62, 80, 1);
}

/* .single-result__price-next .custom-checkbox input:checked+.checkmark {
    padding: 1px;
} */

.services-item__modal-container .custom-checkbox,
.sim-recovery__form .custom-checkbox {
    display: flex;
    align-items: center;
    justify-content: flex-start;

    @media screen and (max-width: 768px) {
        max-width: 326px;
    }
}

.services-item__modal-container .custom-checkbox input:checked + .checkmark::after,
.sim-recovery__form .custom-checkbox,
.single-result__price-next .custom-checkbox input:checked + .checkmark::after {
    content: "";
    position: absolute;
    top: 1px;
    left: 1px;
    width: 12px;
    height: 12px;
    background: #D9D9D9;
    border-radius: 50%;
}

.services-item__modal-container .custom-checkbox input:checked + .checkmark::after,
.sim-recovery__form .custom-checkbox input:checked + .checkmark::after {
    background: rgba(44, 62, 80, 1);
    width: 8px;
    height: 8px;
}

.services-item__modal-container .custom-checkbox .label-text,
.sim-recovery__form .custom-checkbox .label-text,
.single-result__price-next .custom-checkbox .label-text {
    font-style: normal;
    font-weight: 300;
    font-size: 14px;
    color: #FFFFFF;
}

.services-item__modal-container .custom-checkbox .label-text,
.sim-recovery__form .custom-checkbox {
    color: rgba(44, 62, 80, 1);
    font-size: 12px;
}

.single-form__your-number {
    display: flex;
    gap: 16px;
    cursor: pointer;
}

/* Overlay */
.single-form__modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.35);
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    visibility: hidden;
    transition: 0.3s ease;
    z-index: 1000;
}

.single-form__modal-overlay.active {
    opacity: 1;
    visibility: visible;
}

.single-form__modal {
    width: 625px;
    padding: 24px;
    background: #FFFFFF;
    border-radius: 36px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
    position: relative;
    font-family: 'Manrope', sans-serif;
}

.single-form__modal-header {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 6.5px;
}

.single-form__modal-title {
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    text-align: center;
    color: #2C3E50;
    text-transform: none;
    line-height: 100%;
}

.single-form__modal-close {
    width: 38px;
    height: 38px;
    border: 1px solid #2C3E50;
    border-radius: 50%;
    background: transparent;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    position: absolute;
    right: 24px;
    top: 24px;
}

.single-form__modal-close span {
    width: 12px;
    height: 12px;
    position: relative;
}

.single-form__modal-close span::before,
.single-form__modal-close span::after {
    content: "";
    position: absolute;
    width: 12px;
    height: 2px;
    background: #2C3E50;
    top: 5px;
    left: 0;
}

.single-form__modal-close span::before {
    transform: rotate(45deg);
}

.single-form__modal-close span::after {
    transform: rotate(-45deg);
}

.single-form__modal-text {
    max-width: 425px;
    font-style: normal;
    font-weight: 100;
    font-size: 18px;
    line-height: 25px;
    color: #2C3E50;
}

.single-form__modal-btn {
    padding: 12px 24px;
    background: #E1FA3F;
    border-radius: 20px;
    border: none;
    font-weight: 500;
    font-size: 18px;
    line-height: 25px;
    color: #2C3E50;
    cursor: pointer;
    transition: 0.2s ease;
}

.single-form__modal-btn:hover {
    transform: translateY(-2px);
}

.single-form__modal--reserve {
    width: 720px;
    padding: 32px;
}

.single-form__modal--reserve .single-form__modal-title {
    @media screen and (max-width: 768px) {
        max-width: 292px;
    }
}

.single-form__modal-subtitle {
    font-weight: 500;
    font-size: 18px;
    color: #2C3E50;
    text-align: center;
}

.single-form__modal-features {
    width: 100%;
    background: #F1F3F6;
    border-radius: 32px;
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.single-form__modal-feature {
    display: flex;
    gap: 16px;
}

.single-form__modal-feature-title {
    font-weight: 500;
    font-size: 18px;
    color: #2C3E50;
    margin-bottom: 4px;
}

.single-form__modal-feature-desc {
    font-weight: 300;
    font-size: 16px;
    line-height: 22px;
    color: #2C3E50;
    opacity: 0.8;
}

.single-form__modal-divider {
    height: 1px;
    background: rgba(44, 62, 80, 0.1);
}

.single-form__modal-feature-text {
    position: relative;
    margin-left: 50px;
}

.single-form__modal-feature-text img {
    position: absolute;
    top: 50%;
    left: -50px;
    transform: translateY(-50%);
    width: 40px;
    height: 40px;
}

.single-result__price-type {
    position: relative;
    display: flex;
    gap: 16px;
    z-index: 1;

    @media screen and (max-width: 768px) {
        flex-direction: column;
    }
}

.pricing-plans__single .single-result__price-type {
    @media screen and (max-width: 768px) {
        flex-direction: row;
    }
}

.single-result__price-type .single-result__price-button--white,
.single-result__price-type .single-result__price-button--transparent {
    height: 100px;
}

.single-result__price-type .single-result__price-button--white span {
    text-align: center;
}

.single-result__price-button--transparent {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 10px;
    padding: 27px 16px;
    width: 100%;
    height: 100px;
    border: 1px solid #DEE4EE;
    border-radius: 36px;
    cursor: pointer;
}

.single-result__price-button--transparent span.single-result__price-button--title {
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    white-space: nowrap;
}

.single-result__price-button--transparent span.single-result__price-button--title,
.single-result__price-button--transparent span {
    color: rgba(255, 255, 255, 1);

    @media screen and (max-width: 1076px) {
        font-size: 16px;
    }
}

.single-result__price-button--transparent span {
    font-style: normal;
    font-weight: 300;
    font-size: 14px;
    line-height: 100%;
    text-align: center;
}

.single-form__select-card.tarif > div {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.single-form__select-card.tarif > div span:first-child {
    font-weight: 500;
    font-size: 18px;
    line-height: 25px;
    color: #2C3E50;
}

.single-form__select-card.tarif > div span:last-child {
    font-style: normal;
    font-weight: 300;
    font-size: 14px;
    color: #2C3E50;
}

.single-form__select-card.tarif > div span.single {
    font-weight: 500;
    font-size: 18px;
    line-height: 25px;
    color: #2C3E50;
}

.pricing-plans__single-form.blue .single-form__card-tarif p {
    font-size: 14px;
}

.single-form__card-info {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 24px;
    gap: 10px;
    width: 100%;
    background: #FFFFFF;
    border-radius: 36px;
}

.single-form__card-info-item {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 0 0 16px;
    gap: 16px;
    border-bottom: 1px solid rgba(44, 62, 80, .25);
}

.single-form__card-info-item:last-child {
    border: none;
    padding-bottom: 0;
}

.single-form__card-info-item > div {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.single-form__card-info-item > div span {
    font-weight: 500;
    font-size: 18px;
    color: #2C3E50;
}

.single-form__card-info-item img {
    width: 40px;
    height: 40px;
}


.pricing-plans__single-form.blue {
    background: rgba(44, 62, 80, 1);
}

.pricing-plans__single-form.blue .single-form__card,
.pricing-plans__single-form.blue .single-form__select-card {
    background-color: rgba(238, 241, 246, 1);
}

.pricing-plans__single-form.blue .single-form__plan-header h2 {
    color: white;
}

.single-form__plan-header.city h2 {
    margin-bottom: 6px;
}

.single-form__plan-header p {
    font-style: normal;
    font-weight: 100;
    font-size: 18px;
    color: #2C3E50;
}

.pricing-plans__single-form.blue .single-form__plan-header p {
    font-size: 14px;
    color: white;
}

.pricing-plans__single-form.blue .single-form__card-info {
    background-color: rgba(238, 241, 246, 1);
}

.pricing-plans__single-form.blue .single-form__description-link {
    color: rgba(255, 255, 255, 1);
}

.pricing-plans__single-form .single-form__plan-header p.blue {
    color: rgba(44, 62, 80, 1);
}

.single-form__plan-tabs {
    display: flex;
    gap: 42px;
    margin-bottom: -8px;
}

.single-form__plan-tab {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 8px 18px;
    width: max-content;
    height: 41px;
    border-radius: 36px;
    font-weight: 100;
    font-size: 18px;
    line-height: 25px;
    color: #FFFFFF;
    cursor: pointer;
}

.single-form__plan-tab.is-active {
    border: 1px solid white;
}

.single-form__card-tarif {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;

    @media screen and (max-width: 768px) {
        gap: 6px;
    }
}

.single-form__card-tarif .title {
    font-weight: 500 !important;
    font-size: 18px !important;
    color: #2C3E50 !important;

    @media screen and (max-width: 768px) {
        line-height: 100%;
    }
}

.single-form__card-tarif span {
    font-weight: 300 !important;
    font-size: 14px !important;
    color: rgba(44, 62, 80, 0.5) !important;

    @media screen and (max-width: 768px) {
        line-height: 100% !important;
    }
}

.single-form__card-tarif .operators {
    display: flex;
    gap: 8px;
}

.single-form__card-tarif .operator {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 6px;
    width: max-content;
    height: 28px;
    border: 1px solid rgba(44, 62, 80, 0.5);
    border-radius: 36px;
    font-weight: 300;
    font-size: 12px;
    color: rgba(44, 62, 80, 0.5);

    cursor: pointer;
}

.single-form__card-tarif .operator:hover,
.single-form__card-tarif .operator.is-active {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 6px;
    width: max-content;
    height: 28px;
    background: #2C3E50;
    border-radius: 36px;
    color: #FFFFFF;
}

.arrange .pricing-plans__connection__title span {
    max-width: 305px;
    line-height: 100%;
}

.pricing-plans__connection__title ul {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.pricing-plans__connection__title ul li {
    position: relative;
    font-weight: 300;
    font-size: 14px;
    line-height: 100%;
    color: #2C3E50;
    padding-left: 23px;
}

.pricing-plans__connection__title ul li::before {
    position: absolute;
    content: '';
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    background: url(assets/images/check-mark.svg) no-repeat center;
    width: 15px;
    height: 10px;
    background-size: cover;
}

.arrange .pricing-plans__connection {
    padding: 51px 65px;

    @media screen and (max-width: 1076px) {
        padding: 38px 64px;
    }
}

.arrange__title {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    height: 430px;
    gap: 5px;
    padding: 51px 0 24px;
    margin-bottom: 50px;

    @media screen and (max-width: 768px) {
        height: 348px;
        margin-top: 40px;
        margin-bottom: 40px;
        padding: 0;
    }
}

.arrange--no-height .arrange__title {
    height: auto;
    margin-top: 33px;
}

.arrange__title h1 {
    font-weight: 100;
    font-size: 34px;
    line-height: 100%;
    color: #2C3E50;

    @media screen and (max-width: 870px) {
        font-size: 24px;
    }
}

.arrange__title p {
    font-weight: 100;
    font-size: 18px;
    line-height: 100%;
    color: #2C3E50;
    text-align: center;

    @media screen and (max-width: 870px) {
        font-size: 14px;
    }
}

.arrange__requirements {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 50px;
    margin-bottom: 50px;

    @media screen and (max-width: 870px) {
        gap: 40px;
        margin-bottom: 40px;
    }
}

.arrange__requirements a {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 14px 20px;
    background: #2C3E50;
    border-radius: 36px;
    font-weight: 300;
    font-size: 14px;
    line-height: 100%;
    color: #FFFFFF;
    max-width: 144px;
}

.arrange__requirements-list {
    display: flex;
    gap: 25px;

    @media screen and (max-width: 1250px) {
        gap: 16px;
    }

    @media screen and (max-width: 870px) {
        flex-direction: column;
    }
}

.arrange__requirements-item {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 397px;
    height: 250px;
    padding: 0 68px;

    @media screen and (max-width: 1250px) {
        width: 263px;
        height: 166px;
        padding: 0 46px;
    }
}

.arrange__requirements-item::before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url(assets/images/requirements-item.svg) no-repeat center;
    z-index: -1;

    @media screen and (max-width: 1250px) {
        background: url(assets/images/requirements-item-mobile.svg) no-repeat center;
    }
}

@media screen and (max-width: 870px) {
    .your-connection .arrange__requirements-item::before {
        background: url(assets/images/your-connection-requirements-item.svg) no-repeat center;
    }
}

.arrange__requirements-item p {
    font-weight: 500;
    font-size: 18px;
    line-height: 100%;
    text-align: center;
    color: #FFFFFF;

    @media screen and (max-width: 1250px) {
        font-size: 14px;
        font-weight: 300;
    }
}

.arrange__requirements-item span {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    bottom: 0;
    left: 0;
    width: 60px;
    height: 60px;
    background: rgba(44, 62, 80, 1);
    font-weight: 500;
    font-size: 24px;
    line-height: 100%;
    text-align: center;
    color: #FFFFFF;
    border-radius: 50%;

    @media screen and (max-width: 1250px) {
        width: 40px;
        height: 40px;
        font-size: 16px;
    }
}

@media screen and (max-width: 870px) {
    .your-connection .arrange__requirements-item span {
        width: 59px;
        height: 59px;
        font-size: 23.58px;
    }
}


.arrange--no-height .arrange_content {
    margin-bottom: 80px;

    @media screen and (max-width: 1076px) {
        margin-bottom: 50px;
    }
}

.arrange_content {
    position: relative;
    width: 100%;
    height: 100%;
    padding: 0;
    min-height: 197px;
    margin-bottom: 124px;
}

.arrange_content-list {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 32px;
    max-width: 690px;
    margin-left: auto;
    height: 197px;
    overflow: hidden;
    font-family: 'Manrope', sans-serif;
    will-change: transform;

    @media screen and (max-width: 1150px) {
        max-width: 590px;
    }

    @media screen and (max-width: 1030px) {
        max-width: 500px;
    }

    @media screen and (max-width: 850px) {
        max-width: 400px;
    }
}

@media screen and (max-width: 768px) {
    .arrange_content-list {
        height: 281px;
        max-width: 100%;
        gap: 24px;
        margin-left: 0;
        will-change: transform;
    }

    .arrange_content img {
        top: 50% !important;
        transform: translateY(-50%);
    }

    .arrange_content-list {
        height: 167px;
    }

    .arrange_content-item {
        left: auto !important;
        right: 0 !important;
        width: 100% !important;
        max-width: 236px;
        height: 167px !important;
    }
}

.arrange_content img {
    position: absolute;
    top: 0;
    left: 310px;
    width: 206px;
    height: 197px;

    @media screen and (max-width: 1250px) {
        left: 210px;
    }

    @media screen and (max-width: 1030px) {
        left: 100px;
    }

}

@media screen and (max-width: 1076px) {

    .arrange .pricing-plans__connection-phone--mobile {
        display: block;
        bottom: -25px;
    }

    .arrange .pricing-plans__connection__links {
        display: none;
    }

    .arrange .pricing-plans__connection-phone--desktop {
        display: none;
    }

    .arrange .pricing-plans__connection-phone img {
        right: 100px;
    }

    .arrange .pricing-plans__connection__title .pricing-plans__connection__links.is-mobile {
        display: flex;
    }

    .arrange .pricing-plans__connection__title {
        flex-basis: 50%;
    }
}

@media screen and (max-width: 768px) {
    .arrange .pricing-plans__connection__title .footer-apps__links {
        flex-direction: row;
    }

    .arrange .pricing-plans__connection__links.is-mobile .pricing-plans__connection-qr {
        display: none;
    }

    .arrange .pricing-plans__connection__title {
        flex-basis: 100%;
        align-items: start;
    }

    .arrange .pricing-plans__connection {
        padding: 37.5px 24px;
        margin-bottom: 40px;
    }

    .arrange .pricing-plans__connection__title ul,
    .arrange .pricing-plans__connection__title span {
        padding: 0 19px;
    }
}

.quick-faq {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 50px;
    width: 100%;
    margin: 0 auto 80px;

    @media screen and (max-width: 768px) {
        margin: 0 auto 36px;
        gap: 24px;
    }
}

.quick-faq__title {
    font-weight: 300;
    font-size: 34px;
    line-height: 100%;
    color: #2C3E50;
    text-transform: none;

    @media screen and (max-width: 768px) {
        font-size: 24px;
    }
}

.quick-faq__list {
    display: flex;
    flex-direction: column;
    gap: 24px;
    width: 100%;
    max-width: 1135px;
}

.quick-faq__item {
    display: flex;
    flex-direction: column;
    gap: 0;
    transition: all 0.5s ease;
}

.quick-faq__question {
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent
}

.quick-faq__question span {
    font-family: 'Manrope', sans-serif;
    font-weight: 500;
    font-size: 18px;
    line-height: 100%;
    color: #2C3E50;
}

.quick-faq__icon {
    width: 30px;
    height: 15px;
    transition: transform 0.3s ease;
}

.quick-faq__icon {
    width: auto;
    height: auto;
}

.quick-faq__icon img {
    width: 30px;
    height: 15px;
}

.number-activation .quick-faq__icon {
    width: 32px;
    height: 32px;
    transition: transform 0.3s ease;


}


@media screen and (max-width: 768px) {
    .number-activation .quick-faq__icon,
    .number-activation .quick-faq__icon svg {
        width: 20px;
        height: 20px;
    }
}

.quick-faq__item.active {
    gap: 16px;
}

.quick-faq__item.active .quick-faq__icon {
    transform: rotate(180deg);
}

.quick-faq__answer {
    font-family: 'Manrope', sans-serif;
    font-weight: 300;
    font-size: 14px;
    line-height: 100%;
    color: #2C3E50;

    max-width: 800px;

    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease, opacity 0.3s ease;
    opacity: 0;
}

.quick-faq__answer ul {
    list-style-type: disc;
    padding-left: 20px;
}

.quick-faq__answer ul li::marker {
    font-size: 10px;
}

.quick-faq__item.active .quick-faq__answer {
    max-height: 500px;
    opacity: 1;
}

.buy-sim .pricing-plans__connection {
    background: radial-gradient(270.83% 270.83% at 50% 107.34%, #F3DDBE 0%, #AF936C 100%);
    border: none;
}

@media screen and (max-width: 1076px) {
    .buy-sim.arrange .pricing-plans__connection__links {
        display: flex;
        align-items: center;
    }

    .buy-sim.arrange .pricing-plans__connection-phone img {
        right: 221px;
    }
}

@media screen and (max-width: 885px) {
    .buy-sim.arrange .pricing-plans__connection__links {
        display: none;
    }

    .buy-sim.arrange .pricing-plans__connection-phone {
        display: none;
    }

    .buy-sim.arrange .pricing-plans__connection__links.is-mobile .pricing-plans__connection-qr {
        display: flex;
    }

    .buy-sim .pricing-plans__connection__title .footer-apps__links {
        flex-direction: column;
    }

    .buy-sim .pricing-plans__connection {
        max-height: 100%;
    }
}

.buy-sim__advantages {
    display: flex;
    flex-wrap: nowrap;
    gap: 0;
    margin-bottom: 50px;

    @media screen and (max-width: 768px) {
        margin-bottom: 40px;
        flex-wrap: wrap;
        gap: 12px;
    }
}

.buy-sim__advantages-item {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 18px;
    height: 61px;
    background: #F0EFEE;
    border-radius: 36px;
    font-weight: 500;
    font-size: 18px;
    line-height: 100%;
    text-align: center;
    color: #AF936C;
    flex-basis: 33%;

    @media screen and (max-width: 768px) {
        flex-basis: 100%;
        height: 86px;
    }
}

.buy-sim__tarif {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
    margin: 0 auto;
    max-width: 972px;
    padding: 24px;
    margin-bottom: 50px;

    @media screen and (max-width: 1076px) {
        align-items: start;
    }
    @media screen and (max-width: 768px) {
        align-items: center;
        margin-bottom: 40px;
    }
}

.buy-sim__tarif-list {
    display: flex;
    flex-direction: row;
    gap: 24px;


}

@media screen and (max-width: 1076px) {
    .buy-sim__tarif-list .pricing-plans__item:last-child {
        display: none;
    }
}

@media screen and (max-width: 768px) {
    .buy-sim__tarif-list .pricing-plans__item:last-child {
        display: flex;
    }
}

.all-tarif {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 0 20px;
    max-width: 256px;
    width: 100%;
    height: 53px;
    border: 2px solid #2C3E50;
    border-radius: 36px;
    font-weight: 500;
    font-size: 18px;
    line-height: 100%;
    color: #2C3E50;
    margin: 0 auto;
}

@media (max-width: 900px) {

    .buy-sim__tarif {
        padding: 24px 0;
        margin-bottom: 40px;
    }

    .buy-sim__tarif-list {
        display: flex;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;

        width: 100vw;
        margin-left: calc(-50vw + 50%);

        gap: 16px;
        padding: 0 16px;

        margin-left: 21px;
    }

    .buy-sim__tarif-list::-webkit-scrollbar {
        display: none;
    }

    .pricing-plans__item {
        flex: 0 0 292px;
        scroll-snap-align: start;
    }
}

.all-occasions {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 70px;
    padding: 24px 0;
    margin-bottom: 50px;

    @media screen and (max-width: 768px) {
        margin-bottom: 40px;
    }
}

.all-occasions h3 {
    font-weight: 300;
    font-size: 34px;
    line-height: 100%;
    text-align: center;
    color: #2C3E50;

    @media screen and (max-width: 768px) {
        font-size: 24px;
    }
}

.all-occasions__container {
    position: relative;
    width: 565px;
    height: 232px;

    @media screen and (max-width: 768px) {
        width: 429px;
        margin-left: 0;
        height: 172px;
    }
}

.all-occasions__item {
    position: absolute;
    top: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 200px;
    height: 200px;
    padding: 26px;
    border-radius: 22px;

    @media screen and (max-width: 768px) {
        width: 152px;
        height: 152px;
    }
}

.all-occasions__item img {
    position: absolute;
    width: 44px;
    height: 44px;
    z-index: -1;
}

.all-occasions__item:first-child img {
    bottom: 29px;
    left: 4px;

    @media screen and (max-width: 768px) {
        width: 33px;
        height: 33px;
    }
}

.all-occasions__item:nth-child(2) img {
    top: 13px;
    left: 1px;
    transform: rotate(40deg);

    @media screen and (max-width: 768px) {
        width: 33px;
        height: 33px;
    }
}

.all-occasions__item:last-child img {
    top: 73px;
    right: 20px;
    width: 28px;
    height: 28px;
    transform: rotate(40deg);

    @media screen and (max-width: 768px) {
        width: 21px;
        height: 21px;
    }
}

.all-occasions__item p {
    font-weight: 100;
    font-size: 18px;
    line-height: 120%;
    color: #1D2A44;
    max-width: 126px;

    @media screen and (max-width: 768px) {
        font-size: 14px;
    }
}

.all-occasions__item:first-child {
    left: 0;
    background: radial-gradient(175.63% 175.63% at 55.49% 100%, #F3DDBE 0%, #AF936C 100%);
    transform: rotate(-8deg);
}


.all-occasions__item:nth-child(2) {
    left: 50%;
    transform: translateX(-50%);
    background: radial-gradient(120% 120% at 55.49% 100%, #F0FDE1 0%, #B9D09C 100%);
    z-index: 1;
}

.all-occasions__item:last-child {
    right: 0;
    background: radial-gradient(175.63% 175.63% at 55.49% 100%, #DEE4EE 0%, #A2A8B2 100%);
    transform: rotate(8deg);
}

.sim-recovery {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 60px 0;
}

.sim-recovery__header {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
    margin-bottom: 80px;

    @media screen and (max-width: 1076px) {
        margin-bottom: 50px;
    }

    @media screen and (max-width: 768px) {
        margin-bottom: 40px;
    }
}

.sim-recovery__title {
    font-weight: 300;
    font-size: 34px;
    line-height: 46px;
    margin: 0;

    @media screen and (max-width: 768px) {
        font-size: 24px;
        line-height: 100%;
    }
}

.sim-recovery__subtitle {
    font-weight: 100;
    font-size: 18px;
    line-height: 25px;
    margin: 0;
    text-align: center;

    @media screen and (max-width: 768px) {
        font-size: 14px;
        line-height: 100%;
    }
}

.sim-recovery__content {
    max-width: 1030px;
    display: flex;
    flex-direction: column;
    gap: 36px;
    margin: 0 auto;
}

.sim-recovery__section {
    display: flex;
    flex-direction: column;
    gap: 24px;

    @media screen and (max-width: 768px) {
        gap: 16px;
    }
}

.sim-recovery__section-title {
    font-weight: 500;
    font-size: 18px;
    line-height: 25px;
    margin: 0;
    text-align: left;

    @media screen and (max-width: 768px) {
        font-size: 16px;
        line-height: 100%;
    }
}

.sim-recovery__text {
    font-weight: 300;
    font-size: 14px;
    line-height: 19px;
    margin: 0;
}

.sim-recovery__text ul {
    list-style-type: disc;
    padding-left: 20px;
}

.sim-recovery__text ul li::marker {
    font-size: 9px;
}

.sim-recovery__text ol {
    padding-left: 20px;
}

.sim-recovery__info {
    border: 1px solid #2C3E50;
    border-radius: 36px;
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.sim-recovery__form-block {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.sim-recovery__form {
    display: flex;
    flex-direction: column;
    gap: 18px;
    max-width: 503px;
    width: 100%;
}

.sim-recovery__form-group {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.sim-recovery__form-label {
    font-size: 14px;
    font-weight: 300;
}

.sim-recovery__form-input {
    padding: 16px 24px;
    border-radius: 36px;
    border: none;
    background: rgba(238, 241, 246, 0.6);
    font-size: 14px;
    font-weight: 300;
    outline: none;
}

.sim-recovery__form-input::placeholder {
    color: #2C3E5080;
}

.sim-recovery__form-checkbox {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
}

.sim-recovery__form-button {
    margin-top: -10px;
    width: 192px;
    height: 49px;
    background: #2C3E50;
    color: #fff;
    border: none;
    border-radius: 20px;
    font-size: 18px;
    font-weight: 500;
    cursor: pointer;
    transition: 0.3s;

    @media screen and (max-width: 768px) {
        height: 36px;
        font-size: 16px;
        width: 176px;
    }
}

.sim-recovery__form-button:hover {
    opacity: 0.9;
}

.sim-recovery__advantages {
    display: flex;
    gap: 6px;
    margin-bottom: 80px;

    @media screen and (max-width: 1076px) {
        margin-bottom: 50px;
    }

    @media screen and (max-width: 768px) {
        margin-bottom: 40px;
        flex-wrap: wrap;
    }
}

.sim-recovery__advantages-item {
    flex-basis: 25%;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 18px;
    height: 111px;
    background: #F0EFEE;
    border-radius: 36px;
    font-weight: 500;
    font-size: 18px;
    line-height: 120%;
    text-align: center;
    color: #AF936C;

    @media screen and (max-width: 1076px) {
        font-size: 16px;
        height: 140px;
    }

    @media screen and (max-width: 768px) {
        font-size: 14px;
        flex-basis: calc(50% - 6px);
        height: 100px;
    }
}

.number-activation__banner {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 12px;
    margin: 80px 0;
    width: 100%;
    height: 487px;
    background: url(assets/images/number-activation.svg) no-repeat center;
    background-size: 100%;
    padding: 36px;

    @media screen and (max-width: 1076px) {
        margin: 24px 0;
        height: 487px;
    }

    @media screen and (max-width: 768px) {
        max-width: 396px;
        margin: 36px auto;
        height: 296px;
        background: url(assets/images/number-activation-mobile.svg) no-repeat center;
        background-size: 100%;
    }
}

.number-activation .quick-faq__question span {
    font-size: 24px;

    @media screen and (max-width: 1076px) {
        font-size: 18px;
    }
    @media screen and (max-width: 768px) {
        font-size: 14px;
    }
}


.number-activation__banner h1 {
    font-weight: 100;
    font-size: 74px;
    line-height: 102px;
    color: #2C3E50;

    @media screen and (max-width: 1076px) {
        font-size: 48px;
        line-height: 100%;
    }

    @media screen and (max-width: 768px) {
        font-size: 28px;
        line-height: 100%;
    }
}

.number-activation__banner p {
    font-weight: 300;
    font-size: 16px;
    line-height: 22px;
    text-align: center;
    color: #2C3E50;
    max-width: 727px;

    @media screen and (max-width: 1076px) {
        line-height: 100%;
    }

    @media screen and (max-width: 768px) {
        text-align: left;
    }
}

.number-activation .quick-faq {
    align-items: start;
    gap: 24px;

    @media screen and (max-width: 768px) {
        gap: 16px;
    }
}

.number-activation .quick-faq__title {
    font-weight: 100;
    font-size: 44px;
    line-height: 100%;
    color: #2C3E50;

    @media screen and (max-width: 1076px) {
        font-size: 34px;
    }

    @media screen and (max-width: 768px) {
        font-size: 20px;
    }
}

.number-activation .quick-faq__list {
    gap: 0;
}

.number-activation .quick-faq__item {
    min-height: 80px;
    justify-content: center;
    border-bottom: 1px solid rgba(217, 217, 217, 1);

    @media screen and (max-width: 768px) {
        min-height: 50px;
    }
}

.number-activation .quick-faq__item.active {
    min-height: 150px;
    padding-bottom: 23.5px;
    padding-top: 23.5px;
}

.number-activation__search {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-bottom: 80px;

    @media screen and (max-width: 1076px) {
        margin-bottom: 24px;
    }

    @media screen and (max-width: 768px) {
        margin-bottom: 36px;
    }
}

.number-activation__search h3 {
    font-weight: 100;
    font-size: 44px;
    line-height: 60px;
    color: #2C3E50;
    text-align: left;
}

.number-activation__search-container {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 24px;
    gap: 24px;
    width: 100%;
    height: 96px;
    background: #DEE4EE;
    border-radius: 24px;

    @media screen and (max-width: 768px) {
        padding: 12px;
        height: 72px;
    }
}

.number-activation__search-container input {
    flex-basis: 90%;
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 8px 16px;
    height: 48px;
    background: #FFFFFF;
    border-radius: 30px;
    border: none;
}

.number-activation__search-container button {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 0 24px;
    width: 101px;
    height: 41px;
    background: #2C3E50;
    border-radius: 36px;
    outline: none;
    border: none;
    font-weight: 500;
    font-size: 18px;
    line-height: 100%;
    color: #FFFFFF;
    flex-basis: 10%;
}

.number-activation__asking-data {
    display: flex;
    gap: 24px;
    margin-bottom: 80px;

    @media screen and (max-width: 1076px) {
        flex-direction: column;
        align-items: center;
    }

    @media screen and (max-width: 768px) {
        margin-bottom: 36px;
    }
}

.number-activation__asking-data-item {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 358px;
    border-radius: 24px;
    overflow: hidden;
}

.number-activation__asking-data-item:first-child {
    align-items: center;
    padding: 24px 40px;
    border: 3px solid #2C3E50;
    gap: 24px;
    max-width: 576px;

    @media screen and (max-width: 1076px) {
        max-width: 100%;
        height: 318px;
    }

    @media screen and (max-width: 768px) {
        height: auto;
    }
}

.number-activation__asking-data-item video {

        max-width: 640px;


    @media screen and (max-width: 768px) {
        height: 218px;
    }
}

.number-activation__asking-data-item span {
    font-weight: 300;
    font-size: 18px;
    line-height: 100%;
    text-align: center;
    color: #2C3E50;

    @media screen and (max-width: 768px) {
        font-size: 16px;
    }
}

.number-activation__asking-data-item p {
    font-weight: 300;
    font-size: 12px;
    line-height: 100%;
    color: #2C3E50;

    @media screen and (max-width: 768px) {
        font-size: 14px;
    }
}

.number-activation__asking-data-item a {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 0 42px;
    width: 269px;
    height: 45px;
    background: #2C3E50;
    border-radius: 36px;
    font-weight: 500;
    font-size: 18px;
    line-height: 100%;
    color: #FFFFFF;
    margin: 12px 0 0 auto;
}

.number-activation__conditions {
    display: flex;
    flex-direction: column;
    gap: 24px;
    margin-bottom: 80px;

    @media screen and (max-width: 768px) {
        margin-bottom: 36px;
    }
}

.number-activation__conditions h2 {
    font-weight: 300;
    font-size: 34px;
    line-height: 46px;
    color: #2C3E50;
    text-transform: none;

    @media screen and (max-width: 768px) {
        font-size: 20px;
        line-height: 100%;
    }
}

.number-activation__conditions-container {
    display: flex;
    gap: 24px;

    @media screen and (max-width: 1076px) {
        flex-direction: column;
    }
}

.number-activation__conditions-item {
    flex-basis: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 36px;
    padding: 36px;
    border-radius: 24px;

    @media screen and (max-width: 768px) {
        padding: 24px;
    }
}

.number-activation__conditions-item:first-child {
    background: rgba(181, 197, 222, 0.2);
}

.number-activation__conditions-item:last-child {
    background: rgba(248, 210, 109, 0.2);
}

.number-activation__conditions-item-title {
    font-weight: 100;
    font-size: 34px;
    line-height: 47px;
    text-align: center;
    color: #161616;

    @media screen and (max-width: 768px) {
        font-size: 20px;
        line-height: 100%;
    }
}

.number-activation__conditions-list {
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 8px 0;
}

.number-activation__conditions-list-item {
    display: flex;
    align-items: center;
    gap: 24px;
}

.number-activation__conditions-list-item span {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 0;
    width: 50px;
    height: 50px;
    background: #FFFFFF;
    border-radius: 40px;
    flex-basis: 10%;
    font-weight: 400;
    font-size: 18px;
    line-height: 100%;
    color: #2C3E50;
}

.number-activation__conditions-list-item p {
    font-weight: 300;
    font-size: 16px;
    line-height: 22px;
    color: #161616;
    flex-basis: 90%;
}

.your-connection {
    margin: 80px 0;

    @media screen and (max-width: 768px) {
        margin: 36px 0;
    }
}

.your-connection .arrange__requirements {
    align-items: start;
    gap: 20px;

    @media screen and (max-width: 1250px) {
        font-size: 12.5px;
        line-height: 100%;
    }
}

.your-connection .arrange__requirements-list {
    @media screen and (max-width: 1250px) {
        margin: 0 auto;
    }
}

.your-connection .arrange__requirements h3 {
    font-weight: 100;
    font-size: 44px;
    line-height: 60px;
    color: #2C3E50;
    text-align: left;

    @media screen and (max-width: 1076px) {
        font-size: 34px;
        line-height: 100%;
    }

    @media screen and (max-width: 768px) {
        font-size: 24px;
    }
}

.your-connection .arrange__requirements-item {
    flex-direction: column;
    align-items: end;
    gap: 12px;

    @media screen and (max-width: 1250px) {
        width: 269px;
        height: 166px;
        padding: 0 46px;
    }
    @media screen and (max-width: 870px) {
        width: 390px;
        height: 202px;
        padding: 0 46px;
    }
}

.your-connection .arrange__requirements-item p {
    font-weight: 300;
    font-size: 14px;
    line-height: 130%;
    text-align: right;
    color: #FFFFFF;

    @media screen and (max-width: 768px) {
        font-size: 13.75px;
        line-height: 100%;
    }
}

.your-connection p.arrange__requirements-item-title {
    font-weight: 500;
    font-size: 24px;
    line-height: 33px;
    text-align: right;
    color: #FFFFFF;

    @media screen and (max-width: 1250px) {
        font-size: 16px;
        line-height: 100%;
    }

    @media screen and (max-width: 768px) {
        font-size: 18px;
        line-height: 100%;
    }
}

.your-connection__text {
    max-width: 1029px;
    margin: 0 auto;
    font-weight: 300;
    font-size: 20px;
    line-height: 30px;
    color: #000000;
    padding: 10px 0;
    margin-bottom: 80px;

    @media screen and (max-width: 768px) {
        font-size: 14px;
        line-height: 100%;
        margin-bottom: 36px;
    }
}

.your-connection__applications {
    display: flex;
    gap: 24px;

    @media screen and (max-width: 1250px) {
        flex-direction: column;
        max-width: 608px;
        margin: 0 auto;
        gap: 36px;
    }

    @media screen and (max-width: 768px) {
        align-items: center;
    }
}

.your-connection__applications-item {
    position: relative;
    display: flex;
    justify-content: space-between;
    flex-basis: 50%;
    height: 305px;
    padding: 36px;
    width: 100%;

    @media screen and (max-width: 1250px) {
        height: 300px;
        flex-basis: auto;
    }

    @media screen and (max-width: 768px) {
        height: 224px;
        max-width: 390px;
        padding: 24px;
    }
}

.your-connection__applications-item a {
    position: absolute;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 16px 28px;
    width: 257px;
    height: 79px;
    background: #2C3E50;
    border: 1px solid #003366;
    border-radius: 30px;

    @media screen and (max-width: 768px) {
        width: 164px;
        height: 50px;
    }
}

.your-connection__applications-item img {
    width: 200px;
    height: 200px;

    @media screen and (max-width: 768px) {
        width: 137px;
        height: 137px;
    }
}

.your-connection__applications-item:first-child {
    align-items: center;
    background: url(assets/images/your-connection-applications-1.svg) no-repeat center;

    @media screen and (max-width: 768px) {
        background: url(assets/images/your-connection-applications-1-mobile.svg) no-repeat center;
    }
}

.your-connection__applications-item:last-child {
    flex-direction: row-reverse;
    align-items: end;
    background: url(assets/images/your-connection-applications-2.svg) no-repeat center;

    @media screen and (max-width: 768px) {
        background: url(assets/images/your-connection-applications-2-mobile.svg) no-repeat center;
    }
}

.your-connection__applications-qr {
    display: flex;
    flex-direction: column;
    gap: 0;
    align-items: center;
}

.your-connection__applications-qr span {
    @media screen and (max-width: 768px) {
        font-size: 12px;
        line-height: 120%;
        max-width: 136px;
        text-align: center;
    }
}

.your-connection__applications-item p {
    font-weight: 500;
    font-size: 24px;
    line-height: 100%;
    color: #2C3E50;

    @media screen and (max-width: 768px) {
        font-size: 16px;
    }
}

.your-connection__applications-item:first-child p {
    margin-bottom: 100px;
}

.your-connection__applications-item:last-child p {
    margin-bottom: 5px;
}

.your-connection__applications-item:first-child a {
    left: 0;
    bottom: 0;
}

.your-connection__applications-item:first-child a img {
    width: 103px;
    height: 23px;
}

.your-connection__applications-item:last-child a:nth-child(3) {
    right: 0;
    top: 0;
}

.your-connection__applications-item:last-child a:nth-child(3) img {
    width: 114px;
    height: 28px;
}

.your-connection__applications-item:last-child a:nth-child(4) {
    right: 0;
    top: 95px;

    @media screen and (max-width: 768px) {
        top: 62px;
    }
}

.your-connection__applications-item:last-child a:nth-child(4) img {
    width: 118px;
    height: 29px;


}

.arrange__how-connect {
    display: flex;
    flex-direction: column;
    gap: 50px;
    margin-bottom: 80px;
    padding-bottom: 23px;

    @media screen and (max-width: 768px) {
        gap: 16px;
        margin-bottom: 50px;
    }
}

.arrange h3 {
    font-weight: 300;
    font-size: 34px;
    line-height: 46px;
    text-align: center;
    color: #2C3E50;

    @media screen and (max-width: 768px) {
        font-size: 24px;
        line-height: 100%;
    }
}

.arrange__how-connect h3 {
    @media screen and (max-width: 768px) {
        font-size: 34px;
        line-height: 100%;
    }
}

.arrange__how-connect-list {
    display: flex;
    flex-wrap: wrap;
    gap: 23px;

    @media screen and (max-width: 768px) {
        gap: 8px;
        flex-wrap: wrap;
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
}

.arrange__how-connect-list-item {
    position: relative;
    background: radial-gradient(120% 120% at 55.49% 100%, #F0FDE1 0%, #B9D09C 100%), radial-gradient(175.63% 175.63% at 55.49% 100%, #F3DDBE 0%, #AF936C 100%);
    border-radius: 21.5884px;
    width: 229px;
    height: 270px;
    padding: 74px 19px 19px;
    transform: translateY(0);
    transition: all 0.5s ease;

    @media screen and (max-width: 1076px) {
        padding: 54px 19px 19px;
        height: 230px;
    }

    @media screen and (max-width: 768px) {
        width: 100%;
        height: 230px;
    }
}

.arrange__how-connect-list-item:hover {
    transform: translateY(-5%);
}

.arrange__how-connect-list-item::before {
    position: absolute;
    content: '';
    width: 44px;
    height: 44px;
    background: url(assets/images/how-connect-star.svg) no-repeat center;
    transform: rotate(0);
    transition: all 0.5s ease;
}

.arrange__how-connect-list-item:first-child::before {
    top: 5px;
    left: 6px;
}

.arrange__how-connect-list-item:first-child:hover::before {
    transform: rotate(30deg);
}

.arrange__how-connect-list-item:nth-child(2)::before {
    left: 25px;
    bottom: 54px;
}

.arrange__how-connect-list-item:nth-child(2):hover::before {
    transform: rotate(-30deg);
}

.arrange__how-connect-list-item:nth-child(3)::before {
    left: 42px;
    bottom: 26px;
}

.arrange__how-connect-list-item:nth-child(3):hover::before {
    transform: rotate(30deg);
}

.arrange__how-connect-list-item:nth-child(4)::before {
    bottom: 61px;
    right: 39px;
}

.arrange__how-connect-list-item:nth-child(4):hover::before {
    transform: rotate(-20deg);
}

.arrange__how-connect-list-item:last-child::before {
    bottom: 42px;
    left: 72px;
}

.arrange__how-connect-list-item:last-child:hover::before {
    transform: rotate(20deg);
}


.arrange__how-connect-list-item span {
    position: absolute;
    right: 5px;
    top: 0;
    font-weight: 500;
    font-size: 100px;
    line-height: 100%;
    color: #FFFFFF;
    mix-blend-mode: soft-light;
    opacity: 0.7;
    transition: all 0.5s ease;
}

.arrange__how-connect-list-item:hover span {
    transform: translateY(-5%);
}

.arrange__how-connect-list-item p {
    font-weight: 500;
    font-size: 16px;
    line-height: 22px;
    color: #1D2A44;

    @media screen and (max-width: 1076px) {
        font-size: 14px;
        line-height: 100%;
        max-width: 150px;
    }

    @media screen and (max-width: 768px) {
        max-width: 100%;
    }

}

.arrange__how-connect-list-item p:not(:first-child) {
    @media screen and (max-width: 550px) {
        max-width: 130px;
    }
}

.arrange__how-connect a {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 14px 20px;
    background: #2C3E50;
    border-radius: 36px;
    font-weight: 500;
    font-size: 18px;
    line-height: 100%;
    color: #FFFFFF;
    width: 178px;
    height: 53px;
    margin: 0 auto;
}

.arrange__about {
    display: flex;
    flex-direction: column;
    gap: 50px;
    margin-bottom: 80px;

    @media screen and (max-width: 768px) {
        gap: 24px;
        margin-bottom: 50px;
    }
}

.arrange__about-title {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.arrange__about-title p {
    max-width: 900px;
    margin: 0 auto;
    font-weight: 100;
    font-size: 18px;
    line-height: 25px;
    text-align: center;
    color: #2C3E50;

    @media screen and (max-width: 768px) {
        font-size: 14px;
        line-height: 100%;
    }
}

.arrange__about-list {
    display: flex;
    gap: 24px;

    @media screen and (max-width: 1275px) {
        justify-content: center;
        flex-wrap: wrap;
        gap: 12px;
    }
}

.arrange__about-item {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 53px 46px;
    flex-basis: 25%;
    width: 292px;
    height: 184px;
    background: url(assets/images/about-item.svg) no-repeat center;

    @media screen and (max-width: 1275px) {
        flex-basis: auto;
        width: 415px;
        height: 184px;
        background: url(assets/images/about-item-tablet.svg) no-repeat center;
    }

    @media screen and (max-width: 500px) {
        width: 292px;
        height: 184px;
        background: url(assets/images/about-item.svg) no-repeat center;
    }
}

.arrange__about-item p {
    font-weight: 500;
    font-size: 16px;
    line-height: 22px;
    text-align: center;
    color: #2C3E50;
}

.arrange__about-item:first-child {
    flex-direction: column;
    gap: 12px;
    padding: 25px 46px;
    background: url(assets/images/about-item-1.svg) no-repeat center;

    @media screen and (max-width: 1275px) {
        width: 415px;
        height: 184px;
        background: url(assets/images/about-item-1-tablet.svg) no-repeat center;
    }

    @media screen and (max-width: 500px) {
        width: 292px;
        height: 184px;
        background: url(assets/images/about-item-1.svg) no-repeat center;
    }
}

.arrange__about-item span {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 45px;
    height: 45px;
    border: 3px solid rgba(185, 208, 156, 1);
    background: transparent;
    border-radius: 50%;
}

.arrange__about-item:first-child span {
    background: rgba(44, 62, 80, 1);
    border-color: rgba(44, 62, 80, 1);
}

.arrange__about-item p.arrange__about-item-title {
    font-weight: 500;
    font-size: 16px;
    line-height: 22px;
    text-align: center;
    color: #FFFFFF;

    @media screen and (max-width: 1275px) {
        max-width: 201px;
    }

    @media screen and (max-width: 1030px) {
        max-width: 201px;
    }
}

.arrange__about-item p.arrange__about-item-subtitle {
    font-weight: 300;
    font-size: 14px;
    line-height: 19px;
    text-align: center;
    color: #FFFFFF;
    margin-bottom: 12px;
}

.arrange__about-item a {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 0 8px;
    gap: 8px;
    background: #E1FA3F;
    border: 2px solid #E1FA3F;
    border-radius: 36px;
    font-weight: 300;
    font-size: 14px;
    color: #2C3E50;
    width: 136px;
    height: 34px;
}

.arrange_content-item {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    transform: translateY(100%) scale(1);
    transition: all 7s;
    animation-play-state: paused;
    font-style: normal;
    font-weight: 500;
    color: #2C3E50;
    animation-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
    padding: 16px 27px;
    backdrop-filter: blur(10px);
    will-change: transform, opacity;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 8px;
    border: 2px solid #B9D09C;
    border-radius: 36px 36px 36px 0;
    width: 376px;
    height: 83px;
}

.arrange_content-item:nth-child(1) {
    animation: arrangeItemRise 7s infinite;
}

.arrange_content-item:nth-child(2) {
    animation: arrangeItemRise 7s 7s infinite;
}

.arrange_content-item:nth-child(3) {
    animation: arrangeItemRise 7s 14s infinite;
}

.arrange_content-item {
    transition: all 0.3s ease;
}

.arrange_content-item.loaded {
    animation-play-state: running;
}

.arrange_content-item span {
    font-weight: 600;
    font-size: 14px;
    line-height: 19px;
    color: #2C3E50;
    max-width: 322px;
}

.arrange_content-item p {
    font-weight: 300;
    font-size: 12px;
    line-height: 130%;
    color: #2C3E50;
    max-width: 322px;
}

@media screen and (max-width: 768px) {
    .arrange_content {
        max-width: 430px;
        margin: 0 auto 50px;
    }

    .arrange_content img {
        left: 0;
    }

    .arrange_content-item {
        padding: 16px;
    }

    .arrange_content-item span {
        font-size: 16px;
        line-height: 100%;
    }

    .arrange_content-item p {
        font-size: 12px;
        line-height: 100%;
    }
}

@media screen and (max-width: 490px) {
    .arrange_content img {
        left: -50px;
    }
}

@keyframes arrangeItemRise {
    0% {
        opacity: 0;
        visibility: visible;
        transform: translateY(100%) scale(1);
    }

    5% {
        opacity: 1;
        transform: translateY(50%);
    }

    10% {
        opacity: 1;
        transform: translateY(50%);
    }

    30% {
        opacity: 1;
        transform: translateY(50%);
    }

    35% {
        opacity: 0;
        transform: translateY(-100%);
        visibility: hidden;
    }

    100% {
        opacity: 0;
        transform: translateY(-100%);
        visibility: hidden;
    }
}

@media screen and (max-width: 768px) {
    @keyframes arrangeItemRise {
        0% {
            opacity: 0;
            visibility: visible;
            transform: translateY(100%) scale(1);
        }

        5% {
            opacity: 1;
            transform: translateY(0%);
        }

        10% {
            opacity: 1;
            transform: translateY(0%);
        }

        30% {
            opacity: 1;
            transform: translateY(0%);
        }

        35% {
            opacity: 0;
            transform: translateY(-100%);
            visibility: hidden;
        }

        100% {
            opacity: 0;
            transform: translateY(-100%);
            visibility: hidden;
        }
    }
}

.arrange_content-item:nth-child(1) {
    animation: arrangeItemRise 21s infinite;
}

.arrange_content-item:nth-child(2) {
    animation: arrangeItemRise 21s 7s infinite;
}

.arrange_content-item:nth-child(3) {
    animation: arrangeItemRise 21s 14s infinite;
}

.arrange__title-shadow {
    position: absolute;
    bottom: 100px;
    left: 50%;
    transform: translateX(-50%);
    opacity: 0;
    transition: all 1s;
    animation: Opacity 6s forwards;

    @media screen and (max-width: 768px) {
        animation: none;
        opacity: 1;
    }
}

.sim-wrapper {
    position: absolute;
    top: 21%;
    left: 50%;
    transform: translate(-71%, 50%);
}

.arrange__title-sim-card {
    position: absolute;
    top: 21%;
    left: 50%;
    transform: translateY(-30%) translateX(-71%);
    transform-origin: center center;
    width: 191px;
    height: 155px;
    z-index: 1;
    transition: all 1s;

    @media screen and (max-width: 768px) {
        top: 2%;
    }
}

.arrange__title-sim-card.ramp {
    animation: Ramp 2s forwards;
}

.arrange__title-sim-card.spin {
    animation: simFlip 6s infinite ease-in-out;
}

@keyframes Ramp {
    0% {
        transform: translateY(-1000%) translateX(-71%);
    }

    100% {
        transform: translateY(50%) translateX(-71%);
    }
}

@keyframes Opacity {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes simFlip {

    0%,
    20% {
        transform: translateY(50%) translateX(-71%) scaleX(1);
    }

    35% {
        transform: translateY(50%) translateX(-95%) scaleX(0);
    }

    55%,
    75% {
        transform: translateY(50%) translateX(-117%) scaleX(-1);
    }

    100% {
        transform: translateY(50%) translateX(-71%) scaleX(1);
    }
}

.buy-sim__swiper {
    display: flex;
    flex-direction: column;
    gap: 50px;
    margin-bottom: 50px;

    @media screen and (max-width: 768px) {
        gap: 64px;
        margin-bottom: 40px;
    }
}

.buy-sim__swiper-slider {
    position: relative;
    height: 447px;

    @media screen and (max-width: 800px) {
        height: 300px;
    }
}

.buy-sim__swiper-slide {
    position: absolute;
    top: 50%;
    left: 0;

    width: 397px;
    height: 250px;

    display: flex;
    align-items: center;
    justify-content: center;

    background: url(assets/images/swiper-slide.svg) no-repeat center;
    cursor: pointer;

    transform: translate(17%, -50%) scale(1);
    transition: transform .6s cubic-bezier(.4, 0, .2, 1);
}

.buy-sim__swiper-slide.is-active {
    transform: translate(17%, -50%) scale(1);
    z-index: 3;

    @media screen and (max-width: 1076px) {
        transform: translate(0%, -50%) scale(.9);
    }

    @media screen and (max-width: 800px) {
        transform: translate(0%, -50%) scale(0.5);
    }

    @media screen and (max-width: 700px) {
        transform: translate(-10%, -50%) scale(0.5);
    }

    @media screen and (max-width: 630px) {
        transform: translate(-26%, -50%) scale(0.5);
    }

    @media screen and (max-width: 500px) {
        transform: translate(-26%, -50%) scale(0.5);
    }
}

.buy-sim__swiper-slide.is-second {
    transform: translate(150%, -50%) scale(.664);
    z-index: 2;

    @media screen and (max-width: 1076px) {
        transform: translate(137%, -50%) scale(.664);
    }

    @media screen and (max-width: 800px) {
        transform: translate(85%, -50%) scale(.4);
    }

    @media screen and (max-width: 700px) {
        transform: translate(75%, -50%) scale(.4);
    }

    @media screen and (max-width: 630px) {
        transform: translate(65%, -50%) scale(.4);
    }

    @media screen and (max-width: 500px) {
        transform: translate(55%, -50%) scale(.4);
    }
}

.buy-sim__swiper-slide.is-third {
    transform: translate(210%, -50%) scale(.38);
    z-index: 1;

    @media screen and (max-width: 1076px) {
        transform: translate(197%, -50%) scale(.38);
    }

    @media screen and (max-width: 800px) {
        transform: translate(125%, -50%) scale(.3);
    }

    @media screen and (max-width: 700px) {
        transform: translate(115%, -50%) scale(.3);
    }

    @media screen and (max-width: 630px) {
        transform: translate(105%, -50%) scale(.3);
    }
}

.buy-sim__swiper-slide span {
    position: absolute;
    bottom: 0;
    left: 0;

    display: flex;
    align-items: center;
    justify-content: center;

    width: 60px;
    height: 60px;

    border: 3px solid #AF936C;
    border-radius: 50%;

    font-weight: 500;
    font-size: 24px;
    color: #AF936C;
}

.buy-sim__swiper-slide p {
    font-weight: 500;
    font-size: 18px;
    text-align: center;
    color: #2C3E50;
    max-width: 220px;

    @media screen and (max-width: 1.76px) {
        font-size: 16px;
    }
    @media screen and (max-width: 768px) {
        max-width: 125px;
    }
}

.buy-sim__swiper-phone {
    position: absolute;
    left: 33%;
    top: 0;

    width: 218px;
    height: 447px;

    overflow: hidden;
    border-radius: 41px;
    z-index: 4;

    @media screen and (max-width: 1150px) {
        left: 40%;
    }

    @media screen and (max-width: 800px) {
        width: 148px;
        height: 303px;
        border-radius: 30px;
    }
}

.buy-sim__swiper-phone::before {
    content: '';
    position: absolute;
    inset: 0;
    background: url(assets/images/silver-phone.png) no-repeat center;
    z-index: 4;

    @media screen and (max-width: 800px) {
        background-size: contain;
    }
}

.buy-sim__swiper-phone::after {
    content: '';
    position: absolute;
    inset: 0;
    background: url(assets/images/swiper-slide-bg.png) no-repeat center;
    z-index: -1;
}


.buy-sim__swiper-phone-track {
    display: flex;
    height: 100%;
    width: calc(218px * 3);

    transition: transform .6s cubic-bezier(.4, 0, .2, 1);
}

.buy-sim__swiper-phone img {
    position: relative;
    width: 218px;
    height: 100%;
    top: 0;
    object-fit: contain;
    flex-shrink: 0;

    @media screen and (max-width: 800px) {
        width: 148px;
    }
}

.buy-sim__swiper a {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 0 20px;
    background: #E1FA3F;
    border-radius: 36px;
    font-weight: 300;
    font-size: 14px;
    line-height: 100%;
    color: #2C3E50;
    max-width: 139px;
    height: 38px;
    margin: 0 auto;
}

.buy-sim__swiper-phone {
    position: absolute;
    left: 33%;
    top: 0;

    width: 218px;
    height: 447px;

    overflow: hidden;
    border-radius: 41px;
    z-index: 4;
}


@media screen and (max-width: 800px) {

    .buy-sim__swiper-phone {
        width: 155px;
        height: 320px;
        left: 50%;
        transform: translateX(-50%);
        border-radius: 31px;
    }

    .buy-sim__swiper-phone-track {
        display: flex;
        height: 100%;
        width: 300%;
        transition: transform .6s cubic-bezier(.4, 0, .2, 1);
    }

    .buy-sim__swiper-phone img {
        object-fit: cover;
        flex-shrink: 0;
    }
}

@media screen and (max-width: 500px) {
    .buy-sim__swiper-phone {
        transform: translateX(-30%);
    }
}

.beautiful-number {
    margin-top: 80px;

    @media screen and (max-width: 1076px) {
        margin-top: 50px;
    }

    @media screen and (max-width: 768px) {
        margin-top: 40px;
    }
}

.beautiful-number__title {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 16px 0;
    margin-bottom: 50px;

    @media screen and (max-width: 768px) {
        margin-top: 40px;
    }
}

.beautiful-number__title h1 {
    font-weight: 300;
    font-size: 34px;
    line-height: 46px;
    color: #2C3E50;
    text-align: center;

    @media screen and (max-width: 768px) {
        font-size: 24px;
    }
}

.beautiful-number__advantages {
    display: flex;
    gap: 24px;
    align-items: center;
    height: 100%;
    min-height: 78px;

    @media screen and (max-width: 768px) {
        flex-direction: column;
        gap: 6px;
    }
}

.beautiful-number__advantages-item {
    flex-basis: 33%;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 0 25px;
    gap: 13px;
    height: 68px;
    background: #B9D09C;
    border-radius: 36px;
    font-weight: 500;
    font-size: 18px;
    line-height: 100%;
    color: #2C3E50;
    transition: all 0.3s ease;
    width: 100%;

    @media screen and (max-width: 768px) {
        flex-basis: auto;
    }
}

.beautiful-number__advantages-item:hover {
    height: 78px;
    flex-basis: 35%;

    @media screen and (max-width: 768px) {
        flex-basis: auto;
        height: 68px;
    }
}

.beautiful-number__advantages-item svg {
    transition: all 0.3s ease;
    width: 30px;
    height: 30px;
}

.beautiful-number__advantages-item:hover svg path {
    stroke: #E1FA3F;
}

.beautiful-number__form {
    display: flex;
    flex-direction: column;
    gap: 12px;
    background: radial-gradient(280.29% 394.13% at -15.16% 389.49%, #B9D09C 0%, #F0EFEE 100%);
    border: 1px solid #DEE4EE;
    border-radius: 36px;
    padding: 50px;
    margin-bottom: 80px;

    @media screen and (max-width: 1076px) {
        margin-bottom: 50px;
        padding: 57px 50px 34px;
        gap: 40px;
        min-height: 690px;
        height: 100%;
        justify-content: space-between;
    }

    @media screen and (max-width: 768px) {
        margin-bottom: 40px;
        padding: 52px 16px 18px;
    }
}

.beautiful-number__form.final-notification {
    display: none;
    flex-direction: column;
    gap: 40px;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: 100%;
    min-height: 690px;
    z-index: 9999;
    padding: 45px;
}
.beautiful-number__form.final-notification h2 {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: 34px;
    line-height: 46px;
    text-align: center;
    color: #2C3E50;
}

.beautiful-number__form.final-notification p {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: 16px;
    line-height: 22px;
    text-align: center;
    color: #2C3E50;
    max-width: 444px;
}

.beautiful-number__form.final-notification.is-active {
    display: flex;
}

.beautiful-number__form-title {
    font-weight: 100;
    font-size: 18px;
    line-height: 25px;
    color: #2C3E50;
    margin-bottom: 14px;

    @media screen and (max-width: 1076px) {
        font-weight: 500;
        font-size: 24px;
        line-height: 100%;
        color: #2C3E50;
        margin-bottom: 0;
    }

    @media screen and (max-width: 768px) {
        font-weight: 500;
        font-size: 18px;
        color: #2C3E50;
        margin-bottom: 27px;
    }
}

.beautiful-number__form-container {
    max-height: 950px;
    width: 100%;
    height: 490px;
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: center;
    gap: 10px;

    @media screen and (max-width: 1076px) {
        justify-content: start;
        height: 100%;
    }
}

.beautiful-number__form.final .beautiful-number__form-container {
    height: max-content;
}

@media screen and (max-width: 768px) {
    .beautiful-number__form-container.form-tarif {
        height: auto;
    }
}

.beautiful-number__form-tarif {
    display: flex;
    gap: 24px;
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    width: 100%;
    transition: cursor 0.2s ease;
	
    cursor: grab;
    user-select: none;
    scroll-behavior: auto;
}

.beautiful-number__form-tarif::-webkit-scrollbar {
    width: 0;
    height: 0;
    display: none;
}

.beautiful-number__form-tarif.dragging {
    cursor: grabbing;
}

.beautiful-number__form-tarif .pricing-plans__item {
    flex-shrink: 0;
}

.beautiful-number__form-filters {
    display: flex;
    gap: 8px;
    max-width: 490px;
    flex-wrap: wrap;
}

.beautiful-number__form-filter {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 0 16px;
    width: max-content;
    height: 34px;
    background: #FFFFFF;
    border: 1px solid #2C3E50;
    border-radius: 36px;
    font-weight: 300;
    font-size: 14px;
    line-height: 100%;
    color: #2C3E50;
    cursor: pointer;

    @media screen and (max-width: 1076px) {
        background: white;
        color: rgba(44, 62, 80, 1);
        border-color: rgba(222, 228, 238, 1);
        height: 26px;
    }
}

.beautiful-number__form-filter:hover,
.beautiful-number__form-filter.is-active {
    background: #2C3E50;
    color: #F0EFEE;

    /*@media screen and (max-width: 1076px) {*/
    /*    background: rgba(222, 228, 238, 1);*/
    /*    color: rgba(44, 62, 80, 1);*/
    /*    border-color: rgba(222, 228, 238, 1);*/
    /*}*/
}

.beautiful-number__form-blocks {
    display: flex;
    gap: 36px;
    width: 100%;

    @media screen and (max-width: 1076px) {
        flex-direction: column;
        gap: 16px;
    }
}

.beautiful-number__form-list {
    display: flex;
    flex-direction: column;
    gap: 2px;
    width: 100%;
    max-width: 479px;
	max-height: 300px;
    overflow-y: auto;
}

.beautiful-number__list-item {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 10px;
    width: 100%;
    height: 39px;
    background: #FFFFFF;
    border-radius: 36px;
    font-weight: 400;
    font-size: 14px;
    line-height: 100%;
    color: #D9D9D9;
    cursor: pointer;
}

.beautiful-number__list-item:hover,
.beautiful-number__list-item.is-active {
    color: #2C3E50;
}

.beautiful-number__form-block {
    display: flex;
    flex-direction: column;
    gap: 37px;
    margin-top: 12px;

    @media screen and (max-width: 1076px) {
        margin-top: 0;
        gap: 16px;
    }
}

.beautiful-number__direct-number {
    display: flex;
    flex-direction: column;
    gap: 11px;
}

.beautiful-number__direct-number .single-form__card-top {
    display: flex;
    justify-content: start;
    gap: 8px;
}

.beautiful-number__form-block .single-form__card-title {
    font-weight: 300;
    font-size: 16px !important;
    line-height: 100%;
    color: #2C3E50;

    @media screen and (max-width: 768px) {
        font-size: 16px !important;
    }
}

.beautiful-number__selected-number {
    font-weight: 300;
    font-size: 34px;
    line-height: 100%;
    color: #2C3E50;

    @media screen and (max-width: 768px) {
        font-size: 24px !important;
    }
}

.text-free {
    font-weight: 500;
    font-size: 34px;
    line-height: 100%;
    color: #2C3E50;

    @media screen and (max-width: 768px) {
        font-size: 24px !important;
    }
}

.beautiful-number__form-buttons {
    display: flex;
    gap: 10px;
    width: 100%;
    justify-content: end;
}

.beautiful-number__form-buttons button {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 0 20px;
    width: max-content;
    height: 53px;
    border: 2px solid #2C3E50;
    border-radius: 36px;
    font-weight: 100;
    font-size: 18px;
    line-height: 100%;
    color: #2C3E50;
    background: transparent;
    cursor: pointer;

    @media screen and (max-width: 768px) {
        height: 38px;
        font-size: 14px;
    }
}

.beautiful-number__form-buttons .blue-button {
    background: rgba(44, 62, 80, 1);
    color: rgba(255, 255, 255, 1);
}

.beautiful-number__direct-number .single-form__slider {
    background: #DEE4EE;
    border-radius: 36px;
    border: none;
}

.beautiful-number__direct-number .single-form__slider::before {
    background: white;
}

/*.single-form__switch input:checked + .single-form__slider {*/
/*    background: #f0efee;*/
/*}*/

/*.single-form__switch input:checked + .single-form__slider::before {*/
/*    background: white;*/
/*}*/

.beautiful-number__form {
    display: none;
}

.beautiful-number__form.is-active {
    display: flex;
}

.beautiful-number__form-sim {
    display: flex;
    gap: 16px;

    @media screen and (max-width: 1076px) {
        flex-direction: column;
    }
}

.beautiful-number__form-sim-item {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    width: 300px;
    height: 100px;
    border: 1px solid #2C3E50;
    border-radius: 36px;
    cursor: pointer;
}

.beautiful-number__form-sim-item.is-active {
    background: rgba(44, 62, 80, 1);
}

.beautiful-number__form-sim-item span {
    font-weight: 500;
    font-size: 18px;
    line-height: 100%;
    color: #2C3E50;
}

.beautiful-number__form-sim-item.is-active p,
.beautiful-number__form-sim-item.is-active span {
    color: white;
}

.beautiful-number__form-sim-item p {
    font-weight: 300;
    font-size: 14px;
    line-height: 100%;
    text-align: center;
    color: #2C3E50;
}

@media screen and (max-width: 768px) {
    .beautiful-number .pricing-plans__item {
        scroll-snap-align: start;
    }
}

.beautiful-number__form .tariff-info {
    width: 407px;

    @media screen and (max-width: 768px) {
        width: 100%;
    }
}

.beautiful-number__form .tariff-title {
    display: flex;
    gap: 6px;
    margin-bottom: 6px;
}

.beautiful-number__form .tariff-title span {
    font-weight: 500;
    font-size: 18px;
    line-height: 25px;
    color: #2C3E50;
}

.beautiful-number__form .tariff-details {
    margin-top: 16px;
}

@media screen and (max-width: 500px) {
    .beautiful-number__form .tariff-details div {
        display: flex;
        flex-direction: column;
        width: 100%;
        align-items: start;
        justify-content: start;
    }
}

.beautiful-number__form .tariff-name {
    font-weight: 500;
    font-size: 18px;
    line-height: 25px;
    color: #2C3E50;
    margin-bottom: 12px;
}

.beautiful-number__form .operator-tags {
    display: flex;
    gap: 8px;
}

.beautiful-number__form .tag {
    padding: 6px 12px;
    border-radius: 36px;
    font-size: 12px;
    font-weight: 300;
    line-height: 16px;
}

.beautiful-number__form .tag-megafon {
    background: #2C3E50;
    color: white;
}

.beautiful-number__form .tag-mts {
    border: 1px solid rgba(44, 62, 80, 0.5);
    color: rgba(44, 62, 80, 0.7);
}

.beautiful-number__form .contact-form {
    width: 1140px;

    @media screen and (max-width: 1076px) {
        width: 100%;
    }
}

.beautiful-number__form .contact-form p {
    font-weight: 100;
    font-size: 18px;
    line-height: 25px;
    color: #2C3E50;
    margin-bottom: 24px;
}

.beautiful-number__form .inputs-row {
    display: flex;
    gap: 8px;
    margin-bottom: 8px;

    @media screen and (max-width: 1076px) {
        flex-direction: column;
    }
}

.beautiful-number__form .input-group {
    flex: 1;
    max-width: 440px;
}

.beautiful-number__form input {
    max-width: 440px;
    width: 100%;
    height: 48px;
    background: #FFFFFF;
    border: 1px solid #DEE4EE;
    border-radius: 36px;
    padding: 0 24px;
    font-size: 14px;
    color: #2C3E50;
    outline: none;
}

.beautiful-number__form input::placeholder {
    color: #2C3E50;
    opacity: 0.4;
}

.beautiful-number__form .checkbox-row {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 12px;
    font-weight: 300;
    color: #2C3E50;
    margin-top: 16px;
}

.beautiful-number__form.final {
    gap: 59px;
    max-width: 100%;
}

.beautiful-number__form.final .beautiful-number__form-title {
    margin-bottom: 0;
}

.beautiful-number__form .custom-checkbox {
    position: relative;
    margin-top: 16px;
    width: 100%;
    height: max-content;
    background: transparent;
}

.beautiful-number__form .custom-checkbox .label-text {
    font-size: 12px;
    color: #2C3E50;
}

.beautiful-number__form .custom-checkbox input:checked + .checkmark::before {
    position: absolute;
    content: '';
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 8px;
    height: 8px;
    background: #2C3E50;
    border-radius: 50%;
}

.beautiful-number__form-fields {
    display: flex;
    gap: 16px;
    width: 100%;
    margin-bottom: 30px;

    @media screen and (max-width: 768px) {
        flex-direction: column;
    }
}

.beautiful-number__form.final .beautiful-number__form-fields {
    margin-bottom: 0;
}

.beautiful-number__form-column {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.beautiful-number__form-input-group {
    position: relative;
    height: 70px;
}

.beautiful-number__form-input {
    width: 100%;
    height: 70px;
    background: #FFFFFF;
    border: none;
    border-radius: 36px;
    padding: 24px 110px 8px 24px;
    font-size: 16px;
    color: #222;
    outline: none;
    box-shadow: 0 0 0 1px #ddd;
}

.beautiful-number__form-label {
    position: absolute;
    left: 24px;
    top: 12px;
    font-size: 14px;
    font-weight: 300;
    color: #666;
    pointer-events: none;
    transition: all 0.2s;
}

.beautiful-number__form-input:focus + .beautiful-number__form-label,
.beautiful-number__form-input:not(:placeholder-shown) + .beautiful-number__form-label {
    top: 20px;
    font-size: 13px;
    color: #444;
}

.beautiful-number__form-actions {
    position: absolute;
    right: 12px;
    top: 16px;
    display: flex;
    gap: 6px;
}

.beautiful-number__form {
    position: relative;
    overflow: hidden;
}

.beautiful-number__form-close {
    display: none;
    position: absolute;
    top: 16px;
    right: 13px;
    width: 20px;
    height: 20px;
    cursor: pointer;

    @media screen and (max-width: 768px) {
        display: block;
    }
}

.beautiful-number__form-btn-check,
.beautiful-number__form-btn-clear,
.beautiful-number__form-btn-dots {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    background: transparent;
    border: none;
    cursor: pointer;
}

.beautiful-number__form-btn-check {
    color: #4ADE80;
}

.beautiful-number__form-btn-clear,
.beautiful-number__form-btn-dots {
    color: #222;
    font-size: 22px;
}

.beautiful-number__form-checkbox {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #ccc;
    font-size: 14px;
    cursor: pointer;
}

.beautiful-number__form-input-group input {
    position: relative;
    width: 100%;
    max-width: 100%;
    height: 100%;
    padding-top: 20px;
}

.faq {
    padding: 200px 0 80px;

    @media screen and (max-width: 768px) {
        padding: 40px 0;
    }
}

.faq .container {
    @media screen and (max-width: 768px) {
        padding: 0 8.5px;
    }
}

.faq h2 {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: 34px;
    line-height: 46px;
    text-align: center;
    color: #2C3E50;
    margin-bottom: 36px;
    text-transform: none;

    @media screen and (max-width: 768px) {
        font-size: 24px;
    }
}

.search-container {
    max-width: 818px;
    margin: 0 auto;
    margin-bottom: 75px;
}

.search-input {
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 16px;
    height: 42px;
    border-top: 0;
    border-left: 0;
    border-right: 0;
    border-bottom: 1px solid #2C3E50;
    border-radius: 20px;
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: 14px;
    line-height: 19px;
    color: rgba(44, 62, 80, 0.5);
}

.search-input:focus {
    outline: none;
    border-color: #2C3E50;
    color: rgba(44, 62, 80, 1);
}

.faq-grid-title {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: 34px;
    line-height: 46px;
    color: #2C3E50;
    text-align: left;
    margin-bottom: 24px;
}

.faq-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-bottom: 80px;
}

.faq-card {
    background: url(assets/images/faq/faq-bg.svg) no-repeat;
    border-radius: 36px;
    padding: 40px;
    cursor: pointer;
    transition: all 0.3s ease;
    width: 397px;
    height: 300px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: relative;
    overflow: hidden;
}

.arrow-faq {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-2%);
    width: 55px;
    height: 55px;
}

.faq-card:hover .arrow-faq {
    animation: faqFlipRightToLeft 1s linear forwards;
}

@keyframes faqFlipRightToLeft {
    0% {
        transform: translateX(0) translateY(-2%);
        opacity: 1;
    }

    40% {
        transform: translateX(30px) translateY(-2%);
        opacity: 0;
    }

    60% {
        transform: translateX(-30px) translateY(-2%);
        opacity: 0;
    }

    100% {
        transform: translateX(0) translateY(-2%);
        opacity: 1;
    }
}

.faq-card-text {
    display: flex;
    flex-direction: column;

    @media screen and (max-width: 1076px) {
        max-width: 167px;
    }
}

.faq-card h4 {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: 34px;
    line-height: 46px;
    color: #2C3E50;
}

.faq-card p {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: 14px;
    line-height: 19px;
    color: #2C3E50;
    max-width: 290px;
}

.faq-two-block {
    margin-bottom: 80px;
}

.faq-two-container {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.faq-two-block,
.faq-two-block-container {
    display: flex;
    gap: 24px;
    align-items: stretch;
}

.faq-card.chat {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    height: auto;
    background: #2C3E50;
    border-radius: 36px;
    align-self: stretch;
    padding: 52px 75px;
    max-width: 398px;
    min-height: 394px;

    @media screen and (max-width: 1300px) {
        min-height: 277px;
    }
}

.chat-text h4 {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: 34px;
    line-height: 46px;
    color: #FFFFFF;
    margin-bottom: 12px;
}

.chat-text p {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: 14px;
    line-height: 19px;
    text-align: center;
    color: #FFFFFF;
}

.faq-card.chat a {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 0 24px;
    gap: 8px;
    background: #DEE4EE;
    border-radius: 20px;
    max-width: max-content;
    height: 49px;
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    color: #2C3E50;
    text-decoration: none;
}

.faq-card.chat a:hover {
    border: 2px solid rgba(225, 250, 63, 1);
}

.fast-commands {
    display: flex;
    flex-direction: column;
    gap: 70px;
}

.fast-commands .faq-grid-title {
    margin-bottom: 0;
}

.fast-commands-container {
    display: flex;
    justify-content: center;
    gap: 92px;
}

.fast-commands-item {
    flex-direction: column;
    display: flex;
    gap: 20px;
    max-width: max-content;
}

.fast-commands-item:last-child {
    max-width: 220px;
}

.fast-commands-item-title {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 24px;
    line-height: 33px;
    color: #2C3E50;
}


.fast-commands-item p {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: 14px;
    line-height: 19px;
    color: #2C3E50;
    max-width: 320px;

    @media screen and (max-width: 1076px) {
        font-size: 12px;
    }
}

.faq-full-info {
    @media screen and (max-width: 768px) {
        margin-top: 200px;
    }
}

.faq-full-info,
.faq-full-info-item {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.faq-full-info .faq-grid-title {
    margin-bottom: 0;

    @media screen and (max-width: 768px) {
        margin: 0;
    }
}

.faq-full-info-item {
    @media screen and (max-width: 1076px) {
        max-width: 478px;
    }
}

.faq-full-info-list {
    display: flex;
    flex-direction: column;
    gap: 36px;
    max-width: 856px;
    width: 100%;
}

.faq-full-info-item .faq-full-info-title {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 24px;
    line-height: 100%;
    color: #2C3E50;
}

.faq-full-info-item p a {
    color: rgba(44, 62, 80, 1);
}

.faq-full-info-item p a.tel {
    color: rgba(44, 62, 80, 1);
}

.faq-full-info-item p a:hover {
    color: #2C3E50;
}

.faq-full-info-item p {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: 14px;
    line-height: 19px;
    color: #2C3E50;
}

.faq-full-info-item p b {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 22px;
    color: #2C3E50;
}

.faq-full-info-container {
    display: flex;
    gap: 80px;
    justify-content: space-between;
}

.faq-full-info-links {
    display: flex;
    flex-direction: column;
    gap: 16px;

    @media screen and (max-width: 768px) {
        gap: 10px;
    }
}

.faq-full-info-link {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: 18px;
    line-height: 25px;
    color: #2C3E50;
    text-decoration: underline;

    @media screen and (max-width: 768px) {
        font-size: 12px;
        line-height: 100%;
    }
}

.faq-full-info-link.active {
    text-decoration: none;
}

.faq-full-info-list-title {
    margin-bottom: -24px;
}

.faq-full-info-item ol {
    margin-top: 24px;
}

.faq-full-info-item ol,
.faq-full-info-item ul {
    padding-left: 20px;
    list-style-type: disc;
}

.faq-full-info-item ol li,
.faq-full-info-item ul li {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: 14px;
    line-height: 19px;
    color: #2C3E50;
}

.faq-full-info-item ol li::marker,
.faq-full-info-item ul li::marker {
    font-size: 12px;
}


@media (max-width: 1300px) {
    .faq-grid {
        gap: 20px;
    }

    .faq-card.chat a {
        padding: 0 15px;
    }

    .faq-card {
        background: url(assets/images/faq/faq-bg-tablet.svg) no-repeat;
        width: 262px;
        height: 232px;
        padding: 30px 20px;
        margin: 0 auto;
    }

    .arrow-faq {
        transform: translateY(-24%);
    }

    .faq-card h4 {
        font-size: 24px;
        line-height: 120%;
    }

    .faq-card p {
        font-size: 12px;
    }

    .faq-card.chat {
        padding: 50px 45px;
    }

    @keyframes faqFlipRightToLeft {
        0% {
            transform: translateX(0) translateY(-24%);
            opacity: 1;
        }

        40% {
            transform: translateX(30px) translateY(-24%);
            opacity: 0;
        }

        60% {
            transform: translateX(-30px) translateY(-24%);
            opacity: 0;
        }

        100% {
            transform: translateX(0) translateY(-24%);
            opacity: 1;
        }
    }
}


@media (max-width: 1076px) {
    .fast-commands-container {
        gap: 40px;
    }

    .faq-grid-title {
        margin-bottom: 24px;
    }

    .faq-card.chat a {
        padding: 0 15px;
        max-width: 170px;
        width: 100%;
    }

    .search-input {
        max-width: 390px;
        margin: 0 auto 50px;
    }

}


@media screen and (max-width: 970px) {
    .faq-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .faq-card p {
        max-width: 160px;
    }

    .faq-two-block {
        flex-direction: column;
    }

    .faq-card.chat {
        gap: 50px;
        max-width: 610px;
    }
}

@media (max-width: 768px) {

    .fast-commands-container {
        flex-direction: column;
        align-items: center;
        gap: 50px;
    }

    .faq-grid-title {
        font-size: 24px;
    }

    .fast-commands-item,
    .fast-commands {
        align-items: center;
    }

    .fast-commands-item p {
        text-align: center;
    }

    .fast-commands {
        gap: 50px;
    }

    .faq-grid-title {
        margin: 0 auto 24px;
        width: max-content;
    }

    .faq-full-info-container {
        flex-direction: column;
    }

    .faq-full-info-item .faq-full-info-title {
        font-size: 18px;
        line-height: 100%;
    }


    .faq-full-info-item ol li,
    .faq-full-info-item ul li,
    .faq-full-info-item p {
        font-size: 14px;
        line-height: 100%;
    }

    .faq-full-info-item p b {
        font-size: 16px;
    }
}

@media (max-width: 620px) {
    .faq-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .faq-two-block-container {
        flex-direction: column;
    }

    .faq-card.chat {
        max-width: 262px;
    }

    .search-input {
        margin: 0 auto 40px;
    }
}

.services-item__banner {
    position: relative;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 250px;
    background-size: 100%;
    margin: 50px 70px 50px auto;
    border-radius: 36px 36px 36px 36px;
    overflow: hidden;

    @media screen and (max-width: 1076px) {
        background-size: 100%;
        height: 206px;
    }

    @media screen and (max-width: 1024px) {
        height: 190px;
    }

    @media screen and (max-width: 992px) {
        height: 190px;
    }

    @media screen and (max-width: 870px) {
        height: 170px;
    }

    @media screen and (max-width: 768px) {
        background-size: 100%;
        width: 390px;
        height: 325px;
        margin: 40px auto;
        padding: 0 75px;
    }
}

@media screen and (max-width: 768px) {
    .services-item__banner.padding--73 {
        padding: 0 73px;
    }
}

.services-item__banner img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
}

.services-item__banner-tablet,
.services-item__banner-mobile {
    display: none;
}

@media screen and (max-width: 1076px) {
    .services-item__banner-desktop {
        display: none;
    }

    .services-item__banner-tablet {
        display: block;
    }
}

@media screen and (max-width: 768px) {
    .services-item__banner-tablet {
        display: none;
    }

    .services-item__banner-mobile {
        display: block;
    }
}

.services-item__banner h1 {
    font-weight: 300;
    font-size: 50px;
    line-height: 110%;
    color: #FFFFFF;
    max-width: 720px;

    @media screen and (max-width: 1076px) {
        font-size: 34px;
        max-width: 458px;
    }
    @media screen and (max-width: 768px) {
        font-size: 30px;
        max-width: 254px;
    }
}

.services-item__title--mobile {
    display: none;
}

@media screen and (max-width: 768px) {
    .services-item__title--desktop {
        display: none;
    }

    .services-item__title--mobile {
        display: block;
    }
}

.services-item__title--no-wrap {
    white-space: nowrap;

    @media screen and (max-width: 800px) {
        white-space: normal;
    }
}

.services-item__banner-category {
    position: absolute;
    top: 30px;
    right: 30px;
    min-width: 118px;
    width: max-content;
    height: 33px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 0 16px;
    background: #2C3E50;
    border: 1px solid #FFFFFF;
    border-radius: 20px;
    font-weight: 500;
    font-size: 11px;
    line-height: 100%;
    color: #FFFFFF;

    @media screen and (max-width: 1076px) {
        top: 20px;
        right: 20px;
        font-size: 8px;
        max-width: max-content;
        min-width: 80px;
        height: 22px;
    }
    @media screen and (max-width: 768px) {
        top: 18px;
        right: 18px;
    }
}

.services-item__content {
    position: relative;
    width: 100%;

    @media screen and (max-width: 990.98px) {
        display: flex;
        flex-direction: column;
        gap: 8px;
    }
}

.services-item__link-back {
    position: absolute;
    top: 0;
    left: 0;
    width: 58px;
    height: 49px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    background: #F0EFEE;
    border-radius: 20px;

    @media screen and (max-width: 1024px) {
        width: 50px;
        left: -50px;
    }

    @media screen and (max-width: 990.98px) {
        position: unset;
    }
}

.services-item__container {
    max-width: 818px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 40px;

    @media screen and (max-width: 990.98px) {
        max-width: 100%;
    }
}

.services-item__section {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-end;
    padding: 24px;
    gap: 24px;
    background: #F0EFEE;
    border-radius: 36px;

    @media screen and (max-width: 768px) {
        padding: 16px;
    }
}

.services-item__section a {
    font-weight: 500;
    font-size: 18px;
    line-height: 100%;
    color: #FFFFFF;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 12px 24px;
    gap: 8px;
    width: 157px;
    height: 49px;
    background: #2C3E50;
    border-radius: 20px;
}

.services-item__white-block {
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 24px;
    background: #FFFFFF;
    border-radius: 36px;
    width: 100%;
}

.services-item__white-block--title {
    font-weight: 500;
    font-size: 18px;
    line-height: 100%;
    color: #2C3E50;

    @media screen and (max-width: 768px) {
        font-size: 14px;
    }
}

.services-item__white-block--title.title-list {
    font-size: 16px;

    @media screen and (max-width: 768px) {
        font-size: 14px;
    }
}

.services-item__white-block p {
    font-weight: 100;
    font-size: 14px;
    line-height: 130%;
    color: #2C3E50;

    @media screen and (max-width: 768px) {
        font-size: 12px;
    }
}

.services-item__white-block.big-text p {
    font-size: 18px;

    @media screen and (max-width: 768px) {
        font-size: 14px;
    }
}

.services-item__white-block--grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    padding-bottom: 24px;
    border-bottom: 1px solid rgba(44, 62, 80, 0.15);
}

.services-item__white-block--grid.big-grid {
    grid-template-columns: repeat(4, 1fr);
}

.services-item__white-block--grid.grid-two {
    grid-template-columns: repeat(2, 1fr);
}

.services-item__white-block--grid.biggest-grid {
    grid-template-columns: repeat(5, 1fr);
    align-items: center;

    @media screen and (max-width: 992px) {
        grid-template-columns: repeat(5, minmax(140px, auto));
    }
}

.services-item__mobile-slider {
    @media screen and (max-width: 992px) {
        overflow-x: auto;
        overflow-y: visible;
        -webkit-overflow-scrolling: touch;
    }
}

.services-item__mobile-slider .services-item__white-block {
    @media screen and (max-width: 992px) {
        min-width: 689px;
    }
}

.services-item__white-block--grid.mini-grid {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

.services-item__white-block--grid.mini-grid span {
    max-width: 420px;
}

.services-item__white-block ol {
    padding-left: 20px;
    font-weight: 300;
    font-size: 14px;
    line-height: 19px;
    color: #2C3E50;
}

.services-item__white-block ul {
    list-style-type: disc;
    padding-left: 20px;
}

.services-item__white-block ul li {
    font-weight: 300;
    font-size: 14px;
    line-height: 19px;
    color: #2C3E50;
}

.services-item__white-block ul li::marker {
    font-size: 9px;
}


.services-item__white-block--grid span {
    font-weight: 100;
    font-size: 18px;
    line-height: 25px;
    color: #2C3E50;
    @media screen and (max-width: 768px) {
        font-size: 14px;
        line-height: 100%;
    }
}

.services-item__white-block--grid span strong {
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 22px;
    color: #2C3E50;

    @media screen and (max-width: 768px) {
        font-size: 14px;
        line-height: 100%;
    }
}

.big-text .services-item__white-block--grid span:last-child strong {
    font-size: 18px;
    line-height: 100%;

    @media screen and (max-width: 768px) {
        font-size: 14px;
        line-height: 100%;
    }
}


.services-item__white-block--grid span:first-child {
    min-width: 118px;
}

.services-item__white-block--grid.big-grid span:first-child {
    min-width: 74px;
}

.services-item__white-block--grid.big-grid span:last-child {
    @media screen and (max-width: 768px) {
        max-width: 76px;
    }
}

.services-item__white-block--grid:last-child,
.services-item__white-block--grid-title {
    padding-bottom: 0;
    border: 0;
}

.services__card {
    width: 100%;
    background: #FFFFFF;
    border-radius: 36px;
    padding: 24px;
    box-sizing: border-box;
}

.services__inner {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

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

.services__zone-toggle {
    display: flex;
    align-items: center;
    gap: 24px;
    cursor: pointer;
}

.services__zone-title {
    font-weight: 500;
    font-size: 18px;
    line-height: 25px;
    color: #2C3E50;

    @media screen and (max-width: 768px) {
        font-size: 14px;
        line-height: 100%;
    }
}

.services__arrow {
    transform: rotate(0);
    transition: 0.3s ease;
}

.services__arrow--open {
    transform: rotate(-180deg);
}


.services__dropdown {
    display: none;
    font-weight: 300;
    font-size: 14px;
    line-height: 19px;
    color: #2C3E50;
    max-height: 300px;
    overflow-y: auto;
}

.services__dropdown--open {
    display: block;
}

.services__dropdown::-webkit-scrollbar {
    width: 6px;
}

.services__dropdown::-webkit-scrollbar-thumb {
    background: #ddd;
    border-radius: 10px;
}


.services-item__white-block--grid span strong.mini-grid-title {
    font-weight: 500;
    font-size: 18px;
    line-height: 25px;
    color: #2C3E50;

    @media screen and (max-width: 768px) {
        font-size: 14px;
        line-height: 100%;
    }
}

.services-item__white-block--ul li {
    font-size: 18px !important;
    line-height: 130% !important;
    @media screen and (max-width: 768px) {
        font-size: 14px !important;
    }
}

.sim-recovery__modal {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    align-items: center;
    justify-content: center;
}

.sim-recovery__modal.is-active {
    display: flex;
}

.sim-recovery__modal-container {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    justify-content: center;
    width: 608px;
    height: 270px;
    background: #FFFFFF;
    border-radius: 36px;
    margin: 0 16px;
    padding: 0 20px;
}

.sim-recovery__close {
    position: absolute;
    top: 24px;
    right: 24px;
    cursor: pointer;
}

.sim-recovery__modal-container span {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 30px;
    line-height: 41px;
    text-align: center;
    color: #2C3E50;
    max-width: 560px;

    @media screen and (max-width: 768px) {
        font-size: 24px;
        line-height: 100%;
    }
}

.sim-recovery__modal-container p {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 22px;
    text-align: center;
    color: #2C3E50;
    max-width: 420px;

    @media screen and (max-width: 768px) {
        font-size: 14px;
        line-height: 100%;
    }
}


.pricing-plans__modal {
    position: fixed;
    inset: 0;
    display: none;
    z-index: 1000;
}

.pricing-plans__modal р3 {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 24px;
    line-height: 33px;
    color: #2C3E50;

}

.pricing-plans__modal.active {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.pricing-plans__modal-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
}

.pricing-plans__modal-content {
    position: relative;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    padding: 24px;
    gap: 24px;
    max-width: 1108px;
    max-height: 100%;
    margin: 20px;
    background: #FFFFFF;
    border-radius: 36px;
    overflow-y: auto;
    z-index: 1;

    @media screen and (max-width: 1076px) {
        flex-direction: column-reverse;
    }
}

.pricing-plans__modal-block {
    display: flex;
    flex-direction: column;
    gap: 54px;
}

.pricing-plans__modal-block:last-child {
    padding-top: 240px;
    width: 281px;

    @media screen and (max-width: 1076px) {
        padding-top: 0;
    }
}

.pricing-plans__modal-block--title {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

@media screen and (max-width: 768px) {
    .pricing-plans__modal-block--title h3 {
        font-size: 28px;
        line-height: 100%;
    }
}

.pricing-plans__modal-close {
    position: absolute;
    top: 10px;
    right: 15px;
    background: none;
    border: none;
    font-size: 24px;
    cursor: pointer;

    @media screen and (max-width: 1076px) {
        top: -45%;
    }
    @media screen and (max-width: 807px) {
        top: -53%;
    }
    @media screen and (max-width: 768px) {
        top: -66%;
    }
    @media screen and (max-width: 560px) {
        top: -72%;
    }
    @media screen and (max-width: 439px) {
        top: -76%;
    }
}

.pricing-plans__modal-features {
    display: flex;
    justify-content: center;
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 100;
    font-size: 18px;
    line-height: 100%;
    color: #2C3E50;
    text-align: center;
}

.pricing-plans__modal-block .method-receipt {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.pricing-plans__modal-subtitle {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    line-height: 25px;
    color: #2C3E50;
}

.method-receipt .single-result__price-button {
    background: #EEF1F6;
}

.method-receipt .single-result__price-button span {
    color: #2C3E50;
}

.method-receipt .single-result__price-button.is-active {
    background: #2C3E50;
}

.method-receipt .single-result__price-button.is-active span {
    color: white;
}

.pricing-plans__modal-form,
.pricing-plans__modal-form > div {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.pricing-plans__modal-form .beautiful-number__form-input-group input {
    background: #EEF1F6;
}

.pricing-plans__modal-form .beautiful-number__form-input:focus + .beautiful-number__form-label,
.pricing-plans__modal-form .beautiful-number__form-input:not(:placeholder-shown) + .beautiful-number__form-label {
    top: 14px;
}

.pricing-plans__modal-form .beautiful-number__form-label {
    color: #2C3E5080 !important;
    font-size: 14px;
}

.pricing-plans__modal-form .beautiful-number__form-input {
    color: #2C3E50;
    font-size: 14px;
}

.pricing-plans__modal-final {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 24px;
    gap: 32px;
    background: #2C3E50;
    border-radius: 36px;
}

.pricing-plans__modal-final .single-result__price-next--button {
    max-width: 100%;
    width: 100%;
    cursor: pointer;
}

.pricing-plans__modal-final--row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

.pricing-plans__modal-final--row span {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 100;
    font-size: 18px;
    line-height: 100%;
    color: #FFFFFF;

    @media screen and (max-width: 768px) {
        font-size: 14px;
    }
}

.pricing-plans__modal-final--row.price span {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 24px;
    line-height: 100%;
    color: #FFFFFF;
    @media screen and (max-width: 768px) {
        font-size: 18px;
    }
}

.pricing-plans__modal .sim-recovery__form .checkmark, .pricing-plans__modal .single-result__price-next .checkmark {
    min-width: 18px;
}

.pricing-plans__modal-final--row div {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.pricing-plans__modal-final--row div span:first-child {
    font-family: 'Manrope', sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: 14px;
    line-height: 100%;
    color: rgba(255, 255, 255, 0.5);
}

.pricing-plans__progress {
    width: 100%;
    max-width: 320px;
    font-family: sans-serif;
}

.pricing-plans__progress-top {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: baseline;
    gap: 6px;
    margin-bottom: 8px;
    color: #2C3E50;
    font-size: 18px;
    line-height: 100%;
}

.pricing-plans__progress-percent {
    font-size: 24px;
    font-weight: 600;
    color: #2C3E50;
    line-height: 100%;
}

.pricing-plans__progress-bar {
    width: 100%;
    height: 11px;
    background: #F0EFEE;
    border-radius: 999px;
    overflow: hidden;
}

.pricing-plans__progress-fill {
    height: 100%;
    background: #B9D09C;
    border-radius: 999px;
    transition: width 0.4s ease;
}

.mobile-off--service {
    display: block;

    @media screen and (max-width: 768px) {
        display: none;
    }
}

.mobile-on--service {
    display: none;

    @media screen and (max-width: 768px) {
        display: block;
    }
}

.services-item--big-width {
    max-width: 800px;

    @media screen and (max-width: 1076px) {
        max-width: 630px !important;
    }
}