@font-face {
    font-family: "TildaSans";
    src: url("/wp-content/themes/beesmm/assets/fonts/TildaSans-VF.woff2") format("woff2");
    font-weight: 1 999;
    font-style: normal;
    font-display: swap;
}

html {
    scrollbar-gutter: stable;
}

body {
    font-family: "TildaSans", sans-serif;
}

* {
    margin: 0;

    padding: 0;

    box-sizing: border-box;

    /* font-family: "Arial", sans-serif; */
}

.font-playfair,
.font-playfair * {
    /* font-family: "Playfair Display", serif !important; */
}

.ovh {
    overflow: hidden;
}

body,
html {
    overflow-x: hidden;

    scroll-behavior: smooth;
}

body {
    background: url("/wp-content/themes/beesmm/assets/images/hexa_dan_wave_10.jpg") center/cover fixed;

    color: #fff;

    line-height: 1.6;

    /* background-size: 88%; */
}

@media (max-width: 992px) {
    body {
        background: none;
    }

    body::after {
        content: "";

        position: fixed;

        top: 0;

        left: 0;

        width: 100vw;

        height: 100vh;

        background: url("/wp-content/themes/beesmm/assets/images/hexa_dan_wave_10.jpg") center/cover no-repeat;

        z-index: -1;
    }
}

.navbar {
    position: absolute;

    top: 0;

    left: 50%;

    transform: translateX(-50%);

    display: flex;

    align-items: center;

    z-index: 100;
}

.navbar__logo {
    height: 150px;

    width: auto;
}

.section-title {
    font-size: 64px;

    text-align: center;

    margin: 180px auto 40px;

    color: #fff;

    text-transform: uppercase;

    font-weight: bold;

    max-width: 1200px;

    line-height: 1.2;
}

.main-title.section-title {
    font-size: 39px;

    text-transform: initial;

    max-width: 700px;

    line-height: 57px;

    /* margin: 125px auto 30px; */
    margin: 180px auto 30px;
}

.mac .main-title.section-title {
    margin-top: 170px;
}

@media (max-width: 768px) {
    .main-title.section-title {
        font-size: 25px;

        /* margin: 100px auto 50px; */
        margin: 150px auto 50px;

        line-height: 33px;
    }

    .mac .main-title.section-title {
        margin: 150px auto 50px;
    }
}

.subtitle {
    font-size: 28px;

    color: #fff;

    text-align: center;

    font-style: italic;

    margin: 0 auto 30px;

    max-width: 325px;

    font-weight: 700;
}

.subtitle span {
    color: #ff0000;
}

.cta-button {
    display: inline-block;

    background: #ff0000;

    color: #000;

    padding: 15px 40px;

    border-radius: 30px;

    text-decoration: none;

    font-size: 18px;

    font-weight: 700;

    transition: background-color 0.3s;

    margin: 0 auto;

    display: block;

    width: fit-content;
}

.cta-button:hover {
    background: #cc0000;
}

.features {
    display: grid;

    grid-template-columns: repeat(4, 1fr);

    gap: 30px;

    max-width: 1200px;

    margin: 60px auto;

    padding: 0 20px;
}

.feature {
    text-align: center;

    padding: 20px 0;
}

.feature img {
    width: 100px;

    height: 100px;

    margin-bottom: 20px;
}

.feature h3 {
    color: #fff;

    font-size: 20px;

    margin-bottom: 15px;

    line-height: 1.2;

    font-weight: bold;

    /* font-family: "Georgia", serif; */
}

@media (max-width: 768px) {
    .feature h3 {
        font-size: 16px;
    }
}

.feature p {
    color: #fff;

    font-size: 16px;

    line-height: 1.2;

    font-weight: 300;

    /* font-family: "Georgia", serif; */
}

@media (max-width: 768px) {
    .feature p {
        font-size: 16px;
    }
}

@media (max-width: 1200px) {
    .features {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .navbar__logo {
        height: 116px;
    }

    .section-title {
        font-size: 36px;

        margin: 140px auto 30px;

        padding: 0 20px;
    }

    .subtitle {
        font-size: 20px;

        padding: 0 20px;

        max-width: 100%;

        margin-bottom: 90px;
    }

    .features {
        grid-template-columns: 1fr;
    }
}

/* Бегущая строка */

.ticker {
    background-color: #ff7a00;

    padding: 20px 0;

    margin: 40px 0;

    overflow: hidden;

    width: 100%;
}

.ticker__wrapper {
    display: flex;
}

.ticker__content {
    display: flex;

    animation: ticker 30s linear infinite;

    white-space: nowrap;
}

.ticker__item {
    color: #fff;

    font-size: 20px;

    text-transform: uppercase;

    padding: 0 10px 0 0;

    display: flex;

    align-items: center;

    gap: 10px;
}

@media (max-width: 768px) {
    .ticker {
        margin: 80px 0;
    }

    .ticker__item {
        font-size: 16px;
    }
}

.ticker__item::before {
    content: "";

    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill-rule='evenodd' viewBox='0 0 100 100'%3E%3Cpath d='M65.3 12.16a1.5 1.5 0 0 0-1.45-.08L32.79 27H6.5A1.5 1.5 0 0 0 5 28.5v28.09a1.13 1.13 0 0 0 .05.31s0 .09 0 .14a1.46 1.46 0 0 0 .07.16v.08l20.92 35a1.5 1.5 0 0 0 1.29.73H41.5a1.5 1.5 0 0 0 1.29-2.27L23.23 58h9.64l31 14.85A1.5 1.5 0 0 0 66 71.5V13.43a1.5 1.5 0 0 0-.7-1.27ZM8 30h24v25H8Zm30.86 60H28.27L9.14 58h10.59ZM63 69.11 35 55.7V29.27l28-13.46ZM79.5 33.5a1.49 1.49 0 0 0 .88-.29l11-8a1.5 1.5 0 1 0-1.76-2.43l-11 8a1.5 1.5 0 0 0 .88 2.71Zm15 7.5h-15a1.5 1.5 0 0 0 0 3h15a1.5 1.5 0 0 0 0-3Zm-3.12 18.79-11-8a1.5 1.5 0 1 0-1.76 2.43l11 8a1.5 1.5 0 1 0 1.76-2.43Z'/%3E%3C/svg%3E");

    width: 12px;

    height: 15px;

    background-size: contain;

    background-repeat: no-repeat;
}

@keyframes ticker {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-100%);
    }
}

/* Боковое меню */

.menu-toggle {
    position: fixed;

    left: calc(50vw - 640px);

    top: 22px;

    z-index: 1000;

    background: none;

    border: none;

    cursor: pointer;

    padding: 10px;
}

@media (max-width: 768px) {
    .menu-toggle {
        left: 10px;

        top: 15px;
    }
}

.menu-toggle__icon {
    display: block;

    width: 30px;

    height: 5px;

    background: #fff;

    position: relative;

    transition: all 0.3s ease;
}

@media (max-width: 768px) {
    .menu-toggle__icon {
        width: 25px;

        height: 4px;
    }
}

.menu-toggle__icon::before,
.menu-toggle__icon::after {
    content: "";

    position: absolute;

    width: 30px;

    height: 5px;

    background: #fff;

    transition: all 0.3s ease;

    left: 0;
}

@media (max-width: 768px) {
    .menu-toggle__icon::before,
    .menu-toggle__icon::after {
        width: 25px;

        height: 4px;
    }
}

/* .container {

            max-width: 1200px;

            width: 100%;

            margin: auto;

            position: relative;

        } */

.menu-toggle__icon::before {
    top: -10px;
}

.menu-toggle__icon::after {
    bottom: -10px;
}

@media (max-width: 768px) {
    .menu-toggle__icon::before {
        top: -8px;
    }

    .menu-toggle__icon::after {
        bottom: -8px;
    }
}

/* .menu-toggle.active .menu-toggle__icon {

            background: transparent;

        }



        .menu-toggle.active .menu-toggle__icon::before {

            top: 0;

            transform: rotate(45deg);

        }



        .menu-toggle.active .menu-toggle__icon::after {

            bottom: 0;

            transform: rotate(-45deg);

        } */

.side-menu {
    position: fixed;

    left: -100%;

    top: 0;

    width: 100%;

    height: 100%;

    background: rgba(0, 0, 0, 0.5);

    transition: left 0.3s ease;

    z-index: 1000;
}

.side-menu-inner {
    width: 200px;

    background-color: #111;

    display: flex;

    flex-direction: column;

    height: 100%;
}

.side-menu.active {
    left: 0;
}

.side-menu__close {
    background: none;

    border: none;

    color: #fff;

    font-size: 24px;

    cursor: pointer;

    width: max-content;

    margin-top: 10px;

    margin-right: 10px;

    margin-left: auto;
}

