/* ==========================================================================
   Мобильные правки по итогам прогона сайта на ширине 390px (2026-10-10).
   Отдельный файл, чтобы не пересекаться с параллельными правками style.css.
   Tailwind (robin-tailwind.css) выводится в <head> последним — поэтому здесь
   селекторы с id / атрибутами: их специфичность выше одноклассовых утилит.
   ========================================================================== */

@media (max-width: 639px) {

	/* --- Главная, «Делегируйте задачи ROBIN» (#delegate) ---
	   Подписи «Закупки» (слева от бейджа) и «Административные процессы»
	   (справа) на телефоне вылезали за экран и давали горизонтальный скролл
	   страницы (ширина документа 492px при экране 390px). Переносим их над
	   бейджем (под ним — нижние бейджи) и прижимаем внутрь схемы. */
	#delegate span[class*="right-full"],
	#delegate span[class*="left-full"] {
		top: auto;
		bottom: 100%;
		margin: 0 0 6px;
		max-width: 90px;
		--tw-translate-y: 0;
	}
	#delegate span[class*="right-full"] { right: auto; left: -2px; }
	#delegate span[class*="left-full"] { left: auto; right: -2px; }

	/* --- Главная, «Автоматизация для каждого отдела» (#departments) ---
	   В две колонки по ~155px заголовки «Юридический», «Администрация» и
	   описания не помещались в карточку и вылезали за рамку. */
	#departments .robin-dept-card { padding: 16px 12px; }
	#departments .robin-dept-ico { width: 40px; height: 40px; }
	#departments .robin-dept-title {
		font-size: 15px;
		letter-spacing: -0.01em;
		overflow-wrap: break-word;
		hyphens: auto;
	}
	#departments .robin-dept-desc {
		margin-top: 6px;
		font-size: 12.5px;
		line-height: 1.45;
		overflow-wrap: break-word;
		hyphens: auto;
	}
	#departments .robin-dept-tasks { padding: 8px 12px; font-size: 13px; }

	/* --- Главная, «10 000+ автоматизированных процессов» + лента логотипов ---
	   Подпись (white-space: nowrap) съедала всю ширину, лента логотипов
	   сжималась в полоску в несколько px. На телефоне — подпись над лентой. */
	[data-logos] { flex-direction: column; }
	[data-logos] > div:first-child {
		border-right: 0;
		border-bottom: 1px solid #F6F3F1;
		padding: 18px 20px;
	}
	[data-logos] > .robin-logos-marquee { flex: none; width: 100%; }
	/* Секция с лентой стояла через ~350px пустоты после блока цифр
	   (py-20 своей секции + нижний отступ предыдущей). */
	.mx-auto:has(> [data-logos]) { padding-top: 24px; }

	/* --- Форма заявки «Подберём сценарий…» без левой колонки (/video/):
	   inline-стиль обнуляет боковые отступы — на телефоне поля и заголовок
	   прилипали к рамке карточки. */
	.robin-pick-leadform[style*="padding-left:0"] {
		padding-left: 18px !important;
		padding-right: 18px !important;
	}
}

@media (max-width: 1023px) {
	/* --- Форма заявки с колонкой шагов слева (/support/, /video/ и др.,
	   .robin-pick--lead). Правило двух колонок
	   «.robin-pick--lead .robin-pick-result» (2 класса) перебивало мобильное
	   «.robin-pick-result { 1 колонка }» (1 класс): на телефоне форма
	   сжималась до 135px справа от списка и вылезала за край. */
	.robin-pick--lead .robin-pick-result { grid-template-columns: minmax(0, 1fr); }
}