@media screen and (min-width: 1200px) {
a:hover, a:visited:hover {
color: #B1965D !important;
-webkit-transition: 0s ease;
transition: 0s ease; 
}
}


/* Верхний слой (Цена) */
.price {
    position: relative;
    z-index: 10;
}

/* Задний план (Инструмент) */
.instrument {
    position: relative;
    z-index: 1;
}

/* Верхний слой (Описание) */
.description {
    position: relative;
    z-index: 10;
}



.uc-description .t1050 .t-col{
    z-index: 3;
}

.uc-texture .t772__img {
     border-radius: 300px;
     box-shadow: 0px 8px 22px -6px #C4C4C4;
     margin:;
}

.uc-texture .t772__img:hover {
     border: 4px solid #0045B6;
}


.uc-texture .t772__scroll-icon-wrapper {
    display: none;
}

.uc-texture .t772__imgwrapper {
    margin-top: 20px;
}

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

.uc-texture .t-name_md {
    font-size: 24px;
    lineheight: 1;
}

.uc-hors .t772__col {
    min-width: 70%;
    max-width: 70%;
}
   
 .uc-grid2 .t-name_xl   {
     font-size: 30px;
    lineheight: 1;
 }
 
 .uc-grid2 .t772__col_mobile-grid {
     margin-bottom: 80px;
     
 }
 
.uc-grid .t829__btnwrapper {
    padding-bottom: 40px;
}

.uc-grid .t-btn_xs {
    height: 45px;
}

.uc-grid .t-name_md {
    font-size: 12pt;
}
   
    
}

.uc-hors .t772__img {
     border-radius: 23px;
     box-shadow: 0px 8px 22px -6px #C4C4C4;
     margin:;
}

.uc-hors .t772__img:hover {
     border: 4px solid #0045B6;
}


.uc-hors .t772__scroll-icon-wrapper {
    display: none;
}

.uc-hors .t772__imgwrapper {
    margin-top: 20px;
}


.t-popup__container {
   border-radius: 30px;
    -moz-border-radius: 30px;
    -webkit-border-radius: 30px; 
}

@media screen and (max-width: 1200px) {
.t-descr_xxs {
    font-size: 20px;
}
}


.uc-grid .t829__imgwrapper {
background: linear-gradient(0deg, rgba(0, 0, 0, 0.03), rgba(0, 0, 0, 0.03)), url(gold apple II 233.jpg);
box-shadow: 0px 8px 22px rgba(161, 161, 161, 0.5);
border-radius: 23px;

}

.uc-grid .t829__img {
border-radius: 23px;
 
}

.uc-grid2 .t772__bgimg{
border-radius: 23px;
box-shadow: 0px 7px 27px 6px #000000;
}

.uc-grid2 .t912__container {
    justify-content: space-evenly; 
}



.t829__grid-item_mb-40 {
    
        width: 600px;
}



/* начало блока 2 поможем */

.uc-helpblok
{
  background: rgb(0,0,0)!important;
}

.uc-helpblok .t996__cover:after 
{
    background: rgb(0,0,0)!important;
    background: linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 16%)!important;
}


/* Настраиваем градиент для конкретного блока */
#rec580889115 .t996__cover::after {
    /* Делаем слой видимым */
    opacity: 1 !important;
    display: block !important;
    
    /* Градиент: слева (черный) направо (прозрачный) */
    /* 0% - начало черного, 50% - где начинается полная прозрачность */
    background-image: linear-gradient(90deg, #000000 0%, rgba(0,0,0,0) 50%) !important;
}
@media screen and (max-width: 640px) {

/* Настраиваем градиент для конкретного блока */
#rec580889115 .t996__cover::after {
    /* Делаем слой видимым */
    opacity: 1 !important;
    display: block !important;
    
    /* Градиент: слева (черный) направо (прозрачный) */
    /* 0% - начало черного, 50% - где начинается полная прозрачность */
    background-image: linear-gradient(90deg, #000000 0%, rgba(0,0,0,0) 0%) !important;

}
}

/* --- 1. СТИЛИ ДЛЯ ТЕКСТОВОГО БЛОКА (СТЕКЛО) --- */
#rec1749732931 .t675__textwrapper {
    /* Фон и эффекты */
    background: rgba(255, 255, 255, 0.6) !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 0px solid rgba(255, 255, 255, 0.8);
    border-radius: 20px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);
    
    /* Отступы и размеры */
    padding: 40px 50px !important;
    box-sizing: border-box !important;

    /* Центрирование */
    float: none !important; 
    display: block !important;
    width: 100% !important; 
    max-width: 700px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    margin-bottom: 120px !important;
}



