/* ==========================================================================
   Укок — точечные правки вёрстки Tilda Zero Block.

   Зачем это нужно.
   Блоки Zero Block расставляют элементы по фиксированным координатам.
   Высота под заголовок заложена на ОДНУ строку, и если текст в неё не
   влезает, он переносится на вторую и наезжает на абзац ниже. Именно это
   происходило на широких экранах.

   Замеры (шрифт Unbounded 40px, ширина бокса 693px):
     «Tрехместный домик № 0…№7»   633–652px  — помещается
     «Четырехместный домик №8/4/9» 737–739px  — НЕ помещается
     «Забронируйте свой отдых…»   1795px     — уходило в 3 строки
   При 36px самый длинный заголовок занимает 665px и снова умещается
   в одну строку.

   Правки действуют только от 1200px. Ниже Tilda переключается на
   мобильную раскладку Zero Block (25px и 27px), где всё и так помещается,
   и туда лезть не нужно.

   Лишний #allrecords в селекторе — чтобы перебить <style> внутри самих
   блоков: они идут в документе ПОСЛЕ этого файла.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Страница нарисована под светлый фон, но фон нигде не задан: html, body и
   все блоки прозрачные, а белый цвет давал сам холст браузера. В режимах
   «тёмная тема» (автозатемнение на телефонах, окна с тёмным холстом)
   холст чёрный, и тёмно-серые заголовки (#2e2e2e) становятся нечитаемыми.
   Фиксируем светлую схему и белый фон явно.
   -------------------------------------------------------------------------- */
:root { color-scheme: light; }
html, body.t-body { background-color: #fff; }

/* Пока фото слайда в галерее ещё не пришло (js/ukok-lazy.js грузит их
   по мере подъезда), вместо пустой дыры — спокойная заливка. */
.tn-atom__slds-img[data-uk-src]:not([data-uk-done]) { background-color: #ece8e1; }


@media screen and (min-width: 1200px) {

    /* --- Заголовки карточек домиков: 40px -> 36px.
           Меняем у всех десяти, чтобы карточки выглядели одинаково. --- */
    #allrecords #rec4048421001 .tn-elem[data-elem-id="1470210011265"] .tn-atom,
    #allrecords #rec4048421101 .tn-elem[data-elem-id="1470210011265"] .tn-atom,
    #allrecords #rec4048421201 .tn-elem[data-elem-id="1470210011265"] .tn-atom,
    #allrecords #rec4048421301 .tn-elem[data-elem-id="1470210011265"] .tn-atom,
    #allrecords #rec4048421401 .tn-elem[data-elem-id="1470210011265"] .tn-atom,
    #allrecords #rec4048421501 .tn-elem[data-elem-id="1470210011265"] .tn-atom,
    #allrecords #rec4048421601 .tn-elem[data-elem-id="1470210011265"] .tn-atom,
    #allrecords #rec4048421701 .tn-elem[data-elem-id="1470210011265"] .tn-atom,
    #allrecords #rec4048421801 .tn-elem[data-elem-id="1470210011265"] .tn-atom,
    #allrecords #rec4048421901 .tn-elem[data-elem-id="1470210011265"] .tn-atom {
        font-size: 36px !important;
    }

    /* --- Блок «Забронируйте свой отдых на Алтае…».
           Заголовок вставал в 3 строки и ложился на кнопку «Забронировать».
           Расширяем бокс до свободного края карточки и снижаем кегль:
           получается 2 строки, между ними и кнопкой остаётся ~22px. --- */
    #allrecords #rec4048422001 .tn-elem[data-elem-id="1470210011265"] {
        width: 760px !important;
    }
    #allrecords #rec4048422001 .tn-elem[data-elem-id="1470210011265"] .tn-atom {
        font-size: 32px !important;
    }

    /* --- «Наши домики»: 96px Unbounded = 874px в одну строку, а бокс 732px.
           «домики» уходило на вторую строку и обрезалось границей блока
           (высота блока 160px). Расширяем бокс, кегль не трогаем. --- */
    #allrecords #rec4048420901 .tn-elem[data-elem-id="1470209944682"] {
        width: 1000px !important;
    }
}


/* --------------------------------------------------------------------------
   Мобильная раскладка Zero Block (всё, что уже 1200px).

   Здесь та же беда, но в другом месте. Заголовок «Tрехместный домик № N»
   на мобильной раскладке идёт 25px/39px в боксе 320px и занимает ДВЕ
   строки: 405px + 78px = низ на 483px. А описание начинается с 469px —
   наезд 14px, одинаковый у всех семи трёхместных домиков.
   У четырёхместных описание стоит на 509px, поэтому они целы.

   Сдвигаем описание трёхместных на 495px:
     зазор от заголовка  12px
     запас до кнопки     минимум 16px (было 42–67px, съедаем 26px)
   -------------------------------------------------------------------------- */

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

    #allrecords #rec4048421001 .tn-elem[data-elem-id="1742627706977"],
    #allrecords #rec4048421101 .tn-elem[data-elem-id="1742627706977"],
    #allrecords #rec4048421201 .tn-elem[data-elem-id="1742627706977"],
    #allrecords #rec4048421301 .tn-elem[data-elem-id="1742627706977"],
    #allrecords #rec4048421401 .tn-elem[data-elem-id="1742627706977"],
    #allrecords #rec4048421501 .tn-elem[data-elem-id="1742627706977"],
    #allrecords #rec4048421601 .tn-elem[data-elem-id="1742627706977"] {
        top: 495px !important;
    }

    /* «Наши домики» на телефоне: 45px = 410px текста, экран 375px и уже —
       слово обрезалось по краям. Кегль привязан к ширине экрана, но не
       больше исходных 45px: 375px -> 34.5px, 320px -> 29.4px. */
    #allrecords #rec4048420901 .tn-elem[data-elem-id="1470209944682"] .tn-atom {
        font-size: min(45px, 9.2vw) !important;
    }
}