/* ===== Телефон (до 700 px): ленты со свайпом, свёрнутые длинные списки, нижняя панель действий.
   Разметка: [data-swipe] — лента, [data-more] — свёрнутый список; кнопки и панель добавляет mobile.js. ===== */

.swipe-nav, .m-more, .m-bar { display: none; }

@media (max-width: 700px) {
  :root { --body-size: 16px; }
  .section { padding: 56px 0; }
  .section__head { margin-bottom: 24px; gap: 14px; }
  .section__head h2 { font-size: clamp(28px, 8.4vw, 36px); }

  /* --- Hero: кнопки во всю ширину, под большой палец --- */
  .hero { padding-top: 28px; }
  .hero__actions, .why__cta { display: grid; grid-template-columns: 1fr; }
  .hero__actions .btn, .why__cta .btn { justify-content: center; min-height: 52px; }
  .hero__lead { margin-top: 16px; }
  .hero__actions { margin-top: 24px; }

  /* --- Лента: карточки листаются пальцем и встают по краю --- */
  [data-swipe] {
    display: flex !important; flex-direction: row; gap: 12px; position: relative;
    overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; overscroll-behavior-x: contain;
    margin-inline: calc(-1 * var(--gutter)); padding-inline: var(--gutter); scroll-padding-inline: var(--gutter);
    scrollbar-width: none; -webkit-overflow-scrolling: touch;
  }
  [data-swipe]::-webkit-scrollbar { display: none; }
  [data-swipe] > * { flex: 0 0 86%; min-width: 0; scroll-snap-align: start; scroll-snap-stop: always; }

  /* Навигация ленты: отрезки разметочной ленты + стрелки */
  .swipe-nav { display: flex; align-items: center; gap: 4px; margin-top: 14px; }
  .swipe-nav__dots { display: flex; flex: 1; gap: 0; min-width: 0; }
  .swipe-nav__dot { flex: 1; max-width: 44px; height: 32px; padding: 0 3px; border: 0; background: none; cursor: pointer; display: grid; align-items: center; }
  .swipe-nav__dot::before { content: ''; height: 4px; border-radius: 2px; background: color-mix(in srgb, currentColor 22%, transparent); transition: background-color .2s; }
  .swipe-nav__dot[aria-current="true"]::before { background: var(--tape); }
  .swipe-nav__count { font: 600 14px var(--f-display); font-variant-numeric: tabular-nums; color: var(--steel); padding: 0 6px; white-space: nowrap; }
  .section--ink .swipe-nav__count { color: var(--ink-muted); }
  .swipe-nav__btn {
    width: 44px; height: 44px; flex: none; display: grid; place-items: center; border-radius: 50%;
    border: 2px solid currentColor; background: none; color: inherit; cursor: pointer; transition: opacity .2s;
  }
  .swipe-nav__btn svg { width: 18px; height: 18px; }
  .swipe-nav__btn:disabled { opacity: .25; cursor: default; }
  .swipe-nav__dot:focus-visible, .swipe-nav__btn:focus-visible { outline: 3px solid var(--tape); outline-offset: 1px; }

  /* Продукты: стеллаж — лента полок на всю ширину экрана */
  .rack[data-swipe] { padding-block: 12px; border-radius: 0; align-items: stretch; }
  .rack[data-swipe] > .tile { flex-basis: 84%; min-height: 0; }
  .rack .tile:hover { transform: none; }
  .rack .tile__visual svg { max-height: 88px; }
  .rack .tile--wms2 .tile__visual svg { max-height: 120px; }
  .rack .tile--wms2 .tile__name { font-size: 44px; }
  .rack .tile--wms2 .tile__hl { display: none; }
  .rack .arch__list { display: none; }
  .rack .tile__more { font-size: 16px; padding-block: 8px 4px; }

  /* Отрасли: карточки */
  .sectors[data-swipe] > li { flex-basis: 72%; background: var(--panel); border: 0; border-top: 4px solid var(--tape); border-radius: 6px; padding: 16px 18px 18px; }

  /* Что это даёт складу: карточки на тёмном */
  .theses[data-swipe] > li { flex-basis: 80%; margin: 0; padding: 20px; background: color-mix(in srgb, var(--ink-fg) 6%, transparent); border-left: 0; border-top: 4px solid var(--tape); border-radius: 6px; }
  .theses strong { font-size: 17px; margin-bottom: 8px; }

  /* Шаги внедрения: сцена сверху, текст под ней */
  .steps[data-swipe] > .step { flex-basis: 88%; padding: 0; justify-content: flex-start; gap: 10px; }
  .steps[data-swipe] .step__scene { margin-bottom: 6px; }
  .steps[data-swipe] .step h3 { font-size: 24px; }
  .method__pre { margin-top: 28px; }

  /* Команда */
  .team[data-swipe] > .person { flex-basis: 82%; padding: 22px; }
  .person__photo { width: 96px; height: 96px; margin-bottom: 18px; }

  /* --- Свёрнутые списки --- */
  .m-more {
    display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 48px; margin-top: 12px;
    font: 600 15px var(--f-text); color: inherit; background: none; border: 2px dashed color-mix(in srgb, currentColor 35%, transparent); border-radius: 4px; cursor: pointer;
  }
  .m-more svg { width: 16px; height: 16px; transition: transform .2s; }
  .m-more[aria-expanded="true"] svg { transform: rotate(180deg); }
  .compare.is-clipped > .compare__row:nth-child(n+5) { display: none; }
  .principles dl.is-clipped > dt:nth-of-type(n+4), .principles dl.is-clipped > dd:nth-of-type(n+4) { display: none; }

  /* Сравнение: строка — карточка «было → стало», без узких колонок */
  .compare__row--head { display: none; }
  .compare__row { grid-template-columns: 1fr; gap: 6px; padding: 16px 0; }
  .compare__row > span:first-child { font: 600 17px var(--f-display); letter-spacing: -0.01em; margin-bottom: 2px; }
  .compare__row > span:nth-child(2), .compare__row > span:nth-child(3) { display: grid; grid-template-columns: 4.6em 1fr; gap: 10px; font-size: 15px; line-height: 1.5; }
  .compare__row > span:nth-child(2)::before, .compare__row > span:nth-child(3)::before { font: 700 11px/1.9 var(--f-display); letter-spacing: .04em; }
  .compare__row > span:nth-child(2)::before { content: 'Легаси'; color: var(--ink-muted); }
  .compare__row > span:nth-child(3)::before { content: 'WMS 2.0'; color: var(--tape); }

  /* --- Заявка: поля и кнопка во всю ширину --- */
  .lead { padding: 22px 18px; }
  .lead__send { justify-self: stretch; justify-content: center; min-height: 52px; }
  .contact__list a { display: inline-block; padding-block: 4px; }

  /* --- Нижняя панель действий: появляется после первого экрана, прячется у формы --- */
  .m-bar {
    display: grid; grid-template-columns: auto 1fr; gap: 8px; position: fixed; z-index: 4; left: 0; right: 0; bottom: 0;
    padding: 10px var(--gutter) calc(10px + env(safe-area-inset-bottom));
    background: color-mix(in srgb, var(--floor) 92%, transparent); backdrop-filter: blur(10px);
    border-top: 1px solid var(--line); transform: translateY(110%); transition: transform .25s cubic-bezier(.2,.8,.2,1);
  }
  .m-bar.is-on { transform: none; }
  .m-bar .btn { justify-content: center; min-height: 48px; }
  .m-bar__call { padding: 0 16px; }
  .m-bar__call svg { width: 18px; height: 18px; }
  body.has-mbar .foot { padding-bottom: calc(36px + 72px + env(safe-area-inset-bottom)); }
  /* в шапке кнопка заявки дублирует панель: оставляем логотип и меню */
  body.has-mbar .top__cta .btn--sm { display: none; }
}

@media (max-width: 700px) and (prefers-reduced-motion: reduce) {
  .m-bar { transition: none; }
  .swipe-nav__dot::before, .m-more svg { transition: none; }
}