/**
 * Страница «О компании».
 *
 * reference: «TRIADA О компании». Все величины — общие токены темы;
 * собственных кеглей, цветов и отступов здесь не заводится.
 *
 * Сетки объявлены явно (`minmax(0, 1fr)`): неявная колонка `auto` не
 * сжимается уже́ содержимого и даёт горизонтальную прокрутку на узком
 * экране — эта ошибка на сайте уже была.
 */

/* --- Первый экран ---------------------------------------------------- */

.tri-co-hero__eyebrow {
	display: inline-block;
	font-size: var(--tri-fs-12-5);
	font-weight: var(--tri-fw-800);
	letter-spacing: var(--tri-ls-p0-08);
	text-transform: uppercase;
	color: var(--tri-color-muted-soft);
	margin-block-start: var(--tri-space-24);
}

.tri-co-hero__title {
	margin: var(--tri-space-12) 0 0;
	font-family: var(--tri-font-display);
	font-size: var(--tri-fs-44);
	line-height: var(--tri-lh-1-15);
	font-weight: var(--tri-fw-800);
	letter-spacing: var(--tri-ls-n0-028);
	color: var(--tri-color-ink);
	overflow-wrap: anywhere;
}

.tri-co-hero__lead {
	margin: var(--tri-space-16) 0 0;
	font-size: var(--tri-fs-17);
	line-height: var(--tri-lh-1-6);
	color: var(--tri-color-muted);
	max-width: 72ch;
}

.tri-co-hero__actions {
	margin-block-start: var(--tri-space-28);
	flex-wrap: wrap;
}

.tri-co-hero__media {
	margin-block-start: var(--tri-space-32);
	border-radius: var(--tri-radius-24);
	overflow: hidden;
}

.tri-co-hero__media img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	object-fit: cover;
}

.tri-co-hero__facts {
	list-style: none;
	margin: var(--tri-space-32) 0 0;
	padding: 0;
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--tri-space-16);
}

.tri-co-hero__fact {
	border: var(--tri-border-width) solid var(--tri-color-border);
	border-radius: var(--tri-radius-16);
	padding: var(--tri-space-20);
	background: var(--tri-color-white);
	min-width: 0;
}

.tri-co-hero__value {
	display: block;
	font-size: var(--tri-fs-24);
	font-weight: var(--tri-fw-800);
	color: var(--tri-color-navy);
}

.tri-co-hero__label {
	display: block;
	margin-block-start: var(--tri-space-4);
	font-size: var(--tri-fs-14);
	color: var(--tri-color-muted-soft);
}

/* --- Общие заголовки -------------------------------------------------- */

.tri-co-title {
	margin: 0;
	font-family: var(--tri-font-display);
	font-size: var(--tri-fs-32);
	line-height: var(--tri-lh-1-2);
	font-weight: var(--tri-fw-700);
	letter-spacing: var(--tri-ls-n0-022);
	color: var(--tri-color-ink);
	overflow-wrap: anywhere;
}

.tri-co-lead {
	margin: var(--tri-space-14) 0 0;
	font-size: var(--tri-fs-16-5);
	line-height: var(--tri-lh-1-6);
	color: var(--tri-color-muted);
	max-width: 72ch;
}

/* --- Миссия и ценности ------------------------------------------------ */

.tri-co-mission__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--tri-space-32);
}

.tri-co-mission__text,
.tri-co-mission__values {
	min-width: 0;
}

.tri-co-mission__note {
	margin: var(--tri-space-20) 0 0;
	font-size: var(--tri-fs-15-5);
	font-weight: var(--tri-fw-700);
	color: var(--tri-color-navy);
}

.tri-co-mission__values-title {
	margin: 0;
	font-size: var(--tri-fs-20);
	font-weight: var(--tri-fw-700);
	color: var(--tri-color-ink);
}

.tri-co-mission__list {
	list-style: none;
	margin: var(--tri-space-20) 0 0;
	padding: 0;
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--tri-space-16);
}

.tri-co-mission__card {
	border-radius: var(--tri-radius-16);
	padding: var(--tri-space-20);
	background: var(--tri-color-surface-edf2fd);
	min-width: 0;
}

.tri-co-mission__card-title {
	margin: 0;
	font-size: var(--tri-fs-16-5);
	font-weight: var(--tri-fw-700);
	color: var(--tri-color-navy);
}

.tri-co-mission__card-text {
	margin: var(--tri-space-8) 0 0;
	font-size: var(--tri-fs-14);
	line-height: var(--tri-lh-1-6);
	color: var(--tri-color-ink-secondary);
}

/* --- Наш путь --------------------------------------------------------- */

.tri-co-path__list {
	list-style: none;
	margin: var(--tri-space-28) 0 0;
	padding: 0;
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--tri-space-16);
}

