/* mobile.css — мобильная версия ind-roof.ru (27.10.2026).
   Действует только на экранах уже 820px; на компьютере сайт не меняется. */
@media (max-width: 820px) {
  html { -webkit-text-size-adjust: 100%; }
  body { margin: 0; }
  #page, #header, #content, #contenttext, #leftpanel, .footer,
  .table_top, .table_content, .table_bottom { width: auto !important; max-width: 100%; float: none !important; }
  #page { padding: 0 10px; box-sizing: border-box; }

  /* шапка: картинка по ширине экрана, меню под ней */
  #header { height: auto !important; padding-top: 20.25%; background-size: 100% auto; background-position: center top; }
  #companyname { display: none; }
  #menu { position: static !important; display: flex; flex-wrap: wrap; justify-content: center; gap: 6px;
          padding: 10px 0 4px; font-size: 0 !important; text-align: center; }
  #menu a { font-size: 15px !important; padding: 8px 12px; background: #eef3fb; border-radius: 6px; text-decoration: none; }

  /* сначала текст страницы, потом список разделов */
  #content { display: flex; flex-direction: column; }
  #content > * { order: 1; }
  #leftpanel { order: 2; margin-top: 20px; }
  #content > .footer { order: 3; }
  .table_top { background: #eef3fb !important; border-radius: 8px 8px 0 0; height: auto !important; padding: 8px 0; }
  .table_content { background: #f7f9fc !important; border-radius: 0 0 8px 8px; padding: 6px 0 10px; }
  .table_bottom { display: none; }
  .table_text { margin: 0 12px !important; line-height: 2.2; }
  .table_text a, .table_text .news_more, .table_text .title_panel { font-size: 15px !important; }
  #header + br { display: none; }

  /* текст и ссылки крупнее */
  body, td, p, .body_text, #contenttext { font-size: 15px !important; line-height: 1.5; }
  a:link, a:visited, a:hover, a:active { font-size: inherit !important; }
  h1, .title_blue { font-size: 22px !important; line-height: 1.25; }
  h2 { font-size: 19px !important; }
  #contenttext p, #contenttext div { text-align: left !important; }

  /* картинки и таблицы по ширине экрана */
  img { max-width: 100% !important; height: auto !important; }
  table { max-width: 100% !important; }
  table[align="left"], table[align="right"] { float: none !important; width: auto !important; margin: 0 auto 12px !important; }
  #contenttext table { width: 100% !important; }
  .footer { height: auto !important; background: #6f8fc4 !important; padding: 10px; border-radius: 8px; margin-top: 16px; text-align: center; }
  iframe, embed, object, video { max-width: 100% !important; }
}