/* Мобильная версия (общая для всех страниц). Подключается последней и перекрывает стили страниц.
   Десктоп (шире 768px) этот файл почти не затрагивает. */

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

img {
  max-width: 100%;
}

@media (max-width: 768px) {
  body {
    overflow-x: hidden;
  }

  /* Окно-«браузер»: меньше полей по краям */
  body .browser {
    width: calc(100% - 16px) !important;
    max-width: none !important;
    margin: 8px auto !important;
    border-radius: 10px !important;
  }

  /* ===== ШАПКА: логотип и телефон в первой строке, ниже — надпись о 116-ФЗ и меню ===== */
  body .browser .navbar {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px 12px !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 14px 16px !important;
    overflow: visible !important;
  }

  body .browser .logo {
    order: 1 !important;
    flex: 0 1 auto !important;
    gap: 10px !important;
    min-width: 0 !important;
  }

  body .browser .logo-image {
    height: 38px !important;
    width: auto !important;
  }

  body .browser .logo-text {
    font-size: 16px !important;
  }

  body .browser .header-phone,
  body .browser .header-phone:link,
  body .browser .header-phone:visited {
    order: 2 !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
    font-family: TildaSans, Arial, sans-serif !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    color: #2f4d82 !important;
    text-decoration: none !important;
  }

  body .browser .law-text {
    order: 3 !important;
    flex: 1 1 100% !important;
    min-width: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    font-size: 12px !important;
    line-height: 1.35 !important;
    text-align: center !important;
  }

  body .browser .menu {
    order: 4 !important;
    flex: 1 1 100% !important;
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 6px 22px !important;
    margin: 0 !important;
    padding: 8px 0 0 !important;
    border-top: 1px solid #e3e7ec !important;
  }

  body .browser .menu li {
    white-space: nowrap !important;
  }

  body .browser .menu a,
  body .browser .menu a:link,
  body .browser .menu a:visited {
    display: inline-block !important;
    padding: 6px 0 !important;
    font-size: 16px !important;
  }

  /* Выравнивание по ширине на узком экране даёт «дыры» между словами */
  p {
    text-align: left;
  }

  .about-card p,
  .audit-info-card p,
  .automation-info-card p,
  .control-info-card p,
  .diagnostics-info-card p,
  .documentation-info-card p,
  .registration-info-card p,
  .seo-intro-card p,
  .seo-card p,
  .seo-consult-card p,
  .seo-mini-card p {
    text-align: left !important;
  }

  /* «О компании»: карточки не должны вылезать за экран */
  body .browser .about-card {
    grid-template-columns: auto minmax(0, 1fr) !important;
  }

  body .browser .about-card-head {
    max-width: none !important;
  }

  body .browser .about-card > :not(.about-card-icon):not(.about-card-head) {
    grid-column: 1 / -1 !important;
  }

  /* Форма заявки */
  body .request-inside {
    padding: 12px !important;
  }

  body .request-frame {
    padding: 24px 14px 28px !important;
  }

  .ppk-form__button {
    width: 100%;
    max-width: 320px;
  }

  /* Таблицы и длинные элементы не должны распирать страницу */
  body .browser table {
    display: block;
    max-width: 100%;
    overflow-x: auto;
  }
}

@media (max-width: 360px) {
  body .browser .logo-text {
    font-size: 14px !important;
  }

  body .browser .header-phone {
    font-size: 14px !important;
  }

  body .browser .menu {
    gap: 4px 16px !important;
  }
}