/* ==========================================================================
   Главная страница
   Подключается только здесь и только после tokens.css: сетки этой страницы
   больше нигде не встречаются, и держать их в общем файле значило бы
   грузить их на шестнадцати тысячах листингов.

   Все цвета, отступы и радиусы берутся из переменных tokens.css. Своих
   значений тут ровно два вида: пропорции картинок и точки перелома сеток.
   ========================================================================== */

/* ==========================================================================
   Ритм секций
   Раньше секции набирались утилитами по месту: одна была full-bleed белой,
   вторая белым контейнером без вертикальных отступов, третья белой
   карточкой со скруглением. Между заголовком на белой полосе и карточками
   под ним на сером фоне шел видимый шов.

   Три типа по весу, а не один: обычная, с собственным фоном и акцентная.
   Восемь одинаковых секций подряд читаются как один длинный список.
   ========================================================================== */

.tp-section { padding-block: var(--tp-7); }

.tp-section--surface {
    background: var(--tp-surface);
    border-block: 1px solid var(--tp-border);
}

.tp-section--accent {
    background: var(--tp-surface-accent);
    border-block: 1px solid var(--tp-border);
}

.tp-section__head {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--tp-2) var(--tp-4);
    margin-bottom: var(--tp-5);
}

.tp-section__title {
    margin: 0;
    font-size: var(--tp-fs-2xl);
    font-weight: 600;
    color: var(--tp-ink);
    text-wrap: balance;
}

.tp-section__note {
    margin: var(--tp-1) 0 0;
    max-width: 60ch;
    color: var(--tp-ink-muted);
    font-size: var(--tp-fs-sm);
}

.tp-section__link {
    /* Ссылка рядом с заголовком - самостоятельная цель, а не слово в строке:
       без своей высоты она была 21 пиксель. */
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    color: var(--tp-link);
    font-size: var(--tp-fs-sm);
    font-weight: 500;
    text-decoration: none;
}
.tp-section__link:hover { text-decoration: underline; }

.tp-subhead {
    margin: var(--tp-7) 0 var(--tp-3);
    font-size: var(--tp-fs-lg);
    font-weight: 600;
    color: var(--tp-ink);
}

/* ==========================================================================
   Первый экран в синей полосе шапки
   H1 и лид оформлены в site-header.css (.tp-sh__h1, .tp-sh__lead), цвета
   полосы берутся из ее переменных (--tp-sh-*). Здесь виджет поиска и цифры
   на синем: поля белые 56 px, главная кнопка янтарная с темным текстом
   (белый на янтарном не проходит контраст). Фото города, затемнения и тени
   нет (проект шапки сайта, решения 1 и 5).
   ========================================================================== */

.tp-home-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 24px;
    margin: 20px 0 0;
    padding: 0;
    list-style: none;
    color: var(--tp-sh-muted);
    font-size: var(--tp-fs-sm);
    line-height: 1.5;
}

.tp-home-stats b {
    color: var(--tp-sh-ink);
    font-size: 18px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.tp-home-search {
    margin-top: 24px;
}

/* От 992 px цифры встают в строку переключателя режимов справа: отдельной
   строкой под наклейками они добавляли полосе 47 px. Виджет растворяется в
   сетке (display: contents), его части становятся ее ячейками; порядок в
   разметке прежний, цифры в ней после виджета. */
@media (min-width: 992px) {
    .tp-home-search {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr);
        column-gap: 24px;
    }
    .tp-home-search > .tp-find { display: contents; }
    .tp-home-search .tp-find__tabs {
        grid-column: 1;
        grid-row: 1;
        justify-self: start;
    }
    .tp-home-search > .tp-home-stats {
        grid-column: 2;
        grid-row: 1;
        align-self: center;
        justify-content: flex-end;
        margin: 0 0 12px;
    }
    .tp-home-search .tp-find__panel,
    .tp-home-search .tp-find__quick {
        grid-column: 1 / -1;
    }
}

/* ==========================================================================
   Поисковый виджет
   ========================================================================== */

/* Переключатель режимов: полупрозрачная белая подложка полосы, выбранный
   режим белый с темным текстом. Янтарь оставлен главной кнопке: два
   янтарных пятна рядом спорили бы, куда нажимать. */
.tp-find__tabs {
    display: inline-flex;
    gap: 4px;
    margin: 0 0 12px;
    padding: 4px;
    border-radius: var(--tp-r-pill);
    background: var(--tp-sh-soft);
}

