/* Мобильная шапка и первый экран, только до 767px (20.10.2026). ПК не затрагивается. */
@media (max-width: 767px) {
  header { min-height: 0 !important; padding-top: 0 !important; padding-bottom: 0 !important; }
  header > .container { padding-top: 8px; padding-bottom: 8px; }
  body:not(.open-menu) header > .container > .row { flex-wrap: nowrap; }
  header .logo > img { height: 34px; width: auto !important; display: block; }

  /* телефон: та же ссылка (comagic, цели Метрики), номер скрыт, вместо него значок */
  header > .container > .row > .col-auto > div > a[href^="tel:"] {
    display: block; width: 40px; height: 40px; border-radius: 50%;
    font-size: 0 !important; line-height: 0; color: transparent !important; overflow: hidden; text-indent: -999px; white-space: nowrap;
    background: #FA8227 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M6.6 10.8a15.1 15.1 0 0 0 6.6 6.6l2.2-2.2c.3-.3.7-.4 1-.2 1.1.4 2.3.6 3.6.6.6 0 1 .4 1 1V20c0 .6-.4 1-1 1A17 17 0 0 1 3 4c0-.6.4-1 1-1h3.5c.6 0 1 .4 1 1 0 1.3.2 2.5.6 3.6.1.3 0 .7-.2 1z'/%3E%3C/svg%3E") center / 20px 20px no-repeat;
  }
  header > .container > .row > .col-auto > div > a[href^="tel:"]:active { background-color: #E06F17; }
  header > .container > .row > .col-auto > .gray.font-12 { display: none; }
  header > .container > .row > .col-auto { padding-left: 8px; }
  header .btn-max { width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; padding: 0; }
  header .btn-mmenu { width: 40px; height: 40px; }

  /* первый экран: карусель-карточки (22.10.2026), листается пальцем, без автопрокрутки */
  .slider-toppage-area, .slider-v2, .slider-v3-big { min-height: 0 !important; height: auto !important; }
  .slider-toppage-area > div:not(.slick-initialized):not(.container), .slider-v3-big:not(.slick-initialized) {
    display: flex !important; overflow-x: auto; scroll-snap-type: x mandatory; gap: 10px;
    padding: 12px 16px 0; scrollbar-width: none; -webkit-overflow-scrolling: touch;
  }
  .slider-toppage-area > div:not(.slick-initialized):not(.container)::-webkit-scrollbar, .slider-v3-big:not(.slick-initialized)::-webkit-scrollbar { display: none; }
  .slider-toppage-area > div:not(.slick-initialized):not(.container) > .slider-toppage-item,
  .slider-v3-big:not(.slick-initialized) > .slider-v2-item {
    flex: 0 0 88%; scroll-snap-align: center; height: 190px; min-height: 0 !important;
    border-radius: 16px; overflow: hidden; position: relative; display: flex !important; align-items: flex-end;
    background-size: cover; background-position: center;
  }
  .slider-toppage-area > div:not(.slick-initialized):not(.container) > .slider-toppage-item:only-child,
  .slider-v3-big:not(.slick-initialized) > .slider-v2-item:only-child { flex-basis: 100%; }
  .slider-toppage-area > div:not(.slick-initialized):not(.container) > .slider-toppage-item::before,
  .slider-v3-big:not(.slick-initialized) > .slider-v2-item::before {
    content: ''; position: absolute; inset: 0; z-index: 0;
    background: linear-gradient(180deg, rgba(41,31,38,0.05) 15%, rgba(41,31,38,0.88) 100%);
  }
  .slider-toppage-area > div:not(.slick-initialized):not(.container) > .slider-toppage-item > .container,
  .slider-v3-big:not(.slick-initialized) > .slider-v2-item > .container { position: relative; z-index: 1; padding: 14px 16px 16px; }
  .slider-toppage-area > div:not(.slick-initialized):not(.container) .slider-toppage-content {
    font-size: 14px; line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden;
  }
  .slider-toppage-area > div:not(.slick-initialized):not(.container) .row, .slider-v3-big:not(.slick-initialized) .row { min-height: 0 !important; }
  .slider-toppage-area > div:not(.slick-initialized):not(.container) h1, .slider-toppage-area > div:not(.slick-initialized):not(.container) .h1, .slider-v3-big:not(.slick-initialized) .slider-v2-title,
  .slider-toppage-area > div:not(.slick-initialized):not(.container) .slider-toppage-content > :first-child {
    font-size: 22px !important; line-height: 1.15 !important; margin: 0 0 6px !important; letter-spacing: -0.01em; text-wrap: balance; white-space: normal;
  }
  .slider-toppage-area > div:not(.slick-initialized):not(.container) .h1 br, .slider-toppage-area > div:not(.slick-initialized):not(.container) h1 br, .slider-v3-big:not(.slick-initialized) h1 br { display: none; }
  .slider-v3-big:not(.slick-initialized) .slider-v2-title h1 { font-size: inherit !important; line-height: inherit !important; margin: 0 !important; }
  .slider-v3-big:not(.slick-initialized) .btn, .slider-toppage-area > div:not(.slick-initialized):not(.container) .btn {
    margin-top: 8px !important; padding: 7px 16px !important; font-size: 14px !important; line-height: 1.2 !important;
  }
  .slider-toppage-area > div:not(.slick-initialized):not(.container) .slider-toppage-content *:not(h1):not(.h1):not(.btn) { font-size: 14px !important; line-height: 1.35 !important; margin-top: 0 !important; }
  .m-dots { display: flex; gap: 6px; justify-content: center; padding: 10px 0 2px; }
  .m-dots i { width: 16px; height: 3px; border-radius: 2px; background: #E7DDD6; transition: width .2s, background-color .2s; }
  .m-dots i.on { width: 28px; background: #FA8227; }
  @media (prefers-reduced-motion: reduce) { .m-dots i { transition: none; } }
}
}

/* единая форма обратного звонка на телефоне (21.10.2026): открытую форму под баннером и кнопку CoMagic скрываем,
   своя плавающая кнопка открывает #callback (та же форма comagic_sitePhoneCall, что в меню) */
.m-callback-fab { display: none; }
@media (max-width: 767px) {
  .slider-toppage-area > .container.py-5 { display: none !important; }
  .comagic-c-buttons { display: none !important; }
  .m-callback-fab {
    display: block; position: fixed; left: 16px; bottom: 20px; z-index: 990;
    width: 56px; height: 56px; border-radius: 50%;
    background: #FA8227 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M6.6 10.8a15.1 15.1 0 0 0 6.6 6.6l2.2-2.2c.3-.3.7-.4 1-.2 1.1.4 2.3.6 3.6.6.6 0 1 .4 1 1V20c0 .6-.4 1-1 1A17 17 0 0 1 3 4c0-.6.4-1 1-1h3.5c.6 0 1 .4 1 1 0 1.3.2 2.5.6 3.6.1.3 0 .7-.2 1z'/%3E%3Cpath fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M20 4l-5 5M15 5v4h4'/%3E%3C/svg%3E") center / 26px 26px no-repeat;
    box-shadow: 0 6px 16px rgba(250, 130, 39, 0.35);
  }
  .m-callback-fab:active { background-color: #E06F17; }
}

/* 22.10: шапка на узких экранах (320-359px): логотип + 3 кнопки не влезали, страница уезжала вбок на 10px */
@media (max-width: 359px) {
  body:not(.open-menu) header > .container > .row > .col-auto { padding-right: 6px; }
  body:not(.open-menu) header > .container > .row > .col-auto.mr-auto img { max-width: 132px; height: auto; }
}

/* 22.10: корзина в мобильной шапке (решение Дениса): кружок перед бургером, бейдж с числом только если товары есть */
@media (max-width: 767px) {
  header .hdr-cart-col { display: block !important; order: 1; padding-left: 8px; padding-right: 0; }
  header .hdr-burger-col { order: 2; }
  header .mmenu { order: 3; }
  header .hdr-cart-col .header-cart { position: relative; width: 40px; height: 40px; padding: 0; border-radius: 50%; background: #F3EEEA; justify-content: center; color: #453640; }
  header .hdr-cart-col .header-cart > i { margin: 0 !important; font-size: 17px; }
  header .hdr-cart-col .header-cart-cnt { position: absolute; top: -3px; right: -4px; min-width: 18px; height: 18px; padding: 0 4px; border-radius: 9px; font-size: 11px; line-height: 18px; box-shadow: 0 0 0 2px #fff; }
  header .hdr-cart-col .header-cart-cnt.is-zero { display: none; }
}
/* узкие экраны: четыре кнопки + логотип */
@media (max-width: 389px) {
  body:not(.open-menu) header > .container > .row > .col-auto { padding-left: 6px; padding-right: 0; }
  body:not(.open-menu) header > .container > .row > .hdr-burger-col { padding-right: 12px; }
  body:not(.open-menu) header > .container > .row > .col-auto.mr-auto { padding-left: 15px; }
  body:not(.open-menu) header > .container > .row > .col-auto.mr-auto img { height: auto !important; max-width: 128px; }
}
@media (max-width: 359px) {
  body:not(.open-menu) header > .container > .row > .col-auto { padding-left: 4px; }
  body:not(.open-menu) header > .container > .row > .col-auto.mr-auto img { max-width: 108px; }
  header > .container > .row > .col-auto > div > a[href^="tel:"], header .btn-max, header .btn-mmenu, header .hdr-cart-col .header-cart { width: 36px !important; height: 36px !important; }
}

/* 22.10: iPhone увеличивал страницу при быстрых нажатиях на стрелки (двойной тап). manipulation отключает зум по двойному тапу, щипок двумя пальцами остаётся */
@media (max-width: 767px) {
  html, body, a, button, [role="tab"], label { touch-action: manipulation; }
  .rv-arrows button, .rv-dots button, .coop-dots button, .pol-tabs button { -webkit-tap-highlight-color: transparent; }
}

/* 22.10: зазор между корзиной и бургером (Денис: стояли вплотную) */
@media (max-width: 767px) {
  body:not(.open-menu) header > .container > .row > .hdr-burger-col, body.open-menu header .hdr-burger-col { padding-left: 14px !important; }
}
@media (max-width: 359px) {
  body:not(.open-menu) header > .container > .row > .hdr-burger-col { padding-left: 8px !important; }
}
@media (max-width: 359px) {
  body:not(.open-menu) header > .container > .row > .col-auto:not(.mr-auto) { padding-left: 7px; }
  body:not(.open-menu) header > .container > .row > .hdr-burger-col { padding-left: 10px !important; padding-right: 10px; }
}
@media (max-width: 359px) {
  body:not(.open-menu) header > .container > .row > .col-auto:not(.mr-auto):not(.hdr-burger-col) { margin-left: 6px; }
}

/* 22.10: акция "Быстрый переезд" на телефоне - превью-плашка снизу вместо окна на весь экран (inc-fire-popup.php) */
@media (max-width: 767px) {
  .fire-teaser { position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 9990; display: flex; align-items: center; gap: 8px; padding: 10px 8px 10px 16px; background: #FA8227; border-radius: 16px; box-shadow: 0 10px 28px rgba(160, 70, 0, .35); transform: translateY(140%); opacity: 0; transition: transform .35s cubic-bezier(.2,.8,.2,1), opacity .35s; }
  .fire-teaser.is-in { transform: none; opacity: 1; }
  .fire-teaser button { border: 0; background: none; padding: 0; color: #fff; font: inherit; text-align: left; }
  .fire-teaser-open { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
  .fire-teaser-title { font-size: 16px; line-height: 1.2; font-weight: 700; }
  .fire-teaser-sub { font-size: 13px; line-height: 1.25; opacity: .92; }
  .fire-teaser-title { text-wrap: balance; }
  .fire-teaser-more { flex: 0 0 auto; background: #fff !important; color: #E06F17 !important; font-size: 14px !important; font-weight: 600 !important; padding: 9px 14px !important; border-radius: 20px; }
  .fire-teaser-close { flex: 0 0 32px; width: 32px; height: 32px; position: relative; opacity: .9; }
  .fire-teaser-close::before, .fire-teaser-close::after { content: ""; position: absolute; left: 9px; top: 15px; width: 14px; height: 2px; background: #fff; border-radius: 1px; transform: rotate(45deg); }
  .fire-teaser-close::after { transform: rotate(-45deg); }
  .fire-teaser button:focus { outline: none; }
  .fire-teaser button:focus-visible { outline: 2px solid #fff; outline-offset: 2px; border-radius: 8px; }
  body.has-fire-teaser .m-callback-fab, body.has-fire-teaser .to-top { opacity: 0; pointer-events: none; }
  @media (prefers-reduced-motion: reduce) { .fire-teaser { transition: none; } }
}
@media (max-width: 359px) {
  .fire-teaser-title { font-size: 15px; }
  .fire-teaser-more { padding: 8px 10px !important; font-size: 13px !important; }
}

/* 22.10: по правилам dveri-tut - iOS не должен таскать страницу вбок из-за каруселей с выходом за край; clip не ломает sticky-шапку (в отличие от hidden) */
@media (max-width: 767px) {
  html, body { overflow-x: clip; overscroll-behavior-x: none; }
}
/* 23.10: сборка мебели - первый слайд на телефоне: исходник 1920x440 режет голову, берём ту же сцену целиком */
@media (max-width: 767px) {
  .page-sborka-mebeli .slider-toppage-area .slider-toppage-item:first-child { background-image: url("/images/sborka-mebeli.jpg") !important; background-size: cover !important; background-position: 50% 35% !important; }
}
/* 23.10: хлебные крошки на телефоне - в одну строку, длинное последнее звено обрезается многоточием */
@media (max-width: 767px) {
  .breadcrumb, [class*="breadcrumb"]:not(li):not(a) { flex-wrap: nowrap !important; white-space: nowrap; overflow: hidden; }
  .hr-intro .container { padding-top: 14px !important; }
}
.hr-intro + section .swipe-wrap { margin-top: 12px; }

/* 23.10: кнопка "Наверх" на телефоне - в правый нижний угол на уровень оранжевой кнопки звонка (была на 120px выше, картинка 90px) */
@media (max-width: 767px) {
  .to-top { right: 16px !important; bottom: 20px !important; width: 56px; height: 56px; border-radius: 50%; z-index: 990 !important;
    background: #FA8227 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 15l6-6 6 6' fill='none' stroke='%23fff' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 26px 26px no-repeat;
    box-shadow: 0 6px 16px rgba(250, 130, 39, 0.35); }
  .to-top img { display: none !important; }
  .to-top:active { background-color: #E06F17; }
}
/* 23.10: подписи цен (.tarif-mlabel, разметка inc-price-v2.php) по умолчанию скрыты; на телефоне их показывает mobile-content.css. На /lp/ контентные правки не подключаются - блок цен там прежний */
.tarif-table .tarif-mlabel { display: none; }

/* 29.10 (клиент): в мобильной шапке вместо корзины - письмо (тот же /sendmail/7214/, что на ПК) */
@media (max-width: 767px) {
  header .hdr-cart-col { display: none !important; }
  header .hdr-mail-col { display: block !important; order: 1; padding-left: 8px; padding-right: 0; }
  header .hdr-mail-col a { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; background: #F3EEEA; }
  header .hdr-mail-col img { width: 22px !important; height: 22px !important; mix-blend-mode: multiply; }
}
@media (max-width: 359px) {
  header .hdr-mail-col a { width: 36px; height: 36px; }
}