.side-menu__list {
    list-style: none;

    padding: 0;

    flex: 1 0 auto;
}

.side-menu__item {
    padding: 5px 40px;

    margin-bottom: 2px;

    /* border-bottom: 1px solid rgba(255, 255, 255, 0.1); */
}

.side-menu__link {
    color: #fff;

    text-decoration: none;

    font-size: 20px;

    display: block;

    transition: color 0.3s ease;

    /* font-family: "Georgia", serif; */
}

.side-menu__link:hover {
    color: #2196f3;
}

/* Секция услуг */

.services {
    padding: 0 20px;

    text-align: center;
}

.services__title {
    font-size: 50px;

    color: #fff;

    margin-bottom: 50px;

    text-transform: none;
}

.services__grid {
    display: grid;

    grid-template-columns: repeat(2, 1fr);

    gap: 20px;

    max-width: 750px;

    margin: 0 auto;
}

.service-btn {
    display: flex;

    align-items: center;

    /* background: rgba(255, 255, 255, 0.1); */

    border: none;

    border-radius: 50px;

    padding: 15px 30px;

    color: #fff;

    cursor: pointer;

    transition: all 0.3s ease;

    width: 100%;

    text-decoration: none;

    border: 1px solid #fff;
}

.service-btn:hover {
    background: rgba(255, 255, 255, 0.2);

    transform: translateY(-2px);
}

.service-btn img {
    width: 45px;

    height: 45px;

    margin-right: 15px;
}

.service-btn span {
    flex-grow: 1;

    text-align: left;

    font-size: 32px;

    font-weight: 900;
}

.arrow-icon {
    opacity: 0.7;

    font-size: 12px;

    margin-left: 10px;
}

@media (max-width: 768px) {
    .services__title {
        font-size: 25px;

        margin-bottom: 30px;
    }

    .services__grid {
        grid-template-columns: 1fr;
    }

    .service-btn {
        padding: 12px 20px;
    }

    .service-btn span {
        font-size: 20px;
    }
}

/* Секция как это работает */

.how-it-works {
    padding: 80px 20px 20px;

    max-width: 1200px;

    margin: 0 auto;
}

.how-it-works h2 {
    font-size: 40px;

    /* font-family: "Georgia", serif; */

    margin: 0;

    text-transform: initial;
}

@media (max-width: 768px) {
    .how-it-works h2 {
        font-size: 30px;
    }
}

.steps {
    display: flex;

    justify-content: space-between;

    align-items: flex-start;

    gap: 30px;

    margin-top: 50px;
}

.step {
    flex: 1;

    display: flex;

    flex-direction: column;

    align-items: center;

    text-align: center;

    position: relative;
}

.step__image-container {
    width: 100px;

    height: 100px;

    margin-bottom: 20px;

    display: flex;

    align-items: center;

    justify-content: center;
}

.step__image {
    width: 100%;

    height: auto;

    object-fit: contain;
}

.step__content {
    max-width: 400px;
}

.step__title {
    font-size: 19px;

    color: #fff;

    margin-bottom: 15px;

    line-height: 1.55;

    /* font-family: "Georgia", serif; */
    font-weight: 400;
}

@media (max-width: 768px) {
    .step__title {
        font-size: 20px;

        margin-bottom: 40px;
    }
}

.step__description {
    font-size: 16px;

    color: rgba(255, 255, 255, 0.8);

    line-height: 1.5;
}

.step__arrow {
    position: absolute;

    right: -45px;

    top: 40px;

    font-size: 36px;

    color: #fff;

    transform: translateY(-50%);
}

.step:last-child .step__arrow {
    display: none;
}

@media (max-width: 768px) {
    .steps {
        flex-direction: column;

        gap: 50px;
    }

    .step {
        width: 100%;
    }

    .step__arrow {
        right: auto;

        bottom: -40px;

        top: auto;

        transform: rotate(90deg);
    }

    .step__content {
        max-width: 100%;
    }
}

/* Секция о платформе */

.platform {
    padding: 80px 20px;

    color: #fff;

    max-width: 1200px;

    margin: 0 auto;
}

.platform__title {
    font-size: 48px;

    text-align: center;

    margin-bottom: 40px;

    /* font-family: "Georgia", serif; */
}

.platform__text {
    font-size: 18px;

    line-height: 1.6;

    margin-bottom: 30px;
}

.platform__text:last-child {
    margin-bottom: 0;
}

@media (max-width: 768px) {
    .platform__title {
        font-size: 32px;

        margin-bottom: 30px;
    }

    .platform__text {
        font-size: 16px;

        margin-bottom: 20px;
    }
}

/* Секция отзывов */

.reviews {
    padding: 80px 20px 15px;

    color: #fff;
}

@media (max-width: 768px) {
    .reviews {
        padding: 20px;
    }
}

.reviews__title {
    font-size: 40px;

    text-align: center;

    margin-bottom: 40px;

    /* font-family: "Georgia", serif; */
}

.reviews__slider {
    /* max-width: 1200px; */

    max-width: 100%;

    margin: 0 auto;

    position: relative;

    overflow: hidden;

    cursor: pointer;
}

.reviews__track {
    display: flex;

    gap: 48px;

    align-items: center;

    justify-content: center;

    background: none !important;

    box-shadow: none !important;
}

.review-card {
    min-width: calc(33.333% - 20px);

    margin: 0 10px;

    padding: 0 !important;

    background: none !important;

    box-shadow: none !important;

    border: none !important;
}

.review-card__header {
    display: flex;

    align-items: center;

    margin-bottom: 20px;
}

.review-card__avatar {
    width: 50px;

    height: 50px;

    border-radius: 50%;

    margin-right: 15px;

    object-fit: cover;
}

.review-card__name {
    font-size: 18px;

    font-weight: bold;
}

.review-card__service {
    font-size: 14px;

    opacity: 0.7;
}

.review-card__text {
    font-size: 16px;

    line-height: 1.6;

    margin-bottom: 15px;
}

.review-card__date {
    font-size: 14px;

    opacity: 0.7;
}

.review-card__images {
    display: grid;

    gap: 10px;

    margin: 15px 0;
}

.review-card__image {
    /* width: 420px;

            height: 420px; */

    /* max-width: 90vw;

            max-height: 90vw; */

    max-width: 30vw;

    max-height: 22vw;

    object-fit: cover;

    border-radius: 12px;

    box-shadow: none !important;

    background: none !important;

    display: block;

    margin: 0 auto;

    cursor: pointer;
}

.review-card__image:hover {
    /* transform: scale(1.05); */
}

.reviews__nav {
    display: none;

    justify-content: center;

    margin-top: 30px;

    gap: 10px;
}

.reviews__nav-btn {
    width: 12px;

    height: 12px;

    border-radius: 50%;

    background: rgba(255, 255, 255, 0.3);

    border: none;

    padding: 0;

    cursor: pointer;

    transition: background-color 0.3s;
}

.reviews__nav-btn--active {
    background: #fff;
}

.reviews__arrow {
    position: absolute;

    top: 50%;

    transform: translateY(-50%);

    width: 40px;

    height: 40px;

    background: rgba(255, 255, 255, 0.2);

    border: none;

    border-radius: 50%;

    cursor: pointer;

    display: flex;

    align-items: center;

    justify-content: center;

    color: #fff;

    font-size: 24px;

    transition: background-color 0.3s;
}

.reviews__arrow:hover {
    background: rgba(255, 255, 255, 0.3);
}

.reviews__arrow--prev {
    left: -60px;
}

.reviews__arrow--next {
    right: -60px;
}

@media (max-width: 1200px) {
    .review-card {
        min-width: calc(50% - 20px);
    }
}

@media (max-width: 768px) {
    .reviews__title {
        font-size: 25px;

        margin-bottom: 30px;
    }

    .review-card {
        min-width: calc(100vw - 20px);

        /* min-width: 100%; */

        margin: 0;
    }

    .reviews__arrow {
        display: none;
    }

    .review-card__images {
        grid-template-columns: 1fr;
    }

    .review-card__image {
        width: 100%;

        max-width: 100%;

        max-height: 100%;
    }

    .reviews__track {
        gap: 16px;
    }
}

/* Модальное окно для просмотра изображений */

.image-modal {
    display: none;

    position: fixed;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    background: rgba(0, 0, 0, 0.9);

    z-index: 1000;

    justify-content: center;

    align-items: center;
}

.image-modal.active {
    display: flex;
}

.image-modal__content {
    max-width: 90%;

    max-height: 90vh;
}

.image-modal__img {
    max-width: 100%;

    max-height: 90vh;

    object-fit: contain;
}