.tp-find__tab {
    min-height: 44px;
    padding: 0 20px;
    border: 0;
    border-radius: var(--tp-r-pill);
    background: transparent;
    color: var(--tp-sh-ink);
    font: inherit;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
}
.tp-find__tab:hover { background: var(--tp-sh-soft-hover); }

.tp-find__tab[aria-selected="true"] {
    background: #fff;
    color: var(--tp-sh-accent-ink);
}

.tp-find__panel {
    color: var(--tp-sh-ink);
}

.tp-find__form {
    display: grid;
    gap: 8px;
    grid-template-columns: 1fr;
}

@media (min-width: 768px) {
    .tp-find__form {
        grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr) auto;
        align-items: end;
    }
}

.tp-find__field { position: relative; min-width: 0; }

/* Подписи остаются для читалок, на экране поле говорит подсказкой внутри:
   «Город или страна», «Любые даты». Видимые подписи над полями добавляли
   полосе 24 пикселя. */
.tp-find__label {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.tp-find__input {
    display: block;
    width: 100%;
    height: 56px;
    padding: 0 16px;
    border: 0;
    border-radius: 8px;
    background: #fff;
    color: var(--tp-ink);
    font: inherit;
    font-size: 18px;
}

.tp-find__input::placeholder { color: var(--tp-ink-muted); }
.tp-find__input:focus-visible {
    outline: 2px solid var(--tp-sh-ink);
    outline-offset: 2px;
}

#daterange { cursor: pointer; }

.tp-find__submit {
    height: 56px;
    padding: 0 32px;
    border: 0;
    border-radius: 8px;
    background: var(--tp-sh-accent);
    color: var(--tp-sh-accent-ink);
    font: inherit;
    font-size: 18px;
    font-weight: 600;
    cursor: pointer;
}
.tp-find__submit:hover { text-decoration: underline; }

/* --- подсказки городов --- */

.tp-find__suggest {
    position: absolute;
    top: 100%;
    inset-inline: 0;
    z-index: 20;
    margin: var(--tp-1) 0 0;
    padding: var(--tp-1);
    max-height: 17rem;
    overflow-y: auto;
    list-style: none;
    border: 1px solid var(--tp-border);
    border-radius: var(--tp-r-md);
    background: var(--tp-surface);
    box-shadow: var(--tp-shadow-md);
}

.tp-find__suggest li {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--tp-3);
    min-height: 40px;
    padding: var(--tp-2) var(--tp-3);
    border-radius: var(--tp-r-sm);
    color: var(--tp-ink);
    font-size: var(--tp-fs-sm);
    cursor: pointer;
}
.tp-find__suggest li[aria-selected="true"],
.tp-find__suggest li:hover { background: var(--tp-surface-accent); }
.tp-find__suggest .muted { color: var(--tp-ink-muted); }

/* --- частые запросы: наклейки полосы (.tp-sh__chips, .tp-sh__chip) --- */

.tp-find__quick { align-items: center; }

.tp-find__quick-label {
    color: var(--tp-sh-muted);
    font-size: var(--tp-fs-xs);
    letter-spacing: .04em;
    text-transform: uppercase;
    font-weight: 600;
}

/* Узкая AI-форма в полосе: без своей подложки и рамки, поле и кнопка в
   строку как у поиска по городу. Подпись для читалок, как у полей выше. */
.tp-find__panel .tp-ai-form {
    padding: 0;
    border: 0;
    background: transparent;
}

.tp-find__panel .tp-ai-form__box {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: 8px;
}

