/* ==========================================================================
   Страница дерматоскопа Stern Derma (stern_derma_i.html)
   Десктоп не трогаем ("на ПК всё супер") — только адаптация под мобильный.
   ========================================================================== */

@media (max-width: 860px) {

    /* ---- "слайдер" сверху ----
       На этой странице в разметку прямо вшит УЖЕ отработавший результат
       bxSlider (готовые .bx-wrapper/.bx-viewport с инлайновыми стилями:
       фиксированная высота вьюпорта height:595px и слайд
       position:absolute; width:1903px) — картинок там реально одна, это
       не настоящая карусель, а статичное фото с заголовком поверх. На
       телефоне фиксированные инлайн-пиксели ломают всё; общие правила
       .slider/.slide-content/.slider h1 из adaptive.css уже переводят
       текст под фото в обычный поток — здесь дополнительно снимаем
       фиксированную высоту/абсолютное позиционирование именно у bxSlider-
       обёртки (инлайн-стили перебиваются только через !important). */
    .bx-viewport {
        height: auto !important;
    }
    .slider .bx-wrapper li {
        position: static !important;
        width: 100% !important;
    }

    /* ---- "Преимущества Stern Derma" (.derma-i) ----
       Тот же float-паттерн, что чинили на странице ЛОР-комбайна
       (.innovations-lor-kombajn-stern) — 2 колонки по 390/350px, на
       телефоне шире экрана. Здесь без инлайновых отрицательных отступов,
       поэтому текст не "наслаивается" как там, но горизонтальный
       оверфлоу тот же — сбрасываем в одну колонку. */
    .derma-i .item,
    .derma-i .item.pull-right {
        float: none;
        width: 100%;
        text-align: left;
    }
    /* декоративное фото позади блока (stern_derma_i_option.png, без
       background-size) не подогнано под мобильную ширину/высоту — при
       одноколоночной раскладке накладывается на текст криво. Проще убрать
       на мобильном, чем городить отдельный адаптивный вариант. */
    .derma-i {
        background-image: none;
    }
}