.image-modal__close {
    position: absolute;

    top: 20px;

    right: 20px;

    color: #fff !important;

    font-size: 30px;

    cursor: pointer;

    background: none;

    border: none;

    padding: 10px;
}

/* Контакты */

.contacts {
    padding: 45px 20px;
}

@media (max-width: 768px) {
    .contacts {
        padding: 0 20px 90px;
    }
}

.contacts h2 {
    font-size: 42px;

    /* font-family: "Georgia", serif; */

    line-height: 1.23;

    font-weight: 600;

    text-transform: initial;

    margin: 0 auto 30px;
}

@media (max-width: 768px) {
    .contacts h2 {
        font-size: 30px;
    }
}

.contacts__grid {
    display: grid;

    grid-template-columns: repeat(3, 1fr);

    gap: 40px;

    max-width: 1200px;

    margin: 60px auto 0;
}

.contact-item {
    text-align: center;
}

.contact-item__icon-wrapper {
    width: 60px;

    height: 60px;

    margin: 0 auto 20px;

    display: flex;

    align-items: center;

    justify-content: center;
}

.contact-item__icon {
    width: 100%;

    height: auto;

    object-fit: contain;
}

.contact-item__title {
    font-size: 24px;

    color: #fff;

    margin-bottom: 15px;

    /* font-family: "Georgia", serif; */
}

.contact-item__text {
    font-size: 18px;

    color: #fffafa;

    line-height: 1.55;

    margin-bottom: 10px;

    /* font-family: "Georgia", serif; */
}

@media (max-width: 768px) {
    .contact-item__text {
        font-size: 14px;
    }
}

.contact-item__link {
    color: #fff;

    text-decoration: none;

    transition: color 0.3s;

    font-size: 16px;

    display: inline-block;
}

.contact-item__link:hover {
    color: #ff0000;
}

.contact-item__link--telegram {
    color: #ff0000;
}

.contact-item__link--telegram:hover {
    color: #cc0000;
}

@media (max-width: 992px) {
    .contacts__grid {
        grid-template-columns: repeat(2, 1fr);

        gap: 30px;
    }
}

@media (max-width: 576px) {
    .contacts__grid {
        grid-template-columns: 1fr;

        gap: 40px;
    }

    .contact-item__icon-wrapper {
        width: 60px;

        height: 60px;
    }

    .contact-item__title {
        font-size: 20px;

        margin-bottom: 5px;
    }
}

/* Футер */

.footer__logo-img {
    height: 150px;

    width: auto;
}

.footer__right {
    display: flex;

    align-items: center;

    gap: 30px;
}

.footer__social {
    display: flex;

    gap: 15px;
}

.footer__social-link {
    display: flex;

    align-items: center;

    justify-content: center;

    transition: opacity 0.3s;
}

.footer__social-link:hover {
    opacity: 0.8;
}

.footer__lang {
    display: flex;

    align-items: center;

    justify-content: flex-end;

    gap: 18px;
}

@media (max-width: 768px) {
    .footer__lang {
        justify-content: center;

        margin-top: 20px;

        gap: 15px;
    }
}

.footer__lang-link {
    color: #ffffff;

    text-decoration: none;

    font-size: 20px;

    transition: color 0.3s;

    /* font-family: "Georgia", serif; */

    line-height: 31px;

    font-weight: 400;
}

@media (max-width: 768px) {
    .footer__lang-link {
        font-size: 14px;
    }
}

.footer__lang-link:hover {
    color: #ff0000;
}

.footer__lang-link--active {
    /* color: #ff0000; */
}

.footer__lang-separator {
    color: #ffffff;

    font-size: 20px;
}

/* Модальное окно */

#agreement-modal p {
    /* font-family: "Georgia", serif; */
}

.modal {
    display: none;

    position: fixed;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    z-index: 1000;

    padding: 0 20px;

    text-align: center;
}

.modal.active {
    overflow-y: scroll;

    display: block;

    align-items: center;

    justify-content: center;
}

.modal__overlay {
    position: fixed;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    /* background: rgba(0, 0, 0, 0.85); */

    cursor: pointer;
}

.modal__container {
    position: relative;

    width: 100%;

    max-width: 560px;

    /* max-height: 85vh; */

    margin: 65px auto;

    top: 0;

    bottom: 0;

    left: 0;

    right: 0;

    background: #fbfbf9;

    padding: 60px 40px;

    /* border-radius: 20px; */

    overflow-y: auto;

    z-index: 1;

    color: #fff;

    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.4);
}

.modal__close svg {
    width: 45px;

    height: 45px;
}

.modal__close {
    position: fixed;

    top: 15px;

    right: 15px;

    background: none;

    border: none;

    font-size: 40px;

    color: #222 !important;

    cursor: pointer;

    padding: 10px;

    width: 45px;

    height: 45px;

    display: flex;

    align-items: center;

    justify-content: center;

    transition: color 0.2s;

    /* opacity: 0.7; */

    line-height: 1;
}

.modal__close:hover {
    color: #ff0000 !important;
}

.modal__title {
    font-size: 32px;

    color: #fff;

    margin-bottom: 30px;

    /* font-family: "Georgia", serif; */

    font-weight: normal;
}

.modal__text {
    font-size: 16px;

    line-height: 1.6;

    color: #fff;

    text-align: left;
}

.modal__text p {
    margin-bottom: 15px;
}

@media (max-width: 768px) {
    .modal__container {
        padding: 40px 20px;
    }

    .modal__title {
        font-size: 24px;

        margin-bottom: 20px;
    }

    .modal__close {
        font-size: 30px;

        padding: 5px;
    }
}

/* Platform section styles */

.platform-section {
    max-width: 1200px;

    margin: 0 auto;

    padding: 40px 20px;

    color: #fff;
}

.platform-section__title {
    font-size: 30px;

    font-weight: 700;

    line-height: 47px;

    text-transform: initial !important;

    text-align: center;

    margin-bottom: 40px;

    font-weight: bold;

    text-transform: uppercase;

    /* font-family: "Georgia", serif; */
}

.platform-section__text {
    font-size: 18px;

    line-height: 22px;

    margin-bottom: 25px;

    /* font-family: "Georgia", serif; */
}

@media (max-width: 768px) {
    .platform-section__title {
        font-size: 15px;

        margin-bottom: 10px;
    }

    .platform-section__text {
        font-size: 14px;

        line-height: 1.4;

        padding: 0 35px;

        margin-bottom: 10px;
    }
}

/* Услуги TikTok */

.tiktok-services {
    padding: 60px 20px;

    max-width: 1200px;

    margin: 0 auto;
}

.services-grid {
    display: grid;

    grid-template-columns: repeat(2, 1fr);

    gap: 30px;

    margin-top: 50px;
}

.service-card {
    background: rgba(255, 255, 255, 0.1);

    border-radius: 20px;

    padding: 30px;

    text-align: center;

    transition: transform 0.3s ease;
}

.service-card:hover {
    transform: translateY(-5px);
}

.service-card__icon {
    width: 80px;

    height: 80px;

    margin: 0 auto 20px;
}

.service-card__title {
    font-size: 24px;

    color: #fff;

    margin-bottom: 15px;
}

.service-card__description {
    font-size: 16px;

    color: rgba(255, 255, 255, 0.8);

    margin-bottom: 20px;
}

.service-card__price {
    font-size: 28px;

    color: #ff0000;

    margin-bottom: 20px;

    font-weight: bold;
}

.service-card__button {
    display: inline-block;

    background: #ff0000;

    color: #fff;

    padding: 12px 30px;

    border-radius: 25px;

    text-decoration: none;

    font-size: 16px;

    transition: background-color 0.3s;
}

.service-card__button:hover {
    background: #cc0000;
}

@media (max-width: 768px) {
    .section-title {
        font-size: 36px;

        margin: 140px auto 30px;

        padding: 0 20px;
    }

    .subtitle {
        font-size: 20px;

        padding: 0 20px;
    }

    .services-grid {
        grid-template-columns: 1fr;
    }

    .service-card {
        padding: 20px;
    }
}

/* Header styles */

.header {
    text-align: center;

    padding: 150px 20px 60px;

    position: relative;
}

@media (max-width: 768px) {
    .header {
        text-align: center;

        padding: 50px 20px 0px;

        position: relative;
    }

    .mac .header {
        padding: 100px 20px 0px;
    }
}

.header__logo {
    width: 150px;

    height: auto;

    margin-bottom: 40px;
}

.header__title {
    display: flex;

    justify-content: center;

    gap: 10px;
}

@media (max-width: 992px) {
    .header__title {
        flex-direction: column;
    }
}

.header__title strong,
.header__title * {
    font-size: 44px;

    color: #fff;

    text-align: center;

    /* font-family: "Georgia", serif; */
}