.tp-find__panel .tp-ai-form__label {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.tp-find__panel .tp-ai-form__state {
    grid-column: 1 / -1;
    color: var(--tp-sh-ink);
}

.tp-find__panel .tp-ai-form__input {
    display: block;
    height: 56px;
    min-height: 56px;
    padding: 14px 16px;
    border: 0;
    border-radius: 8px;
    font-size: 18px;
    line-height: 28px;
    resize: none;
}
.tp-find__panel .tp-ai-form__input:focus-visible {
    outline: 2px solid var(--tp-sh-ink);
    outline-offset: 2px;
}

.tp-find__panel .tp-ai-form__submit,
.tp-find__panel .tp-ai-form__submit:hover:not(:disabled) {
    height: 56px;
    padding: 0 32px;
    border-radius: 8px;
    background: var(--tp-sh-accent);
    color: var(--tp-sh-accent-ink);
    font-size: 18px;
}
.tp-find__panel .tp-ai-form__submit:hover:not(:disabled) { text-decoration: underline; }

/* На телефоне поля и кнопки друг под другом во всю ширину. Поле AI-поиска
   в две строки: подсказка в одну не помещается и обрезается. */
@media (max-width: 767.98px) {
    .tp-find__panel .tp-ai-form__box { grid-template-columns: 1fr; }
    .tp-find__panel .tp-ai-form__input { height: auto; min-height: 84px; }
}

/* ==========================================================================
   Полоса идей
   Единственная секция с боковым заголовком. Она стоит там, где начинается
   монотонность, и ломает ее сменой формы, а не цветом.
   ========================================================================== */

.tp-ideas {
    background: var(--tp-surface-tint);
    border-block: 1px solid var(--tp-border);
}

.tp-ideas__layout { display: grid; gap: var(--tp-5); }

@media (min-width: 992px) {
    .tp-ideas__layout {
        grid-template-columns: minmax(0, 15rem) minmax(0, 1fr);
        gap: var(--tp-6);
        align-items: center;
    }
}

.tp-ideas__intro .tp-section__note { margin-top: var(--tp-2); }

/* Дорожка прокручивается вбок: шесть карточек в столбик это шесть экранов
   до следующего блока. Полоса прокрутки живет внутри дорожки, тело
   страницы вбок не едет. */
/* Последняя карточка обрезается краем дорожки - это и есть подсказка, что
   вбок есть еще. Без растушевки она читается не как прокрутка, а как
   поломка, поэтому край гасится маской. */
.tp-ideas__track {
    -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 48px), transparent);
    mask-image: linear-gradient(to right, #000 calc(100% - 48px), transparent);
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(15rem, 17rem);
    gap: var(--tp-3);
    margin: 0;
    padding: 0 0 var(--tp-2);
    list-style: none;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: thin;
    overscroll-behavior-x: contain;
}

.tp-ideas__track.is-end {
    -webkit-mask-image: none;
    mask-image: none;
}

.tp-idea { scroll-snap-align: start; }

.tp-idea__link {
    position: relative;
    display: block;
    height: 100%;
    min-height: 13rem;
    overflow: hidden;
    border-radius: var(--tp-r-lg);
    background: var(--tp-surface-accent);
    color: #fff;
    text-decoration: none;
    box-shadow: var(--tp-shadow-sm);
}

.tp-idea__photo {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .5s ease;
}

.tp-idea__link:hover .tp-idea__photo,
.tp-idea__link:focus-visible .tp-idea__photo { transform: scale(1.06); }
.tp-idea__link:focus-visible { outline: 2px solid var(--tp-link); outline-offset: 2px; }

.tp-idea__body {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    gap: var(--tp-1);
    height: 100%;
    min-height: 13rem;
    padding: var(--tp-7) var(--tp-4) var(--tp-4);
    background: linear-gradient(rgba(9, 15, 19, 0) 20%, rgba(9, 15, 19, .55) 58%, rgba(9, 15, 19, .9));
}

.tp-idea__title { font-weight: 600; line-height: 1.25; text-wrap: balance; }
.tp-idea__count { font-size: var(--tp-fs-xs); color: rgba(255, 255, 255, .82); }

/* ==========================================================================
   Полоса городов
   ========================================================================== */

.tp-citybar {
    display: flex;
    flex-wrap: wrap;
    gap: var(--tp-2);
    margin: 0;
    padding: 0;
    list-style: none;
}

.tp-citybar__btn {
    display: inline-flex;
    align-items: center;
    gap: var(--tp-2);
    /* 36 по высоте плюс зазор в 8: цель не меньше 24x24 с учетом отступов */
    min-height: 36px;
    padding: 0 var(--tp-4);
    border: 1px solid var(--tp-border);
    border-radius: var(--tp-r-pill);
    background: var(--tp-surface);
    color: var(--tp-ink);
    font-size: var(--tp-fs-sm);
    font-weight: 500;
    cursor: pointer;
}

.tp-citybar__btn:hover {
    border-color: var(--tp-border-strong);
    background: var(--tp-surface-tint);
}
.tp-citybar__btn:focus-visible { outline: 2px solid var(--tp-link); outline-offset: 2px; }

.tp-citybar__btn[aria-pressed="true"] {
    background: var(--tp-ink);
    border-color: var(--tp-ink);
    color: #fff;
}

/* Счетчик стоял в <sup> курсивом - на телефоне это девять пикселей над
   строкой. */