/* --- 2. СТИЛИ ДЛЯ КНОПКИ --- */
#rec1749732931 .t-btn {
    /* Обычное состояние (не активно) */
    background-color: transparent !important; /* Прозрачный фон */
    border: 2px solid #0044BB !important;    /* Синяя обводка (2px толщиной) */
    color: #0044BB !important;               /* Синий текст */
    border-radius: 50px !important;          /* Скругление (как таблетка) */
    font-weight: 600 !important;             /* Текст пожирнее */
    box-shadow: none !important;             /* Убираем стандартные тени тильды */
    margin-top: 20px !important;             /* Отступ от текста до кнопки */
        font-size: 18px !important;  /* Читаемый размер текста */
    opacity: 0.9 !important;     /* Цвет чуть мягче черного */
}

/* Состояние при наведении (Hover) */
#rec1749732931 .t-btn:hover {
    background-color: #0044BB !important;    /* Заливаем синим */
    color: #ffffff !important;               /* Текст становится белым */
    border-color: #0044BB !important;
}

/* Заголовок */
#rec1749732931 .t-name, 
#rec1749732931 .t675__title {
    font-size: 35px !important;  /* Крупный, уверенный заголовок */
    line-height: 1.2 !important;
    font-weight: 700 !important;
    margin-bottom: 25px !important;
    letter-spacing: -0.5px !important; /* Чуть плотнее, современнее */
}

/* Описание */
#rec1749732931 .t-descr, 
#rec1749732931 .t675__descr {
    font-size: 20px !important;  /* Читаемый размер текста */
    font-weight: 400 !important;
    opacity: 0.9 !important;     /* Цвет чуть мягче черного */
}




/* --- 3. АДАПТИВ ДЛЯ МОБИЛЬНЫХ (ШРИФТЫ И РАЗМЕРЫ) --- */
@media screen and (max-width: 640px) {
    #rec1749732931 .t675__textwrapper {
        max-width: 90% !important;
        padding: 30px 20px !important; /* Чуть больше воздуха сверху/снизу */
        margin-bottom: 50px !important;
    }

    /* Увеличиваем ЗАГОЛОВОК на телефоне */
    #rec1749732931 .t-name, 
    #rec1749732931 .t675__title {
        font-size: 28px !important; /* Было меньше, стало крупнее */
        line-height: 1.3 !important;
        margin-bottom: 15px !important;
    }

    /* Увеличиваем ОПИСАНИЕ на телефоне */
    #rec1749732931 .t-descr, 
    #rec1749732931 .t675__descr {
        font-size: 18px !important; /* Оптимальный размер для чтения */
        line-height: 1.5 !important;
    }
}


@media screen and (max-width: 480px) {
    .t-rec_pb_135 {
        padding-bottom: 10px !important;
    }
}





/* --- 3. АДАПТИВ ДЛЯ МОБИЛЬНЫХ (ШРИФТЫ И РАЗМЕРЫ) --- */
@media screen and (max-width: 640px) {
    #rec1821753031 .t675__textwrapper {
        max-width: 90% !important;
        padding: 30px 20px !important; /* Чуть больше воздуха сверху/снизу */
        margin-bottom: 50px !important;
    }

    /* Увеличиваем ЗАГОЛОВОК на телефоне */
    #rec1821753031 .t-name, 
    #rec1821753031 .t675__title {
        font-size: 22px !important; /* Было меньше, стало крупнее */
        line-height: 1.3 !important;
        margin-bottom: 15px !important;
    }

    /* Увеличиваем ОПИСАНИЕ на телефоне */
    #rec1821753031 .t-descr, 
    #rec1821753031 .t675__descr {
        font-size: 14px !important; /* Оптимальный размер для чтения */
        line-height: 1.5 !important;
    }
}

/* 1. РАСТЯГИВАЕМ БЛОК НА ВЕСЬ ЭКРАН */
#rec1821753031 .t465__container {
    max-width: 100% !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

#rec1821753031 .t-sociallinks__wrapper {
    display: flex !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    gap: 0 !important; /* Кнопки вплотную */
}