.tri-co-path__step {
	border-inline-start: var(--tri-space-4) solid var(--tri-color-accent);
	padding-inline-start: var(--tri-space-16);
	min-width: 0;
}

.tri-co-path__year {
	display: block;
	font-size: var(--tri-fs-18);
	font-weight: var(--tri-fw-800);
	color: var(--tri-color-navy);
}

.tri-co-path__text {
	display: block;
	margin-block-start: var(--tri-space-4);
	font-size: var(--tri-fs-15-5);
	line-height: var(--tri-lh-1-6);
	color: var(--tri-color-ink-secondary);
}

.tri-co-path__note {
	margin: var(--tri-space-24) 0 0;
	font-size: var(--tri-fs-16-5);
	line-height: var(--tri-lh-1-6);
	color: var(--tri-color-muted);
	max-width: 72ch;
}

.tri-co-path__directions-title {
	margin: var(--tri-space-40) 0 0;
	font-size: var(--tri-fs-20);
	font-weight: var(--tri-fw-700);
	color: var(--tri-color-ink);
}

.tri-co-path__directions {
	list-style: none;
	margin: var(--tri-space-20) 0 0;
	padding: 0;
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--tri-space-16);
}

.tri-co-dir {
	border: var(--tri-border-width) solid var(--tri-color-border);
	border-radius: var(--tri-radius-16);
	background: var(--tri-color-white);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.tri-co-dir__media img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 3;
	object-fit: cover;
}

.tri-co-dir__body {
	padding: var(--tri-space-20);
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	min-width: 0;
}

.tri-co-dir__title {
	margin: 0;
	font-size: var(--tri-fs-18);
	font-weight: var(--tri-fw-700);
	color: var(--tri-color-navy);
	overflow-wrap: anywhere;
}

.tri-co-dir__text {
	margin: var(--tri-space-8) 0 0;
	font-size: var(--tri-fs-14);
	line-height: var(--tri-lh-1-6);
	color: var(--tri-color-ink-secondary);
}

.tri-co-dir__link {
	margin-block-start: auto;
	padding-block-start: var(--tri-space-16);
	font-size: var(--tri-fs-14);
	font-weight: var(--tri-fw-700);
	color: var(--tri-color-link-2a56b8);
	text-decoration: none;
}

/* --- Команда ---------------------------------------------------------- */

.tri-co-team__list {
	list-style: none;
	margin: var(--tri-space-28) 0 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--tri-space-16);
}

.tri-co-team__card {
	border: var(--tri-border-width) solid var(--tri-color-border);
	border-radius: var(--tri-radius-16);
	padding: var(--tri-space-16);
	background: var(--tri-color-white);
	min-width: 0;
}

.tri-co-team__photo {
	border-radius: var(--tri-radius-14);
	overflow: hidden;
	margin-block-end: var(--tri-space-12);
}

.tri-co-team__photo img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 1 / 1;
	object-fit: cover;
}

.tri-co-team__name {
	display: block;
	font-size: var(--tri-fs-15-5);
	font-weight: var(--tri-fw-700);
	color: var(--tri-color-navy);
	overflow-wrap: anywhere;
}

.tri-co-team__role {
	display: block;
	margin-block-start: var(--tri-space-4);
	font-size: var(--tri-fs-14);
	color: var(--tri-color-muted-soft);
}

.tri-co-team__departments-title {
	margin: var(--tri-space-40) 0 0;
	font-size: var(--tri-fs-20);
	font-weight: var(--tri-fw-700);
	color: var(--tri-color-ink);
}

.tri-co-team__departments {
	list-style: none;
	margin: var(--tri-space-20) 0 0;
	padding: 0;
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--tri-space-12);
}

.tri-co-team__department {
	display: flex;
	align-items: center;
	gap: var(--tri-space-12);
	border-radius: var(--tri-radius-14);
	padding: var(--tri-space-12) var(--tri-space-16);
	background: var(--tri-color-surface-edf2fd);
	min-width: 0;
}

.tri-co-team__abbr {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--tri-space-40);
	height: var(--tri-space-40);
	border-radius: var(--tri-radius-circle);
	background: var(--tri-color-navy);
	color: var(--tri-color-white);
	font-size: var(--tri-fs-12-5);
	font-weight: var(--tri-fw-800);
}

.tri-co-team__department-title {
	font-size: var(--tri-fs-15-5);
	color: var(--tri-color-ink);
	min-width: 0;
	overflow-wrap: anywhere;
}

/* --- Проекты ---------------------------------------------------------- */

.tri-co-projects__regions {
	list-style: none;
	margin: var(--tri-space-28) 0 0;
	padding: 0;
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--tri-space-12);
}

.tri-co-projects__region {
	border-inline-start: var(--tri-space-4) solid var(--tri-color-navy);
	padding-inline-start: var(--tri-space-16);
	min-width: 0;
}