.tp-citybar__count {
    color: var(--tp-ink-muted);
    font-size: var(--tp-fs-xs);
    font-variant-numeric: tabular-nums;
}
.tp-citybar__btn[aria-pressed="true"] .tp-citybar__count { color: rgba(255, 255, 255, .78); }

/* Во всю ширину контейнера это поле выглядело как главный поиск страницы,
   хотя фильтрует десять кнопок над собой. */
.tp-city-search { max-width: 22rem; }

/* ==========================================================================
   Форматы
   ========================================================================== */

.tp-formats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--tp-3);
    margin: 0;
    padding: 0;
    list-style: none;
}

@media (min-width: 576px) { .tp-formats { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 992px) { .tp-formats { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 1200px) { .tp-formats { grid-template-columns: repeat(6, minmax(0, 1fr)); } }

.tp-format__link {
    position: relative;
    display: block;
    overflow: hidden;
    /* Пропорция задана здесь, а не высотой картинки: место занято до того,
       как картинка доехала, и сетка не прыгает. */
    aspect-ratio: 16 / 11;
    border-radius: var(--tp-r-md);
    background: var(--tp-surface-tint);
    color: #fff;
    text-decoration: none;
}

.tp-format__photo {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .5s ease;
}
.tp-format__link:hover .tp-format__photo { transform: scale(1.07); }
.tp-format__link:focus-visible { outline: 2px solid var(--tp-link); outline-offset: 2px; }

.tp-format__body {
    position: absolute;
    inset-inline: 0;
    bottom: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: var(--tp-6) var(--tp-3) var(--tp-3);
    background: linear-gradient(rgba(9, 15, 19, 0) 15%, rgba(9, 15, 19, .55) 55%, rgba(9, 15, 19, .9));
}

.tp-format__name { font-weight: 600; font-size: var(--tp-fs-sm); line-height: 1.25; }
.tp-format__count { font-size: var(--tp-fs-xs); color: rgba(255, 255, 255, .8); }

/* Категория без картинки. Их 25 из 145, и заглушка вместо фотографии
   выглядела бы поломкой - типографская плитка выглядит решением. */
.tp-format--plain .tp-format__link {
    display: flex;
    align-items: flex-end;
    background: var(--tp-surface-accent);
    color: var(--tp-ink);
    box-shadow: var(--tp-ring);
}
.tp-format--plain .tp-format__body { position: static; padding: var(--tp-3); background: none; }
.tp-format--plain .tp-format__name { font-size: var(--tp-fs-md); }
.tp-format--plain .tp-format__count { color: var(--tp-ink-muted); }

/* Достопримечательности города. Раньше они были второй вкладкой над стеной
   ссылок; вкладка ушла, ссылки остались - это живые страницы. */
.tp-sights {
    display: flex;
    flex-wrap: wrap;
    gap: var(--tp-2);
    margin: 0;
    padding: 0;
    list-style: none;
}

.tp-sights a {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: 0 var(--tp-3);
    border: 1px solid var(--tp-border);
    border-radius: var(--tp-r-pill);
    background: var(--tp-surface);
    color: var(--tp-link);
    font-size: var(--tp-fs-sm);
    text-decoration: none;
}
.tp-sights a:hover { border-color: var(--tp-border-strong); background: var(--tp-surface-tint); }

/* ==========================================================================
   Направления
   ========================================================================== */

.tp-countries { display: grid; gap: var(--tp-5); }

@media (min-width: 992px) {
    .tp-countries {
        grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
        gap: var(--tp-6);
        align-items: start;
    }
}

.tp-countries__cards {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--tp-3);
    margin: 0;
    padding: 0;
    list-style: none;
}

/* Плитка страны (tp-country) - в tokens.css с задачи 29: ее показывает и
   каталог отелей /hotels, где этот файл не подключается. */

/* Остальные страны текстом: так их влезает вчетверо больше, чем плитками,
   и секция перестает быть третьей подряд сеткой картинок. */
.tp-countries__list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 var(--tp-5);
    margin: 0;
    padding: 0;
    list-style: none;
}

@media (min-width: 576px) and (max-width: 991px) {
    .tp-countries__list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

.tp-countries__list li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--tp-3);
    border-bottom: 1px solid var(--tp-border);
    font-size: var(--tp-fs-sm);
}

/* Отступ на ссылке, а не на строке: иначе цель высотой 21 пиксель внутри
   строки высотой 37. */
.tp-countries__list a {
    flex: 1 1 auto;
    padding: var(--tp-2) 0;
    color: var(--tp-link);
    text-decoration: none;
}
.tp-countries__list a:hover { text-decoration: underline; }
.tp-countries__num { color: var(--tp-ink-muted); font-variant-numeric: tabular-nums; }

