/* BUBUTS.PRO — общие правила новой адаптивности (переносная версия).
   Постраничные правила гибкой вёрстки Zero-блоков лежат в css/flow-*.css. */

/* элементы компактного меню скрыты, пока меню помещается в строку */
.site-burger, .site-nav-social { display: none; }

/* обёртки гибкой вёрстки Zero-блоков: на широком экране не влияют на исходную композицию */
.zf { display: contents; }

/* кнопка компактного меню (видна только при нехватке ширины, см. css/flow/*.css) */
.site-burger {
  width: 44px; height: 44px; padding: 0; margin: 0 -8px 0 8px;
  border: 0; background: transparent; cursor: pointer;
  flex-direction: column; align-items: center; justify-content: center; gap: 6px;
  -webkit-tap-highlight-color: transparent;
}
.site-burger span {
  display: block; width: 26px; height: 2px; border-radius: 1px; background: #025351;
  transition: transform .2s ease-in-out, opacity .2s ease-in-out;
}
.site-nav-open .site-burger span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
.site-nav-open .site-burger span:nth-child(2) { opacity: 0; }
.site-nav-open .site-burger span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }
.site-burger:focus-visible { outline: 2px solid #025351; outline-offset: 2px; border-radius: 4px; }
.site-nav-social ul { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; padding: 0; list-style: none; }
.site-nav-social li { margin: 0 !important; }
.site-nav-social a { display: block; }
html.site-nav-locked, html.site-nav-locked body { overflow: hidden; }

/* ===== Стандартные блоки Tilda ниже ширины десктопной сетки (1200px) =====
   Вместо ступеней Tilda 960/640/480: резиновая сетка + решения по ширине контейнера. */
@media (max-width: 1199.98px) {
  :root { --site-gutter: clamp(16px, 2.5vw, 20px); }
  .t-container { max-width: 100% !important; width: 100% !important; padding-left: 0 !important; padding-right: 0 !important; box-sizing: border-box; }
  /* контейнер для решений по ширине — сама запись (у .t1106 свой счётчик шагов, его не изолируем) */
  .t-rec:has(> .t1118), .t-rec:has(> .t1106), .t-rec:has(> .t857) { container-type: inline-size; }
  .t-col { margin-left: var(--site-gutter) !important; margin-right: var(--site-gutter) !important; box-sizing: border-box; max-width: none !important; }
  .t-col_12 { width: calc(100% - 2 * var(--site-gutter)) !important; }
  .t-col_6  { width: calc(50% - 2 * var(--site-gutter)) !important; }
  .t-col_4  { width: calc(33.333% - 2 * var(--site-gutter)) !important; }
  .t-col_3  { width: calc(25% - 2 * var(--site-gutter)) !important; }

  /* FAQ (T1118): две колонки -> одна, когда колонка уже ~360px */
  .t1118__trigger-button { padding-top: clamp(15px, 2.25vw, 27px) !important; padding-bottom: clamp(14px, 2.25vw, 27px) !important; }
  .t1118__textwrapper { padding-bottom: clamp(25px, 3.3vw, 40px) !important; }
  .t1118 .t-section__title { margin-bottom: clamp(20px, 3.3vw, 40px) !important; }
  @container (max-width: 859.98px) {
    .t1118 .t-col_6 { width: calc(100% - 2 * var(--site-gutter)) !important; float: none; display: block; }
    .t1118 .t-col + .t-col { margin-top: -1px !important; }
  }

  /* Этапы работы (T1106): 4 шага в строку -> вертикальный список с линией */
  .t1106 .t-container:not(.js-block-header) { display: flex; flex-wrap: wrap; }
  @container (max-width: 939.98px) {
    .t1106 .t-container { row-gap: 0 !important; }
    .t1106__col { width: calc(100% - 2 * var(--site-gutter)) !important; display: table !important; margin-top: 0 !important; }
    .t1106__line { display: none !important; }
    .t1106__line_mobile { position: absolute; left: 50%; top: 0; bottom: 0; transform: translateX(-50%); background-color: #DEDAD2; width: 2px; }
    .t1106__col:last-child .t1106__line_mobile { display: none; }
    .t1106__numberwrapper, .t1106__textwrapper { display: table-cell !important; vertical-align: top; padding-bottom: 40px; }
    .t1106__textwrapper { padding-left: 22px !important; }
    .t1106__col:last-child .t1106__numberwrapper, .t1106__col:last-child .t1106__textwrapper { padding-bottom: 0; }
    .t1106__title { margin-top: 0 !important; }
    .t1106__text { margin-top: 8px; }
  }

  /* Карточки (T857): 3 в строку -> 2 (если карточек чётное число) -> 1; без горизонтальной прокрутки */
  .t857 .t857__container {
    display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr));
    column-gap: calc(2 * var(--site-gutter)); row-gap: clamp(36px, 5vw, 60px);
    padding: 0 var(--site-gutter) !important; margin: 0 !important; max-width: 100% !important;
    overflow: visible !important; box-sizing: border-box;
  }
  .t857 .t857__col { width: auto !important; min-width: 0 !important; max-width: none !important; margin: 0 !important; padding: 0 !important; float: none; display: block; }
  .t857 .t857__scroll-icon-wrapper { display: none !important; }
  /* 3 карточки: 3 колонки, пока колонка не уже ~190px; затем одна колонка ограниченной ширины */
  @container (max-width: 679.98px) {
    .t857 .t857__container { grid-template-columns: minmax(0, 1fr); justify-items: start; }
    .t857 .t857__col { width: 100% !important; max-width: 520px !important; }
  }
  /* 6 карточек: 3 -> 2 -> 1 */
  @container (max-width: 819.98px) {
    .t857 .t857__container:has(> .t857__col:nth-child(4)) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .t857 .t857__container:has(> .t857__col:nth-child(4)) .t857__col { max-width: none !important; }
  }
  @container (max-width: 539.98px) {
    .t857 .t857__container:has(> .t857__col:nth-child(4)) { grid-template-columns: minmax(0, 1fr); }
  }
}