@media (max-width: 992px) {
    .header__title strong,
    .header__title * {
        font-size: 25px;
    }
}

.header__title span {
    font-style: italic;

    text-transform: uppercase;

    height: 0 !important;

    position: relative;
}

@media (max-width: 768px) {
    .header__title span {
        height: auto !important;

        display: block;
    }
}

.instagram .header__title span {
    color: #f40853 !important;
}

.header__title span.custom-shadow {
    box-shadow: none !important;
}

.header__title span::after {
    content: "";

    position: absolute;

    left: 0;

    right: 0;

    margin: auto;

    top: -20px;

    bottom: 0;

    height: 0;

    box-shadow: none !important;
}

@media (max-width: 992px) {
    .header__title span::after {
        width: max-content !important;
        display: flex;
        top: -50px;
    }
}

.instagram_link.link-active_custom span::after,
.instagram .header__title span::after {
    content: "";
    box-shadow:
        0 12px 44px 26px #b4839ebd,
        0 0 16px,
        0 2px 8px 0 rgba(0, 0, 0, 0.15) !important;

    width: 50%;
}
.instagram_link.link-active_custom span::after {
    width: 50%;
    box-shadow:
        -8px 0px 40px 35px #b4839ebd,
        0 0 16px,
        0 2px 8px 0 rgba(0, 0, 0, 0.15) !important;
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
}
.tiktok .header__title span {
    color: #00eef3 !important;
}

.tiktok .header__title span::after {
    content: "";

    box-shadow:
        0 35px 60px 30px #00eff38c,
        0 0 16px,
        0 2px 8px 0 rgba(0, 0, 0, 0.15) !important;

    width: 100%;
}
.tiktok_link.link-active_custom span::after {
    content: "";
    width: 50%;
    box-shadow:
        -8px 0px 40px 35px #00eff38c,
        0 0 16px,
        0 2px 8px 0 rgba(0, 0, 0, 0.15) !important;
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
}
.telegram .header__title span::after {
    content: "";
    box-shadow:
        0 35px 100px 30px #04abff,
        0 0 16px,
        0 2px 8px 0 rgba(0, 0, 0, 0.15) !important;

    width: 100%;
}
.telegram_link.link-active_custom span::after {
    content: "";
    width: 50%;
    box-shadow:
        -8px 0px 40px 35px #04abff,
        0 0 16px,
        0 2px 8px 0 rgba(0, 0, 0, 0.15) !important;
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
}
.telegram .header__title span {
    color: #04abff;
}

.youtube .header__title span::after {
    content: "";
    box-shadow:
        0px 14px 80px 20px #ff1414,
        0 0 16px,
        0 2px 8px 0 rgba(0, 0, 0, 0.15) !important;

    width: 100%;
}
.youtube_link.link-active_custom span::after {
    content: "";
    width: 50%;
    box-shadow:
        0px 0px 50px 20px #ff1414,
        0 0 16px,
        0 2px 8px 0 rgba(0, 0, 0, 0.15) !important; 
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
}
.youtube .header__title span {
    color: #ff1414;
}

.twitch .header__title span::after {
    content: "";
    box-shadow:
        0 35px 100px 30px #9837ff,
        0 0 16px,
        0 2px 8px 0 rgba(0, 0, 0, 0.15) !important;

    width: 100%;
}
.twitch_link.link-active_custom span::after {
    content: "";
    width: 50%;
    box-shadow:
        -8px 0px 40px 35px #9837ff,
        0 0 16px,
        0 2px 8px 0 rgba(0, 0, 0, 0.15) !important;
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
}
.twitch .header__title span {
    color: #9837ff;
}

.facebook .header__title span::after {
    content: "";
    box-shadow:
        0 35px 100px 30px #0876f4,
        0 0 16px,
        0 2px 8px 0 rgba(0, 0, 0, 0.15) !important;

    width: 100%;
}
.facebook_link.link-active_custom span::after {
    content: "";
    width: 50%;
    box-shadow:
        -8px 0px 40px 35px #0876f4,
        0 0 16px,
        0 2px 8px 0 rgba(0, 0, 0, 0.15) !important;
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
}
.facebook .header__title span {
    color: #0876f4;
}

/* градиент кнопки на странице инстаграм */
.custom-btn,
.instagram .package-card__button {
    background-image: radial-gradient(
        circle at center,

        rgba(61, 71, 217, 1) 0%,

        rgba(233, 124, 187, 1) 51%,

        rgba(249, 231, 187, 1) 100%
    );
}

/* градиент кнопки на странице tiktok */

.tiktok .package-card__button {
    background-image: radial-gradient(circle at center, rgba(231, 97, 189, 1) 0%, #83f5e5 100%);
}

/* градиент кнопки на странице telegram */

.telegram .package-card__button {
    background: #04abff;
}

/* градиент кнопки на странице youtube */

.youtube .package-card__button {
    background: #ff1414;
}

/* градиент кнопки на странице twitch */

.twitch .package-card__button {
    background: #9837ff;
}

/* градиент кнопки на странице facebook */

.facebook .package-card__button {
    background: #3c5ffe;
}

.header__subtitle {
    display: inline-block;

    background: #ffa500;

    color: #000;

    padding: 15px 40px;

    border-radius: 30px;

    font-size: 23px;

    font-weight: bold;

    margin-bottom: 60px;

    margin-top: 20px;
}

.header__subtitle * {
    /* font-family: "Georgia", serif; */
}

@media (max-width: 992px) {
    .header__subtitle * {
        font-size: 17px;
    }
}

.social-icons {
    display: flex;

    justify-content: center;

    gap: 50px;

    margin-top: 40px;
}

@media (max-width: 992px) {
    .social-icons {
        margin-top: 25px;

        position: relative;
    }
}
@media (max-width: 768px) {
    .social-icons {
        margin-top: 80px;

        position: relative;
    }
}

.social-icons__item {
    width: 64px;

    height: 64px;

    transition: transform 0.3s ease;
    position: relative;
    z-index: 9;
}

.social-icons__item:hover {
    transform: scale(1.1);
}

.social-icons__glow {
    display: inline-flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    transition:
        box-shadow 0.2s,
        transform 0.2s;

    height: 0;
}

.social-icons__glow--active {
    box-shadow:
        0 0 32px 18px #ff008e,
        0 0 16px 4px #6b5aef,
        0 2px 8px 0 rgba(0, 0, 0, 0.15);

    background: transparent;

    transform: scale(1.35);
}

@media (max-width: 768px) {
    .social-icons .social-icons__glow--active {
        transform: scale(1.8); 

        position: absolute;

        left: 0;

        right: 0;

        margin: auto;

        top: -80px;

        box-shadow: none !important;
    }

    .social-icons .social-icons__glow--active::after {
        content: "";

        position: absolute;

        /* left: -15px; */

        top: 0;

        /* right: 0; */

        bottom: 0;

        margin: auto;

        width: 50px;

        height: 50px;

        filter: blur(30px);

        z-index: -1;
    }

    .instagram .social-icons__glow--active::after {
        background-color: #e97cbbcf;
    }

    .telegram .social-icons__glow--active::after {
        background-color: #04abff;
    }

    .youtube .social-icons__glow--active::after {
        background-color: #ff8562;
    }

    .tiktok .social-icons__glow--active::after {
        background-color: #83f5e5;
    }

    .twitch .social-icons__glow--active::after {
        background-color: #9837ff;
    }

    .facebook .social-icons__glow--active::after {
        background-color: #3c5ffe;
    }
}

.social-icons__item--active {
    box-shadow: none;

    transform: none;

    padding: 0;

    background: none;
}

@media (max-width: 768px) {
    .header__title {
        font-size: 36px;
    }

    .header__subtitle {
        font-size: 18px;

        padding: 8px 16px;
        position: relative;
        z-index: 1;
    }

    .social-icons {
        gap: 20px;
    }

    .social-icons__item {
        width: 50px;

        height: 50px;
    }
}

/* Subscriber packages styles */

.packages {
    padding: 40px 20px;

    max-width: 1400px;

    margin: 0 auto;
    display: flex;
    flex-direction: column;
}

.packages-grid {
    display: grid;

    grid-template-columns: repeat(4, 1fr);

    gap: 20px;

    margin-bottom: 40px;

    place-items: center;
}

.package-card {
    background: #fff;

    border-radius: 50px;

    padding: 30px 20px;

    text-align: center;

    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);

    width: 100%;
}


.package-card__subscribers {
    font-size: 36px;

    color: #000 !important;

    font-weight: bold;

    line-height: 32px;
    position: relative;
    text-decoration: none !important;
}