/* ==========================================================================
   Почему Tripse
   ========================================================================== */

.tp-why {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--tp-4);
    margin: 0;
    padding: 0;
    list-style: none;
}

@media (min-width: 576px) { .tp-why { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 992px) { .tp-why { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

.tp-why__item {
    display: grid;
    gap: var(--tp-2);
    align-content: start;
    padding: var(--tp-5);
    border-radius: var(--tp-r-lg);
    background: var(--tp-surface);
    box-shadow: var(--tp-ring);
}

.tp-why__item .bi { font-size: 1.5rem; color: var(--tp-link); line-height: 1; }
.tp-why__item h3 { margin: 0; font-size: var(--tp-fs-lg); font-weight: 600; text-wrap: balance; }
.tp-why__item p { margin: 0; color: var(--tp-ink-muted); font-size: var(--tp-fs-sm); }

/* ==========================================================================
   Отзывы
   ========================================================================== */

.tp-reviews__head { align-items: center; }

.tp-score {
    display: flex;
    align-items: baseline;
    gap: var(--tp-3);
    margin: 0;
    padding: var(--tp-2) var(--tp-4);
    border-radius: var(--tp-r-md);
    background: var(--tp-surface-accent);
}

.tp-score b {
    font-size: 2.5rem;
    font-weight: 600;
    line-height: 1;
    color: var(--tp-ink);
    font-variant-numeric: tabular-nums;
}

.tp-score span {
    max-width: 14ch;
    color: var(--tp-ink-muted);
    font-size: var(--tp-fs-sm);
}

/* Заголовок у карусели свой, поэтому в ее шапке остаются одни стрелки. */
.tp-section .reviews-section .section-header { justify-content: flex-end; }

/* ==========================================================================
   Как это работает и вопросы
   ========================================================================== */

.tp-how {
    display: grid;
    gap: var(--tp-5) var(--tp-4);
    grid-template-columns: 1fr;
    margin: 0 0 var(--tp-7);
    padding: 0;
    list-style: none;
}

/* Колонки заданы явно, а не через auto-fit: на широком экране auto-fit
   нарезал пять дорожек под четыре шага, и справа оставалась пустая. */
@media (min-width: 576px) { .tp-how { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 992px) { .tp-how { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

.tp-how__item {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-rows: 32px auto;
    gap: var(--tp-2) var(--tp-3);
    align-items: start;
    /* Иначе лишняя высота растекается по строкам: у шага с текстом на три
       строки первая строка выросла с 32 до 42.5, и его заголовок встал на
       пять пикселей ниже, чем у шага с текстом на четыре строки. */
    align-content: start;
}

.tp-how__num {
    display: grid;
    place-items: center;
    width: 32px;
    height: 32px;
    border-radius: var(--tp-r-pill);
    background: var(--tp-surface-accent);
    color: var(--tp-link);
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.tp-how__title {
    margin: 0;
    align-self: center;
    font-size: var(--tp-fs-md);
    font-weight: 600;
    color: var(--tp-ink);
}

.tp-how__text {
    grid-column: 2;
    margin: 0;
    color: var(--tp-ink-muted);
    font-size: var(--tp-fs-sm);
}

.tp-faq__title {
    margin: 0 0 var(--tp-4);
    font-size: var(--tp-fs-lg);
    font-weight: 600;
}

/* Две колонки на широком экране. Одной колонкой список занимал 582
   пикселя из 1320 и оставлял справа 738 пустых: ограничение ширины строки
   нужно ради чтения, но пустая половина экрана - не то, чем его платить. */
.tp-faq__list {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0 var(--tp-7);
    margin: 0;
}

@media (min-width: 992px) {
    .tp-faq__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.tp-faq__item { max-width: 62ch; }

.tp-faq__list dt {
    padding: var(--tp-4) 0 var(--tp-1);
    border-top: 1px solid var(--tp-border);
    font-weight: 600;
    color: var(--tp-ink);
}

.tp-faq__list dd {
    margin: 0 0 var(--tp-3);
    color: var(--tp-ink-muted);
    font-size: var(--tp-fs-sm);
}

/* ==========================================================================
   Движение
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {
    .tp-idea__photo,
    .tp-format__photo { transition: none; }
    .tp-idea__link:hover .tp-idea__photo,
    .tp-format__link:hover .tp-format__photo { transform: none; }
    .tp-ideas__track { scroll-snap-type: none; }
}