/* 2. ЗАСТАВЛЯЕМ КАЖДУЮ КНОПКУ ПРИНИМАТЬ РАВНУЮ ШИРИНУ */
#rec1821753031 .t-sociallinks__item {
    flex: 1 1 0px !important; /* Это заставит их растянуться поровну на 100% ширины */
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
}

#rec1821753031 .t-sociallinks__item a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important; /* Кнопка занимает всё выделенное ей место */
    transition: transform 0.2s ease-in-out !important;
    
    /* ВЫСОТА КНОПОК ДЛЯ КОМПЬЮТЕРА */
    height: 100px !important; 
}

/* 3. НАСТРОЙКА ЗНАЧКОВ ВНУТРИ */
#rec1821753031 .t-sociallinks__svg {
    width: 40px !important; /* Размер значков */
    height: 40px !important;
}

/* 4. АНИМАЦИЯ ПРИ НАВЕДЕНИИ: ЛЕГКОЕ УМЕНЬШЕНИЕ */
#rec1821753031 .t-sociallinks__item a:hover {
    transform: scale(0.92) !important; /* Эффект нажатия/уменьшения */
    z-index: 2; /* Чтобы при уменьшении не было видно щелей */
}

/* 5. МОБИЛЬНАЯ ВЕРСИЯ */
@media screen and (max-width: 960px) {
    #rec1821753031 .t-sociallinks__item a {
        height: 70px !important; /* Высота кнопок на телефоне */
    }
    #rec1821753031 .t-sociallinks__svg {
        width: 30px !important; /* Размер значков на телефоне */
        height: 30px !important;
    }
}




/* === ГОТОВЫЕ ЦВЕТА ДЛЯ 10 ИКОНОК в блоке #rec1821753031 === */

/* 1-я иконка (Фиолетовая) */
#rec1821753031 .t-sociallinks__item:nth-child(1) {
    background-color: #C8406A !important;
}

/* 2-я иконка (VK / Сине-серая) */
#rec1821753031 .t-sociallinks__item:nth-child(2) {
    background-color: #4680C2 !important;
}

/* 3-я иконка (Черная) */
#rec1821753031 .t-sociallinks__item:nth-child(3) {
    background-color: #272727 !important;
}

/* 4-я иконка (Telegram / Ярко-синяя) */
#rec1821753031 .t-sociallinks__item:nth-child(4) {
    background-color: #2CA5E0 !important;
}

/* 5-я иконка (Голубая) */
#rec1821753031 .t-sociallinks__item:nth-child(5) {
    background-color: #3F3EDB !important;
}

/* 6-я иконка (Красная) */
#rec1821753031 .t-sociallinks__item:nth-child(6) {
    background-color: #FF0000 !important;
}

/* 7-я иконка (Бирюзовая) */
#rec1821753031 .t-sociallinks__item:nth-child(7) {
    background-color: #101010 !important;
}

/* 8-я иконка (Белая) */
#rec1821753031 .t-sociallinks__item:nth-child(8) {
    background-color: #FFFFFF !important;
}

/* 9-я иконка (Бирюзовая, как 7-я) */
#rec1821753031 .t-sociallinks__item:nth-child(9) {
    background-color: #40E0D0 !important; 
}

/* 10-я иконка (если есть, можно задать цвет) */
#rec1821753031 .t-sociallinks__item:nth-child(10) {
    background-color: #101010 !important; /* Например, светло-серый */
}

/* Эффект при наведении курсора */
#rec1821753031 .t-sociallinks__item:hover {
    opacity: 0.8 !important;
    transition: all 0.2s ease;
}





/* === НАСТРОЙКА БЛОКА #rec1822023851 === */

/* --- 1. Общий фон и отступы всего блока --- */
#rec1822023851 {
    background-color: #F5F5F7 !important; /* Светло-серый фон */
    padding: 100px 40px !important; /* Увеличил отступы сверху/снизу */
    box-sizing: border-box;
}

/* --- 2. Отступ между текстом и фото --- */
#rec1822023851 .t546__blocktable {
    border-collapse: separate !important;
    border-spacing: 60px 0 !important; /* Увеличил отступ между блоками */
}

/* --- 3. СТИЛЬ ФОТОГРАФИИ (Тень и скругление) --- */
#rec1822023851 .t546__blockimg {
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.15) !important; /* Более заметная тень */
    border-radius: 12px !important; /* Красивое скругление */
}

