/* =============================================================================
   Мобильная вёрстка публичной части — телефон (до 767.98px).

   Подключается после home-2026.css. Десктоп не трогаем: правила только
   внутри медиазапросов.

   Что здесь и почему:
   · поля по бокам 20px вместо 12px Bootstrap: текст и карточки не липнут
     к краю экрана (у Apple в системных приложениях — 16–20px);
   · карточки — единые скругления и внутренние поля, без рамок-«паспарту»;
   · гостиницы — горизонтальная лента с привязкой к краю вместо столбика
     из шести фотографий на 3300px, название и адрес видны сразу, а не
     только по наведению мыши, которого на телефоне нет;
   · форма обратной связи — карточка с равными полями.
   ========================================================================== */

@media (max-width: 767.98px) {
   :root { --gutter: 20px; }

   /* --- Поля по бокам ----------------------------------------------------- */

   .container,
   .container-fluid {
      padding-inline: var(--gutter);
   }

   /* Заголовки секций: чуть меньше воздуха снизу, выравнивание — по сетке. */
   .site-content .section-header { margin-bottom: 28px; }

   /* --- Сессии форума ----------------------------------------------------- */

   .sessions-2026__item {
      gap: 12px;
      padding: 16px 18px;
      border-radius: var(--r-md);
   }

   .sessions-2026__title { font-size: 1rem; line-height: 1.45; }

   .sessions-2026__topics { margin-top: 8px; font-size: 0.875rem; }

   /* --- Площадки ---------------------------------------------------------- */

   .venue-list .venue-item {
      padding: 16px 18px;
      border-radius: var(--r-md);
   }

   .venue-map,
   .venue-map iframe { border-radius: var(--r-md); }

   /* --- Обратная связь ---------------------------------------------------- */

   .contact-form-box {
      margin-top: 0;
      padding: 24px 20px;
      border-radius: var(--r-lg);
   }

   .contact-info-list { margin-top: 32px; }

   /* Контакты: тема отводила под каждую строку 40px снизу и 75px слева
      под круг в 50px — на телефоне два пункта одного человека занимали
      полэкрана. Уплотняем, оставляя цель нажатия ≥ 44px. */
   .contact-info-list .contact-topic + .contact-topic { margin-top: 28px !important; }
   .contact-info-list li { padding-left: 56px; margin-bottom: 12px; }
   .contact-info-list .icon-box { width: 40px; height: 40px; font-size: 1rem; }
   .contact-info-list .text-box p { margin-bottom: 0; font-size: 0.8125rem; color: var(--c-text-2); }
   .contact-info-list .text-box a {
      display: inline-flex;
      align-items: center;
      min-height: 44px;
      font-size: 1.0625rem;
      overflow-wrap: anywhere;
   }

   /* --- Партнёрские пакеты -------------------------------------------------- */

   /* Колонки страницы пакетов размечены с p-4: вместе с полями контейнера
      содержимое уезжало на 32px от края. Выравниваем по общим 20px. */
   .partnership-section .row > .p-4 { padding-inline: calc(var(--bs-gutter-x, 1.5rem) * 0.5) !important; }
   .partnership-section .packages-grid { padding-inline: 0; }

   /* --- Подвал ------------------------------------------------------------- */

   .site-footer__main { gap: 24px; }
}

/* Самые узкие телефоны (iPhone SE, 320px): поля чуть уже. */
@media (max-width: 359.98px) {
   :root { --gutter: 16px; }
   /* Логотип, кнопка и меню в одну строку на 320px. */
   .tj-header-area .header-button .btn { padding: 0 12px; font-size: 0.8125rem; }
}