.tri-co-projects__region-name {
	display: block;
	font-size: var(--tri-fs-15-5);
	font-weight: var(--tri-fw-700);
	color: var(--tri-color-navy);
}

.tri-co-projects__region-text {
	display: block;
	margin-block-start: var(--tri-space-4);
	font-size: var(--tri-fs-14);
	color: var(--tri-color-muted-soft);
}

.tri-co-projects__list {
	list-style: none;
	margin: var(--tri-space-28) 0 0;
	padding: 0;
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--tri-space-24);
}

.tri-co-case {
	border: var(--tri-border-width) solid var(--tri-color-border);
	border-radius: var(--tri-radius-16);
	background: var(--tri-color-white);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.tri-co-case__media img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	object-fit: cover;
}

.tri-co-case__body {
	padding: var(--tri-space-24);
	min-width: 0;
}

.tri-co-case__tag {
	font-size: var(--tri-fs-12-5);
	font-weight: var(--tri-fw-800);
	letter-spacing: var(--tri-ls-p0-08);
	text-transform: uppercase;
	color: var(--tri-color-muted-soft);
}

.tri-co-case__title {
	margin: var(--tri-space-8) 0 0;
	font-size: var(--tri-fs-18);
	line-height: var(--tri-lh-1-3);
	font-weight: var(--tri-fw-700);
	overflow-wrap: anywhere;
}

.tri-co-case__link {
	color: var(--tri-color-ink);
	text-decoration: none;
}

.tri-co-case__link:hover,
.tri-co-case__link:focus-visible {
	color: var(--tri-color-link-2a56b8);
}

.tri-co-case__text {
	margin: var(--tri-space-12) 0 0;
	font-size: var(--tri-fs-15-5);
	line-height: var(--tri-lh-1-6);
	color: var(--tri-color-ink-secondary);
}

.tri-co-case__result {
	margin: var(--tri-space-12) 0 0;
	font-size: var(--tri-fs-14);
	font-weight: var(--tri-fw-700);
	color: var(--tri-color-navy);
}

/* --- Клиенты ---------------------------------------------------------- */

.tri-co-clients__list {
	list-style: none;
	margin: var(--tri-space-28) 0 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--tri-space-16);
	align-items: center;
}

.tri-co-clients__item {
	display: flex;
	align-items: center;
	justify-content: center;
	border: var(--tri-border-width) solid var(--tri-color-border);
	border-radius: var(--tri-radius-14);
	padding: var(--tri-space-16);
	background: var(--tri-color-white);
	min-width: 0;
	min-height: var(--tri-space-72);
}

.tri-co-clients__item img {
	max-width: 100%;
	height: auto;
	display: block;
}

/* --- Документы -------------------------------------------------------- */

.tri-co-licenses__list {
	list-style: none;
	margin: var(--tri-space-28) 0 0;
	padding: 0;
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--tri-space-16);
}

.tri-co-licenses__card {
	border: var(--tri-border-width) solid var(--tri-color-border);
	border-radius: var(--tri-radius-16);
	padding: var(--tri-space-20);
	background: var(--tri-color-white);
	min-width: 0;
}

.tri-co-licenses__scan {
	border-radius: var(--tri-radius-10);
	overflow: hidden;
	margin-block-end: var(--tri-space-16);
	background: var(--tri-color-surface-edf2fd);
}

.tri-co-licenses__scan img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 3 / 4;
	object-fit: cover;
}

.tri-co-licenses__title {
	margin: 0;
	font-size: var(--tri-fs-15-5);
	font-weight: var(--tri-fw-700);
	color: var(--tri-color-navy);
	overflow-wrap: anywhere;
}

.tri-co-licenses__issuer {
	margin: var(--tri-space-4) 0 0;
	font-size: var(--tri-fs-14);
	color: var(--tri-color-muted-soft);
}

/* --- Заявка ----------------------------------------------------------- */

/* Содержимое поверх фона: фон и вуаль объявлены absolute. */
/* --- Широкие экраны --------------------------------------------------- */

@media (min-width: 768px) {
	.tri-co-hero__facts,
	.tri-co-mission__list,
	.tri-co-path__list,
	.tri-co-path__directions,
	.tri-co-projects__regions,
	.tri-co-projects__list,
	.tri-co-licenses__list,
	.tri-co-team__departments {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.tri-co-team__list,
	.tri-co-clients__list {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

@media (min-width: 1024px) {
	.tri-co-mission__grid {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
		gap: var(--tri-space-48);
	}

	.tri-co-hero__facts,
	.tri-co-mission__list,
	.tri-co-path__list {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.tri-co-path__directions,
	.tri-co-projects__list,
	.tri-co-projects__regions {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.tri-co-team__list {
		grid-template-columns: repeat(6, minmax(0, 1fr));
	}

	.tri-co-licenses__list {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.tri-co-clients__list {
		grid-template-columns: repeat(8, minmax(0, 1fr));
	}

}