.package-card__subscribers-nums {
    filter: grayscale(1);
    border: none !important;
    text-decoration: none !important;
    white-space: nowrap;
}

.package-card__label {
    font-size: 18px;

    color: #000;

    margin-bottom: 20px;
    text-transform: lowercase;
    /* font-family: "Georgia", serif; */
}
.package-card__label .additional__info {
    display: none;
}

.package-card__icon {
    width: 80px;

    height: 80px;

    margin: 0 auto 20px;

    object-fit: contain;
}

.package-card__old-price {
    color: #ff0000;

    font-size: 20px;

    text-decoration: line-through;

    margin-bottom: 5px;
}

.package-card__price {
    font-size: 32px;

    color: #000;

    font-weight: bold;

    margin-bottom: 20px;
}

.custom-btn,
.package-card__button {
    display: inline-block;

    padding: 12px 40px;

    border-radius: 30px;

    font-size: 25px;

    color: #fff;

    text-decoration: none;

    background: linear-gradient(45deg, #00ffff, #ff69b4);

    border: none;

    cursor: pointer;

    transition: transform 0.3s ease;
}

.custom-btn:hover,
.package-card__button:hover {
    transform: translateY(-2px);
}

.packages .divider {
    height: 2px;

    background: linear-gradient(
        to right,

        rgba(255, 255, 255, 0) 0%,

        rgba(255, 255, 255, 1) 50%,

        rgba(255, 255, 255, 0) 100%
    );

    margin: 40px auto;

    max-width: 960px;
}

@media (max-width: 1200px) {
    .packages{
        padding: 0 20px;
    }
}
/* @media (max-width: 768px) {
    .packages{
        padding: 0 20px;
    }
} */

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

        max-width: 320px;

        margin: auto;
        gap: 14px;
    }
}

/* Modal styles */

.modal {
    display: none;

    position: fixed;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    background: rgba(0, 0, 0, 0.8);

    z-index: 1000;

    justify-content: center;

    align-items: center;
}

.modal.active {
    display: block;

    overflow-y: scroll;
}

.modal__content,
.modal__content.agree {
    background: #fbfbf9 !important;

    color: #111 !important;
}

.modal__content *,
.modal__content.agree * {
    background: transparent !important;

    /* font-family: "Georgia", serif; */
}

.modal__title,
.agreement__title {
    color: #111;
}

.modal__text,
.agreement__text,
.agreement__content {
    color: #111;
}

.agreement__content .t-heading {
    font-size: 28px;

    /* font-family: "Georgia", serif; */

    font-weight: bold;

    text-align: center;
}

.header__subtitle a {
    color: #000;

    text-decoration: none !important;
}

.modal__close {
    position: fixed;

    right: 20px;

    top: 20px;

    background: none;

    border: none;

    color: #fff;

    font-size: 24px;

    cursor: pointer;
}

.modal__order-details {
    margin-bottom: 0;

    border-bottom: 1px solid rgba(255, 255, 255, 0.1);

    padding-bottom: 0;
}

.modal__order-title {
    font-size: 28px;

    color: #222;

    margin-bottom: 20px;

    font-weight: bold;
}

.modal__order-item {
    display: flex;

    justify-content: space-between;

    align-items: center;

    margin-bottom: 10px;

    color: #222;

    font-size: 16px;
}

.modal__order-item .remove {
    color: #ff0000;

    cursor: pointer;

    font-size: 20px;

    padding: 5px;
}

.modal__total {
    display: flex;

    justify-content: space-between;

    align-items: center;

    color: #222;

    font-size: 18px;

    font-weight: bold;

    margin: 0;

    padding-top: 20px;

    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.modal__info {
    text-align: center;

    margin: 20px 0;

    color: #222;
}

.modal__info-item {
    margin: 10px 0;

    font-size: 16px;
}

.modal__info-item * {
    /* font-family: "Georgia", serif; */
}

.modal__form {
    display: flex;

    flex-direction: column;

    gap: 20px;
}

.modal__input {
    width: 100%;

    padding: 15px;

    border: 1px solid rgba(255, 255, 255, 0.1);

    border-radius: 8px;

    background: rgba(255, 255, 255, 0.05);

    color: #222;

    font-size: 16px;
}

.modal__input::placeholder {
    color: rgba(255, 255, 255, 0.5);
}

.modal__submit {
    color: #222;

    border: none;

    padding: 15px;

    border-radius: 30px;

    font-size: 16px;

    cursor: pointer;

    transition: transform 0.3s ease;

    /* font-family: "Georgia", serif; */
}

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

/* Agreement styles */

.agreement {
    background: #171717;

    padding: 40px;

    max-width: 1200px;

    margin: 40px auto;

    border-radius: 20px;

    color: #fff;
}

.agreement__title {
    font-size: 28px;

    text-align: center;

    margin-bottom: 30px;

    font-weight: bold;
}

.agreement__content {
    font-size: 16px;

    line-height: 1.6;
}

.agreement__section {
    margin-bottom: 30px;
}

.agreement__section-title {
    font-size: 20px;

    font-weight: bold;

    margin-bottom: 15px;

    text-align: center;
}

.agreement__text {
    margin-bottom: 15px;

    text-align: center;
}

@media (max-width: 768px) {
    .agreement {
        padding: 20px;

        margin: 20px;
    }

    .agreement__title {
        font-size: 24px;
    }

    .agreement__section-title {
        font-size: 18px;
    }
}

/* Support section styles */

.support {
    background: #000;

    border-radius: 120px;

    padding: 36px 48px;

    max-width: 735px;

    margin: 60px auto 0 auto;

    text-align: center;

    box-shadow: none;
}

.support__text {
    color: #fff;

    font-size: 20px;

    line-height: 1.5;

    margin-bottom: 48px;

    max-width: 800px;

    margin-left: auto;

    margin-right: auto;

    /* font-family: "Georgia", serif; */
}

.support__button {
    display: inline-block;

    background: #fff;

    color: #000;

    padding: 20px 48px;

    border-radius: 40px;

    font-size: 15px;

    font-weight: 700;

    text-decoration: none;

    box-shadow: none;

    border: none;

    transition:
        background 0.2s,
        color 0.2s;
}

.support__button:hover {
    background: #ffe0b2;

    color: #000;
}

@media (max-width: 700px) {
    .support {
        border-radius: 40px;

        padding: 32px 10px;

        margin-top: 0;

        max-width: calc(100vw - 40px);

        width: 100%;
    }

    .support__text {
        font-size: 18px;

        margin-bottom: 24px;
    }

    .support__button {
        font-size: 16px;

        padding: 12px 24px;
    }
}

/* Features section */

.features {
    display: grid;

    grid-template-columns: repeat(4, 1fr);

    gap: 40px;

    max-width: 1200px;

    margin: 40px auto;

    padding: 0 20px;
}

.feature {
    text-align: left;

    padding: 20px 0;

    /* background: rgba(0, 0, 0, 0.3); */

    border-radius: 20px;
}

@media (max-width: 768px) {
    .feature {
        padding: 0;
    }
}

.feature__icon {
    width: 80px;

    height: 80px;

    margin-bottom: 20px;
}

.feature__title {
    color: #fff;

    font-size: 24px;

    margin-bottom: 20px;

    font-weight: bold;
}

.feature__text {
    color: #fff;

    font-size: 16px;

    line-height: 1.6;

    opacity: 0.9;
}

@media (max-width: 1200px) {
    .features {
        grid-template-columns: repeat(2, 1fr);
    }
}

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

        gap: 40px;
    }
}

/* Text info section */

.info-section-wrapper {
    max-width: 1200px;

    margin: auto;

    padding: 0 20px;
}

.info-section-wrapper * {
    /* font-family: "Georgia", serif; */
}

.info-section {
    max-width: 1200px;

    margin: 0 auto;

    padding: 40px 20px;

    color: #fff;
}

.info-section * {
    /* font-family: "Georgia", serif; */
}

.info-section-wrapper h2 {
    font-size: 20px;

    font-weight: bold;

    margin-bottom: 20px;
}

.info-section-wrapper h3 {
    font-size: 28px;

    font-weight: bold;

    margin-top: 40px;

    margin-bottom: 20px;
}

.info-section-wrapper h5 {
    font-size: 15px;

    font-weight: bold;

    margin-bottom: 10px;

    margin-top: 10px;
}

.info-section-wrapper div.tn-atom {
    font-size: 13px;

    font-weight: bold;

    margin-bottom: 10px;

    margin-top: 10px;
}

.info-section-wrapper p {
    font-size: 18px;

    line-height: 1.7;

    margin-bottom: 18px;
}

.info-section-wrapper a {
    color: #ff8562;

    text-decoration: none;
}