/* --- 4. Убираем фон у текстового блока --- */
#rec1822023851 .t546__blocktext {
    background-color: transparent !important;
    box-shadow: none !important;
    vertical-align: middle; /* Выравниваем текст по центру ячейки */
}

/* --- 5. КРАСИВЫЕ ШРИФТЫ --- */

/* Имя (Заголовок) */
#rec1822023851 .t-title {
    font-size: 42px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    color: #111111 !important;
}

/* Должность (Подзаголовок) */
#rec1822023851 .t-subtitle {
    font-size: 16px !important;
    color: #777777 !important;
    letter-spacing: 1px !important;
    text-transform: uppercase;
    margin-bottom: 30px !important;
}

/* Описание */
#rec1822023851 .t-descr {
    font-size: 18px !important;
    line-height: 1.65 !important;
    color: #333333 !important;
}

#rec1822023851 .t-text_sm{
    font-size: 20px !important;
    font-weight: 400;
    line-height: 1.55 !important;
    color: #333333 !important;
}



/* --- 6. МОБИЛЬНАЯ ВЕРСИЯ --- */
@media screen and (max-width: 960px) {
    #rec1822023851 {
        padding: 40px 20px !important;
    }
    #rec1822023851 .t546__blocktext {
        margin-bottom: 40px; /* Отступ текста от фото на мобильном */
    }
    #rec1822023851 .t-title { font-size: 32px !important; }
    #rec1822023851 .t-descr { font-size: 16px !important; }
}





/* Медиа-запрос для мобильных устройств (ширина экрана 640px и меньше) */
@media screen and (max-width: 640px) {

    /* 
       ID вашего блока #rec1822023851. Он уже указан правильно.
    */

    /* --- САМОЕ ГЛАВНОЕ: УМЕНЬШАЕМ ПОЛЯ --- */
    /* Это стиль для всей текстовой колонки. Уменьшаем внутренние отступы (padding). */


    /* --- СТИЛИ ДЛЯ ШРИФТОВ --- */

    /* Стиль для главного заголовка ("Мастерская Санкт-Петербурга") */
    #rec1822023851 .t546__title {
        font-size: 28px !important;       /* Размер шрифта */
            /* Межстрочный интервал */
        padding-bottom: 20px !important;  /* Отступ снизу */
    }

    /* Стиль для всего основного текста (включая "Контакты", телефон и т.д.) */
    #rec1822023851 .t546__text {
        font-size: 18px !important;       /* Базовый размер шрифта */
       
    }
    
    /* Стиль для подзаголовков ("Контакты", "Как попасть в мастерскую") */
    /* Мы делаем их жирными, чуть больше и добавляем отступы */
    #rec1822023851 .t546__text strong {

        font-size: 20px !important; /* Размер шрифта подзаголовков */
        font-weight: 600 !important; /* Насыщенность шрифта */
        padding-top: 20px !important; /* Отступ СВЕРХУ */
        padding-bottom: 10px !important; /* Отступ СНИЗУ */
    }
    
    #rec1822023851 .t546__blocktable {
    border-collapse: separate !important;
    border-spacing: 20px 0 !important;
}


    .t546__blockimgmobile {
        display: block !important;
        width: 100%;
        padding: 20px 0 0;
        text-align: center;
    }
    
    .t546__textwrapper {
        margin: 50px 20px 0px;
    }


.t546__imgmobile {
    border-radius: 10px;
}





} /* Конец медиа-запроса */






/* 1. НАСТРОЙКА КОЛОНОК */
#rec1865154791 .t420__descr {
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
    -webkit-column-gap: 80px; 
    -moz-column-gap: 80px;
    column-gap: 80px; 
}

/* 2. БАЗОВЫЙ ВИД ССЫЛОК (СЕРЫЙ) */
#rec1865154791 .t420__descr a,
#rec1865154791 .t420__descr a span {
    display: block;
    text-decoration: none !important;
    color: #999999 !important; /* Серый цвет в покое */
    font-family: 'Roboto', Arial, sans-serif;
    font-weight: 400; 
    font-size: 18px; 
    line-height: 1.5;
    margin-bottom: 12px;
    
    /* Чтобы ссылки не разрывались между колонками */
    break-inside: avoid-column;
    -webkit-column-break-inside: avoid;
    margin-left: 100px;
    
}

