/*
 * Адаптивная вёрстка поверх легаси style.css.
 * Десктоп (>= 1004px) не меняется: все правила ниже — только внутри media-запросов.
 *   768–1003px — планшет: две колонки, сайдбар уже, шапка без минимальной ширины;
 *   < 768px    — телефон: одна колонка, меню в выпадающей панели (.mnav), виджеты сайдбара под контентом.
 */

.mnav-toggle, .mnav-button, .mnav { display: none; }

/* ---------- планшет и телефон ---------- */
@media (max-width: 1003px) {
	body, .footer { min-width: 0; }

	/* Контент из редактора: картинки 500–920px, карта 600px, таблицы width="100%" с фиксированными ячейками */
	.services img, .lefttext img { max-width: 100%; height: auto; }
	.services iframe, .services video { max-width: 100%; }
	.services table { max-width: 100%; }
	.services input, .services textarea, .services select { max-width: 100%; box-sizing: border-box; }

	/* Верхнее меню: 6 пунктов должны поместиться в ~450px справа от логотипа */
	.nav { width: calc(100% - 72px); }
	.nav ul { margin: 0; padding: 0 0 0 6px; }
	.nav ul li { padding: 0 4px; margin: 0; }
	.nav ul li a, .nav ul li, .nav ul li a:hover, .nav ul li:hover { font-size: 14px; }
	.home { margin: 0; right: 42px; }
	.hederd { display: none; }
	.toph1 h1 { margin: 12px 20px 0 0; font-size: 21px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

	/* Синяя полоса: две колонки услуг занимают всё место; правый блок с «Всі послуги» не помещается —
	   на планшете он скрыт (та же ссылка есть в верхнем и боковом меню), на телефоне показан снова */
	.hederd1 { display: none; }
	.hedertextc { width: 44%; padding: 14px 5px 0 25px; height: 118px; background-position: 15px 21px; }
	.hederm1 { overflow: hidden; }

	.contentcolumn { margin-left: 230px; }
	.leftcolumn { width: 230px; }
	.main-left ul li { padding-left: 30px; }
	.lefttext { margin-left: 30px; }

	.formBrif { width: auto; max-width: 574px; }
	.formBrif input { width: 100% !important; box-sizing: border-box; }
	.formBrif .stylesOff input { width: auto !important; }
	.formBrif table:not(.stylesOff) { width: 100%; table-layout: fixed; }
	.formBrif textarea { width: 100% !important; box-sizing: border-box; }

	.answer { width: auto; }
	.ridsort { height: auto; overflow: hidden; padding-bottom: 5px; }
}

/* ---------- телефон ---------- */
@media (max-width: 767px) {
	body { font-size: 14px; line-height: 1.45; }

	/* Шапка: логотип 241x98 -> 157x64, справа «домой», «почта», кнопка меню */
	.heder { position: relative; margin-bottom: 0; }
	.logo { width: 157px; height: 64px; background-size: 157px 64px; z-index: 2; }
	.hederc { margin-left: 0; height: auto; }
	.hederd, .nav-wrap { display: none; }
	.hederm { height: auto; min-height: 64px; background: #fff url(/images/bg_top.gif) repeat-x; background-size: 1px 64px; }
	.home, .mail { top: 19px; }
	.home { right: 98px; }
	.mail { right: 62px; }
	.toph1 { margin: 0; padding: 64px 16px 0; }
	.toph1 h1 { margin: 10px 0; font-size: 20px; line-height: 1.25; white-space: normal; }
	.toph1 h1:empty { display: none; }

	.mnav-toggle { display: block; position: absolute; top: 12px; right: 12px; width: 40px; height: 40px; margin: 0; opacity: 0; z-index: 4; cursor: pointer; }
	.mnav-button { display: block; position: absolute; top: 12px; right: 12px; width: 40px; height: 40px; z-index: 3; border-radius: 4px; }
	.mnav-button span, .mnav-button span::before, .mnav-button span::after {
		position: absolute; left: 9px; width: 22px; height: 2px; background: #1967B9; content: ""; transition: transform .2s, background-color .2s;
	}
	.mnav-button span { top: 19px; }
	.mnav-button span::before { left: 0; top: -7px; }
	.mnav-button span::after { left: 0; top: 7px; }
	.mnav-toggle:focus-visible + .mnav-button { outline: 2px solid #1967B9; outline-offset: 2px; }
	.mnav-toggle:checked + .mnav-button span { background: transparent; }
	.mnav-toggle:checked + .mnav-button span::before { transform: translateY(7px) rotate(45deg); }
	.mnav-toggle:checked + .mnav-button span::after { transform: translateY(-7px) rotate(-45deg); }

	.mnav { position: absolute; top: 64px; left: 0; right: 0; z-index: 10; background: #fff; border-top: 1px solid #dfe7f0; box-shadow: 0 8px 16px rgba(0, 0, 0, .15); }
	.mnav-toggle:checked ~ .mnav { display: block; }
	.mnav ul { margin: 0; padding: 0; }
	.mnav li { border-bottom: 1px solid #eef2f6; }
	.mnav a, .mnav a:visited { display: block; padding: 12px 16px; color: #333; font: normal 17px Tahoma, Verdana, sans-serif; text-decoration: none; }
	.mnav li.active > a { color: #1967B9; font-weight: bold; }
	.mnav li li { border: 0; }
	.mnav li li a, .mnav li li a:visited { padding: 8px 16px 8px 36px; font-size: 15px; color: #555; }
	.mnav li li.active > a { color: #1967B9; }

	/* Синяя полоса: название + слоган + «Всі послуги»; колонки со ссылками скрыты (те же пункты есть в меню) */
	.heder1 { background: #255aa3 url(/images/bg_blue.gif) repeat-x; }
	.logo1 { position: relative; width: auto; height: auto; padding: 12px 16px 10px 66px; background: none; }
	.monitor { top: 0; left: 0; }
	.aist { position: static; margin: 0; font-size: 22px; }
	.hedertext { position: static; top: auto; padding: 4px 0 0; background: none; font-size: 12px; }
	.hederc1 { margin-left: 0; background: none; }
	.hederd1 { display: block; position: static; width: auto; height: auto; background: none; overflow: hidden; }
	.i_circ_arr a, .i_circ_arr a:hover { float: none; display: inline-block; width: auto; height: auto; margin: 0 0 12px 66px; padding: 2px 0 2px 30px; background-position: 0 1px; text-align: left; }
	.hederm1 { display: none; }
	.razd { height: 20px; background-size: 1px 20px; }
	.razdlft, .razdrgt { display: none; }

	/* Одна колонка: контент, затем виджеты сайдбара (новости, портфолио, форма) */
	.contentwrapper, .leftcolumn { float: none; width: auto; margin-left: 0; }
	.contentcolumn { margin-left: 0; }
	.innertube { margin: 0 16px 16px; }
	.main-left > ul { display: none; }
	.main-left > .line:first-of-type { display: none; }

	h1 { margin: 16px 0 0; font-size: 20px; }
	h2, h3 { margin: 10px 0 6px; font-size: 17px; }
	h3 { padding-left: 0; }
	.text, .divtext, .text b, .text span, .text li, .text li.img1, .text li.img2 { margin-right: 0; }
	.text li.flo { margin: 5px 0; }
	.divtext { margin-left: 0; }
	.contnavm, a.contnavm, .contnav { font-size: 17px; }

	/* Контент из редактора: таблицы раскладки и картинки с align=left/right складываем в колонку */
	.services table, .services tbody, .services tr, .services td { display: block; width: auto !important; }
	.services td { padding: 0 !important; }
	.services img[align], .services img[style*="float"] { float: none !important; display: block; margin: 0 auto 10px !important; }
	/* Чекбоксы брифа: пары «галочка — подпись», поле «Другие» (rowspan) — после всех пар */
	.services .stylesOff tbody { display: grid; grid-template-columns: auto 1fr; gap: 4px 6px; align-items: center; }
	.services .stylesOff tr { display: contents; }
	.services .stylesOff td[rowspan] { grid-column: 1 / -1; order: 1; }

	/* Формы: поля во всю ширину, подписи над полями */
	.formBrif { width: auto; }
	.formBrif input, .formBrif textarea, .services textarea, .services select,
	.services input[type="text"], .services input[type="email"], .services input:not([type]) { width: 100% !important; font-size: 16px; }
	.formBrif .stylesOff input { width: auto !important; }
	.feedback td div[style] { text-align: left !important; }
	.feedback tr[style*="height"] { display: none; }
	.services .feedback td { margin-bottom: 6px; }

	.leftanons { float: none; }
	.leftanons a { float: none; padding: 0; }
	.lefttext { margin: 0 0 15px; }
	.lefttext h3 { margin-top: 10px; }
	.i_circ_arr1 { margin-left: 0; }
	.answer { padding: 10px; }

	/* Портфолио: две карточки в ряд */
	.ridsort ul { float: none; width: auto; margin: 0; padding-left: 18px; }
	.sample { width: 50%; padding: 10px 5px 20px; box-sizing: border-box; height: 280px; }
	.sample .border, .sample .pic { width: auto; }

	/* Сайдбар-виджеты под контентом */
	.leftzem a { margin-left: 0; }
	.bigbor, .bor, input.bigbor { width: 100%; max-width: 360px; box-sizing: border-box; font-size: 16px; }

	/* Подвал: в столбик по центру */
	.footer { height: auto; padding: 16px 0; text-align: center; background-size: 20px 100%; }
	.futerlft, .futerrgt, .futerm { position: static; width: auto; height: auto; padding: 0; background: none; }
	.footer .hederc1 { margin-left: 0; background: none; }
	.footer address { float: none; padding: 6px 0; }
	.phone1 { float: none; margin: 6px auto; }
}