@media (max-width: 768px) {
    .info-section-wrapper h2 {
        font-size: 22px;
    }

    .info-section-wrapper h3 {
        font-size: 20px;
    }

    .info-section-wrapper p {
        font-size: 15px;
    }
}

.lang-switch {
    padding: 0 35px;

    margin: 0 0 38px;

    flex-shrink: 0;
}

.l-l {
    color: #fff;

    padding: 11px 5px;

    font-size: 14px;

    text-decoration: none;

    /* font-family: "Georgia", serif; */
}

@media (min-width: 769px) {
    .package-card {
        max-width: 200px !important;

        width: 100%;

        max-height: max-content;
    }

    .packages-grid { 
        padding: 0px 50px 0px 50px !important;
    }

    .package-card__label {
        font-size: 19px;

        color: #000;

        margin-bottom: 10px;
    }

    .package-card__icon {
        margin: 0px;
    }

    .package-card__label {
        font-size: 19px;

        color: #000;

        margin-bottom: 5px;
    }

    .package-card__price {
        font-size: 25px;

        color: #000;

        font-weight: bold;

        margin-bottom: 10px;
    }

    .package-card__old-price {
        color: #ff0000;

        font-size: 20px;

        text-decoration: line-through;

        margin-bottom: 5px;
    }

    .package-card__subscribers {
        font-size: 25px;

        color: #000;

        font-weight: bold;

        line-height: 32px;
    }

    .package-card {
        background: #fff;

        border-radius: 50px;

        padding: 10px !important;

        text-align: center;

        box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);

        max-height: max-content;

        width: 100%;
    }

    .custom-btn,
    .package-card__button {
        display: inline-block;

        padding: 6px 30px;

        border-radius: 30px;

        font-size: 25px;

        color: #fff;

        text-decoration: none;

        background: linear-gradient(45deg, #00ffff, #ff69b4);

        border: none;

        cursor: pointer;

        transition: transform 0.3s ease;

        margin-top: -5px !important;

        position: relative;

        /* font-family: "Georgia", serif; */
    }
}
@media(max-width: 992px) and (min-width: 769px) {
    .package-card {
        max-width: 100% !important;
    }
        .custom-btn, .package-card__button {
            padding: 6px 12px;
        }
}
@media (min-width: 1200px) {
    .packages-grid { 
        padding: 0px 150px 0px 150px !important;
    }
}
@media (max-width: 768px) {
    .package-card__subscribers {
        font-size: 19px;
        line-height: normal;
    }

    .package-card__label {
        font-size: 15px;

        margin-bottom: 0;
        line-height: normal;
    }

    .package-card__icon {
        width: 60px;

        height: 55px;

        object-fit: contain;

        margin-bottom: 0;
    }

    .package-card__old-price {
        font-size: 15px;

        margin-bottom: 0;
    }

    .package-card__price {
        font-size: 20px;

        margin-bottom: 5px;
    }

    .custom-btn,
    .package-card__button {
        font-size: 15px;

        padding: 6px 26px;
    }
}

/* 1. Белый фон самого модального окна */

.modal__content {
    background-color: #fff !important;
}

/* 2. Заголовок */

.modal__order-title {
    color: #000 !important;

    margin-bottom: 12px;
}

/* 3. Строка заказа: скрываем описание, оставляем только цену слева и крестик справа */

.modal__order-item {
    display: flex;

    align-items: center;

    justify-content: space-between;

    padding: 12px 0;

    border-bottom: 1px solid #00000033;

    border-top: 1px solid #00000033;
}

.modal__order-item #orderDescription {
    color: #000;

    font-size: 16px;

    font-weight: 600;

    display: flex;
    align-items: center;
    gap: 5px;
}
#orderDescription .country_icon {
    width: 25px;
}

.modal__order-item .order-description {
    display: none !important;
}

.modal__order-item .order-price {
    color: #000 !important;

    font-size: 16px;

    line-height: 1;

    /* font-family: "Georgia", serif; */
}

.modal__order-item .remove {
    cursor: pointer;

    display: inline-block;

    opacity: 0.4;
}

.modal__order-item .remove svg {
    height: 20px;

    width: 20px;
}

/* 4. Итоговая сумма */

.modal__total {
    display: flex;

    justify-content: flex-end;

    padding: 12px 0;
}

.modal__total span {
    color: #000 !important;

    font-weight: bold;

    font-size: 16px;

    margin-left: 4px;

    /* font-family: "Georgia", serif; */
}

/* 5. Поля ввода — градиентный бордер по трём цветам */

.modal__form .modal__input {
    width: 100%;

    padding: 12px 16px;

    margin-bottom: 0;

    background-color: transparent;

    border: 2px solid transparent;

    border-radius: 8px;

    /* градиентная рамка */

    /* border-image: linear-gradient(90deg, #00f5ff 0%, #6b5aef 50%, #ff008e 100%) 1; */

    color: #333;
}

.modal__form .modal__input::placeholder {
    color: #999;
}

/* 6. Кнопка «Заказать» — плавный трёхцветный градиент */

.modal__form .modal__submit {
    width: 100%;

    padding: 14px 0;

    margin-top: 14px;

    border: none;

    border-radius: 15px;

    /* background-image: linear-gradient(90deg, #00f5ff 0%, #6b5aef 50%, #ff008e 100%) !important; */

    color: #fff;

    font-size: 18px;

    cursor: pointer;

    transition: opacity 0.25s;
}

.modal__form .modal__submit:hover {
    opacity: 0.9;
}

.instagram .modal__submit {
    background-image: radial-gradient(
        circle at center,

        rgba(61, 71, 217, 1) 0%,

        rgba(233, 124, 187, 1) 51%,

        rgba(249, 231, 187, 1) 100%
    ) !important;
}

.tiktok .modal__submit {
    background-image: radial-gradient(
        circle at center,

        rgba(231, 97, 189, 1) 0%,

        rgba(131, 245, 229, 1) 100%
    ) !important;
}

.telegram .modal__submit {
    background-color: #04abff !important;
}

.youtube .modal__submit {
    background-color: #fc2c2c !important;
}

.twitch .modal__submit {
    background-color: #9837ff !important;
}

.facebook .modal__submit {
    background-color: #3c5ffe !important;
}

.modal__info {
    text-align: center;

    margin: 20px 0;

    color: #0b0a0a;
}

@media (min-width: 1200px) {
    .package-card__label {
        font-size: 19px;

        color: #000;

        line-height: 21px;
    }
}

@media (max-width: 768px) {
    .package-card {
        border-radius: 20px;

        padding: 10px 0;

        max-width: 160px;
    }
}

#orderModal .t-input-subtitle,
#orderModal .modal__info-item p:last-child {
    text-align: left !important;
}

#orderModal .modal__info-item p:last-child {
    margin-top: 20px;
}

#orderModal .modal__form {
    gap: 0;
}

#orderModal .modal__input {
    border-radius: 40px;

    padding: 18px 16px;

    outline: none;
}

.instagram #orderModal .modal__input {
    border: 1px solid #eaade0;
}

.tiktok #orderModal .modal__input {
    border: 1px solid #83f5e5;
}

.telegram #orderModal .modal__input {
    border: 1px solid #04abff;
}

.youtube #orderModal .modal__input {
    border: 1px solid #fc2c2c;
}

.twitch #orderModal .modal__input {
    border: 1px solid #9837ff;
}

.facebook #orderModal .modal__input {
    border: 1px solid #3c5ffe;
}

.cont-order {
    /* position: relative; */

    top: 200px;

    /* left: 50%; */

    /* transform: translateX(-50%); */

    width: 100%;

    max-width: 560px;

    min-height: 300px;

    overflow-y: auto;

    background-color: white;

    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);

    padding: 36px 32px 32px 32px;

    box-sizing: border-box;

    /* font-family: "Georgia", serif; */

    /* top: 0; */

    /* bottom: 0; */

    margin: 65px auto;
}

.cont-order h1,
.cont-order h2,
.cont-order h3 {
    text-align: left;

    color: #333;

    margin-bottom: 18px;

    font-size: 24px;

    /* font-family: "Georgia", serif; */

    margin-top: 0;
}

.cont-order input,
.cont-order button {
    width: 100%;

    padding: 14px 16px;

    margin: 14px 0 22px 0;

    border: 1.5px solid #ccc;

    border-radius: 8px;

    font-size: 16px;

    box-sizing: border-box;
}

