/* ==========================================================================
   Телефонная вёрстка (≤576px): правила, жившие в «Дополнительных стилях»
   Customizer (wp-custom-css) и перенесённые в тему 11.09.2026.

   Что изменилось при переносе:
   - всё, что ниже, раньше стояло в одном незакрытом @media (max-width: 576px)
     и де-факто действовало только на телефонах — так и оставлено;
   - убраны !important и мёртвые правила (битый селектор «> p», правила,
     которые тут же перекрывались следующими);
   - правила для бургер-меню ушли в header.css, к остальной шапке.

   Порядок подключения важен: файл идёт после style.css, industry.css и
   ui.css — селекторы .about .about__* той же специфичности, что и
   .about--centered .about__* в industry.css, и побеждают за счёт порядка,
   как побеждали стили Customizer (они печатались последними).
   ========================================================================== */

/* --- всегда --- */

/* Короткий вариант заголовка «О себе» показывается только на телефоне. */
.about-title-mobile {
	display: none;
}

/* Неразрывные обороты в тексте первого экрана наследуют цвет строки. */
.main-screen__text .mobile-nowrap {
	color: inherit;
}

@media (max-width: 576px) {
	/* --- первый экран главной --- */
	.main-screen__title {
		font-size: 1.4rem;
		line-height: 1.6;
	}

	.main-screen__header {
		margin-bottom: 1.5rem;
	}

	.main-screen__left {
		padding-bottom: 8rem;
	}

	/* переносы из макета и круглая кнопка-стрелка — только для desktop */
	.main-screen__text br,
	.main-screen__link {
		display: none;
	}

	.mobile-nowrap {
		white-space: nowrap;
	}

	/* --- портфолио на главной: только обложка и название --- */
	.portfolio .portfolio-card__text {
		display: none;
	}

	.portfolio .portfolio-card__desc {
		padding-bottom: 0.9375rem;
	}

	.portfolio .portfolio-card:not(:last-child) {
		margin-bottom: 1.75rem;
	}

	.portfolio .portfolio__block {
		min-height: auto;
	}

	/* одинаковая высота видео-обложек без обрезки кадра */
	.portfolio .portfolio-card__video .box {
		height: 16rem;
		aspect-ratio: auto;
	}

	.portfolio .portfolio-card__video video {
		object-fit: contain;
		object-position: center;
	}

	/* фон свободного поля — под цвет каждого кейса */
	.portfolio .portfolio__card--1 .portfolio-card__video .box {
		background: #265c38;
	}

	.portfolio .portfolio__card--2 .portfolio-card__video .box {
		background: #201a3f;
	}

	.portfolio .portfolio__card--3 .portfolio-card__video .box {
		background: #ce3032;
	}

	.portfolio .portfolio__card--4 .portfolio-card__video .box {
		background: #ffffff;
	}

	/* --- «О себе» (главная и отраслевые) --- */
	.about .about__title {
		font-size: 1.25rem;
		line-height: 1.2;
		letter-spacing: 0;
	}

	.about-title-desktop {
		display: none;
	}

	.about-title-mobile {
		display: block;
	}

	.about-title-mobile__accent {
		display: flex;
		align-items: center;
		justify-content: center;
		width: fit-content;
		height: 1.8rem;
		margin: 0.45rem auto 0;
		padding: 0 0.55rem;
		line-height: 1;
		color: #ffffff;
		background: var(--accent);
		border-radius: 50rem;
		white-space: nowrap;
	}

	.about .about__text {
		width: 100%;
		max-width: 22rem;
		margin: 0 auto;
		font-size: 1.05rem;
		line-height: 1.45;
		text-align: center;
		text-wrap: pretty;
	}

	.about .about__text br {
		display: none;
	}

	/* --- CTA «Давайте обсудим»: заголовок в одну строку, фото под ним --- */
	.request__text {
		padding-bottom: 245px; /* место под фото (.request__group) */
	}

	.request__text--top {
		width: 100%;
		flex-direction: row;
		flex-wrap: nowrap;
		align-items: center;
		gap: 6px;
		padding: 0 16px;
		box-sizing: border-box;
	}

	/* размер, при котором «ДАВАЙТЕ ОБСУДИМ» помещается в одну строку
	   со стандартными полями на 360–430px */
	.request__text--top > p {
		font-size: 1.35rem;
	}

	.request__text--bottom {
		display: none;
	}

	.request__group {
		top: 3.2rem;
	}

	.request__btn {
		position: relative;
		z-index: 2;
		margin-top: 24px;
	}

	/* --- футер: e-mail не переносится --- */
	.footer__mail,
	.footer__email,
	.contacts__mail,
	.contacts__email {
		white-space: nowrap;
	}
}