/* ==================================================
   СЕВЕРНЫЙ ВЕТЕР — TX16N2
   Обводка + иконка + цвета текста

   #rec3664024901
   #rec4051495501
   #rec4051855101
   ================================================== */


/* ==========================================
   1. ОБВОДКА КАРТОЧЕК
   ========================================== */

#rec3664024901 .t668__wrapper,
#rec4051495501 .t668__wrapper,
#rec4051855101 .t668__wrapper {
    border: 1px solid rgba(125, 134, 114, 0.55) !important;

    transition:
        border-color 0.3s ease,
        background-color 0.3s ease !important;
}


/* При наведении обводка становится ярче */

#rec3664024901 .t668__wrapper:hover,
#rec4051495501 .t668__wrapper:hover,
#rec4051855101 .t668__wrapper:hover {
    border-color: #7D8672 !important;
}


/* ==========================================
   2. ЦВЕТ ЗАГОЛОВКОВ
   ========================================== */

#rec3664024901 .t668__title,
#rec3664024901 .t668__title *,
#rec4051495501 .t668__title,
#rec4051495501 .t668__title *,
#rec4051855101 .t668__title,
#rec4051855101 .t668__title * {
    color: #F1F2EB !important;
}


/* ==========================================
   3. ЦВЕТ ТЕКСТА В РАСКРЫТОЙ КАРТОЧКЕ
   ========================================== */

#rec3664024901 .t668__text,
#rec3664024901 .t668__text *,
#rec4051495501 .t668__text,
#rec4051495501 .t668__text *,
#rec4051855101 .t668__text,
#rec4051855101 .t668__text * {
    color: #B7BCAE !important;
}


/* Ссылки внутри раскрытого текста */

#rec3664024901 .t668__text a,
#rec4051495501 .t668__text a,
#rec4051855101 .t668__text a {
    color: #B7BCAE !important;
}


/* ==========================================
   4. УБИРАЕМ СТАНДАРТНУЮ ИКОНКУ TILDA
   ========================================== */

#rec3664024901 .t668__icon,
#rec4051495501 .t668__icon,
#rec4051855101 .t668__icon {
    border: none !important;
    background: transparent !important;
}


/* Убираем стандартный + */

#rec3664024901 .t668__icon span,
#rec4051495501 .t668__icon span,
#rec4051855101 .t668__icon span {
    display: none !important;
}


/* ==========================================
   5. НОВАЯ ТЕХНИЧЕСКАЯ ИКОНКА
   Четыре угловые метки
   ========================================== */

#rec3664024901 .t668__icon::before,
#rec4051495501 .t668__icon::before,
#rec4051855101 .t668__icon::before {
    content: "";

    position: absolute;

    width: 18px;
    height: 18px;

    left: 50%;
    top: 50%;

    transform: translate(-50%, -50%);

    background:
        linear-gradient(#7D8672, #7D8672)
        left top / 6px 1px no-repeat,

        linear-gradient(#7D8672, #7D8672)
        left top / 1px 6px no-repeat,

        linear-gradient(#7D8672, #7D8672)
        right top / 6px 1px no-repeat,

        linear-gradient(#7D8672, #7D8672)
        right top / 1px 6px no-repeat,

        linear-gradient(#7D8672, #7D8672)
        left bottom / 6px 1px no-repeat,

        linear-gradient(#7D8672, #7D8672)
        left bottom / 1px 6px no-repeat,

        linear-gradient(#7D8672, #7D8672)
        right bottom / 6px 1px no-repeat,

        linear-gradient(#7D8672, #7D8672)
        right bottom / 1px 6px no-repeat;

    opacity: 0.75;

    transition:
        transform 0.35s ease,
        opacity 0.35s ease;
}


/* ==========================================
   6. ТОЧКА В ЦЕНТРЕ
   ========================================== */

#rec3664024901 .t668__icon::after,
#rec4051495501 .t668__icon::after,
#rec4051855101 .t668__icon::after {
    content: "";

    position: absolute;

    left: 50%;
    top: 50%;

    width: 3px;
    height: 3px;

    background: #7D8672;

    border-radius: 50%;

    transform: translate(-50%, -50%);

    opacity: 0.85;
}


/* ==========================================
   7. HOVER ИКОНКИ
   ========================================== */

#rec3664024901 .t668__wrapper:hover .t668__icon::before,
#rec4051495501 .t668__wrapper:hover .t668__icon::before,
#rec4051855101 .t668__wrapper:hover .t668__icon::before {
    transform:
        translate(-50%, -50%)
        rotate(45deg);

    opacity: 1;
}


/* Центральная точка ярче при hover */

#rec3664024901 .t668__wrapper:hover .t668__icon::after,
#rec4051495501 .t668__wrapper:hover .t668__icon::after,
#rec4051855101 .t668__wrapper:hover .t668__icon::after {
    opacity: 1;
}


/* ==========================================
   8. ШИРИНА ТЕКСТА ОТВЕТА
   ========================================== */

#rec3664024901 .t668__content,
#rec4051495501 .t668__content,
#rec4051855101 .t668__content {
    max-width: none !important;
    width: auto !important;
    padding-right: 24px !important;
    box-sizing: border-box !important;
}


/* ==========================================
   9. MOBILE
   ========================================== */

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

    #rec3664024901 .t668__content,
    #rec4051495501 .t668__content,
    #rec4051855101 .t668__content {
        padding-right: 12px !important;
    }

}

</style>





/* ==================================================
СЕВЕРНЫЙ ВЕТЕР — TARGET STYLE ДЛЯ ВСЕХ КНОПОК
================================================== */

/* Zero Block + стандартные кнопки Tilda */

.t-btn,
.t-submit,
.tn-elem[data-elem-type="button"] .tn-atom {
position: relative !important;
}

/* Четыре технических уголка ВНУТРИ кнопки */

.t-btn::before,
.t-submit::before,
.tn-elem[data-elem-type="button"] .tn-atom::before {
content: "";
position: absolute;
inset: 4px;
pointer-events: none;
z-index: 5;

background:
linear-gradient(currentColor,currentColor) left top / 8px 1px no-repeat,
linear-gradient(currentColor,currentColor) left top / 1px 8px no-repeat,

linear-gradient(currentColor,currentColor) right top / 8px 1px no-repeat,
linear-gradient(currentColor,currentColor) right top / 1px 8px no-repeat,

linear-gradient(currentColor,currentColor) left bottom / 8px 1px no-repeat,
linear-gradient(currentColor,currentColor) left bottom / 1px 8px no-repeat,

linear-gradient(currentColor,currentColor) right bottom / 8px 1px no-repeat,
linear-gradient(currentColor,currentColor) right bottom / 1px 8px no-repeat;

opacity: .65;

transition:
inset .3s cubic-bezier(.16,1,.3,1),
opacity .25s ease;
}

/* HOVER — уголки немного сходятся внутрь */

.t-btn:hover::before,
.t-submit:hover::before,
.tn-elem[data-elem-type="button"] .tn-atom:hover::before {
inset: 7px;
opacity: 1;
}


/* ==================================================
ИСКЛЮЧЕНИЕ — КНОПКИ БЕЗ TARGET-ЭФФЕКТА
Класс: no-target
================================================== */

.no-target .tn-atom::before,
.no-target.t-btn::before,
.no-target.t-submit::before {
content: none !important;
display: none !important;
background: none !important;
}