@charset "UTF-8";

@font-face {
    font-family: 'password';
    font-style: normal;
    font-weight: 400;
    src: url(../fonts/password.ttf);
}

input[type="password"] {
    font-family: 'password', sans-serif;
}

* {
    padding: 0;
    margin: 0;
    border: 0
}

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

*::after, *::before {
    display: inline-block
}

body, html {
    height: 100%;
    min-width: 320px
}

body {
    color: #000;
    line-height: 1;
    font-family: "Exo 2", sans-serif;
    font-size: .875rem;
    -ms-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

button, input, textarea {
    font-family: "Exo 2", sans-serif;
    font-size: inherit;
    line-height: inherit;
    color: inherit;
    background-color: transparent
}

input, textarea {
    width: 100%
}

button, option, select {
    cursor: pointer
}

a {
    display: inline-block;
    color: inherit;
    text-decoration: none
}

ul li {
    list-style: none
}

img {
    vertical-align: top
}

h1, h2, h3, h4, h5, h6 {
    font-weight: inherit;
    font-size: inherit
}

body {
    background: #f7f7f9
}

.lock body {
    overflow: hidden;
    touch-action: none;
    -ms-scroll-chaining: none;
    overscroll-behavior: none
}

.wrapper {
    min-height: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden
}

@supports (overflow:clip) {
    .wrapper {
        overflow: clip
    }
}

.wrapper > main {
    flex: 1 1 auto
}

.wrapper > * {
    min-width: 0
}

[class*=__container] {
    max-width: 75rem;
    margin: 0 auto;
    padding: 0 .9375rem
}

.page__container {
    max-width: 80rem;

}

.my-project__container {
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1), 0 10px 20px rgba(0, 0, 0, 0.1);
    padding: 20px;
    margin-bottom: 50px;
    border-radius: 10px;
    min-height: 600px;
}

body::after {
    content: "";
    background-color: rgba(0, 0, 0, .5);
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    opacity: 0;
    transition: opacity .8s ease 0s;
    pointer-events: none;
    z-index: 149
}

.popup-show body::after {
    opacity: 1
}

.popup {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    padding: 30px 10px;
    transition: visibility .8s ease 0s;
    visibility: hidden;
    pointer-events: none
}

.popup_show {
    z-index: 150;
    visibility: visible;
    overflow: auto;
    pointer-events: auto
}

.popup_show .popup__content {
    visibility: visible;
    -webkit-transform: scale(1);
    transform: scale(1)
}

.popup__wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-height: 100%;
    flex: 1 1 auto;
    width: 100%;
    justify-content: center
}

.popup__content {
    visibility: hidden;
    -webkit-transform: scale(0);
    transform: scale(0);
    transition: -webkit-transform .3s ease 0s;
    transition: transform .3s ease 0s;
    transition: transform .3s ease 0s, -webkit-transform .3s ease 0s;
    background-color: #eee;
    width: 100%;
    max-width: 900px;
    border-radius: 20px
}

.lock .popup__content {
    visibility: visible
}

.auth {
    padding: 20px;
    max-width: 500px
}

.auth__approval {
    margin-left: 10px
}

.auth__approval label {
    font-size: 13px
}

.auth__approval a {
    color: #3483eb;
    text-decoration: underline
}

.auth__header {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0 0 10px 0;
    margin-left: 10px
}

.auth__close {
    position: absolute;
    top: 0;
    right: 10px;
    cursor: pointer
}

.auth__title {
    margin: 0;
    font-size: 36px;
    font-weight: 700
}

.auth__subtitle {
    margin: 0 0 20px 0;
    font-size: 16px;
    font-weight: 500;
    margin-left: 10px
}

.auth__link {
    font-size: 16px;
    font-weight: 500;
    color: #1a73e8
}

.auth__form {
    display: flex;
    flex-direction: column;
    margin-bottom: 10px
}

.auth__field {
    margin: 0 0 10px 0
}

.auth__input {
    width: 100%;
    color: #0d0a0a;
    font-size: 24px;
    font-weight: 500;
    border-radius: 12px;
    padding: .7rem 1rem;
    border: 2px solid transparent
}

.auth__input::-webkit-input-placeholder {
    color: #999
}

.auth__input:-ms-input-placeholder {
    color: #999
}

.auth__input::-ms-input-placeholder {
    color: #999
}

.auth__input::placeholder {
    color: #999
}

.auth__button {
    padding: 10px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    font-weight: 500;
    color: #fff;
    background-color: #1a73e8;
    height: 60px;
    margin: 20px 10px 20px 10px;
    transition: all .3s ease 0s
}

.auth__button_registr {
    margin-bottom: 40px
}

.auth__button:hover {
    background-color: #0d0a0a;
    scale: 1.01
}

.auth__button_telegram {
    padding: 10px;
    border-radius: 12px;
    height: 60px;
    background: #2ca5e0;
    border: 3px solid #2ca5e0;
    margin-right: 10px;
    margin-left: 10px
}

.auth__button_telegram span {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    font-weight: 500;
    color: #fff
}

.auth__button_telegram span:before {
    content: "";
    background: url(../img/icons/telegram.svg) no-repeat left center;
    width: 36px;
    height: 36px;
    display: inline-block;
    margin: 0 10px 0 0
}

.auth__button_telegram:hover {
    background-color: #0d0a0a;
    scale: 1.01;
    border: none
}

.auth__button_google {
    padding: 10px;
    border-radius: 12px;
    height: 60px;
    background: #3f66cf;
    border: 3px solid #3f66cf;
    margin-top: 10px;
    margin-right: 10px;
    margin-left: 10px
}

.auth__button_google span {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    font-weight: 500;
    color: #fff
}

.auth__button_google span:hover {
    color: #0d0a0a
}

.auth__button_google span:before {
    content: "";
    background: url(../img/icons/gmail.svg) no-repeat left center;
    width: 30px;
    height: 30px;
    display: inline-block;
    margin: 0 10px 0 0
}

.auth__button_google:hover {
    border: 3px dotted #3f66cf;
    color: #3f66cf;
    background: rgba(0, 0, 0, 0)
}

.spollers {
    display: grid;
    gap: 15px
}

.spollers__item {
    background: #fff
}

.spollers__title {
    width: 100%;
    padding: 36px 100px 36px 70px;
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 120%;
    color: #292929;
    position: relative;
    list-style: none
}

.spollers__title::-webkit-details-marker, .spollers__title::marker {
    display: none
}

._spoller-init .spollers__title {
    cursor: pointer
}

._spoller-init .spollers__title::after, ._spoller-init .spollers__title::before {
    content: "";
    width: 20px;
    height: 2px;
    background: #fff;
    position: absolute;
    right: 35px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    transition: all .3s ease 0s;
    z-index: 2
}

._spoller-init .spollers__title::after {
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg)
}

._spoller-init .spollers__title._spoller-active {
    border-radius: 16px 16px 0 0
}

._spoller-init .spollers__title._spoller-active::after {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg)
}

