/* Геометрия бегущих лент — с первой отрисовки.
 *
 * Эти правила раньше приезжали внутри скрипта, и до его запуска лента
 * показывалась тильдовской раскладкой: плитки вставали столбиком, лента
 * занимала 2240 px вместо 150, а потом схлопывалась. Обе ленты стоят в самом
 * верху главной, поэтому вся страница под ними подпрыгивала на две тысячи
 * пикселей. Дима это и увидел: «при загрузке поддёргивался экран».
 *
 * Теперь размеры стоят в таблице стилей и действуют сразу. В скрипте осталось
 * только само движение: у каждой ленты свои кадры анимации и своя длительность,
 * их в общий файл не вынести.
 *
 * Правила повторяют прежние один в один, включая !important: у Тильды свои
 * размеры плиток, и без него они перебивают.
 *
 * Ширины контейнера здесь нет намеренно. Там, где уцелел тильдин скрипт
 * («Труппа», «Афиша»), он задаёт её сам — 2848 px на широком экране, 1200 на
 * телефоне, — и от неё считается его анимация. Наш max-content сломал бы ей
 * математику. Поэтому ширину контейнера ставит только наш скрипт и только на
 * своих лентах.
 *
 * Размеры сверены на всех четырёх страницах с лентами: плитка и кадр 356×267
 * на широком экране, 150×150 на телефоне — везде одинаково.
 */

[data-record-type="552"] {
    overflow: hidden !important;
}

[data-record-type="552"] .t552 {
    display: flex;
    transform: rotate(0deg);
    z-index: 1;
    white-space: nowrap;
    position: relative;
}

[data-record-type="552"] .t552__container {
    flex-shrink: 0;
}

[data-record-type="552"] .t552__tile {
    width: 356px !important;
    margin: 0 !important;
    transition: all 0.1s ease-in-out;
}

[data-record-type="552"] .t552__blockimg {
    width: 356px !important;
    height: 267px !important;
}

@media (max-width: 640px) {
    [data-record-type="552"] .t552__tile {
        width: 150px !important;
    }

    [data-record-type="552"] .t552__blockimg {
        width: 150px !important;
        height: 150px !important;
    }
}