.cont-order button {
    background: linear-gradient(90deg, #00f5ff 0%, #6b5aef 50%, #ff008e 100%);

    color: white;

    border: none;

    cursor: pointer;

    font-weight: bold;

    font-size: 18px;

    margin-top: 10px;

    margin-bottom: 18px;

    border-radius: 30px;

    transition: opacity 0.2s;
}

.cont-order button:hover {
    opacity: 0.9;
}

.cont-order .modal__info {
    margin: 24px 0 0 0;

    font-size: 15px;

    color: #222;
}

@media (max-width: 700px) {
    .cont-order {
        max-width: 99vw;

        padding: 12px 2vw 18px 2vw;
    }
}

.cont-order .modal__close {
    position: absolute;

    top: 18px;

    right: 24px;

    background: none;

    border: none;

    font-size: 40px;

    color: #222 !important;

    cursor: pointer;

    padding: 10px;

    width: 40px;

    height: 40px;

    display: flex;

    align-items: center;

    justify-content: center;

    transition: color 0.2s;

    opacity: 0.7;

    line-height: 1;

    z-index: 10;
}

.cont-order .modal__close:hover {
    color: #ff0000 !important;

    opacity: 1;
}

.footer {
    background: #181818;

    padding: 0 40px;
}

@media (max-width: 768px) {
    .footer {
        padding: 40px 0 80px;
    }
}

.footer__container {
    max-width: 100%;

    margin: 0 auto;

    display: flex;

    align-items: center;

    justify-content: space-between;
}

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

.footer__center {
    flex: 1;

    text-align: center;
}

@media (max-width: 768px) {
    .footer__center {
        margin-top: 10px;
    }
}

.footer__link {
    color: #ff8562;

    font-weight: bold;

    font-size: 14px;

    text-decoration: none;

    transition: color 0.2s;

    /* font-family: "Georgia", serif; */
}

.footer__link:hover {
    color: #ff7a00;

    text-decoration: underline;
}

.footer__social {
    display: flex;

    gap: 10px;
}

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

.footer__icon-circle {
    display: flex;

    align-items: center;

    justify-content: center;

    background: #fff;

    border-radius: 50%;

    width: 38px;

    height: 38px;

    transition: box-shadow 0.2s;
}

.footer__icon-circle img {
    width: 22px;

    height: 22px;

    filter: invert(0);
}

.footer__icon-circle:hover {
    box-shadow: 0 0 0 2px #ffa34d;
}

.contact-item a,
.info-section a {
    color: #ff8562 !important;

    text-decoration: none;

    font-weight: 700;

    /* font-family: "Georgia", serif; */
}

.mobile-bar {
    position: fixed;

    left: 0;

    bottom: 0;

    display: none;

    flex-wrap: nowrap;

    justify-content: space-around;

    align-items: center;

    background-color: #fff;

    width: 100vw;
}

@media (max-width: 768px) {
    .mobile-bar {
        display: flex;
    }
}

.mobile-bar a {
    padding: 15px 10px 10px;
}

.mobile-bar img {
    width: 100%;

    max-width: 25px;
}

.form-text-rules {
    font-size: 15px;

    /* font-family: "Georgia", serif; */
}

.form-text-rules .footer__link {
    display: block;

    text-decoration: underline;
}

.packages-header {
    display: flex;

    flex-direction: column;

    align-items: center;
}

.packages-header * {
    /* font-family: "Georgia", serif; */
}

.packages-title {
    font-size: 34px;

    font-weight: 700;
}

@media (max-width: 992px) {
    .packages-title {
        font-size: 24px;
    }
}

.packages-subtitle {
    font-size: 34px;

    font-weight: 700;
}

@media (max-width: 992px) {
    .packages-subtitle {
        font-size: 22px;
        text-align: center;
    }
}

@media (max-width: 992px) {
    .packages-subtitle p {
        text-align: center;
    }
}

.packages-description {
    font-size: 22px;

    margin: 40px auto 0;

    max-width: 760px;

    text-align: center;
    font-weight: 500;
}

.packages-description strong {
    font-weight: 900;
}

@media (max-width: 992px) {
    .packages-description {
        font-size: 16px;

        margin: 20px auto 0;
    }
}

.packages-grid {
    margin-top: 20px;
}

/* home */

.template h2 {
    font-size: 50px;

    text-transform: initial;
}

@media (max-width: 768px) {
    .template h2 {
        font-size: 25px;
    }
}

.template .contacts {
    display: none;
}

.template {
    height: 100%;

    display: flex;

    flex-direction: column;
}

.templateTop {
    flex: 1 0 auto;
}

.template__btns {
    display: flex;

    justify-content: center;

    gap: 20px;
}

@media (max-width: 768px) {
    .template__btns {
        flex-direction: column;

        align-items: center;
    }
}

.template__btns a {
    margin: 0;

    max-width: 260px;

    width: 100%;

    text-align: center;
}

.template .footer {
    flex-shrink: 0;
}

.template__content {
    display: flex;

    align-items: center;

    justify-content: center;

    /* padding: 200px 20px; */

    padding: 100px 20px;

    /* gap: 170px; */

    gap: 12%;
}

@media (max-width: 1200px) {
    .template__content {
        gap: 70px;
    }
}

@media (max-width: 992px) {
    .template__content {
        flex-direction: column;

        padding: 150px 20px;

        gap: 30px;
    }
}

@media (max-width: 576px) {
    .template__content {
        padding: 100px 20px 50px;
    }
}

.template__left {
    display: flex;

    flex-direction: column;
}

@media (max-width: 992px) {
    .template__left {
        align-items: center;

        margin-bottom: 0 !important;
    }
}

.template__title {
    font-size: 35px !important;

    font-weight: 700;
}

@media (max-width: 576px) {
    .template__title {
        font-size: 24px !important;
    }
}

.template__text {
    font-size: 20px;

    margin: 40px 0 0;

    max-width: 375px;
}

@media (max-width: 992px) {
    .template__text {
        font-size: 16px;

        line-height: normal;

        text-align: center;

        margin: 0;
    }
}

.template__support {
    margin-top: 20px;

    text-align: center;
}

.template__support img {
    max-width: 80px;

    width: 100%;
}

@media (max-width: 992px) {
    .template__support img {
        max-width: 70px;
    }
}

.template__support img:hover {
    opacity: 0.8;
}

.template__to-home {
    margin: 40px auto 0;

    text-align: center;

    width: max-content;

    padding: 14px 42px;

    background-color: #40a0ff;

    text-transform: uppercase;

    color: #fff;

    font-weight: 700;

    font-size: 14px;

    border-radius: 30px;

    text-decoration: none;
}

.template__to-home:hover {
    background-color: #2c88e4;
}

.template__right {
    max-width: 436px;
}

@media (max-width: 992px) {
    .template__right {
        max-width: 436px;
    }
}

.template__right img {
    width: 100%;

    top: -60px;

    position: relative;

    right: -50px;
}

@media (max-width: 992px) {
    .template__right img {
        top: 0;

        right: 0;
    }
}

.d-block {
    display: block;
}

.custom-best-style {
    background: none !important;
}

.custom-best-style::after {
    display: none;
}

.custom-best-style .template__title,
.custom-best-style .template__text {
    color: #000;

    /* font-family: "Georgia", serif; */
}

.custom-best-style .template__title {
    font-weight: 900;
}

.mobile-categories {
    position: fixed;

    left: 0;

    bottom: 0;

    display: none;

    flex-wrap: nowrap;

    justify-content: flex-start;

    align-items: center;

    background-color: #fff;

    width: 100vw;

    gap: 10px;
}

@media (min-width: 768px) {
    .mobile-categories {
        display: none !important;
    }
}

.mobile-categories-list {
    display: flex;

    overflow: auto;

    justify-content: space-around;
    padding: 5px 0;
}

.mobile-categories-list::-webkit-scrollbar {
    height: 8px !important;

    background-color: #f5f5f5 !important;

    border-radius: 16px !important;
}

.mobile-categories-list::-webkit-scrollbar-thumb {
    background-color: #c3c3c3 !important;

    border-radius: 16px !important;

    cursor: grab !important;
}

.mobile-category {
    padding: 8px 10px;
}

.mobile-category-link {
    display: inline-flex;

    flex-direction: column;

    align-items: center;

    text-decoration: none;
}

.mobile-category-img {
    max-width: 26px;

    max-height: 21px;
    min-height: 21px;
    width: 100%;
    object-fit: contain;
    opacity: 0.9;
}

.mobile-category-name {
    font-size: 12px;

    color: #000;

    white-space: nowrap;
    display: flex;
    align-items: center;
    gap: 3px;
}

.package-card__smiles {
    font-size: 18px;
}

.package-card_heading {
    display: flex;
    align-items: center;
    justify-content: center;
    /* position: relative; */
    text-decoration: none !important;
}

.package-card__country {
    display: flex;
    position: absolute;
    right: 100%;
    top: 3px;
    text-decoration: none !important;
}
@media (max-width: 768px) {
    .package-card__country {
        top: 1px;
    }
}

.package-card__country img {
    width: 30px;
    margin-right: 5px;
    height: 25px;
    object-fit: contain;
}
@media (max-width: 768px) {
    .package-card__country img {
        width: 25px;
        height: 20px;
    }
}

.colored_pink {
    color: #ff145e;
}

/* .instagram [name="profile_name"] {
    display: none;
} */
.modal__total_bottom {
    margin: 30px 0 0;
}

@media (max-width: 768px) {
    .link-active_custom {
        position: absolute;
    }
}

.mobile-category-img-country {
    width: 15px;
}

/* .telegram #grid-0 .country_icon {
    display: none;
} */

/* Очередность мобильного меню */

/* --------------------------------INSTAGRAM------------------------------ */
/* последовательность нижнего меню на странице инстаграм рус. яз.*/
/* подписчики */
[lang="ru-RU"] .instagram .mobile-category:nth-child(1) {
    order: 1 !important;
}

/* лайки */
[lang="ru-RU"] .instagram .mobile-category:nth-child(2) {
    order: 2 !important;
}

/* комментарии */
[lang="ru-RU"] .instagram .mobile-category:nth-child(3) {
    order: 4 !important;
}

/* просмотры */
[lang="ru-RU"] .instagram .mobile-category:nth-child(4) {
    order: 5 !important;
}

/* охват и показы */
[lang="ru-RU"] .instagram .mobile-category:nth-child(5) {
    order: 7 !important;
}

/* сохранение */
[lang="ru-RU"] .instagram .mobile-category:nth-child(6) {
    order: 8 !important;
}

/* репосты */
[lang="ru-RU"] .instagram .mobile-category:nth-child(7) {
    order: 9 !important;
}

/* автолайки */
[lang="ru-RU"] .instagram .mobile-category:nth-child(8) {
    order: 3 !important;
}

/* автокомментарии */
[lang="ru-RU"] .instagram .mobile-category:nth-child(9) {
    order: 6 !important;
}

/* ua///////////////////////////////////// */
/* подписчики */
.instagram .mobile-category:nth-child(1) {
    order: 1;
}

/* лайки */
.instagram .mobile-category:nth-child(2) {
    order: 2;
}

/* комментарии */
.instagram .mobile-category:nth-child(3) {
    order: 4;
}

/* просмотры */
.instagram .mobile-category:nth-child(4) {
    order: 5;
}

/* охват и показы */
.instagram .mobile-category:nth-child(5) {
    order: 7;
}

/* сохранение */
.instagram .mobile-category:nth-child(6) {
    order: 8;
}

/* репосты */
.instagram .mobile-category:nth-child(7) {
    order: 9;
}

/* автокомментарии */
.instagram .mobile-category:nth-child(8) {
    order: 6;
}

/* автолайки */
.instagram .mobile-category:nth-child(9) {
    order: 3;
}

/* ------------------------TIKTOK------------------------ */
/* подписчики */
.tiktok .mobile-category:nth-child(1) {
    order: 1;
}

/* лайки */
.tiktok .mobile-category:nth-child(2) {
    order: 2;
}

/*  просмотры*/
.tiktok .mobile-category:nth-child(3) {
    order: 3;
}

/* сохранение */
.tiktok .mobile-category:nth-child(4) {
    order: 5;
}

/* репосты */
.tiktok .mobile-category:nth-child(5) {
    order: 6;
}

/* комментарии */
.tiktok .mobile-category:nth-child(6) {
    order: 4;
}

/* зрители прямой эфир */
.tiktok .mobile-category:nth-child(7) {
    order: 7;
}
/* ------------------------TELEGRAM------------------------ */
/* подписчики мир*/
.telegram .mobile-category:nth-child(1) {
    order: 2;
}

/* подписчики юа */
.telegram .mobile-category:nth-child(2) {
    order: 1;
}

/*  просмотры*/
.telegram .mobile-category:nth-child(3) {
    order: 5;
}

/* реакции на пост */
.telegram .mobile-category:nth-child(4) {
    order: 6;
}

/* активация бота */
.telegram .mobile-category:nth-child(5) {
    order: 7;
}

/* автопросмотрі */
.telegram .mobile-category:nth-child(6) {
    order: 3;
}

/* автореакции */
.telegram .mobile-category:nth-child(7) {
    order: 4;
}
/* ------------------------YOUTUBE------------------------ */
/* подписчики */
.youtube .mobile-category:nth-child(1) {
    order: 1;
}

/* лайки */
.youtube .mobile-category:nth-child(2) {
    order: 2;
}

/*  просмотры*/
.youtube .mobile-category:nth-child(3) {
    order: 3;
}

/* зрители прямой эфир */
.youtube .mobile-category:nth-child(4) {
    order: 4;
}

/* репосты */
.youtube .mobile-category:nth-child(5) {
    order: 5;
}

/* ------------------------TWITCH------------------------ */
.twitch .mobile-categories-list {
    justify-content: center;
}

/* ------------------------FACEBOOK------------------------ */
/* подписчики */
.facebook .mobile-category:nth-child(1) {
    order: 1;
}

/* лайки страницы */
.facebook .mobile-category:nth-child(2) {
    order: 2;
}

/*  лайки */
.facebook .mobile-category:nth-child(3) {
    order: 3;
}

/* просмотры */
.facebook .mobile-category:nth-child(4) {
    order: 4;
}

/* репосты */
.facebook .mobile-category:nth-child(5) {
    order: 5;
}

@media (max-width: 767px) {
    section.platform-section p {
        padding-left: 0;
        padding-right: 0;
    }

    h1.header__title {
        margin-top: 30px;
    }

    h1.header__title p,
    h1.header__title span {
        font-size: 30px;
    }

    .features {
        display: grid;
        grid-template-columns: 1fr 1fr; /* две равные колонки */
        gap: 40px;
    }

    section.info-section {
        padding-left: 0;
        padding-right: 0;
    }

    .steps .step {
        max-width: 75%;
        margin: auto;
    }
}

.mobile-categories-list {
    padding-right: 20px;
}

/*instagramm меню сортировка */

.instagram .mobile-categories-list .mobile-category {
    order: 999;
}

/* 1. Подписчики (#grid-0) */
.instagram .mobile-categories-list .mobile-category:has(> a[href="#grid-0"]) {
    order: 1;
}

/* 2. Лайки (#grid-1) */
.instagram .mobile-categories-list .mobile-category:has(> a[href="#grid-1"]) {
    order: 2;
}

/* 3. Автолайки (#grid-8) */
.instagram .mobile-categories-list .mobile-category:has(> a[href="#grid-8"]) {
    order: 3;
}

/* 4. Комментарии (#grid-2) */
.instagram .mobile-categories-list .mobile-category:has(> a[href="#grid-2"]) {
    order: 4;
}

/* 5. Просмотры (#grid-3) */
.instagram .mobile-categories-list .mobile-category:has(> a[href="#grid-3"]) {
    order: 5;
}

/* 6. Авто-Комментарии (#grid-7) */
.instagram .mobile-categories-list .mobile-category:has(> a[href="#grid-7"]) {
    order: 6;
}

/* 7. Охват и показы (#grid-4) */
.instagram .mobile-categories-list .mobile-category:has(> a[href="#grid-4"]) {
    order: 7;
}

/* 8. Сохранение (#grid-5) */
.instagram .mobile-categories-list .mobile-category:has(> a[href="#grid-5"]) {
    order: 8;
}

/* 9. Репосты (#grid-6) */
.instagram .mobile-categories-list .mobile-category:has(> a[href="#grid-6"]) {
    order: 9;
}
.mobile-categories {
    z-index: 11;
}

/* последовательность блоков на странице инстаграм укр. яз.*/
.instagram .packages-wrapper:nth-child(1) {
    order: 1;
}
.instagram .packages-wrapper:nth-child(2) {
    order: 2;
}
.instagram .packages-wrapper:nth-child(3) {
    order: 3;
}
.instagram .packages-wrapper:nth-child(4) {
    order: 4;
}
.instagram .packages-wrapper:nth-child(5) {
    order: 5;
}
.instagram .packages-wrapper:nth-child(6) {
    order: 6;
}
.instagram .packages-wrapper:nth-child(7) {
    order: 7;
}
.instagram .packages-wrapper:nth-child(8) {
    order: 9;
}
.instagram .packages-wrapper:nth-child(9) {
    order: 8;
}

/* для ру версии */
[lang="ru-RU"] .instagram .packages-wrapper:nth-child(8) {
    order: 8;
}
[lang="ru-RU"] .instagram .packages-wrapper:nth-child(9) {
    order: 9;
}
/* для ру версии */

.instagram .packages-wrapper:nth-child(10) {
    order: 10;
}