._spoller-init .spollers__title._spoller-active::before {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

.spoller-icon {
    position: absolute;
    right: 20px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    background: linear-gradient(243deg, #1dd1a5 0, #00a59c 100%);
    border-radius: 5px;
    width: 50px;
    height: 50px;
    z-index: 1
}

.spoller-icon._spoller-active {
    background: #000
}

.spollers__body {
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 120%;
    color: #292929;
    padding: 36px 100px 36px 70px;
    background: #fff
}


@media (max-width: 768px) {
    .spollers__title {
        padding: 30px 80px 30px 50px;
        font-size: 18px;
    }
    .spoller-icon{
        width: 40px;
        height: 40px;
    }
    ._spoller-init .spollers__title::after, ._spoller-init .spollers__title::before{
        width: 11px;
        height: 1px;
    }
}

.ibg {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.ibg--top {
    -o-object-position: top;
    object-position: top
}

.ibg--bottom {
    -o-object-position: bottom;
    object-position: bottom
}

.ibg--left {
    -o-object-position: left;
    object-position: left
}

.ibg--right {
    -o-object-position: right;
    object-position: right
}

.ibg--contain {
    -o-object-fit: contain;
    object-fit: contain
}


.header__container {
    position: relative
}

.dropdown {
    position: absolute;
    z-index: 10;
    background: #fff;
    padding: 25px 20px;
    color: #292929;
    right: 0;
    top: 100%;
    min-width: 200px;
    width: auto;
    opacity: 0;
    visibility: hidden;
    transition: opacity .3s ease-in-out, visibility .3s ease-in-out;
    border-radius: 15px;
    height: auto
}

.dropdown__list {
    display: flex;
    flex-direction: column;
    gap: 15px
}

.dropdown__item {
    font-family: "Exo 2", sans-serif;
    font-weight: 500;
    font-size: 16px;
    line-height: 120%
}

.dropdown__item:last-child {
    padding-bottom: 20px;
    margin-bottom: 20px;
    border-bottom: 1px solid #ebeaf0
}

.dropdown__link {
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 120%;
    color: #292929;
    display: flex;
    align-items: center
}

.dropdown__link_elem1:before {
    content: "";
    background: url(../img/dropdown/elem1.svg) no-repeat left center;
    display: inline-block;
    width: 18px;
    height: 15px;
    margin-right: 10px
}

.dropdown__link_elem2:before {
    content: "";
    background: url(../img/dropdown/elem2.svg) no-repeat left center;
    display: inline-block;
    width: 18px;
    height: 18px;
    margin-right: 10px
}

.dropdown__link_elem3:before {
    content: "";
    background: url(../img/dropdown/elem3.svg) no-repeat left center;
    display: inline-block;
    width: 18px;
    height: 15px;
    margin-right: 10px
}

.dropdown__link_elem4:before {
    content: "";
    background: url(../img/dropdown/elem4.svg) no-repeat left center;
    display: inline-block;
    width: 18px;
    height: 20px;
    margin-right: 10px
}

.dropdown__link_elem5:before {
    content: "";
    background: url(../img/dropdown/elem5.svg) no-repeat left center;
    display: inline-block;
    width: 18px;
    height: 18px;
    margin-right: 10px
}

.dropdown__link_elem6:before {
    content: "";
    background: url(../img/dropdown/elem6.svg) no-repeat left center;
    display: inline-block;
    width: 18px;
    height: 16px;
    margin-right: 10px
}

.dropdown__exit {
    display: flex;
    align-items: center;
    color: #292929
}

.dropdown__exit:before {
    content: "";
    background: url(../img/dropdown/exit.svg) no-repeat left center;
    display: inline-block;
    width: 18px;
    height: 19px;
    margin-right: 10px
}

.dropdown--active {
    opacity: 1;
    visibility: visible
}


/*.menu__logo {*/
/*    flex: 0 0 184px*/
/*}*/

.menu__body {
    /*flex: 1 1 auto*/
}

/*.menu__list {*/
/*    display: flex;*/
/*    align-items: center;*/
/*    justify-content: center;*/
/*    gap: 20px*/
/*}*/

.menu__link {
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 18px;
    line-height: 120%;
    color: #292929;
    cursor: pointer
}

.menu__actions-projects {
    display: flex;
    align-items: center;
    gap: 25px
}

.menu__actions-projects__img {
    position: relative;
    display: inline-block
}

.menu__actions-projects__img:hover {
    scale: 1.5
}

.menu__actions-projects__counter {
    position: absolute;
    top: -12px;
    right: -12px;
    background: linear-gradient(243deg, #1dd1a5 0, #00a59c 100%);
    color: #fff;
    border-radius: 50%;
    padding: 5px;
    min-width: 20px;
    height: 20px;
    text-align: center;
    line-height: 20px;
    box-shadow: 0 0 6px rgba(0, 0, 0, .3);
    font-size: 14px;
    display: flex;
    justify-content: center;
    align-items: center
}

.menu__actions-projects__btn {
    position: relative;
    background: linear-gradient(243deg, #1dd1a5 0, #00a59c 100%);
    color: #fff;
    border-radius: 100px;
    /* Адаптивный padding */
    padding: 15px 20px;
    /* Адаптивная минимальная ширина */
    min-width: 120px;
    /* Адаптивная высота */
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    /* Адаптивный размер шрифта */
    font-size: 14px;
    line-height: 120%;
    /* Предотвращаем переполнение текста */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.menu__actions-projects__btn-content {
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    /* Добавляем отступ для иконки на мобильных */
    gap: 8px;
}

.menu__actions-projects__btn-content::before {
    content: "";
    display: inline-block;
    /* Адаптивный размер иконки */
    width: 16px;
    height: 16px;
    background: url(../img/custom-btn.svg) no-repeat center/contain;
    /* Убираем фиксированный margin в пользу gap */
    flex-shrink: 0;
}

/* Эффект наведения остается тем же */
.menu__actions-projects__btn:hover::before {
    transform: scaleX(1);
}

.menu__actions-projects__btn::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    transform: scaleX(0);
    transform-origin: 0 50%;
    width: 100%;
    height: inherit;
    border-radius: inherit;
    background: #000;
    transition: all 475ms;
}

.menu__btn {
    position: relative;
    overflow: hidden;
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 120%;
    text-align: center;
    color: #292929;
    cursor: pointer
}

.menu__btn-content {
    position: relative;
    z-index: 1
}

/* Медиа-запрос для планшетов */
@media (min-width: 768px) {
    .menu__actions-projects__btn {
        padding: 18px 30px;
        min-width: 135px;
        height: 42px;
        font-size: 15px;
    }

    .menu__actions-projects__btn-content::before {
        width: 18px;
        height: 18px;
    }
}

/* Медиа-запрос для десктопов */
@media (min-width: 1024px) {
    .menu__actions-projects__btn {
        padding: 20px 40px;
        min-width: 150px;
        height: 45px;
        font-size: 16px;
    }

    .menu__actions-projects__btn-content::before {
        width: 20px;
        height: 20px;
    }
}

.menu__btn_big {
    color: #fff;
    border-radius: 35px;
    padding: 20px 40px;
    width: 163px;
    height: 60px;
    background: #292929
}

.menu__btn:hover::before {
    -webkit-transform: scaleX(1);
    transform: scaleX(1)
}

.menu__btn::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: 0 50%;
    transform-origin: 0 50%;
    width: 100%;
    height: inherit;
    border-radius: inherit;
    background: linear-gradient(243deg, #1dd1a5 0, #00a59c 100%);
    transition: all 475ms
}

.footer {
    background: #292929;
    min-height: 367px;
    padding: 27px 0 20px;
}

.footer__container {
    display: flex;
    gap: 166px;
    align-items: flex-start
}

.footer__content {
    align-self: center;
    display: flex;
    gap: 132px;
    padding-top: 31px
}

.footer__info {
    display: flex;
    flex-direction: column;
    gap: 10px
}

.footer__info_w138 {
    min-width: 138px
}

.footer__info_w173 {
    min-width: 173px
}

.footer__info__title {
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 20px;
    margin-bottom: 5px;
    cursor: pointer;
    color: #fff
}

.footer__info__text {
    font-family: "Exo 2", sans-serif;
    font-weight: 300;
    font-size: 16px;
    color: #fff;
    cursor: pointer
}

.footer__icons {
    display: flex;
    flex-wrap: wrap;
    gap: 66px 35px
}

.footer__icons img {
    max-width: 100px
}

.promo {
    margin-top: 37px;
    margin-bottom: 90px
}

.promo__container {
    display: flex;
    align-items: center;
    gap: 15px
}

.promo__body {
    display: flex;
    flex-direction: column
}

.promo__title {
    font-family: "Russo One", sans-serif;
    font-weight: 400;
    font-size: 52px;
    line-height: 120%;
    color: #292929;
    margin-bottom: 36px;
    max-width: 575px
}

.promo__btn {
    max-width: 233px;
    position: relative;
    height: 64px;
    background: linear-gradient(243deg, #1dd1a5 0, #00a59c 100%);
    border-radius: 100px;
    padding: 20px 40px;
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 120%;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 64px
}

.promo__btn:hover::before {
    -webkit-transform: scaleX(1);
    transform: scaleX(1)
}

.promo__btn-content {
    position: relative;
    z-index: 1
}

.promo__btn::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: 0 50%;
    transform-origin: 0 50%;
    width: 100%;
    height: inherit;
    border-radius: inherit;
    background: #292929;
    transition: all 475ms
}

.promo__list {
    display: flex;
    gap: 58px
}

.promo__img {
    max-width: 581px;
    aspect-ratio: 581/544;
    flex-shrink: 0
}

.promo__img img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.item-promo_ml {
    margin-left: 23px
}

.item-promo__number {
    font-family: "Russo One", sans-serif;
    font-weight: 400;
    font-size: 50px;
    line-height: 120%;
    letter-spacing: .05em;
    color: #292929
}

.item-promo__text {
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 105%;
    color: #292929
}

@media (max-width: 991.98px) {
    .promo {
        margin-top: 30px;
        margin-bottom: 60px;
    }

    .promo__container {
        flex-direction: column;
        gap: 30px;
    }

    .promo__title {
        font-size: 42px;
        margin-bottom: 24px;
        max-width: 100%;
        text-align: center;
    }

    .promo__btn {
        margin: 0 auto 40px;
    }

    .promo__list {
        gap: 30px;
        justify-content: center;
        flex-wrap: wrap;
    }

    .promo__img {
        max-width: 400px;
        margin: 0 auto;
    }

    .item-promo_ml {
        margin-left: 0;
    }
}

@media (max-width: 575.98px) {
    .promo {
        margin-top: 20px;
        margin-bottom: 40px;
    }

    .promo__title {
        font-size: 32px;
        margin-bottom: 20px;
    }

    .promo__btn {
        max-width: 100%;
        height: 56px;
        padding: 16px 32px;
        font-size: 18px;
        margin-bottom: 30px;
    }

    .promo__list {
        flex-direction: column;
        gap: 24px;
    }

    .item-promo__number {
        font-size: 40px;
    }

    .item-promo__text {
        font-size: 16px;
    }

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

/**/

.advertising-order {
    margin-top: 200px;
    margin-bottom: 120px
}

.advertising-order__container {
    max-width: 1046px;
    margin: 0 auto
}

.advertising-order__container_packages {
    max-width: 1170px
}

.advertising-order__title {
    font-family: "Russo One", sans-serif;
    font-weight: 400;
    font-size: 54px;
    line-height: 120%;
    color: #292929;
    text-align: center;
    margin-bottom: 60px
}

.advertising-order__list {
    display: flex;
    gap: 30px;
    justify-content: center;
    align-items: flex-start
}

.advertising-order__textblock {
    margin-top: 120px;
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 120%;
    color: #292929;
    width: 100%
}

.advertising-order__decor {
    padding-top: 35px
}

.advertising-order__wrapper {
    height: 127px
}

.advertising-order__item {
    display: flex;
    gap: 12px
}

.advertising-order__number {
    font-family: "Russo One", sans-serif;
    font-weight: 400;
    font-size: 70px;
    color: #fff;
    -webkit-text-stroke: 2px #000;
    text-stroke: 1px #000
}

.advertising-order__text {
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 105%;
    color: #292929
}

.advertising-order {
    margin: 120px auto;
    padding: 0 20px;
    max-width: 1046px;
}

.advertising-order__list {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
}

@media (max-width: 991.98px) {
    .advertising-order {
        margin: 80px auto;
    }

    .advertising-order__list {
        grid-template-columns: repeat(2, 1fr);
    }

    .advertising-order__title {
        font-size: 42px;
        margin-bottom: 40px;
    }
}

@media (max-width: 575.98px) {
    .advertising-order {
        margin: 60px auto;
    }

    .advertising-order__list {
        grid-template-columns: 1fr;
        max-width: 280px;
        margin: 0 auto;
    }

    .advertising-order__item {
        position: relative;
        padding-left: 60px;
        min-height: 80px;
    }

    .advertising-order__wrapper {
        height: auto;
    }

    .advertising-order__number {
        position: absolute;
        left: 0;
        top: 0;
        width: 45px;
        height: 45px;
        font-size: 28px;
        background: linear-gradient(243deg, #1dd1a5 0, #00a59c 100%);
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        -webkit-text-stroke: 1px #fff;
    }

    .advertising-order__text {
        padding-top: 12px;
        font-size: 18px;
        text-align: left;
    }

    .advertising-order__decor {
        display: none;
    }

    .advertising-order__item:not(:last-child)::after {
        content: '';
        position: absolute;
        left: 22px;
        top: 45px;
        width: 2px;
        height: 40px;
        background: #e5e7eb;
    }
}

/**/

.service-packages {
    background-image: linear-gradient(to bottom, #000 526px, #f7f7f9 526px);
    min-height: 926px;
    margin-bottom: clamp(40px, 8vw, 100px);

}

.service-packages_packages {
    background: #f7f7f9
}

.service-packages__title {
    padding-top: 40px;
    margin-bottom: 60px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    text-align: center
}

.service-packages__title-text {
    font-family: "Russo One", sans-serif;
    font-weight: 400;
    font-size: 54px;
    line-height: 120%;
    text-align: center;
    color: #fff
}

.service-packages__title-text_packages {
    color: #000
}

.swiper-button-actions {
    display: flex;
    gap: 30px;
    cursor: pointer;
    margin-left: 212px
}

.swiper-button-prev {
    border-radius: 100%;
    stroke-width: 2px;
    stroke: #fff;
    border: 2px solid #fff;
    width: 70px;
    height: 70px;
    display: flex;
    justify-content: center;
    align-items: center
}

.swiper-button-prev_packages {
    border: 2px solid #000
}

.swiper-button-next {
    border-radius: 100%;
    background: #fff;
    border: 2px solid #fff;
    width: 70px;
    height: 70px;
    display: flex;
    justify-content: center;
    align-items: center
}

.swiper-button-next_packages {
    background: #292929;
    border: 2px solid #292929
}

.swiper {
    overflow: hidden
}

.swiper-wrapper {
    display: flex;
    align-items: stretch
}

.item-packages {
    background: #fff;
    display: flex;
    flex-direction: column;
    border-radius: 20px;
    width: 370px;
    padding: 28px 0 53px;
    flex: 1;
    height: 100%
}

.item-packages__title {
    font-family: "Russo One", sans-serif;
    font-weight: 400;
    font-size: 32px;
    line-height: 120%;
    color: #292929;
    text-align: center;
    margin-bottom: 22px;
    padding-right: 30px;
    padding-left: 30px;

}

.item-packages__price {
    background: linear-gradient(243deg, #1dd1a5 0, #00a59c 100%);
    height: 89px;
    margin-bottom: 10px;
    font-family: "Russo One", sans-serif;
    font-weight: 400;
    font-size: 28px;
    line-height: 120%;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center
}

.item-packages__price.item-packages__price-small {
    font-size: 24px;
    text-align: center;

}

.item-packages__text {
    padding-right: 30px;
    padding-left: 30px;
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 120%;
    color: #292929;
    margin-bottom: 24px
}

.item-packages__list {
    padding-right: 29px;
    padding-left: 29px;
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin-bottom: 45px
}

.item-packages__item {
    font-weight: 400;
    font-size: 16px;
    line-height: 1.2;
    color: #292929;
    display: flex;
    -webkit-column-gap: 20px;
    -moz-column-gap: 20px;
    column-gap: 20px;
    justify-content: flex-start;
    align-items: center
}

.item-packages__item::before {
    content: "";
    background: linear-gradient(243deg, #1dd1a5 0, #00a59c 100%);
    border-radius: 20px;
    min-width: 20px;
    height: 20px
}

.item-packages__item_square.item-packages__item::before {
    content: "";
    background: #292929;
    width: 20px;
    height: 20px;
    border-radius: 0
}

.item-packages__btn {
    margin-top: auto;
    border-radius: 35px;
    width: 310px;
    height: 60px;
    margin-left: auto;
    margin-right: auto;
    background: #292929;
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 120%;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative
}

.item-packages__btn_order {
    width: 237px;
    margin-top: unset;
    margin-bottom: 58px
}

.item-packages__btn_my-finances {
    width: 222px;
    margin-left: unset;
    margin-right: unset
}

.item-packages__btn_new-templates {
    width: 178px;
    padding: 20px 40px;
    margin-left: unset;
    margin-right: unset
}

.item-packages__btn:hover::before {
    -webkit-transform: scaleX(1);
    transform: scaleX(1)
}

.item-packages__btn-content {
    position: relative;
    z-index: 1
}

.item-packages__btn::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: 0 50%;
    transform-origin: 0 50%;
    width: 100%;
    height: inherit;
    border-radius: inherit;
    background: linear-gradient(243deg, #1dd1a5 0, #00a59c 100%);
    transition: all 475ms
}


@media (max-width: 1200px) {
    .service-packages__title {
        padding: 30px 20px;
        flex-direction: column;
        gap: 20px;
    }

    .swiper-button-actions {
        margin-left: 0;
    }

    .service-packages__container {
        padding: 0 20px;
    }

    .item-packages {
        width: 330px;
    }
}

@media (max-width: 768px) {
    .service-packages {
        background-image: linear-gradient(to bottom, #000 400px, #f7f7f9 400px);
        min-height: auto;
        margin-bottom: 60px;
    }

    .service-packages__title-text {
        font-size: 36px;
    }

    .swiper-button-prev,
    .swiper-button-next {
        width: 50px;
        height: 50px;
    }

    .swiper-button-prev svg,
    .swiper-button-next svg {
        width: 20px;
        height: 14px;
    }

    .item-packages {
        width: 320px;
        padding: 20px 0 40px;
    }

    .item-packages__title {
        font-size: 26px;
        margin-bottom: 15px;
    }

    .item-packages__btn {
        width: 260px;
        height: 50px;
        font-size: 18px;
    }
}

@media (max-width: 480px) {
    .service-packages {
        background-image: linear-gradient(to bottom, #000 300px, #f7f7f9 300px);
    }

    .service-packages__title-text {
        font-size: 28px;
    }

    .item-packages {
        /*width: 100%;*/
    }

    .swiper-button-actions {
        gap: 15px;
    }

    .service-packages__title {
        margin-bottom: 0px;
    }
}


/**/

.reviews {
    margin-bottom: clamp(40px, 8vw, 100px);
    padding: 0 20px;
}


.reviews__title-text {
    font-family: "Russo One", sans-serif;
    font-weight: 400;
    font-size: clamp(32px, 5vw, 54px);
    line-height: 120%;
    color: #292929
}

.reviews__slider {
    overflow: hidden
}

.swiper-button-actions {
    margin-left: 295px
}

.swiper-button-prev-reviews {
    border-radius: 100%;
    background: #f7f7f9;
    border: 2px solid #292929;
    width: 70px;
    height: 70px;
    display: flex;
    justify-content: center;
    align-items: center
}

.swiper-button-next-reviews {
    border-radius: 100%;
    stroke-width: 2px;
    background: #292929;
    border: 2px solid #292929;
    width: 70px;
    height: 70px;
    display: flex;
    justify-content: center;
    align-items: center
}

.item-reviews {
    background: #ebeaf0;
    border-radius: 20px;
    width: 460px;
    min-height: 286px;
    height: 100%;
    padding: 69px 38px
}

.item-reviews__person {
    display: flex;
    gap: 20px;
    align-items: center;
    margin-bottom: 30px
}

.item-reviews__img {
    border-radius: 100%;
    width: 60px;
    height: 60px;
    background: #292929
}

.item-reviews__name {
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 120%;
    text-transform: capitalize;
    color: #292929
}

.item-reviews__text {
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 120%;
    color: #292929
}

@media (max-width: 768px) {
    .swiper-button-actions {
        margin-left: 0;
    }

    .reviews__container {
        padding: 0;
    }

    .item-reviews {
        width: 360px;
    }

    .swiper-button-actions {
        display: flex;
        gap: 15px;
        margin-left: 0; /* Remove default margin */
    }

    .swiper-button-prev-reviews,
    .swiper-button-next-reviews {
        border-radius: 100%;
        width: 50px; /* Smaller default size */
        height: 50px;
        display: flex;
        justify-content: center;
        align-items: center;
        transition: background-color 0.3s ease;
    }

}


/**/
/* Основной контейнер */
.advantages {
    margin: clamp(40px, 8vw, 120px) 0;
    padding: 0 20px;
}

.advantages__container {
    max-width: 1200px;
    margin: 0 auto;
}

/* Заголовок */
.advantages__title {
    font-family: "Russo One", sans-serif;
    font-weight: 400;
    font-size: clamp(28px, 5vw, 54px);
    line-height: 1.2;
    text-align: center;
    color: #292929;
    margin-bottom: clamp(30px, 5vw, 60px);
}

/* Основной контент */
.advantages__body {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: clamp(20px, 3vw, 30px);
}

/* Левая колонка */
.advantages__left {
    background: #ebeaf0;
    border-radius: 15px;
    padding: clamp(20px, 4vw, 60px) clamp(20px, 5vw, 70px);
    height: 100%;
}

/* Правая колонка */
.advantages__right {
    background: #292929;
    border-radius: 15px;
    padding: clamp(20px, 4vw, 60px) clamp(20px, 5vw, 70px);
    display: flex;
    flex-direction: column;
    height: 100%;
}

/* Общие стили для элементов списка */
.advantages__left-item,
.advantages__right-item {
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: clamp(16px, 2vw, 20px);
    line-height: 1.4;
    margin-bottom: 20px;
    padding-left: 30px;
    position: relative;
}

/* Маркеры списка */
.advantages__left-item::before,
.advantages__right-item::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 20px;
    height: 20px;
    background-size: contain;
    background-repeat: no-repeat;

}

.advantages__left-item::before {
}

.advantages__right-item::before {
}

.advantages__left-item {
    color: #292929;
}

.advantages__right-item {
    color: #fff;
}

/* Кнопка */
.advantages__btn {
    margin-top: auto;
    align-self: center;
    position: relative;
    border-radius: 100px;
    background: #fff;
    padding: clamp(12px, 2vw, 14px) clamp(25px, 4vw, 40px);
    min-height: 50px;
    font-family: "Exo 2", sans-serif;
    font-size: clamp(16px, 2vw, 20px);
    color: #292929;
    text-decoration: none;
    overflow: hidden;
    transition: color 0.3s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.advantages__btn::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(243deg, #1dd1a5 0%, #00a59c 100%);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.475s ease;
    z-index: 1;
}

.advantages__btn:hover::before {
    transform: scaleX(1);
}

.advantages__btn-content {
    position: relative;
    z-index: 2;
}

.advantages__btn:hover .advantages__btn-content {
    color: #fff;
}

/* Медиа-запросы для улучшения отзывчивости */
@media (max-width: 768px) {
    .advantages__body {
        grid-template-columns: 1fr;
    }

    .advantages__left,
    .advantages__right {
        padding: 30px 25px;
    }
}

@media (max-width: 480px) {
    .advantages__title {
        font-size: 24px;
        margin-bottom: 25px;
    }

    .advantages__left-item,
    .advantages__right-item {
        font-size: 16px;
        padding-left: 25px;
    }

    .advantages__btn {
        width: 100%;
        max-width: 280px;
    }
}


/**/
.about {
    background: linear-gradient(243deg, #1dd1a5 0, #00a59c 100%);
    min-height: 565px;
    margin-bottom: 80px
}

.about__container {
    display: flex;
    gap: 41px
}

.about__title {
    font-family: "Russo One", sans-serif;
    font-weight: 400;
    font-size: 54px;
    line-height: 120%;
    color: #fff;
    align-self: end;
    margin-bottom: 60px
}

.about__text {
    max-width: 570px;
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 120%;
    color: #fff;
    margin-bottom: 35px
}

.about__btn {
    position: relative;
    margin-top: auto;
    margin-bottom: 100px;
    background: #292929;
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 120%;
    color: #fff;
    padding: 17px 40px;
    border-radius: 100px;
    cursor: pointer;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    align-self: flex-start;
    height: 60px;
    transition: color .3s ease
}

.about__btn:hover::before {
    -webkit-transform: scaleX(1);
    transform: scaleX(1)
}

.about__btn-content {
    position: relative;
    z-index: 1
}

.about__btn:hover {
    color: #292929
}

.about__btn::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: 0 50%;
    transform-origin: 0 50%;
    width: 100%;
    height: inherit;
    border-radius: inherit;
    background: #fff;
    transition: all 475ms
}

.about-left {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    padding-top: 52px;
    flex-basis: 705px
}

.about-right {
    flex: auto
}

.about-img {
    margin-right: -150px;
    aspect-ratio: 1/1;
    max-height: 559px
}

.about-img img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

@media (max-width: 1024px) {
    .about {
        min-height: auto;
        margin-bottom: 60px;
    }

    .about__container {
        flex-direction: column;
        gap: 30px;
        padding: 40px 20px;
    }

    .about-left {
        flex-basis: auto;
        padding-top: 30px;
    }

    .about__title {
        font-size: 42px;
        margin-bottom: 40px;
        align-self: flex-start;
    }

    .about__text {
        font-size: 18px;
        margin-bottom: 30px;
    }

    .about__btn {
        margin-bottom: 40px;
        font-size: 18px;
        height: 56px;
        padding: 15px 35px;
    }

    .about-right {
        flex: none;
    }

    .about-img {
        margin-right: 0;
        max-height: 400px;
    }
}

/* Адаптив для мобильных */
@media (max-width: 768px) {
    .about {
        margin-bottom: 40px;
    }

    .about__container {
        padding: 30px 16px;
        gap: 24px;
    }

    .about-left {
        padding-top: 20px;
    }

    .about__title {
        font-size: 32px;
        margin-bottom: 30px;
        text-align: center;
        align-self: center;
    }

    .about__text {
        font-size: 16px;
        margin-bottom: 24px;
        max-width: 100%;
        text-align: center;
    }

    .about__btn {
        margin-bottom: 30px;
        font-size: 16px;
        height: 50px;
        padding: 12px 30px;
        width: 100%;
        max-width: 280px;
        align-self: center;
    }

    /* Скрываем правую колонку с картинкой на мобильных */
    .about-right {
        display: none;
    }
}

/**/

.faq {
    margin-bottom: 120px
}

.faq__title {
    font-family: "Russo One", sans-serif;
    font-weight: 400;
    font-size: 54px;
    line-height: 120%;
    text-align: center;
    color: #292929;
    margin-bottom: 60px
}


/**/
.breadcrumbs__container {
    margin-bottom: 40px;
}

.breadcrumbs {
    margin-bottom: 30px;
    margin-top: 25px
}

.breadcrumbs-list {
    display: flex;
    gap: 12px;
    align-items: center
}

.breadcrumb-item {
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 120%;
    color: #c2c2c2
}

.breadcrumb-item_active {
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 120%;
    color: #292929
}

.page-title {
    margin-bottom: clamp(30px, 5vw, 60px);
    font-family: "Russo One", sans-serif;
    font-weight: 400;
    font-size: clamp(28px, 5vw, 54px);
    line-height: 120%;
    color: #292929;
    text-align: center;
}

/* Планшеты */
@media (max-width: 1024px) {
    .page-title {
        margin-bottom: 40px;
    }
}

/* Мобильные устройства */
@media (max-width: 768px) {
    .page-title {
        margin-bottom: 30px;
        word-wrap: break-word;
        hyphens: auto;
    }
}

.catalog {
    display: grid;
    grid-template-columns: 280px auto;
    gap: 30px;
    margin-bottom: 120px;
}

.catalog__items {
    display: grid;
    grid-template-columns: repeat(3, 200px);
    gap: 30px;
}

.catalog__items__item {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 170px;
    background: #fff;
    border-radius: 15px;
    justify-content: center;
    align-items: center;
    gap: 7px;
}

.catalog__items__item:last-child {
    grid-column: 3;
}

.catalog__item-page {
    display: flex;
    flex-direction: column;
    gap: 20px;
    max-width: 970px;
    margin: 0 auto 120px;
}

.catalog__body {
    display: flex;
    flex-direction: column;
    gap: 20px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1), 0 10px 20px rgba(0, 0, 0, 0.1);
    padding: 10px;
}

.catalog__filter {
    background: #fff;
    border-radius: 15px;
    height: 80px;
    padding: 23px 26px 30px 22px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.catalog__list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(290px, 1fr));
    column-gap: 20px;
    row-gap: 50px;
}

.catalog__list__item-page {
    display: flex;
    gap: 30px;
}

.catalog__item {
    background: #fff;
    border-radius: 15px;
    padding: 20px 16px 16px;
    display: flex;
    flex-direction: column;
}

.catalog__item__item-page {
    width: 370px;
    padding: 33px 32px 38px 30px;
}

.catalog__item-header {
    display: flex;
    gap: 22px;
    align-items: flex-start;
    margin-bottom: 20px;
}

/* Планшеты */
@media (max-width: 1024px) {
    .catalog {
        grid-template-columns: 1fr;
        gap: 20px;
        margin-bottom: 60px;
    }

    .catalog__items {
        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
        gap: 20px;
    }

    .catalog__items__item:last-child {
        grid-column: auto;
    }

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

    .catalog__list__item-page {
        flex-direction: column;
    }

    .catalog__item__item-page {
        width: 100%;
        padding: 20px;
    }
}

/* Мобильные устройства */
@media (max-width: 768px) {
    .catalog {
        margin-bottom: 40px;
    }

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

    .catalog__filter {
        height: auto;
        padding: 15px;
        flex-direction: column;
        gap: 10px;
    }

    .catalog__list {
        grid-template-columns: 1fr;
        row-gap: 30px;
    }

    .catalog__item-header {
        flex-direction: column;
        gap: 15px;
    }

    .catalog__item-page {
        margin-bottom: 60px;
    }
}

/* Малые мобильные устройства */
@media (max-width: 480px) {
    .catalog__body {
        padding: 5px;
    }

    .catalog__item {
        padding: 15px 12px;
    }
}


.catalog__item-logo {
    border-radius: 100%;
    background: linear-gradient(180deg, #0a30b8 0, #7d93e3 100%);
    width: 85px;
    height: 85px
}

.catalog__item-logo-F089F9 {
    background: linear-gradient(180deg, #a106af 0, #f089f9 100%)
}

.catalog__item-logo-1674a8 {
    background: linear-gradient(180deg, #6acfcf 0, #1674a8 100%)
}

.catalog__item-logo-ebd14c {
    background: linear-gradient(180deg, #ebd14c 0, #bb9d00 100%)
}

.catalog__item-logo-f4caa3 {
    background: linear-gradient(180deg, #e14a1a 0, #f4caa3 100%)
}

.catalog__item-logo-8f0720 {
    background: linear-gradient(180deg, #e1284a 0, #8f0720 100%)
}

.catalog__item-logo_06af9e {
    background: #06af9e
}

.catalog__item-textblock {
    max-width: 131px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 6px
}

.catalog__item-textblock__item-page {
    max-width: 170px
}

.catalog__item-name {
    font-family: "Russo One", sans-serif;
    font-weight: 400;
    font-size: 14px;
    color: #000
}

.catalog__item-descr {
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 12px;
    color: #000;
    max-height: 55px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical
}

.catalog__item-link {
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 14px;
    color: #06af9e
}

.catalog__item-body {
    display: flex;
    flex-direction: column
}

.catalog__item-info {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 9px;
    margin-bottom: 12px
}

.catalog__item-info__big {
    display: flex;
    gap: 11px;
    flex: 1 1 100%;
    align-items: center;
    border: 1px solid #ebeaf0;
    border-radius: 5px;
    padding: 25px 33px;
    min-height: 53px
}

.catalog__item-info__bigblock {
    display: flex;
    flex-direction: column;
    gap: 5px
}

.catalog__item-info__bigblock_img {
    margin-top: 20px
}

.catalog__item-info-item {
    flex: 0 1 113px;
    max-width: 113px;
    display: flex;
    flex-direction: column;
    border: 1px solid #ebeaf0;
    border-radius: 5px;
    padding: 8px 7px 6px 6px;
    height: 53px;
    gap: 5px;
    align-items: center
}

.catalog__item-info-title {
    font-family: "Russo One", sans-serif;
    font-weight: 400;
    font-size: 14px;
    text-align: center;
    color: #000
}

.catalog__item-info-title_page {
    cursor: pointer;
    position: relative
}

.catalog__item-info-title_page::before {
    content: attr(data-before);
    position: absolute;
    top: -50px;
    left: 50%;
    -webkit-transform: translateX(-50%) scaleY(0);
    transform: translateX(-50%) scaleY(0);
    background-color: #06af9e;
    padding: 13px 20px;
    max-width: auto;
    border-radius: 5px;
    white-space: nowrap;
    opacity: 0;
    height: 43px;
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 14px;
    text-align: center;
    display: flex;
    align-items: center;
    color: #fff
}

.catalog__item-info-title_page::after {
    content: "";
    position: absolute;
    top: -10px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    border-style: solid;
    border-width: 10px 10px 0 10px;
    border-color: #06af9e transparent transparent transparent;
    opacity: 0;
    transition: -webkit-transform .3s ease-in-out;
    transition: transform .3s ease-in-out;
    transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out
}

.catalog__item-info-title_page:hover::after, .catalog__item-info-title_page:hover::before {
    -webkit-transform: translateX(-50%) scaleY(1);
    transform: translateX(-50%) scaleY(1);
    opacity: 1
}

.catalog__item-info-value {
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 14px;
    text-align: center;
    color: #000
}

.catalog__item-info-value_page {
    font-size: 16px
}

.catalog__item-footer {
    margin-top: auto
}

.catalog__item-footer__item-page {
    margin-bottom: 13px;
    font-family: "Russo One", sans-serif;
    font-weight: 400;
    font-size: 14px;
    color: #000;
    padding-left: 35px
}

.catalog__item-price {
    display: flex;
    margin-bottom: 33px;
    justify-content: space-between;
    align-items: center
}

.catalog__item-price__item__page {
    margin-bottom: 45px;
    justify-content: space-between;
}

.catalog__item-price-select {
    min-height: 27px;
    border: 2px solid #000;
    border-radius: 5px;
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 14px;
    text-align: center;
    color: #000;
    padding: 5px 16px 5px 16px
}

.catalog__item-price-value {
    font-family: "Russo One", sans-serif;
    font-weight: 400;
    font-size: 18px;
    text-align: center;
    color: #000
}

.catalog__item-button {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 100px;
    width: 100%;
    height: 60px;
    padding: 10px 40px;
    background: linear-gradient(243deg, #1dd1a5 0, #00a59c 100%);
    cursor: pointer;
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 20px;
    color: #fff
}

.catalog__item-button-red {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 100px;
    width: 100%;
    height: 60px;
    padding: 10px 40px;
    background: linear-gradient(to right, #ff0000, #ff5e3a);
    cursor: pointer;
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 20px;
    color: #fff
}

.catalog__item-button-red::before {
    -webkit-transform: scaleX(1);
    transform: scaleX(1)
}

.catalog__item-button-red:hover {
    -webkit-transform: scaleX(1);
    transform: scaleX(1)
}

.catalog__item-button-red::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: 0 50%;
    transform-origin: 0 50%;
    width: 100%;
    height: inherit;
    border-radius: inherit;
    background: #292929;
    transition: all 475ms
}


.catalog__item-button:hover::before {
    -webkit-transform: scaleX(1);
    transform: scaleX(1)
}

.catalog__item-button-content-red {
    position: relative;
    z-index: 1
}

.catalog__item-button-content {
    position: relative;
    z-index: 1
}

.catalog__item-button::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: 0 50%;
    transform-origin: 0 50%;
    width: 100%;
    height: inherit;
    border-radius: inherit;
    background: #292929;
    transition: all 475ms
}

.catalog__item-button-text-red {
    color: #fff;
    display: flex;
    align-items: center;
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 20px;
    color: #fff
}

.catalog__item-button-text {
    color: #fff;
    display: flex;
    align-items: center;
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 20px;
    color: #fff
}

.catalog__item-button-text-red::before {
    content: "";
    display: inline-block;
    width: 20px;
    height: 20px;
    background: url(../img/button-icon.svg) no-repeat 0 0;
    margin-right: 10px
}

.catalog__item-button-text::before {
    content: "";
    display: inline-block;
    width: 20px;
    height: 20px;
    background: url(../img/button-icon.svg) no-repeat 0 0;
    margin-right: 10px
}

.total-channels {
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 16px;
    text-align: center;
    color: #000
}

.filter-options {
    display: flex;
    gap: 20px;
    align-items: center
}

.filter-options select {
    -webkit-appearance: none;
    appearance: none;
    background: url(../img/custom-arrow.svg) no-repeat right 15px center;
    padding-right: 35px
}

.rating-select {
    width: 156px;
    padding: 8px 13px;
    border: 1px solid #000;
    border-radius: 5px;
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 16px;
    color: #000
}

.filter-button {
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 5px;
    width: 35px;
    height: 35px;
    background: #06af9e;
    cursor: pointer
}

.catalog-sidebar {
    min-height: 500px;
    height: fit-content;
    border-radius: 14px;
    background: #fff;
    padding: 30px 26px 51px 22px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1), 0 10px 20px rgba(0, 0, 0, 0.1);

}

.catalog-form {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 20px;
    height: 100%
}

.form-group label {
    display: block;
    margin-bottom: 8px;
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 16px;
    color: #000
}

.form-group__range-group {
    display: flex;
    justify-content: space-between;
    width: 100%;
    gap: 20px
}

.form-group input[type=text] {
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 5px
}

.form-group select {
    min-height: 45px;
    padding: 12px;
    border: 1px solid #ccc;
    border-radius: 5px;
    -webkit-appearance: none;
    appearance: none;
    background: url(../img/custom-arrow.svg) no-repeat right 15px center;
    padding-right: 35px
}

.form-group input[type=text], .form-group select {
    width: 100%;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 5px;
    min-height: 45px
}

.promo__btn.form-btn {
    padding: 10px 40px;
    height: 60px;
    margin: 0 auto;
    width: 222px;
    margin-top: 24px;
    margin-bottom: 10px
}

.menu__btn.menu__btn_big.reset {
    border-radius: 100px;
    padding: 10px 40px;
    width: 222px;
    height: 50px;
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 20px;
    color: #fff
}

.my-project__header {
    display: flex;
    justify-content: end;
    gap: 13px;
    align-items: center;
    margin-bottom: 60px
}

.my-project__header_my-applications {
    justify-content: center;
    margin-bottom: 10px

}

.my-project__title {
    font-family: "Russo One", sans-serif;
    font-weight: 400;
    font-size: 28px; /* Базовый размер для мобильных */
    line-height: 120%;
    color: #292929;
    white-space: nowrap;
}

/* Для планшетов */
@media (min-width: 768px) {
    .my-project__title {
        font-size: 42px;
    }

    .my-project__header {
        gap: 100px;
    }
}

/* Для небольших десктопов */
@media (min-width: 1024px) {
    .my-project__title {
        font-size: 42px;
    }

    .my-project__header {
        gap: 110px;
    }
}

/* Для больших экранов */
@media (min-width: 1280px) {
    .my-project__title {
        font-size: 48px;
    }
}

/* Базовая кнопка */
.my-project__btn {
    position: relative;
    border-radius: 100px;
    background: linear-gradient(243deg, #1dd1a5 0, #00a59c 100%);
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    color: #fff;
    cursor: pointer;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: color .3s ease;

    /* Базовые размеры для мобильных */
    padding: 12px 20px;
    width: 100%; /* На мобильных во всю ширину */
    max-width: 330px; /* Максимальная ширина */
    height: 45px;
    font-size: 16px;
    margin: 15px auto; /* Центрирование на мобильных */
    text-align: center;
}

/* Специфичные варианты кнопок */
.my-project__btn_order {
    margin-top: 20px;
}

.my-project__btn_my-details {
    margin-top: 25px;
}

.my-project__btn_my-templates {
    margin-top: 15px;
}

/* Эффект наведения и контент */
.my-project__btn:hover::before {
    transform: scaleX(1);
}

.my-project__btn-content {
    position: relative;
    z-index: 1;
}

.my-project__btn::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    transform: scaleX(0);
    transform-origin: 0 50%;
    width: 100%;
    height: inherit;
    border-radius: inherit;
    background: #292929;
    transition: all 475ms;
}

/* Планшеты */
@media (min-width: 768px) {
    .my-project__btn {
        padding: 16px 32px;
        height: 52px;
        font-size: 18px;
        margin: 20px 0; /* Сброс центрирования */
        width: auto; /* Автоматическая ширина */
    }

    .my-project__btn_order {
        width: 220px;
        margin-top: 25px;
    }

    .my-project__btn_my-finances {
        width: 240px;
    }

    .my-project__btn_my-details {
        width: 160px;
        margin-top: 32px;
    }

    .my-project__btn_my-templates {
        width: 160px;
        margin-top: 20px;
    }

    .my-project__btn_my-channels {
        width: 240px;
    }
}

/* Десктопы */
@media (min-width: 1024px) {
    .my-project__btn {
        padding: 20px 40px;
        height: 60px;
        font-size: 20px;

    }

    .my-project__btn_order {
        width: 237px;
        margin-top: 30px;
    }

    .my-project__btn_my-finances {
        width: 266px;
    }

    .my-project__btn_my-details {
        width: 167px;
        margin-top: 40px;
    }

    .my-project__btn_my-templates {
        width: 165px;
        margin-bottom: auto;
    }

    .my-project__btn_my-channels {
        width: 267px;
    }
}

.my-project__body {
    /*display: grid;*/
    /*grid-template-columns:270px auto;*/
    gap: 78px;
    margin-bottom: 120px
}

.my-project-filter {
    border-radius: 14px;
    background: #fff;
    padding: 20px 15px;
    width: 100%;
    height: auto;
    margin-bottom: 20px;
}

/* Основная сетка */
.grid-layout {
    display: grid;
    grid-template-columns: 1fr; /* На мобильных - одна колонка */
    gap: 20px;
}

/* Планшеты */
@media (min-width: 768px) {
    .my-project-filter {
        padding: 25px 18px;
        width: 220px;
        height: 480px;
    }

    .grid-layout {
        grid-template-columns: 220px auto;
        gap: 25px;
    }
}

/* Десктопы */
@media (min-width: 1024px) {
    .my-project-filter {
        padding: 35px 22px;
        width: 270px;
        height: 530px;
    }

    .grid-layout {
        grid-template-columns: 270px auto;
        gap: 30px;
    }
}

.my-project-filter h4 {
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 20px;
    color: #000;
    margin-bottom: 16px
}

.my-project-filter ul {
    display: flex;
    flex-direction: column;
    gap: 12px
}

.my-project-filter ul li {
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 20px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    cursor: pointer
}

.my-project-filter ul li[data-status=all]::before {
    content: "";
    background: url(../img/status/stat1.svg) no-repeat left center;
    width: 18px;
    height: 18px;
    padding-left: 30px
}

.my-project-filter ul li[data-status=draft]::before {
    content: "";
    background: url(../img/status/stat2.svg) no-repeat left center;
    width: 18px;
    height: 18px;
    padding-left: 30px
}

.my-project-filter ul li[data-status=сomplaint]::before {
    content: "";
    background: url(../img/status/stat8.svg) no-repeat left center;
    width: 18px;
    height: 18px;
    padding-left: 30px
}

.my-project-filter ul li[data-status=refinement]::before {
    content: "";
    background: url(../img/status/stat10.svg) no-repeat left center;
    width: 18px;
    height: 18px;
    padding-left: 30px
}

.my-project-filter ul li[data-status=refund]::before {
    content: "";
    background: url(../img/status/stat11.svg) no-repeat left center;
    width: 18px;
    height: 18px;
    padding-left: 30px
}

.my-project-filter ul li[data-status=inspection]::before {
    content: "";
    background: url(../img/status/stat9.svg) no-repeat left center;
    width: 18px;
    height: 18px;
    padding-left: 30px
}

.my-project-filter ul li[data-status=pending]::before {
    content: "";
    background: url(../img/status/stat3.svg) no-repeat left center;
    padding-left: 30px;
    width: 18px;
    white-space: nowrap;
    height: 18px
}

.my-project-filter ul li[data-status=active]::before {
    content: "";
    background: url(../img/status/stat4.svg) no-repeat left center;
    padding-left: 30px;
    width: 18px;
    height: 18px;
    white-space: nowrap
}

.my-project-filter ul li[data-status=suspended]::before {
    content: "";
    background: url(../img/status/stat5.svg) no-repeat left center;
    padding-left: 30px;
    width: 18px;
    height: 18px
}

.my-project-filter ul li[data-status=completed]::before {
    content: "";
    background: url(../img/status/stat6.svg) no-repeat left center;
    padding-left: 30px;
    width: 18px;
    height: 18px
}

.my-project-filter ul li[data-status=archived]::before {
    content: "";
    background: url(../img/status/stat7.svg) no-repeat left center;
    padding-left: 30px;
    width: 18px;
    height: 18px
}


.my-templates__title {
    font-family: "Russo One", sans-serif;
    font-weight: 400;
    font-size: 32px;
    line-height: 120%;
    color: #292929;
    margin-bottom: 20px
}

.my-templates__body {
    background: #fff;
    min-height: 285px;
    border-radius: 15px;
    margin-bottom: 120px;
    padding: 30px;
    display: flex;
    flex-direction: column;
    justify-content: space-between
}

.my-templates__body-items {
    display: flex;
    flex-direction: column;
    gap: 30px
}

.my-templates__body-item {
    display: flex;
    justify-content: space-between;
    align-items: center
}

.my-templates__body-item-title {
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 120%;
    text-transform: capitalize;
    color: #292929
}

.my-templates__body-item-actions {
    display: flex;
    gap: 14px
}

.my-templates__body-item-btn {
    background: #06af9e;
    border-radius: 5px;
    width: 35px;
    height: 35px
}

.my-templates__body-item-btn_newwidth {
    width: 48px;
    height: 48px
}

.my-templates__body-item-btn:last-child {
    background: #d66262
}

.my-templates__body-item-btn-content {
    display: flex;
    justify-content: center;
    align-items: center
}

.my-templates__body-paginate {
    display: flex;
    justify-content: center;
    align-items: center
}

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

.pagination__arrow {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 50px;
    border-radius: 100%;
    margin: 0 5px;
    text-decoration: none;
    color: #000;
    background: #fff;
    border: 2px solid #292929
}

.pagination__number {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 50px;
    border-radius: 100%;
    margin: 0 5px;
    text-decoration: none;
    color: #000;
    background: #fff;
    border: 2px solid #292929
}

.pagination__number.is-active {
    background: #000;
    color: #fff
}

#image-preview {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: 15px
}
.new__templates {
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin-bottom: 40px;
    padding: 0 16px;
}

@media (min-width: 1024px) {
    .new__templates {
        flex-direction: row;
        gap: 30px;
        margin-bottom: 136px;
        padding: 0;
    }
}

.new__templates-forms {
    display: flex;
    flex-direction: column;
    flex: 1;
    gap: 20px;
    background: #fff;
    border-radius: 15px;
    min-height: auto;
    padding: 16px;
}

@media (min-width: 1024px) {
    .new__templates-forms {
        flex: 0 0 730px;
        min-height: 698px;
        padding: 22px 40px 40px 40px;
    }
}

.view-new-templates {
    position: relative;
    flex: 1;
    min-height: 450px;
    border-radius: 15px;
    padding: 16px;
    overflow: hidden;
}

@media (min-width: 1024px) {
    .view-new-templates {
        padding: 22px 19px 50px 19px;
    }
}

.view-new-templates::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),
    url("../img/pattern-bg.svg") no-repeat center center / cover;
    opacity: 0.7;
    z-index: -1;
}

.forms-media-group-block {
    display: flex;
    flex-direction: column;
    gap: 15px;
    margin-top: 20px;
}

@media (min-width: 768px) {
    .forms-media-group-block {
        flex-direction: row;
        justify-content: space-between;
        align-items: flex-end;
    }
}

.forms-media-group-block .forms-media-group {
    width: 100%;
}

@media (min-width: 768px) {
    .forms-media-group-block .forms-media-group {
        width: 300px;
    }
}

.forms-media-upload {
    display: flex;
    flex-direction: column;
    gap: 20px;
    align-items: flex-start;
}

@media (min-width: 768px) {
    .forms-media-upload {
        flex-direction: row;
        gap: 50px;
        align-items: center;
    }
}

.upload-label {
    display: block;
    font-family: "Exo 2", sans-serif;
    font-size: 18px;
    color: #000;
}

@media (min-width: 768px) {
    .upload-label {
        font-size: 20px;
    }
}

.forms-media-icon {
    border-radius: 15px;
    width: 93px;
    height: 93px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #02a89d;
    cursor: pointer;
    margin-top: 13px;
}

.forms-media-group input,
.forms-media-group textarea {
    width: 100%;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 5px;
    font-family: "Exo 2", sans-serif;
    font-size: 16px;
    color: #000;
}

@media (min-width: 768px) {
    .forms-media-group input,
    .forms-media-group textarea {
        font-size: 20px;
    }
}

.forms-media-group label {
    font-family: "Exo 2", sans-serif;
    font-size: 16px;
    color: #000;
    display: block;
    margin-bottom: 8px;
}

@media (min-width: 768px) {
    .forms-media-group label {
        font-size: 20px;
    }
}

.forms-media-group textarea {
    height: auto;
    resize: none;
    min-height: 100px;
    max-width: 100%;
    overflow: auto;
}

.forms-media-action-buttons {
    display: flex;
    flex-direction: column;
    gap: 15px;
    margin-top: 20px;
}

@media (min-width: 768px) {
    .forms-media-action-buttons {
        flex-direction: row;
        justify-content: flex-end;
        align-items: center;
        gap: 25px;
    }
}

.my-channel {
    margin-bottom: 120px;
    display: flex;
    flex-direction: column
}

.my-channel-btn {
    align-self: end
}

.search-form {
    display: flex;
    margin-top: 15px;
    align-items: center;
    background: #fff;
    border-radius: 25px;
    padding: 10px 30px;
    width: 100%;

}

.search-input {
    flex: 1;
    background: 0 0;
    border: none;
    padding: 10px 15px;
    outline: 0;
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 120%;
    text-transform: capitalize;
    color: #292929
}

.search-input::-webkit-input-placeholder {
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 120%;
    text-transform: capitalize;
    color: #c2c2c2
}

.search-input:-ms-input-placeholder {
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 120%;
    text-transform: capitalize;
    color: #c2c2c2
}

.search-input::-ms-input-placeholder {
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 120%;
    text-transform: capitalize;
    color: #c2c2c2
}

.search-input::placeholder {
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 120%;
    text-transform: capitalize;
    color: #c2c2c2
}

.search-button {
    background: 0 0;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    padding: 10px
}

.search-button:hover {
    opacity: .8;
    -webkit-transform: scale(1.3);
    transform: scale(1.3)
}

.contact-form {
    display: flex;
    flex-direction: column;
    width: 100%;
    background: #fff;
    border-radius: 15px;
    padding: 25px 30px 45px 30px
}

.contact-form .form-group {
    display: flex;
    flex-direction: column;
    margin-bottom: 20px
}

.contact-form .form-group_phone-input {
    display: flex
}

.contact-form .form-group_phone-input-icon {
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 20px;
    color: #000;
    padding: 12px 8px;
    border: 1px solid #ebeaf0;
    border-radius: 5px 0 0 5px
}

.contact-form .form-group label {
    margin-bottom: 10px;
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 20px;
    color: #000
}

.contact-form .form-group input {
    border: 1px solid #ebeaf0;
    border-radius: 0 5px 5px 0;
    padding-left: 10px;
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 20px;
    color: #000
}

.my-form-btn {
    align-self: end
}

.my-details {
    margin-bottom: 120px;
    display: grid;
    grid-template-columns:auto 870px;
    gap: 65px
}

.my-details__avatar {
    padding-left: 36px;
    display: flex;
    flex-direction: column;
    gap: 25px;
    align-items: center
}

.my-details__avatar-img {
    border-radius: 100%;
    width: 200px;
    height: 200px;
    border: #03a99d 4px solid;
    display: flex;
    justify-content: center;
    align-items: center
}

.my-details__avatar-name {
    font-family: "Russo One", sans-serif;
    font-weight: 400;
    font-size: 32px;
    line-height: 120%;
    color: #292929
}

.my-finances {
    margin-bottom: clamp(40px, 8vw, 120px);
    display: flex;
    flex-direction: column;
    gap: clamp(20px, 4vw, 60px);
}

.my-finances__header {
    border-radius: 15px;
    min-height: 166px;
    background: #fff;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: clamp(20px, 4vw, 50px) clamp(15px, 3vw, 40px);
}

.my-finances__balance {
    font-family: "Russo One", sans-serif;
    font-weight: 400;
    font-size: clamp(28px, 5vw, 54px);
    line-height: 120%;
    color: #292929;
}

.my-finances__btn {
    display: flex;
    align-items: center;
    gap: 30px;
}

.dashboard {
    min-height: 344px;
    padding: clamp(20px, 3vw, 45px) 15px clamp(20px, 2vw, 30px);
    background: #fff;
    display: flex;
    flex-direction: column;
}

.dashboard__result {
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: clamp(16px, 2vw, 20px);
    color: #000;
    text-align: center;
    margin-top: clamp(20px, 3vw, 40px);
}

.dashboard__paginate {
    margin-top: auto;
    align-self: center;
}

/* Планшеты */
@media (max-width: 1024px) {
    .my-finances__header {
        flex-direction: column;
        gap: 20px;
        height: auto;
        text-align: center;
    }

    .my-finances__balance {
        align-items: center;
    }

    .dashboard {
        overflow-x: auto;
    }
}

/* Мобильные устройства */
@media (max-width: 768px) {
    .my-finances {
        gap: 30px;
        margin-bottom: 60px;
    }

    .my-finances__btn {
        width: 100%;
    }

    .my-finances__btn button {
        width: 100%;
    }

    .my-finances__balance {
        width: 100%;
        font-size: 28px;
    }

    /* Адаптация таблицы для мобильных */
    .overflow-x-auto {
        margin: 0 -15px;
    }

    .table-auto {
        min-width: 650px;
    }

    .dashboard {
        padding: 15px 0;
    }
}

/* Маленькие мобильные устройства */
@media (max-width: 480px) {
    .my-finances {
        margin-bottom: 40px;
    }

    .my-finances__header {
        padding: 15px;
    }

    .my-finances__balance {
        font-size: 24px;
    }

    .dashboard__result {
        font-size: 16px;
        margin-top: 20px;
    }
}

.panel {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #ebeaf0;
    height: 80px;
    padding: 28px 42px 28px 40px;
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 20px;
    color: #000
}
.order {
    margin-bottom: 60px;
    padding: 0 16px;
}

.order__body {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
    align-items: start;
}

@media (min-width: 1024px) {
    .order {
        margin-bottom: 120px;
        padding: 0;
    }

    .order__body {
        grid-template-columns: 870px auto;
        gap: 30px;
    }
}

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

@media (min-width: 768px) {
    .order__list {
        gap: 30px;
    }
}

.order__item {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 16px;
    background: #fff;
    border-radius: 15px;
}

@media (min-width: 768px) {
    .order__item {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        padding: 30px 22px;
        min-height: 144px;
    }
}

.order__item-options {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 15px;
    width: 100%;
}

@media (min-width: 768px) {
    .order__item-options {
        display: flex;
        gap: 39px;
        width: auto;
        align-items: center;
    }
}

.order__item-quantity {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 100px;
    border: 2px solid #292929;
    border-radius: 3px;
    height: 33px;
    font-family: "Exo 2", sans-serif;
    font-size: 18px;
    text-align: center;
    color: #292929;
}

.order__item-price {
    font-family: "Russo One", sans-serif;
    font-size: 20px;
    text-align: right;
    color: #292929;
    white-space: nowrap;
}

.order__item-info {
    align-items: center;
    margin-bottom: 0;
    width: 100%;
}

.order__action-btn {
    width: 35px;
    height: 35px;
    border-radius: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #292929;
    margin-left: auto;
}

@media (min-width: 768px) {
    .order__action-btn {
        margin-left: 0;
    }
}

.order__pay {
    display: flex;
    flex-direction: column;
    border-radius: 15px;
    background: #fff;
    padding: 20px 16px;
    position: sticky;
    top: 20px;
}

@media (min-width: 1024px) {
    .order__pay {
        min-height: 445px;
        padding: 26px 16px 30px 17px;
    }
}

.quantity-btn {
    font-family: "Exo 2", sans-serif;
    font-size: 18px;
    text-align: center;
    color: #292929;
    border: none;
    padding: 5px;
    margin: 0 5px;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
}

.quantity-input {
    padding: 5px;
    text-align: center;
    font-family: "Exo 2", sans-serif;
    font-size: 18px;
    color: #292929;
    width: 30px;
    border: none;
    background: transparent;
}

.summary h3 {
    font-family: "Russo One", sans-serif;
    font-size: 16px;
    color: #000;
    margin-bottom: 15px;
    padding-left: 8px;
}

.summary__list {
    display: flex;
    flex-direction: column;
    gap: 12px;
    border-bottom: 1px solid #ebeaf0;
    padding: 8px;
    padding-bottom: 20px;
    margin-bottom: 20px;
}

.summary__list li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-family: "Exo 2", sans-serif;
    font-size: 14px;
    color: #000;
}

.summary__total {
    padding-left: 8px;
    font-family: "Russo One", sans-serif;
    font-size: 18px;
    color: #000;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

@media (max-width: 767px) {
    .catalog__item-price-select {
        width: 100%;
    }

    .order__item-action {
        position: absolute;
        top: 16px;
        right: 16px;
    }

    .order__item {
        position: relative;
    }

    .catalog__item-textblock {
        padding-right: 40px;
    }
}


.terms {
    padding: 120px 0
}

.terms li, .terms p {
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 16px;
    color: #000;
    margin-bottom: 10px
}

.terms li:last-child, .terms p:last-child {
    margin-bottom: 0
}

.terms__title {
    font-family: "Russo One", sans-serif;
    font-weight: 400;
    font-size: 52px;
    line-height: 120%;
    color: #292929;
    margin-bottom: 36px;
    text-align: center
}

/* Базовые стили для privacy секции */
.privacy {
    padding: 40px 0; /* Меньший padding на мобильных */
}

.privacy__title {
    font-family: "Russo One", sans-serif;
    font-weight: 400;
    font-size: 28px; /* Меньший размер на мобильных */
    line-height: 120%;
    color: #292929;
    margin-bottom: 24px; /* Меньший отступ на мобильных */
    text-align: center;
}

.privacy li,
.privacy p {
    font-family: "Exo 2", sans-serif;
    font-weight: 400;
    font-size: 14px; /* Меньший размер на мобильных */
    color: #000;
    margin-bottom: 10px;
}

.privacy li:last-child,
.privacy p:last-child {
    margin-bottom: 0;
}

.privacy__list {
    list-style-type: disc !important;
    padding-left: 20px;
    margin-bottom: 20px;
}

.privacy li {
    list-style-type: disc;
}

/* Планшеты */
@media (min-width: 768px) {
    .privacy {
        padding: 80px 0;
    }

    .privacy__title {
        font-size: 42px;
        margin-bottom: 30px;
    }

    .privacy li,
    .privacy p {
        font-size: 15px;
    }
}

/* Десктопы */
@media (min-width: 1024px) {
    .privacy {
        padding: 120px 0;
    }

    .privacy__title {
        font-size: 52px;
        margin-bottom: 36px;
    }

    .privacy li,
    .privacy p {
        font-size: 16px;
    }
}

/* Большие экраны */
@media (min-width: 1280px) {
    .privacy {
        padding: 120px 0;
    }

    .privacy__container {
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 20px;
    }
}

.webp .advantages__left-item {
    /*background: url(../img/list-left-bg.webp) no-repeat left center*/
    background: url(../img/list-bg.webp) no-repeat left center
}

.webp .advantages__right-item {
    background: url(../img/list-bg.webp) no-repeat left center
}