/* 3. ВИД ПРИ НАВЕДЕНИИ (ЗОЛОТОЙ #B1965D) */
/* Мы красим и саму ссылку, и любые теги внутри неё */
#rec1865154791 .t420__descr a:hover,
#rec1865154791 .t420__descr a:hover span,
#rec1865154791 .t420__descr a:hover div {
    color: #B1965D !important;
}

/* 4. УБИРАЕМ ЛИШНИЕ ПЕРЕНОСЫ */
#rec1865154791 .t420__descr br {
    display: none;
}

/* МОБИЛЬНАЯ ВЕРСИЯ */
media screen and (min-width: 960px) {
    #rec1865154791 .t420__descr {
        column-count: 2;
        column-gap: 80px; 
    }
    #rec1865154791 .t420__descr a {
        font-size: 16px;
        margin-bottom: 15px;
    }
}

/* =======================================
   ВЕРСИЯ ДЛЯ МОБИЛЬНЫХ (IPHONE И ДР.)
   ======================================= */
media screen and (min-width: 960px) {
    /* Возвращаем стандартное поведение для контейнера, чтобы он не ехал вправо */
    #rec1865154791 .t-container {
        display: block !important;
    }
    
    #rec1865154791 .t420__descr {
        column-count: 2;
        column-gap: 80px; 
    }
    #rec1865154791 .t420__descr a {
        font-size: 16px;
        margin-bottom: 15px;
    }
}


/* =======================================
   ВЕРСИЯ ДЛЯ ПЛАНШЕТОВ И МОБИЛЬНЫХ
   ======================================= */
@media screen and (max-width: 959px) {
    #rec1865154791 .t420__col {
        width: 100% !important;
        max-width: 100% !important;
        text-align: center !important;
        float: none !important;
        display: block !important;
    }

    /* ОТСТУП ПОД ЛОГОТИПОМ НА МОБИЛКЕ */
    #rec1865154791 .t420__logo {
        margin: 0 auto 60px !important; /* Увеличил отступ под лого */
    }

    /* КОЛОНКИ НА МОБИЛКЕ */
    #rec1865154791 .t420__descr {
        column-count: 2 !important;
        column-gap: 30px !important; /* Расстояние между колонками на мобилке */
        text-align: left !important;
        display: block !important;
        max-width: 300px; /* Ограничил ширину, чтобы не разлетались */
        margin: 0 auto;
    }

    #rec1865154791 .t420__descr a {
        font-size: 14px !important;
        margin-bottom: 14px !important;
        line-height: 1.4 !important;
    }


    #rec1865154791 .t420__descr a, #rec1865154791 .t420__descr a span {

    margin-left: 0px;
}


 #rec1865154791 .t420__logo {
        margin: 0 auto 25px !important; /* Было 60px, стало 25px */
    }
    
    
    #rec1865154791 .t420__descr a {
        font-size: 16px !important;
        margin-bottom: 14px !important;
        line-height: 1.4 !important;
    }
    
 
    
    
    
}   
 
    
 @media screen and (max-width: 960px) {
    .t420__col.t-col_3 {
        max-width: 320px;
        display: inline;
        float: left;
        margin-bottom: 30px;
    }
}   






/* 1. Максимально жесткий селектор через атрибут [data-record-type] и твой класс */
[data-record-type="192"].uc-informationt .t174__textwrapper,
[data-record-type="192"].uc-informationt .t174__title,
[data-record-type="192"].uc-informationt .t174__descr,
[data-record-type="192"].uc-informationt .t174__uptitle, /* Тот самый надзаголовок */
[data-record-type="192"].uc-informationt .t-align_center {
    text-align: left !important;
    margin-left: 0 !important;      /* Убираем центровку самого блока с текстом */
    margin-right: auto !important;  /* Выталкиваем пустоту вправо */
    max-width: 100% !important;     /* Разрешаем тексту занимать всю ширину */
}

/* 2. Дополнительно прижимаем строки внутри плашки */
[data-record-type="192"].uc-informationt .t174__trow {
    text-align: left !important;
    justify-content: flex-start !important;
}

/* 3. Дублируем по ID и добавляем сюда uptitle (шапку), чтобы точно сработало */
#rec1944859161 .t174__title, 
#rec1944859161 .t174__descr,
#rec1944859161 .t174__uptitle {
    margin-left: 0 !important;
    margin-right: auto !important;
    text-align: left !important;
}
</style>







